@jini-ai/ui 0.4.9 → 0.5.1

package/dist/features/interactive-ui/providers/recharts/chart.js

@@ -1,34 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { createContext, useContext, useId } from 'react';
-import { ResponsiveContainer } from 'recharts';
-import { formatChartValue } from './chart-config.js';
-import { CHART_PRIMARY_COLOR } from './chart-tokens.js';
-const ChartContext = createContext({});
-/** Shared, measurable chart frame with an accessible caption and a wrapping legend. */
-export function ChartContainer({ config, title, description, children }) {
-    const id = useId();
-    return (_jsx(ChartContext.Provider, { value: config, children: _jsxs("figure", { className: "jini-chart", "aria-label": title, "aria-describedby": `${id}-description`, children: [_jsxs("figcaption", { className: "jini-chart-caption", children: [_jsx("span", { children: title }), _jsx("span", { id: `${id}-description`, children: description })] }), _jsx(ResponsiveContainer, { width: "100%", height: 300, minWidth: 0, children: children }), _jsx(ChartLegendContent, {})] }) }));
-}
-/** Shadcn-style tooltip card; series config owns both labels and swatch colors. */
-export function ChartTooltipContent({ active, label, payload = [] }) {
-    const config = useContext(ChartContext);
-    const entries = payload.filter((entry) => entry.type !== 'none' && entry.value != null);
-    if (!active || entries.length === 0)
-        return null;
-    return (_jsxs("div", { className: "jini-chart-tooltip", role: "tooltip", "aria-live": "polite", "aria-atomic": "true", children: [label != null && _jsx("div", { className: "jini-chart-tooltip-label", children: label }), _jsx("div", { className: "jini-chart-tooltip-items", children: entries.map((entry, index) => {
-                    // Pie names may repeat; its internal key keeps swatches tied to the actual slice.
-                    const dataKey = String(entry.dataKey ?? entry.name);
-                    const key = Object.hasOwn(config, dataKey) ? dataKey : entry.payload?._jiniChartKey ?? dataKey;
-                    const series = Object.hasOwn(config, key) ? config[key] : undefined;
-                    return (_jsxs("div", { className: "jini-chart-tooltip-item", children: [_jsx("span", { className: "jini-chart-swatch", style: { backgroundColor: series?.color ?? entry.color ?? CHART_PRIMARY_COLOR }, "aria-hidden": "true" }), _jsx("span", { className: "jini-chart-tooltip-name", children: series?.label ?? String(entry.name ?? entry.dataKey ?? 'Value') }), _jsx("span", { className: "jini-chart-tooltip-value", children: formatChartValue({ value: entry.value }) })] }, `${key}-${index}`));
-                }) })] }));
-}
-/** Compact named legend; pie values remain readable without hover or outside labels. */
-export function ChartLegendContent() {
-    const config = useContext(ChartContext);
-    const entries = Object.entries(config);
-    if (entries.length === 0)
-        return null;
-    return (_jsx("ul", { className: "jini-chart-legend", "aria-label": "Chart legend", children: entries.map(([key, series]) => (_jsxs("li", { className: "jini-chart-legend-item", children: [_jsx("span", { className: "jini-chart-swatch", style: { backgroundColor: series.color }, "aria-hidden": "true" }), _jsx("span", { children: series.label }), series.value !== undefined && _jsx("span", { className: "jini-chart-legend-value", children: formatChartValue({ value: series.value }) })] }, key))) }));
-}
-//# sourceMappingURL=chart.js.map

package/dist/features/interactive-ui/providers/recharts/index.d.ts

@@ -1,7 +0,0 @@
-export { rechartsBarChartManifest, rechartsBarChartPropsSchema } from './bar-chart.manifest.js';
-export { BarChart, type BarChartProps } from './bar-chart.js';
-export { rechartsLineChartManifest, rechartsLineChartPropsSchema } from './line-chart.manifest.js';
-export { LineChart, type LineChartProps } from './line-chart.js';
-export { rechartsPieChartManifest, rechartsPieChartPropsSchema } from './pie-chart.manifest.js';
-export { PieChart, type PieChartProps, type PieDatum } from './pie-chart.js';
-//# sourceMappingURL=index.d.ts.map

