open-index/open-npm huggingface dataset:
npm package: @json-render-echarts/registry
Description: React registry for ECharts components
Latest version: 1.1.1

# @json-render-echarts/registry

React components and registry for rendering Apache ECharts using `json-render`.

## Installation

```bash
npm install @json-render-echarts/registry @json-render-echarts/schemas
```

Note: This package requires `react`, `react-dom`, `echarts`, and `echarts-for-react` as peer dependencies.

## Usage

Register the components in your React application using the registry.

```tsx
import { Renderer } from '@json-render/react';
import { echartsRegistry } from '@json-render-echarts/registry';

function AnalyticsPage({ uiTree }) {
  return (
    <div className="analytics-container">
      <Renderer 
        tree={uiTree} 
        registry={echartsRegistry} 
      />
    </div>
  );
}
```

## Features

- **Standardized Options:** Automatically maps simplified JSON properties to complex ECharts configurations.
- **Responsive:** Inherits height and layout settings from the JSON configuration.
- **Extensible:** Built on top of `echarts-for-react`.

## License

MIT
npm package: @json-render-echarts/schemas
Description: Zod schemas for ECharts catalog components
Latest version: 1.1.1

# @json-render-echarts/schemas

Zod schemas for Apache ECharts components in the `json-render` ecosystem.

## Why use this?

ECharts has thousands of properties and deeply nested structures. These schemas provide a **simplified, type-safe abstraction** that is:
1. **AI-Friendly:** Reduces hallucination by limiting available properties.
2. **Type-Safe:** Provides full TypeScript types and Zod validation.
3. **Standardized:** Aligned with official ECharts top-level options.

## Installation

```bash
npm install @json-render-echarts/schemas
```

## Included Schemas

- **BaseChartSchema:** Common options like title, legend, grid, tooltip, and toolbox.
- **BarChartSchema**
- **LineChartSchema**
- **AreaChartSchema**
- **PieChartSchema**
- **ScatterChartSchema**

## Usage

```typescript
import { BarChartSchema } from '@json-render-echarts/schemas';

// Use for catalog generation
const echartsCatalog = {
  BarChart: BarChartSchema,
};
```

## License

MIT