@atelier-ui/react 0.0.1

package/src/lib/select/llm-select.d.ts

@@ -0,0 +1,58 @@
+import { ReactNode, SelectHTMLAttributes, OptionHTMLAttributes } from 'react';
+import type { LlmSelectSpec, LlmOptionSpec } from '@atelier-ui/spec';
+import './llm-select.css';
+/**
+ * Properties for the LlmSelect component.
+ */
+export interface LlmSelectProps extends Omit<SelectHTMLAttributes<HTMLSelectElement>, 'value' | 'onChange'>, LlmSelectSpec {
+    /**
+     * The current value of the select.
+     */
+    value?: string;
+    /**
+     * Callback triggered when the value changes.
+     */
+    onValueChange?: (value: string) => void;
+    /**
+     * Placeholder text to display when no value is selected.
+     */
+    placeholder?: string;
+    /**
+     * Whether the select is in an invalid state.
+     */
+    invalid?: boolean;
+    /**
+     * Array of error messages to display.
+     */
+    errors?: string[];
+    /**
+     * The label for the select.
+     */
+    label?: string;
+    /**
+     * Whether the select is read-only.
+     */
+    readOnly?: boolean;
+}
+/**
+ * A select component for choosing an option from a list.
+ */
+export declare function LlmSelect({ value, onValueChange, placeholder, invalid, errors, disabled, readOnly: reactReadOnly, readonly: specReadOnly, required, label, children, className, id, ...rest }: LlmSelectProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Properties for the LlmOption component.
+ */
+export interface LlmOptionProps extends OptionHTMLAttributes<HTMLOptionElement>, LlmOptionSpec {
+    /**
+     * The value of the option.
+     */
+    optionValue: string;
+    /**
+     * The content to be rendered inside the option.
+     */
+    children?: ReactNode;
+}
+/**
+ * An individual option component for use within LlmSelect.
+ */
+export declare function LlmOption({ optionValue, children, ...rest }: LlmOptionProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=llm-select.d.ts.map

package/src/lib/select/llm-select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"llm-select.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/select/llm-select.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAC9E,OAAO,KAAK,EACV,aAAa,EACb,aAAa,EACd,MAAM,kBAAkB,CAAC;AAC1B,OAAO,kBAAkB,CAAC;AAE1B;;GAEG;AACH,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC,EACzE,aAAa;IACf;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAU,EACV,aAAa,EACb,WAAW,EACX,OAAe,EACf,MAAW,EACX,QAAgB,EAChB,QAAQ,EAAE,aAAa,EACvB,QAAQ,EAAE,YAAY,EACtB,QAAgB,EAChB,KAAK,EACL,QAAQ,EACR,SAAS,EACT,EAAE,EACF,GAAG,IAAI,EACR,EAAE,cAAc,2CAiDhB;AAED;;GAEG;AACH,MAAM,WAAW,cACf,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC,EAC7C,aAAa;IACf;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,EAAE,WAAW,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,2CAM3E"}

package/src/lib/select/llm-select.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import './llm-select.css';
+/**
+ * A select component for choosing an option from a list.
+ */
+export function LlmSelect({ value = '', onValueChange, placeholder, invalid = false, errors = [], disabled = false, readOnly: reactReadOnly, readonly: specReadOnly, required = false, label, children, className, id, ...rest }) {
+    const readOnly = reactReadOnly ?? specReadOnly ?? false;
+    const selectId = id || (label ? `select-${label.toLowerCase().replace(/\s+/g, '-')}` : undefined);
+    const classes = [
+        'llm-select',
+        invalid && 'is-invalid',
+        disabled && 'is-disabled',
+        readOnly && 'is-readonly',
+        className,
+    ]
+        .filter(Boolean)
+        .join(' ');
+    return (_jsxs("div", { className: classes, children: [label && _jsx("label", { htmlFor: selectId, children: label }), _jsxs("div", { className: "select-wrapper", children: [_jsxs("select", { id: selectId, value: value, onChange: (e) => onValueChange?.(e.target.value), disabled: disabled, required: required, "aria-invalid": invalid || undefined, ...rest, children: [placeholder && (_jsx("option", { value: "", disabled: true, hidden: true, children: placeholder })), children] }), _jsx("span", { className: "select-arrow", "aria-hidden": "true", children: "\u25BE" })] }), errors.length > 0 && (_jsx("div", { className: "errors", role: "alert", "aria-live": "polite", children: errors.map((err, i) => (_jsx("p", { className: "error-message", children: err }, i))) }))] }));
+}
+/**
+ * An individual option component for use within LlmSelect.
+ */
+export function LlmOption({ optionValue, children, ...rest }) {
+    return (_jsx("option", { value: optionValue, ...rest, children: children }));
+}
+//# sourceMappingURL=llm-select.js.map

package/src/lib/select/llm-select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"llm-select.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/select/llm-select.tsx"],"names":[],"mappings":";AAKA,OAAO,kBAAkB,CAAC;AAsC1B;;GAEG;AACH,MAAM,UAAU,SAAS,CAAC,EACxB,KAAK,GAAG,EAAE,EACV,aAAa,EACb,WAAW,EACX,OAAO,GAAG,KAAK,EACf,MAAM,GAAG,EAAE,EACX,QAAQ,GAAG,KAAK,EAChB,QAAQ,EAAE,aAAa,EACvB,QAAQ,EAAE,YAAY,EACtB,QAAQ,GAAG,KAAK,EAChB,KAAK,EACL,QAAQ,EACR,SAAS,EACT,EAAE,EACF,GAAG,IAAI,EACQ;IACf,MAAM,QAAQ,GAAG,aAAa,IAAI,YAAY,IAAI,KAAK,CAAC;IACxD,MAAM,QAAQ,GACZ,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,KAAK,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IACnF,MAAM,OAAO,GAAG;QACd,YAAY;QACZ,OAAO,IAAI,YAAY;QACvB,QAAQ,IAAI,aAAa;QACzB,QAAQ,IAAI,aAAa;QACzB,SAAS;KACV;SACE,MAAM,CAAC,OAAO,CAAC;SACf,IAAI,CAAC,GAAG,CAAC,CAAC;IAEb,OAAO,CACL,eAAK,SAAS,EAAE,OAAO,aACpB,KAAK,IAAI,gBAAO,OAAO,EAAE,QAAQ,YAAG,KAAK,GAAS,EACnD,eAAK,SAAS,EAAC,gBAAgB,aAC7B,kBACE,EAAE,EAAE,QAAQ,EACZ,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,aAAa,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EAChD,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,kBACJ,OAAO,IAAI,SAAS,KAC9B,IAAI,aAEP,WAAW,IAAI,CACd,iBAAQ,KAAK,EAAC,EAAE,EAAC,QAAQ,QAAC,MAAM,kBAC7B,WAAW,GACL,CACV,EACA,QAAQ,IACF,EACT,eAAM,SAAS,EAAC,cAAc,iBAAa,MAAM,uBAE1C,IACH,EACL,MAAM,CAAC,MAAM,GAAG,CAAC,IAAI,CACpB,cAAK,SAAS,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,eAAW,QAAQ,YACpD,MAAM,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE,CAAC,CACtB,YAAW,SAAS,EAAC,eAAe,YACjC,GAAG,IADE,CAAC,CAEL,CACL,CAAC,GACE,CACP,IACG,CACP,CAAC;AACJ,CAAC;AAkBD;;GAEG;AACH,MAAM,UAAU,SAAS,CAAC,EAAE,WAAW,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAkB;IAC1E,OAAO,CACL,iBAAQ,KAAK,EAAE,WAAW,KAAM,IAAI,YACjC,QAAQ,GACF,CACV,CAAC;AACJ,CAAC","sourcesContent":["import { ReactNode, SelectHTMLAttributes, OptionHTMLAttributes } from 'react';\nimport type {\n  LlmSelectSpec,\n  LlmOptionSpec,\n} from '@atelier-ui/spec';\nimport './llm-select.css';\n\n/**\n * Properties for the LlmSelect component.\n */\nexport interface LlmSelectProps\n  extends Omit<SelectHTMLAttributes<HTMLSelectElement>, 'value' | 'onChange'>,\n    LlmSelectSpec {\n  /**\n   * The current value of the select.\n   */\n  value?: string;\n  /**\n   * Callback triggered when the value changes.\n   */\n  onValueChange?: (value: string) => void;\n  /**\n   * Placeholder text to display when no value is selected.\n   */\n  placeholder?: string;\n  /**\n   * Whether the select is in an invalid state.\n   */\n  invalid?: boolean;\n  /**\n   * Array of error messages to display.\n   */\n  errors?: string[];\n  /**\n   * The label for the select.\n   */\n  label?: string;\n  /**\n   * Whether the select is read-only.\n   */\n  readOnly?: boolean;\n}\n\n/**\n * A select component for choosing an option from a list.\n */\nexport function LlmSelect({\n  value = '',\n  onValueChange,\n  placeholder,\n  invalid = false,\n  errors = [],\n  disabled = false,\n  readOnly: reactReadOnly,\n  readonly: specReadOnly,\n  required = false,\n  label,\n  children,\n  className,\n  id,\n  ...rest\n}: LlmSelectProps) {\n  const readOnly = reactReadOnly ?? specReadOnly ?? false;\n  const selectId =\n    id || (label ? `select-${label.toLowerCase().replace(/\\s+/g, '-')}` : undefined);\n  const classes = [\n    'llm-select',\n    invalid && 'is-invalid',\n    disabled && 'is-disabled',\n    readOnly && 'is-readonly',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={classes}>\n      {label && <label htmlFor={selectId}>{label}</label>}\n      <div className=\"select-wrapper\">\n        <select\n          id={selectId}\n          value={value}\n          onChange={(e) => onValueChange?.(e.target.value)}\n          disabled={disabled}\n          required={required}\n          aria-invalid={invalid || undefined}\n          {...rest}\n        >\n          {placeholder && (\n            <option value=\"\" disabled hidden>\n              {placeholder}\n            </option>\n          )}\n          {children}\n        </select>\n        <span className=\"select-arrow\" aria-hidden=\"true\">\n          ▾\n        </span>\n      </div>\n      {errors.length > 0 && (\n        <div className=\"errors\" role=\"alert\" aria-live=\"polite\">\n          {errors.map((err, i) => (\n            <p key={i} className=\"error-message\">\n              {err}\n            </p>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n\n/**\n * Properties for the LlmOption component.\n */\nexport interface LlmOptionProps\n  extends OptionHTMLAttributes<HTMLOptionElement>,\n    LlmOptionSpec {\n  /**\n   * The value of the option.\n   */\n  optionValue: string;\n  /**\n   * The content to be rendered inside the option.\n   */\n  children?: ReactNode;\n}\n\n/**\n * An individual option component for use within LlmSelect.\n */\nexport function LlmOption({ optionValue, children, ...rest }: LlmOptionProps) {\n  return (\n    <option value={optionValue} {...rest}>\n      {children}\n    </option>\n  );\n}\n"]}