package/dist/features/interactive-ui/providers/recharts/index.js

@@ -1,7 +0,0 @@
-export { rechartsBarChartManifest, rechartsBarChartPropsSchema } from './bar-chart.manifest.js';
-export { BarChart } from './bar-chart.js';
-export { rechartsLineChartManifest, rechartsLineChartPropsSchema } from './line-chart.manifest.js';
-export { LineChart } from './line-chart.js';
-export { rechartsPieChartManifest, rechartsPieChartPropsSchema } from './pie-chart.manifest.js';
-export { PieChart } from './pie-chart.js';
-//# sourceMappingURL=index.js.map

package/dist/features/interactive-ui/providers/recharts/line-chart.d.ts

@@ -1,8 +0,0 @@
-export interface LineChartProps {
-    readonly data: readonly Record<string, unknown>[];
-    readonly categoryKey: string;
-    readonly valueKey: string;
-    readonly color?: string;
-}
-export declare function LineChart({ data, categoryKey, valueKey, color }: LineChartProps): import("react").JSX.Element;
-//# sourceMappingURL=line-chart.d.ts.map

package/dist/features/interactive-ui/providers/recharts/line-chart.js

@@ -1,14 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useId } from 'react';
-import { Area, CartesianGrid, ComposedChart, Line, Tooltip, XAxis, YAxis } from 'recharts';
-import { CHART_ACTIVE_DOT, CHART_AXIS_PROPS, CHART_GRID_STROKE, CHART_PRIMARY_COLOR } from './chart-tokens.js';
-import { chartTickFormatter, createChartConfig } from './chart-config.js';
-import { ChartContainer, ChartTooltipContent } from './chart.js';
-export function LineChart({ data, categoryKey, valueKey, color = CHART_PRIMARY_COLOR }) {
-    const gradientId = `jini-chart-area-${useId().replace(/:/g, '')}`;
-    const config = createChartConfig({ series: [{ key: valueKey, label: valueKey }] }, { color });
-    const title = `${valueKey} by ${categoryKey}`;
-    const description = `Line chart with ${data.length} points. Use arrow keys to explore values.`;
-    return (_jsx(ChartContainer, { config: config, title: title, description: description, children: _jsxs(ComposedChart, { data: data, accessibilityLayer: true, title: title, desc: description, margin: { top: 16, right: 12, bottom: 8, left: 0 }, children: [_jsx("defs", { children: _jsxs("linearGradient", { id: gradientId, x1: "0", y1: "0", x2: "0", y2: "1", children: [_jsx("stop", { offset: "0%", stopColor: config[valueKey].color, stopOpacity: 0.22 }), _jsx("stop", { offset: "100%", stopColor: config[valueKey].color, stopOpacity: 0.02 })] }) }), _jsx(CartesianGrid, { strokeDasharray: "3 3", stroke: CHART_GRID_STROKE, strokeOpacity: 0.6, vertical: false }), _jsx(XAxis, { dataKey: categoryKey, interval: "preserveStartEnd", minTickGap: 8, ...CHART_AXIS_PROPS }), _jsx(YAxis, { ...CHART_AXIS_PROPS, tickFormatter: chartTickFormatter, width: 48 }), _jsx(Tooltip, { cursor: { stroke: CHART_GRID_STROKE, strokeDasharray: '3 3' }, content: _jsx(ChartTooltipContent, {}), payloadUniqBy: (entry) => entry.graphicalItemId, isAnimationActive: false }), _jsx(Area, { type: "monotone", dataKey: valueKey, stroke: "none", fill: `url(#${gradientId})`, tooltipType: "none", legendType: "none", activeDot: false, isAnimationActive: false }), _jsx(Line, { type: "monotone", dataKey: valueKey, stroke: config[valueKey].color, strokeWidth: 2.5, dot: false, activeDot: CHART_ACTIVE_DOT, isAnimationActive: false })] }) }));
-}
-//# sourceMappingURL=line-chart.js.map

