@llmnative/react 1.38.0 → 1.40.0

package/dist/types/src/components/charts/ListCharts.d.ts

@@ -32,6 +32,46 @@ export interface BarListProps {
 }
 /** CR-112 — horizontal bars, label on the left and value at the end: rankings, funnels, averages per group. */
 export declare function BarList({ rows, ariaLabel, color, format: formatProp, max: fixedMax, labelWidth, legend, className, onRowClick }: BarListProps): React.JSX.Element;
+export interface MeasureBarPart {
+    readonly id: string;
+    readonly label: string;
+    readonly color?: ChartColor;
+}
+export interface MeasureBarColumn {
+    readonly id: string;
+    /** Its name in the legend and in the tooltip. */
+    readonly label: string;
+    readonly format?: (value: number) => string;
+    readonly color?: ChartColor;
+    /** The parts of each of its bars, left to right, each of its colour (in the legend in place of the measure): input and output tokens. */
+    readonly parts?: readonly MeasureBarPart[];
+}
+export interface MeasureBarRow {
+    readonly id: string;
+    readonly label: string;
+    /** For each column, by its id: a number, or one number per part. */
+    readonly values: Readonly<Record<string, number | readonly number[]>>;
+    readonly trailing?: {
+        readonly text: string;
+        readonly tone: 'good' | 'bad' | 'neutral';
+    };
+    readonly tooltip?: readonly ChartTooltipRow[];
+}
+export interface MeasureBarListProps {
+    columns: readonly MeasureBarColumn[];
+    rows: readonly MeasureBarRow[];
+    ariaLabel: string;
+    /** Room for the labels, in px. */
+    labelWidth?: number;
+    className?: string;
+    onRowClick?: (row: MeasureBarRow) => void;
+}
+/**
+ * CR-115 — grouped bars: each item once, and next to it a bar per measure one under the other, each
+ * measure of its colour (the legend) and on its own scale (time, cost, tokens: quantities of different
+ * units read together). A bar of a measure with parts is split in proportion, each part of its colour.
+ */
+export declare function MeasureBarList({ columns, rows, ariaLabel, labelWidth, className, onRowClick }: MeasureBarListProps): React.JSX.Element;
 export interface HeatmapProps {
     /** values[row][column]. */
     values: ReadonlyArray<readonly number[]>;

package/dist/types/src/components/charts/index.d.ts

@@ -4,8 +4,8 @@ export { LineChart, AreaChart, Sparkline } from './LineCharts';
 export type { LineSeries, LineChartProps, AreaChartProps, SparklineProps } from './LineCharts';
 export { ScatterChart } from './ScatterChart';
 export type { ScatterPoint, ScatterChartProps } from './ScatterChart';
-export { BarList, Heatmap, CalendarHeatmap, AnimatedNumber } from './ListCharts';
-export type { BarListRow, BarListProps, HeatmapProps, CalendarHeatmapProps } from './ListCharts';
+export { BarList, MeasureBarList, Heatmap, CalendarHeatmap, AnimatedNumber } from './ListCharts';
+export type { BarListRow, BarListProps, MeasureBarPart, MeasureBarColumn, MeasureBarRow, MeasureBarListProps, HeatmapProps, CalendarHeatmapProps } from './ListCharts';
 export { ChartLegend, ChartDataTable, useChartTooltip } from './ChartParts';
 export type { ChartLegendItem, ChartTooltipRow } from './ChartParts';
 export { chartToken, chartFill, niceMax, ticks, useAnimatedValues, useReveal, useChartWidth, useChartFormat } from './chartCore';

package/dist/types/src/components/ui/fields/Input.d.ts

@@ -27,9 +27,12 @@ interface LabelProps {
 }
 export type InputProps = Omit<BaseInputProps, 'type'>;
 export interface CheckboxProps extends FormFieldProps {
+    /** Shown on hover, on the label too: with `disabled`, why it cannot be changed. */
     title?: string;
     ariaLabel?: string;
     valueChecked?: string | number;
+    /** It cannot be changed, by click nor keyboard (CR-116); its value stays in the form. */
+    disabled?: boolean;
 }
 export interface HiddenProps extends FormFieldProps {
     id?: string;
@@ -84,8 +87,8 @@ export declare const Month: (props: InputProps) => React.JSX.Element;
 export declare const Range: (props: InputProps) => React.JSX.Element;
 export declare const Url: (props: InputProps) => React.JSX.Element;
 export declare const Hidden: ({ name, onChange, defaultValue, value, id, inheritWrapperClassName, wrapperClassName, }: HiddenProps) => React.JSX.Element;
-export declare const Checkbox: ({ name, onChange, defaultValue, label, title, ariaLabel, required, valueChecked, before, after, inheritWrapperClassName, wrapperClassName, className }: CheckboxProps) => React.JSX.Element;
-export declare const Switch: ({ name, onChange, defaultValue, label, title, ariaLabel, required, valueChecked, before, after, inheritWrapperClassName, wrapperClassName, className }: CheckboxProps) => React.JSX.Element;
+export declare const Checkbox: ({ name, onChange, defaultValue, label, title, ariaLabel, required, valueChecked, disabled, before, after, inheritWrapperClassName, wrapperClassName, className }: CheckboxProps) => React.JSX.Element;
+export declare const Switch: ({ name, onChange, defaultValue, label, title, ariaLabel, required, valueChecked, disabled, before, after, inheritWrapperClassName, wrapperClassName, className }: CheckboxProps) => React.JSX.Element;
 export declare const Label: ({ label, required, htmlFor, className }: LabelProps) => React.JSX.Element;
 export declare const TextArea: ({ name, onChange, defaultValue, placeholder, label, required, readOnlyAfterSet, disabled, minHeight, maxHeight, textareaRef, before, after, feedback, id, labelClassName, inheritWrapperClassName, className, wrapperClassName, validator, onKeyDown, onClick, onBlur, labelMode, }: TextAreaProps) => React.JSX.Element;
 export declare const ListGroup: ({ children, onClick, label, activeIndices, draggable, onDrop, disabledIndices, loadingIndices, before, after, wrapperClassName, className, itemClassName }: ListGroupProps) => React.JSX.Element;

package/llms-full.txt

@@ -362,6 +362,7 @@ Azioni: `save()`, `delete()`, `reset()`, `restoreDraft()`, `discardDraft()`.
 <Input name="color" type="color" />
 <TextArea name="bio" minHeight={96} />
 <Checkbox name="active" valueChecked="yes" />
+<Switch name="gate" label="Passa dalla CI" disabled title="L'agente non committa" />   // CR-116: disabled (non cambia né con il clic né da tastiera), title anche sull'etichetta: il motivo al passaggio del mouse
 ```
 `Input` props: `name`(req) `label` `type` `required` `disabled` `placeholder` `min` `max` `step` `validator:(v)=>string|undefined`
 `type`: `'text' | 'number' | 'email' | 'password' | 'color' | 'date' | 'time' | 'datetime-local' | 'week' | 'month' | 'range' | 'checkbox' | 'radio' | 'url'`
@@ -881,6 +882,10 @@ finché sono al massimo 40), tabella dei dati `sr-only` con `ariaLabel` come did
 <StackedColumnChart ariaLabel="Ore per agente" labels={days} labelEvery={2} format={(v) => `${v} h`}
   series={[{ id: 'dev', label: 'Developer', values: dev }, { id: 'qa', label: 'Tester', values: qa, color: 3 }]}
   comparison={previousTotals} comparisonLabel="periodo precedente" />
+<MeasureBarList ariaLabel="Agenti"   // CR-115: barre raggruppate, ogni agente una volta, una barra per misura (colore in legenda), ognuna sulla sua scala
+  columns={[{ id: 'time', label: 'Ore', format: (v) => `${v} h` }, { id: 'cost', label: 'Costo' },
+    { id: 'tokens', label: 'Token', parts: [{ id: 'in', label: 'Input' }, { id: 'out', label: 'Output' }] }]}   // parts: la barra divisa in proporzione
+  rows={[{ id: 'dev', label: 'Developer', values: { time: 18, cost: 4.27, tokens: [2400000, 190000] }, trailing: { text: '18 back', tone: 'bad' } }]} />
 <SequenceColumnChart ariaLabel="Turni per CR" format={(v) => `${v} min`}   // CR-114: ogni colonna nel suo ordine, una serie può tornare
   series={[{ id: 'dev', label: 'Developer' }, { id: 'rev', label: 'Reviewer' }]}
   columns={[{ label: '#34', title: 'CR #34', segments: [{ series: 'dev', value: 18 }, { series: 'rev', value: 6 }, { series: 'dev', value: 11 }] }]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@llmnative/react",
-  "version": "1.38.0",
+  "version": "1.40.0",
   "description": "LLM-native React framework for deterministic UI generation. Data-driven by default, schema-driven optional. Ultra-low token consumption — built for AI agents, not just humans.",
   "main": "dist/index.js",
   "module": "dist/index.mjs",