@santi020k/lumen-react 3.0.1 → 4.1.0

package/dist/ai-surfaces.d.ts

@@ -0,0 +1,49 @@
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
+import { type LumenApprovalResponseDetail, type LumenApprovalStatus, type LumenPromptSubmitDetail, type LumenStreamStatus, type LumenToolStatus } from '@santi020k/lumen-core';
+export interface PromptComposerProps extends Omit<ComponentPropsWithoutRef<'form'>, 'defaultValue'> {
+    actions?: ReactNode;
+    defaultValue?: string;
+    disabled?: boolean;
+    label?: string;
+    maxLength?: number;
+    onPromptSubmit?: (detail: LumenPromptSubmitDetail) => void;
+    onStop?: () => void;
+    onValueChange?: (value: string) => void;
+    pending?: boolean;
+    sendLabel?: string;
+    stopLabel?: string;
+    submitOnEnter?: boolean;
+    value?: string;
+}
+export declare const PromptComposer: ({ actions, children, className, defaultValue, disabled, id, label, maxLength, onPromptSubmit, onStop, onValueChange, pending, sendLabel, stopLabel, submitOnEnter, value, onReset, ...props }: PromptComposerProps) => import("react").JSX.Element;
+export interface StreamMessageProps extends ComponentPropsWithoutRef<'article'> {
+    actions?: ReactNode;
+    label?: string;
+    sources?: ReactNode;
+    status?: LumenStreamStatus;
+    statusLabel: string;
+}
+export declare const StreamMessage: ({ actions, children, className, label, sources, status, statusLabel, ...props }: StreamMessageProps) => import("react").JSX.Element;
+export interface SourceCitationProps extends Omit<ComponentPropsWithoutRef<'a'>, 'href'> {
+    href: string;
+    label: string;
+}
+export declare const SourceCitation: ({ children, className, href, label, ...props }: SourceCitationProps) => import("react").JSX.Element;
+export interface ToolActivityProps extends ComponentPropsWithoutRef<'details'> {
+    label: string;
+    status?: LumenToolStatus;
+    statusLabel: string;
+}
+export declare const ToolActivity: ({ children, className, label, status, statusLabel, ...props }: ToolActivityProps) => import("react").JSX.Element;
+export interface ApprovalCardProps extends ComponentPropsWithoutRef<'div'> {
+    approveLabel?: string;
+    disabled?: boolean;
+    label: string;
+    onResponse?: (detail: LumenApprovalResponseDetail) => void;
+    rejectLabel?: string;
+    requestId: string;
+    status?: LumenApprovalStatus;
+    statusLabel: string;
+}
+export declare const ApprovalCard: ({ approveLabel, children, className, disabled, label, onResponse, rejectLabel, requestId, status, statusLabel, ...props }: ApprovalCardProps) => import("react").JSX.Element;
+//# sourceMappingURL=ai-surfaces.d.ts.map

package/dist/ai-surfaces.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ai-surfaces.d.ts","sourceRoot":"","sources":["../src/ai-surfaces.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,wBAAwB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGhE,OAAO,EAKL,KAAK,2BAA2B,EAChC,KAAK,mBAAmB,EAExB,KAAK,uBAAuB,EAC5B,KAAK,iBAAiB,EACtB,KAAK,eAAe,EAKrB,MAAM,uBAAuB,CAAA;AAI9B,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,wBAAwB,CAAC,MAAM,CAAC,EAAE,cAAc,CAAC;IACjG,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,uBAAuB,KAAK,IAAI,CAAA;IAC1D,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAMD,eAAO,MAAM,cAAc,GAAI,+LAI5B,mBAAmB,gCAmGrB,CAAA;AAED,MAAM,WAAW,kBAAmB,SAAQ,wBAAwB,CAAC,SAAS,CAAC;IAC7E,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,MAAM,CAAC,EAAE,iBAAiB,CAAA;IAC1B,WAAW,EAAE,MAAM,CAAA;CACpB;AAED,eAAO,MAAM,aAAa,GAAI,iFAAwG,kBAAkB,gCASvJ,CAAA;AAED,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,wBAAwB,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC;IAAG,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE;AAExH,eAAO,MAAM,cAAc,GAAI,gDAAgD,mBAAmB,gCAgBjG,CAAA;AAED,MAAM,WAAW,iBAAkB,SAAQ,wBAAwB,CAAC,SAAS,CAAC;IAAG,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,eAAe,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE;AAE/I,eAAO,MAAM,YAAY,GAAI,+DAA0E,iBAAiB,gCAQvH,CAAA;AAED,MAAM,WAAW,iBAAkB,SAAQ,wBAAwB,CAAC,KAAK,CAAC;IACxE,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,EAAE,MAAM,CAAA;IACb,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,2BAA2B,KAAK,IAAI,CAAA;IAC1D,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,SAAS,EAAE,MAAM,CAAA;IACjB,MAAM,CAAC,EAAE,mBAAmB,CAAA;IAC5B,WAAW,EAAE,MAAM,CAAA;CACpB;AAED,eAAO,MAAM,YAAY,GAAI,2HAAsK,iBAAiB,gCAwCnN,CAAA"}

package/dist/ai-surfaces.js

