@tetrascience-npm/tetrascience-react-ui 0.7.0-beta.129.1 → 0.7.0-beta.131.1

package/dist/components/charts/ScatterPlotInteractive/types.d.ts

@@ -0,0 +1,226 @@
+/**
+ * A single data point in the scatter plot
+ */
+export interface ScatterPoint {
+    /** Unique identifier for the point */
+    id: string | number;
+    /** X-axis value */
+    x: number;
+    /** Y-axis value */
+    y: number;
+    /** Optional label for the point */
+    label?: string;
+    /** Additional metadata for tooltips and styling */
+    metadata?: Record<string, unknown>;
+}
+/**
+ * Scale type for axes
+ */
+export type ScaleType = "linear" | "log";
+/**
+ * Marker shape for scatter points
+ */
+export type MarkerShape = "circle" | "square" | "diamond" | "cross" | "x" | "triangle-up" | "triangle-down" | "star";
+/**
+ * Selection mode for interactive selection
+ */
+export type SelectionMode = "replace" | "add" | "remove" | "toggle";
+/**
+ * Color mapping configuration
+ */
+export interface ColorMapping {
+    /** Type of mapping: data-driven or static */
+    type: "static" | "continuous" | "categorical";
+    /** Static color value (for type: "static") */
+    value?: string;
+    /** Data field to map (for type: "continuous" | "categorical") */
+    field?: string;
+    /** Color scale for continuous mapping */
+    colorScale?: string | Array<[number, string]>;
+    /** Discrete colors for categorical mapping */
+    categoryColors?: Record<string, string>;
+    /** Min/max values for continuous mapping (auto-calculated if not provided) */
+    min?: number;
+    max?: number;
+}
+/**
+ * Shape mapping configuration
+ */
+export interface ShapeMapping {
+    /** Type of mapping: data-driven or static */
+    type: "static" | "categorical";
+    /** Static shape value (for type: "static") */
+    value?: MarkerShape;
+    /** Data field to map (for type: "categorical") */
+    field?: string;
+    /** Shape mapping for categorical values */
+    categoryShapes?: Record<string, MarkerShape>;
+}
+/**
+ * Size mapping configuration
+ */
+export interface SizeMapping {
+    /** Type of mapping: data-driven or static */
+    type: "static" | "continuous" | "categorical";
+    /** Static size value (for type: "static") */
+    value?: number;
+    /** Data field to map (for type: "continuous" | "categorical") */
+    field?: string;
+    /** Size range for continuous mapping */
+    sizeRange?: [number, number];
+    /** Discrete sizes for categorical mapping */
+    categorySizes?: Record<string, number>;
+    /** Min/max values for continuous mapping (auto-calculated if not provided) */
+    min?: number;
+    max?: number;
+}
+/**
+ * Axis configuration
+ */
+export interface AxisConfig {
+    /** Axis label */
+    title?: string;
+    /** Scale type (linear or log) */
+    scale?: ScaleType;
+    /** Fixed axis range [min, max] */
+    range?: [number, number];
+    /** Auto-range with optional padding percentage (0-1) */
+    autoRange?: boolean;
+    /** Padding percentage for auto-range (default: 0.1 = 10%) */
+    autoRangePadding?: number;
+}
+/**
+ * Tooltip configuration
+ */
+export interface TooltipConfig {
+    /** Enable/disable tooltips */
+    enabled?: boolean;
+    /** Custom tooltip content function. Lines are separated with `<br>`. */
+    content?: (point: ScatterPoint) => string;
+    /** Fields to display in default tooltip */
+    fields?: string[];
+    /**
+     * Use Plotly's built-in hover labels instead of the theme-styled
+     * HTML tooltip rendered by the component.
+     * @default false
+     */
+    native?: boolean;
+}
+/**
+ * Selection state
+ */
+export interface SelectionState {
+    /** Array of selected point IDs */
+    selectedIds: Set<string | number>;
+}
+/**
+ * Downsampling configuration for performance optimization
+ */
+export interface DownsamplingConfig {
+    /** Enable downsampling */
+    enabled: boolean;
+    /** Target number of points to display */
+    maxPoints?: number;
+    /** Downsampling strategy */
+    strategy?: "lttb";
+}
+/**
+ * Props for ScatterPlotInteractive component
+ */
+export interface ScatterPlotInteractiveProps {
+    /**
+     * Array of data points to plot
+     */
+    data: ScatterPoint[];
+    /**
+     * Chart title
+     */
+    title?: string;
+    /**
+     * X-axis configuration
+     */
+    xAxis?: AxisConfig;
+    /**
+     * Y-axis configuration
+     */
+    yAxis?: AxisConfig;
+    /**
+     * Color mapping configuration
+     */
+    colorMapping?: ColorMapping;
+    /**
+     * Shape mapping configuration
+     */
+    shapeMapping?: ShapeMapping;
+    /**
+     * Size mapping configuration
+     */
+    sizeMapping?: SizeMapping;
+    /**
+     * Tooltip configuration
+     */
+    tooltip?: TooltipConfig;
+    /**
+     * Enable click selection
+     * @default true
+     */
+    enableClickSelection?: boolean;
+    /**
+     * Enable box selection (drag to select rectangular region)
+     * @default true
+     */
+    enableBoxSelection?: boolean;
+    /**
+     * Enable lasso selection (freeform selection)
+     * @default true
+     */
+    enableLassoSelection?: boolean;
+    /**
+     * Controlled selection state.
+     * If provided, component operates in controlled mode.
+     */
+    selectedIds?: Set<string | number>;
+    /**
+     * Callback when selection changes
+     */
+    onSelectionChange?: (selectedIds: Set<string | number>, mode: SelectionMode) => void;
+    /**
+     * Callback when a point is clicked
+     */
+    onPointClick?: (point: ScatterPoint, event: MouseEvent) => void;
+    /**
+     * Downsampling configuration for large datasets
+     */
+    downsampling?: DownsamplingConfig;
+    /**
+     * Chart width in pixels
+     * @default 800
+     */
+    width?: number;
+    /**
+     * Chart height in pixels
+     * @default 600
+     */
+    height?: number;
+    /**
+     * Show the continuous color-scale bar when using a continuous `colorMapping`.
+     * Has no effect for categorical or static mappings.
+     * @default true
+     */
+    showColorBar?: boolean;
+    /**
+     * Custom CSS class name
+     */
+    className?: string;
+}
+/**
+ * Data format for selection propagation between components
+ */
+export interface SelectionEvent {
+    /** Array of selected point IDs */
+    selectedIds: Set<string | number>;
+    /** Selection mode used */
+    mode: SelectionMode;
+    /** Source component identifier (optional) */
+    source?: string;
+}

package/dist/components/charts/ScatterPlotInteractive/utils.d.ts

@@ -0,0 +1,72 @@
+import { AxisConfig, ColorMapping, DownsamplingConfig, ScatterPoint, SelectionMode, ShapeMapping, SizeMapping } from './types';
+import { PlotlyThemeColors } from '../../../hooks/use-plotly-theme';
+/**
+ * Calculate min and max values for a numeric field in the data
+ */
+export declare function calculateRange(data: ScatterPoint[], field: string): {
+    min: number;
+    max: number;
+};
+/**
+ * Get unique categorical values from a field
+ */
+export declare function getUniqueCategories(data: ScatterPoint[], field: string): string[];
+/**
+ * Map colors based on color mapping configuration
+ */
+export declare function mapColors(data: ScatterPoint[], colorMapping?: ColorMapping): string[];
+/**
+ * Map shapes based on shape mapping configuration
+ */
+export declare function mapShapes(data: ScatterPoint[], shapeMapping?: ShapeMapping): string[];
+/**
+ * Map sizes based on size mapping configuration
+ */
+export declare function mapSizes(data: ScatterPoint[], sizeMapping?: SizeMapping): number[];
+/**
+ * Downsample data using specified strategy
+ */
+export declare function downsampleData(data: ScatterPoint[], config: DownsamplingConfig): ScatterPoint[];
+/**
+ * Largest Triangle Three Buckets (LTTB) downsampling algorithm.
+ * Preserves the visual shape of the data by maximizing the triangle area
+ * formed by adjacent bucket centroids and each candidate point.
+ * Exported for unit testing
+ */
+export declare function lttbDownsample(data: ScatterPoint[], threshold: number): ScatterPoint[];
+/**
+ * Generate default tooltip content
+ */
+export declare function generateTooltipContent(point: ScatterPoint, fields?: string[]): string;
+/**
+ * Determine selection mode from keyboard event
+ */
+export declare function getSelectionMode(event: {
+    shiftKey: boolean;
+    ctrlKey: boolean;
+    metaKey: boolean;
+}): SelectionMode;
+/**
+ * Calculate axis range with padding.
+ *
+ * When `scale` is `"log"`, the returned range is in log10 units (what Plotly
+ * expects for `type: "log"` axes), and padding is applied in log-space so that
+ * the visual margin is proportional on the logarithmic axis.
+ */
+export declare function calculateAxisRange(data: ScatterPoint[], axis: "x" | "y", padding?: number, scale?: "linear" | "log"): [number, number];
+/**
+ * Apply selection to a set of point IDs
+ */
+export declare function applySelection(currentSelection: Set<string | number>, newIds: Set<string | number>, mode: SelectionMode): Set<string | number>;
+export declare const getPlotlyLayoutConfig: ({ title, xAxis, yAxis, width, height, xRange, yRange, enableLassoSelection, enableBoxSelection, theme, }: {
+    title: string | undefined;
+    xAxis: AxisConfig;
+    yAxis: AxisConfig;
+    width: number;
+    height: number;
+    xRange: [number, number] | undefined;
+    yRange: [number, number] | undefined;
+    enableLassoSelection: boolean;
+    enableBoxSelection: boolean;
+    theme: PlotlyThemeColors;
+}) => Partial<Plotly.Layout>;