package/src/lib/skeleton/llm-skeleton.d.ts

@@ -0,0 +1,29 @@
+import { HTMLAttributes } from 'react';
+import type { LlmSkeletonSpec } from '@atelier-ui/spec';
+import './llm-skeleton.css';
+/**
+ * Properties for the LlmSkeleton component.
+ */
+export interface LlmSkeletonProps extends HTMLAttributes<HTMLDivElement>, LlmSkeletonSpec {
+    /**
+     * The visual style variant of the skeleton.
+     */
+    variant?: 'text' | 'circular' | 'rectangular';
+    /**
+     * The width of the skeleton.
+     */
+    width?: string;
+    /**
+     * The height of the skeleton.
+     */
+    height?: string;
+    /**
+     * Whether the skeleton should be animated.
+     */
+    animated?: boolean;
+}
+/**
+ * A placeholder component used to represent content while it's loading.
+ */
+export declare function LlmSkeleton({ variant, width, height, animated, className, style, ...rest }: LlmSkeletonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=llm-skeleton.d.ts.map

package/src/lib/skeleton/llm-skeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"llm-skeleton.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/skeleton/llm-skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,cAAc,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACxD,OAAO,oBAAoB,CAAC;AAE5B;;GAEG;AACH,MAAM,WAAW,gBACf,SAAQ,cAAc,CAAC,cAAc,CAAC,EACpC,eAAe;IACjB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,aAAa,CAAC;IAC9C;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAgBD;;GAEG;AACH,wBAAgB,WAAW,CAAC,EAC1B,OAAgB,EAChB,KAAc,EACd,MAAM,EACN,QAAe,EACf,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,gBAAgB,2CAMlB"}

package/src/lib/skeleton/llm-skeleton.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import './llm-skeleton.css';
+function computeHeight(variant, width, height) {
+    if (height)
+        return height;
+    switch (variant) {
+        case 'text':
+            return '1em';
+        case 'circular':
+            return width;
+        case 'rectangular':
+            return '100px';
+        default:
+            return '1em';
+    }
+}
+/**
+ * A placeholder component used to represent content while it's loading.
+ */
+export function LlmSkeleton({ variant = 'text', width = '100%', height, animated = true, className, style, ...rest }) {
+    const classes = ['llm-skeleton', `variant-${variant}`, animated && 'is-animated', className]
+        .filter(Boolean).join(' ');
+    const computedHeight = computeHeight(variant, width, height);
+    const inlineStyle = { ...style, width, height: computedHeight };
+    return _jsx("div", { className: classes, style: inlineStyle, "aria-hidden": "true", ...rest });
+}
+//# sourceMappingURL=llm-skeleton.js.map