@@ -0,0 +1,88 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useId, useRef, useState } from 'react';
+import { bindLumenApprovalCard, canSubmitLumenPrompt, composeClassName, createLumenPromptComposerController, normalizeLumenPromptLimit, readLumenApprovalResponseDetail, readLumenPromptSubmitDetail, resolveLumenCitationHref } from '@santi020k/lumen-core';
+import { Button, Card, Collapsible, Form, Label, Link, Message, Prose, Stack, Textarea } from './components.js';
+const promptLabels = (label, sendLabel, stopLabel) => ({
+    label: label ?? 'Message', sendLabel: sendLabel ?? 'Send', stopLabel: stopLabel ?? 'Stop'
+});
+export const PromptComposer = ({ actions, children, className, defaultValue = '', disabled = false, id, label, maxLength, onPromptSubmit, onStop, onValueChange, pending = false, sendLabel, stopLabel, submitOnEnter = false, value, onReset, ...props }) => {
+    const generatedId = useId();
+    const inputId = id === undefined ? generatedId : `${id}-input`;
+    const [draft, setDraft] = useState(defaultValue);
+    const text = value ?? draft;
+    const limit = normalizeLumenPromptLimit(maxLength);
+    const formRef = useRef(null);
+    const controllerRef = useRef(null);
+    const labels = promptLabels(label, sendLabel, stopLabel);
+    useEffect(() => {
+        const form = formRef.current;
+        if (!form)
+            return;
+        controllerRef.current = createLumenPromptComposerController(form);
+        const submit = (event) => {
+            if (!('detail' in event))
+                return;
+            const detail = readLumenPromptSubmitDetail(event.detail);
+            if (detail && onPromptSubmit) {
+                event.preventDefault();
+                onPromptSubmit(detail);
+            }
+        };
+        const stop = () => {
+            onStop?.();
+        };
+        form.addEventListener('ui:prompt-submit', submit);
+        form.addEventListener('ui:prompt-stop', stop);
+        return () => {
+            controllerRef.current?.destroy();
+            controllerRef.current = null;
+            form.removeEventListener('ui:prompt-submit', submit);
+            form.removeEventListener('ui:prompt-stop', stop);
+        };
+    }, [onPromptSubmit, onStop]);
+    useEffect(() => {
+        controllerRef.current?.sync();
+    }, [text, limit, disabled, pending]);
+    return (_jsxs(Form, { ...props, id: id, ref: formRef, className: composeClassName('ui-prompt-composer', className), "data-disabled": String(disabled), "data-pending": String(pending), "data-submit-on-enter": String(submitOnEnter), "data-ui-prompt-composer": true, enhance: false, method: "post", onReset: event => {
+            onReset?.(event);
+            if (!event.defaultPrevented && value === undefined) {
+                setDraft(defaultValue);
+                onValueChange?.(defaultValue);
+            }
+        }, status: pending ? 'submitting' : 'idle', children: [_jsx(Label, { htmlFor: inputId, children: labels.label }), _jsx(Textarea, { id: inputId, "data-ui-prompt-input": true, disabled: disabled, maxLength: limit, name: "prompt", onChange: event => {
+                    if (value === undefined)
+                        setDraft(event.currentTarget.value);
+                    onValueChange?.(event.currentTarget.value);
+                }, rows: 3, required: true, value: text }), _jsxs(Stack, { direction: "horizontal", gap: "related", wrap: true, children: [actions, _jsx(Button, { "data-ui-prompt-send": true, disabled: disabled || pending || !canSubmitLumenPrompt(text, limit), type: "submit", children: labels.sendLabel }), _jsx(Button, { "data-ui-prompt-stop": true, disabled: disabled, hidden: !pending, type: "button", variant: "secondary", children: labels.stopLabel })] }), children] }));
+};
+export const StreamMessage = ({ actions, children, className, label = 'Assistant', sources, status = 'idle', statusLabel, ...props }) => (_jsxs(Message, { ...props, "aria-label": label, className: composeClassName('ui-stream-message', className), "data-status": status, from: "assistant", children: [_jsx(Prose, { "aria-busy": status === 'streaming', "aria-live": "off", "data-ui-stream-content": true, children: children }), _jsxs(Stack, { direction: "horizontal", gap: "related", wrap: true, children: [_jsx("span", { "aria-live": "polite", role: "status", children: statusLabel }), actions] }), sources] }));
+export const SourceCitation = ({ children, className, href, label, ...props }) => {
+    const safeHref = resolveLumenCitationHref(href);
+    return safeHref ?
+        (_jsxs(Link, { ...props, className: composeClassName('ui-source-citation', className), href: safeHref, rel: "noopener noreferrer", children: [label, children] })) :
+        (_jsxs("span", { className: composeClassName('ui-source-citation', className), children: [label, children] }));
+};
+export const ToolActivity = ({ children, className, label, status = 'queued', statusLabel, ...props }) => (_jsxs(Collapsible, { ...props, className: composeClassName('ui-tool-activity', className), "data-status": status, children: [_jsx("summary", { children: label }), _jsxs(Stack, { gap: "related", children: [_jsx("span", { role: "status", children: statusLabel }), children] })] }));
+export const ApprovalCard = ({ approveLabel = 'Approve', children, className, disabled = false, label, onResponse, rejectLabel = 'Reject', requestId, status = 'pending', statusLabel, ...props }) => {
+    const ref = useRef(null);
+    useEffect(() => {
+        const root = ref.current;
+        if (!root)
+            return;
+        const cleanup = bindLumenApprovalCard(root);
+        const respond = (event) => {
+            if (!('detail' in event))
+                return;
+            const detail = readLumenApprovalResponseDetail(event.detail);
+            if (detail)
+                onResponse?.(detail);
+        };
+        root.addEventListener('ui:approval-response', respond);
+        return () => {
+            cleanup();
+            root.removeEventListener('ui:approval-response', respond);
+        };
+    }, [onResponse]);
+    return (_jsx(Card, { ...props, ref: ref, "aria-label": label, className: composeClassName('ui-approval-card', className), "data-disabled": String(disabled), "data-request-id": requestId, "data-status": status, "data-ui-approval-card": true, children: _jsxs(Stack, { gap: "group", children: [_jsx("strong", { children: label }), children, _jsx("span", { role: "status", children: statusLabel }), _jsxs(Stack, { direction: "horizontal", gap: "related", wrap: true, children: [_jsx(Button, { "data-ui-approval-response": "approve", disabled: disabled || status !== 'pending', type: "button", children: approveLabel }), _jsx(Button, { "data-ui-approval-response": "reject", disabled: disabled || status !== 'pending', type: "button", variant: "secondary", children: rejectLabel })] })] }) }));
+};