package/dist/components/charts/StackedChromatogram/StackedChromatogram.d.ts

@@ -0,0 +1,3 @@
+import { StackedChromatogramProps } from './types';
+export declare function StackedChromatogram({ series, stackingMode, stackOffset, stackingOrder, annotations, ...restProps }: StackedChromatogramProps): import("react/jsx-runtime").JSX.Element;
+export default StackedChromatogram;

package/dist/components/charts/StackedChromatogram/index.d.ts

@@ -0,0 +1,3 @@
+export { StackedChromatogram } from './StackedChromatogram';
+export type { StackedChromatogramProps, StackingMode } from './types';
+export { applyStackingTransform } from './transforms';

package/dist/components/charts/StackedChromatogram/transforms.d.ts

@@ -0,0 +1,9 @@
+import { ChromatogramSeries, PeakAnnotation } from '../Chromatogram';
+import { StackingMode } from './types';
+interface TransformResult {
+    series: ChromatogramSeries[];
+    annotations: PeakAnnotation[];
+    yRange: [number, number];
+}
+export declare function applyStackingTransform(inputSeries: ChromatogramSeries[], inputAnnotations: PeakAnnotation[][] | undefined, mode: StackingMode, stackOffset: number, stackingOrder?: "first-on-bottom" | "first-on-top"): TransformResult;
+export {};

package/dist/components/charts/StackedChromatogram/types.d.ts

@@ -0,0 +1,26 @@
+import { ChromatogramProps, ChromatogramSeries, PeakAnnotation } from '../Chromatogram';
+export type StackingMode = "overlay" | "stack";
+export interface StackedChromatogramProps extends Omit<ChromatogramProps, "series" | "annotations" | "yRange"> {
+    /** Array of data series to display */
+    series: ChromatogramSeries[];
+    /** Stacking mode: 'overlay' (default) or 'stack' */
+    stackingMode?: StackingMode;
+    /**
+     * Y-offset between stacked series in data units (e.g., AU).
+     * Only applies in 'stack' mode; ignored in 'overlay'.
+     */
+    stackOffset?: number;
+    /**
+     * Peak annotations per series, parallel to the series array.
+     * annotations[i] corresponds to series[i].
+     * In stack mode, y values are shifted by the series offset.
+     */
+    annotations?: PeakAnnotation[][];
+    /**
+     * Controls which end of the stack series[0] lands on (stack mode only).
+     * - "first-on-bottom" (default) — series[0] sits at the base; series[N-1] is highest.
+     * - "first-on-top" — series[0] is shifted to the top; series[N-1] is at the base.
+     *   Annotations follow the chosen direction.
+     */
+    stackingOrder?: "first-on-bottom" | "first-on-top";
+}

package/dist/components/charts/plotly-loader.cjs

@@ -1,2 +1,2 @@
-"use strict";var c=Object.create;var d=Object.defineProperty;var s=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var u=Object.getPrototypeOf,p=Object.prototype.hasOwnProperty;var P=(t,e,l,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of y(e))!p.call(t,o)&&o!==l&&d(t,o,{get:()=>e[o],enumerable:!(a=s(e,o))||a.enumerable});return t};var f=(t,e,l)=>(l=t!=null?c(u(t)):{},P(e||!t||!t.__esModule?d(l,"default",{value:t,enumerable:!0}):l,t));Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i="Failed to load 'plotly.js-dist'. It is an optional peer dependency of @tetrascience-npm/tetrascience-react-ui required by the chart components — install it in your app (e.g. `yarn add plotly.js-dist`).";let r=null,n=null;function h(){return n??=import("plotly.js-dist").then(t=>{const e=t;return r=e.default??e,r}).catch(t=>{throw n=null,console.error(i,t),new Error(i)}),n}function w(){if(!r)throw new Error("Plotly accessed before loadPlotly() resolved. Call loadPlotly() and draw the plot first.");return r}exports.getLoadedPlotly=w;exports.loadPlotly=h;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function d(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const l in e)if(l!=="default"){const n=Object.getOwnPropertyDescriptor(e,l);Object.defineProperty(t,l,n.get?n:{enumerable:!0,get:()=>e[l]})}}return t.default=e,Object.freeze(t)}const a="Failed to load 'plotly.js-dist'. It is an optional peer dependency of @tetrascience-npm/tetrascience-react-ui required by the chart components — install it in your app (e.g. `yarn add plotly.js-dist`).";let o=null,r=null;function i(){return r??=Promise.resolve().then(()=>d(require("plotly.js-dist"))).then(e=>{const t=e;return o=t.default??t,o}).catch(e=>{throw r=null,console.error(a,e),new Error(a)}),r}function c(){if(!o)throw new Error("Plotly accessed before loadPlotly() resolved. Call loadPlotly() and draw the plot first.");return o}exports.getLoadedPlotly=c;exports.loadPlotly=i;
 //# sourceMappingURL=plotly-loader.cjs.map