package/src/lib/skeleton/llm-skeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"llm-skeleton.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/skeleton/llm-skeleton.tsx"],"names":[],"mappings":";AAEA,OAAO,oBAAoB,CAAC;AA0B5B,SAAS,aAAa,CAAC,OAAe,EAAE,KAAa,EAAE,MAAe;IACpE,IAAI,MAAM;QAAE,OAAO,MAAM,CAAC;IAC1B,QAAQ,OAAO,EAAE,CAAC;QAChB,KAAK,MAAM;YACT,OAAO,KAAK,CAAC;QACf,KAAK,UAAU;YACb,OAAO,KAAK,CAAC;QACf,KAAK,aAAa;YAChB,OAAO,OAAO,CAAC;QACjB;YACE,OAAO,KAAK,CAAC;IACjB,CAAC;AACH,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,WAAW,CAAC,EAC1B,OAAO,GAAG,MAAM,EAChB,KAAK,GAAG,MAAM,EACd,MAAM,EACN,QAAQ,GAAG,IAAI,EACf,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACU;IACjB,MAAM,OAAO,GAAG,CAAC,cAAc,EAAE,WAAW,OAAO,EAAE,EAAE,QAAQ,IAAI,aAAa,EAAE,SAAS,CAAC;SACzF,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC7B,MAAM,cAAc,GAAG,aAAa,CAAC,OAAO,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;IAC7D,MAAM,WAAW,GAAkB,EAAE,GAAG,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,cAAc,EAAE,CAAC;IAC/E,OAAO,cAAK,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,iBAAc,MAAM,KAAK,IAAI,GAAI,CAAC;AACtF,CAAC","sourcesContent":["import { CSSProperties, HTMLAttributes } from 'react';\nimport type { LlmSkeletonSpec } from '@atelier-ui/spec';\nimport './llm-skeleton.css';\n\n/**\n * Properties for the LlmSkeleton component.\n */\nexport interface LlmSkeletonProps\n  extends HTMLAttributes<HTMLDivElement>,\n    LlmSkeletonSpec {\n  /**\n   * The visual style variant of the skeleton.\n   */\n  variant?: 'text' | 'circular' | 'rectangular';\n  /**\n   * The width of the skeleton.\n   */\n  width?: string;\n  /**\n   * The height of the skeleton.\n   */\n  height?: string;\n  /**\n   * Whether the skeleton should be animated.\n   */\n  animated?: boolean;\n}\n\nfunction computeHeight(variant: string, width: string, height?: string): string {\n  if (height) return height;\n  switch (variant) {\n    case 'text':\n      return '1em';\n    case 'circular':\n      return width;\n    case 'rectangular':\n      return '100px';\n    default:\n      return '1em';\n  }\n}\n\n/**\n * A placeholder component used to represent content while it's loading.\n */\nexport function LlmSkeleton({\n  variant = 'text',\n  width = '100%',\n  height,\n  animated = true,\n  className,\n  style,\n  ...rest\n}: LlmSkeletonProps) {\n  const classes = ['llm-skeleton', `variant-${variant}`, animated && 'is-animated', className]\n    .filter(Boolean).join(' ');\n  const computedHeight = computeHeight(variant, width, height);\n  const inlineStyle: CSSProperties = { ...style, width, height: computedHeight };\n  return <div className={classes} style={inlineStyle} aria-hidden=\"true\" {...rest} />;\n}\n"]}

package/src/lib/tabs/llm-tabs.d.ts