package/dist/features/interactive-ui/providers/recharts/line-chart.manifest.d.ts

@@ -1,20 +0,0 @@
-import { z } from 'zod';
-import type { InteractiveComponentManifest } from '../../types.js';
-export declare const rechartsLineChartPropsSchema: z.ZodObject<{
-    data: z.ZodArray<z.ZodRecord<z.ZodString, z.ZodUnknown>, "many">;
-    categoryKey: z.ZodString;
-    valueKey: z.ZodString;
-    color: z.ZodOptional<z.ZodString>;
-}, "passthrough", z.ZodTypeAny, z.objectOutputType<{
-    data: z.ZodArray<z.ZodRecord<z.ZodString, z.ZodUnknown>, "many">;
-    categoryKey: z.ZodString;
-    valueKey: z.ZodString;
-    color: z.ZodOptional<z.ZodString>;
-}, z.ZodTypeAny, "passthrough">, z.objectInputType<{
-    data: z.ZodArray<z.ZodRecord<z.ZodString, z.ZodUnknown>, "many">;
-    categoryKey: z.ZodString;
-    valueKey: z.ZodString;
-    color: z.ZodOptional<z.ZodString>;
-}, z.ZodTypeAny, "passthrough">>;
-export declare const rechartsLineChartManifest: InteractiveComponentManifest;
-//# sourceMappingURL=line-chart.manifest.d.ts.map

package/dist/features/interactive-ui/providers/recharts/line-chart.manifest.js

@@ -1,17 +0,0 @@
-import { z } from 'zod';
-export const rechartsLineChartPropsSchema = z
-    .object({
-    data: z.array(z.record(z.unknown())).min(1),
-    categoryKey: z.string(),
-    valueKey: z.string(),
-    color: z.string().optional(),
-})
-    .passthrough();
-export const rechartsLineChartManifest = {
-    id: 'recharts.line-chart',
-    provider: 'recharts',
-    capabilities: ['chart', 'line-chart', 'graph'],
-    propsSchema: rechartsLineChartPropsSchema,
-    description: 'recharts LineChart (real npm dependency): one categorical axis, one numeric value per point.',
-};
-//# sourceMappingURL=line-chart.manifest.js.map

package/dist/features/interactive-ui/providers/recharts/pie-chart.d.ts

@@ -1,10 +0,0 @@
-export interface PieDatum {
-    readonly name: string;
-    readonly value: number;
-}
-export interface PieChartProps {
-    readonly data: readonly PieDatum[];
-    readonly color?: string;
-}
-export declare function PieChart({ data, color }: PieChartProps): import("react").JSX.Element;
-//# sourceMappingURL=pie-chart.d.ts.map

package/dist/features/interactive-ui/providers/recharts/pie-chart.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Cell, Pie, PieChart as RechartsPieChart, Tooltip } from 'recharts';
-import { createChartConfig, formatChartValue } from './chart-config.js';
-import { ChartContainer, ChartTooltipContent } from './chart.js';
-export function PieChart({ data, color }) {
-    const slices = data.map((entry, index) => ({ ...entry, _jiniChartKey: `slice-${index}` }));
-    const config = createChartConfig({ series: slices.map((entry) => ({ key: entry._jiniChartKey, label: entry.name, value: entry.value })) }, { color });
-    const total = data.reduce((sum, entry) => sum + entry.value, 0);
-    const description = `Donut chart with ${data.length} categories. Total: ${formatChartValue({ value: total })}. Values are listed in the legend.`;
-    return (_jsx(ChartContainer, { config: config, title: "Distribution", description: description, children: _jsxs(RechartsPieChart, { accessibilityLayer: true, title: "Distribution", desc: description, margin: { top: 12, right: 12, bottom: 12, left: 12 }, children: [_jsx(Tooltip, { content: _jsx(ChartTooltipContent, {}), isAnimationActive: false }), _jsx(Pie, { data: slices, dataKey: "value", nameKey: "name", cx: "50%", cy: "50%", innerRadius: "55%", outerRadius: "78%", paddingAngle: 3, cornerRadius: 5, stroke: "none", label: false, labelLine: false, isAnimationActive: false, children: slices.map((entry) => (_jsx(Cell, { fill: config[entry._jiniChartKey].color }, entry._jiniChartKey))) }), _jsxs("text", { x: "50%", y: "50%", textAnchor: "middle", dominantBaseline: "middle", className: "jini-chart-total", "aria-hidden": "true", children: [_jsx("tspan", { x: "50%", dy: "-0.2em", children: formatChartValue({ value: total }, { notation: 'compact' }) }), _jsx("tspan", { x: "50%", dy: "1.8em", className: "jini-chart-total-label", children: "Total" })] })] }) }));
-}
-//# sourceMappingURL=pie-chart.js.map