package/dist/components/charts/plotly-loader.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"plotly-loader.cjs","sources":["../../../src/components/charts/plotly-loader.ts"],"sourcesContent":["/**\n * Lazy Plotly loader (SW-2007).\n *\n * The kit ships preserved ES modules with all dependencies externalized, so a\n * static `import Plotly from \"plotly.js-dist\"` in any chart lands the full\n * ~4.7 MB Plotly dist in the consumer's main chunk — before any chart renders.\n * Loading it through this module's dynamic `import()` instead lets consumer\n * bundlers split Plotly into its own chunk, fetched only when a chart mounts.\n *\n * Chart components must call `loadPlotly()` before drawing. Code that only\n * runs after a plot exists (hover handlers, resize relayouts, unmount purges)\n * can use the synchronous `getLoadedPlotly()`.\n *\n * `plotly.js-dist` is an *optional* peer dependency (SW-2007): consumers that\n * use the kit's charts must add it to their own app; consumers that don't\n * never install its ~4.7 MB. A missing peer surfaces at build time as an\n * unresolved-import error from the consumer's bundler; the runtime guard below\n * covers the rarer case where the import resolves but fails to evaluate.\n */\n\ntype PlotlyModule = typeof import(\"plotly.js-dist\");\n\nconst MISSING_PLOTLY_MESSAGE =\n  \"Failed to load 'plotly.js-dist'. It is an optional peer dependency of \" +\n  \"@tetrascience-npm/tetrascience-react-ui required by the chart components — \" +\n  \"install it in your app (e.g. `yarn add plotly.js-dist`).\";\n\nlet loadedPlotly: PlotlyModule | null = null;\nlet plotlyPromise: Promise<PlotlyModule> | null = null;\n\n/** Import Plotly on first use; subsequent calls reuse the same promise. */\nexport function loadPlotly(): Promise<PlotlyModule> {\n  plotlyPromise ??= import(\"plotly.js-dist\")\n    .then((mod) => {\n      // plotly.js-dist is CJS; depending on the consumer's bundler interop the\n      // API surface is either the namespace itself or its `default` export.\n      const withDefault = mod as PlotlyModule & { default?: PlotlyModule };\n      loadedPlotly = withDefault.default ?? withDefault;\n      return loadedPlotly;\n    })\n    .catch((error: unknown) => {\n      // Reset so a later mount can retry, and rethrow with install guidance.\n      plotlyPromise = null;\n      console.error(MISSING_PLOTLY_MESSAGE, error);\n      throw new Error(MISSING_PLOTLY_MESSAGE);\n    });\n  return plotlyPromise;\n}\n\n/**\n * Synchronous access to the loaded Plotly module. Only valid after\n * `loadPlotly()` has resolved — i.e. in code paths that can only run once a\n * plot has been drawn (event handlers, cleanups, resize effects).\n */\nexport function getLoadedPlotly(): PlotlyModule {\n  if (!loadedPlotly) {\n    throw new Error(\n      \"Plotly accessed before loadPlotly() resolved. Call loadPlotly() and draw the plot first.\",\n    );\n  }\n  return loadedPlotly;\n}\n\nexport type { PlotlyModule };\n"],"names":["MISSING_PLOTLY_MESSAGE","loadedPlotly","plotlyPromise","loadPlotly","mod","withDefault","error","getLoadedPlotly"],"mappings":"2hBAsBA,MAAMA,EACJ,4MAIF,IAAIC,EAAoC,KACpCC,EAA8C,KAG3C,SAASC,GAAoC,CAClD,OAAAD,IAAkB,OAAO,gBAAgB,EACtC,KAAME,GAAQ,CAGb,MAAMC,EAAcD,EACpB,OAAAH,EAAeI,EAAY,SAAWA,EAC/BJ,CACT,CAAC,EACA,MAAOK,GAAmB,CAEzB,MAAAJ,EAAgB,KAChB,QAAQ,MAAMF,EAAwBM,CAAK,EACrC,IAAI,MAAMN,CAAsB,CACxC,CAAC,EACIE,CACT,CAOO,SAASK,GAAgC,CAC9C,GAAI,CAACN,EACH,MAAM,IAAI,MACR,0FAAA,EAGJ,OAAOA,CACT"}
+{"version":3,"file":"plotly-loader.cjs","sources":["../../../src/components/charts/plotly-loader.ts"],"sourcesContent":["/**\n * Lazy Plotly loader (SW-2007).\n *\n * The kit ships preserved ES modules with all dependencies externalized, so a\n * static `import Plotly from \"plotly.js-dist\"` in any chart lands the full\n * ~4.7 MB Plotly dist in the consumer's main chunk — before any chart renders.\n * Loading it through this module's dynamic `import()` instead lets consumer\n * bundlers split Plotly into its own chunk, fetched only when a chart mounts.\n *\n * Chart components must call `loadPlotly()` before drawing. Code that only\n * runs after a plot exists (hover handlers, resize relayouts, unmount purges)\n * can use the synchronous `getLoadedPlotly()`.\n *\n * `plotly.js-dist` is an *optional* peer dependency (SW-2007): consumers that\n * use the kit's charts must add it to their own app; consumers that don't\n * never install its ~4.7 MB. A missing peer surfaces at build time as an\n * unresolved-import error from the consumer's bundler; the runtime guard below\n * covers the rarer case where the import resolves but fails to evaluate.\n */\n\ntype PlotlyModule = typeof import(\"plotly.js-dist\");\n\nconst MISSING_PLOTLY_MESSAGE =\n  \"Failed to load 'plotly.js-dist'. It is an optional peer dependency of \" +\n  \"@tetrascience-npm/tetrascience-react-ui required by the chart components — \" +\n  \"install it in your app (e.g. `yarn add plotly.js-dist`).\";\n\nlet loadedPlotly: PlotlyModule | null = null;\nlet plotlyPromise: Promise<PlotlyModule> | null = null;\n\n/** Import Plotly on first use; subsequent calls reuse the same promise. */\nexport function loadPlotly(): Promise<PlotlyModule> {\n  plotlyPromise ??= import(\"plotly.js-dist\")\n    .then((mod) => {\n      // plotly.js-dist is CJS; depending on the consumer's bundler interop the\n      // API surface is either the namespace itself or its `default` export.\n      const withDefault = mod as PlotlyModule & { default?: PlotlyModule };\n      loadedPlotly = withDefault.default ?? withDefault;\n      return loadedPlotly;\n    })\n    .catch((error: unknown) => {\n      // Reset so a later mount can retry, and rethrow with install guidance.\n      plotlyPromise = null;\n      console.error(MISSING_PLOTLY_MESSAGE, error);\n      throw new Error(MISSING_PLOTLY_MESSAGE);\n    });\n  return plotlyPromise;\n}\n\n/**\n * Synchronous access to the loaded Plotly module. Only valid after\n * `loadPlotly()` has resolved — i.e. in code paths that can only run once a\n * plot has been drawn (event handlers, cleanups, resize effects).\n */\nexport function getLoadedPlotly(): PlotlyModule {\n  if (!loadedPlotly) {\n    throw new Error(\n      \"Plotly accessed before loadPlotly() resolved. Call loadPlotly() and draw the plot first.\",\n    );\n  }\n  return loadedPlotly;\n}\n\nexport type { PlotlyModule };\n"],"names":["MISSING_PLOTLY_MESSAGE","loadedPlotly","plotlyPromise","loadPlotly","_interopNamespaceDefault","mod","withDefault","error","getLoadedPlotly"],"mappings":"6VAsBA,MAAMA,EACJ,4MAIF,IAAIC,EAAoC,KACpCC,EAA8C,KAG3C,SAASC,GAAoC,CAClD,OAAAD,IAAkB,QAAA,QAAA,EAAA,KAAA,IAAAE,EAAA,QAAO,gBAAgB,CAAA,CAAA,EACtC,KAAMC,GAAQ,CAGb,MAAMC,EAAcD,EACpB,OAAAJ,EAAeK,EAAY,SAAWA,EAC/BL,CACT,CAAC,EACA,MAAOM,GAAmB,CAEzB,MAAAL,EAAgB,KAChB,QAAQ,MAAMF,EAAwBO,CAAK,EACrC,IAAI,MAAMP,CAAsB,CACxC,CAAC,EACIE,CACT,CAOO,SAASM,GAAgC,CAC9C,GAAI,CAACP,EACH,MAAM,IAAI,MACR,0FAAA,EAGJ,OAAOA,CACT"}

package/dist/components/charts/plotly-loader.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Lazy Plotly loader (SW-2007).
+ *
+ * The kit ships preserved ES modules with all dependencies externalized, so a
+ * static `import Plotly from "plotly.js-dist"` in any chart lands the full
+ * ~4.7 MB Plotly dist in the consumer's main chunk — before any chart renders.
+ * Loading it through this module's dynamic `import()` instead lets consumer
+ * bundlers split Plotly into its own chunk, fetched only when a chart mounts.
+ *
+ * Chart components must call `loadPlotly()` before drawing. Code that only
+ * runs after a plot exists (hover handlers, resize relayouts, unmount purges)
+ * can use the synchronous `getLoadedPlotly()`.
+ *
+ * `plotly.js-dist` is an *optional* peer dependency (SW-2007): consumers that
+ * use the kit's charts must add it to their own app; consumers that don't
+ * never install its ~4.7 MB. A missing peer surfaces at build time as an
+ * unresolved-import error from the consumer's bundler; the runtime guard below
+ * covers the rarer case where the import resolves but fails to evaluate.
+ */
+type PlotlyModule = typeof import("plotly.js-dist");
+/** Import Plotly on first use; subsequent calls reuse the same promise. */
+export declare function loadPlotly(): Promise<PlotlyModule>;
+/**
+ * Synchronous access to the loaded Plotly module. Only valid after
+ * `loadPlotly()` has resolved — i.e. in code paths that can only run once a
+ * plot has been drawn (event handlers, cleanups, resize effects).
+ */
+export declare function getLoadedPlotly(): PlotlyModule;
+export type { PlotlyModule };

