open-index/open-npm huggingface dataset:
npm package: @parth-patel-25/simple-button
Description: A simple, reusable React Button component library built with TypeScript and Vite.
Author: parth patel
Latest version: 0.1.0

# Simple Button Library

A minimal, reusable React Button component library built with TypeScript and Vite.

## Install

```bash
npm install @your-scope/simple-button
# or
yarn add @your-scope/simple-button
# or
pnpm add @your-scope/simple-button
```

## Usage

```tsx
import * as React from "react";
import { Button } from "@your-scope/simple-button";

export function App() {
  return (
    <div>
      <Button variant="primary" size="md" onClick={() => alert("Clicked!")}>
        Click me
      </Button>
    </div>
  );
}
```

### Props

- **variant**: `"primary" | "secondary" | "ghost"` (default: `"primary"`)
- **size**: `"sm" | "md" | "lg"` (default: `"md"`)
- Inherits all standard `button` attributes.

## Development

- `npm run dev`: local playground (if you add one)
- `npm run build`: builds library to `dist/` with `.d.ts` types

See `GUIDE.txt` for full publishing instructions.

## License

MIT
npm package: @parthil-savaliya/rn-architecture-skill
Description: AI-powered skill installer that generates production-ready React Native architecture with best practices and scalable patterns.
Latest version: 2.0.2

# 🧠 RN Blueprint Skills

## AI Skill Installer for Production-Grade React Native Architecture

<p align="center">

