open-index/open-npm huggingface dataset:
npm package: @saru-house/ui
Description: A React component library built with DaisyUI and Tailwind CSS for Next.js applications.
Author: tancredo
Latest version: 1.0.0

# @saru-house/ui

A React component library built with DaisyUI and Tailwind CSS for Next.js applications.

## Features

- 🎨 Built on top of DaisyUI and Tailwind CSS
- 📦 Tree-shakeable components
- 🔧 Fully typed with TypeScript
- ⚡️ Optimized for Next.js
- 🎯 Zero-runtime CSS-in-JS

## Installation

Using yarn

```bash
yarn add @saru-house/ui
```

Using npm

```bash
npm install @saru-house/ui
```

Using pnpm

```bash
pnpm add @saru-house/ui
```

## Setup

1. Add the required dependencies to your project:

```bash
yarn add tailwindcss daisyui @tailwindcss/typography
```

2. Add the following configuration to your `tailwind.config.js` file:

```js
module.exports = {
  content: [
    // ... your existing content
    "./node_modules/@saru-house/ui//.{js,ts,jsx,tsx}",
  ],
  plugins: [require("daisyui"), require("@tailwindcss/typography")],
};
```

## Usage

```tsx
import { Button, Card } from "@saru-house/ui";
function MyComponent() {
  return (
    <Card>
      <Card.Title>Hello World</Card.Title>
      <Card.Body>
        <p>This is a sample component using @saru-house/ui</p>
        <Button variant="primary">Click me</Button>
      </Card.Body>
    </Card>
  );
}
```

MIT © [Saru house]
npm package: @saru2/gemini-image-generator
Description: Reusable Gemini image generator component for React.
Latest version: 0.1.0

# @saru2/gemini-image-generator

Reusable "ImageGenerator" React component extracted from the Saru2 Gemini image playground. The component stays client-side only and posts prompts plus optional image uploads to your API.

## Installation

```bash
npm install @saru2/gemini-image-generator
# or
pnpm add @saru2/gemini-image-generator
```

## Usage

```tsx
"use client";

import { ImageGenerator } from "@saru2/gemini-image-generator";

export default function Playground() {
  return (
    <ImageGenerator
      endpoint="/api/generate-image"
      onResultChange={(result) => {
        if (result.type === "error") {
          console.error("Generation failed", result.message);
        }
      }}
    />
  );
}
```

The component ships with Tailwind-powered styles used by the Saru2 playground. You can pass a custom `className` to the root container or fork the component if you need a different look.

## Props

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `endpoint` | `string` | `"/api/generate-image"` | REST endpoint that accepts the JSON payload documented below. |
| `requestHeaders` | `HeadersInit \| (ctx) => HeadersInit` | `undefined` | Optional headers (static or dynamic) merged with `Content-Type: application/json`. Useful for auth tokens. |
| `fetchImplementation` | `typeof fetch` | global `fetch` | Provide a custom fetch implementation if needed (e.g. wrapped fetch with interceptors). |
| `className` | `string` | `undefined` | Appends extra classes to the outer `<section>`. |
| `onResultChange` | `(result: Result) => void` | `undefined` | Observe every state change (`idle`, `loading`, `error`, `image`, `text`). |
| `initialPrompt` | `string` | `""` | Prefill the textarea. |
| `defaultAspect` | `"1:1" \| "16:9" \| "9:16" \| "4:3" \| "3:4"` | `"1:1"` | Initial aspect ratio.

### Request body format

```json
{
  "prompt": "Final prompt string",
  "imageBase64": "base64 string (optional, legacy single-image field)",
  "mimeType": "image/png",
  "images": [
    {
      "mimeType": "image/png",
      "dataBase64": "..."
    }
  ]
}
```

If the user selects a non-square aspect ratio without uploads, the component attaches a blank PNG canvas to `images[0]` to hint orientation.

## Building locally

```bash
# from packages/image-generator
npm install
npm run build
```

The build emits ESM, CJS, and type declarations under `dist/`. Update the `name` field in `package.json` to match your npm scope before publishing.

## Publishing

```bash
npm login
npm publish --access public
```