@@ -0,0 +1,53 @@
+import { ReactNode, HTMLAttributes } from 'react';
+import type { LlmTabGroupSpec, LlmTabSpec } from '@atelier-ui/spec';
+import './llm-tabs.css';
+/**
+ * Properties for the LlmTabGroup component.
+ */
+export interface LlmTabGroupProps extends HTMLAttributes<HTMLDivElement>, LlmTabGroupSpec {
+    /**
+     * The index of the currently selected tab.
+     */
+    selectedIndex?: number;
+    /**
+     * Callback triggered when the selected tab index changes.
+     */
+    onSelectedIndexChange?: (index: number) => void;
+    /**
+     * The visual style variant of the tabs.
+     */
+    variant?: 'default' | 'pills';
+    /**
+     * The LlmTab components to be rendered.
+     */
+    children?: ReactNode;
+}
+/**
+ * A component for organizing content into multiple tabs.
+ */
+export declare function LlmTabGroup({ selectedIndex: externalIndex, onSelectedIndexChange, variant, children, className, ...rest }: LlmTabGroupProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Properties for the LlmTab component.
+ */
+export interface LlmTabProps extends LlmTabSpec {
+    /**
+     * The label to display on the tab button.
+     */
+    label: string;
+    /**
+     * Whether the tab is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * The content to be rendered when the tab is selected.
+     */
+    children?: ReactNode;
+}
+/**
+ * An individual tab component for use within LlmTabGroup.
+ */
+export declare function LlmTab({ children }: LlmTabProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace LlmTab {
+    var displayName: string;
+}
+//# sourceMappingURL=llm-tabs.d.ts.map

package/src/lib/tabs/llm-tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"llm-tabs.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/tabs/llm-tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,SAAS,EACT,cAAc,EAIf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EACV,eAAe,EACf,UAAU,EACX,MAAM,kBAAkB,CAAC;AAC1B,OAAO,gBAAgB,CAAC;AAqBxB;;GAEG;AACH,MAAM,WAAW,gBACf,SAAQ,cAAc,CAAC,cAAc,CAAC,EACpC,eAAe;IACjB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC9B;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,EAC1B,aAAa,EAAE,aAAa,EAC5B,qBAAqB,EACrB,OAAmB,EACnB,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,gBAAgB,2CAsGlB;AAED;;GAEG;AACH,MAAM,WAAW,WAAY,SAAQ,UAAU;IAC7C;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;GAEG;AACH,wBAAgB,MAAM,CAAC,EAAE,QAAQ,EAAE,EAAE,WAAW,2CAE/C;yBAFe,MAAM"}

package/src/lib/tabs/llm-tabs.js

@@ -0,0 +1,75 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { createContext, useState, useRef, Children, isValidElement, } from 'react';
+import './llm-tabs.css';
+const TabGroupContext = createContext({
+    selectedIndex: 0,
+    setSelectedIndex: () => undefined,
+    variant: 'default',
+    tabs: [],
+});
+/**
+ * A component for organizing content into multiple tabs.
+ */
+export function LlmTabGroup({ selectedIndex: externalIndex, onSelectedIndexChange, variant = 'default', children, className, ...rest }) {
+    const [internalIndex, setInternalIndex] = useState(0);
+    const isControlled = externalIndex !== undefined;
+    const selectedIndex = isControlled ? externalIndex : internalIndex;
+    const tabListRef = useRef(null);
+    const setIndex = (i) => {
+        if (!isControlled)
+            setInternalIndex(i);
+        onSelectedIndexChange?.(i);
+    };
+    const childArray = Children.toArray(children);
+    const tabs = childArray
+        .filter((child) => isValidElement(child) &&
+        child.type.displayName === 'LlmTab')
+        .map((child) => ({
+        label: child.props.label ?? '',
+        disabled: child.props.disabled ?? false,
+    }));
+    const classes = ['llm-tab-group', `variant-${variant}`, className]
+        .filter(Boolean)
+        .join(' ');
+    const handleKeyDown = (e) => {
+        const enabledIndices = tabs
+            .map((t, i) => (!t.disabled ? i : -1))
+            .filter((i) => i >= 0);
+        if (enabledIndices.length === 0)
+            return;
+        const currentEnabled = enabledIndices.indexOf(selectedIndex);
+        let nextPos = currentEnabled;
+        if (e.key === 'ArrowRight')
+            nextPos = (currentEnabled + 1) % enabledIndices.length;
+        else if (e.key === 'ArrowLeft')
+            nextPos =
+                (currentEnabled - 1 + enabledIndices.length) % enabledIndices.length;
+        else if (e.key === 'Home')
+            nextPos = 0;
+        else if (e.key === 'End')
+            nextPos = enabledIndices.length - 1;
+        else
+            return;
+        e.preventDefault();
+        const nextIndex = enabledIndices[nextPos];
+        setIndex(nextIndex);
+        const buttons = tabListRef.current?.querySelectorAll('[role="tab"]');
+        buttons?.[nextIndex]?.focus();
+    };
+    const panels = childArray.filter((child) => isValidElement(child) &&
+        child.type.displayName === 'LlmTab');
+    return (_jsx(TabGroupContext.Provider, { value: { selectedIndex, setSelectedIndex: setIndex, variant, tabs }, children: _jsxs("div", { className: classes, ...rest, children: [_jsx("div", { className: "tablist", role: "tablist", ref: tabListRef, children: tabs.map((tab, i) => (_jsx("button", { type: "button", role: "tab", id: `llm-tab-${i}`, "aria-selected": i === selectedIndex, "aria-controls": `llm-tab-panel-${i}`, "aria-disabled": tab.disabled || undefined, tabIndex: i === selectedIndex ? 0 : -1, className: [
+                            i === selectedIndex && 'is-active',
+                            tab.disabled && 'is-disabled',
+                        ]
+                            .filter(Boolean)
+                            .join(' ') || undefined, disabled: tab.disabled, onClick: () => !tab.disabled && setIndex(i), onKeyDown: handleKeyDown, children: tab.label }, i))) }), panels.map((panel, i) => (_jsx("div", { id: `llm-tab-panel-${i}`, role: "tabpanel", "aria-labelledby": `llm-tab-${i}`, tabIndex: 0, hidden: i !== selectedIndex, children: panel.props.children }, i)))] }) }));
+}
+/**
+ * An individual tab component for use within LlmTabGroup.
+ */
+export function LlmTab({ children }) {
+    return _jsx(_Fragment, { children: children });
+}
+LlmTab.displayName = 'LlmTab';
+//# sourceMappingURL=llm-tabs.js.map

package/src/lib/tabs/llm-tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"llm-tabs.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/tabs/llm-tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  createContext,\n  useContext,\n  useState,\n  useRef,\n  ReactNode,\n  HTMLAttributes,\n  KeyboardEvent,\n  Children,\n  isValidElement,\n} from 'react';\nimport type {\n  LlmTabGroupSpec,\n  LlmTabSpec,\n} from '@atelier-ui/spec';\nimport './llm-tabs.css';\n\ninterface TabInfo {\n  label: string;\n  disabled: boolean;\n}\n\ninterface TabGroupContextValue {\n  selectedIndex: number;\n  setSelectedIndex: (index: number) => void;\n  variant: 'default' | 'pills';\n  tabs: TabInfo[];\n}\n\nconst TabGroupContext = createContext<TabGroupContextValue>({\n  selectedIndex: 0,\n  setSelectedIndex: () => undefined,\n  variant: 'default',\n  tabs: [],\n});\n\n/**\n * Properties for the LlmTabGroup component.\n */\nexport interface LlmTabGroupProps\n  extends HTMLAttributes<HTMLDivElement>,\n    LlmTabGroupSpec {\n  /**\n   * The index of the currently selected tab.\n   */\n  selectedIndex?: number;\n  /**\n   * Callback triggered when the selected tab index changes.\n   */\n  onSelectedIndexChange?: (index: number) => void;\n  /**\n   * The visual style variant of the tabs.\n   */\n  variant?: 'default' | 'pills';\n  /**\n   * The LlmTab components to be rendered.\n   */\n  children?: ReactNode;\n}\n\n/**\n * A component for organizing content into multiple tabs.\n */\nexport function LlmTabGroup({\n  selectedIndex: externalIndex,\n  onSelectedIndexChange,\n  variant = 'default',\n  children,\n  className,\n  ...rest\n}: LlmTabGroupProps) {\n  const [internalIndex, setInternalIndex] = useState(0);\n  const isControlled = externalIndex !== undefined;\n  const selectedIndex = isControlled ? externalIndex : internalIndex;\n  const tabListRef = useRef<HTMLDivElement>(null);\n\n  const setIndex = (i: number) => {\n    if (!isControlled) setInternalIndex(i);\n    onSelectedIndexChange?.(i);\n  };\n\n  const childArray = Children.toArray(children);\n  const tabs: TabInfo[] = childArray\n    .filter(\n      (child) =>\n        isValidElement(child) &&\n        (child.type as { displayName?: string }).displayName === 'LlmTab'\n    )\n    .map((child: any) => ({\n      label: child.props.label ?? '',\n      disabled: child.props.disabled ?? false,\n    }));\n\n  const classes = ['llm-tab-group', `variant-${variant}`, className]\n    .filter(Boolean)\n    .join(' ');\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\n    const enabledIndices = tabs\n      .map((t, i) => (!t.disabled ? i : -1))\n      .filter((i) => i >= 0);\n    if (enabledIndices.length === 0) return;\n\n    const currentEnabled = enabledIndices.indexOf(selectedIndex);\n    let nextPos = currentEnabled;\n\n    if (e.key === 'ArrowRight')\n      nextPos = (currentEnabled + 1) % enabledIndices.length;\n    else if (e.key === 'ArrowLeft')\n      nextPos =\n        (currentEnabled - 1 + enabledIndices.length) % enabledIndices.length;\n    else if (e.key === 'Home') nextPos = 0;\n    else if (e.key === 'End') nextPos = enabledIndices.length - 1;\n    else return;\n\n    e.preventDefault();\n    const nextIndex = enabledIndices[nextPos];\n    setIndex(nextIndex);\n    const buttons =\n      tabListRef.current?.querySelectorAll<HTMLButtonElement>('[role=\"tab\"]');\n    buttons?.[nextIndex]?.focus();\n  };\n\n  const panels = childArray.filter(\n    (child) =>\n      isValidElement(child) &&\n      (child.type as { displayName?: string }).displayName === 'LlmTab'\n  );\n\n  return (\n    <TabGroupContext.Provider value={{ selectedIndex, setSelectedIndex: setIndex, variant, tabs }}>\n      <div className={classes} {...rest}>\n        <div className=\"tablist\" role=\"tablist\" ref={tabListRef}>\n          {tabs.map((tab, i) => (\n            <button\n              key={i}\n              type=\"button\"\n              role=\"tab\"\n              id={`llm-tab-${i}`}\n              aria-selected={i === selectedIndex}\n              aria-controls={`llm-tab-panel-${i}`}\n              aria-disabled={tab.disabled || undefined}\n              tabIndex={i === selectedIndex ? 0 : -1}\n              className={[\n                i === selectedIndex && 'is-active',\n                tab.disabled && 'is-disabled',\n              ]\n                .filter(Boolean)\n                .join(' ') || undefined}\n              disabled={tab.disabled}\n              onClick={() => !tab.disabled && setIndex(i)}\n              onKeyDown={handleKeyDown}\n            >\n              {tab.label}\n            </button>\n          ))}\n        </div>\n        {panels.map((panel: any, i) => (\n          <div\n            key={i}\n            id={`llm-tab-panel-${i}`}\n            role=\"tabpanel\"\n            aria-labelledby={`llm-tab-${i}`}\n            tabIndex={0}\n            hidden={i !== selectedIndex}\n          >\n            {panel.props.children}\n          </div>\n        ))}\n      </div>\n    </TabGroupContext.Provider>\n  );\n}\n\n/**\n * Properties for the LlmTab component.\n */\nexport interface LlmTabProps extends LlmTabSpec {\n  /**\n   * The label to display on the tab button.\n   */\n  label: string;\n  /**\n   * Whether the tab is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * The content to be rendered when the tab is selected.\n   */\n  children?: ReactNode;\n}\n\n/**\n * An individual tab component for use within LlmTabGroup.\n */\nexport function LlmTab({ children }: LlmTabProps) {\n  return <>{children}</>;\n}\nLlmTab.displayName = 'LlmTab';\n"]}

