open-index/open-npm huggingface dataset:
npm package: @nkyo/scenify-sdk
Description: _Warning: this project is not production ready, API might change without notice._
Author: NK
Latest version: 0.3.6

# Scenify SDK

_Warning: this project is not production ready, API might change without notice._

Scenify SDK is available on npm as @scenify/sdk. This single package contains all components required to build a design editor.

```sh
# using yarn
yarn add @nkyo/scenify-sdk

# using npm
npm install @nkyo/scenify-sdk
```
npm package: @nkzawa/now-node-raw
Description: Set up your `now.json` like:
Latest version: 0.1.1

# now-node-raw

Set up your `now.json` like:

```json
{
  "builds": [
    {
      "src": "foo/index.js",
      "use": "@nkzawa/now-node-raw",
      "config": {
        "includeFiles": [
          "node_modules/bar/**"
        ],
        "maxLambdaSize": "50mb",
        "runtime": "nodejs10.x"
      }
    }
  ]
}
```
npm package: @nkzd/cra-story
Description: Dok se Devic sunca u Neumu ja mrcim paket
Author: Aljosa Vukotic
Latest version: 0.7.0

This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).

## Available Scripts

In the project directory, you can run:

### `yarn start`

Runs the app in the development mode.<br />
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.

The page will reload if you make edits.<br />
You will also see any lint errors in the console.

### `yarn test`

Launches the test runner in the interactive watch mode.<br />
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.

### `yarn build`

Builds the app for production to the `build` folder.<br />
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.<br />
Your app is ready to be deployed!

See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.

### `yarn eject`

**Note: this is a one-way operation. Once you `eject`, you can’t go back!**

If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.

Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.

You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.

## Learn More

You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).

