open-index/open-npm huggingface dataset:
npm package: @shared-input/input-library
Description: This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 18.2.0.
Latest version: 0.0.4

# InputLibrary

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 18.2.0.

## Code scaffolding

Run `ng generate component component-name --project input-library` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project input-library`.
> Note: Don't forget to add `--project input-library` or else it will be added to the default project in your `angular.json` file. 

## Build

Run `ng build input-library` to build the project. The build artifacts will be stored in the `dist/` directory.

## Publishing

After building your library with `ng build input-library`, go to the dist folder `cd dist/input-library` and run `npm publish`.

## Running unit tests

Run `ng test input-library` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
npm package: @shared-solid/alert
Description: Framework-agnostic Alert component for React, SolidJS, and Remix
Latest version: 1.0.8

# @shared-solid/alert

Framework-agnostic Alert component for React, SolidJS, and Remix.

## Installation

```bash
npm install @shared-solid/alert
# or
yarn add @shared-solid/alert
# or
pnpm add @shared-solid/alert
```

## Usage

### React

```jsx
import { ReactAlert } from '@shared-solid/alert/react';
import '@shared-solid/alert/style.css';

function App() {
  return (
    <div>
      <ReactAlert variant="success" title="Success!" description="Operation completed successfully" />
      <ReactAlert variant="error" title="Error!" description="Something went wrong" closable onClose={() => console.log('closed')} />
      <ReactAlert variant="warning" title="Warning!" description="Please review your input" />
      <ReactAlert variant="info" title="Info" description="Here's some useful information" />
    </div>
  );
}
```

### SolidJS

```jsx
import { Alert } from '@shared-solid/alert/solid';
import '@shared-solid/alert/style.css';

function App() {
  return (
    <div>
      <Alert variant="success" title="Success!" description="Operation completed successfully" />
      <Alert variant="error" title="Error!" description="Something went wrong" closable onClose={() => console.log('closed')} />
      <Alert variant="warning" title="Warning!" description="Please review your input" />
      <Alert variant="info" title="Info" description="Here's some useful information" />
    </div>
  );
}
```

## Props

- `variant`: 'info' | 'success' | 'warning' | 'error' (default: 'info')
- `title`: string - Alert title
- `description`: string - Alert description
- `closable`: boolean (default: false)
- `onClose`: () => void - Close handler
- `children`: ReactNode - Alert content
- `class`: string - Additional CSS classes

## Bundle Optimization

🚀 **Optimized for production:**
- **React bundle:** ~1KB JS + ~3.5KB CSS
- **SolidJS bundle:** ~13KB JS + ~3.5KB CSS
- **Tree-shakable:** Only load what you need
- **Minified:** Production-ready builds

## CSS Files

- `style.css` - Alert styles (works for both React and SolidJS)

## Examples

### Success Alert
```jsx
<ReactAlert variant="success" title="Success!" description="Your changes have been saved" />
```

### Error Alert with Close
```jsx
<ReactAlert variant="error" title="Error!" description="Failed to save changes" closable onClose={handleClose} />
```

### Warning Alert
```jsx
<ReactAlert variant="warning" title="Warning!" description="Please check your input" />
```

### Info Alert
```jsx
<ReactAlert variant="info" title="Info" description="This is a helpful tip" />
```
npm package: @shared-solid/badge
Description: Framework-agnostic Badge component for React, SolidJS, and Remix
Latest version: 1.0.7

# @shared-solid/badge

Framework-agnostic Badge component for React, SolidJS, and Remix.

## Installation

```bash
npm install @shared-solid/badge
# or
yarn add @shared-solid/badge
# or
pnpm add @shared-solid/badge
```

## Usage

### React

```jsx
import { ReactBadge } from '@shared-solid/badge/react';
import '@shared-solid/badge/style.css';

function App() {
  return (
    <div>
      <ReactBadge variant="success">Completed</ReactBadge>
      <ReactBadge variant="warning" rounded>3</ReactBadge>
      <ReactBadge variant="error" size="lg">Error</ReactBadge>
      <ReactBadge variant="info">New</ReactBadge>
    </div>
  );
}
```

### SolidJS

```jsx
import { Badge } from '@shared-solid/badge/solid';
import '@shared-solid/badge/style.css';

function App() {
  return (
    <div>
      <Badge variant="success">Completed</Badge>
      <Badge variant="warning" rounded>3</Badge>
      <Badge variant="error" size="lg">Error</Badge>
      <Badge variant="info">New</Badge>
    </div>
  );
}
```

## Props

- `variant`: 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info' (default: 'primary')
- `size`: 'sm' | 'md' | 'lg' (default: 'md')
- `rounded`: boolean (default: false)
- `children`: ReactNode - Badge content (required)
- `class`: string - Additional CSS classes

## Bundle Optimization

🚀 **Optimized for production:**
- **React bundle:** ~0.6KB JS + ~2.3KB CSS
- **SolidJS bundle:** ~9.5KB JS + ~2.3KB CSS
- **Tree-shakable:** Only load what you need
- **Minified:** Production-ready builds

## CSS Files

- `style.css` - Badge styles (works for both React and SolidJS)

## Examples

### Status Badges
```jsx
<ReactBadge variant="success">Active</ReactBadge>
<ReactBadge variant="error">Failed</ReactBadge>
<ReactBadge variant="warning">Warning</ReactBadge>
<ReactBadge variant="info">Info</ReactBadge>
```

### Size Variants
```jsx
<ReactBadge variant="primary" size="sm">Small</ReactBadge>
<ReactBadge variant="primary" size="md">Medium</ReactBadge>
<ReactBadge variant="primary" size="lg">Large</ReactBadge>
```

### Rounded Badges
```jsx
<ReactBadge variant="primary" rounded>1</ReactBadge>
<ReactBadge variant="success" rounded>99+</ReactBadge>
<ReactBadge variant="error" rounded>!</ReactBadge>
```

### Notification Badges
```jsx
<ReactBadge variant="error">3</ReactBadge>
<ReactBadge variant="warning">12</ReactBadge>
<ReactBadge variant="success">✓</ReactBadge>
```