open-index/open-npm huggingface dataset:
npm package: @kross77/react-native-layout
Description: react,react native and jsx npm package generator with typescript
Author: Ales Krasouski
Latest version: 1.0.10

## React and React Native npm package boilerplate with Typescript support
----

### About
This boilerplate make it easier to create npm package from Typescript projects.

The project is intended to be used with the latest Active LTS release of [Node.js][nodejs]. 


### Getting Started

To start, just clone the repository with following commands:

```sh
git clone https://github.com/pankod/react-typescript-npm-package-boilerplate

cd react-typescript-npm-package-boilerplate

npm install
```

 **Then run the following commands for:**

 **Babel build** : 
```sh 
$ npm run babel-build
```

 **Typescript build** : 
```sh 
$ npm run ts-build
```

#### This boilerplate includes:

- Typescript 3
- TSLint with Microsoft rules
- Jest and Enzyme support,
- Simple example of TypeScript code
- .editorconfig for consistent file format

**You should change the lines on package.json:**

If you develop React for web:

```json
"devDependencies:{
  "@types/react": "^16.8.5", // or @latest
  "@types/react-dom": "^16.8.2", // or @latest
},

"peerDependencies": {
    "react": "*",
    "react-dom": "*",
}
```
or React-Native development environment 
```json
"devDependencies:{
  "@types/react": "^16.8.5", // or @latest
  "@types/react-native": "^16.8.2", // or @latest
},

"peerDependencies": {
    "react": "*",
    "react-native": "*",
}
```
npm package: @kross77/rn-block
Description: Contains the styled component view for react-native. Simplify layout, and move a lot props from css to react view components
Author: kross77
Latest version: 1.0.0

# @kit/rn-block

> Contains the styled component view for react-native. Simplify layouting, and move a lot props from css to react view components

