open-index/open-npm huggingface dataset:
npm package: @sujen/blocks-editor
Description: A block with all inline styles formatting that spans one line.
Latest version: 0.1.28

# Blocks Editor

A block with all inline styles formatting that spans one line.

# Tutorial

1. Default

```javascript
<BlockProvider>
  <BlockEditor />
</BlockProvider>
```

2. Custom Inline Style

```javascript
const customInlineStyleMap = {
  bold: { fontWeight: "bold" },
  italic: { color: "#382838" },
  // underline ...
  // code ...
  // strikethrough ...
}

<BlockProvider customInlineStyleMap={customInlineStyleMap}>
  <BlockEditor />
</BlockProvider>
```

3. Custom Block Style

```javascript
const customBlockStyle = {
  color: "#383838",
  backgroundColor: "#ffffff"
}

<BlockProvider customBlockStyle={customBlockStyle}>
  <BlockEditor />
</BlockProvider>
```

4. Custom Key Binding

```javascript
const customKeyBindingFn: (e: React.KeyboardEvent) => StyleType = (
  e: React.KeyboardEvent
) => {
  if (!e.metaKey) {
    return;
  }

  switch (e.key) {
    case "a":
      return "bold";
    case "s":
      return "underline";
    case "d":
      return "italic";
    case "f":
      return "code";
    case "e":
      return "strikethrough";
  }
};

<BlockProvider customKeyBindingFn={customKeyBindingFn}>
  <BlockEditor />
</BlockProvider>;
```

# Block Editor

Optional Arguments

- block: preset input text and styles
- onChange: called with every update of the block
- focus: if the block should be focused
npm package: @sujian/request
Description: ``` ni @sujian/request ```
Latest version: 2.0.7

# request

```
ni @sujian/request
```

如果使用ts, AxiosRequestConfig 没有自定义配置提示，可以在tsconfig.json中添加types

```json
{
  "compilerOptions": {
    "types": ["@sujian/request/types"]
  }
}
```

如果使用了pnpm包管理，不能直接使用axios，这个是正常的，如果想要使用，两种方案：

1. 显式安装axios
2. 在**.npmrc**文件中添加
  ```
  # 依赖提升
  public-hoist-pattern[]=axios
  ```
npm package: @sujian/stylelint-config
Description: ## usage
Author: hens
Latest version: 0.0.4

# stylelint-config

## usage

```
pnpm add stylelint @sujian/stylelint-config -D
```

.stylelintrc.json

```
{
  "extends": "@sujian/stylelint-config"
}
```

package.json

```json
{
  "scripts": {
    "lint:style": "stylelint .",
    "lint:style-fix": "stylelint  . --fix"
  }
}
```


### vscode setting
```json
{
  "editor.codeActionsOnSave": {
    "source.fixAll.stylelint": true
  },
  "stylelint.validate": ["css", "scss", "vue", "less"],
}
```
npm package: @sujian/tabs-switch
Description: > 里面并没有添加监听事件 仅仅是一次学习 不能直接用于生产环境
Author: sujian
Latest version: 0.3.0

# tab-switch

> 里面并没有添加监听事件 仅仅是一次学习 不能直接用于生产环境


![screenshot](/screenshot/gif.gif)

## Usage

```
  <tabs>
      <tab-item label='ONE' :prefix-icon="['fas','coffee']"> 我是内容ONE</tab-item>
      <tab-item label='Two' prefix-icon="angry"> 我是内容Two</tab-item>
      <tab-item label='Four'>
        <template slot="prefix">
          <font-awesome-icon icon="dizzy" />
        </template>
        我是内容Four
      </tab-item>
    </tabs>

    <tabs>
      <tab-item label='ONE' :suffix-icon="['fas','coffee']"> 我是内容ONE</tab-item>
      <tab-item label='Two' suffix-icon="angry"> 我是内容Two</tab-item>
      <tab-item label='five'>
        <template slot="suffix">
          <font-awesome-icon icon="dizzy" />
        </template>
        我是内容five
      </tab-item>
    </tabs>
```