package/dist/amount-field.d.ts

@@ -0,0 +1,11 @@
+import type { ComponentPropsWithRef } from 'react';
+import { type LumenAmountChangeDetail, type LumenAmountOptions } from '@santi020k/lumen-core';
+export interface AmountFieldProps extends Omit<ComponentPropsWithRef<'input'>, 'value' | 'defaultValue' | 'type' | 'min' | 'max' | 'step'>, LumenAmountOptions {
+    value?: string;
+    defaultValue?: string;
+    invalidMessage?: string;
+    onValueChange?: (draft: string, detail: LumenAmountChangeDetail) => void;
+}
+/** Formatting owns no currency conversion, rounding or domain validation. */
+export declare const AmountField: ({ value, defaultValue, locale, fractionDigits, allowNegative, invalidMessage, onValueChange, name, form, disabled, readOnly, className, ...props }: AmountFieldProps) => import("react").JSX.Element;
+//# sourceMappingURL=amount-field.d.ts.map

package/dist/amount-field.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"amount-field.d.ts","sourceRoot":"","sources":["../src/amount-field.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAA;AAGlD,OAAO,EAAmG,KAAK,uBAAuB,EAAmC,KAAK,kBAAkB,EAAE,MAAM,uBAAuB,CAAA;AAE/N,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,OAAO,GAAG,cAAc,GAAG,MAAM,GAAG,KAAK,GAAG,KAAK,GAAG,MAAM,CAAC,EAAE,kBAAkB;IAC5J,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,uBAAuB,KAAK,IAAI,CAAA;CACzE;AAED,6EAA6E;AAC7E,eAAO,MAAM,WAAW,GAAI,oJAA+K,gBAAgB,gCA0D1N,CAAA"}

package/dist/amount-field.js

@@ -0,0 +1,37 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useLayoutEffect, useRef, useState } from 'react';
+import { composeClassName, createLumenAmountFieldController, formatLumenAmountDraft, getLumenAmountValue } from '@santi020k/lumen-core';
+/** Formatting owns no currency conversion, rounding or domain validation. */
+export const AmountField = ({ value, defaultValue = '', locale = 'en-US', fractionDigits = 2, allowNegative = false, invalidMessage, onValueChange, name, form, disabled, readOnly, className, ...props }) => {
+    const rootRef = useRef(null);
+    const controllerRef = useRef(undefined);
+    const latestRef = useRef({ value, onValueChange });
+    const options = { locale, fractionDigits, allowNegative };
+    const initial = value ?? defaultValue;
+    const [draft, setDraft] = useState(initial);
+    useLayoutEffect(() => {
+        latestRef.current = { value, onValueChange };
+    });
+    useLayoutEffect(() => {
+        const root = rootRef.current;
+        if (!root)
+            return;
+        const controller = createLumenAmountFieldController(root, detail => {
+            setDraft(detail.draft);
+            latestRef.current.onValueChange?.(detail.draft, detail);
+            if (latestRef.current.value !== undefined)
+                controller.setValue(latestRef.current.value);
+        });
+        controllerRef.current = controller;
+        return () => {
+            controller.destroy();
+            controllerRef.current = undefined;
+        };
+    }, [locale, fractionDigits, allowNegative, form]);
+    useLayoutEffect(() => {
+        if (value !== undefined)
+            controllerRef.current?.setValue(value);
+    }, [value]);
+    return (_jsxs("span", { ref: rootRef, "data-ui-amount-field": true, locale, 'fraction-digits': String(fractionDigits), 'allow-negative': allowNegative ? '' : undefined, value: value ?? draft, 'default-value': defaultValue, 'invalid-message': invalidMessage, children: [_jsx("input", { ...props, className: composeClassName('ui-input ui-amount-field', className), defaultValue: formatLumenAmountDraft(initial, options), "data-ui-amount-input": true, disabled: disabled, readOnly: readOnly, form: form, type: "text", inputMode: "decimal" }), _jsx("input", { "data-ui-amount-value": true, type: "hidden", name: name, form: form, disabled: disabled, value: getLumenAmountValue(value ?? draft) ?? '' })] }));
+};

