open-index/open-npm huggingface dataset:
npm package: @sku-lib/codemod
Description: Codemods for sku
Author: SEEK
Latest version: 1.3.0

[![npm](https://img.shields.io/npm/v/sku-codemod.svg?style=flat-square)](https://www.npmjs.com/package/sku-codemod)

# Codemods for `sku`

## Usage

```sh
pnpm dlx @sku-lib/codemod <codemod> [path] [options]
```

If you don't specify the `codemod` the CLI will prompt you with a list of available codemods.

If you don't specify a `path` the CLI will prompt you to enter a path to a directory to run the codemod on.
The default path is `'.'`.

## Available codemods

| Codemod                   | Description                                                                            |
| ------------------------- | -------------------------------------------------------------------------------------- |
| `transform-vite-loadable` | Converts `sku/@loadable/component` imports to `@sku-lib/vite/loadable` imports.        |
| `jest-to-vitest`          | Converts usage of Jest APIs to Vitest APIs.                                            |
| `svg-import-query-param`  | Converts `import svg from './file.svg'` imports to `import svg from './file.svg?raw'`. |

## Options

| Option        | Description                                                         |
| ------------- | ------------------------------------------------------------------- |
| `-d, --dry`   | Show which files would be modified without actually modifying them. |
| `-p, --print` | Print out the changes made to each file.                            |
| `-h, --help`  | Show help information.                                              |

## Contributing

Refer to [CONTRIBUTING.md](/CONTRIBUTING.md).

## License

MIT License
npm package: @skuhnow/directus-cli
Description: The official Directus CLI
Author: João Biondo
Latest version: 9.14.4

# Directus CLI

The official Directus CLI tool. Allows you to connect to, and manage, any given Directus instance through the command
line interface.

## Installation

```
npm install -g @skuhnow/directus-cli
```

## Usage

```sh
$ directusctl --help
```

## Docs

See [the docs](https://docs.directus.io/reference/cli/)
npm package: @skuhnow/directus-drive
Description: Flexible and Fluent way to manage storage in Node.js.
Latest version: 9.14.4

# @skuhnow/directus-drive

Object storage abstraction layer.

## Credits

This package started life as a fork of [`@slynova/flydrive`](https://github.com/slynova-org/flydrive) by Robin Grundvåg
<robgru52@gmail.com>.
npm package: @skuhnow/directus-format-title
Description: Custom string formatter that converts any string into [Title Case](http://www.grammar-monster.com/lessons/capital_letters_title_case.htm)
Author: rijkvanzanten
Latest version: 9.14.4

## Title Formatter

Custom string formatter that converts any string into
[Title Case](http://www.grammar-monster.com/lessons/capital_letters_title_case.htm)

This package converts any string into title case. This means only using capital letters for the principal words.
Articles, conjunctions, and prepositions do not get capital letters unless they start or end the title

| input                        | output                          |
| ---------------------------- | ------------------------------- |
| `snowWhiteAndTheSevenDwarfs` | Snow White and the Seven Dwarfs |
| `NewcastleUponTyne`          | Newcastle upon Tyne             |
| `brighton_on_sea`            | Brighton on Sea                 |
| `apple_releases_new_ipad`    | Apple Releases New iPad         |
| `7-food-trends`              | 7 Food Trends                   |

> The package contains a list of words that use some sort of special casing, for example: McDonalds, iPhone, and
> YouTube.

## Installation

```bash
$ npm install @skuhnow/directus-format-title
```

## Usage

The package by default converts camelCase, PascalCase, underscore, and "regular" sentences to
[Title Case](http://www.grammar-monster.com/lessons/capital_letters_title_case.htm)

```js
formatTitle(string, [separator]);

formatTitle('snowWhiteAndTheSevenDwarfs');
// => Snow White and the Seven Dwarfs
```

You can provide an optional `separator` regex as a second parameter to support splitting the string on different
characters. By default, this regex is set to `/\s|-|_/g`.

## Contributing

If your favorite specially cased word isn't being capitalized properly,
[please open an issue](https://github.com/directus/format-title/issues/new) or submit a pull request!
npm package: @skuhnow/directus-sdk
Description: The official Directus SDK for use in JavaScript!
Author: Rijk van Zanten
Latest version: 9.14.4

# Directus JS SDK

## Installation

```
npm install @skuhnow/directus-sdk
```

## Usage

```js
import { Directus } from '@skuhnow/directus-sdk';

const directus = new Directus('http://directus.example.com');

const items = await directus.items('articles').readOne(15);
console.log(items);
```

```js
import { Directus } from '@skuhnow/directus-sdk';

const directus = new Directus('http://directus.example.com');

directus
	.items('articles')
	.readOne(15)
	.then((item) => {
		console.log(item);
	});
```

## Docs

See [the docs](https://docs.directus.io/reference/sdk/)
npm package: @skuhnow/v3admin-demo
Description: This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
Latest version: 0.0.1-alpha.5

# Vue 3 + Vite

This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.

## Recommended IDE Setup

- [VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar)
npm package: @skui/appwindow
Description: Svelte KaiOS UI - AppWindow
Author: Wouter van der Wal
Latest version: 0.2.2

# @skui/appWindow

The base of any page

## Index

- [Basic usage](#basic-usage)
- [Props](#props)

## Basic usage

This is a basic example how this component is used

```svelte
<script lang="ts">
  import { AppWindow } from "@skui/appwindow";
  import { Header } from "@skui/header";
  import { List } from "@skui/list";
  import { ORANGE } from "@skui/style";
  import { SoftwareKey } from "@skui/softwarekey";
</script>

<AppWindow>
  <Header color={ORANGE}>
    <h1>Home</h1>
  </Header>

  <List />

  <SoftwareKey>
    <h5 slot="left">Left</h5>
    <h5 slot="center">Select</h5>
    <h5 slot="right">Right</h5>
  </SoftwareKey>
</AppWindow>
```

![Example](https://github.com/wjtje/svelte-kaios/raw/main/packages/appWindow/screenshots/example.png)

## Props

> This component doesn't have any props

## License

MIT License

Copyright (c) 2021 Wouter van der Wal
npm package: @skui/header
Description: Svelte KaiOS UI - Header
Author: Wouter van der Wal
Latest version: 0.2.2

# @skui/header

## Index

- [Basic usage](#basic-usage)
- [Props](#props)

## Basic usage

This is a basic example how this component is used

```svelte
<script lang="ts">
  import { Header } from "@skui/header";
  import { ORANGE } from "@skui/style";
</script>

<Header color={ORANGE}>
  <h1>Home</h1>
</Header>
```

![Example](https://github.com/wjtje/svelte-kaios/raw/main/packages/header/screenshots/example.png)

## Props

| Name  | Type                                                                                 | Description                                                    | Documentation                                                                         |
| ----- | ------------------------------------------------------------------------------------ | -------------------------------------------------------------- | ------------------------------------------------------------------------------------- |
| color | [KaiOS_color](https://github.com/wjtje/svelte-kaios/tree/main/packages/types#readme) | This defines the background and foreground color of the header | [@skui/styles](https://github.com/wjtje/svelte-kaios/tree/main/packages/style#colors) |

## License

MIT License

Copyright (c) 2021 Wouter van der Wal
npm package: @skui/separator
Description: Svelte KaiOS UI - Separator
Author: Wouter van der Wal
Latest version: 0.2.2

# @skui/separator

Easily create categories inside a list

## Index

- [Basic usage](#basic-usage)
- [Props](#props)

## Basic usage

This is a basic example how this component is used

```svelte
<script lang="ts">
  import { Separator } from "@skui/separator";
</script>

<Separator title="Subtitle" />
```

![Example](https://github.com/wjtje/svelte-kaios/raw/main/packages/separator/screenshots/example.png)

## Props

| Name  | Type   | Description                              |
| ----- | ------ | ---------------------------------------- |
| title | string | The title displayed inside the separator |

## License

MIT License

Copyright (c) 2021 Wouter van der Wal
npm package: @skui/softwarekey
Description: Svelte KaiOS UI - SoftwareKey
Author: Wouter van der Wal
Latest version: 0.2.2

# @skui/softwareKey

## Index

- [Basic usage](#basic-usage)
- [Props](#props)
- [Handle events](#handle-events)

## Basic usage

```svelte
<script lang="ts">
  import { SoftwareKey } from "@skui/softwarekey";
</script>

<SoftwareKey>
  <h5 slot="left">Options</h5>
  <h5 slot="center">Select</h5>
  <h5 slot="right">Back</h5>
</SoftwareKey>
```

![Example](https://github.com/wjtje/svelte-kaios/raw/main/packages/header/softwareKey/example.png)

## Props

| Name          | Type                           | Description                                                  |
| ------------- | ------------------------------ | ------------------------------------------------------------ |
| onLeftClick   | (event: KeyboardEvent) => void | The function is run whenever the left key has been pressed   |
| onRightClick  | (event: KeyboardEvent) => void | The function is run whenever the right key has been pressed  |
| onCenterClick | (event: KeyboardEvent) => void | The function is run whenever the center key has been pressed |
| onBackClick   | (event: KeyboardEvent) => void | The function is run whenever the back key has been pressed   |

## Handle events

You have two options of reacting to keyboard event, the first option is to change the softKeyActions context.

```svelte
<script lang="ts">
  import { getContext, onMount } from "svelte";
  import type { Writable } from "svelte/store";
  import type { softwareKeyFunctions } from "@skui/types";

  const softKeyActionsWritable =
    getContext<Writable<softwareKeyFunctions>>("softKeyActions");

  onMount(() => {
    softKeyActionsWritable.update((current) => ({
      ...current,
      center: (event) => {
        console.log("Handle center button press");
      },
    }));
  });
</script>
```

The other options is to define the props on the component

```svelte
<script lang="ts">
  import { SoftwareKey } from "@skui/softwarekey";
</script>

<SoftwareKey
  onCenterClick={(event) => {
    console.log("Handle center button press");
  }}
>
  <h5 slot="left">Options</h5>
  <h5 slot="center">Select</h5>
  <h5 slot="right">Back</h5>
</SoftwareKey>
```

## License

MIT License

Copyright (c) 2021 Wouter van der Wal
npm package: @skui/types
Description: Svelte KaiOS UI - Types
Author: Wouter van der Wal
Latest version: 0.2.2

# @skui/types

## Index

- [softwareKeyFunctions](#softwarekeyfunctions)
- [KaiOS_color](#kaios_color)

## softwareKeyFunctions

```ts
interface softwareKeyFunctions {
  left: (event: KeyboardEvent) => void;
  center: (event: KeyboardEvent) => void;
  right: (event: KeyboardEvent) => void;
  back: (event: KeyboardEvent) => void;
}
```

## KaiOS_color

```ts
type KaiOS_color = [string, string];
```

## License

MIT License

Copyright (c) 2021 Wouter van der Wal
npm package: @skulljs/angular-loader
Description: Loader for skulljs's angular component
Latest version: 20.1.0

# [skulljs] [20.1.0] angular loader

Loader for skulljs's angular component

## Documentation

See our [documentation](https://skulljs.github.io)

## Changelog

See [CHANGELOG.md](CHANGELOG.md)

## Author(s)

- **Florent SIMONET** _alias_ [@SFlorent](https://github.com/SFlorent)
- **Sébastien FOUCHEUR** _alias_ [@Sfoucheur](https://github.com/Sfoucheur)

## Licence

This project is under `MIT License` - see [LICENSE.md](LICENSE.md) for more informations

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
npm package: @skulljs/angular-scroll-to-top-btn
Description: Scroll to top button for skulljs's angular component
Latest version: 20.1.0

# [skulljs] [20.1.0] angular scroll to top btn

Scroll to top button for skulljs's angular component

## Documentation

See our [documentation](https://skulljs.github.io)

## Changelog

See [CHANGELOG.md](CHANGELOG.md)

## Author(s)

- **Florent SIMONET** _alias_ [@SFlorent](https://github.com/SFlorent)
- **Sébastien FOUCHEUR** _alias_ [@Sfoucheur](https://github.com/Sfoucheur)

## Licence

This project is under `MIT License` - see [LICENSE.md](LICENSE.md) for more informations

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
npm package: @skulljs/cli
Description: CLI of skulljs
Latest version: 1.10.0

# [skulljs] [1.10.0] skulljs-cli

CLI of skulljs

## Documentation

See our [documentation](https://skulljs.github.io)

## Changelog

See [CHANGELOG.md](CHANGELOG.md)

## Author(s)

- **Florent SIMONET** _alias_ [@SFlorent](https://github.com/SFlorent)
- **Sébastien FOUCHEUR** _alias_ [@Sfoucheur](https://github.com/Sfoucheur)

## Licence

This project is under `MIT License` - see [LICENSE.md](LICENSE.md) for more informations

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)