## Project setup
```
yarn install
```

### Compiles and hot-reloads for development
```
yarn run serve
```

### Compiles and minifies for production
```
yarn run build
```

### Lints and fixes files
```
yarn run lint
```
npm package: @sujit-shrc/rnr
Description: Scripts launcher for your JavaScript, TypeScript, and Python projects or frameworks with ease.
Author: sujit-shrc
Latest version: 1.0.1

# rnr (runner): Instant Scripts Launcher

Say goodbye to managing multiple package managers and remembering unique run scripts for every framework or project type. With `rnr`, you're just one command away from running your project, whether it's JavaScript, TypeScript, Next.js, Vite, React Native, Express.js, Nuxt.js, Vue.js, and more. Support for additional applications like Python is also coming soon!

## Key Features

- Automatic detection of project type and package manager (Bun, pnpm, Yarn, npm)
- Supports a variety of project types (JavaScript/TypeScript or Python frameworks)
- Easy switching between development, production, and build modes
- Customizable configuration via `.rnr.rc` file

## Installation

Install `rnr` globally using one of the following commands:

- npm: `npm install -g rnr`
- yarn: `yarn global add rnr`

## Usage

Once installed, navigate to your project root directory and run:

```bash
 rnr  #default mode (dev)
 rnr dev or rnr -m dev
 rnr prod or rnr -m prod
 rnr build or rnr -m build
```

## Learn More

For detailed documentation on advanced usage, supported project types, package manager priority, configuration options, and more, visit the [`rnr` GitHub repository](https://github.com/sujit-shrc/rnr).
npm package: @sujithjr/aws4-request-auth-ts
Description: A javascript/typescript package to authenticate requests with aws4 signature.
Author: Sujithkumar Sundaran
Latest version: 1.0.2

# aws4-request-auth-ts

This is a typescript/javascript package to sign your HTTP requests using aws4 signature. This includes support for both CJS and ESM.

To get started:
```shell
# Using bun.js
bun add @sujithjr/aws4-request-auth-ts
```
```shell
# Using npm
npm install @sujithjr/aws4-request-auth-ts
```
```shell
# Using pnpm
pnpm add @sujithjr/aws4-request-auth-ts
```
```shell
# Using yarn
yarn add @sujithjr/aws4-request-auth-ts
```

Common JS require,
```js
const awsSign = require('@sujithjr/aws4-request-auth-ts');
```

ES module import,
```js
import awsSign from '@sujithjr/aws4-request-auth-ts';
```

Supports all the HTTP request methods. Example on how to pass required fields to sign the headers,
```js
const headers = awsSign.signHeaders({
  targetUrl: 'https//example.com',
  method: 'POST',
  body: JSON.stringify({ value: 'some text' }),
  awsConfig: {
      region: '<aws-region>',
      accessKey: '<aws-access-key>',
      secretKey: '<aws-secret-key>',
      service: '<aws-service>',
  }
})
```
npm package: @sujithjr/exstasy-components
Description: Unstyled UI components for Vue 3
Author: Sujith kumar
Latest version: 0.0.6

# Exstasy Components (ex-components)

Set of headless UI components using Vue 3 and Typescript.

For full documentation, visit [xui.iamsujith.in](https://xui.iamsujith.in/)

> [!NOTE]
> I developed this for my own learning and usage inspired by Tailwind team's Headless UI. PR's and new feature suggestions are always welcome.

Install the package using npm,
```sh
npm install @sujithjr/exstasy-components
```

Or install using Bun.js,

```sh
bun add @sujithjr/exstasy-components
```

You can either import the components individually (tree shakable) or register it globally in `main.ts` or `main.js`,
```js
import ExstasyComponents from '@sujithjr/exstasy-components'

const app = createApp(App)

app.use(ExstasyComponents)
```

For contribution, clone the repo and install dependencies using,
```sh
bun install
```

Start the development server, and visit http://localhost:5173/ in the browser
```sh
bun dev
```

Build for production,
```sh
bun run build
```