package/dist/components/composed/AssistantLayout/AssistantLayout.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),j=require("lucide-react"),k=require("react"),p=require("./dockLayout.cjs"),D=require("../../ui/button.cjs"),x=require("../../ui/resizable.cjs"),u=require("../../../lib/utils.cjs");function L(n){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const e in n)if(e!=="default"){const o=Object.getOwnPropertyDescriptor(n,e);Object.defineProperty(t,e,o.get?o:{enumerable:!0,get:()=>n[e]})}}return t.default=n,Object.freeze(t)}const l=L(k),N=l.createContext(null);function I(n,t){if(typeof window>"u")return t;const e=window.localStorage.getItem(`${n}.dock`);return e==="right"||e==="bottom"||e==="left"?e:t}function C(n,t){if(typeof window>"u")return t;const e=Number(window.localStorage.getItem(`${n}.size`));return!Number.isFinite(e)||e<=0||e>=100?t:e}function R({children:n,storageKey:t="ts-ui.assistant",defaultDock:e="left",defaultSize:o=32,defaultVisible:f=!0,persist:i=!0}){const[a,c]=l.useState(()=>i?I(t,e):e),[m,r]=l.useState(()=>i?C(t,o):o),[h,S]=l.useState(f),w=l.useCallback(d=>{c(d),i&&typeof window<"u"&&window.localStorage.setItem(`${t}.dock`,d)},[t,i]),b=l.useCallback(d=>{r(d),i&&typeof window<"u"&&window.localStorage.setItem(`${t}.size`,String(Math.round(d)))},[t,i]),v=l.useMemo(()=>({dock:a,setDock:w,size:m,setSize:b,visible:h,setVisible:S}),[a,w,m,b,h]);return s.jsx(N.Provider,{value:v,children:n})}function y(){const n=l.useContext(N);if(!n)throw new Error("useAssistantLayout must be used within an AssistantLayoutProvider");return n}const O=[{value:"left",label:"Dock assistant left",Icon:j.PanelLeft},{value:"bottom",label:"Dock assistant bottom",Icon:j.PanelBottom},{value:"right",label:"Dock assistant right",Icon:j.PanelRight}];function _({label:n="AI Assistant",className:t}){const{dock:e,setDock:o,visible:f,setVisible:i}=y();return s.jsxs("div",{className:u.cn("flex items-center gap-2",t),children:[n!=null&&s.jsx("span",{className:"text-sm font-medium",children:n}),s.jsx("div",{className:"inline-flex overflow-hidden rounded-lg border border-border",children:O.map(({value:a,label:c,Icon:m})=>{const r=f&&e===a;return s.jsx(D.Button,{variant:r?"secondary":"ghost",size:"icon-sm",className:"rounded-none bg-clip-border","aria-label":r?"Hide AI Assistant":c,"aria-pressed":r,title:r?"Hide AI Assistant":c,onClick:()=>{r?i(!1):(o(a),i(!0))},children:s.jsx(m,{className:"size-4"})},a)})})]})}const A="flex min-h-0 min-w-0 p-2",g="flex h-full min-h-0 min-w-0 flex-1 flex-col overflow-hidden rounded-lg border border-border bg-card",z="assistant";function q({assistant:n,children:t,minSize:e=20,maxSize:o=70,className:f,assistantClassName:i,contentClassName:a}){const{dock:c,size:m,setSize:r,visible:h}=y(),{orientation:S,assistantFirst:w}=p.dockPanels(c);if(!h)return s.jsx("div",{"data-slot":"assistant-layout",className:u.cn("flex min-h-0 flex-1 overflow-hidden",f),children:s.jsx("div",{className:u.cn(A,"flex-1"),children:s.jsx("div",{"data-slot":"assistant-layout-content",className:u.cn(g,a),children:t})})});const b=s.jsx(x.ResizablePanel,{id:z,defaultSize:`${m}%`,minSize:`${e}%`,maxSize:`${o}%`,className:A,children:s.jsx("div",{"data-slot":"assistant-layout-assistant",className:u.cn(g,i),children:n})}),v=s.jsx(x.ResizablePanel,{id:"content",className:A,children:s.jsx("div",{"data-slot":"assistant-layout-content",className:u.cn(g,a),children:t})});return s.jsx(x.ResizablePanelGroup,{orientation:S,"data-slot":"assistant-layout",className:u.cn("min-h-0 flex-1 overflow-hidden",f),onLayoutChanged:d=>{const P=d[z];typeof P=="number"&&r(P)},children:w?s.jsxs(s.Fragment,{children:[b,s.jsx(x.ResizableHandle,{withHandle:!0}),v]}):s.jsxs(s.Fragment,{children:[v,s.jsx(x.ResizableHandle,{withHandle:!0}),b]})},c)}exports.AssistantDockControls=_;exports.AssistantLayout=q;exports.AssistantLayoutProvider=R;exports.useAssistantLayout=y;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),j=require("lucide-react"),k=require("react"),p=require("./dockLayout.cjs"),D=require("../../../ui/button.cjs"),x=require("../../../ui/resizable.cjs"),u=require("../../../lib/utils.cjs");function L(n){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const e in n)if(e!=="default"){const o=Object.getOwnPropertyDescriptor(n,e);Object.defineProperty(t,e,o.get?o:{enumerable:!0,get:()=>n[e]})}}return t.default=n,Object.freeze(t)}const l=L(k),N=l.createContext(null);function I(n,t){if(typeof window>"u")return t;const e=window.localStorage.getItem(`${n}.dock`);return e==="right"||e==="bottom"||e==="left"?e:t}function C(n,t){if(typeof window>"u")return t;const e=Number(window.localStorage.getItem(`${n}.size`));return!Number.isFinite(e)||e<=0||e>=100?t:e}function R({children:n,storageKey:t="ts-ui.assistant",defaultDock:e="left",defaultSize:o=32,defaultVisible:f=!0,persist:i=!0}){const[a,c]=l.useState(()=>i?I(t,e):e),[m,r]=l.useState(()=>i?C(t,o):o),[h,S]=l.useState(f),w=l.useCallback(d=>{c(d),i&&typeof window<"u"&&window.localStorage.setItem(`${t}.dock`,d)},[t,i]),b=l.useCallback(d=>{r(d),i&&typeof window<"u"&&window.localStorage.setItem(`${t}.size`,String(Math.round(d)))},[t,i]),v=l.useMemo(()=>({dock:a,setDock:w,size:m,setSize:b,visible:h,setVisible:S}),[a,w,m,b,h]);return s.jsx(N.Provider,{value:v,children:n})}function y(){const n=l.useContext(N);if(!n)throw new Error("useAssistantLayout must be used within an AssistantLayoutProvider");return n}const _=[{value:"left",label:"Dock assistant left",Icon:j.PanelLeft},{value:"bottom",label:"Dock assistant bottom",Icon:j.PanelBottom},{value:"right",label:"Dock assistant right",Icon:j.PanelRight}];function O({label:n="AI Assistant",className:t}){const{dock:e,setDock:o,visible:f,setVisible:i}=y();return s.jsxs("div",{className:u.cn("flex items-center gap-2",t),children:[n!=null&&s.jsx("span",{className:"text-sm font-medium",children:n}),s.jsx("div",{className:"inline-flex overflow-hidden rounded-lg border border-border",children:_.map(({value:a,label:c,Icon:m})=>{const r=f&&e===a;return s.jsx(D.Button,{variant:r?"secondary":"ghost",size:"icon-sm",className:"rounded-none bg-clip-border","aria-label":r?"Hide AI Assistant":c,"aria-pressed":r,title:r?"Hide AI Assistant":c,onClick:()=>{r?i(!1):(o(a),i(!0))},children:s.jsx(m,{className:"size-4"})},a)})})]})}const A="flex min-h-0 min-w-0 p-2",g="flex h-full min-h-0 min-w-0 flex-1 flex-col overflow-hidden rounded-lg border border-border bg-card",z="assistant";function q({assistant:n,children:t,minSize:e=20,maxSize:o=70,className:f,assistantClassName:i,contentClassName:a}){const{dock:c,size:m,setSize:r,visible:h}=y(),{orientation:S,assistantFirst:w}=p.dockPanels(c);if(!h)return s.jsx("div",{"data-slot":"assistant-layout",className:u.cn("flex min-h-0 flex-1 overflow-hidden",f),children:s.jsx("div",{className:u.cn(A,"flex-1"),children:s.jsx("div",{"data-slot":"assistant-layout-content",className:u.cn(g,a),children:t})})});const b=s.jsx(x.ResizablePanel,{id:z,defaultSize:`${m}%`,minSize:`${e}%`,maxSize:`${o}%`,className:A,children:s.jsx("div",{"data-slot":"assistant-layout-assistant",className:u.cn(g,i),children:n})}),v=s.jsx(x.ResizablePanel,{id:"content",className:A,children:s.jsx("div",{"data-slot":"assistant-layout-content",className:u.cn(g,a),children:t})});return s.jsx(x.ResizablePanelGroup,{orientation:S,"data-slot":"assistant-layout",className:u.cn("min-h-0 flex-1 overflow-hidden",f),onLayoutChanged:d=>{const P=d[z];typeof P=="number"&&r(P)},children:w?s.jsxs(s.Fragment,{children:[b,s.jsx(x.ResizableHandle,{withHandle:!0}),v]}):s.jsxs(s.Fragment,{children:[v,s.jsx(x.ResizableHandle,{withHandle:!0}),b]})},c)}exports.AssistantDockControls=O;exports.AssistantLayout=q;exports.AssistantLayoutProvider=R;exports.useAssistantLayout=y;
 //# sourceMappingURL=AssistantLayout.cjs.map