Remember to bump the version for every release and keep your API handler compatible with the payload above.
npm package: @sarunas/income-tax-calculator
Description: ## Disclaimer
Author: Šarūnas Dubinskas
Latest version: 1.1.0

# Income Tax Calculator

## Disclaimer

"I will not take any responsibility if it will appear that I was wrong :)"

## How to use?

1. Clone repo `git clone git@github.com:sarunas/income-tax-calculator.git`
2. Run `npm install`
3. Copy issued shares report data to `shares-issued.txt`
4. Copy sold shares report data to `shares-sold.txt`
5. Run `npm run calc`, run `npm run calc:split` if wanna split gain with partner
6. Fill tax declaration
6. Enjoy!

## Example

`shares-issued.txt`:
```
28/02/2019 ESPP13783 ESPP 28/02/2019 10 109.25 $ 92.86 $
31/08/2018 ESPP12256 ESPP 31/08/2018 10 111.10 $ 63.79 $
31/08/2017 ESPP9013 ESPP 31/08/2017 10 65.10 $ 53.34 $
28/02/2018 ESPP10925 ESPP 28/02/2018 10 75.05 $ 54.78 $
14/06/2016 5535 RSU 14/09/2017 15 69.05 $ 0.00 $
14/06/2016 5535 RSU 14/12/2017 15 58.55 $ 0.00 $
14/06/2016 5535 RSU 14/03/2018 15 83.20 $ 0.00 $
14/06/2016 5535 RSU 14/06/2018 15 103.00 $ 0.00 $
14/06/2016 5535 RSU 14/09/2018 15 115.95 $ 0.00 $
14/06/2016 5535 RSU 14/12/2018 15 87.20 $ 0.00 $
14/06/2016 5535 RSU 14/03/2019 15 109.27 $ 0.00 $
14/06/2016 5535 RSU 14/06/2017 50 70.50 $ 0.00 $
```

`shares-sold.txt`:
```
2729432 Sell of Stock ESPP13783 28/02/2019 ESPP 13/03/2019 10 108.44 $ 92.86 $ 8.29 $
2575819 Sell of Stock ESPP12256 31/08/2018 ESPP 11/09/2018 8 111.60 $ 63.79 $ 10.11 $
2215151 Sell of Stock ESPP9013 31/08/2017 ESPP 06/09/2017 7 66.00 $ 53.34 $ 5.77 $
2365868 Sell of Stock ESPP10925 28/02/2018 ESPP 06/03/2018 10 79.60 $ 54.78 $ 6.71 $
2365869 Sell of Restricted Stock 5535 14/06/2016 RSU 06/03/2018 45 79.60 $ .00 $ 32.99 $
```
npm package: @sarunas/redux-debounce
Description: Dispatch actions with debounce
Author: Sarunas Dubinskas
Latest version: 0.1.1

redux-debounce
=============

Redux middleware to debounce your actions

```bash
npm install --save @sarunas/redux-debounce
```

## Usage

```js
import {createStore, applyMiddleware} from "redux";
import debounceActions from '@sarunas/redux-debounce';
import reducers from "./reducers";
import actionTypes from "./constants/actionTypes";

const defaultWait = 300
const defaultDebounceOption = { // https://lodash.com/docs#debounce
  leading: true,
  trailing: true
}

const middleware = debounceActions(defaultWait, defaultDebounceOption);
const store = applyMiddleware(middleware)(createStore)(reducers);
```

Then you just have to dispatch actions with the meta `debounce`:

```js
{
  type: 'ACTION_TYPE',
  meta: {
    debounce: true
  }
}

{
  type: 'ACTION_TYPE_2',
  meta: {
    debounce: 300 // wait time
  }
}

{
  type: 'ACTION_TYPE_3',
  meta: {
    debounce: {
      wait: 300,
      leading: false
    }
  }
}

```

There are 2 special actions exported by the library:

```js
import {CANCEL, FLUSH} from debounce;

dispatch({
  type: CANCEL,
  payload: {
    type: 'ACTION_TYPE'
  }
})

dispatch({
  type: FLUSH,
  payload: {
    type: ['ACTION_TYPE_2', 'ACTION_TYPE_3']
  }
})

dispatch({ // will flush everything
  type: FLUSH
})
```

Both of them can be used to respectively cancel or flush a debounced action.

