open-index/open-npm huggingface dataset:
npm package: @inmediam/ui
Description: A React component library built to deliver consistent, accessible, and on-brand UI across InMediam products. Built on [Radix UI](https://www.radix-ui.com/) and [Tailwind CSS](https://tailwindcss.com/).
Author: Douglas Duarte
Latest version: 5.0.0

# @inmediam/ui

A React component library built to deliver consistent, accessible, and on-brand UI across InMediam products. Built on [Radix UI](https://www.radix-ui.com/) and [Tailwind CSS](https://tailwindcss.com/).

[![npm version](https://img.shields.io/npm/v/@inmediam/ui.svg)](https://www.npmjs.com/package/@inmediam/ui)
[![License](https://img.shields.io/npm/l/@inmediam/ui.svg)](https://github.com/inmediam/design-system/blob/main/LICENSE)

---

## Documentation

Full documentation with live examples, props, theming, and accessibility notes:

**[inmediam.github.io/design-system](https://inmediam.github.io/design-system)**

---

## Installation

```bash
npm install @inmediam/ui
```

**Peer dependencies:** React 17+ and React DOM 17+ must be installed in your project.

---

## Setup

### 1. Tailwind CSS

Configure Tailwind to use the design system config. Extend `@inmediam/ui/tailwind` in your `tailwind.config.js`:

```js
// tailwind.config.js
module.exports = require("@inmediam/ui/tailwind")("my-app")
```

Replace `"my-app"` with your app or project name so content paths resolve correctly.

### 2. PostCSS

Use the package PostCSS config (includes Tailwind and Autoprefixer):

```js
// postcss.config.js
module.exports = require("@inmediam/ui/postcss")
```

### 3. Styles

The base styles (Tailwind layers, design tokens, CSS variables) are bundled with the components. When you import any component from `@inmediam/ui`, the CSS is loaded automatically. Ensure your bundler processes CSS from `node_modules` (Vite, Next.js, and Create React App do this by default).

---

## Usage

```tsx
import { Button, Input, Dialog } from "@inmediam/ui"

function App() {
  return (
    <div>
      <Button variant="primary">Get Started</Button>
      <Input placeholder="Enter your email" />
    </div>
  )
}
```

### Available components

Accordion, Alert Dialog, Avatar, Badge, Breadcrumb, Button, Calendar, Card, Carousel, Checkbox, Collapsible, Command, Dialog, Drawer, Dropdown Menu, Input, Label, Menubar, Navigation Menu, Popover, Progress, Radio Group, Select, Separator, Sheet, Sidebar, Skeleton, Slider, Switch, Table, Tabs, Textarea, Toggle, Tooltip, and more.

See the [Storybook](https://inmediam.github.io/design-system) for the full list and usage examples.

---

## License

MIT © [InMediam](https://github.com/inmediam/design-system)
npm package: @inmeng/makeit-captcha
Description: Makeit Captcha 滑块验证码组件，是基于 Vue3.0 + Vite + Canvas 开发，动态生成验证滑块，结合后端进行二次校验，能有效避免被恶意抓取后的模拟验证，进一步提升验证码的可靠性。
Latest version: 1.0.1

<p align="center">
    <a href="https://admin.makeit.vip/">
        <img width="200" src="https://file.makeit.vip/MIIT/M00/00/00/ajRkHV_pUyOALE2LAAAtlj6Tt_s370.png">
    </a>
</p>

<h1 align="center" color="green">
    <a href="https://admin.makeit.vip/components/captcha" target="_blank" style="color: #41b995">
        Makeit Captcha
    </a>
</h1>

<div align="center">

基于 Vue3.0 + Vite 开发，动态生成验证滑块的验证码组件

[![npm package](https://img.shields.io/npm/v/makeit-captcha.svg?style=flat-square)](https://www.npmjs.org/package/makeit-captcha)
[![npm_downloads](http://img.shields.io/npm/dm/makeit-captcha.svg?style=flat-square)](http://www.npmtrends.com/makeit-captcha)
![MIT](https://img.shields.io/badge/license-MIT-ff69b4.svg)
![webpack](https://img.shields.io/badge/webpack-5.11.0-orange.svg)
![vue](https://img.shields.io/badge/vue-3.0.5-green.svg)
![vite](https://img.shields.io/badge/vite-1.0.0-yellow.svg)
![axios](https://img.shields.io/badge/axios-0.21.1-red.svg)
</div>

## 关于

> Makeit Captcha 滑块验证码组件，是基于 Vue3.0 + Vite + Canvas 开发，动态生成验证滑块，结合后端进行二次校验，能有效避免被恶意抓取后的模拟验证，进一步提升验证码的可靠性。

## 安装

```bash
npm i makeit-captcha
```

## 使用
```ts
import { createApp } from 'vue'
import MakeitCaptcha from 'makeit-captcha'
import 'makeit-captcha/dist/captcha.min.css'
import App from './app.vue'

const app = createApp(App)
app.use(MakeitCaptcha)
app.mount('#app')
```

## 示例
```vue
<!-- 基础效果 -->
<template>
    <mi-captcha></mi-captcha>
</template>

<!-- 自定义主题色 -->
<template>
    <mi-captcha theme-color="#2F9688"></mi-captcha>
</template>

<!-- 自定义初始化 / 校验等 -->
<template>
    <mi-captcha theme-color="#be6be0"
        init-action="v1/captcha/init"
        @init="initAfter"
        verify-action="v1/captcha/verification"
        :verify-params="verifyParams">
    </mi-captcha>
</template>
```

```ts
import { defineComponent } from 'vue'
export default defineComponent({
    data() {
        return {
            verifyParams: {}
        }
    },
    methods: {
        initAfter(res) {
            if (res.ret.code === 1) {
                localStorage.setItem('mi-captcha-key', res.data.key)
                this.verifyParams = {key: res.data.key}
            }
        }
    }
})
```

## 更多
> 更多定制化内容及使用请查看在线示例：[https://admin.makeit.vip/components/captcha](https://admin.makeit.vip/components/captcha)
npm package: @innatical/allests
Description: The alles identity TS SDK
Author: Innatical
Latest version: 0.0.2

# allesTS

## An easy SDK for Alles Identity Gateway

## Usage

```ts
const client = new Client('id', 'token')

await client.createFlow({
  callback: 'http://localhost:8080/callback',
  state: 'this is optional'
})

await client.getProfile('code')
```
npm package: @innatical/inncryption
Description: An awesome crypto library
Author: Innatical
Latest version: 2.0.10

# Inncryption - WIP

Inncryption is a crypto protocol built on top of webcrypto. It aims to be a simple way of implementing end-to-end encryption.

# Installation

```sh
yarn add @innatical/inncryption
```

# Documentation

[inncryption.innatical.com](https://inncryption.innatical.com)

# License

[MIT](https://github.com/innatical/inncryption/blob/master/LICENSE)
npm package: @innatical/innstate
Description: ## The easiest state library, ever.
Author: Innatical
Latest version: 1.0.4

# innstate

## The easiest state library, ever.

innstate is a fork of unstated-next with additional utilities and support. It aims to make to make state management in React accesable and accessible.

# Install

```
yarn add @innatical/innstate
```

# Full Example

```tsx
import React, { useCallback, useEffect, useState } from 'react'
import { createContainer } from '../src'
import { render } from 'react-dom'

const useCounter = (initialState = 0) => {
  const [count, setCount] = useState(initialState)
  const decrement = useCallback(() => setCount((count) => count - 1), [])
  const increment = useCallback(() => setCount((count) => count + 1), [])

  const [clock, setClock] = useState(0)
  const resetCLock = useCallback(() => setClock(0), [])

  useEffect(() => {
    const interval = setInterval(() => {
      setClock((time) => time + 1)
    }, 1000)

    return () => {
      clearInterval(interval)
    }
  }, [])

  return {
    count,
    decrement,
    increment,
    clock,
    resetCLock
  }
}

const Counter = createContainer(useCounter)

const CounterDisplay = () => {
  const counter = Counter.useContainer()
  return (
    <div>
      <button onClick={counter.decrement}>-</button>
      <span>{counter.count}</span>
      <button onClick={counter.increment}>+</button>
    </div>
  )
}

const OtherCounterDisplay = () => {
  const clock = Counter.useContainerSelector((input) => ({
    time: input.clock,
    resetClock: input.resetCLock
  }))
  return (
    <div>
      <button onClick={clock.resetClock}>Reset Clock</button>
      <span>{clock.time}</span>
    </div>
  )
}

const App = () => {
  return (
    <Counter.Provider>
      <CounterDisplay />
      <OtherCounterDisplay />
    </Counter.Provider>
  )
}

render(<App />, document.getElementById('root'))
```
npm package: @innatical/markdown
Description: Markdown parser for octii.chat focused on simplicty.
Author: Innatical
Latest version: 0.4.0

# @innatical/markdown

Markdown parser for [octii.chat](https://octii.chat) focused on simplicty.

## Installation

```sh
yarn add @innatical/markdown
```

## Usage

See `test/index.tsx`

## License

[MIT](https://github.com/innatical/md/blob/master/LICENSE)
npm package: @innatical/octii.ts
Description: The offical self-bot library for [octii.chat](https://octii.chat) using the user API.
Latest version: 1.1.6

# octii.ts

The offical self-bot library for [octii.chat](https://octii.chat) using the user API.

## Installation

The prefered package manager is yarn but npm can be used. To install simply run:

```zsh
yarn add @innatical/octii.ts
```

## Usage

```ts
import { Client, Command, Message } from 'octii.ts'

class Bot extends Client {
  constructor() {
    super('!', process.env.BOT_TOKEN!)
  }

  @Command
  async ping(msg: Message) {
    await msg.channel.send('Pong!')
  }
}

new Bot().run()
```

## Documentation

Soon&trade;

## Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

## License

[MIT](https://choosealicense.com/licenses/mit/)
npm package: @innce/port-checker
Description: Mini app to run servers for provided ports and check availability
Author: Sergey Arustamyan
Latest version: 1.0.1

# @innce/port-checker

Lightweight Node.js utility for scanning TCP ports on multiple hosts.
Supports chunked scanning, configurable timeouts, and clear reporting of open and closed ports.

---

## Features

* Scan TCP ports on multiple hosts
* Chunked scanning to avoid resource exhaustion
* Configurable timeouts and delays
* Utility helpers for port range compression
* TypeScript typings included
* Works with Node.js 18+

---

## Installation

```bash
npm install @innce/port-checker
```

---

## Usage

### Basic example

```js
const { scanPorts } = require('@innce/port-checker');

(async () => {
  const hosts = ['127.0.0.1', '192.168.1.3'];
  const ports = [22, 80, 443, 3000, 5000];

  const result = await scanPorts({
    hosts,
    ports,
    settings: {
      chunkSize: 1000, // ports per scan batch
      timeout: 500,    // ms to wait for each port
      log: true        // enable console output
    }
  });

  console.log(result.opened);
  console.log(result.closed);
})();
```

---

## API

### scanPorts({ hosts, ports, settings })

Scans a list of ports on multiple hosts.

**Parameters**

* **hosts** (`string[]`) — hostnames or IP addresses
* **ports** (`number[]`) — ports to scan
* **settings** (`object`, optional):

  * `chunkSize` (`number`) — ports per scan batch (default: `1000`)
  * `bindDelay` (`number`) — delay after binding (ms, default: `100`)
  * `closeDelay` (`number`) — delay after closing (ms, default: `50`)
  * `timeout` (`number`) — per-port timeout in ms (default: `500`)
  * `log` (`boolean`) — enable console logging (default: `true`)

**Returns**

```ts
{
  opened: Record<string, number[]>;
  closed: Record<string, number[]>;
}
```

---

## Utility Functions

### checkPort(host, port, timeout?)

Checks whether a single TCP port is open.

```js
const { checkPort } = require('@innce/port-checker');

const isOpen = await checkPort('127.0.0.1', 80);
```

---

### compressPorts(ports)

Compresses consecutive ports into readable ranges.

```js
compressPorts([80, 81, 82, 443]);
// "80-82, 443"
```

---

### sleep(ms)

Async delay helper.

```js
await sleep(500);
```

---

## License

MIT © Sergey Arustamyan
npm package: @inncode/geox
Description: Tools for geolocation <3
Author: Hiago Silva Souza
Latest version: 1.0.11

# GeoX
Tools for geolocation <3

[![CircleCI branch](https://img.shields.io/circleci/project/github/inncode/geox/master.svg?label=circleci)](https://circleci.com/gh/inncode/geox) [![Dependency Status](https://david-dm.org/inncode/geox.svg)](https://david-dm.org/inncode/geox) [![devDependency Status](https://david-dm.org/inncode/geox/dev-status.svg)](https://david-dm.org/inncode/geox?type=dev)

[![License](https://img.shields.io/npm/l/@inncode/geox.svg)](/LICENSE) ![Download](https://img.shields.io/npm/dw/@inncode/geox.svg?style=popout)

[![GitHub forks](https://img.shields.io/github/forks/inncode/geox.svg?style=social&label=Fork)](https://github.com/inncode/geox/fork) [![GitHub stars](https://img.shields.io/github/stars/inncode/geox.svg?style=social&label=Star)](https://github.com/inncode/geox) 

## Resources

    -> Retrieves address from geographic points.
    -> Retrieves geographical points from an address.
    -> Retrieves geographical points from an ip.
    -> Retrieves address from an ip.

## Installing
To install the library, simply use the package manager npm and enter the command

```sh
npm install -g @inncode/geox
```

## Using
To use GeoX, simply type the command below into your terminal and follow the instructions.

```sh
geox
```

## Development
To contribute to the project, simply make a repository fork, clone the project and run the `npm install` command. After that, you can make the changes that you deem necessary to execute the `npm link`, and then do the tests using the` geox` command, all right commit your changes and request a pull request.

Author
----
> [Hiago Silva Souza](https://www.hiago.me) <<hiasilva@gmail.com>>

License
----

MIT -
**Free Software, Hell Yeah!**
npm package: @inncode/hcli
Description: Facilitates the use of non-global libraries in nodejs
Author: Hiago Silva Souza
Latest version: 1.0.8

# HCLI
Install the not global nodejs packages for use in command-line.

## Installing
```sh
npm install -g @inncode/hcli
```

## Example for use md5 command
### First install md5
```sh
hcli -i md5
```
### Then run the command
```sh
hcli -r "md5('crypt-message')"
```
## All Commands
To list available commands, run the command below
```sh
hcli -l
```

Author
----
> [Hiago Silva Souza](https://www.hiago.me) <<hiasilva@gmail.com>>

License
----

MIT -
**Free Software, Hell Yeah!**
npm package: @inndevs/stylelint-selector-no-empty
Description: [2024 updated] stylelint plugin to disallow empty selectors
Author: Sivantarajan
Latest version: 1.1.1

# stylelint-selector-no-empty
Disallow empty selector in a css rule

```css
                    a, ,.b { display: inline; width: 100px; }
/**                   ↑
 *       This empty selector */
```

## Installation

```
npm install stylelint-selector-no-empty --save-dev
```

## Usage

```js
// .stylelintrc
{
  "plugins": [
    "stylelint-selector-no-empty"
  ],
  "rules": {
    "plugin/stylelint-selector-no-empty": true,
  }
}
```
## Options

### `true`

The following patterns are considered violations:
```css
a,,span { display: inline; width: 100px; }
```
```css
a,span, { display: inline; width: 100px; }
```
npm package: @innei-util/eslint-config-react-ts
Latest version: 0.8.2

# @innei-util/eslint-config-react-ts

## 简介

在个人项目中统一 eslint-config-react-ts 的配置，将之封装为 npm 包（实验性）。

## 使用

安装依赖

```shell
yarn add -D @innei-util/eslint-config-react-ts
```

在 `package.json` 中配置

```json
{
  "eslintConfig": {
    "extends": ["@innei-util/eslint-config-react-ts"]
  }
}
```
npm package: @innei-util/eslint-config-ts
Latest version: 0.8.2

# @innei-util/eslint-ts

## 简介

在个人项目中统一 eslint-ts 的配置，将之封装为 npm 包（实验性）。

## 使用

安装依赖

```shell
yarn add -D @innei-util/eslint-ts
```

在 `package.json` 中配置

```json
{
  "eslintConfig": {
    "extends": ["@innei-util/eslint-ts"]
  }
}
```
npm package: @innei-util/eslint-react-ts
Description: ## 简介
Latest version: 0.1.2

# @innei-util/eslint-react-ts

## 简介

在个人项目中统一 eslint-react-ts 的配置，将之封装为 npm 包（实验性）。

## 使用

安装依赖

```shell
yarn add -D @innei-util/eslint-react-ts
```

在 `package.json` 中配置

```json
{
  "eslintConfig": {
    "extends": ["@innei-util/eslint-react-ts"]
  }
}
```
npm package: @innei-util/eslint-ts
Description: ## 简介
Latest version: 0.2.2

# @innei-util/eslint-config-ts

## 简介

在个人项目中统一 eslint-ts 的配置，将之封装为 npm 包（实验性）。

## 使用

安装依赖

```shell
yarn add -D @innei-util/eslint-config-ts
```

在 `package.json` 中配置

```json
{
  "eslintConfig": {
    "extends": ["@innei-util/eslint-config-ts"]
  }
}
```
npm package: @innei-util/prettier
Latest version: 0.8.2

# @innei-util/prettier

## 简介

在个人项目中统一 prettier 配置，将之封装为 npm 包。

## 使用

安装依赖

```shell
yarn add -D @innei-util/prettier
```

在 `package.json` 中配置

```json
{
  "prettier": "@innei-util/prettier"
}
```