open-index/open-npm huggingface dataset:
npm package: @leondreamed/create-project
Description: [![npm version](https://img.shields.io/npm/v/@leondreamed/create-project)](https://npmjs.com/package/@leondreamed/create-project)
Latest version: 1.2.8

# Usage

[![npm version](https://img.shields.io/npm/v/@leondreamed/create-project)](https://npmjs.com/package/@leondreamed/create-project)

```shell
pnpm create @leondreamed/project
```
npm package: @leondreamed/ink-text-input
Description: Text input component for Ink
Author: Vadim Demedes
Latest version: 4.0.3

# ink-text-input ![test](https://github.com/vadimdemedes/ink-text-input/workflows/test/badge.svg)

> Text input component for [Ink](https://github.com/vadimdemedes/ink).

Looking for a version compatible with Ink 2.x? Check out [this release](https://github.com/vadimdemedes/ink-text-input/tree/v3.3.0).

## Install

```
$ npm install ink-text-input
```

## Usage

```jsx
import React, {useState} from 'react';
import {render, Box, Text} from 'ink';
import TextInput from 'ink-text-input';

const SearchQuery = () => {
	const [query, setQuery] = useState('');

	return (
		<Box>
			<Box marginRight={1}>
				<Text>Enter your query:</Text>
			</Box>

			<TextInput value={query} onChange={setQuery} />
		</Box>
	);
};

render(<SearchQuery />);
```

<img src="media/demo.gif" width="556">

## Props

### value

Type: `string`

Value to display in a text input.

### placeholder

Type: `string`

Text to display when `value` is empty.

### focus

Type: `boolean` \
Default: `true`

Listen to user's input. Useful in case there are multiple input components at the same time and input must be "routed" to a specific component.

### showCursor

Type: `boolean`\
Default: `true`

Whether to show cursor and allow navigation inside text input with arrow keys.

### highlightPastedText

Type: `boolean`\
Default: `false`

Highlight pasted text.

### mask

Type: `string`

Replace all chars and mask the value. Useful for password inputs.

```jsx
<TextInput value="Hello" mask="*" />
//=> "*****"
```

### onChange

Type: `Function`

Function to call when value updates.

### onSubmit

Type: `Function`

Function to call when `Enter` is pressed, where first argument is a value of the input.

## Uncontrolled usage

This component also exposes an [uncontrolled](https://reactjs.org/docs/uncontrolled-components.html) version, which handles `value` changes for you. To receive the final input value, use `onSubmit` prop.
Initial value can be specified via `initialValue` prop, which is supported only in `UncontrolledTextInput` component.

```jsx
import React from 'react';
import {render, Box, Text} from 'ink';
import {UncontrolledTextInput} from 'ink-text-input';

const SearchQuery = () => {
	const handleSubmit = query => {
		// Do something with query
	};

	return (
		<Box>
			<Box marginRight={1}>
				<Text>Enter your query:</Text>
			</Box>

			<UncontrolledTextInput onSubmit={handleSubmit} />
		</Box>
	);
};

render(<SearchQuery />);
```
npm package: @leondreamed/trpc-client
Description: tRPC Client lib
Author: KATT
Latest version: 10.9.1

<p align="center">
  <a href="https://trpc.io/"><img src="https://assets.trpc.io/icons/svgs/blue-bg-rounded.svg" alt="tRPC" height="75"/></a>
</p>

<h3 align="center">tRPC</h3>

<p align="center">
  <strong>End-to-end typesafe APIs made easy</strong>
</p>

<p align="center">
  <img src="https://assets.trpc.io/www/v10/v10-dark-landscape.gif" alt="Demo" />
</p>

# `@trpc/client`

> Communicate with a tRPC server on the client side.

## Documentation

Full documentation for `@trpc/client` can be found [here](https://trpc.io/docs/vanilla)

## Installation

```bash
# npm
npm install @trpc/client

# Yarn
yarn add @trpc/client

# pnpm
pnpm add @trpc/client
```

## Basic Example

```ts
import { createTRPCProxyClient, httpBatchLink } from '@trpc/client';
// Importing the router type from the server file
import type { AppRouter } from './server';

// Initializing the tRPC client
const trpc = createTRPCProxyClient<AppRouter>({
  links: [
    httpBatchLink({
      url: 'http://localhost:3000/trpc',
    }),
  ],
});

async function main() {
  // Querying the greeting
  const helloResponse = await trpc.greeting.query({
    name: 'world',
  });

  console.log('helloResponse', helloResponse); // Hello world
}

main();
```
npm package: @leondreamed/trpc-next
Description: tRPC Next lib
Author: KATT
Latest version: 10.9.1

<p align="center">
  <a href="https://trpc.io/"><img src="https://assets.trpc.io/icons/svgs/blue-bg-rounded.svg" alt="tRPC" height="75"/></a>
</p>

<h3 align="center">tRPC</h3>

<p align="center">
  <strong>End-to-end typesafe APIs made easy</strong>
</p>

<p align="center">
  <img src="https://assets.trpc.io/www/v10/v10-dark-landscape.gif" alt="Demo" />
</p>

# `@trpc/next`

> Connect a tRPC router to Next.js.

## Documentation

Full documentation for `@trpc/next` can be found [here](https://trpc.io/docs/nextjs)

## Installation

```bash
# npm
npm install @trpc/next @trpc/react-query @tanstack/react-query

# Yarn
yarn add @trpc/next @trpc/react-query @tanstack/react-query

# pnpm
pnpm add @trpc/next @trpc/react-query @tanstack/react-query
```

## Basic Example

Setup tRPC in `utils/trpc.ts`.

```ts
import { createTRPCNext, httpBatchLink } from '@trpc/next';
// Import the router type from your server file
import type { AppRouter } from '../pages/api/[trpc].ts';

export const trpc = createTRPCNext<AppRouter>({
  config() {
    return {
      links: [
        httpBatchLink({
          url: 'http://localhost:3000/trpc',
        }),
      ],
    };
  },
  ssr: true,
});
```

Hook up tRPC inside `_app.tsx`.

```ts
import { trpc } from '~/utils/trpc';

const App = ({ Component, pageProps }) => {
  return <Component {...pageProps} />;
};

export default trpc.withTRPC(App);
```

Now you can query your API in any component.

```ts
import { trpc } from '~/utils/trpc';

export function Hello() {
  const { data, error, status } = trpc.greeting.useQuery({
    name: 'tRPC',
  });

  if (error) {
    return <p>{error.message}</p>;
  }

  if (status !== 'success') {
    return <p>Loading...</p>;
  }

  return <div>{data && <p>{data.greeting}</p>}</div>;
}
```
npm package: @leondreamed/trpc-react-query
Description: tRPC React lib
Author: KATT
Latest version: 10.9.1

<p align="center">
  <a href="https://trpc.io/"><img src="https://assets.trpc.io/icons/svgs/blue-bg-rounded.svg" alt="tRPC" height="75"/></a>
</p>

<h3 align="center">tRPC</h3>

<p align="center">
  <strong>End-to-end typesafe APIs made easy</strong>
</p>

<p align="center">
  <img src="https://assets.trpc.io/www/v10/v10-dark-landscape.gif" alt="Demo" />
</p>

# `@trpc/react-query`

> A tRPC wrapper around react-query.

## Documentation

Full documentation for `@trpc/react-query` can be found [here](https://trpc.io/docs/react-query)

## Installation

```bash
# npm
npm install @trpc/react-query @tanstack/react-query

# Yarn
yarn add @trpc/react-query @tanstack/react-query

# pnpm
pnpm add @trpc/react-query @tanstack/react-query
```

## Basic Example

Create a utils file that exports tRPC hooks and providers.

```ts
import { createReactQueryHooks, createTRPCReact } from '@trpc/react-query';
import type { AppRouter } from './server';

export const trpc = createTRPCReact<AppRouter>();
```

Use the provider to connect to your API.

```ts
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import React from 'react';
import { useState } from 'react';
import { trpc } from '~/utils/trpc';

export function App() {
  const [queryClient] = useState(() => new QueryClient());
  const [trpcClient] = useState(() =>
    trpc.createClient({
      url: 'http://localhost:5000/trpc',
    }),
  );
  return (
    <trpc.Provider client={trpcClient} queryClient={queryClient}>
      <QueryClientProvider client={queryClient}>
        {/* Your app here */}
      </QueryClientProvider>
    </trpc.Provider>
  );
}
```

Now in any component, you can query your API using the proxy exported from the utils file.

```ts
import { proxy } from '~/utils/trpc';

export function Hello() {
  const { data, error, status } = proxy.greeting.useQuery({ name: 'tRPC' });

  if (error) {
    return <p>{error.message}</p>;
  }

  if (status !== 'success') {
    return <p>Loading...</p>;
  }

  return <div>{data && <p>{data.greeting}</p>}</div>;
}
```
npm package: @leondreamed/trpc-server
Description: tRPC Server
Author: KATT
Latest version: 10.9.1

<p align="center">
  <a href="https://trpc.io/"><img src="https://assets.trpc.io/icons/svgs/blue-bg-rounded.svg" alt="tRPC" height="75"/></a>
</p>

<h3 align="center">tRPC</h3>

<p align="center">
  <strong>End-to-end typesafe APIs made easy</strong>
</p>

<p align="center">
  <img src="https://assets.trpc.io/www/v10/v10-dark-landscape.gif" alt="Demo" />
</p>

# `@trpc/server`

> Create tRPC routers and connect them to a server.

## Documentation

Full documentation for `@trpc/server` can be found [here](https://trpc.io/docs/router)

## Installation

```bash
# npm
npm install @trpc/server

# Yarn
yarn add @trpc/server

# pnpm
pnpm add @trpc/server
```

We also recommend installing `zod` to validate procedure inputs.

## Basic Example

```ts
import { inferAsyncReturnType, initTRPC } from '@trpc/server';
import {
  CreateHTTPContextOptions,
  createHTTPServer,
} from '@trpc/server/adapters/standalone';
import { z } from 'zod';

// Initialize a context for the server
function createContext(opts: CreateHTTPContextOptions) {
  return {};
}

// Get the context type
type Context = inferAsyncReturnType<typeof createContext>;

// Initialize tRPC
const t = initTRPC.context<Context>().create();

// Create main router
const appRouter = t.router({
  // Greeting procedure
  greeting: t.procedure
    .input(
      z.object({
        name: z.string(),
      }),
    )
    .query(({ input }) => `Hello, ${input.name}!`),
});

// Export the app router type to be imported on the client side
export type AppRouter = typeof appRouter;

// Create HTTP server
const { listen } = createHTTPServer({
  router: appRouter,
  createContext,
});

// Listen on port 2022
listen(2022);
```
npm package: @leondreamed/tsconfig
Description: My TSConfig
Author: Leon Si
Latest version: 0.0.1

<!-- This readme is totally not copied from https://github.com/sindresorhus/tsconfig -->

# tsconfig

> Shared [TypeScript config](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html) for my projects

## Install

```sh
npm install --save-dev @leondreamed/tsconfig
```

## Usage

`tsconfig.json`

```json
{
  "extends": "@leondreamed/tsconfig",
  "compilerOptions": {
    "outDir": "dist",
    "baseUrl": ".",
    "rootDir": "src",
    "paths": {
      "~/*": ["./src/*"]
    }
  }
}
```
npm package: @leonelgalan/eslint-config-cdk
Description: My personal ESLint config for CDK
Author: Leonel Galan
Latest version: 1.0.1

# `@leonelgalan/prettier-config`

> My personal [ESLint](https://eslint.org/) config for [CDK](https://aws.amazon.com/cdk/)

## Usage

**Install**:

```bash
npm install --save-dev @leonelgalan/eslint-config-cdk
```

**Edit `eslint.config.js`**:

```js
import myconfig from "@leonelgalan/eslint-config-cdk";
import tseslint from "typescript-eslint";

export default tseslint.config(
  {
    ignores: ["lambda/htmlcov"],
  },
  ...myconfig,
);
```

Or [Extending a Sharable Config](https://prettier.io/docs/sharing-configurations#extending-a-sharable-config)
npm package: @leonelgalan/prettier-config
Description: My personal Prettier config
Author: Leonel Galan
Latest version: 1.0.0

# `@leonelgalan/prettier-config`

> My personal [Prettier](https://prettier.io) config

## Usage

**Install**:

```bash
npm install --save-dev @leonelgalan/prettier-config
```

**Edit `package.json`**:

```jsonc
{
  // ...
  "prettier": "@leonelgalan/prettier-config",
}
```

Or [Extending a Sharable Config](https://prettier.io/docs/sharing-configurations#extending-a-sharable-config)
npm package: @leonfong/leon
Description: <h1 align="center">Leon-CLI</h1>
Author: Leon Fong
Latest version: 0.2.3


<h1 align="center">Leon-CLI</h1>

<div align="center">
  <a href="https://img.shields.io/github/actions/workflow/status/leon-fong/leon-cli/ci.yml?branch=main" target="_blank"><img src="https://img.shields.io/github/actions/workflow/status/leon-fong/leon-cli/ci.yml?branch=main&style=flat&colorA=000000&colorB=000000" alt="CI" /></a>
  <a href="https://www.npmjs.com/package/@leonfong/leon" target="_blank"><img src="https://img.shields.io/npm/v/@leonfong/leon?style=flat&colorA=000000&colorB=000000" alt="NPM Version" /></a>
    <a href="https://www.npmjs.com/package/@leonfong/leon" target="_blank"><img src="https://img.shields.io/npm/dt/@leonfong/leon.svg?style=flat&colorA=000000&colorB=000000" alt="NPM Downloads" /></a>
</div>

## Install

<pre>
npm i -g <b>@leonfong/leon</b>
</pre>

## Usage

//TODO

## License
MIT © [Leon Fong](https://github.com/leon-fong/leon-cli/blob/3b767deea06b1d8cc9af5cde352b3d444d8eeae9/license)
npm package: @leonid-shutov/uncommonjs
Description: **uncommon‑js** — a utility library for Node.js that provides a custom module system based on code sandboxing, using isolated V8 contexts.
Author: Leonid Shutov
Latest version: 1.0.0-alpha.11

# uncommon‑js ⚙️

**uncommon‑js** — a utility library for Node.js that provides a custom module system based on code sandboxing, using isolated V8 contexts.

# Example

```js
({
  create: {
    description: 'Creating a book',
    method: repository.book.create,
    expectedErrors: {
      BOOK_ALREADY_EXISTS: PASS,
    },
  },
  getByCode: {
    description: 'Getting a book by code',
    method: async (code) => {
      const book = await repository.book.getByCode(code);
      if (book === null) throw NotFoundError.from('book', { meta: { code } });
      return book;
    },
    expectedErrors: {
      BOOK_NOT_FOUND: PASS,
    },
  },
});
```

```js
({
  create: {
    method: ({ code, name }) => db.pg.query(`INSERT INTO "public"."Book" (code, name) VALUES ($1, $2)`, [code, name]),
    expectedErrors: {
      23505: AlreadyExistsError.from('book'),
    },
  },
  getByCode: async (code) =>
    (await db.pg.query(`SELECT * FROM "public"."Book" WHERE code = $1`, [code])).rows[0] ?? null,
});
```