## License

  MIT
npm package: @sarunyu/system-one
Description: A flexible React design system built for AI-powered web generation tools (v0, Lovable, Figma Make). Tailwind CSS v4 + CSS variables for full theming support.
Latest version: 1.0.2


  # Design System

  This is a code bundle for Design System. The original project is available at https://www.figma.com/design/nUKwypNXabHg9OzzUVd5uZ/Design-System.

  ## Running the code

  Run `npm i` to install the dependencies.

  Run `npm run dev` to start the development server.
npm package: @saryz/portal-bridge
Description: portal 桥接工具
Author: saryz
Latest version: 1.1.15

# @saryz/portal-bridge

用于iframe双向通信的封装

###### 未来计划

返回promise以便可以在 async/await 时使用使代码逻辑更清晰

## 安装 install

```
npm i @saryz/portal-bridge -S
```

### 快速使用 Quick to use

#### 监听 listen
javascript
```javascript
<script src="[path]/node_modules/@saryz/portal-bridge/dist/portal-bridge.min.js">代码</script>
// js使用的时候 需要PortalBridge对象
PortalBridge.PortalReceive.listen([key], [callback]) // 接收消息
PortalBridge.PortalSend.postToParent([key],[params],[callback]) // 发送消息
```
es6
```javascript
import { PortalReceive } from "@saryz/portal-bridge"

// key 为子父约定 
PortalReceive.listen(key, ({ data }) => {
  // do something
})
```

#### 触发 trigger

子->父 postToParent（子触发父方法）

```javascript
import { PortalSend } from "@saryz/portal-bridge"

const params = { ... }
// key 为子父约定 
PortalSend.postToParent(key, params)
```

父->子 postToIframe（父触发子方法）

```javascript
import { PortalSend } from "@saryz/portal-bridge"

const params = { ... }
// iframe:HTMLIFrameElement 
// const iframe = this.$refs.iframe // Vue
// const iframe = document.getElementById('iframe') // js
PortalSend.postToIframe(iframe, key, params)
```

#### 回调 callback
获取父页面数据 Get the parent page data
```javascript
/**** parent.js ****/
const key = 'getUserInfo'
const iframe = this.$refs.iframe
const params = { name: 'saryz', ... }
PortalReceive.listen(key, (data) => {
  console.log('Received data from iframe', data)
  PortalSend.postToIframe(iframe, key, params)
})

/**** child.js * example vue ****/
methods: {
  // get the parent page data 获取父页面数据
  getUserInfo()
  {
    const params = { msg: 'Please give me the user information' }
    const key = 'getUserInfo'
    PortalSend.postToParent(key, params, (data) => {
      console.log('parent page data', data)
      // do something
    })
  }
}
```
获取子页面数据 Get the child page data
```javascript
/**** child.js ****/
const key = 'submit'
const params = { name: 'saryz', ... }
PortalReceive.listen(key, (data) => {
  console.log('father need me', data)
  // do something or What also not stem
  PortalSend.postToParent(key, params )
})

/**** father.js * example vue ****/
methods: {
  // get the parent page data 获取父页面数据
  submit()
  {
    const params = { msg: 'Mahler gobi submit!' }
    const key = 'submit'
    const iframe = this.$refs.iframe
    PortalSend.postToIframe(iframe, key, params, ({data}) => {
      console.log('child data', data) // { name: 'saryz', ... }
      // do something
    })
  }
}
```
#### 接口 interface
```typescript
/**
 * 监听
 */
listen(methodName: string, callback: PortalBridgeCallback): void;

/**
* 发消息给iframe中的子页面
* @param iframe 必填，iframe对应的dom
* @param methodName 必填，通信名
* @param data 非必填，要传输的数据
* @param callback 非必填，通信回调，用于直接接收子级返回数据
*/
postToIframe(iframe: HTMLIFrameElement, methodName: string, data?: any, callback?: PortalBridgeCallback | undefined): void;

/**
* 发消息给父级页面
* @param methodName 必填,通信名
* @param data 非必填，要传输的数据
* @param callback 非必填，通信回调，用于直接接收父级返回数据
*/
postToParent(methodName: string, data?: any, callback?: PortalBridgeCallback | undefined): void;
```
npm package: @sas-irad/interfolio-api
Description: Library which contains methods that utilize Interfolio's API to retrieve data from an Interfolio instance
Author: J. Reuben Wetherbee
Latest version: 1.1.1

