open-index/open-npm huggingface dataset:
npm package: @legible-sync/example-nextjs-sse
Description: Next.js SSE example using LegibleSync framework
Author: Mauro Stepanoski
Latest version: 1.3.1

# @legible-sync/example-nextjs-sse

Next.js example demonstrating Server-Sent Events (SSE) with LegibleSync framework.

## Features

- Real-time comment system using SSE
- Comments stored in CSV file
- Automatic logging of comment creation
- Next.js 14+ with App Router

## Getting Started

1. Install dependencies:
   ```bash
   npm install
   ```

2. Run in development mode:
   ```bash
   npm run dev
   ```

3. Open [http://localhost:3000/comments](http://localhost:3000/comments)

## API Endpoints

- `GET /api/comments` - Retrieve all comments
- `POST /api/comments` - Create a new comment
- `GET /api/comments/stream` - SSE stream for real-time updates
npm package: @legion-lib/react-breadcrumb
Description: React Breadcrumb Component
Author: legion
Latest version: 1.0.0

react-breadcrumb
=========================
![react-breadcrumb](https://raw.githubusercontent.com/9softstudio/React-components/master/react-breadcrumb/screenshots/react-breadcrumb.jpg)
## Install
```
npm i @legion-lib/react-breadcrumb
```
## Usage
```javascript
import { Breadcrumb } from '@legion-lib/react-breadcrumb'

export default class App extends Component {
    constructor(props) {
        super(props);
        this.state = {
            level: 3
        };
    }

    render() {
        const items = [];
        items.push({ label: "Level 1", value: 1, });
        items.push({ label: "Level 2", value: 2, });
        items.push({ label: "Level 3", value: 3, });

        return (
        <div>
        <Breadcrumb items={items} value={this.state.level} onChange={(item) => this.setState({level: item.value})}/>
        <div>
            Level : {this.state.level}
        </div>
        </div>
        )
    }
}
```

## License

MIT
npm package: @legion-lib/react-multiselect
Description: React MultiSelect Component
Author: Chubby Walter
Latest version: 2.1.6

react multiselect
=========================
React 16

Supported languages: en-US (default), zh-TW, zh-CN, zh-Hans
## Install
```
npm i @9legionlib/react-multiselect
```
## Screenshot

<img src="https://raw.githubusercontent.com/9softstudio/React-components/master/react-multiselect/screenshots/ReactMultiselect.jpg" />

## Usage
```javascript
import React, { Component } from 'react'
import ReactDOM from 'react-dom'

import MultipleSelect from '@9legionlib/react-multiselect'

export default class App extends Component {
    constructor(props) {
        super(props);
        this.data = [];

        for(let i = 1; i < 100; i++){
            this.data.push({
                Id: i,
                Name: "Item " + i,
                Checked: true
            });
        }
    }

    render() {
        return (
            <div>
                <h1>Multi Select</h1>
                <div style={{width: "400px"}}>
                    <MultipleSelect
                        id="SelectList"
                        language='en-US'
                        dataSource={this.data}
                        keyField="Id"
                        valueField="Name"
                        statusField="Checked"
                        hasSearchBox={true} />
                </div>
            </div>
        );
    }
}

ReactDOM.render(<App />, document.getElementById("app"));
```

## License

MIT
npm package: @legion-rnd/react-core
Author: Legion Team
Latest version: 0.0.3

# Legion UI React


## For Local R&D
Creat file `main.tsx` and copy this code
```js
import ReactDOM from 'react-dom/client'
import App from './app'
import './style.scss'

ReactDOM.createRoot(document.getElementById('root')!).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
)

```
create file `app.tsx` and import in `main.tsx` and then you do anything in app component. And then `yarn dev` or `npm run dev`

## Running Local Project
```js
// for run R&D
yarn dev
// or
npm run dev

// for run unit test
yarn test
// or
npm run test


// for run storybook
yarn storybook
// or
npm run storybook
```
npm package: @legionai/mcp
Description: Legion MCP Server - OAuth app management and Railway logs access for AI agents
Latest version: 2.0.0

# Legion MCP Server

MCP server for AI agent integration — manage OAuth apps and access deployment logs from Claude Code, Cursor, or Windsurf.

For CLI commands (login, app management, log sources), install `@legionai/cli`.

## Installation

```bash
npm install -g @legionai/mcp
```

## Login (requires @legionai/cli)

```bash
npm install -g @legionai/cli
legion login
```

## Configuration

Add to your MCP config (e.g., `~/.config/claude/mcp.json`):

```json
{
  "mcpServers": {
    "legion": {
      "command": "legion-mcp",
      "env": {
        "LEGION_AUTH_SERVER_URL": "https://auth.legion-ai.org",
        "LEGION_ACCESS_TOKEN": "<your_token>"
      }
    }
  }
}
```

## Available Tools

### OAuth App Management (8 tools)

| Tool | Description |
|------|-------------|
| `legion_list_oauth_apps` | List all OAuth apps on your account |
| `legion_get_oauth_app` | Get details of an OAuth app by client ID |
| `legion_create_oauth_app` | Create a new OAuth app |
| `legion_update_oauth_app` | Update OAuth app name or redirect URIs |
| `legion_delete_oauth_app` | Delete an OAuth app (revokes all connections) |
| `legion_rotate_app_secret` | Rotate an OAuth app's client secret |
| `legion_get_oauth_app_stats` | Get usage stats (users, tokens, earnings) |
| `legion_get_oauth_app_transactions` | Get transaction history (prompts, costs) |

### API Documentation (1 tool)

| Tool | Description |
|------|-------------|
| `legion_get_api_docs` | Get full API docs (request format, models, errors) |

### Deployment Logs (5 tools)

| Tool | Description |
|------|-------------|
| `legion_list_railway_sources` | List connected Railway log sources |
| `legion_connect_railway_source` | Connect a Railway deployment as a log source |
| `legion_get_deployment_logs` | Fetch deployment logs with filters |
| `legion_get_deployment_errors` | Fetch error-level deployment logs only |
| `legion_disconnect_railway_source` | Remove a Railway log source connection |

## Usage Example

Once configured, ask your AI agent:

- "List my OAuth apps and their stats"
- "Create a new OAuth app called my-saas with redirect URI https://myapp.com/callback"
- "Check my deployment logs for errors"
- "Connect my Railway deployment for debugging"

## Security

- All access is authenticated via your Legion account
- You can only access logs for Railway deployments you've connected
- Tokens are encrypted at rest
- Access is rate-limited (30 requests/minute)
npm package: @legionai/sdk
Description: Connect your app to Legion wallets and let users pay for AI with their own funds.
Latest version: 0.1.0

# Legion SDK

Connect your app to Legion wallets and let users pay for AI with their own funds.

## Installation

```bash
npm install @legionai/sdk
```

## Quick Example

```javascript
import { createLegion } from '@legionai/sdk';

const legion = createLegion({
  clientId: 'your_client_id',
});

// Connect user's wallet
legion.connect({ redirectUri: 'https://yourapp.com/callback' });

// After callback, exchange code for tokens
const tokens = await legion.exchangeCode(code);

// Make API calls - costs come from user's wallet
const response = await legion.chat([
  { role: 'user', content: 'Hello!' }
]);
```

## Documentation

- **[Quickstart](./docs/quickstart.md)** - Get started in 5 minutes
- **[Authentication Guide](./docs/authentication.md)** - OAuth flow, tokens, and session management
- **[Error Handling](./docs/error-handling.md)** - Handle errors gracefully
- **[API Reference](./docs/api-reference.md)** - Complete API documentation

## How It Works

1. User authorizes your app to use their Legion wallet
2. You get tokens to make API calls on their behalf
3. AI costs are charged to the user's wallet, not yours
4. Users control spending limits and can deactivate anytime

## Key Features

- **Zero AI costs for developers** - Users pay from their own wallets
- **Simple OAuth flow** - Standard authorization, familiar to users
- **Auto token refresh** - SDK handles token lifecycle automatically
- **Graceful error handling** - Structured errors with helper methods
- **User control** - Users set limits and can disconnect anytime

## Error Handling

```javascript
try {
  await legion.chat(messages);
} catch (error) {
  if (error.requiresReauth()) {
    legion.connect(); // Re-authorize
  } else if (error.isBillingError()) {
    showMessage('Please add funds to your Legion wallet');
  }
}
```

## Support

- Documentation: [docs/](./docs/)
- Issues: [GitHub Issues](https://github.com/legion/sdk-js/issues)

## License

MIT