package/dist/components/composed/AssistantLayout/AssistantLayout.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AssistantLayout.cjs","sources":["../../../../src/components/composed/AssistantLayout/AssistantLayout.tsx"],"sourcesContent":["\"use client\"\n\nimport { PanelBottom, PanelLeft, PanelRight } from \"lucide-react\"\nimport * as React from \"react\"\n\nimport { dockPanels, type AssistantDock } from \"./dockLayout\"\n\nimport { Button } from \"@/components/ui/button\"\nimport {\n  ResizableHandle,\n  ResizablePanel,\n  ResizablePanelGroup,\n} from \"@/components/ui/resizable\"\nimport { cn } from \"@/lib/utils\"\n\n// ---------------------------------------------------------------------------\n// Context + provider\n// ---------------------------------------------------------------------------\n\ninterface AssistantLayoutContextValue {\n  /** Where the assistant docks. Persisted. */\n  dock: AssistantDock\n  setDock: (dock: AssistantDock) => void\n  /** Assistant size as a percentage of the layout along the dock axis. Persisted. */\n  size: number\n  setSize: (size: number) => void\n  /** Whether the assistant is shown. In-memory by default (resets to visible on reload). */\n  visible: boolean\n  setVisible: (visible: boolean) => void\n}\n\nconst AssistantLayoutContext = React.createContext<AssistantLayoutContextValue | null>(null)\n\nexport interface AssistantLayoutProviderProps {\n  children: React.ReactNode\n  /** localStorage key prefix for the persisted dock + size. */\n  storageKey?: string\n  /** Default dock when nothing is persisted. */\n  defaultDock?: AssistantDock\n  /** Default assistant size as a percentage (1–99) of the layout. */\n  defaultSize?: number\n  /** Whether the assistant starts visible. */\n  defaultVisible?: boolean\n  /** Persist dock + size to localStorage. Defaults to `true`. */\n  persist?: boolean\n}\n\nfunction readDock(key: string, fallback: AssistantDock): AssistantDock {\n  if (typeof window === \"undefined\") return fallback\n  const v = window.localStorage.getItem(`${key}.dock`)\n  return v === \"right\" || v === \"bottom\" || v === \"left\" ? v : fallback\n}\n\nfunction readSize(key: string, fallback: number): number {\n  if (typeof window === \"undefined\") return fallback\n  const v = Number(window.localStorage.getItem(`${key}.size`))\n  // Persisted as a percentage; ignore anything outside the open (0, 100) range.\n  if (!Number.isFinite(v) || v <= 0 || v >= 100) return fallback\n  return v\n}\n\nexport function AssistantLayoutProvider({\n  children,\n  storageKey = \"ts-ui.assistant\",\n  defaultDock = \"left\",\n  defaultSize = 32,\n  defaultVisible = true,\n  persist = true,\n}: AssistantLayoutProviderProps) {\n  const [dock, setDockState] = React.useState<AssistantDock>(() =>\n    persist ? readDock(storageKey, defaultDock) : defaultDock\n  )\n  const [size, setSizeState] = React.useState<number>(() =>\n    persist ? readSize(storageKey, defaultSize) : defaultSize\n  )\n  const [visible, setVisible] = React.useState(defaultVisible)\n\n  const setDock = React.useCallback(\n    (next: AssistantDock) => {\n      setDockState(next)\n      if (persist && typeof window !== \"undefined\")\n        window.localStorage.setItem(`${storageKey}.dock`, next)\n    },\n    [storageKey, persist]\n  )\n\n  const setSize = React.useCallback(\n    (next: number) => {\n      setSizeState(next)\n      if (persist && typeof window !== \"undefined\")\n        window.localStorage.setItem(`${storageKey}.size`, String(Math.round(next)))\n    },\n    [storageKey, persist]\n  )\n\n  const value = React.useMemo(\n    () => ({ dock, setDock, size, setSize, visible, setVisible }),\n    [dock, setDock, size, setSize, visible]\n  )\n\n  return <AssistantLayoutContext.Provider value={value}>{children}</AssistantLayoutContext.Provider>\n}\n\nexport function useAssistantLayout(): AssistantLayoutContextValue {\n  const ctx = React.useContext(AssistantLayoutContext)\n  if (!ctx) throw new Error(\"useAssistantLayout must be used within an AssistantLayoutProvider\")\n  return ctx\n}\n\n// ---------------------------------------------------------------------------\n// Dock controls (segmented icon control for a top bar)\n// ---------------------------------------------------------------------------\n\nconst DOCK_OPTIONS: { value: AssistantDock; label: string; Icon: typeof PanelLeft }[] = [\n  { value: \"left\", label: \"Dock assistant left\", Icon: PanelLeft },\n  { value: \"bottom\", label: \"Dock assistant bottom\", Icon: PanelBottom },\n  { value: \"right\", label: \"Dock assistant right\", Icon: PanelRight },\n]\n\nexport interface AssistantDockControlsProps {\n  /** Label shown before the icons. Pass `null` to hide it. */\n  label?: React.ReactNode\n  className?: string\n}\n\n/**\n * Segmented control of dock icons. Clicking an inactive icon docks + shows the\n * assistant there; clicking the active icon again hides it.\n */\nexport function AssistantDockControls({ label = \"AI Assistant\", className }: AssistantDockControlsProps) {\n  const { dock, setDock, visible, setVisible } = useAssistantLayout()\n\n  return (\n    <div className={cn(\"flex items-center gap-2\", className)}>\n      {label != null && <span className=\"text-sm font-medium\">{label}</span>}\n      <div className=\"inline-flex overflow-hidden rounded-lg border border-border\">\n        {DOCK_OPTIONS.map(({ value, label: optionLabel, Icon }) => {\n          const active = visible && dock === value\n          return (\n            <Button\n              key={value}\n              variant={active ? \"secondary\" : \"ghost\"}\n              size=\"icon-sm\"\n              // bg-clip-border so the filled (active/hover) state reaches the\n              // cell edge instead of leaving a 1px gap from the button's\n              // transparent border + default bg-clip-padding.\n              className=\"rounded-none bg-clip-border\"\n              aria-label={active ? \"Hide AI Assistant\" : optionLabel}\n              aria-pressed={active}\n              title={active ? \"Hide AI Assistant\" : optionLabel}\n              onClick={() => {\n                if (active) setVisible(false)\n                else {\n                  setDock(value)\n                  setVisible(true)\n                }\n              }}\n            >\n              <Icon className=\"size-4\" />\n            </Button>\n          )\n        })}\n      </div>\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// Layout body\n// ---------------------------------------------------------------------------\n\n// Each panel is padded so the resize handle sits in a comfortable gutter between\n// the cards rather than a hairline seam (SW-2096). The padding lives inside the\n// panel box, so react-resizable-panels' flex sizing is unaffected.\nconst PANEL_PAD = \"flex min-h-0 min-w-0 p-2\"\n// The visible card surface rendered inside each panel.\nconst CARD_CLASS =\n  \"flex h-full min-h-0 min-w-0 flex-1 flex-col overflow-hidden rounded-lg border border-border bg-card\"\n\nconst ASSISTANT_PANEL_ID = \"assistant\"\n\nexport interface AssistantLayoutProps {\n  /** The AI Assistant panel content (e.g. a `<Chat />`). */\n  assistant: React.ReactNode\n  /** The main content; fills the remaining space (and the whole body when the assistant is hidden). */\n  children: React.ReactNode\n  /** Min assistant size as a percentage of the layout. */\n  minSize?: number\n  /** Max assistant size as a percentage of the layout. */\n  maxSize?: number\n  className?: string\n  assistantClassName?: string\n  contentClassName?: string\n}\n\n/**\n * Docks the assistant left / right / bottom of the main content and resizes it\n * with the design-system `Resizable` (react-resizable-panels). Must be rendered\n * inside an `AssistantLayoutProvider`; pair with `AssistantDockControls`.\n *\n * The group is keyed by `dock`, so changing dock remounts the panels. The\n * assistant panel is therefore re-created on redock (its transient state is not\n * preserved across a dock change) — a deliberate trade-off for using the shared\n * resizable primitive rather than a bespoke splitter.\n */\nexport function AssistantLayout({\n  assistant,\n  children,\n  minSize = 20,\n  maxSize = 70,\n  className,\n  assistantClassName,\n  contentClassName,\n}: AssistantLayoutProps) {\n  const { dock, size, setSize, visible } = useAssistantLayout()\n  const { orientation, assistantFirst } = dockPanels(dock)\n\n  // Hidden: no resizable group, content fills the whole body.\n  if (!visible) {\n    return (\n      <div\n        data-slot=\"assistant-layout\"\n        className={cn(\"flex min-h-0 flex-1 overflow-hidden\", className)}\n      >\n        {/* flex-1 so the lone content panel fills the width (the ResizablePanel\n            self-sizes when visible; this plain div needs to be told to grow).\n            Padded to match the inset the visible panels carry. */}\n        <div className={cn(PANEL_PAD, \"flex-1\")}>\n          <div data-slot=\"assistant-layout-content\" className={cn(CARD_CLASS, contentClassName)}>\n            {children}\n          </div>\n        </div>\n      </div>\n    )\n  }\n\n  const assistantPanel = (\n    <ResizablePanel\n      id={ASSISTANT_PANEL_ID}\n      defaultSize={`${size}%`}\n      minSize={`${minSize}%`}\n      maxSize={`${maxSize}%`}\n      className={PANEL_PAD}\n    >\n      <div data-slot=\"assistant-layout-assistant\" className={cn(CARD_CLASS, assistantClassName)}>\n        {assistant}\n      </div>\n    </ResizablePanel>\n  )\n\n  const contentPanel = (\n    <ResizablePanel id=\"content\" className={PANEL_PAD}>\n      <div data-slot=\"assistant-layout-content\" className={cn(CARD_CLASS, contentClassName)}>\n        {children}\n      </div>\n    </ResizablePanel>\n  )\n\n  return (\n    <ResizablePanelGroup\n      key={dock}\n      orientation={orientation}\n      data-slot=\"assistant-layout\"\n      className={cn(\"min-h-0 flex-1 overflow-hidden\", className)}\n      onLayoutChanged={(layout) => {\n        const pct = layout[ASSISTANT_PANEL_ID]\n        if (typeof pct === \"number\") setSize(pct)\n      }}\n    >\n      {assistantFirst ? (\n        <>\n          {assistantPanel}\n          <ResizableHandle withHandle />\n          {contentPanel}\n        </>\n      ) : (\n        <>\n          {contentPanel}\n          <ResizableHandle withHandle />\n          {assistantPanel}\n        </>\n      )}\n    </ResizablePanelGroup>\n  )\n}\n"],"names":["AssistantLayoutContext","React","readDock","key","fallback","v","readSize","AssistantLayoutProvider","children","storageKey","defaultDock","defaultSize","defaultVisible","persist","dock","setDockState","size","setSizeState","visible","setVisible","setDock","next","setSize","value","jsx","useAssistantLayout","ctx","DOCK_OPTIONS","PanelLeft","PanelBottom","PanelRight","AssistantDockControls","label","className","cn","optionLabel","Icon","active","Button","PANEL_PAD","CARD_CLASS","ASSISTANT_PANEL_ID","AssistantLayout","assistant","minSize","maxSize","assistantClassName","contentClassName","orientation","assistantFirst","dockPanels","assistantPanel","ResizablePanel","contentPanel","ResizablePanelGroup","layout","pct","jsxs","Fragment","ResizableHandle"],"mappings":"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"}
+{"version":3,"file":"AssistantLayout.cjs","sources":["../../../../src/components/composed/AssistantLayout/AssistantLayout.tsx"],"sourcesContent":["\"use client\"\n\nimport { PanelBottom, PanelLeft, PanelRight } from \"lucide-react\"\nimport * as React from \"react\"\n\nimport { dockPanels, type AssistantDock } from \"./dockLayout\"\n\nimport { Button } from \"@/components/ui/button\"\nimport {\n  ResizableHandle,\n  ResizablePanel,\n  ResizablePanelGroup,\n} from \"@/components/ui/resizable\"\nimport { cn } from \"@/lib/utils\"\n\n// ---------------------------------------------------------------------------\n// Context + provider\n// ---------------------------------------------------------------------------\n\ninterface AssistantLayoutContextValue {\n  /** Where the assistant docks. Persisted. */\n  dock: AssistantDock\n  setDock: (dock: AssistantDock) => void\n  /** Assistant size as a percentage of the layout along the dock axis. Persisted. */\n  size: number\n  setSize: (size: number) => void\n  /** Whether the assistant is shown. In-memory by default (resets to visible on reload). */\n  visible: boolean\n  setVisible: (visible: boolean) => void\n}\n\nconst AssistantLayoutContext = React.createContext<AssistantLayoutContextValue | null>(null)\n\nexport interface AssistantLayoutProviderProps {\n  children: React.ReactNode\n  /** localStorage key prefix for the persisted dock + size. */\n  storageKey?: string\n  /** Default dock when nothing is persisted. */\n  defaultDock?: AssistantDock\n  /** Default assistant size as a percentage (1–99) of the layout. */\n  defaultSize?: number\n  /** Whether the assistant starts visible. */\n  defaultVisible?: boolean\n  /** Persist dock + size to localStorage. Defaults to `true`. */\n  persist?: boolean\n}\n\nfunction readDock(key: string, fallback: AssistantDock): AssistantDock {\n  if (typeof window === \"undefined\") return fallback\n  const v = window.localStorage.getItem(`${key}.dock`)\n  return v === \"right\" || v === \"bottom\" || v === \"left\" ? v : fallback\n}\n\nfunction readSize(key: string, fallback: number): number {\n  if (typeof window === \"undefined\") return fallback\n  const v = Number(window.localStorage.getItem(`${key}.size`))\n  // Persisted as a percentage; ignore anything outside the open (0, 100) range.\n  if (!Number.isFinite(v) || v <= 0 || v >= 100) return fallback\n  return v\n}\n\nexport function AssistantLayoutProvider({\n  children,\n  storageKey = \"ts-ui.assistant\",\n  defaultDock = \"left\",\n  defaultSize = 32,\n  defaultVisible = true,\n  persist = true,\n}: AssistantLayoutProviderProps) {\n  const [dock, setDockState] = React.useState<AssistantDock>(() =>\n    persist ? readDock(storageKey, defaultDock) : defaultDock\n  )\n  const [size, setSizeState] = React.useState<number>(() =>\n    persist ? readSize(storageKey, defaultSize) : defaultSize\n  )\n  const [visible, setVisible] = React.useState(defaultVisible)\n\n  const setDock = React.useCallback(\n    (next: AssistantDock) => {\n      setDockState(next)\n      if (persist && typeof window !== \"undefined\")\n        window.localStorage.setItem(`${storageKey}.dock`, next)\n    },\n    [storageKey, persist]\n  )\n\n  const setSize = React.useCallback(\n    (next: number) => {\n      setSizeState(next)\n      if (persist && typeof window !== \"undefined\")\n        window.localStorage.setItem(`${storageKey}.size`, String(Math.round(next)))\n    },\n    [storageKey, persist]\n  )\n\n  const value = React.useMemo(\n    () => ({ dock, setDock, size, setSize, visible, setVisible }),\n    [dock, setDock, size, setSize, visible]\n  )\n\n  return <AssistantLayoutContext.Provider value={value}>{children}</AssistantLayoutContext.Provider>\n}\n\nexport function useAssistantLayout(): AssistantLayoutContextValue {\n  const ctx = React.useContext(AssistantLayoutContext)\n  if (!ctx) throw new Error(\"useAssistantLayout must be used within an AssistantLayoutProvider\")\n  return ctx\n}\n\n// ---------------------------------------------------------------------------\n// Dock controls (segmented icon control for a top bar)\n// ---------------------------------------------------------------------------\n\nconst DOCK_OPTIONS: { value: AssistantDock; label: string; Icon: typeof PanelLeft }[] = [\n  { value: \"left\", label: \"Dock assistant left\", Icon: PanelLeft },\n  { value: \"bottom\", label: \"Dock assistant bottom\", Icon: PanelBottom },\n  { value: \"right\", label: \"Dock assistant right\", Icon: PanelRight },\n]\n\nexport interface AssistantDockControlsProps {\n  /** Label shown before the icons. Pass `null` to hide it. */\n  label?: React.ReactNode\n  className?: string\n}\n\n/**\n * Segmented control of dock icons. Clicking an inactive icon docks + shows the\n * assistant there; clicking the active icon again hides it.\n */\nexport function AssistantDockControls({ label = \"AI Assistant\", className }: AssistantDockControlsProps) {\n  const { dock, setDock, visible, setVisible } = useAssistantLayout()\n\n  return (\n    <div className={cn(\"flex items-center gap-2\", className)}>\n      {label != null && <span className=\"text-sm font-medium\">{label}</span>}\n      <div className=\"inline-flex overflow-hidden rounded-lg border border-border\">\n        {DOCK_OPTIONS.map(({ value, label: optionLabel, Icon }) => {\n          const active = visible && dock === value\n          return (\n            <Button\n              key={value}\n              variant={active ? \"secondary\" : \"ghost\"}\n              size=\"icon-sm\"\n              // bg-clip-border so the filled (active/hover) state reaches the\n              // cell edge instead of leaving a 1px gap from the button's\n              // transparent border + default bg-clip-padding.\n              className=\"rounded-none bg-clip-border\"\n              aria-label={active ? \"Hide AI Assistant\" : optionLabel}\n              aria-pressed={active}\n              title={active ? \"Hide AI Assistant\" : optionLabel}\n              onClick={() => {\n                if (active) setVisible(false)\n                else {\n                  setDock(value)\n                  setVisible(true)\n                }\n              }}\n            >\n              <Icon className=\"size-4\" />\n            </Button>\n          )\n        })}\n      </div>\n    </div>\n  )\n}\n\n// ---------------------------------------------------------------------------\n// Layout body\n// ---------------------------------------------------------------------------\n\n// Each panel is padded so the resize handle sits in a comfortable gutter between\n// the cards rather than a hairline seam (SW-2096). The padding lives inside the\n// panel box, so react-resizable-panels' flex sizing is unaffected.\nconst PANEL_PAD = \"flex min-h-0 min-w-0 p-2\"\n// The visible card surface rendered inside each panel.\nconst CARD_CLASS =\n  \"flex h-full min-h-0 min-w-0 flex-1 flex-col overflow-hidden rounded-lg border border-border bg-card\"\n\nconst ASSISTANT_PANEL_ID = \"assistant\"\n\nexport interface AssistantLayoutProps {\n  /** The AI Assistant panel content (e.g. a `<Chat />`). */\n  assistant: React.ReactNode\n  /** The main content; fills the remaining space (and the whole body when the assistant is hidden). */\n  children: React.ReactNode\n  /** Min assistant size as a percentage of the layout. */\n  minSize?: number\n  /** Max assistant size as a percentage of the layout. */\n  maxSize?: number\n  className?: string\n  assistantClassName?: string\n  contentClassName?: string\n}\n\n/**\n * Docks the assistant left / right / bottom of the main content and resizes it\n * with the design-system `Resizable` (react-resizable-panels). Must be rendered\n * inside an `AssistantLayoutProvider`; pair with `AssistantDockControls`.\n *\n * The group is keyed by `dock`, so changing dock remounts the panels. The\n * assistant panel is therefore re-created on redock (its transient state is not\n * preserved across a dock change) — a deliberate trade-off for using the shared\n * resizable primitive rather than a bespoke splitter.\n */\nexport function AssistantLayout({\n  assistant,\n  children,\n  minSize = 20,\n  maxSize = 70,\n  className,\n  assistantClassName,\n  contentClassName,\n}: AssistantLayoutProps) {\n  const { dock, size, setSize, visible } = useAssistantLayout()\n  const { orientation, assistantFirst } = dockPanels(dock)\n\n  // Hidden: no resizable group, content fills the whole body.\n  if (!visible) {\n    return (\n      <div\n        data-slot=\"assistant-layout\"\n        className={cn(\"flex min-h-0 flex-1 overflow-hidden\", className)}\n      >\n        {/* flex-1 so the lone content panel fills the width (the ResizablePanel\n            self-sizes when visible; this plain div needs to be told to grow).\n            Padded to match the inset the visible panels carry. */}\n        <div className={cn(PANEL_PAD, \"flex-1\")}>\n          <div data-slot=\"assistant-layout-content\" className={cn(CARD_CLASS, contentClassName)}>\n            {children}\n          </div>\n        </div>\n      </div>\n    )\n  }\n\n  const assistantPanel = (\n    <ResizablePanel\n      id={ASSISTANT_PANEL_ID}\n      defaultSize={`${size}%`}\n      minSize={`${minSize}%`}\n      maxSize={`${maxSize}%`}\n      className={PANEL_PAD}\n    >\n      <div data-slot=\"assistant-layout-assistant\" className={cn(CARD_CLASS, assistantClassName)}>\n        {assistant}\n      </div>\n    </ResizablePanel>\n  )\n\n  const contentPanel = (\n    <ResizablePanel id=\"content\" className={PANEL_PAD}>\n      <div data-slot=\"assistant-layout-content\" className={cn(CARD_CLASS, contentClassName)}>\n        {children}\n      </div>\n    </ResizablePanel>\n  )\n\n  return (\n    <ResizablePanelGroup\n      key={dock}\n      orientation={orientation}\n      data-slot=\"assistant-layout\"\n      className={cn(\"min-h-0 flex-1 overflow-hidden\", className)}\n      onLayoutChanged={(layout) => {\n        const pct = layout[ASSISTANT_PANEL_ID]\n        if (typeof pct === \"number\") setSize(pct)\n      }}\n    >\n      {assistantFirst ? (\n        <>\n          {assistantPanel}\n          <ResizableHandle withHandle />\n          {contentPanel}\n        </>\n      ) : (\n        <>\n          {contentPanel}\n          <ResizableHandle withHandle />\n          {assistantPanel}\n        </>\n      )}\n    </ResizablePanelGroup>\n  )\n}\n"],"names":["AssistantLayoutContext","React","readDock","key","fallback","v","readSize","AssistantLayoutProvider","children","storageKey","defaultDock","defaultSize","defaultVisible","persist","dock","setDockState","size","setSizeState","visible","setVisible","setDock","next","setSize","value","jsx","useAssistantLayout","ctx","DOCK_OPTIONS","PanelLeft","PanelBottom","PanelRight","AssistantDockControls","label","className","cn","optionLabel","Icon","active","Button","PANEL_PAD","CARD_CLASS","ASSISTANT_PANEL_ID","AssistantLayout","assistant","minSize","maxSize","assistantClassName","contentClassName","orientation","assistantFirst","dockPanels","assistantPanel","ResizablePanel","contentPanel","ResizablePanelGroup","layout","pct","jsxs","Fragment","ResizableHandle"],"mappings":"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"}

