open-index/open-npm huggingface dataset:
npm package: @nakamura196/osd-custom-viewer
Description: This is a custom openseadragon viewer.
Author: Satoru Nakamura
Latest version: 2.27.0

# Custom OpenSeaDragon Viewer

This is a custom openseadragon viewer.

## Install

```bash
npm install @nakamura196/osd-custom-viewer
```

## Usage

```js
import { OsdCustomViewer } from "@nakamura196/osd-custom-viewer";
import "@nakamura196/osd-custom-viewer/dist/style.css"

<OsdCustomViewer manifest="https://www.dl.ndl.go.jp/api/iiif/3437686/manifest.json"></OsdCustomViewer>
```

## Feature

### IIIF

`manifest`プロパティを与えることで、IIIF画像を表示できます。

### Emit

OpenSeaDragon側でのページ遷移を`@updated`で把握できます。

### Highlight

`regions`プロパティを与えることで、ハイライトが可能です。

![スクリーンショット](screenshot.png)
npm package: @nakarmi23/react-bs-ad-calendar
Description: A React based UI component library for building Bikram Sambat and Gregorian Calendars and Date Pickers
Author: Ankit Nakarmi
Latest version: 1.0.1

# @nakarmi23/react-bs-ad-calendar

[![npm version](https://badge.fury.io/js/%40nakarmi23%2Freact-bs-ad-calendar.svg)](https://badge.fury.io/js/%40nakarmi23%2Freact-bs-ad-calendar)

## Introduction

`@nakarmi23/react-bs-ad-calendar` is a React component library that provides easy-to-use, customizable calendar and date picker components for the Bikram Sambat date system, with the ability to switch to the Gregorian calendar. Designed to address the lack of robust solutions for regional date systems, this library focuses on developer experience, flexibility, and accessibility, enabling seamless integration into modern web applications.


At its core, this library utilizes [@nakarmi23/bikram-sambat](https://www.npmjs.com/package/@nakarmi23/bikram-sambat), ensuring precise management and manipulation of Bikram Sambat dates. Inspired by [Radix UI](https://www.radix-ui.com/primitives), it follows a compound component pattern for modularity and composability, allowing developers to customize and build calendar features with ease.

## Installation

### Package Manager

Using npm:

```bash
npm install @nakarmi23/bikram-sambat @nakarmi23/react-bs-ad-calendar
```

Using yarn:

```bash
yarn add @nakarmi23/bikram-sambat @nakarmi23/react-bs-ad-calendar
```

Using pnpm:

```bash
pnpm add @nakarmi23/bikram-sambat @nakarmi23/react-bs-ad-calendar
```

## Anatomy
Import all parts and piece them together.

```tsx
import {Calendar} from "@nakarmi23/react-bs-ad-calendar";

export default ()=>(
    <Calendar.Root>
      <Calendar.Header>
        <Calendar.Button slot='prev' />
        <Calendar.Heading />
        <Calendar.TypeButton />
        <Calendar.Button slot='next'/>
      </Calendar.Header>
      <Calendar.Grid>
        <Calendar.GridHeader>
          {(day) => <Calendar.GridHeaderCell />}
        </Calendar.GridHeader>
        <Calendar.GridBody>
          {(date) => <Calendar.Cell />}
        </Calendar.GridBody>
      </Calendar.Grid>
    </Calendar.Root>
)

```
npm package: @nakashim/tp-custom
Description: Tweakpane 向けのカスタム Blade 集です。   `text`, `row`, `plain`, `textinput`, `toggle`, `dynamiclist`, `imagecontainer`, `iconbutton` などを提供します。
Latest version: 0.1.19

# tp-custom

Tweakpane 向けのカスタム Blade 集です。  
`text`, `row`, `plain`, `textinput`, `toggle`, `dynamiclist`, `imagecontainer`, `iconbutton` などを提供します。

## インストール

```bash
npm install tp-custom tweakpane @tweakpane/core
```

- `tweakpane` と `@tweakpane/core` は `peerDependencies` です。
- 利用側プロジェクトで明示的にインストールしてください。

## 利用手順（最小）

### 1) スタイルを読み込む

```ts
import 'tp-custom/styles';
```

### 2) プラグインを登録する

```ts
import {Pane} from 'tweakpane';
import {registerCustomPlugins} from 'tp-custom';

const pane = new Pane({container: document.querySelector('#pane')!});

registerCustomPlugins(pane, [
  'plain',
  'text',
  'row',
  'textinput',
  'toggle',
  'dynamiclist',
  'imagecontainer',
  'iconbutton',
]);
```

### 3) コンテナに `tp-custom` クラスを付ける

```html
<div id="pane" class="tp-custom"></div>
```

`tp-custom.scss` の一部スタイルは `.tp-custom` を前提にしています。  
このクラスがないと、特にトグル等の見た目が崩れます。

## 直接 import 例

```ts
import {
  PlainBladePluginBundle,
  RowBladePluginBundle,
  TextInputBladePluginBundle,
} from 'tp-custom';

pane.registerPlugin(PlainBladePluginBundle);
pane.registerPlugin(RowBladePluginBundle);
pane.registerPlugin(TextInputBladePluginBundle);
```

## 注意点

- Canvas のモザイク/反転などの加工ロジックはライブラリ本体ではなく利用側責務です。
- このリポジトリの Storybook 実装はデモ用途です。
npm package: @nakcn/widget-header
Description: nakcn.com
Latest version: 0.0.1

# widget header

@nakcn/widget-header

nakcn.com

## API

| 参数名 | 说明 | 必填 | 类型 | 默认值 | 备注 |
| ------ | ---- | ---- | ---- | ------ | ---- |
|        |      |      |      |        |      |
npm package: @nake/babel-preset
Description: Babel preset for transforming your future JS/JSX and TypeScript code
Author: Richie Zhu
Latest version: 1.0.2

# @nake/babel-preset

> Babel preset for transforming your future JS/JSX and TypeScript code

This babel preset is extended from [preset-env](https://babeljs.io/docs/en/babel-preset-env), [preset-react](https://babeljs.io/docs/en/babel-preset-react) and [preset-typescript](https://babeljs.io/docs/en/babel-preset-typescript), you can enable parts of them with simple opitons. This babel preset enabled almost all [TC39 experimental proposals](https://babeljs.io/docs/en/plugins#experimental) by default, you can disable them as you need.

## Features

- Reasonable default options
- Confiurable for various scenarios
- Auto polyfilled based on browserslist and node version
- Support experimental ES proposals out of box
- Support react and typescript out of box
- React compile-time code optimization
- Works great with [@nake/eslint-config](https://github.com/nakeapp/eslint-config)

## Installation

```bash
# Install with npx
$ npx install-peerdeps --dev @nake/babel-preset

# Install with yarn
$ yarn add --dev @babel/core @nake/babel-preset
```

_Use npx to install peerdeps automatically or install peerDependencies with npm/yarn manually._

## Usage

### Default

Default preset support React and all TC39 experimental proposals.

```js
// babel.config.js
module.exports = {
  presets: ['@nake/babel-preset'],
};
```

### TypeScript

Preset support both React and TypeScript.

```js
// babel.config.js
module.exports = {
  presets: [['@nake/babel-preset', { typescript: true }]],
};
```

You should change default extensions from `.js` to `.ts`, below is a babel CLI example.

```json
{
  "scripts": {
    "start": "NODE_ENV=development babel src --extensions .ts --watch --out-dir dist",
    "build": "NODE_ENV=production babel src --extensions .ts --out-dir dist"
  }
}
```

### To be continue

under construction...

## License

MIT
npm package: @nake/commitlint-config
Description: Shareable commitlint configuration used by nake applications
Author: Nake Team
Latest version: 1.0.0

# @nake/commitlint-config

_Shareable commitlint configuration used by nake applications_

## Installation

Use npx to install peerdeps automatically or install peerDependencies with npm/yarn manually.

```bash
# Install with npx
$ npx install-peerdeps --dev @nake/commitlint-config

# Install with yarn
$ yarn add --dev @commitlint/cli @nake/commitlint-config
```

## Usage

Reference it in your `package.json`:

```json
{
  "name": "nake-project",
  "version": "1.0.0",
  "commitlint": {
    "extends": ["@nake/commitlint-config"]
  }
}
```

You can override configs aflter require module in `commitlint.config.js`.

```javascript
module.exports = {
  extends: ['@nake/commitlint-config'],
  // Override commitlint rules below
  rules: {},
};
```

## License

MIT
npm package: @nake/prettier-config
Description: Shareable prettier configuration used by nake applications
Author: Nake Team
Latest version: 1.0.1

# @nake/prettier-config <img src="https://raw.githubusercontent.com/prettier/prettier-logo/master/images/prettier-avatar-light.svg" alt="Prettier" width="90" height="90" align="right">

_Shareable prettier configuration used by nake applications_

## Installation

Use npx to install peerdeps automatically or install peerDependencies with npm/yarn manually.

```bash
# Install with npx
$ npx install-peerdeps --dev @nake/prettier-config

# Install with yarn
$ yarn add --dev prettier @nake/prettier-config
```

## Usage

Reference it in your `package.json`:

```json
{
  "name": "nake-project",
  "version": "1.0.0",
  "prettier": "@nake/prettier-config"
}
```

You can override configs aflter require module in `prettier.config.js`.

```javascript
const prettierConfig = require('@nake/prettier-config');

module.exports = {
  ...prettierConfig,
  // Override with your configs here, e.g. printWidth: 80
};
```

## License

MIT