package/dist/attachments.d.ts

@@ -0,0 +1,17 @@
+import type { ComponentPropsWithRef, ReactNode } from 'react';
+import { type LumenAttachmentPreviewLabels, type LumenAttachmentPreviewState } from '@santi020k/lumen-core';
+export interface AttachmentPreviewProps extends ComponentPropsWithRef<'figure'> {
+    actions?: ReactNode;
+    alt: string;
+    caption?: ReactNode;
+    contentType?: string;
+    labels?: Partial<LumenAttachmentPreviewLabels>;
+    onStateChange?: (state: LumenAttachmentPreviewState) => void;
+    retryKey?: number | string;
+    src?: string;
+    state?: LumenAttachmentPreviewState;
+}
+export declare const AttachmentPreview: ({ actions, alt, caption, children, className, contentType, labels, onStateChange, retryKey, src, state: requested, ...props }: AttachmentPreviewProps) => import("react").JSX.Element;
+export type AttachmentListProps = ComponentPropsWithRef<'ul'>;
+export declare const AttachmentList: ({ className, ...props }: AttachmentListProps) => import("react").JSX.Element;
+//# sourceMappingURL=attachments.d.ts.map

package/dist/attachments.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"attachments.d.ts","sourceRoot":"","sources":["../src/attachments.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAG7D,OAAO,EAEL,KAAK,4BAA4B,EAEjC,KAAK,2BAA2B,EAEjC,MAAM,uBAAuB,CAAA;AAI9B,MAAM,WAAW,sBAAuB,SAAQ,qBAAqB,CAAC,QAAQ,CAAC;IAC7E,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,GAAG,EAAE,MAAM,CAAA;IACX,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC,4BAA4B,CAAC,CAAA;IAC9C,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,2BAA2B,KAAK,IAAI,CAAA;IAC5D,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC1B,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,2BAA2B,CAAA;CACpC;AAED,eAAO,MAAM,iBAAiB,GAAI,+HAG/B,sBAAsB,gCAwCxB,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG,qBAAqB,CAAC,IAAI,CAAC,CAAA;AAC7D,eAAO,MAAM,cAAc,GAAI,yBAAyB,mBAAmB,gCAE1E,CAAA"}

package/dist/attachments.js

@@ -0,0 +1,23 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
+import { composeClassName, lumenAttachmentPreviewLabels, resolveLumenAttachmentPreviewState } from '@santi020k/lumen-core';
+import { Image } from './components.js';
+export const AttachmentPreview = ({ actions, alt, caption, children, className, contentType, labels, onStateChange, retryKey, src, state: requested, ...props }) => {
+    const [failure, setFailure] = useState(null);
+    const failed = failure !== null && failure.src === src && failure.key === retryKey;
+    const state = resolveLumenAttachmentPreviewState(src, contentType, requested, failed);
+    const previousStateRef = useRef(state);
+    useEffect(() => {
+        if (previousStateRef.current !== state) {
+            previousStateRef.current = state;
+            onStateChange?.(state);
+        }
+    }, [onStateChange, state]);
+    const canPreview = resolveLumenAttachmentPreviewState(src, contentType) === 'ready';
+    const copy = { ...lumenAttachmentPreviewLabels, ...labels };
+    return (_jsxs("figure", { ...props, className: composeClassName('ui-attachment-preview', className), "aria-busy": state === 'loading', "data-state": state, children: [_jsx("div", { "data-slot": "attachment-preview-media", hidden: state !== 'ready', children: canPreview && (_jsx(Image, { src: src, alt: alt, fit: "contain", radius: "none", loading: "eager", onError: () => {
+                        setFailure({ src, key: retryKey });
+                    } }, `${src ?? ''}:${retryKey ?? ''}`)) }), _jsx("p", { role: "status", "data-slot": "attachment-preview-fallback", hidden: state === 'ready', children: state === 'ready' ? '' : copy[state] }), caption && _jsx("figcaption", { children: caption }), children, actions && _jsx("div", { "data-slot": "attachment-preview-actions", children: actions })] }));
+};
+export const AttachmentList = ({ className, ...props }) => (_jsx("ul", { ...props, className: composeClassName('ui-attachment-list', className), "data-slot": "attachment-list" }));

package/dist/bullet-chart.d.ts

@@ -0,0 +1,14 @@
+import { type LumenBulletOptions, type LumenChartLabels, type LumenChartTone } from '@santi020k/lumen-core';
+import { type ChartProps } from './components.js';
+export interface BulletChartProps extends Omit<ChartProps, 'children' | 'value'>, LumenBulletOptions {
+    formatValue?: (value: number) => string;
+    labels?: Partial<LumenChartLabels>;
+    showTable?: boolean;
+    target: number;
+    targetLabel?: string;
+    tone?: LumenChartTone;
+    value: number | null;
+    valueLabel?: string;
+}
+export declare const BulletChart: (props: BulletChartProps) => import("react").JSX.Element;
+//# sourceMappingURL=bullet-chart.d.ts.map