package/src/lib/textarea/llm-textarea.d.ts

@@ -0,0 +1,33 @@
+import { TextareaHTMLAttributes } from 'react';
+import type { LlmTextareaSpec } from '@atelier-ui/spec';
+import './llm-textarea.css';
+/**
+ * Properties for the LlmTextarea component.
+ */
+export interface LlmTextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'readOnly'>, LlmTextareaSpec {
+    /**
+     * Current value of the textarea.
+     */
+    value?: string;
+    /**
+     * Whether the textarea is read-only.
+     */
+    readOnly?: boolean;
+    /**
+     * Callback fired when the value changes.
+     */
+    onValueChange?: (value: string) => void;
+    /**
+     * List of error messages to display.
+     */
+    errors?: string[];
+    /**
+     * Label text for the textarea.
+     */
+    label?: string;
+}
+/**
+ * A multi-line text input component that supports automatic resizing and validation states.
+ */
+export declare function LlmTextarea({ value, onChange, onValueChange, invalid, errors, disabled, readOnly: reactReadOnly, readonly: specReadOnly, required, label, autoResize, rows, className, id, ...rest }: LlmTextareaProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=llm-textarea.d.ts.map

package/src/lib/textarea/llm-textarea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"llm-textarea.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/textarea/llm-textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAqB,MAAM,OAAO,CAAC;AAClE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACxD,OAAO,oBAAoB,CAAC;AAE5B;;GAEG;AACH,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EAAE,UAAU,CAAC,EACnE,eAAe;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,QAAQ,EACR,aAAa,EACb,OAAe,EACf,MAAW,EACX,QAAgB,EAChB,QAAQ,EAAE,aAAa,EACvB,QAAQ,EAAE,YAAY,EACtB,QAAgB,EAChB,KAAK,EACL,UAAkB,EAClB,IAAQ,EACR,SAAS,EACT,EAAE,EACF,GAAG,IAAI,EACR,EAAE,gBAAgB,2CA+DlB"}

package/src/lib/textarea/llm-textarea.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef, useEffect } from 'react';
+import './llm-textarea.css';
+/**
+ * A multi-line text input component that supports automatic resizing and validation states.
+ */
+export function LlmTextarea({ value, onChange, onValueChange, invalid = false, errors = [], disabled = false, readOnly: reactReadOnly, readonly: specReadOnly, required = false, label, autoResize = false, rows = 3, className, id, ...rest }) {
+    const readOnly = reactReadOnly ?? specReadOnly ?? false;
+    const textareaRef = useRef(null);
+    const inputId = id || (label ? `textarea-${label.toLowerCase().replace(/\s+/g, '-')}` : undefined);
+    const classes = [
+        'llm-textarea',
+        invalid && 'is-invalid',
+        disabled && 'is-disabled',
+        readOnly && 'is-readonly',
+        autoResize && 'is-auto-resize',
+        className,
+    ]
+        .filter(Boolean)
+        .join(' ');
+    useEffect(() => {
+        if (autoResize && textareaRef.current) {
+            const el = textareaRef.current;
+            el.style.height = 'auto';
+            el.style.height = `${el.scrollHeight}px`;
+        }
+    }, [value, autoResize]);
+    const handleChange = (e) => {
+        onChange?.(e);
+        onValueChange?.(e.target.value);
+        if (autoResize && textareaRef.current) {
+            textareaRef.current.style.height = 'auto';
+            textareaRef.current.style.height = `${textareaRef.current.scrollHeight}px`;
+        }
+    };
+    const errorId = inputId ? `${inputId}-errors` : undefined;
+    return (_jsxs("div", { className: classes, children: [label && _jsx("label", { htmlFor: inputId, children: label }), _jsx("textarea", { ref: textareaRef, id: inputId, value: value, onChange: handleChange, disabled: disabled, readOnly: readOnly, required: required, rows: rows, "aria-invalid": invalid || undefined, "aria-required": required || undefined, "aria-describedby": errors.length > 0 ? errorId : undefined, ...rest }), errors.length > 0 && (_jsx("div", { className: "errors", id: errorId, "aria-live": "polite", children: errors.map((err, i) => (_jsx("p", { className: "error-message", children: err }, i))) }))] }));
+}
+//# sourceMappingURL=llm-textarea.js.map