package/dist/features/interactive-ui/providers/recharts/pie-chart.manifest.d.ts

@@ -1,41 +0,0 @@
-import { z } from 'zod';
-import type { InteractiveComponentManifest } from '../../types.js';
-export declare const rechartsPieChartPropsSchema: z.ZodObject<{
-    data: z.ZodArray<z.ZodObject<{
-        name: z.ZodString;
-        value: z.ZodNumber;
-    }, "passthrough", z.ZodTypeAny, z.objectOutputType<{
-        name: z.ZodString;
-        value: z.ZodNumber;
-    }, z.ZodTypeAny, "passthrough">, z.objectInputType<{
-        name: z.ZodString;
-        value: z.ZodNumber;
-    }, z.ZodTypeAny, "passthrough">>, "many">;
-    color: z.ZodOptional<z.ZodString>;
-}, "passthrough", z.ZodTypeAny, z.objectOutputType<{
-    data: z.ZodArray<z.ZodObject<{
-        name: z.ZodString;
-        value: z.ZodNumber;
-    }, "passthrough", z.ZodTypeAny, z.objectOutputType<{
-        name: z.ZodString;
-        value: z.ZodNumber;
-    }, z.ZodTypeAny, "passthrough">, z.objectInputType<{
-        name: z.ZodString;
-        value: z.ZodNumber;
-    }, z.ZodTypeAny, "passthrough">>, "many">;
-    color: z.ZodOptional<z.ZodString>;
-}, z.ZodTypeAny, "passthrough">, z.objectInputType<{
-    data: z.ZodArray<z.ZodObject<{
-        name: z.ZodString;
-        value: z.ZodNumber;
-    }, "passthrough", z.ZodTypeAny, z.objectOutputType<{
-        name: z.ZodString;
-        value: z.ZodNumber;
-    }, z.ZodTypeAny, "passthrough">, z.objectInputType<{
-        name: z.ZodString;
-        value: z.ZodNumber;
-    }, z.ZodTypeAny, "passthrough">>, "many">;
-    color: z.ZodOptional<z.ZodString>;
-}, z.ZodTypeAny, "passthrough">>;
-export declare const rechartsPieChartManifest: InteractiveComponentManifest;
-//# sourceMappingURL=pie-chart.manifest.d.ts.map

package/dist/features/interactive-ui/providers/recharts/pie-chart.manifest.js

@@ -1,15 +0,0 @@
-import { z } from 'zod';
-export const rechartsPieChartPropsSchema = z
-    .object({
-    data: z.array(z.object({ name: z.string(), value: z.number() }).passthrough()).min(1),
-    color: z.string().optional(),
-})
-    .passthrough();
-export const rechartsPieChartManifest = {
-    id: 'recharts.pie-chart',
-    provider: 'recharts',
-    capabilities: ['chart', 'pie-chart', 'graph'],
-    propsSchema: rechartsPieChartPropsSchema,
-    description: 'recharts PieChart (real npm dependency): a set of named, weighted slices.',
-};
-//# sourceMappingURL=pie-chart.manifest.js.map