package/dist/components/composed/AssistantLayout/AssistantLayout.d.ts

@@ -0,0 +1,63 @@
+import { AssistantDock } from './dockLayout';
+import * as React from "react";
+interface AssistantLayoutContextValue {
+    /** Where the assistant docks. Persisted. */
+    dock: AssistantDock;
+    setDock: (dock: AssistantDock) => void;
+    /** Assistant size as a percentage of the layout along the dock axis. Persisted. */
+    size: number;
+    setSize: (size: number) => void;
+    /** Whether the assistant is shown. In-memory by default (resets to visible on reload). */
+    visible: boolean;
+    setVisible: (visible: boolean) => void;
+}
+export interface AssistantLayoutProviderProps {
+    children: React.ReactNode;
+    /** localStorage key prefix for the persisted dock + size. */
+    storageKey?: string;
+    /** Default dock when nothing is persisted. */
+    defaultDock?: AssistantDock;
+    /** Default assistant size as a percentage (1–99) of the layout. */
+    defaultSize?: number;
+    /** Whether the assistant starts visible. */
+    defaultVisible?: boolean;
+    /** Persist dock + size to localStorage. Defaults to `true`. */
+    persist?: boolean;
+}
+export declare function AssistantLayoutProvider({ children, storageKey, defaultDock, defaultSize, defaultVisible, persist, }: AssistantLayoutProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function useAssistantLayout(): AssistantLayoutContextValue;
+export interface AssistantDockControlsProps {
+    /** Label shown before the icons. Pass `null` to hide it. */
+    label?: React.ReactNode;
+    className?: string;
+}
+/**
+ * Segmented control of dock icons. Clicking an inactive icon docks + shows the
+ * assistant there; clicking the active icon again hides it.
+ */
+export declare function AssistantDockControls({ label, className }: AssistantDockControlsProps): import("react/jsx-runtime").JSX.Element;
+export interface AssistantLayoutProps {
+    /** The AI Assistant panel content (e.g. a `<Chat />`). */
+    assistant: React.ReactNode;
+    /** The main content; fills the remaining space (and the whole body when the assistant is hidden). */
+    children: React.ReactNode;
+    /** Min assistant size as a percentage of the layout. */
+    minSize?: number;
+    /** Max assistant size as a percentage of the layout. */
+    maxSize?: number;
+    className?: string;
+    assistantClassName?: string;
+    contentClassName?: string;
+}
+/**
+ * Docks the assistant left / right / bottom of the main content and resizes it
+ * with the design-system `Resizable` (react-resizable-panels). Must be rendered
+ * inside an `AssistantLayoutProvider`; pair with `AssistantDockControls`.
+ *
+ * The group is keyed by `dock`, so changing dock remounts the panels. The
+ * assistant panel is therefore re-created on redock (its transient state is not
+ * preserved across a dock change) — a deliberate trade-off for using the shared
+ * resizable primitive rather than a bespoke splitter.
+ */
+export declare function AssistantLayout({ assistant, children, minSize, maxSize, className, assistantClassName, contentClassName, }: AssistantLayoutProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/composed/AssistantLayout/AssistantLayout.js

@@ -2,8 +2,8 @@ import { jsxs as N, jsx as n, Fragment as z } from "react/jsx-runtime";
 import { PanelLeft as D, PanelBottom as C, PanelRight as L } from "lucide-react";
 import * as l from "react";
 import { dockPanels as $ } from "./dockLayout.js";
-import { Button as R } from "../../ui/button.js";
-import { ResizablePanel as P, ResizablePanelGroup as H, ResizableHandle as g } from "../../ui/resizable.js";
+import { Button as R } from "../../../ui/button.js";
+import { ResizablePanel as P, ResizablePanelGroup as H, ResizableHandle as g } from "../../../ui/resizable.js";
 import { cn as d } from "../../../lib/utils.js";
 const y = l.createContext(null);
 function _(s, t) {

package/dist/components/composed/AssistantLayout/dockLayout.d.ts

@@ -0,0 +1,15 @@
+/** Where the AI Assistant panel docks relative to the main content. */
+export type AssistantDock = "left" | "right" | "bottom";
+export interface DockPanels {
+    /** Resizable group orientation for this dock. */
+    orientation: "horizontal" | "vertical";
+    /** Whether the assistant panel renders before the content panel. */
+    assistantFirst: boolean;
+}
+/**
+ * Maps a dock position to the resizable group's orientation and panel order.
+ *  - left   → horizontal, assistant first  [assistant | content]
+ *  - right  → horizontal, content first    [content | assistant]
+ *  - bottom → vertical,   content first    [content / assistant]
+ */
+export declare function dockPanels(dock: AssistantDock): DockPanels;

package/dist/components/composed/AssistantLayout/index.d.ts

@@ -0,0 +1,3 @@
+export { AssistantLayout, AssistantLayoutProvider, AssistantDockControls, useAssistantLayout, } from './AssistantLayout';
+export type { AssistantLayoutProps, AssistantLayoutProviderProps, AssistantDockControlsProps, } from './AssistantLayout';
+export { dockPanels, type AssistantDock, type DockPanels } from './dockLayout';

package/dist/components/composed/Chat/Chat.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),v=require("lucide-react"),a=require("react"),j=require("../../ai/conversation.cjs"),t=require("../../ai/message.cjs"),n=require("../../ai/prompt-input.cjs"),M=require("../../ai/reasoning.cjs"),m=require("../../ai/sources.cjs"),L=require("../../ai/stream-status.cjs"),N=require("../../ai/suggestion.cjs"),O=require("../../../lib/utils.cjs"),z=[{id:"claude-sonnet-4-6",name:"Claude Sonnet"},{id:"claude-opus-4-7",name:"Claude Opus"}],V=["Explain quantum entanglement simply","Write a Python script to rename files","Summarise the latest AI research trends","What is the difference between TCP and UDP?"];let k=0;const w=()=>(k+=1,`chat-msg-${k}`),W=3e3,H=({initialMessages:S=[],models:c=z,defaultModel:d,suggestions:i=V,onSend:h,className:C})=>{const u=a.useId(),[x,b]=a.useState(S),[g,y]=a.useState(""),[I,B]=a.useState(d??c[0]?.id??""),[E,_]=a.useState(!1),[p,f]=a.useState("ready"),[P,T]=a.useState(),D=a.useCallback(async s=>{const r=g.trim();if(!r||p==="streaming")return;const l={id:w(),role:"user",content:r};b(o=>[...o,l]),y(""),f("streaming"),T(new Date);try{const o=await h?.(r,I),F={id:w(),role:"assistant",content:o??"I received your message."};b(G=>[...G,F])}finally{f("ready"),setTimeout(()=>T(void 0),W)}},[g,p,I,h]),U=a.useCallback(s=>{y(s)},[]),R=a.useCallback(s=>{navigator.clipboard.writeText(s).catch(()=>{})},[]),q=a.useCallback(s=>{b(r=>{const l=r.findIndex(o=>o.id===s);return l===-1?r:r.slice(0,l)})},[]);return e.jsxs("div",{className:O.cn("mx-auto flex h-full w-full max-w-[980px] flex-col",C),children:[e.jsxs(j.Conversation,{className:"flex-1",children:[e.jsxs(j.ConversationContent,{children:[x.length===0?e.jsx(j.ConversationEmptyState,{description:"Send a message or pick a suggestion below to start.",title:"Start a conversation"}):null,x.map((s,r)=>e.jsxs("div",{className:"space-y-1",children:[s.role==="assistant"&&s.branches&&s.branches.length>1?e.jsxs(t.MessageBranch,{children:[e.jsx(t.MessageBranchContent,{children:s.branches.map((l,o)=>e.jsx(A,{content:l,id:s.id,onCopy:R,onRetry:q,reasoning:o===0?s.reasoning:void 0,sources:o===0?s.sources:void 0},o))}),e.jsx(t.MessageToolbar,{children:e.jsxs(t.MessageBranchSelector,{children:[e.jsx(t.MessageBranchPrevious,{}),e.jsx(t.MessageBranchPage,{}),e.jsx(t.MessageBranchNext,{})]})})]}):s.role==="assistant"?e.jsx(e.Fragment,{children:e.jsx(A,{content:s.content,id:s.id,onCopy:R,onRetry:q,reasoning:s.reasoning,sources:s.sources})}):e.jsx(t.Message,{from:"user",children:e.jsx(t.MessageContent,{children:e.jsx(t.MessageResponse,{children:s.content})})}),r===x.length-1&&P&&e.jsx("div",{className:"mt-3",children:e.jsx(L.StreamStatus,{iconVariant:"loader-circle",isStreaming:p==="streaming",startTime:P})})]},s.id))]}),e.jsx(j.ConversationScrollButton,{})]}),x.length===0&&i.length>0&&e.jsx("div",{className:"px-4 pb-2",children:e.jsx(N.Suggestions,{children:i.map(s=>e.jsx(N.Suggestion,{onClick:U,suggestion:s},s))})}),e.jsx("div",{className:"px-4 pt-3 pb-4",children:e.jsxs(n.PromptInput,{onSubmit:D,children:[e.jsx(n.PromptInputBody,{children:e.jsx(n.PromptInputTextarea,{"aria-labelledby":u,onChange:s=>y(s.target.value),placeholder:"Ask anything...",value:g})}),e.jsxs(n.PromptInputFooter,{children:[e.jsxs(n.PromptInputTools,{children:[c.length>1&&e.jsxs(n.PromptInputSelect,{onValueChange:B,value:I,children:[e.jsx(n.PromptInputSelectTrigger,{"aria-label":"Select model",children:e.jsx(n.PromptInputSelectValue,{})}),e.jsx(n.PromptInputSelectContent,{children:c.map(s=>e.jsx(n.PromptInputSelectItem,{value:s.id,children:s.name},s.id))})]}),e.jsxs(n.PromptInputButton,{onClick:()=>_(s=>!s),tooltip:{content:"Search the web"},variant:E?"default":"ghost",children:[e.jsx(v.GlobeIcon,{size:16}),e.jsx("span",{children:"Search"})]})]}),e.jsx(n.PromptInputSubmit,{disabled:!g.trim(),status:p})]})]})})]})},A=({id:S,content:c,reasoning:d,sources:i,onCopy:h,onRetry:C})=>e.jsxs("div",{className:"space-y-2",children:[d&&e.jsxs(M.Reasoning,{children:[e.jsx(M.ReasoningTrigger,{}),e.jsx(M.ReasoningContent,{children:d})]}),e.jsx(t.Message,{from:"assistant",children:e.jsx(t.MessageContent,{children:e.jsx(t.MessageResponse,{children:c})})}),i&&i.length>0&&e.jsxs(m.Sources,{children:[e.jsx(m.SourcesTrigger,{count:i.length}),e.jsx(m.SourcesContent,{children:i.map(u=>e.jsx(m.Source,{href:u.href,title:u.title},u.href))})]}),e.jsxs(t.MessageActions,{children:[e.jsx(t.MessageAction,{label:"Copy",onClick:()=>h(c),children:e.jsx(v.CopyIcon,{className:"size-3"})}),e.jsx(t.MessageAction,{label:"Retry",onClick:()=>C(S),children:e.jsx(v.RefreshCcwIcon,{className:"size-3"})})]})]});exports.Chat=H;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),v=require("lucide-react"),a=require("react"),j=require("../../../ai/conversation.cjs"),t=require("../../../ai/message.cjs"),n=require("../../../ai/prompt-input.cjs"),M=require("../../../ai/reasoning.cjs"),m=require("../../../ai/sources.cjs"),L=require("../../../ai/stream-status.cjs"),q=require("../../../ai/suggestion.cjs"),O=require("../../../lib/utils.cjs"),z=[{id:"claude-sonnet-4-6",name:"Claude Sonnet"},{id:"claude-opus-4-7",name:"Claude Opus"}],V=["Explain quantum entanglement simply","Write a Python script to rename files","Summarise the latest AI research trends","What is the difference between TCP and UDP?"];let N=0;const k=()=>(N+=1,`chat-msg-${N}`),W=3e3,$=({initialMessages:S=[],models:c=z,defaultModel:u,suggestions:o=V,onSend:h,className:C})=>{const d=a.useId(),[x,b]=a.useState(S),[g,y]=a.useState(""),[I,A]=a.useState(u??c[0]?.id??""),[B,E]=a.useState(!1),[p,f]=a.useState("ready"),[P,T]=a.useState(),D=a.useCallback(async s=>{const r=g.trim();if(!r||p==="streaming")return;const l={id:k(),role:"user",content:r};b(i=>[...i,l]),y(""),f("streaming"),T(new Date);try{const i=await h?.(r,I),F={id:k(),role:"assistant",content:i??"I received your message."};b(G=>[...G,F])}finally{f("ready"),setTimeout(()=>T(void 0),W)}},[g,p,I,h]),U=a.useCallback(s=>{y(s)},[]),R=a.useCallback(s=>{navigator.clipboard.writeText(s).catch(()=>{})},[]),_=a.useCallback(s=>{b(r=>{const l=r.findIndex(i=>i.id===s);return l===-1?r:r.slice(0,l)})},[]);return e.jsxs("div",{className:O.cn("mx-auto flex h-full w-full max-w-[980px] flex-col",C),children:[e.jsxs(j.Conversation,{className:"flex-1",children:[e.jsxs(j.ConversationContent,{children:[x.length===0?e.jsx(j.ConversationEmptyState,{description:"Send a message or pick a suggestion below to start.",title:"Start a conversation"}):null,x.map((s,r)=>e.jsxs("div",{className:"space-y-1",children:[s.role==="assistant"&&s.branches&&s.branches.length>1?e.jsxs(t.MessageBranch,{children:[e.jsx(t.MessageBranchContent,{children:s.branches.map((l,i)=>e.jsx(w,{content:l,id:s.id,onCopy:R,onRetry:_,reasoning:i===0?s.reasoning:void 0,sources:i===0?s.sources:void 0},i))}),e.jsx(t.MessageToolbar,{children:e.jsxs(t.MessageBranchSelector,{children:[e.jsx(t.MessageBranchPrevious,{}),e.jsx(t.MessageBranchPage,{}),e.jsx(t.MessageBranchNext,{})]})})]}):s.role==="assistant"?e.jsx(e.Fragment,{children:e.jsx(w,{content:s.content,id:s.id,onCopy:R,onRetry:_,reasoning:s.reasoning,sources:s.sources})}):e.jsx(t.Message,{from:"user",children:e.jsx(t.MessageContent,{children:e.jsx(t.MessageResponse,{children:s.content})})}),r===x.length-1&&P&&e.jsx("div",{className:"mt-3",children:e.jsx(L.StreamStatus,{iconVariant:"loader-circle",isStreaming:p==="streaming",startTime:P})})]},s.id))]}),e.jsx(j.ConversationScrollButton,{})]}),x.length===0&&o.length>0&&e.jsx("div",{className:"px-4 pb-2",children:e.jsx(q.Suggestions,{children:o.map(s=>e.jsx(q.Suggestion,{onClick:U,suggestion:s},s))})}),e.jsx("div",{className:"px-4 pt-3 pb-4",children:e.jsxs(n.PromptInput,{onSubmit:D,children:[e.jsx(n.PromptInputBody,{children:e.jsx(n.PromptInputTextarea,{"aria-labelledby":d,onChange:s=>y(s.target.value),placeholder:"Ask anything...",value:g})}),e.jsxs(n.PromptInputFooter,{children:[e.jsxs(n.PromptInputTools,{children:[c.length>1&&e.jsxs(n.PromptInputSelect,{onValueChange:A,value:I,children:[e.jsx(n.PromptInputSelectTrigger,{"aria-label":"Select model",children:e.jsx(n.PromptInputSelectValue,{})}),e.jsx(n.PromptInputSelectContent,{children:c.map(s=>e.jsx(n.PromptInputSelectItem,{value:s.id,children:s.name},s.id))})]}),e.jsxs(n.PromptInputButton,{onClick:()=>E(s=>!s),tooltip:{content:"Search the web"},variant:B?"default":"ghost",children:[e.jsx(v.GlobeIcon,{size:16}),e.jsx("span",{children:"Search"})]})]}),e.jsx(n.PromptInputSubmit,{disabled:!g.trim(),status:p})]})]})})]})},w=({id:S,content:c,reasoning:u,sources:o,onCopy:h,onRetry:C})=>e.jsxs("div",{className:"space-y-2",children:[u&&e.jsxs(M.Reasoning,{children:[e.jsx(M.ReasoningTrigger,{}),e.jsx(M.ReasoningContent,{children:u})]}),e.jsx(t.Message,{from:"assistant",children:e.jsx(t.MessageContent,{children:e.jsx(t.MessageResponse,{children:c})})}),o&&o.length>0&&e.jsxs(m.Sources,{children:[e.jsx(m.SourcesTrigger,{count:o.length}),e.jsx(m.SourcesContent,{children:o.map(d=>e.jsx(m.Source,{href:d.href,title:d.title},d.href))})]}),e.jsxs(t.MessageActions,{children:[e.jsx(t.MessageAction,{label:"Copy",onClick:()=>h(c),children:e.jsx(v.CopyIcon,{className:"size-3"})}),e.jsx(t.MessageAction,{label:"Retry",onClick:()=>C(S),children:e.jsx(v.RefreshCcwIcon,{className:"size-3"})})]})]});exports.Chat=$;
 //# sourceMappingURL=Chat.cjs.map