open-index/open-npm huggingface dataset:
npm package: @saurabh02/react-lib
Description: This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Latest version: 0.0.1

# React + TypeScript + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Oxc](https://oxc.rs)
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/)

## React Compiler

The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).

## Expanding the ESLint configuration

If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:

```js
export default defineConfig([
  globalIgnores(['dist']),
  {
    files: ['**/*.{ts,tsx}'],
    extends: [
      // Other configs...

      // Remove tseslint.configs.recommended and replace with this
      tseslint.configs.recommendedTypeChecked,
      // Alternatively, use this for stricter rules
      tseslint.configs.strictTypeChecked,
      // Optionally, add this for stylistic rules
      tseslint.configs.stylisticTypeChecked,

      // Other configs...
    ],
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.node.json', './tsconfig.app.json'],
        tsconfigRootDir: import.meta.dirname,
      },
      // other options...
    },
  },
])
```

You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:

```js
// eslint.config.js
import reactX from 'eslint-plugin-react-x'
import reactDom from 'eslint-plugin-react-dom'

export default defineConfig([
  globalIgnores(['dist']),
  {
    files: ['**/*.{ts,tsx}'],
    extends: [
      // Other configs...
      // Enable lint rules for React
      reactX.configs['recommended-typescript'],
      // Enable lint rules for React DOM
      reactDom.configs.recommended,
    ],
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.node.json', './tsconfig.app.json'],
        tsconfigRootDir: import.meta.dirname,
      },
      // other options...
    },
  },
])
```
npm package: @saurabh02/sav-dev-package
Description: This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Latest version: 0.0.1

# React + TypeScript + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) (or [oxc](https://oxc.rs) when used in [rolldown-vite](https://vite.dev/guide/rolldown)) for Fast Refresh
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh

## React Compiler

The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).

## Expanding the ESLint configuration

If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:

```js
export default defineConfig([
  globalIgnores(['dist']),
  {
    files: ['**/*.{ts,tsx}'],
    extends: [
      // Other configs...

      // Remove tseslint.configs.recommended and replace with this
      tseslint.configs.recommendedTypeChecked,
      // Alternatively, use this for stricter rules
      tseslint.configs.strictTypeChecked,
      // Optionally, add this for stylistic rules
      tseslint.configs.stylisticTypeChecked,

      // Other configs...
    ],
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.node.json', './tsconfig.app.json'],
        tsconfigRootDir: import.meta.dirname,
      },
      // other options...
    },
  },
])
```

You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:

```js
// eslint.config.js
import reactX from 'eslint-plugin-react-x'
import reactDom from 'eslint-plugin-react-dom'

export default defineConfig([
  globalIgnores(['dist']),
  {
    files: ['**/*.{ts,tsx}'],
    extends: [
      // Other configs...
      // Enable lint rules for React
      reactX.configs['recommended-typescript'],
      // Enable lint rules for React DOM
      reactDom.configs.recommended,
    ],
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.node.json', './tsconfig.app.json'],
        tsconfigRootDir: import.meta.dirname,
      },
      // other options...
    },
  },
])
```
npm package: @saurabh05/nexo-ui
Description: A modern, flexible design system built with React, Vite, and Storybook.
Latest version: 4.1.0

# Nexo UI

A modern, flexible design system built with React, Vite, and Storybook.

![NPM Version](https://img.shields.io/npm/v/@saurabh05/nexo-ui)
![License](https://img.shields.io/npm/l/@saurabh05/nexo-ui)

## Installation

Install the package via npm:

```bash
npm install @saurabh05/nexo-ui
```

## Setup

Start by importing the global CSS file in your application's entry point (e.g., `main.tsx` or `App.tsx`):

```tsx
import '@saurabh05/nexo-ui/dist/nexo-ui.css';
```

## Components

### Button

A versatile button component with multiple variants and states.

```tsx
import { Button } from '@saurabh05/nexo-ui';
import { FaArrowRight } from 'react-icons/fa';

function App() {
  return (
    <div style={{ display: 'flex', gap: '1rem' }}>
      <Button variant="primary">Primary Button</Button>
      <Button variant="secondary" size="lg">
        Secondary Large
      </Button>
      <Button variant="outline" icon={<FaArrowRight />} iconPosition="right">
        Next Step
      </Button>
      <Button isLoading>Processing</Button>
    </div>
  );
}
```

**Props:**

- `variant`: `primary` | `secondary` | `outline` | `text` | `danger`
- `size`: `sm` | `md` | `lg`
- `isLoading`: `boolean`
- `disabled`: `boolean`
- `customColor`: `string`
- `icon`: `ReactNode`
- `iconPosition`: `left` | `right`

### Loading

A comprehensive loading component with spinners, dots, and overlays.

```tsx
import { Loading } from '@saurabh05/nexo-ui';

function App() {
  return (
    <>
      {/* Default Spinner */}
      <Loading />

      {/* Dots Variant */}
      <Loading variant="dots" color="#ff5722" />

      {/* Full Screen Overlay with Message */}
      <Loading fullScreen blur message="Loading application..." />
    </>
  );
}
```

**Props:**

- `variant`: `spinner` | `dots` | `custom`
- `size`: `sm` | `md` | `lg`
- `color`: `string`
- `message`: `string`
- `src`: `string` (for custom image/gif)
- `overlay`: `boolean`
- `fullScreen`: `boolean`
- `blur`: `boolean`

## Development

To run the Storybook environment locally:

1.  Clone the repository.
2.  Install dependencies: `npm install`
3.  Start Storybook: `npm run storybook`

## License

MIT