package/dist/bullet-chart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"bullet-chart.d.ts","sourceRoot":"","sources":["../src/bullet-chart.tsx"],"names":[],"mappings":"AAEA,OAAO,EAIL,KAAK,kBAAkB,EACvB,KAAK,gBAAgB,EACrB,KAAK,cAAc,EAEpB,MAAM,uBAAuB,CAAA;AAE9B,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAExD,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,UAAU,EAAE,UAAU,GAAG,OAAO,CAAC,EAAE,kBAAkB;IAClG,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;IACvC,MAAM,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAA;IAClC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,MAAM,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,IAAI,CAAC,EAAE,cAAc,CAAA;IACrB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAyGD,eAAO,MAAM,WAAW,GAAI,OAAO,gBAAgB,gCAElD,CAAA"}

package/dist/bullet-chart.js

@@ -0,0 +1,22 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { composeClassName, createLumenBulletGeometry, getLumenChartToneClassName, resolveLumenChartLabels } from '@santi020k/lumen-core';
+import { Chart } from './components.js';
+const resolveBulletProps = (props) => ({
+    ...props,
+    formatValue: props.formatValue ?? String,
+    showTable: props.showTable ?? true,
+    targetLabel: props.targetLabel ?? 'Target',
+    tone: props.tone ?? 'series-1'
+});
+const BulletContent = ({ className, domain, formatValue, labels, ranges, showTable, summary, target, targetLabel, tone, value, valueLabel, ...props }) => {
+    const text = resolveLumenChartLabels(labels);
+    const model = createLumenBulletGeometry(value, target, { domain, ranges });
+    const title = valueLabel ?? text.value;
+    const actual = model.valid && value !== null ? formatValue(value) : text.notAvailable;
+    const factual = model.valid ? `${title}: ${actual}. ${targetLabel}: ${formatValue(target)}.` : text.invalidData;
+    return (_jsx(Chart, { ...props, className: className, summary: summary ?? factual, children: model.valid ?
+            (_jsxs(_Fragment, { children: [_jsxs("div", { className: "ui-bullet-chart__values", children: [_jsxs("div", { children: [_jsx("span", { children: title }), _jsx("strong", { children: actual })] }), _jsxs("p", { children: [_jsx("span", { className: "ui-bullet-chart__target-key", "aria-hidden": "true" }), targetLabel, _jsx("strong", { children: formatValue(target) })] })] }), _jsxs("div", { "aria-hidden": "true", className: "ui-bullet-chart__plot", children: [_jsxs("div", { className: "ui-bullet-chart__track", children: [model.ranges.map((range, index) => (_jsx("span", { className: composeClassName('ui-bullet-chart__range', getLumenChartToneClassName(range.tone ?? 'neutral')), style: { left: `${range.startRatio * 100}%`, width: `${(range.endRatio - range.startRatio) * 100}%`, opacity: 0.08 + index / Math.max(1, model.ranges.length - 1) * 0.14 } }, range.end))), value !== null && _jsx("span", { className: composeClassName('ui-bullet-chart__bar', getLumenChartToneClassName(tone)), style: { left: `${model.valueStartRatio * 100}%`, width: `${model.valueWidthRatio * 100}%` } }), _jsx("span", { className: "ui-bullet-chart__target", style: { left: `${model.targetRatio * 100}%` } })] }), _jsx("div", { className: "ui-bullet-chart__ticks", children: model.ticks.map(tick => _jsx("span", { children: formatValue(tick.value) }, tick.position)) })] }), model.ranges.length > 0 && (_jsx("ul", { className: "ui-bullet-chart__ranges", children: model.ranges.map(range => (_jsxs("li", { className: getLumenChartToneClassName(range.tone ?? 'neutral'), children: [_jsx("span", { children: range.label }), _jsxs("span", { children: [formatValue(range.start), "\u2013", formatValue(range.end)] })] }, range.end))) })), showTable && (_jsxs("details", { className: "ui-chart__data", children: [_jsx("summary", { children: text.viewData }), _jsx("div", { role: "group", tabIndex: 0, "aria-label": text.chartData, children: _jsxs("table", { children: [_jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { scope: "col", children: text.category }), _jsx("th", { scope: "col", children: text.value })] }) }), _jsxs("tbody", { children: [_jsxs("tr", { children: [_jsx("th", { scope: "row", children: title }), _jsx("td", { children: actual })] }), _jsxs("tr", { children: [_jsx("th", { scope: "row", children: targetLabel }), _jsx("td", { children: formatValue(target) })] }), model.ranges.map(range => (_jsxs("tr", { children: [_jsx("th", { scope: "row", children: range.label }), _jsxs("td", { children: [formatValue(range.start), "\u2013", formatValue(range.end)] })] }, range.end)))] })] }) })] }))] })) :
+            _jsx("p", { className: "ui-chart__empty", role: "status", children: text.invalidData }) }));
+};
+export const BulletChart = (props) => (_jsx(BulletContent, { ...resolveBulletProps(props), className: composeClassName('ui-bullet-chart', props.className) }));