# Interfolio Api

Library which contains methods that utilize Interfolio's API to view and edit data from an Interfolio instance. 

## Background

This API middleware was developed by the University of Pennsylvania School of Arts and Sciences
for their integration with Interfolio.  As the integration did not require all available APIs
to be utilized there are many which have not yet been implemented.  Most of the endpoints are 
 related to the "Review Promotion and Tenure (RPT)" module.  You are free to use and further 
 development is certainly encouraged.  Visit the project wiki for information on how to contribute.
 

## Uses

The primary purpose of this library is to provide a typescript/javascript interface to the Interfolio API.
This library takes the grunt work out of actually making the calls to Interfolio.  It can be used as 
middle-ware to help script backend integrations.  Since the instantiation of the library
requires a private key to acheive authentication, it is not intended for use in a public 
front end application. 

## Installation

```bash
npm install @sas-irad/interfolio-api
```

## API Documentation

Documentation for all of the implemented API calls can be found on the [github documentation site](https://sas-irad.github.io/interfolio-api).

## Contributing

Developer guide for making (much appreciated) contributions can be found ont the [github wiki](https://github.com/sas-irad/interfolio-api/wiki).

## Getting Started

JavaScript Projects
```javascript
const INTERFOLIO_API = require('@sas-irad/interfolio-api/lib');

let api = new INTERFOLIO_API.API({
  "restUrl": "https://logic.interfolio.com", 
  "graphQlUrl": "https://caasbox.interfolio.com", 
  "tenantId": 99999, 
  "privateKey": "Interfolio supplied Private Key",
  "publicKey": "Interfolio supplied Public Key"
});
let units = await api.Tenure.Units.getUnits();
```

TypeScript Projects
```typescript
import API from '@sas-irad/interfolio-api/lib';

let api = new API({
  "restUrl": "https://logic.interfolio.com",
  "graphQlUrl": "https://caasbox.interfolio.com",
  "tenantId": 99999,
  "privateKey": "Interfolio supplied Private Key",
  "publicKey": "Interfolio supplied Public Key"
});
let units = await api.Tenure.Units.getUnits();
```

Once the ```api``` object has been instantiated you can run any of the implemented Interfolio API functions e.g.
```javascript
let units = await api.Tenure.Units.getUnits();
```
npm package: @sasabd/point-mcp-bridge
Description: MCP bridge for Point financial data server
Author: Point MCP Team
Latest version: 1.1.2

# Point MCP Bridge for Claude Desktop

Connect Claude Desktop to your Point financial data server with zero configuration.

## 🚀 Quick Start

### Step 1: Install the Bridge
```bash
# Install the bridge globally
npm install -g @sasabd/point-mcp-bridge

# Or use npx (no installation needed)
npx @sasabd/point-mcp-bridge --help
```

### Step 2: Start Your Point MCP Server
```bash
# In your Point MCP directory (with proper authentication configured)
python main.py --mode http --port 8001
```

### Step 3: Configure Claude Desktop

Add this to your Claude Desktop MCP configuration:

```json
{
  "mcpServers": {
    "point-mcp": {
      "command": "npx",
      "args": ["-y", "@sasabd/point-mcp-bridge", "http://localhost:8001"]
    }
  }
}
```

### Step 3: Restart Claude Desktop

### Step 4: Ask Questions!

```
"What financial tools are available?"
"Show me the legal persons in the system"
"Get portfolio performance for this month"
```

## 🌐 Production Usage

For deployed servers, just change the URL:

```json
{
  "mcpServers": {
    "point-mcp": {
      "command": "npx",
      "args": ["-y", "@point-mcp/claude-bridge", "https://your-app.azurecontainerapps.io"]
    }
  }
}
```

## 📊 Available Tools

- Portfolio management and analysis
- Performance metrics and returns
- Risk assessment tools
- Compliance reporting
- Asset allocation analysis
- And 11+ more financial tools

## 🔧 Troubleshooting

If Claude Desktop shows connection errors:

1. **Check server is running**: `curl http://localhost:8001/health`
2. **Verify tools loaded**: Should show `tools_loaded: 16`
3. **Restart Claude Desktop** after config changes

## 📝 Requirements

- Node.js 18+ (automatically handled by npx)
- Point MCP Server running in HTTP mode
- Claude Desktop with MCP support
npm package: @sasaki-dev/react-login
Description: Our Sasaki login page
Author: Eric Youngberg
Latest version: 1.1.0

# Sasaki's React Login 
### Standardized Firebase login pattern for Sasaki products


## Install
```
yarn add @sasaki-dev/react-login
```


## Example

```js
<ReactLogin
    // Firebase config
    config={config}

    // Image src path
    logo={DashiLogo}

    // Content for the user guide panel
    guide={<>
        <header>User Guide</header>
        <iframe title="User Guide" src="https://docs.google.com/document/d/e/2PACX-1vSxkp7VeI26uJyDZ7Pz_eV7ZKghZaQDDcbizP0YT0VthZmJ5iSwV3P8DzyA1KxA3DPO22xKVLeOK9bV/pub?embedded=true"></iframe>
    </>}

    // A list of screen grabs to display
    screens={[
        { src: TimelineScreen, alt: '', },
        { src: DataScreen, alt: '', },
        { src: ProjectDataScreen, alt: '', },
    ]}
/>

```


## Required Props

##### config: FirebaseConfig
Your app's Firebase config.


## Optional Props

##### contactEmail: string = 'strategies@sasaki.com'
Appears during certain phases of the login process when help might need to be 
requested directly.

##### contactLink: string
The destination of the "Contact" icon link. If nothing is supplied, the icon 
will not appear.

##### emailEnabled: boolean = true
If this is set to `false`, then the only option available is logging in with a 
Sasaki account.

##### guide: ReactElement
What is rendered when a user clicks the "User Guide" icon. If nothing is supplied, 
then the icon will not appear.

##### logo: string
Populates the `src` attribute of the image element that sits above the forms.

##### onChange: (user: User|null) => any
An event that is emitted whenever the auth state changes.

##### screens: { src: string, alt: string }[]
The images that fade in when the login component mounts. 

##### title: string|ReactElement
Text for beneath the the logo image.

##### whitelist: string[]
If supplied, will prevent users from creating accounts if the supplied email 
does not match any in the whitelist. If nothing is supplied, then all emails
are valid for new account creation.
npm package: @sasanfa/vite-plugin-vue
Description: Note: requires `@vue/compiler-sfc` as peer dependency. This is largely a port of `rollup-plugin-vue` with some vite-specific tweaks.
Author: Evan You
Latest version: 1.0.6

# @vitejs/plugin-vue [![npm](https://img.shields.io/npm/v/@vitejs/plugin-vue.svg)](https://npmjs.com/package/@vitejs/plugin-vue)

Note: requires `@vue/compiler-sfc` as peer dependency. This is largely a port of `rollup-plugin-vue` with some vite-specific tweaks.

```js
// vite.config.js
import vue from '@vitejs/plugin-vue'

export default {
  plugins: [vue()]
}
```

## Options

```ts
export interface Options {
  include?: string | RegExp | (string | RegExp)[]
  exclude?: string | RegExp | (string | RegExp)[]

  ssr?: boolean
  isProduction?: boolean

  // options to pass on to @vue/compiler-sfc
  script?: Partial<SFCScriptCompileOptions>
  template?: Partial<SFCTemplateCompileOptions>
  style?: Partial<SFCStyleCompileOptions>
}
```

## Example for passing options to `@vue/compiler-dom`:

```ts
import vue from '@vitejs/plugin-vue'

export default {
  plugins: [
    vue({
      template: {
        compilerOptions: {
          // ...
        }
      }
    })
  ]
}
```

## Example for transforming custom blocks

```ts
import vue from '@vitejs/plugin-vue'

const vueI18nPlugin = {
  name: 'vue-i18n',
  transform(code, id) {
    if (!/vue&type=i18n/.test(id)) {
      return
    }
    if (/\.ya?ml$/.test(id)) {
      code = JSON.stringify(require('js-yaml').safeLoad(code.trim()))
    }
    return `export default Comp => {
      Comp.i18n = ${code}
    }`
  }
}

export default {
  plugins: [vue(), vueI18nPlugin]
}
```

## License

MIT
npm package: @sasapanchama/joystick
Description: ## How to use
Author: sasapanchama
Latest version: 1.0.2

# @sasapanchama/joystick

## How to use

``` sample.bash
$ npm i @sasapanchama/joystick
or
$ yarn add @sasapanchama/joystick
```

``` index.html
<div id="container"></div>
```


``` script.ts
import { Joystick } from "@sasapanchama/joystick";  

const container = document.getElementById("container");  

const joystick = new Joystick(container);  

joystick.$outerCircle.addEventListener("touchmove", (event) => {  
  const { angle, velocity } = joystick.handleTouchMoveEvent(event);  
});  

joystick.$outerCircle.addEventListener("touchend", () => {  
  const { angle, velocity } = joystick.handleTouchEndEvent();  
});  
```

## Interface
This is a TypeScript class that implements a joystick control. It creates two HTML elements: a parent element and a child element, representing the joystick handle. It calculates the center coordinates of the parent element, sets the limit of the joystick handle movement, and handles touch events to move the joystick handle and return joystick data. The class has two public methods, setSize and handleTouchEndEvent, and two private properties, centerX and centerY.
JoystickData Interface

``` type.ts
export interface JoystickData {
  angle: number | null;
  velocity: number;
}
```

The JoystickData interface defines the data structure that the joystick handler returns when the joystick handle is moved or released. It has two properties:

- angle: the angle of the joystick handle in radians. If the joystick handle is at the center, the value is null.
- velocity: the distance of the joystick handle from the center normalized between 0 and 1.
npm package: @sasaplus1/keystroke
Description: manage keystroke
Author: sasa+1
Latest version: 3.0.0

# keystroke.js

[![JSR](https://jsr.io/badges/@sasaplus1/keystroke)](https://jsr.io/@sasaplus1/keystroke)

manage keystroke

## Installation

```sh
$ deno add jsr:@sasaplus1/keystroke
```

```sh
$ npm install @sasaplus1/keystroke
```

## Usage

```ts
import {
  type Keystroke,
  KeystrokeTree,
  parse,
  stringify,
} from "@sasaplus1/keystroke";

parse("cit"); // => [{code: "c", ... }, {code: "i", ... }, {code: "t", ... }]
parse("<C-x><C-c>"); // => [{code: "x", ctrl: true, ... }, {code: "c", ctrl: true, ... }]

stringify({ code: "i" } as Keystroke); // => "i"
stringify({ code: "f", ctrl: true } as Keystroke); // => "<C-f>"

const kt = new KeystrokeTree<() => string>();

kt.set("<C-x><C-c>", () => "exit");
kt.get("<C-x><C-c>")?.(); // => "exit"

kt.set("<C-x>6k", () => "close-session");
kt.get("<C-x>6k")?.(); // => "close-session"

kt.clear();
kt.get("<C-x>6k"); // => undefined
```

## License

The MIT license
npm package: @sasasamaes/platzom
Description: Traductor de idioma platzom
Author: sasasamaes
Latest version: 0.1.0

# platzom

Platzom es un idioma inventado para el [Curso de Fundamentos de Javascript](https://platzi.com/js) de [Platzi](https://platzi.com)

## Descriptción del idioma

- Si la palabra termina con "ar", se le quitan esas dos letras
- Si la palabra inicia con Z, se le añade "pe" al final
- Si la palabra traducida tiene 10 o más letras, se debe partir en dos por la mitad y unir con un guión medio
- Por último, si la palabra original es un palíndromo, ninguna regla anterior cuenta y se devuelve la misma palabra pero intercanado letras mayúsculas y minúsculas

## Instalación

```
npm install platzom
```

## Uso

```
import platzom from 'platzom'

platzom("Programar") // Program
platzom("Zorro") // Zorrope
platzom("Zarpar") // Zarppe
platzom("abecedario") // abece-dario
platzom("sometemos") // SoMeTeMoS
```

## Créditos
- [Sacha Lifszyc](https://twitter.com/@slifszyc)

## Licencia

[MIT](https://opensource.org/licenses/MIT)