open-index/open-npm huggingface dataset:
npm package: @rkrupinski/stan
Description: Minimal, type-safe state management
Author: Rafał Krupiński
Latest version: 1.7.2

[![](../website/static/img/logo.svg)](https://stan.party)

# Stan

[![CI](https://github.com/rkrupinski/stan/actions/workflows/ci.yml/badge.svg)](https://github.com/rkrupinski/stan/actions/workflows/ci.yml)
![NPM Version](https://img.shields.io/npm/v/@rkrupinski/stan)
![Bundle size](https://img.shields.io/bundlejs/size/@rkrupinski/stan)

Minimal, type-safe state management

- [Website](https://stan.party)
- [API docs](https://stan.party/docs/api/state)
- [Examples](https://stan.party/docs/getting-started/examples)
- [Devtools](https://chromewebstore.google.com/detail/stan-devtools/jioipgcofbmgbdfmdjjcmockkjkhagac)
- [Blog Post](https://rkrupinski.com/post/introducing-stan)

## Install

```sh
npm install @rkrupinski/stan
```

## Quick start

```jsx
import { atom, selector } from "@rkrupinski/stan";
import { useStan, useStanValue } from "@rkrupinski/stan/react";

const count = atom(0);
const doubled = selector(({ get }) => get(count) * 2);

function Counter() {
  const [value, setValue] = useStan(count);
  const double = useStanValue(doubled);

  return (
    <>
      <button onClick={() => setValue(v => v + 1)}>Count: {value}</button>
      <p>Doubled: {double}</p>
    </>
  );
}
```
npm package: @rkrupinski/use-state-machine
Description: A simple yet powerful finite state machine React hook
Author: Rafał Krupiński
Latest version: 1.0.2

# @rkrupinski/use-state-machine

A simple yet powerful finite state machine [React](https://reactjs.org/) hook.

- [Docs](https://github.com/rkrupinski/use-state-machine#readme)
- [Examples](https://use-state-machine.netlify.app)
npm package: @rksan/kintone-type
Description: Typescript type definition for kintone javascript api
Author: rksan
Latest version: 1.1.1

# overview

[kintone JavaScript API](https://cybozu.dev/ja/kintone/docs/js-api/) の TypeScript 型定義

# install

```bash
npm install -D @rksan/kintone-type
```

# Requirement

Node.js - v18.x

# usage

```ts
// [TypeScript]
import type kintone from "@rksan/kintone-type";

(async (kintone: kintone) => {
  try {
    const url = kintone.api.url("/k/v1/record");

    const response = await kintone.api(url, "GET", {
      app: "100",
      id: "1",
    });

    const record: kintone.Record = response.record;

    const field: kintone.Field = record["field_code"];

    if (field.type === "SINGLE_LINE_TEXT") {
      const value = field.value;
      console.log("[INFO]", field.type, value);
    } else if (field.type === "CHECK_BOX") {
      const values = field.value;
      console.log("[INFO]", field.type, values);
    } else if (field.type === "USER_SELECT") {
      const users = field.value;
      console.log("[INFO]", field.type, users);
    } else {
      console.log("[INFO]", field.type, field.value);
    }
  } catch (err) {
    console.error("[ERR]", err);
  }

  // @ts-ignore
})(window.kintone);
```

```js
// [JavaScript]
// @ts-check

/** @typedef {import("@rksan/kintone-type")} kintone */
/** @typedef {import("@rksan/kintone-type").Record} kintone.Record */
/** @typedef {import("@rksan/kintone-type").Field} kintone.Field */

(async (/** @type {kintone} */ kintone) => {
  try {
    const url = kintone.api.url("/k/v1/record");

    const response = await kintone.api(url, "GET", {
      app: "100",
      id: "1",
    });

    /** @type {kintone.Record} */
    const record = response.record;

    /** @type {kintone.Field} */
    const field = record["field_code"];

    if (field.type === "SINGLE_LINE_TEXT") {
      const value = field.value;
      console.log("[INFO]", field.type, value);
    } else if (field.type === "CHECK_BOX") {
      const values = field.value;
      console.log("[INFO]", field.type, values);
    } else if (field.type === "USER_SELECT") {
      const users = field.value;
      console.log("[INFO]", field.type, users);
    } else {
      console.log("[INFO]", field.type, field.value);
    }
  } catch (err) {
    console.error("[ERR]", err);
  }

  // @ts-ignore
})(window.kintone);
```

# History

- 1.1.1
  - `kintone.app.record.get() | se()`のバグ修正
- 1.1.0
  - 2025/10/12 アップデートに対応
  - [kintone API アップデート情報](https://cybozu.dev/ja/kintone/news/api-updates/2025-10/)
- 1.0.1
  - バグ修正
- 1.0
  - 初版

# Author

@rksan https://github.com/rksan | github

# Licence

MIT
npm package: @rksan/mock-media-devices
Description: WebAPI window.navigator.mediaDevices のモック
Author: rksan
Latest version: 0.0.2

[![Coverage Status](https://coveralls.io/repos/github/rksan/mock-mediaDevices/badge.svg?branch=main)](https://coveralls.io/github/rksan/mock-mediaDevices?branch=main)

# mock-mediaDevices

## overview

WebAPI window.navigator.mediaDevices のモックを生成

## Usage

以下の構成で説明する

- [nodejs | nodejs.org](https://nodejs.org/ja)
- [typescript | github](https://github.com/microsoft/TypeScript)
- [jsdom | github](https://github.com/jsdom/jsdom)
- [mocha | github](https://github.com/mochajs/mocha)
- [chai | github](https://github.com/chaijs/chai)

### setup

まず[`jsdom`](https://github.com/jsdom/jsdom)を用いて、[nodejs](https://nodejs.org/ja)で動作可能な[`window.navigator`](https://developer.mozilla.org/ja/docs/Web/API/Navigator)を生成し、`mockMediaDevices()`によって生成される`mediaDevices`オブジェクトを`window.navigator`へ登録するセットアップモジュールを作成する

`test/setup.ts`

```typescript
// test/setup.ts

import jsdom from "jsdom";
import { mockMediaDevices } from "@rksan/mock-media-devices";

const { JSDOM } = jsdom;
const dom = new JSDOM(`<!DOCTYPE html>`);

const fakeMediaDevices = mockMediaDevices();

// nodejs
globalThis.navigator ??= dom.window.navigator;

if(Object.prototype.hasOwnProperty.call(navigator, "mediaDevices")){
  Object.defineProperty(navigator, "mediaDevices". {value: fakeMediaDevices})
}
```

### With test runner

次に、テストコード内で`test/setup.ts`を呼び出してテストコードを実行する

```typescript
// test/index.spec.ts

import { describe, it } from "mocha";
import { assert } from "chai";

// call setup module
import "test/setup.ts";

// Implementation of test runner
describe("unit testing...", () => {
  it("mediaDevices", (done) => {
    navigator.mediaDevices
      .getUserMedia({ video: true })
      .then((stream) => {
        // test codes ...
        done();
      })
      .catch((err) => {
        done(err);
      });
  });
});
```

## install

```shell
npm i -D @rksan/mock-media-devices
```

## Requirement

- Node.js - v18.x

## syntax

```typescript
const mediaDevices: MediaDevices =
  mockMediaDevices(deviceInfos?: MediaDeviceInfo[])
```

### arguments

#### `deviceInfos?`

[`MediaDeviceInfo` | MDN](https://developer.mozilla.org/ja/docs/Web/API/MediaDeviceInfo) の配列。

`@type` `MediaDeviceInfo[]`

`@default` 次に記載

```typescript
[
  {
    deviceId: UUID, // *1
    groupId: UUID,
    kind: "videoinput",
    label: "mock-videoinput-device",
  },
  {
    deviceId: UUID,
    groupId: UUID,
    kind: "audioinput",
    label: "mock-audioinput-device",
  },
  {
    deviceId: UUID,
    groupId: UUID,
    kind: "audiooutput",
    label: "mock-audiooutput-device",
  },
];
```

\*1 `UUDD` は `nodejs` 標準パッケージ `crypto.randomUUID()` にて生成される

# Reference

- [navigator.mediaDevices | MDN](https://developer.mozilla.org/ja/docs/Web/API/Navigator/mediaDevices)

# Author

@rksan https://github.com/rksan | github

# Licence

MIT
npm package: @rksan/path-alias
Description: Reads the path-alias property in any config file and helps resolve it to an absolute path.
Author: rksan
Latest version: 1.0.0

[![Coverage Status](https://coveralls.io/repos/github/rksan/path-aliase/badge.svg?branch=main)](https://coveralls.io/github/rksan/path-aliase?branch=main)

# path-alias

任意の config file にある path-alias プロパティを読み込み、絶対パスに解決する手助けをします。

例えば、`babel.config`の`alias`プロパティは、相対パスでの記述が推奨されますが、同パスを記述するであろう`vue.config`の`alias`プロパティは絶対パスで記述しないと正常に動作しない場合があります。

こうした場合、２種類の config file を開発者が管理する必要がありますが、そのうち何処に設定していたのか忘れてしまうことが多々あります。

そこで、module の pash aliase を任意の別ファイルで管理し、相対パスと絶対パスを相互に変換できるプラグインがあったら便利だなぁと`path-alias`を作成しました。

# インストール

```bash
npm install --save-dev @rksan/path-alias
```

# 使用方法

## 1. config file の作成

まず任意のファイルとして`aliases.json`を作成します。
ファイルの名前も任意です。

次に`babel.config`が保持するであろう`alias`プロパティを記述します。内容も任意です。

### `aliase.json`

```json
{
  "root": [".", "./src"],
  "alias": {
    "~": ".",
    "@": "./src"
  }
}
```

## 2. プラグインへの読み込み

以下、例として、`babel.config`と`vue.config`での使用方法を説明します。([@babel-plugin-module-resolver](https://github.com/tleunen/babel-plugin-module-resolver)の利用が前提)

### `babe.config.js`

```javascript
// 本モジュールの読み込み
const pathAliase = require("path-alias");

// 参照する config の変更
pathAliases.setConfig({
  // アプリケーションルートパス
  appRootPath: __dirname,
  // 任意の config file がある、アプリケーションルートパスからの相対パス
  config: "./aliases.json".
});

// 相対パスのまま参照
const config = pathAliases.toJSON();

// babel.config に割当する
module.exports = {
  ...

  "plugins": [
    ["module-resolver", {
      "root": config.root,
      "alias": config.alias // { "~", "@" }
    }]
  ]

  ...
}
```

### `vue.config.js`

```javascript
// 本モジュールの読み込み
const pathAliase = require("path-alias");

// 設定の変更
pathAliases.setConfig({
  // アプリケーションルートパス
  appRootPath: __dirname,
  // 任意の config file がある、アプリケーションルートパスからの相対パス
  config: "./aliases.json".
});

// 絶対パスへ解決
const config = pathAliases.resolve();

const { defineConfig } = require("@vue/cli-service");

module.exports = defineConfig({
  ...
  configureWebpack: (config) => {
    config = {
      resolve: {
        alias: config.alias  // { "~", "@" }
    };

    return config;
    }
  },
  ...
});
```

# LICENSE

MIT

# 更新履歴

## v1.0.0

- 正式リリース
- install を追記
- LICENSE を追記

## v0.0.2

- package name を変更

## v.0.0.0

- 新規
npm package: @rkueny/react-package-npm
Description: >
Author: rkueny
Latest version: 1.0.5
Deprecated: not utilised

# react-package-npm

> 

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

## Install

```bash
npm install --save react-package-npm
```

## Usage

```jsx
import React, { Component } from 'react'

import MyComponent from 'react-package-npm'

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

## License

MIT © [rkueny](https://github.com/rkueny)