To learn React, check out the [React documentation](https://reactjs.org/).

### Code Splitting

This section has moved here: https://facebook.github.io/create-react-app/docs/code-splitting

### Analyzing the Bundle Size

This section has moved here: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size

### Making a Progressive Web App

This section has moved here: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app

### Advanced Configuration

This section has moved here: https://facebook.github.io/create-react-app/docs/advanced-configuration

### Deployment

This section has moved here: https://facebook.github.io/create-react-app/docs/deployment

### `yarn build` fails to minify

This section has moved here: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify
npm package: @nkzd/learnstorybook-design-system
Description: Learn Storybook design system
Author: Test author
Latest version: 0.1.0

# The Learn Storybook design system

The Learn Storybook design system is a subset of the full [Storybook design system](https://github.com/storybookjs/design-system/), created as a learning resource for those interested in learning how to write and publish a design system using best in practice techniques.

Learn more at [Learn Storybook](https://learnstorybook.com).
npm package: @nkzd/my-fancy-ui
Description: my-fancy-ui React component
Latest version: 1.0.0

# my-fancy-ui

[![Travis][build-badge]][build]
[![npm package][npm-badge]][npm]
[![Coveralls][coveralls-badge]][coveralls]

Describe my-fancy-ui here.

[build-badge]: https://img.shields.io/travis/user/repo/master.png?style=flat-square
[build]: https://travis-ci.org/user/repo

[npm-badge]: https://img.shields.io/npm/v/npm-package.png?style=flat-square
[npm]: https://www.npmjs.org/package/npm-package

[coveralls-badge]: https://img.shields.io/coveralls/user/repo/master.png?style=flat-square
[coveralls]: https://coveralls.io/github/user/repo
npm package: @nkzhangsn/fetch-intercept-isolate
Description: Interceptor library for the native fetch command inspired by angular http intercepts.
Author: Malte Legenhausen
Latest version: 2.4.4

# fetch-intercept

[![Build Status](https://travis-ci.org/werk85/fetch-intercept.svg?branch=master)](https://travis-ci.org/werk85/fetch-intercept)

Interceptor library for the native fetch command inspired by [angular http interceptors](https://docs.angularjs.org/api/ng/service/$http).

`fetch-intercept` monkey patches the global `fetch` method and allows you the usage in Browser, Node and Webworker environments.

## Installation

```
npm install fetch-intercept --save
```

## Usage

_Note_: You need to require `fetch-intercept` before you use `fetch` the first time.

Make sure you have a `fetch` [compatible environment](http://caniuse.com/#search=fetch) or added a [appropriate polyfill](https://github.com/github/fetch).

```js
import fetchIntercept from 'fetch-intercept';

const unregister = fetchIntercept.register({
    request: function (url, config) {
        // Modify the url or config here
        return [url, config];
    },

    requestError: function (error) {
        // Called when an error occured during another 'request' interceptor call
        return Promise.reject(error);
    },

    response: function (response) {
        // Modify the reponse object
        return response;
    },

    responseError: function (error) {
        // Handle an fetch error
        return Promise.reject(error);
    }
});

// Call fetch to see your interceptors in action.
fetch('http://google.com');

// Unregister your interceptor
unregister();
```

## React-Native Compatibility
Support react-native `0.17` or higher versions.

## License
MIT
npm package: @nkzn/remix-auth-supabase
Description: > A template for creating a new Remix Auth strategy.
Latest version: 0.0.0-build.1

# Remix Auth - Strategy Template

> A template for creating a new Remix Auth strategy.

If you want to create a new strategy for Remix Auth, you could use this as a template for your repository.

The repo installs the latest version of Remix Auth and do the setup for you to have tests, linting and typechecking.

## How to use it

1. In the `package.json` change `name` to your strategy name, also add a description and ideally an author, repository and homepage keys.
2. In `src/index.ts` change the `MyStrategy` for the strategy name you want to use.
3. Implement the strategy flow inside the `authenticate` method. Use `this.success` and `this.failure` to correctly send finish the flow.
4. In `tests/index.test.ts` change the tests to use your strategy and test it. Inside the tests you have access to `jest-fetch-mock` to mock any fetch you may need to do.
5. Once you are ready, set the secrets on Github
   - `NPM_TOKEN`: The token for the npm registry
   - `GIT_USER_NAME`: The git username you want the bump workflow to use in the commit.
   - `GIT_USER_EMAIL`: The email you want the bump workflow to use in the commit.

## Scripts

- `build`: Build the project for production using the TypeScript compiler (strips the types).
- `typecheck`: Check the project for type errors, this also happens in build but it's useful to do in development.
- `lint`: Runs ESLint against the source codebase to ensure it pass the linting rules.
- `test`: Runs all the test using Jest.

## Documentations

To facilitate creating a documentation for your strategy, you can use the following Markdown

```markdown
# Strategy Name

<!-- Description -->

## Supported runtimes

| Runtime    | Has Support |
| ---------- | ----------- |
| Node.js    | ✅          |
| Cloudflare | ✅          |

<!-- If it doesn't support one runtime, explain here why -->

## How to use

<!-- Explain how to use the strategy, here you should tell what options it expects from the developer when instantiating the strategy -->
```
npm package: @nkzq/install-pkg
Description: Install package programmatically.
Author: Anthony Fu
Latest version: 1.1.2

# install-pkg

[![NPM version](https://img.shields.io/npm/v/@antfu/install-pkg?color=a1b858&label=)](https://www.npmjs.com/package/@antfu/install-pkg)

Install package programmatically. Detect package managers automatically (`npm`, `yarn`, `bun` and `pnpm`).

```bash
npm i @antfu/install-pkg
```

```ts
import { installPackage } from '@antfu/install-pkg'

await installPackage('vite', { silent: true })
```

## Sponsors

<p align="center">
  <a href="https://cdn.jsdelivr.net/gh/antfu/static/sponsors.svg">
    <img src='https://cdn.jsdelivr.net/gh/antfu/static/sponsors.svg'/>
  </a>
</p>

## License

[MIT](./LICENSE) License © 2021 [Anthony Fu](https://github.com/antfu)
npm package: @nkzw/copy-as-markdown
Description: A React hook to copy text as Markdown.
Author: Christoph Nakazawa
Latest version: 2.0.3

# copy-as-markdown

A React hook to copy text as Markdown.

## Why?

Copying text as Markdown is helpful for blog posts or documentation pages that were authored in Markdown and may be copied into other documents or code comments. Instead of copying plain text or rich text, this utility will copy the selected content as Markdown.

![Example](https://raw.githubusercontent.com/cpojer/copy-as-markdown/main/example.gif)

## See it in Action

Check out blog posts on cpojer.net, for example [Principles of Developer Experience](https://cpojer.net/posts/principles-of-devx), and copy text within the article. The text will be copied as Markdown.

## Usage

Install:

```
yarn add @nkzw/copy-as-markdown
```

Use:

```jsx
import useCopyAsMarkdown from '@nkzw/copy-as-markdown';

export default function MyComponent() {
  const setRef = useCopyAsMarkdown();

  return (
    <div ref={setRef}>
      <h1>When copied, this will turn into Markdown</h1>
      Any <em>rich content</em> inside of this container will be copied as{' '}
      <strong>Markdown</strong>.
    </div>
  );
}
```

This library uses [`turndown`](https://github.com/domchristie/turndown) to convert HTML to Markdown. You can pass any [`turndown` Options](https://github.com/domchristie/turndown#options) to the `useCopyAsMarkdown` hook:

```jsx
const setRef = useCopyAsMarkdown({
  bulletListMarker: '-',
  strongDelimiter: '__',
});
```
npm package: @nkzw/create-context-hook
Description: Simplify creating React Context with hooks.
Author: Christoph Nakazawa
Latest version: 1.1.0

# `create-context-hook`

Simplify the creation of context hooks with global singleton state.

## Installation

```bash
npm install @nkzw/create-context-hook
```

## Usage

Define your context hook using `createContextHook`:

```typescript
import createContextHook from '@nkzw/create-context-hook';

const [HideContext, useHide] = createContextHook(() => {
  const [hidden, setHidden] = useState(false);
  useEffect(() => {
    const listener = (event: KeyboardEvent) => {
      if (
        (event.metaKey || event.ctrlKey) &&
        event.shiftKey &&
        event.code === 'KeyB'
      ) {
        event.preventDefault();

        setHidden((hidden) => !hidden);
      }
    };
    document.addEventListener('keydown', listener);
    return () => document.removeEventListener('keydown', listener);
  }, []);

  return hidden;
}, false);

export { useHide, HideContext };
```

Wrap your app using `HideContext`:

```typescript
import { HideContext } from './HideContext';

const App = () => {
  return (
    <HideContext>
      <MyComponent />
    </HideContext>
  );
};
```

Now you can use `useHide` in your components.

```typescript
import { useHide } from './HideContext';

const MyComponent = () => {
  const hidden = useHide();

  return <div>{hidden ? 'Hidden' : 'Visible'}</div>;
};
```
npm package: @nkzw/define-env
Description: Type-safe env variables.
Author: Christoph Nakazawa
Latest version: 1.1.0

# define-env

## What is `@nkzw/define-env`?

`process.env.*` is not type-safe. It's easy to make a typo, or to forget setting an environment variable in a production environment. `@nkzw/define-env` is a tiny module that ensures all environment variables are defined on app startup, and provides a type-safe way to access them.

`@nkzw/define-env` saves time:

- **Type-safe:** Auto complete for environment variables. No more typos!
- **Required Variables:** All required environment variables must be present, otherwise the app will not start.
- **Immutable environment variables:** Environment variables are defined once on app startup, and cannot be changed during runtime.

## Installation

```bash
npm install @nkzw/define-env
```

## Usage

Create an `env.tsx` file in the root of your project listing all your env variables:

```typescript
import defineEnv from '@nkzw/define-env';

export default defineEnv([
  'DISCORD_KEY',
  'PUSH_KEY',
  'STRIPE_SERVER_KEY',
  'WEB_PUSH_PUBLIC_KEY',
  …
]);
```

Now, your can access your env variables anywhere in your project using `env('VARIABLE_NAME')`:

```typescript
import env from './env.tsx';

console.log(env('DISCORD_KEY'));

console.log(env('SUPER_SECRET_KEY')); // Type-error, because `SUPER_SECRET_KEY` is not defined in `env.tsx`.
```

You can also pass in your own object with environment variables:

```typescript
export default defineEnv(['APPLE_KEY'], {
  APPLE_KEY: 'AppleBananaKey',
});
```
npm package: @nkzw/eslint-config
Description: ESLint config with sensible defaults.
Author: Christoph Nakazawa
Latest version: 3.3.0

# `@nkzw/eslint-config`

Opinionated ESLint config with sensible defaults.

## Installation & Usage

With ESLint v9+:

```
npm install @nkzw/eslint-config
```

In your `eslint.config.js`:

```js
import nkzw from '@nkzw/eslint-config';

export default nkzw;
```

Or, if you have custom ESLint rules or configuration:

```js
import nkzw from '@nkzw/eslint-config';

export default [
  ...nkzw,
  {
    // Custom configuration.
  },
];
```

Then run `pnpm eslint .` or `npm eslint .`.

_Note: You can use @nkzw/eslint-config 1.x with ESLint versions 8 and below._

## Philosophy & Principles

Use this configuration if these principles resonate with you:

- **Error, Never Warn:** Warnings are noise and get ignored. Either it's an issue, or it isn't. This config forces developers to fix problems or explicitly disable the rule with a comment.
- **Strict, Consistent Code Style:** When multiple approaches exist, this configuration enforces the strictest, most consistent code style, preferring modern language features and best practices.
- **Prevent Bugs:** Problematic patterns such as `instanceof` are not allowed, forcing developers to choose more robust patterns. Debug-only code such as `console.log` or `test.only` are disallowed to avoid unintended logging in production or accidental CI failures.
- **Fast:** Slow rules are avoided. For example, TypeScript's `noUnusedLocals` check is preferred over `no-unused-vars`.
- **Don't get in the way:** [Subjective or overly opinionated rules](https://github.com/airbnb/javascript) (e.g. style preferences) are disabled. Autofixable rules are preferred to reduce friction and save time.

## Included Plugins & Rules

This configuration consists of the most useful and least annoying rules from the following eslint plugins:

- [`typescript-eslint`](https://github.com/typescript-eslint/typescript-eslint)
- [`eslint-import-resolver-typescript`](https://www.npmjs.com/package/eslint-import-resolver-typescript)
- [`eslint-plugin-unicorn`](https://github.com/sindresorhus/eslint-plugin-unicorn)
- [`eslint-plugin-import-x`](https://github.com/un-ts/eslint-plugin-import-x)
- [`eslint-plugin-react`](https://github.com/jsx-eslint/eslint-plugin-react)
- [`eslint-plugin-react-hooks`](https://github.com/facebook/react/tree/main/packages/eslint-plugin-react-hooks)
- [`eslint-plugin-perfectionist`](https://perfectionist.dev/)
- [`eslint-plugin-no-instanceof`](https://www.npmjs.com/package/eslint-plugin-no-instanceof)
- [`eslint-plugin-no-only-tests`](https://github.com/levibuzolic/eslint-plugin-no-only-tests)

## Suggestions

This configuration is meant to be used with:

- [TypeScript](https://www.typescriptlang.org/) and the [`noUnusedLocals`](https://www.typescriptlang.org/tsconfig#noUnusedLocals) setting.
- [Prettier](https://prettier.io/) and the [`@ianvs/prettier-plugin-sort-imports`](https://github.com/ianvs/prettier-plugin-sort-imports).

Read about more [frontend tooling suggestions in this blog post](https://cpojer.net/posts/fastest-frontend-tooling-in-2022).
npm package: @nkzw/eslint-plugin
Description: ESLint plugin for Nakazawa Tech.
Author: Christoph Nakazawa
Latest version: 2.0.0

# `@nkzw/eslint-plugin`

ESLint rules for Nakazawa Tech. This plugin is automatically bundled with [`@nkzw/eslint-config`](https://github.com/cpojer/eslint-config).
npm package: @nkzw/find-workspaces
Description: Utility to find all workspace package paths in a monorepo setup.
Author: Christoph Nakazawa
Latest version: 1.1.0

# `@nkzw/find-workspaces`

Utility to find all workspace package paths in a monorepo setup. Can be used for the `packageDir` setting for the [`import-x/no-extraneous-dependencies`](https://github.com/un-ts/eslint-plugin-import-x/blob/master/docs/rules/no-extraneous-dependencies.md) ESLint rule.

## Installation

```bash
npm install @nkzw/find-workspaces
```

## Usage

```typescript
import findWorkspaces from '@nkzw/find-workspaces';

console.log(findWorkspaces()); // Uses `process.cwd()` by default.

console.log(findWorkspaces('/path/to/your/project'));
```

## Supported workspace managers

`findWorkspaces` supports pnpm, yarn, and npm workspace definitions. When both
`pnpm-workspace.yaml` and `package.json` workspaces are present, it unions the
patterns from both files.

### pnpm

```yaml
# pnpm-workspace.yaml
packages:
  - 'packages/*'
  - 'apps/*'
```

### yarn / npm

```json
// package.json
{
  "workspaces": ["packages/*", "apps/*"]
}
```

```json
// package.json
{
  "workspaces": {
    "packages": ["packages/*", "apps/*"]
  }
}
```

### Usage with ESLint

```typescript
import findWorkspaces from '@nkzw/find-workspaces';

export default [
  {
    rules: {
      'import-x/no-extraneous-dependencies': [
        2,
        { packageDir: findWorkspaces() },
      ],
    },
  },
];
```
npm package: @nkzw/immutable-map
Description: Immutable Map
Latest version: 1.2.2

# Immutable Map

This is a fork of [Immutable.js](https://immutable-js.com) that only includes "ImmutableMap" as an ESM package because it's the best immutable Map data structure for JavaScript. Documentation can be found on the [Immutable.js website](https://immutable-js.com).

## Installation

```bash
pnpm install @nkzw/immutable-map
```

## Usage

```js
import ImmutableMap from '@nkzw/immutable-map';
```
npm package: @nkzw/oxlint-config
Description: Oxlint config with sensible defaults.
Author: Christoph Nakazawa
Latest version: 1.0.1

# `@nkzw/oxlint-config`

_Opinionated Oxlint config with sensible defaults._

## Installation & Usage

With Oxlint v1.46+:

```
npm install -D @nkzw/oxlint-config @nkzw/eslint-plugin eslint-plugin-no-only-tests eslint-plugin-perfectionist eslint-plugin-react-hooks eslint-plugin-unused-imports
```

> [!NOTE]
> Due to a limitation in Oxlint's configuration resolver, you have to directly install the JS plugins for now.

In your `oxlint.config.ts`:

```js
import nkzw from '@nkzw/oxlint-config';
import { defineConfig } from 'oxlint';

export default defineConfig({
  extends: [nkzw],
});
```

Then run `pnpm oxlint` or `npm oxlint`.

## Philosophy & Principles

Use this configuration if these principles resonate with you:

- **Error, Never Warn:** Warnings are noise and get ignored. Either it's an issue, or it isn't. This config forces developers to fix problems or explicitly disable the rule with a comment.
- **Strict, Consistent Code Style:** When multiple approaches exist, this configuration enforces the strictest, most consistent code style, preferring modern language features and best practices.
- **Prevent Bugs:** Problematic patterns such as `instanceof` are not allowed, forcing developers to choose more robust patterns. Debug-only code such as `console.log` or `test.only` are disallowed to avoid unintended logging in production or accidental CI failures.
- **Fast:** Slow rules are avoided. For example, TypeScript's `noUnusedLocals` check is preferred over `no-unused-vars`.
- **Don't get in the way:** [Subjective or overly opinionated rules](https://github.com/airbnb/javascript) (e.g. style preferences) are disabled. Autofixable rules are preferred to reduce friction and save time.

## Included Plugins & Rules

This configuration consists of the most useful and least annoying rules from the following ESlint/Oxlint plugins:

- [`eslint-plugin-unicorn`](https://github.com/sindresorhus/eslint-plugin-unicorn)
- [`eslint-plugin-import-x`](https://github.com/un-ts/eslint-plugin-import-x)
- [`eslint-plugin-react`](https://github.com/jsx-eslint/eslint-plugin-react)
- [`eslint-plugin-react-hooks`](https://github.com/facebook/react/tree/main/packages/eslint-plugin-react-hooks)
- [`eslint-plugin-perfectionist`](https://perfectionist.dev/)
- [`eslint-plugin-no-instanceof`](https://www.npmjs.com/package/eslint-plugin-no-instanceof)
- [`eslint-plugin-no-only-tests`](https://github.com/levibuzolic/eslint-plugin-no-only-tests)

## Suggestions

This configuration is meant to be used with:

- [TypeScript](https://www.typescriptlang.org/) and the [`noUnusedLocals`](https://www.typescriptlang.org/tsconfig#noUnusedLocals) setting
- [Oxfmt](https://oxc.rs/docs/guide/usage/formatter.html)

## Alternatives

If you are using ESLint, check out [`@nkzw/eslint-config`](https://github.com/nkzw-tech/eslint-config).
npm package: @nkzw/pothos-locate
Description: Enables GraphQL go-to-definition by mapping types and fields to Pothos source locations.
Author: Christoph Nakazawa
Latest version: 1.0.0

# `@nkzw/pothos-locate`

Enables GraphQL go-to-definition by mapping types and fields to Pothos source locations.

https://github.com/user-attachments/assets/e941950a-2944-4ab8-9954-17c6ad320347

## Installation

Install the [Relay VS Code extension](https://marketplace.visualstudio.com/items?itemName=meta.relay) for VS Code.

Then install the `@nkzw/pothos-locate` package:

```bash
npm install -D @nkzw/pothos-locate
```

Create a `pothos-locate` file in the root of your project, run `chmod +x pothos-locate`, and add the following code:

```bash
#!/bin/sh

node_modules/.bin/pothos-locate --src <path to your graphql definitions> "$@"
```

Now set the `relay.pathToLocateCommand` in your workspace settings to `./pothos-locate`.

_Note: We may be able to remove this intermediate file in the future, pending changes to the Relay VS Code extension._

## Usage

In VS Code you can `cmd+click` on a GraphQL type, field, interface, enum, or input object in your Relay GraphQL queries to jump directly to the Pothos implementation of the entity.

## Configuration

The package currently supports three configuration options:

- `--src` _(defaults to the project root)_: The source directory where your Pothos GraphQL definitions are located. It is recommended to set this to the directory closest to your GraphQL schema for improved performance.
- `--builder` _(defaults to `builder`)_: The local variable name used to define the GraphQL schema with Pothos. Your project must use the same binding name in every module.
- `--extensions` _(defaults to `ts,tsx`)_: The file extensions to search for Pothos definitions.

## Troubleshooting

### It doesn't work

You can call the script directly to see if it is working correctly. For example, if you have a `User` type with a `displayName` field you can run the following command:

```bash
./pothos-locate --src <path to your graphql definitions> --builder <your builder variable name> '<projectName>' User.displayName
```

and it should output the exact location:

```
/Users/cpojer/Projects/athena-crisis/artemis/graphql/nodes/User.tsx:120:4
```

_Note: The `<projectName>` is unused in this package but still passed by the Relay VS Code extension. You can use any string here._

### It still doesn't work for my codebase

Send a Pull Request or consider a [GitHub Sponsorship](https://github.com/sponsors/cpojer).
npm package: @nkzw/profane
Description: Zero dependency profanity detector.
Author: Christoph Nakazawa
Latest version: 2.0.1

# @nkzw/profane

Zero dependency profanity detector based on [Swearjar](https://github.com/raymondjavaxx/swearjar-node) and [Profane](https://github.com/willynilly/profane).

_Note: Some examples may contain offensive language for illustration purposes._

## install

```
npm install @nkzw/profane
```

## Usage

### `new Profane(`[`options?`](#options)`)`

Create a new instance:

```js
import Profane from 'profane';

const profane = new Profane();
```

### `check(text: string): boolean`

Check if a text matches the word list:

```js
profance.check('Hell no'); // true
profance.check('H3ll no'); // true
profane.check('Banana Banana Banana'); // false
```

### `censor(censored: string, replacement?: string): string;`

Censor words matching the word list:

```js
profane.censor('Hell no'); // '**** no'
profane.censor('Hell no', '•'); // '•••• no'
```

### `getWordFrequencies(text: string): Record<string, number>;`

Get the word frequencies of words matching the word list:

````js

```js
const frequencies = profane.getWordFrequencies('horniest hornet fart');
````

```json
{
  "horniest": 1,
  "fart": 1
}
```

### `getCategoryFrequencies(text: string): Record<string, number>;`

Get the category frequencies of words matching the word list:

```js
const frequencies = profane.getCategoryFrequencies('horniest hornet fart');
```

```json
{
  "inappropriate": 1,
  "sexual": 1
}
```

## Options

### `words: Record<string, ReadonlyArray<string>>`

You can configure your Profane instance with a custom word list by supplying an object with word definitions:

```js
const profane = new Profane({
  words: {
    happy: ['inappropriate'],
    awesome: ['elated'],
  },
});

profane.check('Mr. Happy is awesome'); // true
profane.getCategoryFrequencies('Mr. Happy is awesome'); // {inappropriate: 1, elated: 1}
```

You can receive a _copy_ of the word list through the `getWordList()` function:

```js
import { getWordList } from '@nkzw/profane';

getWordList(); // Record<string, ReadonlyArray<string>>
```

### `normalize?: boolean`

Determines whether to normalize [Leet](https://en.wikipedia.org/wiki/Leet) or not. _Defaults to `true`'._

```js
new Profane({ normalize: false }).check('H3ll'); // false
new Profane({ normalize: true }).check('H3ll'); // true
```

### `wholeWordsOnly?: boolean`

Whether to match only on whole words or not. _Defaults to `false`'._

```js
new Profane({ wholeWordsOnly: false }).check('shell'); // true
new Profane({ wholeWordsOnly: true }).check('shell'); // false
```

## Updates to the word list

The default word list was lifted from [Swearjar](https://github.com/raymondjavaxx/swearjar-node) and may be out-of-date. Please feel free to send Pull Requests with new and updated definitions.
npm package: @nkzw/react-native-jsonschema-form
Description: react-jsonschema-form for React Native
Latest version: 0.0.3

# React Native JSONSchema Form

An implementation of React JSONSchema Form for React Native using [Nativewind](https://www.nativewind.dev/) and [`rn-primitives`](https://rn-primitives.vercel.app/).

## Getting Started

Run:

```bash
npm install @nkzw/react-native-jsonschema-form @rjsf/core @rjsf/utils @rjsf/validator-ajv8 @react-native-community/slider
```

If you are not already using `@gorhom/bottom-sheet', you will also need to install it:

```bash
npm install @gorhom/bottom-sheet
```

You also have to wrap your app using a `<BottomSheetModalProvider />`:

```tsx
import { BottomSheetModalProvider } from '@gorhom/bottom-sheet';

export default function App() {
  return (
    <BottomSheetModalProvider>
      {/* Your app components */}
    </BottomSheetModalProvider>
  );
}
```

## Configuration

Set up the default theme via your `tailwind.config.ts` file. You can customize the colors as needed:

```tsx
export default {
  content: [
    // [...your config]
    // Add this line to the content array:
    './node_modules/@nkzw/react-native-jsonschema-form/**/*.{js,ts,tsx}',
  ],
  theme: {
    colors: {
      accent: {
        DEFAULT: '#008',
        foreground: '#fff',
      },
      border: '#111',
      destructive: {
        DEFAULT: '#800',
        foreground: '#fff',
      },
      foreground: '#111',
      input: '#111',
      muted: {
        DEFAULT: '#fff',
        foreground: '#111',
      },
      popover: {
        DEFAULT: '#111',
        foreground: '#111',
      },
      primary: {
        DEFAULT: '#111',
        foreground: '#111',
      },
      secondary: {
        DEFAULT: '#880',
        foreground: '#fff',
      },
    },
  },
};
```

## Usage

```js
import Form from '@nkzw/react-native-jsonschema-form;
import validator from '@rjsf/validator-ajv8';

const form = <Form
  schema={schema}
  uiSchema={uiSchema}
  validator={validator}
/>
```

### Customization

You might want to customize various form componenst or the `Text` component used in the form. You can do this by providing a custom `Text` component or other components via the `templates` prop:

```tsx
import Form from '@nkzw/react-native-jsonschema-form';
import Text from 'src/ui/Text.tsx';

const form = (
  <Form
    schema={schema}
    uiSchema={uiSchema}
    validator={validator}
    templates={{
      ButtonTemplates: {
        SubmitButton: CustomSubmitButton,
      },
      TextTemplate: Text,
    }}
  />
);
```
npm package: @nkzw/relay-utils
Description: Utility functions for the Relay GraphQL framework.
Author: Christoph Nakazawa
Latest version: 1.0.1

# `@nkzw/relay-utils`

Utility functions for the Relay GraphQL framework.

## Installation

```bash
npm install @nkzw/relay-utils
```

## Usage

```typescript
import { useRelayQueryOptions } from '@nkzw/relay-utils';

function MyComponent() {
  const [queryOptions, updateQueryOptions] =
    useRelayQueryOptions('network-only');

  // Pass queryOptions to Relay, or call `updateQueryOptions` to refetch the query.
}
```
npm package: @nkzw/safe-word-list
Description: A word list of the most common safe English words.
Author: Christoph Nakazawa
Latest version: 3.1.2

# @nkzw/safe-word-list

This package contains a list of about 2700 of the most used safe words in English with at least three characters or more.

## Installation

```
npm install @nkzw/safe-word-list
```

## Usage

```js
import words, { getRandomWord } from 'safe-word-list';

console.log(words.slice(10, 5)); // ["absolutely", "absorb", ...]

getRandomWord(); // "beautiful"
```
npm package: @nkzw/use-relative-time
Description: A zero-dependency React hook for formatting relative dates.
Author: Christoph Nakazawa
Latest version: 1.2.3

# @nkzw/use-relative-time

A zero-dependency React hook for formatting relative dates.

## Installation

```
npm install @nkzw/use-relative-time
```

## Usage

### `useRelativeTime()`

Here is an example of how to use `useRelativeTime()` to format a date relative to the current time:

```js
import useRelativeTime from '@nkzw/use-relative-time';

export default function BlogPostHeader({ title, time }) {
  const timeAgo = useRelativeTime(time);

  return (
    <>
      <h1>{title}</h1>
      <time>{timeAgo}</time>
    </>
  );
}
```

## Parameters

### `time: number`

The time in milliseconds that should be formatted relative to the current time.

### `locale: Intl.UnicodeBCP47LocaleIdentifier`, _defaults to `'en'`_

The locale used to format the date.

### `dateNow: () => number`, _defaults to `Date.now`_

The function to get the current time. You can provide an alternative implementation as source for the current time, like for example if you are syncing the time with a server.

## Notes

`useRelativeTime` depends on [`Intl.RelativeTimeFormat`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat). If you are [supporting older browsers](https://caniuse.com/mdn-javascript_builtins_intl_relativetimeformat), you can find a [polyfill in Format.JS](https://formatjs.io/docs/polyfills/intl-relativetimeformat/).

If `Intl.RelativeTimeFormat` is not available, `useRelativeTime` will gracefully fall back to a basic relative time representation that is not localized, such as "17h" instead of "17 hours ago" or "17 hours from now".
npm package: @nkzw/use-visibility-state
Description: React to document visibility changes to pause or resume animations and tasks.
Author: Christoph Nakazawa
Latest version: 1.0.4

# `use-visibility-state`

React to document visibility changes to pause or resume animations and tasks.

## Installation

```bash
npm install @nkzw/use-visibility-state
```

## Usage

Wrap your app using `VisibilityStateContext`:

```typescript
import { VisibilityStateContext } from '@nkzw/use-visibility-state';

const App = () => {
  return (
    <VisibilityStateContext>
      <MyComponent />
    </VisibilityStateContext>
  );
};
```

Now you can use `useVisibilityState` in your components:

```typescript
import { useVisibilityState } from '@nkzw/use-visibility-state';

const MyComponent = () => {
  const isVisible = useVisibilityState();

  return <div style={{
    animationPlayState: isVisible ? 'running' : 'paused',
  }}>
    A heavy animation.
  </div>;
};
```