package/src/lib/textarea/llm-textarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"llm-textarea.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/textarea/llm-textarea.tsx"],"names":[],"mappings":"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","sourcesContent":["import { TextareaHTMLAttributes, useRef, useEffect } from 'react';\nimport type { LlmTextareaSpec } from '@atelier-ui/spec';\nimport './llm-textarea.css';\n\n/**\n * Properties for the LlmTextarea component.\n */\nexport interface LlmTextareaProps\n  extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'readOnly'>,\n    LlmTextareaSpec {\n  /**\n   * Current value of the textarea.\n   */\n  value?: string;\n  /**\n   * Whether the textarea is read-only.\n   */\n  readOnly?: boolean;\n  /**\n   * Callback fired when the value changes.\n   */\n  onValueChange?: (value: string) => void;\n  /**\n   * List of error messages to display.\n   */\n  errors?: string[];\n  /**\n   * Label text for the textarea.\n   */\n  label?: string;\n}\n\n/**\n * A multi-line text input component that supports automatic resizing and validation states.\n */\nexport function LlmTextarea({\n  value,\n  onChange,\n  onValueChange,\n  invalid = false,\n  errors = [],\n  disabled = false,\n  readOnly: reactReadOnly,\n  readonly: specReadOnly,\n  required = false,\n  label,\n  autoResize = false,\n  rows = 3,\n  className,\n  id,\n  ...rest\n}: LlmTextareaProps) {\n  const readOnly = reactReadOnly ?? specReadOnly ?? false;\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n  const inputId =\n    id || (label ? `textarea-${label.toLowerCase().replace(/\\s+/g, '-')}` : undefined);\n  const classes = [\n    'llm-textarea',\n    invalid && 'is-invalid',\n    disabled && 'is-disabled',\n    readOnly && 'is-readonly',\n    autoResize && 'is-auto-resize',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  useEffect(() => {\n    if (autoResize && textareaRef.current) {\n      const el = textareaRef.current;\n      el.style.height = 'auto';\n      el.style.height = `${el.scrollHeight}px`;\n    }\n  }, [value, autoResize]);\n\n  const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    onChange?.(e);\n    onValueChange?.(e.target.value);\n    if (autoResize && textareaRef.current) {\n      textareaRef.current.style.height = 'auto';\n      textareaRef.current.style.height = `${textareaRef.current.scrollHeight}px`;\n    }\n  };\n\n  const errorId = inputId ? `${inputId}-errors` : undefined;\n\n  return (\n    <div className={classes}>\n      {label && <label htmlFor={inputId}>{label}</label>}\n      <textarea\n        ref={textareaRef}\n        id={inputId}\n        value={value}\n        onChange={handleChange}\n        disabled={disabled}\n        readOnly={readOnly}\n        required={required}\n        rows={rows}\n        aria-invalid={invalid || undefined}\n        aria-required={required || undefined}\n        aria-describedby={errors.length > 0 ? errorId : undefined}\n        {...rest}\n      />\n      {errors.length > 0 && (\n        <div className=\"errors\" id={errorId} aria-live=\"polite\">\n          {errors.map((err, i) => (\n            <p key={i} className=\"error-message\">\n              {err}\n            </p>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n"]}

package/src/lib/toast/llm-toast.d.ts

@@ -0,0 +1,54 @@
+import { ReactNode } from 'react';
+import type { LlmToastOptions, LlmToastContainerPosition } from '@atelier-ui/spec';
+import './llm-toast.css';
+/**
+ * Internal data structure for a toast message.
+ */
+export interface ToastData extends Required<LlmToastOptions> {
+    id: string;
+    message: string;
+}
+/**
+ * Context provider that manages the toast state.
+ */
+export declare function LlmToastProvider({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+/** Access toast actions: show, dismiss, clear. Must be inside LlmToastProvider. */
+export declare function useLlmToast(): {
+    show: (message: string, options?: LlmToastOptions) => string;
+    dismiss: (id: string) => void;
+    clear: () => void;
+};
+/**
+ * Properties for the LlmToastContainer component.
+ */
+export interface LlmToastContainerProps {
+    /**
+     * Position of the toast container in the viewport.
+     */
+    position?: LlmToastContainerPosition;
+}
+/**
+ * Renders the toast stack at a fixed viewport position.
+ * Must be placed inside LlmToastProvider.
+ */
+export declare function LlmToastContainer({ position }: LlmToastContainerProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Properties for the LlmToastItem component.
+ */
+export interface LlmToastItemProps {
+    /**
+     * The toast data to display.
+     */
+    data: ToastData;
+    /**
+     * Callback fired when the toast is dismissed.
+     */
+    onDismiss: (id: string) => void;
+}
+/**
+ * An individual toast notification item.
+ */
+export declare function LlmToastItem({ data, onDismiss }: LlmToastItemProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=llm-toast.d.ts.map

package/src/lib/toast/llm-toast.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"llm-toast.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/toast/llm-toast.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,SAAS,EACV,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAEV,eAAe,EACf,yBAAyB,EAC1B,MAAM,kBAAkB,CAAC;AAC1B,OAAO,iBAAiB,CAAC;AAEzB;;GAEG;AACH,MAAM,WAAW,SAAU,SAAQ,QAAQ,CAAC,eAAe,CAAC;IAC1D,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;CACjB;AAgBD;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CA6CrE;AAED,mFAAmF;AACnF,wBAAgB,WAAW;oBAhET,MAAM,YAAY,eAAe,KAAK,MAAM;kBAC9C,MAAM,KAAK,IAAI;iBAChB,IAAI;EAiElB;AAED;;GAEG;AACH,MAAM,WAAW,sBAAsB;IACrC;;OAEG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC;CACtC;AAED;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,QAAyB,EAAE,EAAE,sBAAsB,2CAWtF;AAED;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,IAAI,EAAE,SAAS,CAAC;IAChB;;OAEG;IACH,SAAS,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACjC;AAED;;GAEG;AACH,wBAAgB,YAAY,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,iBAAiB,2CA+BlE"}

package/src/lib/toast/llm-toast.js

@@ -0,0 +1,70 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createContext, useContext, useState, useCallback, useRef, } from 'react';
+import './llm-toast.css';
+const ToastContext = createContext({
+    show: () => '',
+    dismiss: () => undefined,
+    clear: () => undefined,
+    toasts: [],
+});
+/**
+ * Context provider that manages the toast state.
+ */
+export function LlmToastProvider({ children }) {
+    const [toasts, setToasts] = useState([]);
+    const timersRef = useRef(new Map());
+    const toastId = useRef(0);
+    const dismiss = useCallback((id) => {
+        const timer = timersRef.current.get(id);
+        if (timer) {
+            clearTimeout(timer);
+            timersRef.current.delete(id);
+        }
+        setToasts((prev) => prev.filter((t) => t.id !== id));
+    }, []);
+    const show = useCallback((message, options = {}) => {
+        const id = `llm-toast-${toastId.current++}`;
+        const toast = {
+            id,
+            message,
+            variant: options.variant ?? 'default',
+            duration: options.duration ?? 5000,
+            dismissible: options.dismissible ?? true,
+        };
+        setToasts((prev) => [...prev, toast]);
+        if (toast.duration > 0) {
+            const timer = setTimeout(() => dismiss(id), toast.duration);
+            timersRef.current.set(id, timer);
+        }
+        return id;
+    }, [dismiss]);
+    const clear = useCallback(() => {
+        for (const timer of timersRef.current.values())
+            clearTimeout(timer);
+        timersRef.current.clear();
+        setToasts([]);
+    }, []);
+    return (_jsx(ToastContext.Provider, { value: { show, dismiss, clear, toasts }, children: children }));
+}
+/** Access toast actions: show, dismiss, clear. Must be inside LlmToastProvider. */
+export function useLlmToast() {
+    const ctx = useContext(ToastContext);
+    return { show: ctx.show, dismiss: ctx.dismiss, clear: ctx.clear };
+}
+/**
+ * Renders the toast stack at a fixed viewport position.
+ * Must be placed inside LlmToastProvider.
+ */
+export function LlmToastContainer({ position = 'bottom-right' }) {
+    const { toasts, dismiss } = useContext(ToastContext);
+    const classes = `llm-toast-container position-${position}`;
+    return (_jsx("div", { className: classes, "aria-live": "polite", role: "status", children: toasts.map((toast) => (_jsx(LlmToastItem, { data: toast, onDismiss: dismiss }, toast.id))) }));
+}
+/**
+ * An individual toast notification item.
+ */
+export function LlmToastItem({ data, onDismiss }) {
+    const classes = `llm-toast variant-${data.variant}`;
+    return (_jsxs("div", { className: classes, role: "status", children: [_jsx("span", { className: "message", children: data.message }), data.dismissible && (_jsx("button", { className: "dismiss", type: "button", "aria-label": "Dismiss", onClick: () => onDismiss(data.id), children: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [_jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), _jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })] }) }))] }));
+}
+//# sourceMappingURL=llm-toast.js.map