package/dist/change-summary.d.ts

@@ -0,0 +1,14 @@
+import type { ComponentPropsWithRef } from 'react';
+import { type LumenChangeSummaryItem } from '@santi020k/lumen-core';
+export interface ChangeSummaryProps extends ComponentPropsWithRef<'section'> {
+    items?: readonly LumenChangeSummaryItem[];
+    label?: string;
+    beforeLabel?: string;
+    afterLabel?: string;
+    changedLabel?: string;
+    unchangedLabel?: string;
+    /** Localized count text, supplied by the host. */
+    summary?: string;
+}
+export declare const ChangeSummary: ({ items, label, beforeLabel, afterLabel, changedLabel, unchangedLabel, summary, className, children, ...props }: ChangeSummaryProps) => import("react").JSX.Element;
+//# sourceMappingURL=change-summary.d.ts.map

package/dist/change-summary.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"change-summary.d.ts","sourceRoot":"","sources":["../src/change-summary.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAA;AAElD,OAAO,EAAoB,KAAK,sBAAsB,EAAE,MAAM,uBAAuB,CAAA;AAErF,MAAM,WAAW,kBAAmB,SAAQ,qBAAqB,CAAC,SAAS,CAAC;IAC1E,KAAK,CAAC,EAAE,SAAS,sBAAsB,EAAE,CAAA;IACzC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,kDAAkD;IAClD,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB;AAID,eAAO,MAAM,aAAa,GAAI,iHAG3B,kBAAkB,gCAwBpB,CAAA"}

package/dist/change-summary.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { composeClassName } from '@santi020k/lumen-core';
+const noChanges = [];
+export const ChangeSummary = ({ items = noChanges, label = 'Changes', beforeLabel = 'Before', afterLabel = 'After', changedLabel = 'Changed', unchangedLabel = 'Unchanged', summary, className, children, ...props }) => (_jsxs("section", { className: composeClassName('ui-change-summary', className), "aria-label": label, ...props, children: [_jsx("h3", { className: "ui-change-summary__heading", children: label }), summary && _jsx("p", { className: "ui-change-summary__summary", children: summary }), _jsx("dl", { className: "ui-change-summary__list", children: items.map(item => (_jsxs("div", { className: "ui-change-summary__item", "data-changed": item.changed, children: [_jsxs("dt", { children: [item.label, _jsx("span", { className: "ui-change-summary__state", children: item.changed ? changedLabel : unchangedLabel })] }), _jsxs("dd", { children: [_jsx("span", { className: "ui-change-summary__value-label", children: beforeLabel }), item.before] }), _jsxs("dd", { children: [_jsx("span", { className: "ui-change-summary__value-label", children: afterLabel }), item.after] })] }, item.id))) }), children] }));

package/dist/chart-inspection.d.ts

@@ -0,0 +1,10 @@
+import { type createLumenLineChartModel, type LumenChartLabels } from '@santi020k/lumen-core';
+interface ChartInspectionProps {
+    formatCategory?: (value: number | string) => string;
+    formatValue: (value: number) => string;
+    labels: Readonly<LumenChartLabels>;
+    model: ReturnType<typeof createLumenLineChartModel>;
+}
+export declare const ChartInspection: ({ formatCategory, formatValue, labels, model }: ChartInspectionProps) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=chart-inspection.d.ts.map

package/dist/chart-inspection.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-inspection.d.ts","sourceRoot":"","sources":["../src/chart-inspection.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,yBAAyB,EAA0D,KAAK,gBAAgB,EAAE,MAAM,uBAAuB,CAAA;AAErJ,UAAU,oBAAoB;IAC5B,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,MAAM,CAAA;IACnD,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;IACtC,MAAM,EAAE,QAAQ,CAAC,gBAAgB,CAAC,CAAA;IAClC,KAAK,EAAE,UAAU,CAAC,OAAO,yBAAyB,CAAC,CAAA;CACpD;AAED,eAAO,MAAM,eAAe,GAAI,gDAAgD,oBAAoB,gCAmCnG,CAAA"}

package/dist/chart-inspection.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { getLumenChartCategoryLabel, getLumenChartToneClassName } from '@santi020k/lumen-core';
+export const ChartInspection = ({ formatCategory, formatValue, labels, model }) => {
+    const lookup = model.series.map(series => new Map(series.data.map(datum => [datum.x, datum])));
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "ui-chart__inspection", "data-ui-chart-inspection": true, hidden: true, children: model.categories.map((category, index) => (_jsxs("div", { "data-ui-chart-point": JSON.stringify(category), "data-ui-chart-position": model.positions[index], hidden: true, children: [_jsx("strong", { children: getLumenChartCategoryLabel(model.series, category, formatCategory, 'detail') }), model.series.map((series, seriesIndex) => {
+                            const value = lookup[seriesIndex]?.get(category)?.y;
+                            return (_jsxs("span", { className: getLumenChartToneClassName(series.tone, seriesIndex), "data-ui-chart-series-value": series.id, children: [_jsx("i", { "aria-hidden": "true" }), series.label, ' ', _jsx("b", { children: value === null || value === undefined || !Number.isFinite(value) ?
+                                            labels.notAvailable :
+                                            formatValue(value) })] }, series.id));
+                        })] }, `${typeof category}:${category}`))) }), _jsx("p", { "aria-live": "polite", "aria-atomic": "true", className: "ui-sr-only", "data-ui-chart-announcement": true })] }));
+};