[![React Native](https://img.shields.io/badge/React_Native-20232A?style=for-the-badge&logo=react&logoColor=61DAFB)](https://reactnative.dev/)
[![Node.js](https://img.shields.io/badge/Node.js-339933?style=for-the-badge&logo=nodedotjs&logoColor=white)](https://nodejs.org/)
[![TypeScript](https://img.shields.io/badge/TypeScript-007ACC?style=for-the-badge&logo=typescript&logoColor=white)](https://www.typescriptlang.org/)

</p>

---

## 🤖 AI Tools & Skill Ecosystem

<p align="center">

[![Cursor](https://img.shields.io/badge/Cursor-000000?style=for-the-badge&logo=cursor&logoColor=white)](https://cursor.sh/)
[![Claude](https://img.shields.io/badge/Claude_AI-111111?style=for-the-badge&logo=anthropic&logoColor=white)](https://www.anthropic.com/)
[![GitHub Copilot](https://img.shields.io/badge/GitHub_Copilot-000000?style=for-the-badge&logo=githubcopilot&logoColor=white)](https://github.com/features/copilot)
[![OpenAI Codex](https://img.shields.io/badge/OpenAI_Codex-412991?style=for-the-badge&logo=openai&logoColor=white)](https://openai.com/)
[![Antigravity](https://img.shields.io/badge/Antigravity-Architecture--AI-0A0A0A?style=for-the-badge)](#)

</p>

---

## 🚀 Overview

**RN Blueprint Skill** is an **AI-driven architecture generator** for React Native projects.

It installs and applies **production-grade architectural patterns** so teams don’t waste time reinventing folder structures, conventions, and setup decisions.

Think of it as an **AI architect** for React Native.

---

## ✨ Key Features

- 🧠 AI-powered architecture generation
- 🏗️ Production-ready folder structure
- 🔁 Scalable state management patterns
- 🔐 Enterprise-friendly conventions
- 📦 Opinionated but customizable
- ⚡ Zero-config CLI usage

---

## 📦 Usage

No global installation required.

```bash
npx @parthil-savaliya/rn-architecture-skill
```
npm package: @parthpilkhann/circular-carousel-react
Description: A zero-dependency React circular card carousel with responsive mobile & desktop views.
Latest version: 1.0.0

# circular-carousel-react

A **zero-dependency** React circular card carousel with responsive mobile & desktop layouts. Built with TypeScript. Uses only inline CSS — no external styling libraries needed.

## Installation

```bash
npm install circular-carousel-react
```

> **Peer dependencies:** This library requires `react >= 17.0.0` and `react-dom >= 17.0.0`.

## Usage

```tsx
import CircularCarousel from "circular-carousel-react";
import type { CardData } from "circular-carousel-react";

const cards: CardData[] = [
  {
    id: "1",
    image: "https://example.com/image.jpg",
    title: "Card Title",
    description: "A short description of the card.",
    link: "/some-link",
  },
  // ... more cards (recommended: 4–8)
];

function App() {
  return (
    <CircularCarousel
      cards={cards}
      heading="Featured"
      accentColor="#b80b0b"
      onCardClick={(card) => console.log(card)}
    />
  );
}
```

## Props

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| `cards` | `CardData[]` | `[]` | **Required.** Array of card data objects. |
| `heading` | `string` | `""` | Optional heading text displayed above the carousel. |
| `accentColor` | `string` | `"#b80b0b"` | Accent colour for the CTA button. |
| `breakpoint` | `number` | `768` | Pixel width threshold to switch between mobile and desktop layouts. |
| `onCardClick` | `(card: CardData) => void` | — | Callback fired when the "Read more" button is clicked. |

## `CardData` Interface

```ts
interface CardData {
  id: string;
  image: string;       // URL to the card image
  title: string;       // Card title text
  description: string; // Card description text
  link: string;        // URL or path (passed via onCardClick)
}
```

## Features

- 🎡 **Circular rotating wheel** with smooth CSS transitions
- 📱 **Responsive** — automatically switches between mobile and desktop layouts
- 🎨 **Customisable accent colour** for CTA buttons
- ⏸️ **Pause on hover** (desktop) — auto-resumes when cursor leaves
- 🔧 **Zero dependencies** — only requires React as a peer dependency
- 📦 **TypeScript-first** — ships with full type declarations

## Development

```bash
# Install dependencies
npm install

# Start the demo app
npm run dev

# Build the library
npm run build
```

## License

MIT
npm package: @parththakkar08/fb-timezone-converter
Description: Convert dates to Facebook Account timezones by ID
Author: Parth Thakkar
Latest version: 1.0.0

# fb-ad-timezone-converter

Convert dates into Facebook Ad Account timezones by ID.

## Usage

```js
const { convert } = require('fb-ad-timezone-converter');

const result = convert(71, '2025-08-01T10:00:00Z');
console.log(result);
```
npm package: @partially-applied/decimal-to-binary
Description: Takes a decimal value and outputs the binary value as an array
Latest version: 0.0.1


`@partially-applied/dec-to-bin`

Takes a decimal value and outputs the binary value as an array.

**Quick Guide in Code**

```livescript

dec-to-bin = require '@partially-appled/dec-to-bin'

console.log dec-to-bin 0 # [0]

console.log dec-to-bin 1 # [1]

console.log dec-to-bin 2 # [1,0]

console.log dec-to-bin 3 # [1,1]

```

`type-signature`

`
dec-to-bin :: Int -> [Bool,..Bool]
`


**Todo**

- reduce final `.reverse`
npm package: @partially-applied/enumerate-binary-set
Description: generates binary number line
Latest version: 0.0.2

`@partially-applied/enumerate-binary-set`

For a  given integer<sub>10</sub> *x* , it generates the range of integers<sub>2</sub> up to *x*.

To view it in another way, it lists the binary number line up to a given value ( in base 10 ).

**Quick Guide in Code**

```livescript

enumerate = require "@partially-applied/enumerate-binary-set"

enumerate 1 # [ [ 0 ] ]

enumerate 2 # [ [ 0 ] , [ 1 ] ]

enumerate 3 # [ [ 0 ], [ 1 ], [ 1, 0 ] ]


# Use of padding to normalize array length

# maintain a minimum length of 2 
enumerate 3,2 # [ [ 0, 0 ], [ 0, 1 ], [ 1, 0 ] ]

# maintain a minimum length of 3
enumerate 3,3 # [ [ 0, 0, 0 ], [ 0, 0, 1 ], [ 0, 1, 0 ] ]

```



`type signature`

`
:: (range,padding) -> [[Int,..Int]..[Int,..Int]]
`

**API**

- `range` 
    - should be a base 10 value
    - should be an integer
    - first argument provides the number of values you want to enumerate from 0.

- `padding`
    - padding is a helper argument that adds zeros to the start of the value in case its shorter then the padding value
npm package: @partially-applied/flip
Description: flip all arguments
Latest version: 1.0.0



```haskell
flip :: (a -> b -> c ...... x -> y -> z) -> (z -> y -> x ...... c -> b -> a)
```
###Install

```npm install @partially-applied/flip```


###Usage
```livescript

flip = require '@partially-applied/flip'

f = (a,b,c) -> (a + b)*c # generic functions

opposite = flip f

f 1,2,3 # (1 + 2)*3 = 9

opposite 1,2,3 # (3 + 2)*1 = 5

# curried by default 

flip f,1,2,3 # (3 + 2)*1 = 5

only-a = opposite 1 # [Function]

only-a-b = only-a 2 # [Function]

only-a-b 3 # (3 + 2)*1 = 5
```


### Why

1. Ramda [`flip`](http://ramdajs.com/docs/#flip) only flips the first two arguments.

2. flip was written to bring another API change to Ramda. Ramda [`compose`](http://ramdajs.com/docs/#compose) composes a function from right to left. 

```livescript

_ = require 'ramda'

f = _.curry (x,y) -> x + y

g = _.curry (x,y) -> x*y

h = _.compose (f 1),(g 2) # h = (x) -> 2*x + 1

h 5 # 11

flip = require '@partially-applied/flip'


j = (flip _.compose) (f 1),(g 2) # j = (x) -> (1 + x)*2 

j 5  # 12

```

**why would we need to shift the order of compose ?**

good question, it is to assist in using `livescript` do syntax:


```livescript

_ = require 'ramda'

flip = requre '@partially-applied/flip'

compose = flip _.compose

add = _.curry (x,y) -> x + y

multiply = _.curry (x,y) -> x*y

h = compose do
    add 1
    multiply 2
    add 2
    multiply 4
    add 3


h # h = (x) -> ((1 + x)*2 + 2)*4 + 3

```



For more information about why use `compose` or `ramda` I suggest reading 
[Chapter 5:Coding by Compose](https://github.com/MostlyAdequate/mostly-adequate-guide/blob/master/ch5.md)
npm package: @partially-applied/inspector
Description: fast schema validator for nested json
Latest version: 1.0.1


![](http://imgur.com/CWdlttG.jpg)


*fast schema validator for nested json*



```

npm install @partially-applied/inspector

```

### Quick Guide

```livescript

inspector = require('@partially-applied/inspector').default

lo = require('lodash')

S = lo.isString

schema =
 a:S
 b:
   c:S
   d:S

testInput1 = # Correct Input
 a:"hello"
 b:
   c:"foo"
   d:'world'


tester = inspector(schema)

console.log tester testInput1 # [true]

testInput2 = # Incorrect Input
 a:"hello"
 b:
  *c:"foo"
   d:1


console.log(tester(testInput2)) # [false,['b','d']]

```



Features

- Performance
- Small API surface
- Error handling inspired from studying the writer monad.

Docs

- I have written a [short post](https://github.com/partially-applied/inspector/blob/master/doc/guide.md) that details the context under which `@partially-applied/inspector` is useful. 

- The [API guide](https://github.com/partially-applied/inspector/blob/master/doc/api.md) on the otherhand is for quick referencing purpose.
npm package: @partially-applied/material-colors
Description: material colors as lists
Latest version: 1.0.4

### Material Colors


Material colors as object and lists

```javascript
colors = require ('@partially-applied/material-colors')

colors.red[0] // 100 red

colors.purple[9] //900 purple

colors.blue[10] // A100 blue

color.white //'#000000'

coolor.black // '#FFFFFF'
```


### color-names

- red
- pink
- purple
- deep-purple
- indigo
- blue
- light-blue
- cyan
- teal
- green
- light-green
- lime
- yellow
- amber
- orange
- deep-orange
- brown
- grey
- blue-grey
npm package: @partially-applied/material-dropdown
Description: material dropdown
Latest version: 0.0.2

## DropDown


### Model

(component wont work if options and default is not passed)

```livescript
Model =
 options: # What options the dropdown shows
  "Afghanistan"
  "Bahamas"
  "Cambodia"
  "India"
  "Pakistan"
  "USA"
  "UK"
  "Canada"
  "Ukraine"
 default:2 # Since options is an array - provide default value 
 onchange:[] # attach either an array of functions or just a single function on onchange to get 
 # notification  when the user interacts with the dropdown. the event handler returns the Model 
 # Object with Model.value updated.
```

### Params

```livescript

### Params

defaultParams = 
  scroll:
    style:
      padding-left:"1em"
      padding-right:"1em"
    maxHeight:"10em"
  valuebox:
    style:
      padding-bottom:"0.1em"
```

### How to use

```livescript

createDropDown = require "./dropdown" # Returns vNode constructor function.

```


```livescript
VNode = createDropDown Model,Params # returns the VNode, accepts 2 objects - models and params. 
```

### Notes

In situations where the model is changed *exterally or via another componenet* we could have exposed a `VNode.data.redraw()` function, however this requires that other components which updates model values to know the dependency graph / information about each Model value.

Its much simpler to let `onchange` keep track of dependencies and update them. 

#### How does it work ? 

Observe

```livescript
console.log Model.onchange # => []
VNode = createDropDown Model,Params 
console.log Model.onchange # => [fn]
```

The component constructor pushes the update function onto the `Model.onchange` array. 

What this means is all long as *any* other componenet that makes changes on Model calls all the functions attached to `onchange` all the component level redraws gets called, and each component does not need to keep track of other components effected by changing the model. 

Using the `'./utils'` helpers functions in this component.

```livescript
# ./fooComponent

{eventReact,Events} = require './utils'

create = (Model,Params2 = {}) -> # Model is same as above
  #....
  #....
  #....

  Ctrl = {}

  Ctrl.Model = Model 

  signalFn = Events update Ctrl # Ctrl.Model is passed onto update function
  
  #....
  #....
  #....


update = (Ctrl,signalOb) -> 
  
  
  #....
  #....
  #....

  {Model} = Ctrl # Extract Model

  switch signalOb.eventName

  #....
  #....
  #....

  | "makeModelChanges" => # some signal that notifes that some change needs to be made to the Model

    Model.value = 6 # make some change to model

    eventReact Model # Update other components that depend on Model

  #....
  #....
  #....

```


How you structure `fooComponent` is based on what you think is best - but the **important** thing is to call all functions attached to onchange.
npm package: @partially-applied/simple-log
Description: helper function for logging
Latest version: 0.0.2



## simple-log

#### helper functions for logging

```

npm install @partially-applied/simple-log

```

### How to use

```livescript


simple-log = require '@partially-applied/simple-log'


log = simple-log! # its possible to pass a config param to the constructor

# log has only functions

log.generic 'Error: Test Error'

log.stack! # logs the stack error


```

## Options

```livescript

colors = require 'colors/safe'

# defaults

colors:
    *error:colors.red # color of text
stack:
    *min:1 # start line of stack error string
     max:5 # end line of stack error string
display:
    *stack:true # set false to turn off logging for stack error
     generic:true # set false to turn off logging for generic error

```


### Notes

- Setting generic to `false` **will also silence stack** 

### Changing Configration

- changing stack options from function 

```livescript

simple-log = require '@partially-applied/simple-log'

log = simple-log!

log.stack 0,2

# Error
#    at log.stack (C:\working\simple-log\simple-log.js:38:11)

log.stack 1,3

# at log.stack (C:\working\simple-log\simple-log.js:38:11)
#    at Object.<anonymous> (C:\working\simple-log\test.js:7:8)
#    at Module._compile (module.js:409:26)

```

- changing `display.stack` option

```livescript

simple-log = require '@partially-applied/simple-log'

log = simple-log (display:(stack:false))


log.stack! # nothing gets logged - no side effects.

```
npm package: @partially-applied/utils
Description: utility function
Latest version: 0.0.1

# `@partially-applied/utils`

generic functions

- `create`
    - `whitespace`
    ```livescript
    whitespace 1 # " "
    whitespace 2 # "  " 
    whitespace 5 # "     " [1]
    whitespace 5 # "     " returns cached string from [1]
    
    ```
npm package: @partially-applied/whitespace
Description: creates whitespace
Latest version: 0.0.1

**Install**

```
npm install @partially-applied/whitespace 
```

**How to Use**

```livescript

whitespace = require '@partially-applied/whitespace'

whitespace 1 # " "
whitespace 2 # "  " 
whitespace 5 # "     " [1]
whitespace 5 # "     " returns cached string from [1]

```