package/src/lib/toast/llm-toast.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"llm-toast.js","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/toast/llm-toast.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,aAAa,EACb,UAAU,EACV,QAAQ,EACR,WAAW,EACX,MAAM,GAEP,MAAM,OAAO,CAAC;AAMf,OAAO,iBAAiB,CAAC;AAiBzB,MAAM,YAAY,GAAG,aAAa,CAAoB;IACpD,IAAI,EAAE,GAAG,EAAE,CAAC,EAAE;IACd,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS;IACxB,KAAK,EAAE,GAAG,EAAE,CAAC,SAAS;IACtB,MAAM,EAAE,EAAE;CACX,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,UAAU,gBAAgB,CAAC,EAAE,QAAQ,EAA2B;IACpE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAc,EAAE,CAAC,CAAC;IACtD,MAAM,SAAS,GAAG,MAAM,CAA6C,IAAI,GAAG,EAAE,CAAC,CAAC;IAChF,MAAM,OAAO,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;IAE1B,MAAM,OAAO,GAAG,WAAW,CAAC,CAAC,EAAU,EAAE,EAAE;QACzC,MAAM,KAAK,GAAG,SAAS,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QACxC,IAAI,KAAK,EAAE,CAAC;YACV,YAAY,CAAC,KAAK,CAAC,CAAC;YACpB,SAAS,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QAC/B,CAAC;QACD,SAAS,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC;IACvD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,IAAI,GAAG,WAAW,CACtB,CAAC,OAAe,EAAE,UAA2B,EAAE,EAAU,EAAE;QACzD,MAAM,EAAE,GAAG,aAAa,OAAO,CAAC,OAAO,EAAE,EAAE,CAAC;QAC5C,MAAM,KAAK,GAAc;YACvB,EAAE;YACF,OAAO;YACP,OAAO,EAAE,OAAO,CAAC,OAAO,IAAI,SAAS;YACrC,QAAQ,EAAE,OAAO,CAAC,QAAQ,IAAI,IAAI;YAClC,WAAW,EAAE,OAAO,CAAC,WAAW,IAAI,IAAI;SACzC,CAAC;QACF,SAAS,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,GAAG,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC;QACtC,IAAI,KAAK,CAAC,QAAQ,GAAG,CAAC,EAAE,CAAC;YACvB,MAAM,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;YAC5D,SAAS,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC;QACnC,CAAC;QACD,OAAO,EAAE,CAAC;IACZ,CAAC,EACD,CAAC,OAAO,CAAC,CACV,CAAC;IAEF,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,EAAE;QAC7B,KAAK,MAAM,KAAK,IAAI,SAAS,CAAC,OAAO,CAAC,MAAM,EAAE;YAAE,YAAY,CAAC,KAAK,CAAC,CAAC;QACpE,SAAS,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;QAC1B,SAAS,CAAC,EAAE,CAAC,CAAC;IAChB,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,KAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,YAC3D,QAAQ,GACa,CACzB,CAAC;AACJ,CAAC;AAED,mFAAmF;AACnF,MAAM,UAAU,WAAW;IACzB,MAAM,GAAG,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IACrC,OAAO,EAAE,IAAI,EAAE,GAAG,CAAC,IAAI,EAAE,OAAO,EAAE,GAAG,CAAC,OAAO,EAAE,KAAK,EAAE,GAAG,CAAC,KAAK,EAAE,CAAC;AACpE,CAAC;AAYD;;;GAGG;AACH,MAAM,UAAU,iBAAiB,CAAC,EAAE,QAAQ,GAAG,cAAc,EAA0B;IACrF,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IACrD,MAAM,OAAO,GAAG,gCAAgC,QAAQ,EAAE,CAAC;IAE3D,OAAO,CACL,cAAK,SAAS,EAAE,OAAO,eAAY,QAAQ,EAAC,IAAI,EAAC,QAAQ,YACtD,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CACrB,KAAC,YAAY,IAAgB,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,IAAzC,KAAK,CAAC,EAAE,CAAqC,CACjE,CAAC,GACE,CACP,CAAC;AACJ,CAAC;AAgBD;;GAEG;AACH,MAAM,UAAU,YAAY,CAAC,EAAE,IAAI,EAAE,SAAS,EAAqB;IACjE,MAAM,OAAO,GAAG,qBAAqB,IAAI,CAAC,OAAO,EAAE,CAAC;IACpD,OAAO,CACL,eAAK,SAAS,EAAE,OAAO,EAAE,IAAI,EAAC,QAAQ,aACpC,eAAM,SAAS,EAAC,SAAS,YAAE,IAAI,CAAC,OAAO,GAAQ,EAC9C,IAAI,CAAC,WAAW,IAAI,CACnB,iBACE,SAAS,EAAC,SAAS,EACnB,IAAI,EAAC,QAAQ,gBACF,SAAS,EACpB,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,YAEjC,eACE,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,KAAK,EACjB,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,iBACV,MAAM,aAElB,eAAM,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,IAAI,GAAG,EACtC,eAAM,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,GAAG,IAClC,GACC,CACV,IACG,CACP,CAAC;AACJ,CAAC","sourcesContent":["import {\n  createContext,\n  useContext,\n  useState,\n  useCallback,\n  useRef,\n  ReactNode,\n} from 'react';\nimport type {\n  LlmToastVariant,\n  LlmToastOptions,\n  LlmToastContainerPosition,\n} from '@atelier-ui/spec';\nimport './llm-toast.css';\n\n/**\n * Internal data structure for a toast message.\n */\nexport interface ToastData extends Required<LlmToastOptions> {\n  id: string;\n  message: string;\n}\n\ninterface ToastContextValue {\n  show: (message: string, options?: LlmToastOptions) => string;\n  dismiss: (id: string) => void;\n  clear: () => void;\n  toasts: ToastData[];\n}\n\nconst ToastContext = createContext<ToastContextValue>({\n  show: () => '',\n  dismiss: () => undefined,\n  clear: () => undefined,\n  toasts: [],\n});\n\n/**\n * Context provider that manages the toast state.\n */\nexport function LlmToastProvider({ children }: { children: ReactNode }) {\n  const [toasts, setToasts] = useState<ToastData[]>([]);\n  const timersRef = useRef<Map<string, ReturnType<typeof setTimeout>>>(new Map());\n  const toastId = useRef(0);\n\n  const dismiss = useCallback((id: string) => {\n    const timer = timersRef.current.get(id);\n    if (timer) {\n      clearTimeout(timer);\n      timersRef.current.delete(id);\n    }\n    setToasts((prev) => prev.filter((t) => t.id !== id));\n  }, []);\n\n  const show = useCallback(\n    (message: string, options: LlmToastOptions = {}): string => {\n      const id = `llm-toast-${toastId.current++}`;\n      const toast: ToastData = {\n        id,\n        message,\n        variant: options.variant ?? 'default',\n        duration: options.duration ?? 5000,\n        dismissible: options.dismissible ?? true,\n      };\n      setToasts((prev) => [...prev, toast]);\n      if (toast.duration > 0) {\n        const timer = setTimeout(() => dismiss(id), toast.duration);\n        timersRef.current.set(id, timer);\n      }\n      return id;\n    },\n    [dismiss]\n  );\n\n  const clear = useCallback(() => {\n    for (const timer of timersRef.current.values()) clearTimeout(timer);\n    timersRef.current.clear();\n    setToasts([]);\n  }, []);\n\n  return (\n    <ToastContext.Provider value={{ show, dismiss, clear, toasts }}>\n      {children}\n    </ToastContext.Provider>\n  );\n}\n\n/** Access toast actions: show, dismiss, clear. Must be inside LlmToastProvider. */\nexport function useLlmToast() {\n  const ctx = useContext(ToastContext);\n  return { show: ctx.show, dismiss: ctx.dismiss, clear: ctx.clear };\n}\n\n/**\n * Properties for the LlmToastContainer component.\n */\nexport interface LlmToastContainerProps {\n  /**\n   * Position of the toast container in the viewport.\n   */\n  position?: LlmToastContainerPosition;\n}\n\n/**\n * Renders the toast stack at a fixed viewport position.\n * Must be placed inside LlmToastProvider.\n */\nexport function LlmToastContainer({ position = 'bottom-right' }: LlmToastContainerProps) {\n  const { toasts, dismiss } = useContext(ToastContext);\n  const classes = `llm-toast-container position-${position}`;\n\n  return (\n    <div className={classes} aria-live=\"polite\" role=\"status\">\n      {toasts.map((toast) => (\n        <LlmToastItem key={toast.id} data={toast} onDismiss={dismiss} />\n      ))}\n    </div>\n  );\n}\n\n/**\n * Properties for the LlmToastItem component.\n */\nexport interface LlmToastItemProps {\n  /**\n   * The toast data to display.\n   */\n  data: ToastData;\n  /**\n   * Callback fired when the toast is dismissed.\n   */\n  onDismiss: (id: string) => void;\n}\n\n/**\n * An individual toast notification item.\n */\nexport function LlmToastItem({ data, onDismiss }: LlmToastItemProps) {\n  const classes = `llm-toast variant-${data.variant}`;\n  return (\n    <div className={classes} role=\"status\">\n      <span className=\"message\">{data.message}</span>\n      {data.dismissible && (\n        <button\n          className=\"dismiss\"\n          type=\"button\"\n          aria-label=\"Dismiss\"\n          onClick={() => onDismiss(data.id)}\n        >\n          <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            width=\"14\"\n            height=\"14\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth=\"2.5\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n            <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n          </svg>\n        </button>\n      )}\n    </div>\n  );\n}\n"]}