package/dist/chart-interaction.d.ts

@@ -0,0 +1,17 @@
+import { type ReactNode } from 'react';
+import { type createLumenLineChartModel, type LumenChartCursorChangeDetail } from '@santi020k/lumen-core';
+export interface ChartInteractionProps {
+    interactive?: boolean;
+    onCursorChange?: (detail: LumenChartCursorChangeDetail) => void;
+    /** A stable X identity; null clears the cursor. */
+    cursor?: number | string | null;
+    syncGroup?: string;
+}
+interface ChartInteractionContainerProps extends ChartInteractionProps {
+    children: ReactNode;
+    showLegend: boolean;
+    model: ReturnType<typeof createLumenLineChartModel>;
+}
+export declare const ChartInteraction: ({ children, model, showLegend, syncGroup, ...props }: ChartInteractionContainerProps) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=chart-interaction.d.ts.map

package/dist/chart-interaction.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-interaction.d.ts","sourceRoot":"","sources":["../src/chart-interaction.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAqB,MAAM,OAAO,CAAA;AAEzD,OAAO,EAEL,KAAK,yBAAyB,EAC9B,KAAK,4BAA4B,EAElC,MAAM,uBAAuB,CAAA;AAE9B,MAAM,WAAW,qBAAqB;IACpC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,4BAA4B,KAAK,IAAI,CAAA;IAC/D,mDAAmD;IACnD,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAA;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAyDD,UAAU,8BAA+B,SAAQ,qBAAqB;IACpE,QAAQ,EAAE,SAAS,CAAA;IACnB,UAAU,EAAE,OAAO,CAAA;IACnB,KAAK,EAAE,UAAU,CAAC,OAAO,yBAAyB,CAAC,CAAA;CACpD;AAED,eAAO,MAAM,gBAAgB,GAAI,sDAE9B,8BAA8B,gCAQhC,CAAA"}

package/dist/chart-interaction.js

@@ -0,0 +1,50 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useRef } from 'react';
+import { createLumenChartInteractionController } from '@santi020k/lumen-core';
+const useChartInteraction = ({ cursor, interactive, onCursorChange }, bindingKey) => {
+    const ref = useRef(null);
+    const controllerRef = useRef(null);
+    useEffect(() => {
+        if (!interactive || !ref.current)
+            return;
+        const root = ref.current;
+        const instance = createLumenChartInteractionController(root);
+        controllerRef.current = instance;
+        return () => {
+            instance.destroy();
+            controllerRef.current = null;
+        };
+    }, [interactive, bindingKey]);
+    useEffect(() => {
+        controllerRef.current?.setControlledCursor(cursor);
+    }, [cursor, interactive, bindingKey]);
+    useEffect(() => {
+        const root = ref.current;
+        if (!root || !onCursorChange)
+            return;
+        const CustomEventType = root.ownerDocument.defaultView?.CustomEvent;
+        const listener = (event) => {
+            if (!CustomEventType || !(event instanceof CustomEventType))
+                return;
+            const detail = event.detail;
+            if (detail === null || typeof detail !== 'object' || !('x' in detail))
+                return;
+            const x = detail.x;
+            if (x === null || typeof x === 'string' || (typeof x === 'number' && Number.isFinite(x)))
+                onCursorChange({ x });
+        };
+        root.addEventListener('ui:chart-cursor-change', listener);
+        return () => {
+            root.removeEventListener('ui:chart-cursor-change', listener);
+        };
+    }, [onCursorChange]);
+    return ref;
+};
+export const ChartInteraction = ({ children, model, showLegend, syncGroup, ...props }) => {
+    const bindingKey = JSON.stringify([
+        model.categories, model.positions, model.series.map(series => series.id), showLegend, syncGroup
+    ]);
+    const ref = useChartInteraction(props, bindingKey);
+    return _jsx("div", { className: "ui-chart__content", "data-ui-chart-sync": syncGroup, ref: ref, children: children });
+};

package/dist/chart-label.d.ts

@@ -0,0 +1,3 @@
+import type { ReactNode } from 'react';
+export declare const getChartPlotLabel: (label: string | undefined, heading: ReactNode, fallback: string) => string;
+//# sourceMappingURL=chart-label.d.ts.map

package/dist/chart-label.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-label.d.ts","sourceRoot":"","sources":["../src/chart-label.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,eAAO,MAAM,iBAAiB,GAC5B,OAAO,MAAM,GAAG,SAAS,EAAE,SAAS,SAAS,EAAE,UAAU,MAAM,KAC9D,MAAqE,CAAA"}

package/dist/chart-label.js

@@ -0,0 +1 @@
+export const getChartPlotLabel = (label, heading, fallback) => label ?? (typeof heading === 'string' ? heading : fallback);