[![NPM](https://img.shields.io/npm/v/@kit/rn-block.svg)](https://www.npmjs.com/package/@kit/rn-block) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)

## Install

```bash
npm install --save @kit/rn-block
```

## Usage

```tsx
import * as React from 'react'

import MyComponent from '@kit/rn-block'

class Example extends React.Component {
  render () {
    return (
      <MyComponent />
    )
  }
}
```

## License

MIT © [kross77](https://github.com/kross77)
npm package: @krowdy-ui/assets
Description: React components that implement Google's Material Design.
Author: Krowdy Team
Latest version: 0.0.7

# @krowdy-ui/assets

You can leverage our styling solution, even if you are not using our components.

## Installation

Install the package in your project directory with:

```sh
// with npm
npm install @krowdy-ui/assets

// with yarn
yarn add @krowdy-ui/assets
```

## Documentation

[The documentation](https://ui.krowdy.com/)
npm package: @krowdy-ui/auth
Description: React components that implement Google's Material Design.
Author: Krowdy Team
Latest version: 0.0.50

# @krowdy-ui/auth

You can leverage our styling solution, even if you are not using our components.

## Installation

Install the package in your project directory with:

```sh
// with npm
npm install @krowdy-ui/auth

// with yarn
yarn add @krowdy-ui/auth
```

## Documentation

[The documentation](https://ui.krowdy.com/)
npm package: @krowdy-ui/icons
Description: React components that implement Google's Material Design.
Author: Krowdy Team
Latest version: 0.0.8

# @krowdy-ui/icons

You can leverage our styling solution, even if you are not using our components.

## Installation

Install the package in your project directory with:

```sh
// with npm
npm install @krowdy-ui/icons

// with yarn
yarn add @krowdy-ui/icons
```

## Documentation

[The documentation](https://ui.krowdy.com/)
npm package: @krowdy-ui/styles
Description: React components that implement Google's Material Design.
Author: Krowdy Team
Latest version: 0.0.25

# @krowdy-ui/styles

You can leverage our styling solution, even if you are not using our components.

## Installation

Install the package in your project directory with:

```sh
// with npm
npm install @krowdy-ui/styles

// with yarn
yarn add @krowdy-ui/styles
```

## Documentation

[The documentation](https://ui.krowdy.com/)
npm package: @krowdy-ui/views
Description: React components that implement Google's Material Design.
Author: Krowdy Team
Latest version: 0.1.30

# @krowdy-ui/views

You can leverage our styling solution, even if you are not using our components.

## Installation

Install the package in your project directory with:

```sh
// with npm
npm install @krowdy-ui/views

// with yarn
yarn add @krowdy-ui/views
```

## Documentation

[The documentation](https://ui.krowdy.com/)
npm package: @krowdy/kds-assets
Description: React components that implement Google's Material Design.
Author: Krowdy Team
Latest version: 0.0.73

# @krowdy/kds-assets

You can leverage our styling solution, even if you are not using our components.

## Installation

Install the package in your project directory with:

```sh
// with npm
npm install @krowdy/kds-assets

// with yarn
yarn add @krowdy/kds-assets
```

## Documentation

[The documentation](https://ui.krowdy.com/)
npm package: @krowdy/kds-auth
Description: React components that implement Google's Material Design.
Author: Krowdy Team
Latest version: 0.0.87

# @krowdy/kds-auth

You can leverage our styling solution, even if you are not using our components.

## Installation

Install the package in your project directory with:

```sh
// with npm
npm install @krowdy/kds-auth

// with yarn
yarn add @krowdy/kds-auth
```

## Documentation

[The documentation](https://ui.krowdy.com/)
npm package: @krowdy/kds-icons
Description: React components that implement Google's Material Design.
Author: Krowdy Team
Latest version: 0.0.30

# @krowdy/kds-icons

You can leverage our styling solution, even if you are not using our components.

## Installation

Install the package in your project directory with:

```sh
// with npm
npm install @krowdy/kds-icons

// with yarn
yarn add @krowdy/kds-icons
```

## Documentation

[The documentation](https://ui.krowdy.com/)
npm package: @krowdy/kds-styles
Description: React components that implement Google's Material Design.
Author: Krowdy Team
Latest version: 0.0.58

# @krowdy/kds-styles

You can leverage our styling solution, even if you are not using our components.

## Installation

Install the package in your project directory with:

```sh
// with npm
npm install @krowdy/kds-styles

// with yarn
yarn add @krowdy/kds-styles
```

## Documentation

[The documentation](https://ui.krowdy.com/)
npm package: @krowdy/kds-views
Description: React components that implement Google's Material Design.
Author: Krowdy Team
Latest version: 0.0.227

# @krowdy/kds-views

You can leverage our styling solution, even if you are not using our components.

## Installation

Install the package in your project directory with:

```sh
// with npm
npm install @krowdy/kds-views

// with yarn
yarn add @krowdy/kds-views
```

## Documentation

[The documentation](https://ui.krowdy.com/)
npm package: @krowdy/utils
Description: React components that implement Google's Material Design.
Author: Krowdy Team
Latest version: 0.0.31

# @krowdy/utils

Multiporpouse solutions for tipyng and filtering

## Installation

Install the package in your project directory with:

```sh
// with npm
npm install @krowdy/utils

// with yarn
yarn add @krowdy/utils
```

## Documentation

[The documentation](https://ui.krowdy.com/)
npm package: @krowten/svelte-heroicons
Description: Heroicons for Svelte
Author: Vladimir
Latest version: 0.1.0

## Description

[heroicons](https://heroicons.com) for Svelte

See all available icons here: https://krowten.github.io/svelte-heroicons

## Basic Usage

_Note that this library currently only supports Svelte 3+ / SvelteKit._

First, install `svelte-heroicons` from npm:

```sh
npm install --save @krowten/svelte-heroicons
```

Сomponent can be used directly:

```svelte
<script>
	import Icon from '@krowten/svelte-heroicons/Icon.svelte';
</script>

<div>
	<Icon name="beaker" class="h-5 w-5 text-blue-500" />
	<Icon name="beaker" class="h-5 w-5 text-blue-500" solid />
</div>
```

or each icon can be imported individually as a Svelte component:

```svelte
<script>
	import { BeakerIcon } from '@krowten/svelte-heroicons';
	// or import BeakerIcon from '@krowten/svelte-heroicons/icons/BeakerIcon.svelte';
</script>

<div>
	<BeakerIcon class="h-5 w-5 text-blue-500" />
	<BeakerIcon class="h-5 w-5 text-blue-500" solid />
</div>
```

Both icon styles are preconfigured to be stylable by setting the `color` CSS property, either manually or using utility classes like `text-gray-500` in a framework like [Tailwind CSS](https://tailwindcss.com).
npm package: @kroxly/spotify-activity
Description: Spotify şu an çalan şarkıyı gösteren React bileşeni
Latest version: 1.0.1

# Spotify Activity Component

Bu paket, kullanıcıların Spotify'da şu an çalan şarkıyı göstermek için kullanabilecekleri bir React bileşeni sağlar.

## Kurulum

```bash
npm install @kroxly/spotify-activity
# veya
yarn add @kroxly/spotify-activity
```

## Gereksinimler

- React 16.8 veya üzeri
- Spotify API erişimi için geçerli bir `clientId`, `clientSecret` ve `refreshToken`

## Kullanım

```jsx
import React from 'react';
import SpotifyActivity from '@kroxly/spotify-activity';

function App() {
  return (
    <div style={{ width: '400px', height: '200px' }}>
      <SpotifyActivity 
        clientId="your_client_id_here"
        clientSecret="your_client_secret_here"
        refreshToken="your_refresh_token_here"
        onError={(error) => console.error(error)}
        className="custom-class"
      />
    </div>
  );
}

export default App;
```

## Özellikler

| Prop | Tür | Zorunlu | Açıklama |
|------|-----|----------|-----------|
| clientId | string | Evet | Spotify API client ID'niz |
| clientSecret | string | Evet | Spotify API client secret'ınız |
| refreshToken | string | Evet | Kullanıcı için oluşturulmuş refresh token |
| onError | function | Hayır | Hata durumunda çağrılacak fonksiyon |
| className | string | Hayır | Bileşene ek CSS sınıfı eklemek için |

## Spotify API Kurulumu

1. [Spotify for Developers](https://developer.spotify.com/dashboard/) adresine gidin
2. Yeni bir uygulama oluşturun
3. Uygulama ayarlarından `clientId` ve `clientSecret` bilgilerinizi alın
4. Redirect URI olarak `http://localhost:3000` ekleyin
5. Refresh token almak için OAuth akışını kullanın

## Geliştirme

1. Repoyu klonlayın:
   ```bash
   git clone https://github.com/kroxlycode/spotify-activity.git
   cd spotify-activity
   ```

2. Bağımlılıkları yükleyin:
   ```bash
   npm install
   ```

3. Geliştirme sunucusunu başlatın:
   ```bash
   npm run dev
   ```

4. Değişikliklerinizi yapın ve test edin.

## Lisans

MIT
npm package: @krozov/maven-central-mcp
Description: MCP server for Maven Central dependency intelligence
Latest version: 0.6.0

# maven-mcp

Claude Code plugin that provides Maven dependency intelligence via an MCP server — query artifact versions, scan projects for outdated dependencies, check for vulnerabilities, and fetch changelogs.

## How it works

An MCP server registers tools that Claude can call during a conversation. The server queries Maven Central, Google Maven, Gradle Plugin Portal, and any custom repositories discovered from your project's build files.

### Tools

| Tool | Description |
|------|-------------|
| `get_latest_version` | Find latest version of an artifact with stability-aware selection |
| `check_version_exists` | Verify if a specific version exists and classify its stability |
| `check_multiple_dependencies` | Bulk lookup of latest versions for multiple dependencies |
| `compare_dependency_versions` | Compare current versions against latest (major/minor/patch) |
| `get_dependency_changes` | Show changes between versions from GitHub changelogs |
| `scan_project_dependencies` | Scan Gradle/Maven build files and Gradle version catalogs (`gradle/libs.versions.toml`) for dependencies |
| `get_dependency_vulnerabilities` | Check for known CVEs via OSV.dev |
| `search_artifacts` | Search Maven Central |
| `audit_project_dependencies` | Full audit: scan + version compare + vulnerability check |

### Skills

| Skill | Description |
|-------|-------------|
| `/latest-version <groupId:artifactId>` | Find latest version of a Maven artifact |
| `/check-deps` | Scan project for outdated dependencies and update them |

### Supported build systems

- **Gradle** — `build.gradle`, `build.gradle.kts`, `settings.gradle`, `settings.gradle.kts`
- **Maven** — `pom.xml`
- **Version catalogs** — `gradle/libs.versions.toml`

Custom repositories are auto-discovered from Gradle `settings.gradle(.kts)`/`build.gradle(.kts)` and Maven `pom.xml`, and the server queries these alongside Maven Central. Dependency scanning additionally reads `gradle/libs.versions.toml` for declared dependencies, but version catalogs are not used for repository discovery.

## Prerequisites

- **Node.js** 18+ (required)
- **jq** (required when hooks are enabled) — used by the PostToolUse hook script (`plugin/hooks/post-edit-deps.sh`) to parse JSON input
- **GITHUB_TOKEN** (optional) — set this environment variable to raise GitHub API rate limits from 60 to 5000 requests/hour, used by the `get_dependency_changes` tool to fetch changelogs and release notes

## Installation

```bash
claude plugin add /path/to/maven-mcp/plugin
```

Or use the published npm package directly as an MCP server:

```bash
npx @krozov/maven-central-mcp
```

## Hooks

The plugin includes a PostToolUse hook that triggers when build files (`build.gradle`, `pom.xml`, `libs.versions.toml`, etc.) are edited. It reminds you to run `/check-deps` to verify dependency updates.

## Caching

Persistent cache stored at `~/.cache/maven-central-mcp/`:
- **SCM mappings** (artifact → GitHub repo) — cached permanently
- **Releases and changelogs** — cached with 24-hour TTL
npm package: @krpano/js-tools
Description: 在浏览器切图和还原全景图，KrpanoTools的轻量替代品
Author: Rain
Latest version: 1.1.18

# krpnao-js-tools

## 介绍：高性能的krpano js工具，在浏览器中切图和还原全景图，替代krpano命令行工具


## 一、功能介绍

### 在浏览器中将全景图转为立方体图、多层级瓦片图

优势：
* 快，算法优化，比krpano原生工具快45% ~ 100%。一张100m的全景图，切成立方体切图只需要10s，产物只有8m左右，最终只需要将8m的内容上传到服务器，而使用krpano切图需要将100m的图片上传到服务器，优势不言而喻！
* 降低服务器压力，将服务器的压力分摊到每个用户的电脑上

备注：

> * 切图的逻辑、缩略图、预览图均以krpano为标准，如果是使用krpano来开发全景的，可以直接使用，暂时未开发自定义切图的参数，后续可能会开放。
> * 目前仅支持**jpeg/jpg**，**20000x10000**分辨率以内的图片，当然这已经是覆盖了80%的使用场景了
> * 切图速度快于krpano原生工具（快45% ~ 100%）
> * 如果需要更高的要求还是可以使用krpano工具，也可以混着使用
> * 由于是用来worker多线程，建议一张一张地切，不要同时切多张，这样可以保证稳定性

如下功能：

---

1. 生成立方体图片（6个面）
2. 生成多分辨率瓦片图（层级根据图片分辨率自动调节）
3. 生成场景预览图preview.jpg
4. 生成场景缩略图thumb.jpg
5. 生成krpano代码：场景代码、立方体image节点代码、多分辨率image节点代码（包含简写和完整两种写法）
6. 生成的图片和场景，均无水印

## 二、如何使用

### 安装依赖
```shell
npm i @krpano/js-tools

yarn add @krpano/js-tools
```

### 切图，示例：在vue中的使用：
```vue
<template>
    <input type="file" name="test" @change="onFileChange" accept="image/jpeg,image/png">
</template>

<script>

// （可选）用于下载文件
import FileSaver from 'file-saver'
// 导入
import KrpanoToolJS from '@krpano/js-tools'

export default {
    methods: {
        onFileChange(e) {
            const file = e.target.files[0]
            if (!file) return
            
            const krpanoTool = new KrpanoToolJS()
            krpanoTool.makeTiles(file).then(result => {
                // result 的具体值看下面介绍
                // 可选，可以使用FileSaver，把内容下载下来
                FileSaver.saveAs(result.content)
            })
        },
    }
}
</script>

```
### 切图的返回值
```typescript
// result对象
interface IConvertPanoResult {
    dirName: string;  // 生成根目录文件夹名称
    content: Blob; // 场景图片、缩略图、预览图 的Blob文件，可以用于上传到后台或者下载到本地
    duration: string | number; // 单次切图时长
    code: {  // 代码
        scene: string;  // 整个场景的代码
        cubeImage: string; // 立方体切图image节点的代码
        tileImage: string; // 多分辨率切图image节点的代码
        shortTileImage: string; // (简写)多分辨率切图image节点的代码
    };
}
```

### 切图方法
```typescript
// 生成立方体图（6张）、缩略图、预览图
makeCube(file: File): Promise<IConvertPanoResult>;

// 生成多分辨率瓦片图、缩略图、预览图
makeTiles(file: File): Promise<IConvertPanoResult>;

// 同时生成立方体图、多分辨率瓦片图
makeCubeAndTiles(file: File): Promise<IConvertPanoResult>;
```

### Q&A
1. 使用webpack5打包会报一个警告
   在webpack.config.js中加入如下代码：
```js
module.exports = {
  resolve: {
    //  跳过worker_threads的检查
    fallback: {
      "worker_threads": false,
    }
  }
}
```

## 三、还原全景图（敬请期待）

1. 在浏览器爬取图片
2. **还原全景图**


## 特别鸣谢
> jaxry https://github.com/jaxry