package/src/lib/toggle/llm-toggle.d.ts

@@ -0,0 +1,29 @@
+import { InputHTMLAttributes, ReactNode } from 'react';
+import type { LlmToggleSpec } from '@atelier-ui/spec';
+import './llm-toggle.css';
+/**
+ * Properties for the LlmToggle component.
+ */
+export interface LlmToggleProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'checked' | 'onChange' | 'readOnly'>, LlmToggleSpec {
+    /**
+     * Whether the toggle is read-only.
+     */
+    readOnly?: boolean;
+    /**
+     * Callback fired when the checked state changes.
+     */
+    onCheckedChange?: (checked: boolean) => void;
+    /**
+     * List of error messages to display.
+     */
+    errors?: string[];
+    /**
+     * Optional content to display alongside the toggle.
+     */
+    children?: ReactNode;
+}
+/**
+ * A toggle switch component for binary choices, supporting validation and custom labels.
+ */
+export declare function LlmToggle({ checked, onCheckedChange, invalid, errors, disabled, readOnly: reactReadOnly, readonly: specReadOnly, required, children, className, id, name, ...rest }: LlmToggleProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=llm-toggle.d.ts.map

package/src/lib/toggle/llm-toggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"llm-toggle.d.ts","sourceRoot":"","sources":["../../../../../../libs/react/src/lib/toggle/llm-toggle.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,SAAS,EAAS,MAAM,OAAO,CAAC;AAC9D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,kBAAkB,CAAC;AAE1B;;GAEG;AACH,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,CAAC,EAC/F,aAAa;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,EACxB,OAAe,EACf,eAAe,EACf,OAAe,EACf,MAAW,EACX,QAAgB,EAChB,QAAQ,EAAE,aAAa,EACvB,QAAQ,EAAE,YAAY,EACtB,QAAgB,EAChB,QAAQ,EACR,SAAS,EACT,EAAE,EACF,IAAI,EACJ,GAAG,IAAI,EACR,EAAE,cAAc,2CAmDhB"}