package/dist/chart-recipes.d.ts

@@ -1,2 +1,10 @@
+import { type LumenChartDatumActivationDetail, type LumenChartLabels } from '@santi020k/lumen-core';
+export interface ReactChartDatumAction {
+    key: string;
+    label: string;
+    serialized: string;
+}
+export declare const createReactChartDatumAction: (detail: LumenChartDatumActivationDetail | null, context: string, labels: Readonly<LumenChartLabels>) => ReactChartDatumAction | null;
+export declare const readReactChartDatumActivation: (root: HTMLElement, target: EventTarget | null) => LumenChartDatumActivationDetail | null;
 export declare const formatReactChartTableValue: (value: number | null | undefined, formatValue: (value: number) => string, notAvailable?: string) => string;
 //# sourceMappingURL=chart-recipes.d.ts.map

package/dist/chart-recipes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chart-recipes.d.ts","sourceRoot":"","sources":["../src/chart-recipes.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,0BAA0B,GACrC,OAAO,MAAM,GAAG,IAAI,GAAG,SAAS,EAChC,aAAa,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,EACtC,qBAA8B,KAC7B,MAEiB,CAAA"}
+{"version":3,"file":"chart-recipes.d.ts","sourceRoot":"","sources":["../src/chart-recipes.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,+BAA+B,EAAE,KAAK,gBAAgB,EAAkC,MAAM,uBAAuB,CAAA;AAEnI,MAAM,WAAW,qBAAqB;IACpC,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;IACb,UAAU,EAAE,MAAM,CAAA;CACnB;AAUD,eAAO,MAAM,2BAA2B,GACtC,QAAQ,+BAA+B,GAAG,IAAI,EAC9C,SAAS,MAAM,EACf,QAAQ,QAAQ,CAAC,gBAAgB,CAAC,KACjC,qBAAqB,GAAG,IAMrB,CAAA;AAEN,eAAO,MAAM,6BAA6B,GACxC,MAAM,WAAW,EACjB,QAAQ,WAAW,GAAG,IAAI,KACzB,+BAA+B,GAAG,IAsBpC,CAAA;AAED,eAAO,MAAM,0BAA0B,GACrC,OAAO,MAAM,GAAG,IAAI,GAAG,SAAS,EAChC,aAAa,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,EACtC,qBAA8B,KAC7B,MAEiB,CAAA"}

package/dist/chart-recipes.js

@@ -1,3 +1,38 @@
+import { parseLumenChartDatumActivation } from '@santi020k/lumen-core';
+const datumActionKey = (detail) => {
+    if (detail.kind === 'series')
+        return JSON.stringify([detail.kind, detail.seriesId, detail.x, detail.datumId]);
+    if (detail.kind === 'heatmap')
+        return JSON.stringify([detail.kind, detail.x, detail.y, detail.datumId]);
+    return JSON.stringify([detail.kind, detail.x, detail.datumId]);
+};
+export const createReactChartDatumAction = (detail, context, labels) => detail ?
+    {
+        key: datumActionKey(detail),
+        label: labels.formatDatumAction(context),
+        serialized: JSON.stringify(detail)
+    } :
+    null;
+export const readReactChartDatumActivation = (root, target) => {
+    const ElementType = root.ownerDocument.defaultView?.Element;
+    if (!root.isConnected || !ElementType || !(target instanceof ElementType))
+        return null;
+    const element = target.closest('[data-ui-chart-datum]');
+    if (element?.closest('[data-ui-chart-activation]') !== root)
+        return null;
+    if (element.closest('[inert], [hidden], [disabled], [aria-disabled="true"]'))
+        return null;
+    const serialized = element.getAttribute('data-ui-chart-datum');
+    if (!serialized)
+        return null;
+    try {
+        const input = JSON.parse(serialized);
+        return parseLumenChartDatumActivation(input);
+    }
+    catch {
+        return null;
+    }
+};
 export const formatReactChartTableValue = (value, formatValue, notAvailable = 'Not available') => value === null || value === undefined || !Number.isFinite(value) ?
     notAvailable :
     formatValue(value);

package/dist/combobox.d.ts

@@ -0,0 +1,9 @@
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
+export interface ComboboxProps extends ComponentPropsWithoutRef<'input'> {
+    label?: ReactNode;
+    list: string;
+    options?: string[];
+    wrapperClassName?: string;
+}
+export declare const Combobox: ({ className, defaultValue, disabled, readOnly, form, id, label, list, onBlur, onChange, onFocus, onKeyDown, options: rawOptions, type, value: valueProp, wrapperClassName, ...props }: ComboboxProps) => import("react").JSX.Element;
+//# sourceMappingURL=combobox.d.ts.map

package/dist/combobox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox.d.ts","sourceRoot":"","sources":["../src/combobox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,wBAAwB,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAA;AA0B/E,MAAM,WAAW,aAAc,SAAQ,wBAAwB,CAAC,OAAO,CAAC;IACtE,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,gBAAgB,CAAC,EAAE,MAAM,CAAA;CAC1B;AAED,eAAO,MAAM,QAAQ,GAAI,uLAkBtB,aAAa,gCA0Of,CAAA"}