open-index/open-npm huggingface dataset:
npm package: @ndive/design-components
Description: This package is a react component package that implements a design system based on ndive-design-system figma.
Author: yujeong-jeon
Latest version: 0.0.12

# @ndive/design-components

![NPM Version](https://img.shields.io/npm/v/%40ndive%2Fdesign-components)
<img alt="" src="https://img.shields.io/bundlephobia/min/%40ndive%2Fdesign-components" />
![NPM Downloads](https://img.shields.io/npm/dw/%40ndive%2Fdesign-components)

- This package is a react component package that implements a design system based on [`ndive-design-system`](https://www.figma.com/file/60fHi2F04BbdqDQWigiFjG?node-id=6-54&node-type=canvas&t=OVlVEItCjOZOhviC-0&type=design&mode=design) figma.
- [`ndive-design-system`](https://www.figma.com/file/60fHi2F04BbdqDQWigiFjG?node-id=6-54&node-type=canvas&t=OVlVEItCjOZOhviC-0&type=design&mode=design) 피그마 기반의 디자인 시스템 전용 리액트 컴포넌트 패키지

## Warning

- This package is created for learning purposes. Caution is advised when using in production. Use at your own risk.
- 이 패키지는 학습용으로 제작되었습니다. 프로덕션 환경에서 사용 시 주의가 필요합니다. 사용 시 본인의 책임 하에 사용해 주시기 바랍니다.

## How to use

To install this package first, use the following commands in your react project.

먼저 이 패키지를 설치하려면 다음 명령어를 리액트 프로젝트에서 사용하세요.

```bash
➜ npm install @ndive/design-components
```

To use components, import and use them in the following ways.

컴포넌트를 사용하려면 다음과 같은 방법으로 import 하여 사용하세요.

```tsx
import {ButtonPrimary} from '@ndive/design-components'

export default function App () {
    return (
        <ButtonPrimary 
            text="버튼" 
            size="large" 
            color="mainGreen" 
            fillType="fill" 
        />
    )
}
```

## Peer Dependencies

This package requires the following peer dependencies. It must already be installed in the project.

이 패키지는 다음과 같은 peer dependencies를 필요로 합니다. 프로젝트에 이미 설치되어 있어야 합니다.

- react@^18
- react-dom@^18
- @types/react@^18
- @types/react-dom@^18
npm package: @ndive/design-tokens
Description: Package containing Node.js module to extract foundation from ndive-design-system figma
Author: yujeong-jeon
Latest version: 0.0.9

# @ndive/design-tokens

![NPM Version](https://img.shields.io/npm/v/%40ndive%2Fdesign-tokens)
<img alt="" src="https://img.shields.io/bundlephobia/minzip/%40ndive%2Fdesign-tokens" />
![NPM Downloads](https://img.shields.io/npm/dw/%40ndive%2Fdesign-tokens)

- Package containing Node.js module to extract foundation from [`ndive-design-system`](https://figma.com/design/60fHi2F04BbdqDQWigiFjG/ndive-design-system) figma
- [`ndive-design-system`](https://figma.com/design/60fHi2F04BbdqDQWigiFjG/ndive-design-system) 피그마에서 파운데이션을 추출하는 Node.js 모듈을 포함하는 패키지

## Warning

- This package is created for learning purposes. Caution is advised when using in production. Use at your own risk.
- 이 패키지는 학습용으로 제작되었습니다. 프로덕션 환경에서 사용 시 주의가 필요합니다. 사용 시 본인의 책임 하에 사용해 주시기 바랍니다.

## How to use

To install this package first, use the following commands in your react project.

먼저 이 패키지를 설치하려면 다음 명령어를 리액트 프로젝트에서 사용하세요.

```bash
➜ npm install @ndive/design-tokens
```

To use modules, import and use them in the following ways.

모듈울 사용하려면 다음과 같은 방법으로 import 하여 사용하세요.

```js
import {setColor} from '@ndive/design-tokens'

async function fetchColor () {
    const {group, colorSet} = await setColor({
        accessToken: process.env.FIGMA_TOKEN,
    })

    return {group, colorSet}
}
```

## Environment Variables

This package requires permission to access the `ndive-design-system` figma project. Create a `.env` file in the project root and add the following variables:

이 패키지를 사용하려면 `ndive-design-system` figma 프로젝트에 접근 가능한 권한이 필요합니다. 프로젝트 루트에 `.env` 파일을 생성하고 다음 변수를 추가하세요:

```yaml
# .env 파일

# ndive-design-system 피그마에 읽기 권한이 존재하는 사용자 토큰
FIGMA_TOKEN="YOUR-FIGMA-TOKEN" 
```
npm package: @ndive/password-generator
Description: This CLI is a simple and efficient tool for generating secure random passwords of user-specified length.
Author: yceffort
Latest version: 0.1.7

# @ndive/password-generator

[![NPM Version](https://img.shields.io/npm/v/%40ndive%2Fpassword-generator)](https://www.npmjs.com/package/@ndive/password-generator)
[![NPM Downloads](https://img.shields.io/npm/dw/%40ndive%2Fpassword-generator)](https://www.npmjs.com/package/@ndive/password-generator)
[![NPM Collaborators](https://img.shields.io/npm/collaborators/%40ndive%2Fpassword-generator)](https://www.npmjs.com/package/@ndive/password-generator)
[![npm bundle size](https://img.shields.io/bundlephobia/min/%40ndive%2Fpassword-generator)](https://bundlephobia.com/package/@ndive/password-generator)
[![NPM Type Definitions](https://img.shields.io/npm/types/%40ndive%2Fpassword-generator)](./package.json)

- This CLI is a simple and efficient tool for generating secure random passwords of user-specified length.
- 이 CLI는 사용자가 지정한 길이의 안전한 랜덤 비밀번호를 생성하는 간단하고 효율적인 도구입니다.

## Warning

- This package is created for learning purposes. Caution is advised when using in production. Use at your own risk.
- 이 패키지는 학습용으로 제작되었습니다. 프로덕션 환경에서 사용 시 주의가 필요합니다. 사용 시 본인의 책임 하에 사용해 주시기 바랍니다.

## how to use

```bash
➜ npx @ndive/password-generator@latest 12
Generated password:
+bb62hRaARh_

➜ npx @ndive/password-generator@latest 100
Generated password:
,$;_7K]MVcO3@6$v76(gcL?0|C?3s}W2amYU_U[5oy.ui0=DPk=KLRAkv@{B!E80>eyI.VIM{*e[5JUk-ZqjWbL#ekAT#_keDpIk

➜ npx @ndive/password-generator@latest 1000
Generated password:
Tq|[^9v8Y*5LlsUN^sGV4xW:BKOLLg;80*D__#.=-T1#ushc2I_iWHTe=>4!|&dr-Uv.uAB1N5via{}jLpV9Tknt)}SL;yQG@SL.NH{fzzgOUAb=C@?,rQpc4IsJc1@s]@Fgy-<0M{8ZJY^M58YP}0C_{d^R47OW12poOSoQn}<81uw#ARNN>kv[^8-X^{ZSRJbk9)_^59Aj]!kT)tTW=g))YWw=xjz$x{z{@.XE8|ernDfEyvI64I$OKzawm;9#q<paFwg_cWjnWYariR+<RjCHvidc$(QU:,9.O#q^9JI:}=0jdP]NpAX%rr5;(rkw^RWw#}.s?[2I|-i|0Rdjt<p68MXGbzH&>LBv=.CQ>)Jex>+NSnr6y]F(G^6tf]L_=EDTcCwEyliV=vqR:--Kn(fW[pJNW3}fUapU@3EGyL|VG43srwN9m$2Y{D]=(t>A>K^qZ=0kt(a^R81k%S[o0RkPxm=2O*I)!Ir.,I3lxY9G:(SvLE>WFuAz[Q?z?JvlH]UQ3,tN_zHf(](XR0K[lnZVNQkP>rvz7U,yfhSM9*sg*P05]M|y;72^ve9YADF.{pXBCWjgs[1%vkG_I6_1;Z[1M[4$Dz)hDOz26rDHOidZK<^W:^4D5@w3EK-H9JEI^AJ.(QZZvwUepNzYVViDivbP1,!@0KbYAt|JXc)jLKY$Wq4mNsb+ums0s4LX-k;d3hj#3AnyUZt.(y+MXNu.TGdX<a@;Pn_UI)8sbk3^>Jjyc<X-7C-PZIpw|TWxl;7v&nC3wyJooS*&w^.cO|HD7CoPJZ|f]I0lJJ?(wRpxQ^mUw3,DP-*pEM:SE4|}Y#JqD}KqJB8lWP[V]$_||!jZGap*i!G)!FwwlhpnRV4>b0MN!-<7AOy*:B*jYlMyPHq8jUBU7Q#6^vWiKo%vUC0ZOQ$;N7C%>,vm%z?6y{>2v(YtpH<qe$0ZBR(H][wb9$Ge)i}fw+-9<?Z[8n@R]FoOHJi6=GiwX2%&EPamZwM>
```

## Support Browsers

- [node >= 18](./.browserslistrc)
npm package: @ndive/react-image
Description: A comprehensive image utility kit for Next.js, and React. This package is created for learning purposes. Caution is advised when using in production.
Author: yceffort
Latest version: 0.1.10

# @ndive/react-image

[![NPM Version](https://img.shields.io/npm/v/%40ndive%2Freact-image)](https://www.npmjs.com/package/@ndive/react-image)
[![NPM Downloads](https://img.shields.io/npm/dw/%40ndive%2Freact-image)](https://www.npmjs.com/package/@ndive/react-image)
[![NPM Collaborators](https://img.shields.io/npm/collaborators/%40ndive%2Freact-image)](https://www.npmjs.com/package/@ndive/react-image)
[![npm bundle size](https://img.shields.io/bundlephobia/min/%40ndive%2Freact-image)](https://bundlephobia.com/package/@ndive/react-image)
[![NPM Type Definitions](https://img.shields.io/npm/types/%40ndive%2Freact-image)](./package.json)

- A comprehensive image utility kit for Next.js and React.
- 이 패키지는 Next.js와 React를 위한 종합적인 이미지 유틸리티 키트입니다.

## Warning

- This package is created for learning purposes. Caution is advised when using in production. Use at your own risk.
- 이 패키지는 학습용으로 제작되었습니다. 프로덕션 환경에서 사용 시 주의가 필요합니다. 사용 시 본인의 책임 하에 사용해 주시기 바랍니다.

## Support Browsers

- [`ES2020`을 지원하는 환경](https://caniuse.com/?feats=mdn-javascript_operators_optional_chaining,mdn-javascript_operators_nullish_coalescing,mdn-javascript_builtins_globalthis,es6-module-dynamic-import,bigint,mdn-javascript_builtins_promise_allsettled,mdn-javascript_builtins_string_matchall,mdn-javascript_statements_export_namespace,mdn-javascript_operators_import_meta)에서 사용 가능합니다.
npm package: @ndj-fe/mp-axios-adapter
Description: Wechat miniprogram axios adapter
Author: ndj
Latest version: 0.0.5

# @ndj/mp-axios-adapter

## 安装

```shell
pnpm install http://gitlab.corp.niudaji.com/h5/ndj-npm/-/archive/xxxxx.tar?private_token=Your_Token
```
npm package: @ndj-fe/mp-promisify
Description: Wechat miniprogram promisify apis
Author: ndj
Latest version: 1.0.4

# @ndj/mp-promisify

相对于社区版本的小程序 promisify 工具库，此库提供额外的：

1. 所有 promisify api 完善的 typescript 支持
2. 仅对官方遗留的不能支持 promise（因为历史遗留问题）提供 promisify 支持，例如 request，downloadFile等。
3. 利用爬虫，自动化同步生成更新的版本，不需要人工维护，参见脚本`config/index.ts` 中使用 ndj-cli 导出的 API `getWeixinMpApis`

目前支持的 apis：

```ts
// api types
export type WxApi =
| typeof wx.getSystemInfoAsync
| typeof wx.getSkylineInfo
| typeof wx.getRendererUserAgent
| typeof wx.preloadWebview
| typeof wx.preloadSkylineView
| typeof wx.preloadAssets
| typeof wx.getShareInfo
| typeof wx.authPrivateMessage
| typeof wx.enableAlertBeforeUnload
| typeof wx.disableAlertBeforeUnload
| typeof wx.setWindowSize
| typeof wx.request
| typeof wx.downloadFile
| typeof wx.uploadFile
| typeof wx.connectSocket
| typeof wx.requestPluginPayment
| typeof wx.editImage
| typeof wx.cropImage
| typeof wx.openVideoEditor
| typeof wx.getFuzzyLocation
| typeof wx.saveFileToDisk
| typeof wx.pluginLogin
| typeof wx.login
| typeof wx.getUserInfo
| typeof wx.authorizeForMiniProgram
| typeof wx.getWeRunData
| typeof wx.checkIsAddedToMyMiniProgram
| typeof wx.openChannelsUserProfile
| typeof wx.openChannelsLive
| typeof wx.openChannelsEvent
| typeof wx.openChannelsActivity
| typeof wx.getChannelsShareKey
| typeof wx.getChannelsLiveNoticeInfo
| typeof wx.getChannelsLiveInfo
| typeof wx.requestDeviceVoIP
| typeof wx.getDeviceVoIPList
| typeof wx.getGroupEnterInfo
| typeof wx.openCustomerServiceChat
| typeof wx.chooseContact
| typeof wx.getLocalIPAddress
| typeof wx.setVisualEffectOnCapture
| typeof wx.getScreenRecordingState
| typeof wx.sendSms
| typeof wx.getInferenceEnvInfo
| typeof wx.stopFaceDetect
| typeof wx.initFaceDetect
| typeof wx.faceDetect
```

## 安装

```shell
pnpm install http://gitlab.corp.niudaji.com/h5/ndj-npm/-/archive/xxxxx.tar?private_token=Your_Token
```
npm package: @ndkode/dynamodb-streams-readable
Description: Simple readable stream client for AWS DynamoDB Streams
Author: Arthur Weber @godu
Latest version: 3.0.0

# dynamodb-streams-readable

Node.js stream interface for reading records from [AWS DynamoDB Streams](https://docs.aws.amazon.com/us_en/amazondynamodb/latest/developerguide/Streams.html).

## Usage

```js
var client = new AWS.DynamoDBStreams({
  region: 'us-east-1'
});

// see below for options
var readable = require('dynamodb-streams-readable')(client, options);

readable
  // 'data' events will trigger for a set of records in the stream
  .on('data', function(records) {
    console.log(records);
  })
  // each time a records are passed downstream, the 'checkpoint' event will provide
  // the last sequence number that has been read
  .on('checkpoint', function(sequenceNumber) {
    console.log(sequenceNumber);
  })
  .on('error', function(err) {
    console.error(err);
  })
  .on('end', function() {
    console.log('all done!');
  });

// Calling .close() will finish all pending GetRecord requests before emitting
// the 'end' event.
// Because the kinesis stream persists, the readable stream will not
// 'end' until you explicitly close it
setTimeout(function() {
  readable.close();
}, 60 * 60 * 1000);
```

## Options

You can pass options to create the readable stream, all parameters are optional:

```js
var options = {
  shardId: 'shard-identifier', // defaults to first shard in the stream
  iterator: 'LATEST', // default to TRIM_HORIZON
  startAfter: '12345678901234567890', // start reading after this sequence number
  startAt: '12345678901234567890', // start reading from this sequence number
  limit: 100 // number of records per `data` event
};
```

Inspired by [@rclark's kinesis-readable](https://github.com/rclark/kinesis-readable).
npm package: @ndkode/serverless-apigateway-access-logs
Description: Serverless plugin to configure Api Gateway access logs
Author: Adrien Becchis @Coorpacademy
Latest version: 2.0.0

# serverless-apigateway-access-logs

This Serverless-apigateway-access-logs plugin enables you to configure AWS API gateway access logs.

## Installation

First, add `serverless-apigateway-access-logs to your project:

```sh
npm install serverless-apigateway-access-logs
```

Then inside your project's `serverless.yml` file, add following entry to the plugins section

```yml
plugins:
  - serverless-apigateway-access-logs
```

[See example](./example/README.md)

## Configuration
Plugin need to be configured with a log group, and a format.
Log group just need a name, plugins takes care to ensure CloudWatchLogGroup creation.

To configure it, add something like the following to your `serverless.yml`.
```yml
custom:
  serverless-apigateway-access-logs:
    format: '{ "requestId":"$context.requestId", "ip": "$context.identity.sourceIp", "caller":"$context.identity.caller", "user":"$context.identity.user","requestTime":"$context.requestTime", "httpMethod":"$context.httpMethod","resourcePath":"$context.resourcePath", "status":"$context.status","protocol":"$context.protocol", "responseLength":"$context.responseLength" }'
    log-group: /aws/my-api/${self:provider.stage}/access-logs
    log-group-retention: 14 # optional, default to 7
```

You can also additionnaly add a `stageTags` mapping to have some tags attached to the API gateway stage.
npm package: @ndkode/serverless-offline-dynamodb-streams
Description: Emulate AWS λ and DynamoDB streams locally when developing your Serverless project
Author: Arthur Weber @godu
Latest version: 7.0.0

# serverless-offline-dynamodb-streams

This Serverless-offline-dynamodb-streams plugin emulates AWS λ and DynamoDBStreams on your local machine. To do so, it listens DynamoDBStreams stream and invokes your handlers.

*Features*:
- [Serverless Webpack](https://github.com/serverless-heaven/serverless-webpack/) support.
- DynamoDBStreams configurations: batchsize and startingPosition.

## Installation

First, add `serverless-offline-dynamodb-streams` to your project:

```sh
npm install serverless-offline-dynamodb-streams
```

Then inside your project's `serverless.yml` file, add following entry to the plugins section before `serverless-offline` (and after `serverless-webpack` if present): `serverless-offline-dynamodb-streams`.

```yml
plugins:
  - serverless-webpack
  - serverless-offline-dynamodb-streams
  - serverless-offline
```

[See example](../../tests/serverless-plugins-integration/README.md#dynamodb-streams)

## Configure

### Functions

Ths configuration of function of the plugin follows the [serverless documentation](https://serverless.com/framework/docs/providers/aws/events/streams/).

```yml
functions:
  myKinesisHandler:
    handler: handler.compute
    events:
      - stream:
          enabled: true
          type: dynamodb
          arn: arn:aws:dynamodb:eu-west-1:XXXXXX:table/myStream/stream/2018-07-02T19:48:31.121
          batchSize: 10
          startingPosition: TRIM_HORIZON
```


### DynamoDB

The configuration of [`aws.DynamoDBStreams`'s client](https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/DynamoDBStreams.html#constructor-property) of the plugin is done by defining a `custom: serverless-offline-dynamodb-streams` object in your `serverless.yml` with your specific configuration.

You could use [mhart's Dynalite](https://github.com/mhart/dynalite) with the following configuration:

```yml
custom:
  serverless-offline-dynamodb-streams:
    apiVersion: '2013-12-02'
    endpoint: http://0.0.0.0:8000
    region: eu-west-1
    accessKeyId: root
    secretAccessKey: root
    skipCacheInvalidation: false
    readInterval: 500
```

> `arn` could be deduce from `tableName` if your add the key `tableName` in your function's configuration. Useful if your use dynalite and regularly recreate a new DynamoDBStreams.

```yml
functions:
  myKinesisHandler:
    handler: handler.compute
    events:
      - stream:
          enabled: true
          type: dynamodb
          tableName: myTable
```
npm package: @ndkode/serverless-offline-s3
Description: Emulate AWS λ and s3 locally when developing your Serverless project
Author: Djamel Soualmi @DjamelSoualmi
Latest version: 7.0.0

# serverless-offline-s3

This Serverless-offline plugin emulates AWS λ and S3 queue on your local machine. To do so, it listens S3 bucket events and invokes your handlers.

_Features_:

- [Serverless Webpack](https://github.com/serverless-heaven/serverless-webpack/) support.
- S3 configurations: batchsize.

## Installation

First, add `serverless-offline-s3` to your project:

```sh
npm install serverless-offline-s3
```

Then inside your project's `serverless.yml` file, add following entry to the plugins section before `serverless-offline` (and after `serverless-webpack` if present): `serverless-offline-s3`.

```yml
plugins:
  - serverless-webpack
  - serverless-offline-s3
  - serverless-offline
```

[See example](../../tests/serverless-plugins-integration/README.md#s3)

## How it works?

To be able to emulate AWS S3 Bucket on local machine there should be some bucket system actually running. One of the existing implementations suitable for the task is [Minio](https://github.com/minio/minio).

[Minio](https://github.com/minio/minio) is a High Performance Object Storage released under Apache License v2.0. It is API compatible with Amazon S3 cloud storage service. Use MinIO to build high performance infrastructure for machine learning, analytics and application data workloads. See [example](../serverless-offline-s3-integration/docker-compose.yml) `s3` service setup.

We also need to setup actual buckets in Minio server, we can use [AWS cli](https://aws.amazon.com/cli/) tools for that. In example, we spawn-up another container with `aws-cli` pre-installed and run initialization script, against Minio server in separate container.

Once Minio is running and initialized, we can proceed with the configuration of the plugin.

Note that starting from version v3.1 of the plugin.

## Configure

### Functions

The configuration of function of the plugin follows the [serverless documentation](https://serverless.com/framework/docs/providers/aws/events/s3/).

```yml
functions:
  myS3Handler:
    handler: handler.compute
    events:
      - s3:
          bucket: myBucket
          event: s3:ObjectCreated:Put
```

### S3

The configuration of [`aws.S3`'s client](https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/S3.html#constructor-property) of the plugin is done by defining a `custom: serverless-offline-s3` object in your `serverless.yml` with your specific configuration.

[Minio](https://github.com/minio/minio) with the following configuration:

```yml
custom:
  serverless-offline-s3:
    endpoint: http://0.0.0.0:9000
      region: eu-west-1
    accessKey: minioadmin
    secretKey: minioadmin
```