@heroui/agent 0.2.0-beta.1 → 0.2.0-beta.2

package/dist/{component-renderer-IBJDNXSO.js → component-renderer-EOOT6ONY.js}

@@ -2,11 +2,13 @@ import {
   CHART_COLOR_TOKENS,
   ComponentExportActions,
   TrendChange,
+  chartToDataTable,
   componentActionFromSpec,
   createComponentSelection,
   formatCell,
-  formatNumber
-} from "./chunk-DW4AQRM5.js";
+  formatNumber,
+  resolveGaugeBounds
+} from "./chunk-AEUPMIPT.js";
 import {
   createMapLayout,
   getInitialMapLocationId
@@ -170,6 +172,179 @@ var heatmap = base.extend({
   xKey: key,
   yKey: key
 });
+var line = cartesian.extend({
+  baseline: z.number().finite().optional(),
+  kind: z.literal("line-chart"),
+  mode: z.enum(["live", "profit-loss", "standard"]).optional(),
+  negativeColor: chartColorSchema.optional(),
+  positiveColor: chartColorSchema.optional(),
+  windowSize: z.number().int().min(2).max(200).optional()
+}).superRefine((component, ctx) => {
+  if ((component.mode === "live" || component.mode === "profit-loss") && component.series.length !== 1) {
+    ctx.addIssue({
+      code: "custom",
+      message: `${component.mode} line charts require exactly one series`,
+      path: ["series"]
+    });
+  }
+});
+var candlestick = base.extend({
+  closeKey: key,
+  data: z.array(datum).min(1).max(200),
+  downColor: chartColorSchema.optional(),
+  format: numberFormatSchema.optional(),
+  highKey: key,
+  kind: z.literal("candlestick-chart"),
+  lowKey: key,
+  openKey: key,
+  upColor: chartColorSchema.optional(),
+  xKey: key
+}).superRefine((component, ctx) => {
+  for (const [index, row] of component.data.entries()) {
+    const open = row[component.openKey];
+    const high = row[component.highKey];
+    const low = row[component.lowKey];
+    const close = row[component.closeKey];
+    const values = [open, high, low, close];
+    if (values.some((value) => typeof value !== "number" || !Number.isFinite(value))) {
+      ctx.addIssue({
+        code: "custom",
+        message: "Every candlestick row needs finite open, high, low, and close values",
+        path: ["data", index]
+      });
+      continue;
+    }
+    const numericOpen = open;
+    const numericHigh = high;
+    const numericLow = low;
+    const numericClose = close;
+    if (numericLow > Math.min(numericOpen, numericClose) || numericHigh < Math.max(numericOpen, numericClose) || numericLow > numericHigh) {
+      ctx.addIssue({
+        code: "custom",
+        message: "Candlestick low/high values must contain the open and close values",
+        path: ["data", index]
+      });
+    }
+  }
+});
+var funnel = proportional.extend({
+  data: z.array(datum).min(2).max(20),
+  kind: z.literal("funnel-chart"),
+  orientation: z.enum(["horizontal", "vertical"]).optional(),
+  showPercentages: z.boolean().optional()
+}).superRefine((component, ctx) => {
+  const values = component.data.map((row, index) => {
+    const value = row[component.valueKey];
+    if (typeof value !== "number" || !Number.isFinite(value) || value < 0) {
+      ctx.addIssue({
+        code: "custom",
+        message: "Every funnel stage needs a finite, non-negative value",
+        path: ["data", index, component.valueKey]
+      });
+      return 0;
+    }
+    return value;
+  });
+  if (!values.some((value) => value > 0)) {
+    ctx.addIssue({
+      code: "custom",
+      message: "A funnel needs at least one stage above zero",
+      path: ["data"]
+    });
+  }
+  if ((values[0] ?? 0) <= 0) {
+    ctx.addIssue({
+      code: "custom",
+      message: "A funnel's first stage must be above zero",
+      path: ["data", 0, component.valueKey]
+    });
+  }
+  for (let index = 1; index < values.length; index += 1) {
+    if ((values[index] ?? 0) > (values[index - 1] ?? 0)) {
+      ctx.addIssue({
+        code: "custom",
+        message: "Funnel stages must not increase",
+        path: ["data", index, component.valueKey]
+      });
+    }
+  }
+});
+var gauge = base.extend({
+  color: chartColorSchema.optional(),
+  format: numberFormatSchema.optional(),
+  kind: z.literal("gauge-chart"),
+  label: shortText,
+  max: z.number().finite().optional(),
+  min: z.number().finite().optional(),
+  notches: z.number().int().min(6).max(60).optional(),
+  orientation: z.enum(["arc", "linear"]).optional(),
+  value: z.number().finite()
+}).superRefine((component, ctx) => {
+  const { maximum, minimum } = resolveGaugeBounds(component);
+  if (maximum <= minimum) {
+    ctx.addIssue({ code: "custom", message: "Gauge max must be greater than min", path: ["max"] });
+  } else if (component.value < minimum || component.value > maximum) {
+    ctx.addIssue({
+      code: "custom",
+      message: "Gauge value must be within its min/max range",
+      path: ["value"]
+    });
+  }
+});
+var sunburstNode = z.lazy(
+  () => z.object({
+    children: z.array(sunburstNode).min(1).max(12).optional(),
+    color: chartColorSchema.optional(),
+    id,
+    label: shortText,
+    value: z.number().finite().positive().optional()
+  }).superRefine((node, ctx) => {
+    if (node.children?.length && node.value !== void 0) {
+      ctx.addIssue({
+        code: "custom",
+        message: "Sunburst branch values are derived from their children",
+        path: ["value"]
+      });
+    }
+    if (!node.children?.length && node.value === void 0) {
+      ctx.addIssue({
+        code: "custom",
+        message: "Every sunburst leaf needs a positive value",
+        path: ["value"]
+      });
+    }
+  })
+);
+var sunburst = base.extend({
+  data: sunburstNode,
+  format: numberFormatSchema.optional(),
+  kind: z.literal("sunburst-chart")
+}).superRefine((component, ctx) => {
+  const ids = /* @__PURE__ */ new Set();
+  let count = 0;
+  let deepest = 0;
+  const visit = (node, depth) => {
+    count += 1;
+    deepest = Math.max(deepest, depth);
+    if (ids.has(node.id)) {
+      ctx.addIssue({ code: "custom", message: `Duplicate sunburst node id "${node.id}"` });
+    }
+    ids.add(node.id);
+    node.children?.forEach((child) => visit(child, depth + 1));
+  };
+  if (!component.data.children?.length) {
+    ctx.addIssue({
+      code: "custom",
+      message: "A sunburst root needs at least one child",
+      path: ["data", "children"]
+    });
+  }
+  visit(component.data, 0);
+  if (count > 60)
+    ctx.addIssue({ code: "custom", message: "Sunburst charts allow at most 60 nodes" });
+  if (deepest > 4)
+    ctx.addIssue({ code: "custom", message: "Sunburst charts allow at most four nested levels" });
+});
 var option = z.object({ label: shortText, value: key });
 var formDateRange = z.object({ end: date, start: date }).refine((range) => range.start <= range.end, "The start date must not be after the end date");
 var fieldBase = {
@@ -450,6 +625,7 @@ var validators = {
     kind: z.literal("callout"),
     tone: z.enum(["accent", "danger", "neutral", "success", "warning"]).optional()
   }),
+  candlestick,
   channelMessage: base.extend({
     attachments: z.array(z.object({ id, image: agentUIImage.optional(), name: shortText })).max(8).optional(),
     author: z.object({ image: agentUIImage.optional(), name: shortText }),
@@ -542,6 +718,8 @@ var validators = {
     fields: z.array(formField).min(1).max(20),
     kind: z.literal("form")
   }),
+  funnel,
+  gauge,
   heatmap,
   image: base.extend({
     images: z.array(
@@ -571,7 +749,7 @@ var validators = {
       })
     ).min(1).max(4)
   }),
-  line: cartesian.extend({ kind: z.literal("line-chart") }),
+  line,
   list: base.extend({
     items: z.array(
       z.object({
@@ -822,6 +1000,7 @@ var validators = {
     ).min(1).max(12),
     variant: z.enum(["steps", "timeline"]).optional()
   }),
+  sunburst,
   switches: base.extend({
     items: z.array(
       z.object({
@@ -916,6 +1095,10 @@ var radialChartComponentSchema = validators.radial;
 var sankeyChartComponentSchema = validators.sankey;
 var scatterChartComponentSchema = validators.scatter;
 var heatmapComponentSchema = validators.heatmap;
+var candlestickChartComponentSchema = validators.candlestick;
+var funnelChartComponentSchema = validators.funnel;
+var gaugeChartComponentSchema = validators.gauge;
+var sunburstChartComponentSchema = validators.sunburst;
 var dataTableComponentSchema = validators.table;
 var comparisonListComponentSchema = validators.comparison;
 var meterListComponentSchema = validators.meterList;
@@ -965,6 +1148,10 @@ var analyticalLeafComponentSchema = z.discriminatedUnion("kind", [
   validators.sankey,
   validators.scatter,
   validators.heatmap,
+  validators.candlestick,
+  validators.funnel,
+  validators.gauge,
+  validators.sunburst,
   validators.table,
   validators.comparison,
   validators.meterList
@@ -1008,6 +1195,10 @@ var standardAgentUILeafComponentSchema = z.discriminatedUnion("kind", [
   validators.sankey,
   validators.scatter,
   validators.heatmap,
+  validators.candlestick,
+  validators.funnel,
+  validators.gauge,
+  validators.sunburst,
   validators.table,
   validators.comparison,
   validators.meterList,
@@ -1380,6 +1571,7 @@ var AGENT_UI_KIND_SCHEMAS = {
   "bar-chart": barChartComponentSchema,
   button: buttonComponentSchema,
   callout: calloutComponentSchema,
+  "candlestick-chart": candlestickChartComponentSchema,
   card: cardShape.extend({ children: opaqueChildren(COMPOSED_UI_MAX_NODES) }),
   "channel-message": channelMessageComponentSchema,
   "code-block": codeBlockComponentSchema,
@@ -1397,6 +1589,8 @@ var AGENT_UI_KIND_SCHEMAS = {
   "flight-tracker": flightTrackerComponentSchema,
   followup: followupComponentSchema,
   form: formComponentSchema,
+  "funnel-chart": funnelChartComponentSchema,
+  "gauge-chart": gaugeChartComponentSchema,
   grid: gridShape.extend({ children: opaqueChildren(COMPOSED_UI_MAX_NODES) }),
   heading: headingComponentSchema,
   heatmap: heatmapComponentSchema,
@@ -1445,6 +1639,7 @@ var AGENT_UI_KIND_SCHEMAS = {
   "scatter-chart": scatterChartComponentSchema,
   spacer: spacerComponentSchema,
   steps: stepsComponentSchema,
+  "sunburst-chart": sunburstChartComponentSchema,
   "switch-group": switchGroupComponentSchema,
   tabs: base.extend({
     defaultValue: id.optional(),
@@ -1531,165 +1726,27 @@ function FollowupView({ className, component, onAction, onSelect }) {
 }
 
 // ../agent-ui/src/components/data-visualization/charts/chart-views.tsx
-import { Suspense, lazy } from "react";
-import { jsx as jsx2 } from "react/jsx-runtime";
-var LazyLineChart = lazy(
-  () => import("./chart-content-VZ66GD22.js").then((module) => ({ default: module.LineChartComponentContent }))
-);
-var LazyBarChart = lazy(
-  () => import("./chart-content-VZ66GD22.js").then((module) => ({ default: module.BarChartComponentContent }))
-);
-var LazyAreaChart = lazy(
-  () => import("./chart-content-VZ66GD22.js").then((module) => ({ default: module.AreaChartComponentContent }))
-);
-var LazyComposedChart = lazy(
-  () => import("./chart-content-VZ66GD22.js").then((module) => ({ default: module.ComposedChartComponentContent }))
-);
-var LazyPieChart = lazy(
-  () => import("./chart-content-VZ66GD22.js").then((module) => ({ default: module.PieChartComponentContent }))
-);
-var LazyDonutChart = lazy(
-  () => import("./chart-content-VZ66GD22.js").then((module) => ({ default: module.DonutChartComponentContent }))
-);
-var LazyRadarChart = lazy(
-  () => import("./chart-content-VZ66GD22.js").then((module) => ({ default: module.RadarChartComponentContent }))
-);
-var LazyRadialChart = lazy(
-  () => import("./chart-content-VZ66GD22.js").then((module) => ({ default: module.RadialChartComponentContent }))
-);
-var LazySankeyChart = lazy(
-  () => import("./chart-content-VZ66GD22.js").then((module) => ({ default: module.SankeyChartComponentContent }))
-);
-var LazyScatterChart = lazy(
-  () => import("./chart-content-VZ66GD22.js").then((module) => ({ default: module.ScatterChartComponentContent }))
-);
-var LazyHeatmap = lazy(
-  () => import("./chart-content-VZ66GD22.js").then((module) => ({ default: module.HeatmapComponentContent }))
-);
-function LineChartView(props) {
-  return /* @__PURE__ */ jsx2(
-    Suspense,
-    {
-      fallback: /* @__PURE__ */ jsx2(
-        ComponentSkeleton,
-        {
-          className: props.className,
-          kind: props.component.kind,
-          title: props.component.title
-        }
-      ),
-      children: /* @__PURE__ */ jsx2(LazyLineChart, { ...props })
-    }
-  );
-}
-function BarChartView(props) {
-  return /* @__PURE__ */ jsx2(
-    Suspense,
-    {
-      fallback: /* @__PURE__ */ jsx2(
-        ComponentSkeleton,
-        {
-          className: props.className,
-          kind: props.component.kind,
-          title: props.component.title
-        }
-      ),
-      children: /* @__PURE__ */ jsx2(LazyBarChart, { ...props })
-    }
-  );
-}
-function AreaChartView(props) {
-  return /* @__PURE__ */ jsx2(ChartSuspense, { className: props.className, component: props.component, children: /* @__PURE__ */ jsx2(LazyAreaChart, { ...props }) });
-}
-function ComposedChartView(props) {
-  return /* @__PURE__ */ jsx2(ChartSuspense, { className: props.className, component: props.component, children: /* @__PURE__ */ jsx2(LazyComposedChart, { ...props }) });
-}
-function PieChartView(props) {
-  return /* @__PURE__ */ jsx2(ChartSuspense, { className: props.className, component: props.component, children: /* @__PURE__ */ jsx2(LazyPieChart, { ...props }) });
-}
-function DonutChartView(props) {
-  return /* @__PURE__ */ jsx2(
-    Suspense,
-    {
-      fallback: /* @__PURE__ */ jsx2(
-        ComponentSkeleton,
-        {
-          className: props.className,
-          kind: props.component.kind,
-          title: props.component.title
-        }
-      ),
-      children: /* @__PURE__ */ jsx2(LazyDonutChart, { ...props })
-    }
-  );
-}
-function RadarChartView(props) {
-  return /* @__PURE__ */ jsx2(ChartSuspense, { className: props.className, component: props.component, children: /* @__PURE__ */ jsx2(LazyRadarChart, { ...props }) });
-}
-function RadialChartView(props) {
-  return /* @__PURE__ */ jsx2(ChartSuspense, { className: props.className, component: props.component, children: /* @__PURE__ */ jsx2(LazyRadialChart, { ...props }) });
-}
-function SankeyChartView(props) {
-  return /* @__PURE__ */ jsx2(ChartSuspense, { className: props.className, component: props.component, children: /* @__PURE__ */ jsx2(LazySankeyChart, { ...props }) });
-}
-function ScatterChartView(props) {
-  return /* @__PURE__ */ jsx2(ChartSuspense, { className: props.className, component: props.component, children: /* @__PURE__ */ jsx2(LazyScatterChart, { ...props }) });
-}
-function HeatmapView(props) {
-  return /* @__PURE__ */ jsx2(ChartSuspense, { className: props.className, component: props.component, children: /* @__PURE__ */ jsx2(LazyHeatmap, { ...props }) });
-}
-function ChartSuspense({
-  children,
-  className,
-  component
-}) {
-  return /* @__PURE__ */ jsx2(
-    Suspense,
-    {
-      fallback: /* @__PURE__ */ jsx2(ComponentSkeleton, { className, kind: component.kind, title: component.title }),
-      children
-    }
-  );
-}
-
-// ../agent-ui/src/components/data-visualization/comparison-list/comparison-list.tsx
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-function ComparisonListView({ className, component, onSelect }) {
-  return /* @__PURE__ */ jsx3(CardVariantProvider, { variant: "plain", children: /* @__PURE__ */ jsx3(Card, { className, description: component.description, title: component.title, children: /* @__PURE__ */ jsx3("div", { className: "aui-comparison", "data-slot": "agent-ui-comparison-list", children: component.items.map((item) => /* @__PURE__ */ jsxs2(
-    "button",
-    {
-      className: "aui-comparison__item",
-      "data-slot": "agent-ui-comparison-item",
-      type: "button",
-      onClick: () => onSelect?.(createComponentSelection(component, item)),
-      children: [
-        /* @__PURE__ */ jsx3("span", { className: "aui-comparison__label", "data-slot": "agent-ui-comparison-label", children: item.label }),
-        /* @__PURE__ */ jsx3("span", { className: "aui-comparison__value", "data-slot": "agent-ui-comparison-value", children: formatNumber(item.value, item.format) }),
-        item.note ? /* @__PURE__ */ jsx3("span", { className: "aui-comparison__note", "data-slot": "agent-ui-comparison-note", children: item.note }) : /* @__PURE__ */ jsx3("span", {}),
-        item.change !== void 0 ? /* @__PURE__ */ jsx3(TrendChange, { slot: "agent-ui-comparison-change", value: item.change }) : null
-      ]
-    },
-    item.label
-  )) }) }) });
-}
-
-// ../agent-ui/src/components/data-visualization/dashboard/dashboard.tsx
-import { jsx as jsx4 } from "react/jsx-runtime";
-function DashboardView({ children, className, component }) {
-  return /* @__PURE__ */ jsx4(Card, { className, description: component.description, title: component.title, children: /* @__PURE__ */ jsx4("div", { className: "aui-dashboard", "data-layout": component.layout, "data-slot": "agent-ui-dashboard", children }) });
-}
+import { Suspense, lazy, useState as useState2 } from "react";
 
 // ../agent-ui/src/components/data-visualization/data-table/data-table.tsx
 import { ChevronUp } from "@gravity-ui/icons";
 import { SearchField } from "@heroui/react";
 import { useMemo, useState } from "react";
-import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function DataTableCardVariantProvider({
+  children,
+  inherit
+}) {
+  return inherit ? children : /* @__PURE__ */ jsx2(CardVariantProvider, { variant: "plain", children });
+}
 function DataTableView({
   className,
   component,
   exportFormats,
+  inheritCardVariant,
   onAction,
-  onSelect
+  onSelect,
+  viewAction
 }) {
   const [filter, setFilter] = useState("");
   const [sort, setSort] = useState(null);
@@ -1725,15 +1782,24 @@ function DataTableView({
     });
   }, [activeSort, component.filterable, filter, keyedRows]);
   const select = (row) => onSelect?.(createComponentSelection(component, row));
-  return /* @__PURE__ */ jsx5(CardVariantProvider, { variant: "plain", children: /* @__PURE__ */ jsxs3(
+  const tableExportFormats = exportFormats?.filter((format) => format === "csv") ?? [];
+  return /* @__PURE__ */ jsx2(DataTableCardVariantProvider, { inherit: inheritCardVariant, children: /* @__PURE__ */ jsxs2(
     Card,
     {
       className,
       description: component.description,
       title: component.title,
-      actions: exportFormats?.includes("csv") ? /* @__PURE__ */ jsx5(ComponentExportActions, { component, formats: ["csv"], onAction }) : null,
+      actions: tableExportFormats.length > 0 || viewAction ? /* @__PURE__ */ jsx2(
+        ComponentExportActions,
+        {
+          component,
+          formats: tableExportFormats,
+          viewAction,
+          onAction
+        }
+      ) : null,
       children: [
-        component.filterable ? /* @__PURE__ */ jsx5("div", { className: "aui-table__tools", "data-slot": "agent-ui-table-tools", children: /* @__PURE__ */ jsx5(
+        component.filterable ? /* @__PURE__ */ jsx2("div", { className: "aui-table__tools", "data-slot": "agent-ui-table-tools", children: /* @__PURE__ */ jsx2(
           SearchField,
           {
             fullWidth: true,
@@ -1742,26 +1808,26 @@ function DataTableView({
             value: filter,
             variant: "secondary",
             onChange: setFilter,
-            children: /* @__PURE__ */ jsxs3(SearchField.Group, { children: [
-              /* @__PURE__ */ jsx5(SearchField.SearchIcon, {}),
-              /* @__PURE__ */ jsx5(SearchField.Input, { "data-slot": "agent-ui-table-filter", placeholder: "Filter rows\u2026" }),
-              /* @__PURE__ */ jsx5(SearchField.ClearButton, {})
+            children: /* @__PURE__ */ jsxs2(SearchField.Group, { children: [
+              /* @__PURE__ */ jsx2(SearchField.SearchIcon, {}),
+              /* @__PURE__ */ jsx2(SearchField.Input, { "data-slot": "agent-ui-table-filter", placeholder: "Filter rows\u2026" }),
+              /* @__PURE__ */ jsx2(SearchField.ClearButton, {})
             ] })
           }
         ) }) : null,
-        /* @__PURE__ */ jsx5(
+        /* @__PURE__ */ jsx2(
           "div",
           {
             className: "aui-table__scroll",
             "data-slot": "agent-ui-table-scroll",
             "data-variant": component.variant ?? "primary",
-            children: /* @__PURE__ */ jsxs3("table", { className: "aui-table", "data-slot": "agent-ui-data-table", children: [
-              /* @__PURE__ */ jsx5("thead", { "data-slot": "agent-ui-table-head", children: /* @__PURE__ */ jsx5("tr", { children: component.columns.map((column) => /* @__PURE__ */ jsx5(
+            children: /* @__PURE__ */ jsxs2("table", { className: "aui-table", "data-slot": "agent-ui-data-table", children: [
+              /* @__PURE__ */ jsx2("thead", { "data-slot": "agent-ui-table-head", children: /* @__PURE__ */ jsx2("tr", { children: component.columns.map((column) => /* @__PURE__ */ jsx2(
                 "th",
                 {
                   scope: "col",
                   "aria-sort": activeSort?.key === column.key ? activeSort.direction === "asc" ? "ascending" : "descending" : "none",
-                  children: /* @__PURE__ */ jsxs3(
+                  children: /* @__PURE__ */ jsxs2(
                     "button",
                     {
                       className: "aui-table__sort",
@@ -1773,7 +1839,7 @@ function DataTableView({
                       })),
                       children: [
                         column.label,
-                        activeSort?.key === column.key ? /* @__PURE__ */ jsx5(
+                        activeSort?.key === column.key ? /* @__PURE__ */ jsx2(
                           ChevronUp,
                           {
                             "aria-hidden": "true",
@@ -1788,7 +1854,7 @@ function DataTableView({
                 },
                 column.key
               )) }) }),
-              /* @__PURE__ */ jsx5("tbody", { "data-slot": "agent-ui-table-body", children: rows.length > 0 ? rows.map(({ key: key2, row }) => /* @__PURE__ */ jsx5(
+              /* @__PURE__ */ jsx2("tbody", { "data-slot": "agent-ui-table-body", children: rows.length > 0 ? rows.map(({ key: key2, row }) => /* @__PURE__ */ jsx2(
                 "tr",
                 {
                   className: "aui-table__row",
@@ -1803,10 +1869,10 @@ function DataTableView({
                       select(row);
                     }
                   },
-                  children: component.columns.map((column) => /* @__PURE__ */ jsx5("td", { "data-slot": "agent-ui-table-cell", children: formatCell(row[column.key], column.format) }, column.key))
+                  children: component.columns.map((column) => /* @__PURE__ */ jsx2("td", { "data-slot": "agent-ui-table-cell", children: formatCell(row[column.key], column.format) }, column.key))
                 },
                 key2
-              )) : /* @__PURE__ */ jsx5("tr", { children: /* @__PURE__ */ jsx5(
+              )) : /* @__PURE__ */ jsx2("tr", { children: /* @__PURE__ */ jsx2(
                 "td",
                 {
                   className: "aui-table__empty",
@@ -1823,6 +1889,261 @@ function DataTableView({
   ) });
 }
 
+// ../agent-ui/src/components/data-visualization/charts/chart-views.tsx
+import { Fragment, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var LazyLineChart = lazy(
+  () => import("./chart-content-USUK4ZM5.js").then((module) => ({ default: module.LineChartComponentContent }))
+);
+var LazyBarChart = lazy(
+  () => import("./chart-content-USUK4ZM5.js").then((module) => ({ default: module.BarChartComponentContent }))
+);
+var LazyAreaChart = lazy(
+  () => import("./chart-content-USUK4ZM5.js").then((module) => ({ default: module.AreaChartComponentContent }))
+);
+var LazyComposedChart = lazy(
+  () => import("./chart-content-USUK4ZM5.js").then((module) => ({ default: module.ComposedChartComponentContent }))
+);
+var LazyPieChart = lazy(
+  () => import("./chart-content-USUK4ZM5.js").then((module) => ({ default: module.PieChartComponentContent }))
+);
+var LazyDonutChart = lazy(
+  () => import("./chart-content-USUK4ZM5.js").then((module) => ({ default: module.DonutChartComponentContent }))
+);
+var LazyRadarChart = lazy(
+  () => import("./chart-content-USUK4ZM5.js").then((module) => ({ default: module.RadarChartComponentContent }))
+);
+var LazyRadialChart = lazy(
+  () => import("./chart-content-USUK4ZM5.js").then((module) => ({ default: module.RadialChartComponentContent }))
+);
+var LazySankeyChart = lazy(
+  () => import("./chart-content-USUK4ZM5.js").then((module) => ({ default: module.SankeyChartComponentContent }))
+);
+var LazyScatterChart = lazy(
+  () => import("./chart-content-USUK4ZM5.js").then((module) => ({ default: module.ScatterChartComponentContent }))
+);
+var LazyHeatmap = lazy(
+  () => import("./chart-content-USUK4ZM5.js").then((module) => ({ default: module.HeatmapComponentContent }))
+);
+var LazyCandlestickChart = lazy(
+  () => import("./chart-content-USUK4ZM5.js").then((module) => ({
+    default: module.CandlestickChartComponentContent
+  }))
+);
+var LazyFunnelChart = lazy(
+  () => import("./chart-content-USUK4ZM5.js").then((module) => ({ default: module.FunnelChartComponentContent }))
+);
+var LazyGaugeChart = lazy(
+  () => import("./chart-content-USUK4ZM5.js").then((module) => ({ default: module.GaugeChartComponentContent }))
+);
+var LazySunburstChart = lazy(
+  () => import("./chart-content-USUK4ZM5.js").then((module) => ({ default: module.SunburstChartComponentContent }))
+);
+function LineChartView(props) {
+  return /* @__PURE__ */ jsx3(
+    ConvertibleChartView,
+    {
+      props,
+      renderChart: (viewProps) => /* @__PURE__ */ jsx3(LazyLineChart, { ...viewProps })
+    }
+  );
+}
+function BarChartView(props) {
+  return /* @__PURE__ */ jsx3(
+    ConvertibleChartView,
+    {
+      props,
+      renderChart: (viewProps) => /* @__PURE__ */ jsx3(LazyBarChart, { ...viewProps })
+    }
+  );
+}
+function AreaChartView(props) {
+  return /* @__PURE__ */ jsx3(
+    ConvertibleChartView,
+    {
+      props,
+      renderChart: (viewProps) => /* @__PURE__ */ jsx3(LazyAreaChart, { ...viewProps })
+    }
+  );
+}
+function ComposedChartView(props) {
+  return /* @__PURE__ */ jsx3(
+    ConvertibleChartView,
+    {
+      props,
+      renderChart: (viewProps) => /* @__PURE__ */ jsx3(LazyComposedChart, { ...viewProps })
+    }
+  );
+}
+function PieChartView(props) {
+  return /* @__PURE__ */ jsx3(
+    ConvertibleChartView,
+    {
+      props,
+      renderChart: (viewProps) => /* @__PURE__ */ jsx3(LazyPieChart, { ...viewProps })
+    }
+  );
+}
+function DonutChartView(props) {
+  return /* @__PURE__ */ jsx3(
+    ConvertibleChartView,
+    {
+      props,
+      renderChart: (viewProps) => /* @__PURE__ */ jsx3(LazyDonutChart, { ...viewProps })
+    }
+  );
+}
+function RadarChartView(props) {
+  return /* @__PURE__ */ jsx3(
+    ConvertibleChartView,
+    {
+      props,
+      renderChart: (viewProps) => /* @__PURE__ */ jsx3(LazyRadarChart, { ...viewProps })
+    }
+  );
+}
+function RadialChartView(props) {
+  return /* @__PURE__ */ jsx3(
+    ConvertibleChartView,
+    {
+      props,
+      renderChart: (viewProps) => /* @__PURE__ */ jsx3(LazyRadialChart, { ...viewProps })
+    }
+  );
+}
+function SankeyChartView(props) {
+  return /* @__PURE__ */ jsx3(
+    ConvertibleChartView,
+    {
+      props,
+      renderChart: (viewProps) => /* @__PURE__ */ jsx3(LazySankeyChart, { ...viewProps })
+    }
+  );
+}
+function ScatterChartView(props) {
+  return /* @__PURE__ */ jsx3(
+    ConvertibleChartView,
+    {
+      props,
+      renderChart: (viewProps) => /* @__PURE__ */ jsx3(LazyScatterChart, { ...viewProps })
+    }
+  );
+}
+function HeatmapView(props) {
+  return /* @__PURE__ */ jsx3(
+    ConvertibleChartView,
+    {
+      props,
+      renderChart: (viewProps) => /* @__PURE__ */ jsx3(LazyHeatmap, { ...viewProps })
+    }
+  );
+}
+function CandlestickChartView(props) {
+  return /* @__PURE__ */ jsx3(
+    ConvertibleChartView,
+    {
+      props,
+      renderChart: (viewProps) => /* @__PURE__ */ jsx3(LazyCandlestickChart, { ...viewProps })
+    }
+  );
+}
+function FunnelChartView(props) {
+  return /* @__PURE__ */ jsx3(
+    ConvertibleChartView,
+    {
+      props,
+      renderChart: (viewProps) => /* @__PURE__ */ jsx3(LazyFunnelChart, { ...viewProps })
+    }
+  );
+}
+function GaugeChartView(props) {
+  return /* @__PURE__ */ jsx3(
+    ConvertibleChartView,
+    {
+      props,
+      renderChart: (viewProps) => /* @__PURE__ */ jsx3(LazyGaugeChart, { ...viewProps })
+    }
+  );
+}
+function SunburstChartView(props) {
+  return /* @__PURE__ */ jsx3(
+    ConvertibleChartView,
+    {
+      props,
+      renderChart: (viewProps) => /* @__PURE__ */ jsx3(LazySunburstChart, { ...viewProps })
+    }
+  );
+}
+function ConvertibleChartView({
+  props,
+  renderChart
+}) {
+  const [view, setView] = useState2("chart");
+  const viewAction = {
+    label: view === "chart" ? "View as table" : "View as chart",
+    onAction: () => setView((current) => current === "chart" ? "table" : "chart"),
+    target: view === "chart" ? "table" : "chart"
+  };
+  const content2 = view === "table" ? /* @__PURE__ */ jsx3(
+    DataTableView,
+    {
+      ...props,
+      inheritCardVariant: true,
+      component: chartToDataTable(props.component),
+      exportFormats: props.exportFormats?.filter((format) => format === "csv"),
+      viewAction
+    }
+  ) : /* @__PURE__ */ jsx3(
+    Suspense,
+    {
+      fallback: /* @__PURE__ */ jsx3(
+        ComponentSkeleton,
+        {
+          className: props.className,
+          kind: props.component.kind,
+          title: props.component.title
+        }
+      ),
+      children: renderChart({ ...props, viewAction })
+    }
+  );
+  return /* @__PURE__ */ jsxs3(Fragment, { children: [
+    content2,
+    /* @__PURE__ */ jsxs3("span", { "aria-live": "polite", className: "aui-sr-only", children: [
+      "Showing ",
+      props.component.title,
+      " as ",
+      view
+    ] })
+  ] });
+}
+
+// ../agent-ui/src/components/data-visualization/comparison-list/comparison-list.tsx
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+function ComparisonListView({ className, component, onSelect }) {
+  return /* @__PURE__ */ jsx4(CardVariantProvider, { variant: "plain", children: /* @__PURE__ */ jsx4(Card, { className, description: component.description, title: component.title, children: /* @__PURE__ */ jsx4("div", { className: "aui-comparison", "data-slot": "agent-ui-comparison-list", children: component.items.map((item) => /* @__PURE__ */ jsxs4(
+    "button",
+    {
+      className: "aui-comparison__item",
+      "data-slot": "agent-ui-comparison-item",
+      type: "button",
+      onClick: () => onSelect?.(createComponentSelection(component, item)),
+      children: [
+        /* @__PURE__ */ jsx4("span", { className: "aui-comparison__label", "data-slot": "agent-ui-comparison-label", children: item.label }),
+        /* @__PURE__ */ jsx4("span", { className: "aui-comparison__value", "data-slot": "agent-ui-comparison-value", children: formatNumber(item.value, item.format) }),
+        item.note ? /* @__PURE__ */ jsx4("span", { className: "aui-comparison__note", "data-slot": "agent-ui-comparison-note", children: item.note }) : /* @__PURE__ */ jsx4("span", {}),
+        item.change !== void 0 ? /* @__PURE__ */ jsx4(TrendChange, { slot: "agent-ui-comparison-change", value: item.change }) : null
+      ]
+    },
+    item.label
+  )) }) }) });
+}
+
+// ../agent-ui/src/components/data-visualization/dashboard/dashboard.tsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+function DashboardView({ children, className, component }) {
+  return /* @__PURE__ */ jsx5(Card, { className, description: component.description, title: component.title, children: /* @__PURE__ */ jsx5("div", { className: "aui-dashboard", "data-layout": component.layout, "data-slot": "agent-ui-dashboard", children }) });
+}
+
 // ../agent-ui/src/components/agent-icon/agent-icon.tsx
 import {
   Briefcase,
@@ -1961,20 +2282,20 @@ function sparklineGeometry(values) {
       `C ${round(x(index) + controlOffset)} ${round(scaled[index] + tangents[index] * controlOffset)} ${round(x(index + 1) - controlOffset)} ${round(scaled[index + 1] - tangents[index + 1] * controlOffset)} ${round(x(index + 1))} ${round(scaled[index + 1])}`
     );
   }
-  const line = segments.join(" ");
-  return { area: `${line} V ${height} H 0 Z`, line };
+  const line2 = segments.join(" ");
+  return { area: `${line2} V ${height} H 0 Z`, line: line2 };
 }
 function round(value) {
   return Math.round(value * 100) / 100;
 }
 
 // ../agent-ui/src/components/data-visualization/kpi-grid/sparkline.tsx
-import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
 function Sparkline({ color, values }) {
   const gradientId = useId();
   const geometry = sparklineGeometry(values);
   if (!geometry) return null;
-  return /* @__PURE__ */ jsxs4(
+  return /* @__PURE__ */ jsxs5(
     "svg",
     {
       "aria-hidden": "true",
@@ -1983,7 +2304,7 @@ function Sparkline({ color, values }) {
       preserveAspectRatio: "none",
       viewBox: `0 0 ${SPARKLINE_VIEWBOX.width} ${SPARKLINE_VIEWBOX.height}`,
       children: [
-        /* @__PURE__ */ jsx7("defs", { children: /* @__PURE__ */ jsxs4("linearGradient", { id: gradientId, x1: "0", x2: "0", y1: "0", y2: "1", children: [
+        /* @__PURE__ */ jsx7("defs", { children: /* @__PURE__ */ jsxs5("linearGradient", { id: gradientId, x1: "0", x2: "0", y1: "0", y2: "1", children: [
           /* @__PURE__ */ jsx7("stop", { offset: "0%", stopColor: color, stopOpacity: 0.22 }),
           /* @__PURE__ */ jsx7("stop", { offset: "100%", stopColor: color, stopOpacity: 0.02 })
         ] }) }),
@@ -2006,7 +2327,7 @@ function Sparkline({ color, values }) {
 }
 
 // ../agent-ui/src/components/data-visualization/kpi-grid/kpi-grid.tsx
-import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
 function KpiGridView({ className, component }) {
   return /* @__PURE__ */ jsx8(
     Card,
@@ -2015,13 +2336,13 @@ function KpiGridView({ className, component }) {
       description: component.description,
       title: component.title,
       variant: "outline",
-      children: /* @__PURE__ */ jsx8("div", { className: "aui-kpi-grid", "data-slot": "agent-ui-kpi-grid", children: component.metrics.map((metric) => /* @__PURE__ */ jsxs5("article", { className: "aui-kpi aui-kpi--chart", "data-slot": "agent-ui-kpi", children: [
-        /* @__PURE__ */ jsxs5("header", { className: "aui-kpi__header", "data-slot": "agent-ui-kpi-header", children: [
+      children: /* @__PURE__ */ jsx8("div", { className: "aui-kpi-grid", "data-slot": "agent-ui-kpi-grid", children: component.metrics.map((metric) => /* @__PURE__ */ jsxs6("article", { className: "aui-kpi aui-kpi--chart", "data-slot": "agent-ui-kpi", children: [
+        /* @__PURE__ */ jsxs6("header", { className: "aui-kpi__header", "data-slot": "agent-ui-kpi-header", children: [
           /* @__PURE__ */ jsx8("span", { className: "aui-kpi__title", "data-slot": "agent-ui-kpi-title", children: metric.label }),
           metric.icon ? /* @__PURE__ */ jsx8("span", { className: "aui-kpi__icon", "data-slot": "agent-ui-kpi-icon", children: /* @__PURE__ */ jsx8(AgentIcon, { name: metric.icon }) }) : null
         ] }),
-        /* @__PURE__ */ jsxs5("div", { className: "aui-kpi__body", "data-slot": "agent-ui-kpi-body", children: [
-          /* @__PURE__ */ jsxs5("div", { className: "aui-kpi__metric", "data-slot": "agent-ui-kpi-metric", children: [
+        /* @__PURE__ */ jsxs6("div", { className: "aui-kpi__body", "data-slot": "agent-ui-kpi-body", children: [
+          /* @__PURE__ */ jsxs6("div", { className: "aui-kpi__metric", "data-slot": "agent-ui-kpi-metric", children: [
             /* @__PURE__ */ jsx8("p", { className: "aui-kpi__value", "data-slot": "agent-ui-kpi-value", children: formatNumber(metric.value, metric.format) }),
             metric.change !== void 0 ? /* @__PURE__ */ jsx8(TrendChange, { slot: "agent-ui-kpi-change", value: metric.change }) : null
           ] }),
@@ -2040,7 +2361,7 @@ function KpiGridView({ className, component }) {
 
 // ../agent-ui/src/components/data-visualization/meter-list/meter-list.tsx
 import { Description, Label, Meter } from "@heroui/react";
-import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
 function MeterListView({ className, component }) {
   return /* @__PURE__ */ jsx9(
     Card,
@@ -2052,7 +2373,7 @@ function MeterListView({ className, component }) {
       children: /* @__PURE__ */ jsx9("div", { className: "aui-meter-list", "data-slot": "agent-ui-meter-list", children: component.items.map((item) => {
         const min = item.min ?? 0;
         const max = item.max ?? (item.format?.style === "percent" ? 1 : 100);
-        return /* @__PURE__ */ jsxs6(
+        return /* @__PURE__ */ jsxs7(
           Meter,
           {
             "aria-label": item.label,
@@ -2079,7 +2400,7 @@ function MeterListView({ className, component }) {
 }
 
 // ../agent-ui/src/components/data-visualization/metric-grid/metric-grid.tsx
-import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
 function MetricGridView({ className, component }) {
   return /* @__PURE__ */ jsx10(
     Card,
@@ -2088,12 +2409,12 @@ function MetricGridView({ className, component }) {
       description: component.description,
       title: component.title,
       variant: "outline",
-      children: /* @__PURE__ */ jsx10("div", { className: "aui-metric-grid", "data-slot": "agent-ui-metric-grid", children: component.metrics.map((metric) => /* @__PURE__ */ jsxs7("article", { className: "aui-kpi", "data-slot": "agent-ui-kpi", children: [
-        /* @__PURE__ */ jsxs7("header", { className: "aui-kpi__header", "data-slot": "agent-ui-kpi-header", children: [
+      children: /* @__PURE__ */ jsx10("div", { className: "aui-metric-grid", "data-slot": "agent-ui-metric-grid", children: component.metrics.map((metric) => /* @__PURE__ */ jsxs8("article", { className: "aui-kpi", "data-slot": "agent-ui-kpi", children: [
+        /* @__PURE__ */ jsxs8("header", { className: "aui-kpi__header", "data-slot": "agent-ui-kpi-header", children: [
           /* @__PURE__ */ jsx10("span", { className: "aui-kpi__title", "data-slot": "agent-ui-kpi-title", children: metric.label }),
           metric.icon ? /* @__PURE__ */ jsx10("span", { className: "aui-kpi__icon", "data-slot": "agent-ui-kpi-icon", children: /* @__PURE__ */ jsx10(AgentIcon, { name: metric.icon }) }) : null
         ] }),
-        /* @__PURE__ */ jsxs7("div", { className: "aui-kpi__content", "data-slot": "agent-ui-kpi-content", children: [
+        /* @__PURE__ */ jsxs8("div", { className: "aui-kpi__content", "data-slot": "agent-ui-kpi-content", children: [
           /* @__PURE__ */ jsx10("p", { className: "aui-kpi__value", "data-slot": "agent-ui-kpi-value", children: formatNumber(metric.value, metric.format) }),
           metric.change !== void 0 ? /* @__PURE__ */ jsx10(TrendChange, { slot: "agent-ui-kpi-change", value: metric.change }) : null
         ] })
@@ -2114,12 +2435,12 @@ import {
   Tag as Tag2,
   TagGroup
 } from "@heroui/react";
-import { useCallback as useCallback2, useMemo as useMemo2, useState as useState4 } from "react";
+import { useCallback as useCallback2, useMemo as useMemo2, useState as useState5 } from "react";
 
 // ../agent-ui/src/components/display-information/diagram.tsx
 import { ArrowRotateLeft, Minus, Plus } from "@gravity-ui/icons";
 import { Button, Modal, Separator, Tooltip } from "@heroui/react";
-import { useCallback, useEffect, useId as useId2, useRef, useState as useState2 } from "react";
+import { useCallback, useEffect, useId as useId2, useRef, useState as useState3 } from "react";
 
 // ../agent-ui/src/components/display-information/diagram-loader.ts
 var FALLBACK_FONT = "Inter, ui-sans-serif, system-ui, sans-serif";
@@ -2162,7 +2483,7 @@ async function mermaidForElement(element) {
 }
 
 // ../agent-ui/src/components/display-information/diagram.tsx
-import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
 var MIN_SCALE = 0.5;
 var MAX_SCALE = 4;
 var SCALE_STEP = 0.25;
@@ -2179,8 +2500,8 @@ function ExpandGlyph() {
   ) });
 }
 function useMermaidSvg(chart, renderId, enabled, fontSource) {
-  const [svg, setSvg] = useState2(null);
-  const [failed, setFailed] = useState2(false);
+  const [svg, setSvg] = useState3(null);
+  const [failed, setFailed] = useState3(false);
   const container = useRef(null);
   useEffect(() => {
     if (!enabled) return;
@@ -2227,19 +2548,19 @@ function Diagram({ chart, title: title2 }) {
   const baseId = useId2().replace(/[^a-zA-Z0-9]/g, "");
   const frame = useRef(null);
   const inline = useMermaidSvg(chart, `aui-diagram-${baseId}`, true, frame);
-  const [isExpanded, setIsExpanded] = useState2(false);
+  const [isExpanded, setIsExpanded] = useState3(false);
   const expanded = useMermaidSvg(chart, `aui-diagram-modal-${baseId}`, isExpanded, frame);
-  const [scale, setScale] = useState2(1);
-  const [portalContainer, setPortalContainer] = useState2();
+  const [scale, setScale] = useState3(1);
+  const [portalContainer, setPortalContainer] = useState3();
   const frameRef = useCallback((node) => {
     frame.current = node;
     setPortalContainer(resolveOverlayPortalContainer(node));
   }, []);
   const zoom = (delta) => setScale((current) => Math.min(MAX_SCALE, Math.max(MIN_SCALE, current + delta)));
   if (inline.failed) return /* @__PURE__ */ jsx11(CodeBlock, { code: chart, language: "mermaid" });
-  return /* @__PURE__ */ jsxs8("div", { ref: frameRef, className: "aui-diagram", "data-slot": "agent-ui-diagram", children: [
+  return /* @__PURE__ */ jsxs9("div", { ref: frameRef, className: "aui-diagram", "data-slot": "agent-ui-diagram", children: [
     /* @__PURE__ */ jsx11(DiagramSurface, { markup: inline.markup, pendingRef: inline.container }),
-    inline.markup ? /* @__PURE__ */ jsxs8(
+    inline.markup ? /* @__PURE__ */ jsxs9(
       Modal,
       {
         isOpen: isExpanded,
@@ -2267,21 +2588,21 @@ function Diagram({ chart, title: title2 }) {
               className: "aui-diagram-modal__backdrop",
               UNSTABLE_portalContainer: portalContainer,
               variant: "blur",
-              children: /* @__PURE__ */ jsx11(Modal.Container, { className: "aui-diagram-modal__container", placement: "center", children: /* @__PURE__ */ jsxs8(
+              children: /* @__PURE__ */ jsx11(Modal.Container, { className: "aui-diagram-modal__container", placement: "center", children: /* @__PURE__ */ jsxs9(
                 Modal.Dialog,
                 {
                   "aria-label": title2 ? `${title2} diagram` : "Diagram",
                   className: "aui-diagram-modal__dialog",
                   "data-slot": "agent-ui-diagram-modal",
                   children: [
-                    /* @__PURE__ */ jsx11("div", { className: "aui-diagram-modal__controls", children: /* @__PURE__ */ jsxs8(
+                    /* @__PURE__ */ jsx11("div", { className: "aui-diagram-modal__controls", children: /* @__PURE__ */ jsxs9(
                       "div",
                       {
                         "aria-label": "Diagram zoom controls",
                         className: "aui-diagram-modal__control-group",
                         role: "toolbar",
                         children: [
-                          /* @__PURE__ */ jsxs8(Tooltip, { delay: 0, children: [
+                          /* @__PURE__ */ jsxs9(Tooltip, { delay: 0, children: [
                             /* @__PURE__ */ jsx11(
                               Button,
                               {
@@ -2296,7 +2617,7 @@ function Diagram({ chart, title: title2 }) {
                             ),
                             /* @__PURE__ */ jsx11(Tooltip.Content, { placement: "top", children: "Zoom out" })
                           ] }),
-                          /* @__PURE__ */ jsxs8(Tooltip, { delay: 0, children: [
+                          /* @__PURE__ */ jsxs9(Tooltip, { delay: 0, children: [
                             /* @__PURE__ */ jsx11(
                               Button,
                               {
@@ -2311,7 +2632,7 @@ function Diagram({ chart, title: title2 }) {
                             ),
                             /* @__PURE__ */ jsx11(Tooltip.Content, { placement: "top", children: "Zoom in" })
                           ] }),
-                          /* @__PURE__ */ jsxs8(
+                          /* @__PURE__ */ jsxs9(
                             "output",
                             {
                               "aria-label": `Zoom level: ${Math.round(scale * 100)}%`,
@@ -2323,7 +2644,7 @@ function Diagram({ chart, title: title2 }) {
                             }
                           ),
                           /* @__PURE__ */ jsx11(Separator, { className: "aui-diagram-modal__separator", orientation: "vertical" }),
-                          /* @__PURE__ */ jsxs8(Tooltip, { delay: 0, children: [
+                          /* @__PURE__ */ jsxs9(Tooltip, { delay: 0, children: [
                             /* @__PURE__ */ jsx11(
                               Button,
                               {
@@ -2339,7 +2660,7 @@ function Diagram({ chart, title: title2 }) {
                             /* @__PURE__ */ jsx11(Tooltip.Content, { placement: "top", children: "Reset zoom" })
                           ] }),
                           /* @__PURE__ */ jsx11(Separator, { className: "aui-diagram-modal__separator", orientation: "vertical" }),
-                          /* @__PURE__ */ jsxs8(Tooltip, { delay: 0, children: [
+                          /* @__PURE__ */ jsxs9(Tooltip, { delay: 0, children: [
                             /* @__PURE__ */ jsx11(Modal.CloseTrigger, { className: "aui-diagram-modal__close" }),
                             /* @__PURE__ */ jsx11(Tooltip.Content, { placement: "top", children: "Close" })
                           ] })
@@ -2367,7 +2688,7 @@ function Diagram({ chart, title: title2 }) {
 
 // ../agent-ui/src/components/display-information/fallback-image.tsx
 import { Picture } from "@gravity-ui/icons";
-import { useState as useState3 } from "react";
+import { useState as useState4 } from "react";
 import { jsx as jsx12 } from "react/jsx-runtime";
 function FallbackImage({
   alt = "",
@@ -2382,7 +2703,7 @@ function FallbackImage({
   srcSet,
   ...props
 }) {
-  const [failedSrc, setFailedSrc] = useState3();
+  const [failedSrc, setFailedSrc] = useState4();
   if (!src || failedSrc === src) {
     return /* @__PURE__ */ jsx12(
       "span",
@@ -2419,7 +2740,7 @@ function FallbackImage({
 }
 
 // ../agent-ui/src/components/display-information/display-views.tsx
-import { Fragment, jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx13, jsxs as jsxs10 } from "react/jsx-runtime";
 function TextView({ className, component }) {
   if (component.variant === "clear") {
     return /* @__PURE__ */ jsx13(
@@ -2436,7 +2757,7 @@ function TextView({ className, component }) {
   return /* @__PURE__ */ jsx13(Card, { className, description: component.description, title: component.title, children: /* @__PURE__ */ jsx13("div", { className: "aui-prose", "data-slot": "agent-ui-text", "data-variant": "card", children: renderInlineMarkdown(component.content) }) });
 }
 function CalloutView({ className, component }) {
-  return /* @__PURE__ */ jsx13(Card, { className, description: component.description, title: component.title, children: /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsx13(Card, { className, description: component.description, title: component.title, children: /* @__PURE__ */ jsxs10(
     "div",
     {
       className: "aui-callout",
@@ -2466,8 +2787,8 @@ function CalloutView({ className, component }) {
 }
 function ImageView({ className, component, onSelect }) {
   const layout = component.variant ?? "grid";
-  const [portalContainer, setPortalContainer] = useState4();
-  const [failedSources, setFailedSources] = useState4(() => /* @__PURE__ */ new Set());
+  const [portalContainer, setPortalContainer] = useState5();
+  const [failedSources, setFailedSources] = useState5(() => /* @__PURE__ */ new Set());
   const imagesRef = useCallback2((node) => {
     setPortalContainer(resolveOverlayPortalContainer(node));
   }, []);
@@ -2481,7 +2802,7 @@ function ImageView({ className, component, onSelect }) {
   }, []);
   const galleryItems = component.images.map((item) => {
     const failed = failedSources.has(item.src);
-    const tile = /* @__PURE__ */ jsxs9(Fragment, { children: [
+    const tile = /* @__PURE__ */ jsxs10(Fragment2, { children: [
       /* @__PURE__ */ jsx13("span", { className: "aui-image__frame", "data-slot": "agent-ui-image-frame", children: /* @__PURE__ */ jsx13(
         FallbackImage,
         {
@@ -2507,7 +2828,7 @@ function ImageView({ className, component, onSelect }) {
         item.src
       );
     }
-    return /* @__PURE__ */ jsxs9(Modal2, { children: [
+    return /* @__PURE__ */ jsxs10(Modal2, { children: [
       /* @__PURE__ */ jsx13(
         Modal2.Trigger,
         {
@@ -2524,7 +2845,7 @@ function ImageView({ className, component, onSelect }) {
           className: "aui-image-modal__backdrop",
           UNSTABLE_portalContainer: portalContainer,
           variant: "blur",
-          children: /* @__PURE__ */ jsx13(Modal2.Container, { className: "aui-image-modal__container", placement: "center", children: /* @__PURE__ */ jsxs9(
+          children: /* @__PURE__ */ jsx13(Modal2.Container, { className: "aui-image-modal__container", placement: "center", children: /* @__PURE__ */ jsxs10(
             Modal2.Dialog,
             {
               "aria-label": item.alt,
@@ -2589,7 +2910,7 @@ function ListView({ className, component }) {
       className: "aui-list",
       "data-slot": "agent-ui-list",
       "data-style": style,
-      children: component.items.map((item, index) => /* @__PURE__ */ jsxs9("li", { className: "aui-list__item", "data-slot": "agent-ui-list-item", children: [
+      children: component.items.map((item, index) => /* @__PURE__ */ jsxs10("li", { className: "aui-list__item", "data-slot": "agent-ui-list-item", children: [
         style === "checklist" ? /* @__PURE__ */ jsx13(
           Checkbox,
           {
@@ -2610,7 +2931,7 @@ function ListView({ className, component }) {
             children: style === "numbered" ? `${index + 1}.` : "\u2022"
           }
         ),
-        /* @__PURE__ */ jsxs9("span", { className: "aui-list__body", "data-slot": "agent-ui-list-content", children: [
+        /* @__PURE__ */ jsxs10("span", { className: "aui-list__body", "data-slot": "agent-ui-list-content", children: [
           /* @__PURE__ */ jsx13(Label2, { "data-slot": "agent-ui-list-label", children: item.text }),
           item.children?.length ? /* @__PURE__ */ jsx13("span", { className: "aui-list__children", "data-slot": "agent-ui-list-children", children: item.children.map((child) => /* @__PURE__ */ jsx13(Description2, { "data-slot": "agent-ui-list-child", children: child }, child)) }) : null
         ] })
@@ -2631,7 +2952,7 @@ function ListBlockView({ className, component }) {
       description: component.description,
       title: component.title,
       variant: "outline",
-      children: /* @__PURE__ */ jsx13("ul", { "aria-label": component.title, className: "aui-list-block", "data-slot": "agent-ui-list-block", children: component.items.map((item) => /* @__PURE__ */ jsxs9("li", { className: "aui-list-block__item", "data-slot": "agent-ui-list-block-item", children: [
+      children: /* @__PURE__ */ jsx13("ul", { "aria-label": component.title, className: "aui-list-block", "data-slot": "agent-ui-list-block", children: component.items.map((item) => /* @__PURE__ */ jsxs10("li", { className: "aui-list-block__item", "data-slot": "agent-ui-list-block-item", children: [
         item.imageUrl ? /* @__PURE__ */ jsx13(
           FallbackImage,
           {
@@ -2650,7 +2971,7 @@ function ListBlockView({ className, component }) {
             children: item.icon ? /* @__PURE__ */ jsx13(AgentIcon, { "data-slot": "agent-ui-list-block-icon", name: item.icon }) : item.title.trim().charAt(0).toUpperCase()
           }
         ),
-        /* @__PURE__ */ jsxs9("span", { className: "aui-list-block__body", "data-slot": "agent-ui-list-block-content", children: [
+        /* @__PURE__ */ jsxs10("span", { className: "aui-list-block__body", "data-slot": "agent-ui-list-block-content", children: [
           /* @__PURE__ */ jsx13(Label2, { className: "aui-list-block__title", "data-slot": "agent-ui-list-block-title", children: item.title }),
           item.description ? /* @__PURE__ */ jsx13(
             Description2,
@@ -2661,7 +2982,7 @@ function ListBlockView({ className, component }) {
             }
           ) : null
         ] }),
-        item.meta || item.rating !== void 0 ? /* @__PURE__ */ jsxs9("span", { className: "aui-list-block__footer", "data-slot": "agent-ui-list-block-footer", children: [
+        item.meta || item.rating !== void 0 ? /* @__PURE__ */ jsxs10("span", { className: "aui-list-block__footer", "data-slot": "agent-ui-list-block-footer", children: [
           item.meta ? /* @__PURE__ */ jsx13(
             "span",
             {
@@ -2672,14 +2993,14 @@ function ListBlockView({ className, component }) {
             }
           ) : null,
           item.meta && item.rating !== void 0 ? /* @__PURE__ */ jsx13("span", { "aria-hidden": "true", className: "aui-list-block__meta-separator", children: "\xB7" }) : null,
-          item.rating !== void 0 ? /* @__PURE__ */ jsxs9(
+          item.rating !== void 0 ? /* @__PURE__ */ jsxs10(
             "span",
             {
               "aria-label": `${item.rating} out of 5 stars`,
               className: "aui-list-block__rating",
               "data-slot": "agent-ui-list-block-rating",
               children: [
-                /* @__PURE__ */ jsxs9("span", { "aria-hidden": "true", children: [
+                /* @__PURE__ */ jsxs10("span", { "aria-hidden": "true", children: [
                   item.rating,
                   "/5"
                 ] }),
@@ -2708,8 +3029,8 @@ function AccordionView({ className, component }) {
       className: "aui-accordion",
       "data-slot": "agent-ui-accordion",
       defaultExpandedKeys: component.sections.filter((section) => section.defaultOpen).map((section) => section.id),
-      children: component.sections.map((section) => /* @__PURE__ */ jsxs9(Accordion.Item, { "data-slot": "agent-ui-accordion-item", id: section.id, children: [
-        /* @__PURE__ */ jsx13(Accordion.Heading, { children: /* @__PURE__ */ jsxs9(Accordion.Trigger, { "data-slot": "agent-ui-accordion-trigger", children: [
+      children: component.sections.map((section) => /* @__PURE__ */ jsxs10(Accordion.Item, { "data-slot": "agent-ui-accordion-item", id: section.id, children: [
+        /* @__PURE__ */ jsx13(Accordion.Heading, { children: /* @__PURE__ */ jsxs10(Accordion.Trigger, { "data-slot": "agent-ui-accordion-trigger", children: [
           section.title,
           /* @__PURE__ */ jsx13(Accordion.Indicator, { "data-slot": "agent-ui-accordion-indicator" })
         ] }) }),
@@ -2719,8 +3040,8 @@ function AccordionView({ className, component }) {
   ) });
 }
 function StepsView({ className, component, onSelect }) {
-  const [portalContainer, setPortalContainer] = useState4();
-  const [failedSources, setFailedSources] = useState4(() => /* @__PURE__ */ new Set());
+  const [portalContainer, setPortalContainer] = useState5();
+  const [failedSources, setFailedSources] = useState5(() => /* @__PURE__ */ new Set());
   const hasIcons = component.steps.some((step) => step.icon);
   const hasImages = component.steps.some((step) => step.image);
   const stepsRef = useCallback2((node) => {
@@ -2766,7 +3087,7 @@ function StepsView({ className, component, onSelect }) {
             "data-has-image": step.image ? "true" : void 0,
             "data-slot": "agent-ui-step",
             "data-status": status,
-            children: /* @__PURE__ */ jsxs9("div", { className: "aui-steps__row", children: [
+            children: /* @__PURE__ */ jsxs10("div", { className: "aui-steps__row", children: [
               step.image ? imageFailed ? /* @__PURE__ */ jsx13(
                 "span",
                 {
@@ -2782,7 +3103,7 @@ function StepsView({ className, component, onSelect }) {
                     }
                   )
                 }
-              ) : /* @__PURE__ */ jsxs9(Modal2, { children: [
+              ) : /* @__PURE__ */ jsxs10(Modal2, { children: [
                 /* @__PURE__ */ jsx13(
                   Modal2.Trigger,
                   {
@@ -2809,7 +3130,7 @@ function StepsView({ className, component, onSelect }) {
                     className: "aui-image-modal__backdrop",
                     UNSTABLE_portalContainer: portalContainer,
                     variant: "blur",
-                    children: /* @__PURE__ */ jsx13(Modal2.Container, { className: "aui-image-modal__container", placement: "center", children: /* @__PURE__ */ jsxs9(
+                    children: /* @__PURE__ */ jsx13(Modal2.Container, { className: "aui-image-modal__container", placement: "center", children: /* @__PURE__ */ jsxs10(
                       Modal2.Dialog,
                       {
                         "aria-label": step.image.alt,
@@ -2838,11 +3159,11 @@ function StepsView({ className, component, onSelect }) {
                   "data-slot": "agent-ui-step-action",
                   type: "button",
                   onClick: () => onSelect?.(createComponentSelection(component, step)),
-                  children: /* @__PURE__ */ jsxs9("span", { "data-slot": "agent-ui-step-content", children: [
+                  children: /* @__PURE__ */ jsxs10("span", { "data-slot": "agent-ui-step-content", children: [
                     step.timestamp || step.meta ? /* @__PURE__ */ jsx13("span", { className: "aui-steps__meta", "data-slot": "agent-ui-step-meta", children: [step.timestamp, step.meta].filter(Boolean).join(" \xB7 ") }) : null,
                     /* @__PURE__ */ jsx13("strong", { "data-slot": "agent-ui-step-title", children: step.title }),
                     step.content ? /* @__PURE__ */ jsx13("small", { "data-slot": "agent-ui-step-description", children: step.content }) : null,
-                    step.progress !== void 0 ? /* @__PURE__ */ jsxs9(
+                    step.progress !== void 0 ? /* @__PURE__ */ jsxs10(
                       ProgressBar,
                       {
                         "aria-label": `${step.title} progress`,
@@ -2875,9 +3196,9 @@ function DiagramView({ className, component }) {
 }
 function TabsView({ className, component, onSelect, renderPanel }) {
   const tabIds = useMemo2(() => new Set(component.tabs.map((tab) => tab.id)), [component.tabs]);
-  const [selected, setSelected] = useState4(component.defaultValue ?? component.tabs[0]?.id ?? "");
+  const [selected, setSelected] = useState5(component.defaultValue ?? component.tabs[0]?.id ?? "");
   const activeId = tabIds.has(selected) ? selected : component.defaultValue ?? component.tabs[0]?.id ?? "";
-  return /* @__PURE__ */ jsx13(Card, { className, description: component.description, title: component.title, children: /* @__PURE__ */ jsx13("div", { className: "aui-tabs", "data-slot": "agent-ui-tabs", children: /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsx13(Card, { className, description: component.description, title: component.title, children: /* @__PURE__ */ jsx13("div", { className: "aui-tabs", "data-slot": "agent-ui-tabs", children: /* @__PURE__ */ jsxs10(
     Tabs,
     {
       selectedKey: activeId,
@@ -2889,7 +3210,7 @@ function TabsView({ className, component, onSelect, renderPanel }) {
         if (nextTab) onSelect?.(createComponentSelection(component, nextTab));
       },
       children: [
-        /* @__PURE__ */ jsx13(Tabs.ListContainer, { children: /* @__PURE__ */ jsx13(Tabs.List, { "aria-label": component.title, children: component.tabs.map((tab) => /* @__PURE__ */ jsxs9(Tabs.Tab, { id: tab.id, children: [
+        /* @__PURE__ */ jsx13(Tabs.ListContainer, { children: /* @__PURE__ */ jsx13(Tabs.List, { "aria-label": component.title, children: component.tabs.map((tab) => /* @__PURE__ */ jsxs10(Tabs.Tab, { id: tab.id, children: [
           tab.label,
           /* @__PURE__ */ jsx13(Tabs.Indicator, {})
         ] }, tab.id)) }) }),
@@ -6616,13 +6937,13 @@ var ItemCardGroup = Object.assign(ItemCardGroupRoot, {
 });
 
 // ../agent-ui/src/components/display-information/item-card/item-card.tsx
-import { Fragment as Fragment2, jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
 function itemCardContent({
   left,
   middle,
   right
 }) {
-  return /* @__PURE__ */ jsxs10(Fragment2, { children: [
+  return /* @__PURE__ */ jsxs11(Fragment3, { children: [
     left ? /* @__PURE__ */ jsx16(ItemCard.Icon, { children: left }) : null,
     /* @__PURE__ */ jsx16(ItemCard.Content, { children: middle }),
     right ? /* @__PURE__ */ jsx16(ItemCard.Action, { children: right }) : null
@@ -6676,7 +6997,7 @@ function ItemCardView({
   );
 }
 function ItemCardGroupView({ children, className, component }) {
-  return /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsxs11(
     ItemCardGroup,
     {
       "aria-label": component.title,
@@ -6686,7 +7007,7 @@ function ItemCardGroupView({ children, className, component }) {
       layout: component.layout,
       variant: component.variant,
       children: [
-        component.showHeader ? /* @__PURE__ */ jsxs10(ItemCardGroup.Header, { children: [
+        component.showHeader ? /* @__PURE__ */ jsxs11(ItemCardGroup.Header, { children: [
           /* @__PURE__ */ jsx16(ItemCardGroup.Title, { children: component.title }),
           component.description ? /* @__PURE__ */ jsx16(ItemCardGroup.Description, { children: component.description }) : null
         ] }) : null,
@@ -6701,7 +7022,7 @@ import { Children } from "react";
 
 // ../agent-ui/src/components/display-information/widget/widget.tsx
 import { Picture as Picture2 } from "@gravity-ui/icons";
-import { useState as useState5 } from "react";
+import { useState as useState6 } from "react";
 import { jsx as jsx17 } from "react/jsx-runtime";
 var alignItems = { center: "center", end: "flex-end", start: "flex-start", stretch: "stretch" };
 var justifyContent = {
@@ -6905,7 +7226,7 @@ function WidgetImage({
   width,
   ...props
 }) {
-  const [failedSrc, setFailedSrc] = useState5();
+  const [failedSrc, setFailedSrc] = useState6();
   const visualProps = {
     "data-flush": flush || void 0,
     "data-frame": frame || void 0,
@@ -7068,7 +7389,7 @@ import {
   useId as useId3,
   useMemo as useMemo5,
   useRef as useRef2,
-  useState as useState6
+  useState as useState7
 } from "react";
 
 // ../agent-ui/src/components/display-information/map/map-provider-context.ts
@@ -7079,7 +7400,7 @@ function useAgentMapTileProvider() {
 }
 
 // ../agent-ui/src/components/display-information/map/map.tsx
-import { Fragment as Fragment3, jsx as jsx19, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx19, jsxs as jsxs12 } from "react/jsx-runtime";
 var ratingFormatter = new Intl.NumberFormat(void 0, {
   maximumFractionDigits: 1,
   minimumFractionDigits: 1
@@ -7127,7 +7448,7 @@ function prefersReducedMotion() {
 }
 function MapLocationImage({ className, location }) {
   const image = location.images?.[0];
-  const [failedSource, setFailedSource] = useState6();
+  const [failedSource, setFailedSource] = useState7();
   if (!image || failedSource === image.src) {
     return /* @__PURE__ */ jsx19("span", { "aria-hidden": "true", className: mergeClassNames(className, "aui-map__image-fallback"), children: getInitials(location.title) });
   }
@@ -7174,16 +7495,16 @@ function LocationMetadata({
   showCategory = true
 }) {
   const ratingLabel = location.rating === void 0 ? void 0 : `${formatRating(location.rating)} out of 5${location.reviewCount === void 0 ? "" : `, ${reviewCountFormatter.format(location.reviewCount)} reviews`}`;
-  return /* @__PURE__ */ jsxs11("span", { className: "aui-map__metadata", "data-slot": "agent-ui-map-location-metadata", children: [
-    location.rating !== void 0 ? /* @__PURE__ */ jsxs11("span", { "aria-label": ratingLabel, className: "aui-map__rating", children: [
+  return /* @__PURE__ */ jsxs12("span", { className: "aui-map__metadata", "data-slot": "agent-ui-map-location-metadata", children: [
+    location.rating !== void 0 ? /* @__PURE__ */ jsxs12("span", { "aria-label": ratingLabel, className: "aui-map__rating", children: [
       /* @__PURE__ */ jsx19("span", { "aria-hidden": "true", children: formatRating(location.rating) }),
       /* @__PURE__ */ jsx19(StarFill, { "aria-hidden": "true" })
     ] }) : null,
-    location.reviewCount !== void 0 ? /* @__PURE__ */ jsxs11("span", { "aria-hidden": "true", children: [
+    location.reviewCount !== void 0 ? /* @__PURE__ */ jsxs12("span", { "aria-hidden": "true", children: [
       reviewCountFormatter.format(location.reviewCount),
       " reviews"
     ] }) : null,
-    showCategory && location.category ? /* @__PURE__ */ jsxs11(Fragment3, { children: [
+    showCategory && location.category ? /* @__PURE__ */ jsxs12(Fragment4, { children: [
       /* @__PURE__ */ jsx19("span", { "aria-hidden": "true", className: "aui-map__metadata-separator", children: "\xB7" }),
       /* @__PURE__ */ jsx19("span", { children: location.category })
     ] }) : null
@@ -7196,7 +7517,7 @@ function HostTileMapSurface({ component, onSelect, selectedLocationId }) {
     () => new Map(component.locations.map((location) => [location.id, location])),
     [component.locations]
   );
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs12(
     "div",
     {
       "aria-label": `${component.title} map with ${component.locations.length} locations`,
@@ -7205,7 +7526,7 @@ function HostTileMapSurface({ component, onSelect, selectedLocationId }) {
       "data-slot": "agent-ui-map-surface",
       role: "region",
       children: [
-        /* @__PURE__ */ jsxs11(
+        /* @__PURE__ */ jsxs12(
           "svg",
           {
             "aria-hidden": "true",
@@ -7258,7 +7579,7 @@ function HostTileMapSurface({ component, onSelect, selectedLocationId }) {
           const selected = location.id === selectedLocationId;
           const markerLabel = location.rating !== void 0 ? formatRating(location.rating) : location.relevance !== void 0 ? `${Math.round(location.relevance * 100)}%` : String(index + 1);
           const accessibleLabel = `Select ${location.title} on map${location.rating === void 0 ? "" : `, rated ${formatRating(location.rating)} out of 5`}`;
-          return /* @__PURE__ */ jsxs11(
+          return /* @__PURE__ */ jsxs12(
             "button",
             {
               "aria-label": accessibleLabel,
@@ -7315,7 +7636,7 @@ function ResultCard({
 }) {
   const area = getLocationArea(location.address);
   const subtitle = [location.category, area].filter(Boolean).join(" \xB7 ");
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs12(
     "button",
     {
       ref: setRef,
@@ -7329,12 +7650,12 @@ function ResultCard({
       onKeyDown,
       children: [
         /* @__PURE__ */ jsx19(MapLocationImage, { className: "aui-map__result-image", location }),
-        /* @__PURE__ */ jsxs11("span", { className: "aui-map__result-content", children: [
+        /* @__PURE__ */ jsxs12("span", { className: "aui-map__result-content", children: [
           /* @__PURE__ */ jsx19("span", { className: "aui-map__result-title", children: location.title }),
           subtitle ? /* @__PURE__ */ jsx19("span", { className: "aui-map__result-subtitle", children: subtitle }) : null,
           /* @__PURE__ */ jsx19(LocationMetadata, { location, showCategory: false })
         ] }),
-        location.relevance !== void 0 ? /* @__PURE__ */ jsx19("span", { className: "aui-map__result-aside", children: /* @__PURE__ */ jsxs11("span", { className: "aui-map__relevance", "data-slot": "agent-ui-map-relevance", children: [
+        location.relevance !== void 0 ? /* @__PURE__ */ jsx19("span", { className: "aui-map__result-aside", children: /* @__PURE__ */ jsxs12("span", { className: "aui-map__relevance", "data-slot": "agent-ui-map-relevance", children: [
           Math.round(location.relevance * 100),
           "% match"
         ] }) }) : null
@@ -7353,12 +7674,12 @@ function MapDetails({
   const tileProvider = useAgentMapTileProvider();
   const shouldReduceMotion = useReducedMotion();
   const primaryImage = location.images?.[0];
-  const [failedSource, setFailedSource] = useState6();
+  const [failedSource, setFailedSource] = useState7();
   const hasImage = primaryImage && primaryImage.src !== failedSource;
   const animationDirection = shouldReduceMotion ? 0 : direction;
   const transition = shouldReduceMotion ? reducedMotionTransition : detailTransition;
-  return /* @__PURE__ */ jsx19(LazyMotion, { features: domAnimation, children: /* @__PURE__ */ jsxs11("div", { className: "aui-map-detail__content", children: [
-    /* @__PURE__ */ jsx19("div", { className: "aui-map-detail__hero", "data-has-image": Boolean(hasImage), children: /* @__PURE__ */ jsx19(AnimatePresence, { custom: animationDirection, initial: false, mode: "popLayout", children: /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsx19(LazyMotion, { features: domAnimation, children: /* @__PURE__ */ jsxs12("div", { className: "aui-map-detail__content", children: [
+    /* @__PURE__ */ jsx19("div", { className: "aui-map-detail__hero", "data-has-image": Boolean(hasImage), children: /* @__PURE__ */ jsx19(AnimatePresence, { custom: animationDirection, initial: false, mode: "popLayout", children: /* @__PURE__ */ jsxs12(
       MapDetailPresenceSlide,
       {
         className: "aui-map-detail__hero-slide",
@@ -7376,7 +7697,7 @@ function MapDetails({
               onError: () => setFailedSource(primaryImage.src)
             }
           ) : /* @__PURE__ */ jsx19("span", { "aria-hidden": "true", className: "aui-map-detail__hero-fallback", children: getInitials(location.title) }),
-          location.images && location.images.length > 1 ? /* @__PURE__ */ jsxs11("span", { className: "aui-map-detail__image-count", children: [
+          location.images && location.images.length > 1 ? /* @__PURE__ */ jsxs12("span", { className: "aui-map-detail__image-count", children: [
             /* @__PURE__ */ jsx19("span", { "aria-hidden": "true", children: "\u25A7" }),
             " ",
             location.images.length
@@ -7386,7 +7707,7 @@ function MapDetails({
       location.id
     ) }) }),
     /* @__PURE__ */ jsx19(Modal3.CloseTrigger, { "aria-label": "Close location details", className: "aui-map-detail__close" }),
-    /* @__PURE__ */ jsx19(AnimatePresence, { custom: animationDirection, initial: false, mode: "popLayout", children: /* @__PURE__ */ jsxs11(
+    /* @__PURE__ */ jsx19(AnimatePresence, { custom: animationDirection, initial: false, mode: "popLayout", children: /* @__PURE__ */ jsxs12(
       MapDetailPresenceSlide,
       {
         className: "aui-map-detail__body",
@@ -7394,7 +7715,7 @@ function MapDetails({
         transition,
         variants: detailBodyVariants,
         children: [
-          /* @__PURE__ */ jsxs11("div", { className: "aui-map-detail__heading", children: [
+          /* @__PURE__ */ jsxs12("div", { className: "aui-map-detail__heading", children: [
             /* @__PURE__ */ jsx19("h2", { id: headingId, children: location.title }),
             /* @__PURE__ */ jsx19(LocationMetadata, { location }),
             location.address ? /* @__PURE__ */ jsx19("p", { className: "aui-map-detail__address", children: location.address }) : null
@@ -7416,7 +7737,7 @@ function MapDetails({
               action2.id
             );
           }) }) : null,
-          location.notes ? /* @__PURE__ */ jsxs11("section", { className: "aui-map-detail__notes", "data-slot": "agent-ui-map-detail-notes", children: [
+          location.notes ? /* @__PURE__ */ jsxs12("section", { className: "aui-map-detail__notes", "data-slot": "agent-ui-map-detail-notes", children: [
             /* @__PURE__ */ jsx19("span", { children: "Notes" }),
             /* @__PURE__ */ jsx19("p", { children: renderInlineMarkdown(location.notes) })
           ] }) : null
@@ -7424,9 +7745,9 @@ function MapDetails({
       },
       location.id
     ) }),
-    /* @__PURE__ */ jsxs11("footer", { className: "aui-map-detail__footer", children: [
+    /* @__PURE__ */ jsxs12("footer", { className: "aui-map-detail__footer", children: [
       /* @__PURE__ */ jsx19("span", { className: "aui-map-detail__provider", children: tileProvider?.attribution ?? "OpenStreetMap \xB7 CARTO" }),
-      /* @__PURE__ */ jsxs11("div", { className: "aui-map-detail__navigation", children: [
+      /* @__PURE__ */ jsxs12("div", { className: "aui-map-detail__navigation", children: [
         /* @__PURE__ */ jsx19(
           "button",
           {
@@ -7437,7 +7758,7 @@ function MapDetails({
             children: /* @__PURE__ */ jsx19(ChevronLeft, { "aria-hidden": "true" })
           }
         ),
-        /* @__PURE__ */ jsxs11("span", { "aria-live": "polite", children: [
+        /* @__PURE__ */ jsxs12("span", { "aria-live": "polite", children: [
           currentIndex + 1,
           " of ",
           component.locations.length
@@ -7457,12 +7778,12 @@ function MapDetails({
   ] }) });
 }
 function MapView({ className, component, onSelect }) {
-  const [selectedLocationId, setSelectedLocationId] = useState6(
+  const [selectedLocationId, setSelectedLocationId] = useState7(
     () => getInitialMapLocationId(component)
   );
-  const [detailsOpen, setDetailsOpen] = useState6(false);
-  const [detailDirection, setDetailDirection] = useState6(1);
-  const [portalContainer, setPortalContainer] = useState6();
+  const [detailsOpen, setDetailsOpen] = useState7(false);
+  const [detailDirection, setDetailDirection] = useState7(1);
+  const [portalContainer, setPortalContainer] = useState7();
   const detailHeadingId = useId3();
   const resultRefs = useRef2(/* @__PURE__ */ new Map());
   const scrollTimerRef = useRef2(void 0);
@@ -7586,7 +7907,7 @@ function MapView({ className, component, onSelect }) {
     },
     [activeIndex, component.locations, selectLocation]
   );
-  const title2 = /* @__PURE__ */ jsxs11("span", { className: "aui-map__card-title", children: [
+  const title2 = /* @__PURE__ */ jsxs12("span", { className: "aui-map__card-title", children: [
     /* @__PURE__ */ jsx19(MapPin2, { "aria-hidden": "true" }),
     /* @__PURE__ */ jsx19("span", { children: component.title })
   ] });
@@ -7596,7 +7917,7 @@ function MapView({ className, component, onSelect }) {
       className: mergeClassNames("aui-map-card", className),
       description: component.description,
       title: title2,
-      children: /* @__PURE__ */ jsxs11("div", { ref: componentRef, className: "aui-map", "data-slot": "agent-ui-map", children: [
+      children: /* @__PURE__ */ jsxs12("div", { ref: componentRef, className: "aui-map", "data-slot": "agent-ui-map", children: [
         /* @__PURE__ */ jsx19(
           MapSurface,
           {
@@ -7618,7 +7939,7 @@ function MapView({ className, component, onSelect }) {
             onOpen: () => selectLocation(location, { openDetails: true, scroll: false })
           }
         ) }, location.id)) }) }),
-        /* @__PURE__ */ jsxs11("span", { "aria-live": "polite", className: "aui-map__live-region", children: [
+        /* @__PURE__ */ jsxs12("span", { "aria-live": "polite", className: "aui-map__live-region", children: [
           "Result ",
           activeIndex + 1,
           " of ",
@@ -7662,11 +7983,11 @@ function MapView({ className, component, onSelect }) {
 
 // ../agent-ui/src/components/display-information/product-card/product-card.tsx
 import { Modal as Modal4 } from "@heroui/react";
-import { useCallback as useCallback4, useState as useState7 } from "react";
+import { useCallback as useCallback4, useState as useState8 } from "react";
 
 // ../agent-ui/src/components/primitives/rating-stars.tsx
 import { StarFill as StarFill2 } from "@gravity-ui/icons";
-import { jsx as jsx20, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs13 } from "react/jsx-runtime";
 var ratingFormatter2 = new Intl.NumberFormat(void 0, {
   maximumFractionDigits: 1
 });
@@ -7675,7 +7996,7 @@ function RatingStars({ className, count, value }) {
   const clamped = Math.min(Math.max(value, 0), 5);
   const label = `Rated ${ratingFormatter2.format(clamped)} out of 5${count === void 0 ? "" : `, ${countFormatter.format(count)} reviews`}`;
   const stars = Array.from({ length: 5 }, (_, index) => /* @__PURE__ */ jsx20(StarFill2, { "aria-hidden": "true" }, index));
-  return /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsxs13(
     "span",
     {
       "aria-label": label,
@@ -7683,12 +8004,12 @@ function RatingStars({ className, count, value }) {
       "data-slot": "agent-ui-rating",
       role: "img",
       children: [
-        /* @__PURE__ */ jsxs12("span", { "aria-hidden": "true", className: "aui-rating__stars", children: [
+        /* @__PURE__ */ jsxs13("span", { "aria-hidden": "true", className: "aui-rating__stars", children: [
           /* @__PURE__ */ jsx20("span", { className: "aui-rating__track", children: stars }),
           /* @__PURE__ */ jsx20("span", { className: "aui-rating__fill", style: { width: `${clamped / 5 * 100}%` }, children: /* @__PURE__ */ jsx20("span", { className: "aui-rating__track", children: stars }) })
         ] }),
         /* @__PURE__ */ jsx20("span", { "aria-hidden": "true", className: "aui-rating__value", children: ratingFormatter2.format(clamped) }),
-        count === void 0 ? null : /* @__PURE__ */ jsxs12("span", { "aria-hidden": "true", className: "aui-rating__count", children: [
+        count === void 0 ? null : /* @__PURE__ */ jsxs13("span", { "aria-hidden": "true", className: "aui-rating__count", children: [
           "(",
           countFormatter.format(count),
           ")"
@@ -7699,7 +8020,7 @@ function RatingStars({ className, count, value }) {
 }
 
 // ../agent-ui/src/components/display-information/product-card/product-card.tsx
-import { jsx as jsx21, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs14 } from "react/jsx-runtime";
 var priceFormatters = /* @__PURE__ */ new Map();
 function formatPrice(price) {
   const currency2 = price.currency ?? "USD";
@@ -7740,8 +8061,8 @@ function ProductTile({
   onSelect,
   product
 }) {
-  const [portalContainer, setPortalContainer] = useState7();
-  const [imageFailed, setImageFailed] = useState7(false);
+  const [portalContainer, setPortalContainer] = useState8();
+  const [imageFailed, setImageFailed] = useState8(false);
   const mediaRef = useCallback4((node) => {
     setPortalContainer(resolveOverlayPortalContainer(node));
   }, []);
@@ -7754,12 +8075,12 @@ function ProductTile({
       children: product.badge.label
     }
   ) : null;
-  return /* @__PURE__ */ jsxs13("article", { className: "aui-product", "data-layout": layout, "data-slot": "agent-ui-product", children: [
-    imageFailed ? /* @__PURE__ */ jsxs13("span", { className: "aui-product__media", "data-slot": "agent-ui-product-media", children: [
+  return /* @__PURE__ */ jsxs14("article", { className: "aui-product", "data-layout": layout, "data-slot": "agent-ui-product", children: [
+    imageFailed ? /* @__PURE__ */ jsxs14("span", { className: "aui-product__media", "data-slot": "agent-ui-product-media", children: [
       /* @__PURE__ */ jsx21(FallbackImage, { alt: product.image.alt, className: "aui-product__image", src: void 0 }),
       badge
-    ] }) : /* @__PURE__ */ jsxs13(Modal4, { children: [
-      /* @__PURE__ */ jsxs13(
+    ] }) : /* @__PURE__ */ jsxs14(Modal4, { children: [
+      /* @__PURE__ */ jsxs14(
         Modal4.Trigger,
         {
           ref: mediaRef,
@@ -7787,7 +8108,7 @@ function ProductTile({
           className: "aui-image-modal__backdrop",
           UNSTABLE_portalContainer: portalContainer,
           variant: "blur",
-          children: /* @__PURE__ */ jsx21(Modal4.Container, { className: "aui-image-modal__container", placement: "center", children: /* @__PURE__ */ jsxs13(
+          children: /* @__PURE__ */ jsx21(Modal4.Container, { className: "aui-image-modal__container", placement: "center", children: /* @__PURE__ */ jsxs14(
             Modal4.Dialog,
             {
               "aria-label": product.image.alt,
@@ -7809,7 +8130,7 @@ function ProductTile({
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs13("span", { className: "aui-product__header", children: [
+    /* @__PURE__ */ jsxs14("span", { className: "aui-product__header", children: [
       product.meta ? /* @__PURE__ */ jsx21("span", { className: "aui-product__meta", children: product.meta }) : null,
       /* @__PURE__ */ jsx21("span", { className: "aui-product__price", "data-slot": "agent-ui-product-price", children: formatPrice(product.price) })
     ] }),
@@ -7879,12 +8200,12 @@ function ProductCardView({ className, component, onAction, onSelect }) {
 
 // ../agent-ui/src/components/display-information/record-card/record-card.tsx
 import { Modal as Modal5 } from "@heroui/react";
-import { useCallback as useCallback5, useState as useState8 } from "react";
-import { Fragment as Fragment4, jsx as jsx22, jsxs as jsxs14 } from "react/jsx-runtime";
+import { useCallback as useCallback5, useState as useState9 } from "react";
+import { Fragment as Fragment5, jsx as jsx22, jsxs as jsxs15 } from "react/jsx-runtime";
 function RecordCardView({ className, component, onAction, onSelect }) {
   const layout = component.layout ?? "details";
-  const [portalContainer, setPortalContainer] = useState8();
-  const [mediaFailed, setMediaFailed] = useState8(false);
+  const [portalContainer, setPortalContainer] = useState9();
+  const [mediaFailed, setMediaFailed] = useState9(false);
   const mediaRef = useCallback5((node) => {
     setPortalContainer(resolveOverlayPortalContainer(node));
   }, []);
@@ -7922,7 +8243,7 @@ function RecordCardView({ className, component, onAction, onSelect }) {
       footer,
       title: component.title,
       variant: component.variant,
-      children: /* @__PURE__ */ jsxs14(WidgetCol, { className: "aui-record", gap: layout === "compact" ? 3 : 4, children: [
+      children: /* @__PURE__ */ jsxs15(WidgetCol, { className: "aui-record", gap: layout === "compact" ? 3 : 4, children: [
         layout === "media" && component.image && mediaFailed ? /* @__PURE__ */ jsx22(
           WidgetImage,
           {
@@ -7933,7 +8254,7 @@ function RecordCardView({ className, component, onAction, onSelect }) {
             width: "100%"
           }
         ) : null,
-        layout === "media" && component.image && !mediaFailed ? /* @__PURE__ */ jsxs14(Modal5, { children: [
+        layout === "media" && component.image && !mediaFailed ? /* @__PURE__ */ jsxs15(Modal5, { children: [
           /* @__PURE__ */ jsx22(
             Modal5.Trigger,
             {
@@ -7961,7 +8282,7 @@ function RecordCardView({ className, component, onAction, onSelect }) {
               className: "aui-image-modal__backdrop",
               UNSTABLE_portalContainer: portalContainer,
               variant: "blur",
-              children: /* @__PURE__ */ jsx22(Modal5.Container, { className: "aui-image-modal__container", placement: "center", children: /* @__PURE__ */ jsxs14(
+              children: /* @__PURE__ */ jsx22(Modal5.Container, { className: "aui-image-modal__container", placement: "center", children: /* @__PURE__ */ jsxs15(
                 Modal5.Dialog,
                 {
                   "aria-label": component.image.alt,
@@ -7983,7 +8304,7 @@ function RecordCardView({ className, component, onAction, onSelect }) {
             }
           )
         ] }) : null,
-        component.image && layout !== "media" || component.eyebrow || status && layout !== "compact" ? /* @__PURE__ */ jsxs14(WidgetRow, { align: "center", gap: 3, children: [
+        component.image && layout !== "media" || component.eyebrow || status && layout !== "compact" ? /* @__PURE__ */ jsxs15(WidgetRow, { align: "center", gap: 3, children: [
           component.image && layout !== "media" ? /* @__PURE__ */ jsx22(
             WidgetImage,
             {
@@ -7995,13 +8316,13 @@ function RecordCardView({ className, component, onAction, onSelect }) {
             }
           ) : null,
           component.eyebrow ? /* @__PURE__ */ jsx22(WidgetCaption, { className: "aui-record__eyebrow", value: component.eyebrow }) : null,
-          status && layout !== "compact" ? /* @__PURE__ */ jsxs14(Fragment4, { children: [
+          status && layout !== "compact" ? /* @__PURE__ */ jsxs15(Fragment5, { children: [
             /* @__PURE__ */ jsx22(WidgetSpacer, {}),
             status
           ] }) : null
         ] }) : null,
-        component.fields.length > 0 ? /* @__PURE__ */ jsx22("dl", { className: "aui-record__fields", "data-slot": "agent-ui-record-fields", children: component.fields.map((field) => /* @__PURE__ */ jsxs14("div", { "data-slot": "agent-ui-record-field", children: [
-          /* @__PURE__ */ jsxs14("dt", { children: [
+        component.fields.length > 0 ? /* @__PURE__ */ jsx22("dl", { className: "aui-record__fields", "data-slot": "agent-ui-record-fields", children: component.fields.map((field) => /* @__PURE__ */ jsxs15("div", { "data-slot": "agent-ui-record-field", children: [
+          /* @__PURE__ */ jsxs15("dt", { children: [
             field.icon ? /* @__PURE__ */ jsx22(AgentIcon, { "data-slot": "agent-ui-record-field-icon", name: field.icon }) : null,
             field.label
           ] }),
@@ -8081,9 +8402,9 @@ function InitialAvatar({ name, src }) {
 }
 
 // ../agent-ui/src/components/display-information/response-compositions/commerce-views.tsx
-import { jsx as jsx24, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs16 } from "react/jsx-runtime";
 function SummaryRow({ emphasis, label, value }) {
-  return /* @__PURE__ */ jsxs15(Widget.Row, { children: [
+  return /* @__PURE__ */ jsxs16(Widget.Row, { children: [
     /* @__PURE__ */ jsx24(Widget.Text, { value: label, weight: emphasis ? "semibold" : "normal" }),
     /* @__PURE__ */ jsx24(Widget.Spacer, {}),
     /* @__PURE__ */ jsx24(Widget.Text, { value, weight: emphasis ? "semibold" : "normal" })
@@ -8095,16 +8416,16 @@ function PurchaseItemsView({
   onAction,
   onSelect
 }) {
-  return /* @__PURE__ */ jsxs15(
+  return /* @__PURE__ */ jsxs16(
     Widget.Card,
     {
       className: mergeClassNames("aui-composition-card aui-purchase-items", className),
       "data-component-kind": component.kind,
       size: "sm",
       children: [
-        /* @__PURE__ */ jsx24(Widget.Col, { gap: 3, children: component.items.map((item) => /* @__PURE__ */ jsxs15(Widget.Row, { align: "center", gap: 3, children: [
+        /* @__PURE__ */ jsx24(Widget.Col, { gap: 3, children: component.items.map((item) => /* @__PURE__ */ jsxs16(Widget.Row, { align: "center", gap: 3, children: [
           item.image ? /* @__PURE__ */ jsx24(Widget.Image, { alt: item.image.alt, radius: "xl", size: 48, src: item.image.src }) : null,
-          /* @__PURE__ */ jsxs15(Widget.Col, { flex: 1, gap: 0, children: [
+          /* @__PURE__ */ jsxs16(Widget.Col, { flex: 1, gap: 0, children: [
             /* @__PURE__ */ jsx24(Widget.Text, { value: item.name, weight: "semibold" }),
             item.description ? /* @__PURE__ */ jsx24(Widget.Caption, { value: item.description }) : null
           ] }),
@@ -8141,19 +8462,19 @@ function PurchaseCompleteView({
   onAction,
   onSelect
 }) {
-  return /* @__PURE__ */ jsxs15(
+  return /* @__PURE__ */ jsxs16(
     Widget.Card,
     {
       className: mergeClassNames("aui-composition-card aui-purchase-complete", className),
       "data-component-kind": component.kind,
       size: "sm",
       children: [
-        /* @__PURE__ */ jsxs15(Widget.Row, { align: "center", gap: 2, children: [
+        /* @__PURE__ */ jsxs16(Widget.Row, { align: "center", gap: 2, children: [
           /* @__PURE__ */ jsx24("span", { "aria-hidden": "true", className: "aui-purchase-complete__check", children: "\u2713" }),
           /* @__PURE__ */ jsx24(Widget.Text, { color: "success", value: component.title, weight: "medium" })
         ] }),
         /* @__PURE__ */ jsx24(Widget.Divider, { flush: true }),
-        /* @__PURE__ */ jsxs15(Widget.Row, { gap: 3, children: [
+        /* @__PURE__ */ jsxs16(Widget.Row, { gap: 3, children: [
           component.product.image ? /* @__PURE__ */ jsx24(
             Widget.Image,
             {
@@ -8164,12 +8485,12 @@ function PurchaseCompleteView({
               src: component.product.image.src
             }
           ) : null,
-          /* @__PURE__ */ jsxs15(Widget.Col, { gap: 1, children: [
+          /* @__PURE__ */ jsxs16(Widget.Col, { gap: 1, children: [
             /* @__PURE__ */ jsx24(Widget.Title, { value: component.product.name }),
             component.product.description ? /* @__PURE__ */ jsx24(Widget.Caption, { value: component.product.description }) : null
           ] })
         ] }),
-        /* @__PURE__ */ jsxs15(Widget.Col, { gap: 2, children: [
+        /* @__PURE__ */ jsxs16(Widget.Col, { gap: 2, children: [
           component.details.map((detail) => /* @__PURE__ */ jsx24(SummaryRow, { label: detail.label, value: detail.value }, detail.label)),
           component.paid ? /* @__PURE__ */ jsx24(
             SummaryRow,
@@ -8195,26 +8516,26 @@ function PurchaseCompleteView({
 }
 
 // ../agent-ui/src/components/display-information/response-compositions/event-views.tsx
-import { jsx as jsx25, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs17 } from "react/jsx-runtime";
 function CreateEventView({
   className,
   component,
   onAction,
   onSelect
 }) {
-  return /* @__PURE__ */ jsxs16(
+  return /* @__PURE__ */ jsxs17(
     Widget.Card,
     {
       className: mergeClassNames("aui-composition-card aui-create-event", className),
       "data-component-kind": component.kind,
       size: "md",
       children: [
-        /* @__PURE__ */ jsxs16(Widget.Row, { align: "start", gap: 4, children: [
-          /* @__PURE__ */ jsxs16(Widget.Col, { align: "center", gap: 0, width: 64, children: [
+        /* @__PURE__ */ jsxs17(Widget.Row, { align: "start", gap: 4, children: [
+          /* @__PURE__ */ jsxs17(Widget.Col, { align: "center", gap: 0, width: 64, children: [
             /* @__PURE__ */ jsx25(Widget.Caption, { value: component.date.weekday }),
             /* @__PURE__ */ jsx25(Widget.Title, { size: "3xl", value: component.date.day, weight: "normal" })
           ] }),
-          /* @__PURE__ */ jsx25(Widget.Col, { flex: 1, gap: 2, children: component.events.map((event) => /* @__PURE__ */ jsxs16(
+          /* @__PURE__ */ jsx25(Widget.Col, { flex: 1, gap: 2, children: component.events.map((event) => /* @__PURE__ */ jsxs17(
             Widget.Row,
             {
               align: "center",
@@ -8226,7 +8547,7 @@ function CreateEventView({
               radius: "xl",
               children: [
                 /* @__PURE__ */ jsx25("span", { className: "aui-create-event__marker" }),
-                /* @__PURE__ */ jsxs16(Widget.Col, { gap: 0, children: [
+                /* @__PURE__ */ jsxs17(Widget.Col, { gap: 0, children: [
                   /* @__PURE__ */ jsx25(Widget.Text, { value: event.title, weight: "semibold" }),
                   /* @__PURE__ */ jsx25(Widget.Caption, { value: event.time })
                 ] })
@@ -8256,10 +8577,10 @@ function ViewEventView({ className, component }) {
       className: mergeClassNames("aui-composition-card aui-view-event", className),
       "data-component-kind": component.kind,
       size: "sm",
-      children: /* @__PURE__ */ jsxs16(Widget.Row, { align: "stretch", gap: 3, children: [
+      children: /* @__PURE__ */ jsxs17(Widget.Row, { align: "stretch", gap: 3, children: [
         /* @__PURE__ */ jsx25("span", { className: "aui-view-event__marker", "data-tone": component.tone ?? "accent" }),
-        /* @__PURE__ */ jsxs16(Widget.Col, { flex: 1, gap: 1, children: [
-          /* @__PURE__ */ jsxs16(Widget.Row, { children: [
+        /* @__PURE__ */ jsxs17(Widget.Col, { flex: 1, gap: 1, children: [
+          /* @__PURE__ */ jsxs17(Widget.Row, { children: [
             /* @__PURE__ */ jsx25(Widget.Caption, { value: component.date }),
             /* @__PURE__ */ jsx25(Widget.Spacer, {}),
             /* @__PURE__ */ jsx25(Widget.Text, { color: "accent", size: "sm", value: component.time })
@@ -8276,22 +8597,22 @@ function EventSessionView({
   onAction,
   onSelect
 }) {
-  return /* @__PURE__ */ jsxs16(
+  return /* @__PURE__ */ jsxs17(
     Widget.Card,
     {
       className: mergeClassNames("aui-composition-card aui-event-session", className),
       "data-component-kind": component.kind,
       size: "md",
       children: [
-        /* @__PURE__ */ jsxs16(Widget.Col, { gap: 1, children: [
+        /* @__PURE__ */ jsxs17(Widget.Col, { gap: 1, children: [
           component.eyebrow ? /* @__PURE__ */ jsx25(Widget.Caption, { color: "warning", value: component.eyebrow }) : null,
           /* @__PURE__ */ jsx25(Widget.Title, { value: component.title }),
           component.description ? /* @__PURE__ */ jsx25(Widget.Caption, { value: component.description }) : null
         ] }),
         /* @__PURE__ */ jsx25(Widget.Divider, { flush: true }),
-        /* @__PURE__ */ jsxs16(Widget.Row, { align: "center", gap: 3, children: [
+        /* @__PURE__ */ jsxs17(Widget.Row, { align: "center", gap: 3, children: [
           /* @__PURE__ */ jsx25("span", { "aria-hidden": "true", className: "aui-event-session__pin", children: "\u25CF" }),
-          /* @__PURE__ */ jsxs16(Widget.Col, { gap: 0, children: [
+          /* @__PURE__ */ jsxs17(Widget.Col, { gap: 0, children: [
             /* @__PURE__ */ jsx25(Widget.Text, { value: component.location, weight: "semibold" }),
             /* @__PURE__ */ jsx25(Widget.Caption, { value: component.time })
           ] }),
@@ -8306,9 +8627,9 @@ function EventSessionView({
             }
           ) : null
         ] }),
-        component.speakers.map((speaker) => /* @__PURE__ */ jsxs16(Widget.Row, { align: "center", gap: 3, children: [
+        component.speakers.map((speaker) => /* @__PURE__ */ jsxs17(Widget.Row, { align: "center", gap: 3, children: [
           /* @__PURE__ */ jsx25(InitialAvatar, { name: speaker.name, src: speaker.image?.src }),
-          /* @__PURE__ */ jsxs16(Widget.Col, { gap: 0, children: [
+          /* @__PURE__ */ jsxs17(Widget.Col, { gap: 0, children: [
             /* @__PURE__ */ jsx25(Widget.Text, { value: speaker.name, weight: "semibold" }),
             /* @__PURE__ */ jsx25(Widget.Caption, { value: speaker.role })
           ] })
@@ -8319,14 +8640,14 @@ function EventSessionView({
 }
 
 // ../agent-ui/src/components/display-information/response-compositions/media-views.tsx
-import { jsx as jsx26, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs18 } from "react/jsx-runtime";
 function PlaylistView({
   className,
   component,
   onAction,
   onSelect
 }) {
-  return /* @__PURE__ */ jsxs17(
+  return /* @__PURE__ */ jsxs18(
     Widget.Card,
     {
       className: mergeClassNames("aui-composition-card aui-playlist", className),
@@ -8343,10 +8664,10 @@ function PlaylistView({
             width: "100%"
           }
         ) : null,
-        /* @__PURE__ */ jsx26(Widget.Col, { gap: 3, children: component.tracks.map((track, index) => /* @__PURE__ */ jsxs17(Widget.Row, { align: "center", gap: 3, children: [
+        /* @__PURE__ */ jsx26(Widget.Col, { gap: 3, children: component.tracks.map((track, index) => /* @__PURE__ */ jsxs18(Widget.Row, { align: "center", gap: 3, children: [
           /* @__PURE__ */ jsx26(Widget.Caption, { value: index + 1 }),
           track.image ? /* @__PURE__ */ jsx26(Widget.Image, { alt: track.image.alt, radius: "xl", size: 44, src: track.image.src }) : null,
-          /* @__PURE__ */ jsxs17(Widget.Col, { flex: 1, gap: 0, children: [
+          /* @__PURE__ */ jsxs18(Widget.Col, { flex: 1, gap: 0, children: [
             /* @__PURE__ */ jsx26(Widget.Text, { value: track.title, weight: "semibold" }),
             /* @__PURE__ */ jsx26(Widget.Caption, { value: track.artist })
           ] }),
@@ -8378,22 +8699,22 @@ function ChannelMessageView({
   className,
   component
 }) {
-  return /* @__PURE__ */ jsxs17(
+  return /* @__PURE__ */ jsxs18(
     Widget.Card,
     {
       className: mergeClassNames("aui-composition-card aui-channel-message", className),
       "data-component-kind": component.kind,
       size: "md",
       children: [
-        /* @__PURE__ */ jsxs17(Widget.Row, { children: [
+        /* @__PURE__ */ jsxs18(Widget.Row, { children: [
           /* @__PURE__ */ jsx26(Widget.Text, { value: component.channel, weight: "medium" }),
           /* @__PURE__ */ jsx26(Widget.Spacer, {}),
           /* @__PURE__ */ jsx26(Widget.Caption, { value: component.timestamp })
         ] }),
         /* @__PURE__ */ jsx26(Widget.Divider, { flush: true }),
-        /* @__PURE__ */ jsxs17(Widget.Row, { align: "start", gap: 4, children: [
+        /* @__PURE__ */ jsxs18(Widget.Row, { align: "start", gap: 4, children: [
           /* @__PURE__ */ jsx26(InitialAvatar, { name: component.author.name, src: component.author.image?.src }),
-          /* @__PURE__ */ jsxs17(Widget.Col, { flex: 1, gap: 2, children: [
+          /* @__PURE__ */ jsxs18(Widget.Col, { flex: 1, gap: 2, children: [
             /* @__PURE__ */ jsx26(Widget.Text, { value: component.author.name, weight: "semibold" }),
             /* @__PURE__ */ jsx26("p", { className: "aui-channel-message__content", children: component.content }),
             component.attachments?.length ? /* @__PURE__ */ jsx26(Widget.Row, { className: "aui-channel-message__attachments", gap: 2, children: component.attachments.map(
@@ -8426,7 +8747,7 @@ function ChannelMessageView({
   );
 }
 function PlayerCardView({ className, component }) {
-  return /* @__PURE__ */ jsxs17(
+  return /* @__PURE__ */ jsxs18(
     Widget.Card,
     {
       className: mergeClassNames("aui-composition-card aui-player-card", className),
@@ -8443,9 +8764,9 @@ function PlayerCardView({ className, component }) {
             src: component.backgroundImage.src
           }
         ) : null,
-        /* @__PURE__ */ jsxs17(Widget.Row, { align: "center", className: "aui-player-card__content", children: [
+        /* @__PURE__ */ jsxs18(Widget.Row, { align: "center", className: "aui-player-card__content", children: [
           /* @__PURE__ */ jsx26(Widget.Box, { minHeight: 160, width: "40%" }),
-          /* @__PURE__ */ jsxs17(Widget.Col, { flex: "auto", gap: 3, children: [
+          /* @__PURE__ */ jsxs18(Widget.Col, { flex: "auto", gap: 3, children: [
             /* @__PURE__ */ jsx26(
               Widget.Title,
               {
@@ -8455,7 +8776,7 @@ function PlayerCardView({ className, component }) {
                 weight: "normal"
               }
             ),
-            /* @__PURE__ */ jsx26(Widget.Row, { className: "aui-player-card__stats", children: component.stats.map((stat) => /* @__PURE__ */ jsxs17(Widget.Col, { flex: 1, gap: 0, children: [
+            /* @__PURE__ */ jsx26(Widget.Row, { className: "aui-player-card__stats", children: component.stats.map((stat) => /* @__PURE__ */ jsxs18(Widget.Col, { flex: 1, gap: 0, children: [
               /* @__PURE__ */ jsx26(Widget.Text, { value: stat.value, weight: "semibold" }),
               /* @__PURE__ */ jsx26(Widget.Caption, { color: "white", value: stat.label })
             ] }, stat.label)) })
@@ -8467,21 +8788,21 @@ function PlayerCardView({ className, component }) {
 }
 
 // ../agent-ui/src/components/display-information/response-compositions/notification-view.tsx
-import { jsx as jsx27, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs19 } from "react/jsx-runtime";
 function EnableNotificationView({
   className,
   component,
   onAction,
   onSelect
 }) {
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs19(
     Widget.Card,
     {
       className: mergeClassNames("aui-composition-card aui-enable-notification", className),
       "data-component-kind": component.kind,
       size: "sm",
       children: [
-        /* @__PURE__ */ jsxs18(Widget.Col, { align: "center", gap: 3, padding: 3, children: [
+        /* @__PURE__ */ jsxs19(Widget.Col, { align: "center", gap: 3, padding: 3, children: [
           /* @__PURE__ */ jsx27("span", { "aria-hidden": "true", className: "aui-enable-notification__icon", children: "\u2713" }),
           /* @__PURE__ */ jsx27(Widget.Title, { align: "center", value: component.title }),
           component.description ? /* @__PURE__ */ jsx27(Widget.Caption, { value: component.description }) : null
@@ -8503,7 +8824,7 @@ function EnableNotificationView({
 
 // ../agent-ui/src/components/display-information/response-compositions/product-signals-view.tsx
 import { Tabs as Tabs2 } from "@heroui/react";
-import { jsx as jsx28, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx28, jsxs as jsxs20 } from "react/jsx-runtime";
 function ProductSignalsView({
   className,
   component,
@@ -8516,13 +8837,13 @@ function ProductSignalsView({
       "data-component-kind": component.kind,
       description: component.description,
       title: component.title,
-      children: /* @__PURE__ */ jsxs19(
+      children: /* @__PURE__ */ jsxs20(
         Tabs2,
         {
           defaultSelectedKey: component.defaultValue ?? component.tabs[0]?.id,
           variant: "secondary",
           children: [
-            /* @__PURE__ */ jsx28(Tabs2.ListContainer, { children: /* @__PURE__ */ jsx28(Tabs2.List, { "aria-label": `${component.title} views`, children: component.tabs.map((tab) => /* @__PURE__ */ jsxs19(Tabs2.Tab, { id: tab.id, children: [
+            /* @__PURE__ */ jsx28(Tabs2.ListContainer, { children: /* @__PURE__ */ jsx28(Tabs2.List, { "aria-label": `${component.title} views`, children: component.tabs.map((tab) => /* @__PURE__ */ jsxs20(Tabs2.Tab, { id: tab.id, children: [
               tab.label,
               /* @__PURE__ */ jsx28(Tabs2.Indicator, {})
             ] }, tab.id)) }) }),
@@ -8535,12 +8856,12 @@ function ProductSignalsView({
 }
 
 // ../agent-ui/src/components/display-information/response-compositions/transport-views.tsx
-import { jsx as jsx29, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx29, jsxs as jsxs21 } from "react/jsx-runtime";
 function FlightTrackerView({
   className,
   component
 }) {
-  return /* @__PURE__ */ jsxs20(
+  return /* @__PURE__ */ jsxs21(
     Widget.Card,
     {
       className: mergeClassNames("aui-composition-card aui-flight-tracker", className),
@@ -8548,7 +8869,7 @@ function FlightTrackerView({
       size: "md",
       theme: "dark",
       children: [
-        /* @__PURE__ */ jsxs20(Widget.Row, { align: "center", gap: 2, children: [
+        /* @__PURE__ */ jsxs21(Widget.Row, { align: "center", gap: 2, children: [
           component.airline.logo ? /* @__PURE__ */ jsx29(
             Widget.Box,
             {
@@ -8574,8 +8895,8 @@ function FlightTrackerView({
           /* @__PURE__ */ jsx29(Widget.Caption, { color: "white", value: component.date })
         ] }),
         /* @__PURE__ */ jsx29(Widget.Divider, { flush: true }),
-        /* @__PURE__ */ jsxs20(Widget.Col, { gap: 3, children: [
-          /* @__PURE__ */ jsxs20(Widget.Row, { align: "center", children: [
+        /* @__PURE__ */ jsxs21(Widget.Col, { gap: 3, children: [
+          /* @__PURE__ */ jsxs21(Widget.Row, { align: "center", children: [
             /* @__PURE__ */ jsx29(Widget.Text, { size: "lg", value: component.origin.label }),
             /* @__PURE__ */ jsx29(Widget.Spacer, {}),
             /* @__PURE__ */ jsx29(Widget.Text, { size: "lg", value: component.destination.label })
@@ -8592,13 +8913,13 @@ function FlightTrackerView({
               children: /* @__PURE__ */ jsx29("span", { style: { width: `${component.progress ?? 0}%` } })
             }
           ),
-          /* @__PURE__ */ jsxs20(Widget.Row, { align: "center", children: [
-            /* @__PURE__ */ jsxs20(Widget.Col, { gap: 0, children: [
+          /* @__PURE__ */ jsxs21(Widget.Row, { align: "center", children: [
+            /* @__PURE__ */ jsxs21(Widget.Col, { gap: 0, children: [
               /* @__PURE__ */ jsx29(Widget.Text, { value: component.origin.time }),
               component.origin.status ? /* @__PURE__ */ jsx29(Widget.Caption, { color: "white", value: component.origin.status }) : null
             ] }),
             /* @__PURE__ */ jsx29(Widget.Spacer, {}),
-            /* @__PURE__ */ jsxs20(Widget.Col, { align: "end", gap: 0, children: [
+            /* @__PURE__ */ jsxs21(Widget.Col, { align: "end", gap: 0, children: [
               /* @__PURE__ */ jsx29(Widget.Text, { value: component.destination.time }),
               component.destination.status ? /* @__PURE__ */ jsx29(Widget.Caption, { color: "white", value: component.destination.status }) : null
             ] })
@@ -8609,7 +8930,7 @@ function FlightTrackerView({
   );
 }
 function RideStatusView({ className, component }) {
-  return /* @__PURE__ */ jsxs20(
+  return /* @__PURE__ */ jsxs21(
     Widget.Card,
     {
       className: mergeClassNames("aui-composition-card aui-ride-status", className),
@@ -8617,13 +8938,13 @@ function RideStatusView({ className, component }) {
       size: "sm",
       children: [
         /* @__PURE__ */ jsx29(Widget.Title, { size: "xl", value: component.eta }),
-        /* @__PURE__ */ jsxs20(Widget.Row, { align: "center", gap: 3, children: [
-          /* @__PURE__ */ jsxs20(Widget.Col, { gap: 0, children: [
+        /* @__PURE__ */ jsxs21(Widget.Row, { align: "center", gap: 3, children: [
+          /* @__PURE__ */ jsxs21(Widget.Col, { gap: 0, children: [
             /* @__PURE__ */ jsx29(Widget.Caption, { value: "Pick up" }),
             /* @__PURE__ */ jsx29(Widget.Text, { truncate: true, value: component.pickup })
           ] }),
           /* @__PURE__ */ jsx29(Widget.Spacer, {}),
-          /* @__PURE__ */ jsxs20(Widget.Col, { align: "end", gap: 0, children: [
+          /* @__PURE__ */ jsxs21(Widget.Col, { align: "end", gap: 0, children: [
             /* @__PURE__ */ jsx29(Widget.Caption, { value: "Driver" }),
             /* @__PURE__ */ jsx29(Widget.Text, { value: component.driver.name })
           ] }),
@@ -8635,8 +8956,8 @@ function RideStatusView({ className, component }) {
 }
 
 // ../agent-ui/src/components/display-information/response-compositions/weather-views.tsx
-import { useState as useState9 } from "react";
-import { Fragment as Fragment5, jsx as jsx30, jsxs as jsxs21 } from "react/jsx-runtime";
+import { useState as useState10 } from "react";
+import { Fragment as Fragment6, jsx as jsx30, jsxs as jsxs22 } from "react/jsx-runtime";
 function Cloud() {
   return /* @__PURE__ */ jsx30(
     "path",
@@ -8648,7 +8969,7 @@ function Cloud() {
   );
 }
 function Sun({ small = false }) {
-  return /* @__PURE__ */ jsxs21("g", { transform: small ? "translate(-5 -5) scale(.72)" : void 0, children: [
+  return /* @__PURE__ */ jsxs22("g", { transform: small ? "translate(-5 -5) scale(.72)" : void 0, children: [
     /* @__PURE__ */ jsx30("circle", { cx: "24", cy: "20", fill: "currentColor", r: "7" }),
     /* @__PURE__ */ jsx30(
       "path",
@@ -8665,19 +8986,19 @@ function Sun({ small = false }) {
 var weatherContent = {
   clear: /* @__PURE__ */ jsx30(Sun, {}),
   cloudy: /* @__PURE__ */ jsx30(Cloud, {}),
-  drizzle: /* @__PURE__ */ jsxs21(Fragment5, { children: [
+  drizzle: /* @__PURE__ */ jsxs22(Fragment6, { children: [
     /* @__PURE__ */ jsx30(Cloud, {}),
     /* @__PURE__ */ jsx30("path", { d: "m17 30-2 4m9-4-2 4m9-4-2 4", stroke: "currentColor", strokeLinecap: "round" })
   ] }),
-  fog: /* @__PURE__ */ jsxs21(Fragment5, { children: [
+  fog: /* @__PURE__ */ jsxs22(Fragment6, { children: [
     /* @__PURE__ */ jsx30(Cloud, {}),
     /* @__PURE__ */ jsx30("path", { d: "M10 31h27M13 36h21", stroke: "currentColor", strokeLinecap: "round", strokeWidth: "2" })
   ] }),
-  "partly-cloudy": /* @__PURE__ */ jsxs21(Fragment5, { children: [
+  "partly-cloudy": /* @__PURE__ */ jsxs22(Fragment6, { children: [
     /* @__PURE__ */ jsx30(Sun, { small: true }),
     /* @__PURE__ */ jsx30(Cloud, {})
   ] }),
-  rain: /* @__PURE__ */ jsxs21(Fragment5, { children: [
+  rain: /* @__PURE__ */ jsxs22(Fragment6, { children: [
     /* @__PURE__ */ jsx30(Cloud, {}),
     /* @__PURE__ */ jsx30(
       "path",
@@ -8689,7 +9010,7 @@ var weatherContent = {
       }
     )
   ] }),
-  snow: /* @__PURE__ */ jsxs21(Fragment5, { children: [
+  snow: /* @__PURE__ */ jsxs22(Fragment6, { children: [
     /* @__PURE__ */ jsx30(Cloud, {}),
     /* @__PURE__ */ jsx30(
       "path",
@@ -8701,11 +9022,11 @@ var weatherContent = {
       }
     )
   ] }),
-  thunderstorm: /* @__PURE__ */ jsxs21(Fragment5, { children: [
+  thunderstorm: /* @__PURE__ */ jsxs22(Fragment6, { children: [
     /* @__PURE__ */ jsx30(Cloud, {}),
     /* @__PURE__ */ jsx30("path", { d: "m25 28-5 8h5l-2 6 8-10h-5l3-4Z", fill: "currentColor" })
   ] }),
-  unknown: /* @__PURE__ */ jsxs21(Fragment5, { children: [
+  unknown: /* @__PURE__ */ jsxs22(Fragment6, { children: [
     /* @__PURE__ */ jsx30("circle", { cx: "24", cy: "24", fill: "none", r: "15", stroke: "currentColor", strokeWidth: "2" }),
     /* @__PURE__ */ jsx30(
       "path",
@@ -8741,7 +9062,7 @@ var weatherArtwork = {
 };
 function WeatherIcon({ condition, size: size2 = 48 }) {
   const source = weatherArtwork[condition];
-  const [failedSource, setFailedSource] = useState9();
+  const [failedSource, setFailedSource] = useState10();
   const label = condition.replaceAll("-", " ");
   if (source && source !== failedSource) {
     return /* @__PURE__ */ jsx30(
@@ -8789,8 +9110,8 @@ function WeatherCurrentView({
         "aui-composition-card aui-weather-card aui-weather-current",
         className
       ),
-      children: /* @__PURE__ */ jsxs21(Widget.Col, { align: "center", gap: 4, children: [
-        /* @__PURE__ */ jsxs21(Widget.Row, { align: "center", gap: 3, children: [
+      children: /* @__PURE__ */ jsxs22(Widget.Col, { align: "center", gap: 4, children: [
+        /* @__PURE__ */ jsxs22(Widget.Row, { align: "center", gap: 3, children: [
           /* @__PURE__ */ jsx30(WeatherIcon, { condition: component.condition, size: 58 }),
           /* @__PURE__ */ jsx30(
             Widget.Title,
@@ -8804,7 +9125,7 @@ function WeatherCurrentView({
         ] }),
         /* @__PURE__ */ jsx30(Widget.Caption, { color: "white", size: "lg", value: component.location }),
         component.description ? /* @__PURE__ */ jsx30(Widget.Text, { align: "center", color: "white", value: component.description }) : null,
-        component.details?.length ? /* @__PURE__ */ jsx30(Widget.Row, { className: "aui-weather-current__details", gap: 3, children: component.details.map((detail) => /* @__PURE__ */ jsxs21(Widget.Col, { align: "center", gap: 0, children: [
+        component.details?.length ? /* @__PURE__ */ jsx30(Widget.Row, { className: "aui-weather-current__details", gap: 3, children: component.details.map((detail) => /* @__PURE__ */ jsxs22(Widget.Col, { align: "center", gap: 0, children: [
           /* @__PURE__ */ jsx30(Widget.Caption, { color: "white", value: detail.label }),
           /* @__PURE__ */ jsx30(Widget.Text, { color: "white", value: detail.value, weight: "semibold" })
         ] }, detail.label)) }) : null
@@ -8827,9 +9148,9 @@ function WeatherForecastView({
         "aui-composition-card aui-weather-card aui-weather-forecast",
         className
       ),
-      children: /* @__PURE__ */ jsxs21(Widget.Col, { align: "center", gap: 3, children: [
+      children: /* @__PURE__ */ jsxs22(Widget.Col, { align: "center", gap: 3, children: [
         /* @__PURE__ */ jsx30(WeatherIcon, { condition: component.condition, size: 60 }),
-        /* @__PURE__ */ jsxs21(Widget.Row, { align: "center", gap: 2, children: [
+        /* @__PURE__ */ jsxs22(Widget.Row, { align: "center", gap: 2, children: [
           /* @__PURE__ */ jsx30(
             Widget.Title,
             {
@@ -8851,7 +9172,7 @@ function WeatherForecastView({
         ] }),
         /* @__PURE__ */ jsx30(Widget.Caption, { color: "white", value: component.location }),
         component.description ? /* @__PURE__ */ jsx30(Widget.Text, { align: "center", color: "white", value: component.description }) : null,
-        /* @__PURE__ */ jsx30(Widget.Row, { className: "aui-weather-forecast__days", gap: 4, children: component.forecast.map((day) => /* @__PURE__ */ jsxs21(Widget.Col, { align: "center", gap: 1, children: [
+        /* @__PURE__ */ jsx30(Widget.Row, { className: "aui-weather-forecast__days", gap: 4, children: component.forecast.map((day) => /* @__PURE__ */ jsxs22(Widget.Col, { align: "center", gap: 1, children: [
           /* @__PURE__ */ jsx30(
             Widget.Caption,
             {
@@ -8899,8 +9220,8 @@ import {
   TimeField
 } from "@heroui/react";
 import { parseDate, parseTime } from "@internationalized/date";
-import { useCallback as useCallback6, useRef as useRef3, useState as useState10 } from "react";
-import { jsx as jsx31, jsxs as jsxs22 } from "react/jsx-runtime";
+import { useCallback as useCallback6, useRef as useRef3, useState as useState11 } from "react";
+import { jsx as jsx31, jsxs as jsxs23 } from "react/jsx-runtime";
 function defaultValue(field) {
   if (field.kind === "checkbox-group" || field.kind === "combobox") return field.defaultValue ?? [];
   if (field.kind === "slider") return field.defaultValue ?? field.min;
@@ -8946,16 +9267,16 @@ function toNumberFormatOptions(format) {
   return { notation: format.compact ? "compact" : "standard", style: "decimal" };
 }
 function DatePickerCalendar() {
-  return /* @__PURE__ */ jsxs22(Calendar2, { "aria-label": "Choose date", children: [
-    /* @__PURE__ */ jsxs22(Calendar2.Header, { children: [
-      /* @__PURE__ */ jsxs22(Calendar2.YearPickerTrigger, { children: [
+  return /* @__PURE__ */ jsxs23(Calendar2, { "aria-label": "Choose date", children: [
+    /* @__PURE__ */ jsxs23(Calendar2.Header, { children: [
+      /* @__PURE__ */ jsxs23(Calendar2.YearPickerTrigger, { children: [
         /* @__PURE__ */ jsx31(Calendar2.YearPickerTriggerHeading, {}),
         /* @__PURE__ */ jsx31(Calendar2.YearPickerTriggerIndicator, {})
       ] }),
       /* @__PURE__ */ jsx31(Calendar2.NavButton, { slot: "previous" }),
       /* @__PURE__ */ jsx31(Calendar2.NavButton, { slot: "next" })
     ] }),
-    /* @__PURE__ */ jsxs22(Calendar2.Grid, { children: [
+    /* @__PURE__ */ jsxs23(Calendar2.Grid, { children: [
       /* @__PURE__ */ jsx31(Calendar2.GridHeader, { children: (day) => /* @__PURE__ */ jsx31(Calendar2.HeaderCell, { children: day }) }),
       /* @__PURE__ */ jsx31(Calendar2.GridBody, { children: (date2) => /* @__PURE__ */ jsx31(Calendar2.Cell, { date: date2 }) })
     ] }),
@@ -8963,16 +9284,16 @@ function DatePickerCalendar() {
   ] });
 }
 function DateRangePickerCalendar({ label }) {
-  return /* @__PURE__ */ jsxs22(RangeCalendar, { "aria-label": label, children: [
-    /* @__PURE__ */ jsxs22(RangeCalendar.Header, { children: [
-      /* @__PURE__ */ jsxs22(RangeCalendar.YearPickerTrigger, { children: [
+  return /* @__PURE__ */ jsxs23(RangeCalendar, { "aria-label": label, children: [
+    /* @__PURE__ */ jsxs23(RangeCalendar.Header, { children: [
+      /* @__PURE__ */ jsxs23(RangeCalendar.YearPickerTrigger, { children: [
         /* @__PURE__ */ jsx31(RangeCalendar.YearPickerTriggerHeading, {}),
         /* @__PURE__ */ jsx31(RangeCalendar.YearPickerTriggerIndicator, {})
       ] }),
       /* @__PURE__ */ jsx31(RangeCalendar.NavButton, { slot: "previous" }),
       /* @__PURE__ */ jsx31(RangeCalendar.NavButton, { slot: "next" })
     ] }),
-    /* @__PURE__ */ jsxs22(RangeCalendar.Grid, { children: [
+    /* @__PURE__ */ jsxs23(RangeCalendar.Grid, { children: [
       /* @__PURE__ */ jsx31(RangeCalendar.GridHeader, { children: (day) => /* @__PURE__ */ jsx31(RangeCalendar.HeaderCell, { children: day }) }),
       /* @__PURE__ */ jsx31(RangeCalendar.GridBody, { children: (dateValue) => /* @__PURE__ */ jsx31(RangeCalendar.Cell, { date: dateValue }) })
     ] }),
@@ -8980,8 +9301,8 @@ function DateRangePickerCalendar({ label }) {
   ] });
 }
 function FormView({ className, component, onAction, onSelect }) {
-  const [values, setValues] = useState10({});
-  const [portalContainer, setPortalContainer] = useState10();
+  const [values, setValues] = useState11({});
+  const [portalContainer, setPortalContainer] = useState11();
   const formRef = useCallback6((node) => {
     setPortalContainer(resolveOverlayPortalContainer(node));
   }, []);
@@ -8990,7 +9311,7 @@ function FormView({ className, component, onAction, onSelect }) {
     setValues((current) => ({ ...current, [field.name]: value }));
   };
   const effectiveValues = () => Object.fromEntries(component.fields.map((field) => [field.name, valueFor(field)]));
-  return /* @__PURE__ */ jsx31(Card, { className, description: component.description, title: component.title, children: /* @__PURE__ */ jsxs22(
+  return /* @__PURE__ */ jsx31(Card, { className, description: component.description, title: component.title, children: /* @__PURE__ */ jsxs23(
     Form,
     {
       ref: formRef,
@@ -9065,7 +9386,7 @@ function FormControl({
       }
     );
   if (field.kind === "radio-group")
-    return /* @__PURE__ */ jsxs22(
+    return /* @__PURE__ */ jsxs23(
       RadioGroup,
       {
         isRequired: field.required,
@@ -9076,7 +9397,7 @@ function FormControl({
         children: [
           /* @__PURE__ */ jsx31(Label3, { children: field.label }),
           /* @__PURE__ */ jsx31(FieldDescription, { children: field.description }),
-          field.options.map((option2) => /* @__PURE__ */ jsx31(Radio, { value: option2.value, children: /* @__PURE__ */ jsxs22(Radio.Content, { children: [
+          field.options.map((option2) => /* @__PURE__ */ jsx31(Radio, { value: option2.value, children: /* @__PURE__ */ jsxs23(Radio.Content, { children: [
             /* @__PURE__ */ jsx31(Radio.Control, { children: /* @__PURE__ */ jsx31(Radio.Indicator, {}) }),
             option2.label
           ] }) }, option2.value))
@@ -9095,7 +9416,7 @@ function FormControl({
     );
   if (field.kind === "checkbox-group") {
     const selected = Array.isArray(value) ? value : [];
-    return /* @__PURE__ */ jsxs22(
+    return /* @__PURE__ */ jsxs23(
       CheckboxGroup,
       {
         isRequired: field.required,
@@ -9106,7 +9427,7 @@ function FormControl({
         children: [
           /* @__PURE__ */ jsx31(Label3, { children: field.label }),
           /* @__PURE__ */ jsx31(FieldDescription, { children: field.description }),
-          field.options.map((option2) => /* @__PURE__ */ jsx31(Checkbox2, { value: option2.value, children: /* @__PURE__ */ jsxs22(Checkbox2.Content, { children: [
+          field.options.map((option2) => /* @__PURE__ */ jsx31(Checkbox2, { value: option2.value, children: /* @__PURE__ */ jsxs23(Checkbox2.Content, { children: [
             /* @__PURE__ */ jsx31(Checkbox2.Control, { children: /* @__PURE__ */ jsx31(Checkbox2.Indicator, {}) }),
             option2.label
           ] }) }, option2.value))
@@ -9115,7 +9436,7 @@ function FormControl({
     );
   }
   if (field.kind === "slider")
-    return /* @__PURE__ */ jsxs22(
+    return /* @__PURE__ */ jsxs23(
       Slider,
       {
         maxValue: field.max,
@@ -9126,7 +9447,7 @@ function FormControl({
         children: [
           /* @__PURE__ */ jsx31(Label3, { children: field.label }),
           /* @__PURE__ */ jsx31(Slider.Output, {}),
-          /* @__PURE__ */ jsxs22(Slider.Track, { children: [
+          /* @__PURE__ */ jsxs23(Slider.Track, { children: [
             /* @__PURE__ */ jsx31(Slider.Fill, {}),
             /* @__PURE__ */ jsx31(Slider.Thumb, {})
           ] }),
@@ -9135,7 +9456,7 @@ function FormControl({
       }
     );
   if (field.kind === "number")
-    return /* @__PURE__ */ jsxs22(
+    return /* @__PURE__ */ jsxs23(
       NumberField,
       {
         fullWidth: true,
@@ -9150,7 +9471,7 @@ function FormControl({
         onChange: (nextValue) => onChange(nextValue ?? field.min ?? 0),
         children: [
           /* @__PURE__ */ jsx31(Label3, { children: field.label }),
-          /* @__PURE__ */ jsxs22(NumberField.Group, { children: [
+          /* @__PURE__ */ jsxs23(NumberField.Group, { children: [
             /* @__PURE__ */ jsx31(NumberField.DecrementButton, {}),
             /* @__PURE__ */ jsx31(NumberField.Input, { placeholder: field.placeholder }),
             /* @__PURE__ */ jsx31(NumberField.IncrementButton, {})
@@ -9160,7 +9481,7 @@ function FormControl({
       }
     );
   if (field.kind === "switch")
-    return /* @__PURE__ */ jsxs22(
+    return /* @__PURE__ */ jsxs23(
       Switch,
       {
         isRequired: field.required,
@@ -9168,7 +9489,7 @@ function FormControl({
         name: field.name,
         onChange,
         children: [
-          /* @__PURE__ */ jsxs22(Switch.Content, { children: [
+          /* @__PURE__ */ jsxs23(Switch.Content, { children: [
             /* @__PURE__ */ jsx31(Switch.Control, { children: /* @__PURE__ */ jsx31(Switch.Thumb, {}) }),
             field.label
           ] }),
@@ -9197,7 +9518,7 @@ function FormControl({
       }
     );
   if (field.kind === "time-field")
-    return /* @__PURE__ */ jsxs22(
+    return /* @__PURE__ */ jsxs23(
       TimeField,
       {
         hourCycle: field.hourCycle,
@@ -9214,7 +9535,7 @@ function FormControl({
         ]
       }
     );
-  return /* @__PURE__ */ jsxs22(
+  return /* @__PURE__ */ jsxs23(
     TextField,
     {
       fullWidth: true,
@@ -9241,7 +9562,7 @@ function ComboboxFormControl({
   const isMultiple = (field.selectionMode ?? "single") === "multiple";
   const labels = new Map(field.options.map((option2) => [option2.value, option2.label]));
   const available = isMultiple ? field.options.filter((option2) => !value.includes(option2.value)) : field.options;
-  const [inputValue, setInputValue] = useState10(
+  const [inputValue, setInputValue] = useState11(
     isMultiple ? "" : labels.get(value[0] ?? "") ?? ""
   );
   const select = (key2) => {
@@ -9257,8 +9578,8 @@ function ComboboxFormControl({
     setInputValue(labels.get(key2) ?? "");
     onChange([key2]);
   };
-  return /* @__PURE__ */ jsxs22("div", { className: "aui-combobox", children: [
-    /* @__PURE__ */ jsxs22(
+  return /* @__PURE__ */ jsxs23("div", { className: "aui-combobox", children: [
+    /* @__PURE__ */ jsxs23(
       ComboBox,
       {
         allowsEmptyCollection: true,
@@ -9271,11 +9592,11 @@ function ComboboxFormControl({
         onSelectionChange: (key2) => select(key2 === null ? null : String(key2)),
         children: [
           /* @__PURE__ */ jsx31(Label3, { children: field.label }),
-          /* @__PURE__ */ jsxs22(ComboBox.InputGroup, { children: [
+          /* @__PURE__ */ jsxs23(ComboBox.InputGroup, { children: [
             /* @__PURE__ */ jsx31(Input, { placeholder: field.placeholder ?? "Search options\u2026" }),
             /* @__PURE__ */ jsx31(ComboBox.Trigger, {})
           ] }),
-          /* @__PURE__ */ jsx31(ComboBox.Popover, { UNSTABLE_portalContainer: portalContainer, children: /* @__PURE__ */ jsx31(ListBox, { renderEmptyState: () => /* @__PURE__ */ jsx31("span", { className: "aui-combobox__empty", children: "No matches" }), children: available.map((option2) => /* @__PURE__ */ jsxs22(ListBox.Item, { id: option2.value, textValue: option2.label, children: [
+          /* @__PURE__ */ jsx31(ComboBox.Popover, { UNSTABLE_portalContainer: portalContainer, children: /* @__PURE__ */ jsx31(ListBox, { renderEmptyState: () => /* @__PURE__ */ jsx31("span", { className: "aui-combobox__empty", children: "No matches" }), children: available.map((option2) => /* @__PURE__ */ jsxs23(ListBox.Item, { id: option2.value, textValue: option2.label, children: [
             option2.label,
             /* @__PURE__ */ jsx31(ListBox.ItemIndicator, {})
           ] }, option2.value)) }) }),
@@ -9289,7 +9610,7 @@ function ComboboxFormControl({
         "aria-label": `${field.label} selection`,
         className: "aui-combobox__selection",
         onRemove: (keys) => onChange(value.filter((entry) => !keys.has(entry))),
-        children: /* @__PURE__ */ jsx31(TagGroup2.List, { children: value.map((entry) => /* @__PURE__ */ jsxs22(Tag3, { id: entry, textValue: labels.get(entry) ?? entry, children: [
+        children: /* @__PURE__ */ jsx31(TagGroup2.List, { children: value.map((entry) => /* @__PURE__ */ jsxs23(Tag3, { id: entry, textValue: labels.get(entry) ?? entry, children: [
           labels.get(entry) ?? entry,
           /* @__PURE__ */ jsx31(Tag3.RemoveButton, {})
         ] }, entry)) })
@@ -9304,13 +9625,13 @@ function SelectFormControl({
   portalContainer,
   value
 }) {
-  const [isOpen, setIsOpen] = useState10(false);
+  const [isOpen, setIsOpen] = useState11(false);
   const pointerOpenAt = useRef3(0);
   const handleOpenChange = (nextOpen) => {
     if (!nextOpen && Date.now() - pointerOpenAt.current < 350) return;
     setIsOpen(nextOpen);
   };
-  return /* @__PURE__ */ jsxs22(
+  return /* @__PURE__ */ jsxs23(
     Select,
     {
       fullWidth: true,
@@ -9327,7 +9648,7 @@ function SelectFormControl({
       },
       children: [
         /* @__PURE__ */ jsx31(Label3, { children: field.label }),
-        /* @__PURE__ */ jsxs22(
+        /* @__PURE__ */ jsxs23(
           Select.Trigger,
           {
             onPointerDown: () => {
@@ -9339,7 +9660,7 @@ function SelectFormControl({
             ]
           }
         ),
-        /* @__PURE__ */ jsx31(Select.Popover, { UNSTABLE_portalContainer: portalContainer, children: /* @__PURE__ */ jsx31(ListBox, { children: field.options.map((option2) => /* @__PURE__ */ jsxs22(ListBox.Item, { id: option2.value, textValue: option2.label, children: [
+        /* @__PURE__ */ jsx31(Select.Popover, { UNSTABLE_portalContainer: portalContainer, children: /* @__PURE__ */ jsx31(ListBox, { children: field.options.map((option2) => /* @__PURE__ */ jsxs23(ListBox.Item, { id: option2.value, textValue: option2.label, children: [
           option2.label,
           /* @__PURE__ */ jsx31(ListBox.ItemIndicator, {})
         ] }, option2.value)) }) }),
@@ -9354,13 +9675,13 @@ function DatePickerFormControl({
   portalContainer,
   value
 }) {
-  const [isOpen, setIsOpen] = useState10(false);
+  const [isOpen, setIsOpen] = useState11(false);
   const pointerOpenAt = useRef3(0);
   const handleOpenChange = (nextOpen) => {
     if (!nextOpen && Date.now() - pointerOpenAt.current < 350) return;
     setIsOpen(nextOpen);
   };
-  return /* @__PURE__ */ jsxs22(
+  return /* @__PURE__ */ jsxs23(
     DatePicker,
     {
       isOpen,
@@ -9376,7 +9697,7 @@ function DatePickerFormControl({
       },
       children: [
         /* @__PURE__ */ jsx31(Label3, { children: field.label }),
-        /* @__PURE__ */ jsxs22(DateField.Group, { fullWidth: true, variant: "secondary", children: [
+        /* @__PURE__ */ jsxs23(DateField.Group, { fullWidth: true, variant: "secondary", children: [
           /* @__PURE__ */ jsx31(DateField.Input, { children: (segment) => /* @__PURE__ */ jsx31(DateField.Segment, { segment }) }),
           /* @__PURE__ */ jsx31(DateField.Suffix, { children: /* @__PURE__ */ jsx31(
             DatePicker.Trigger,
@@ -9400,13 +9721,13 @@ function DateRangePickerFormControl({
   portalContainer,
   value
 }) {
-  const [isOpen, setIsOpen] = useState10(false);
+  const [isOpen, setIsOpen] = useState11(false);
   const pointerOpenAt = useRef3(0);
   const handleOpenChange = (nextOpen) => {
     if (!nextOpen && Date.now() - pointerOpenAt.current < 350) return;
     setIsOpen(nextOpen);
   };
-  return /* @__PURE__ */ jsxs22(
+  return /* @__PURE__ */ jsxs23(
     DateRangePicker,
     {
       endName: `${field.name}.end`,
@@ -9426,7 +9747,7 @@ function DateRangePickerFormControl({
       },
       children: [
         /* @__PURE__ */ jsx31(Label3, { children: field.label }),
-        /* @__PURE__ */ jsxs22(DateField.Group, { fullWidth: true, variant: "secondary", children: [
+        /* @__PURE__ */ jsxs23(DateField.Group, { fullWidth: true, variant: "secondary", children: [
           /* @__PURE__ */ jsx31(DateField.Input, { slot: "start", children: (segment) => /* @__PURE__ */ jsx31(DateField.Segment, { segment }) }),
           /* @__PURE__ */ jsx31(DateRangePicker.RangeSeparator, {}),
           /* @__PURE__ */ jsx31(DateField.Input, { slot: "end", children: (segment) => /* @__PURE__ */ jsx31(DateField.Segment, { segment }) }),
@@ -9448,17 +9769,17 @@ function DateRangePickerFormControl({
 }
 
 // ../agent-ui/src/components/form-elements/switch-group-view.tsx
-import { useMemo as useMemo6, useState as useState11 } from "react";
-import { jsx as jsx32, jsxs as jsxs23 } from "react/jsx-runtime";
+import { useMemo as useMemo6, useState as useState12 } from "react";
+import { jsx as jsx32, jsxs as jsxs24 } from "react/jsx-runtime";
 function SwitchGroupView({ className, component, onSelect }) {
   const defaults = useMemo6(
     () => Object.fromEntries(component.items.map((item) => [item.id, item.defaultSelected ?? false])),
     [component.items]
   );
-  const [values, setValues] = useState11({});
+  const [values, setValues] = useState12({});
   return /* @__PURE__ */ jsx32(Card, { className, description: component.description, title: component.title, children: /* @__PURE__ */ jsx32("div", { className: "aui-switch-group", "data-slot": "agent-ui-switch-group", children: component.items.map((item) => {
     const selected = values[item.id] ?? defaults[item.id] ?? false;
-    return /* @__PURE__ */ jsxs23("label", { "data-slot": "agent-ui-switch-item", children: [
+    return /* @__PURE__ */ jsxs24("label", { "data-slot": "agent-ui-switch-item", children: [
       /* @__PURE__ */ jsx32(
         "input",
         {
@@ -9473,7 +9794,7 @@ function SwitchGroupView({ className, component, onSelect }) {
           }
         }
       ),
-      /* @__PURE__ */ jsxs23("span", { "data-slot": "agent-ui-switch-content", children: [
+      /* @__PURE__ */ jsxs24("span", { "data-slot": "agent-ui-switch-content", children: [
         /* @__PURE__ */ jsx32("strong", { "data-slot": "agent-ui-switch-label", children: item.label }),
         item.description ? /* @__PURE__ */ jsx32("small", { "data-slot": "agent-ui-switch-description", children: item.description }) : null
       ] })
@@ -9482,14 +9803,14 @@ function SwitchGroupView({ className, component, onSelect }) {
 }
 
 // ../agent-ui/src/components/form-elements/toggle-group-view.tsx
-import { useMemo as useMemo7, useState as useState12 } from "react";
+import { useMemo as useMemo7, useState as useState13 } from "react";
 import { jsx as jsx33 } from "react/jsx-runtime";
 function ToggleGroupView({ className, component, onSelect }) {
   const validIds = useMemo7(
     () => new Set(component.items.map((item) => item.id)),
     [component.items]
   );
-  const [selected, setSelected] = useState12(() => new Set(component.defaultValue ?? []));
+  const [selected, setSelected] = useState13(() => new Set(component.defaultValue ?? []));
   const active = new Set([...selected].filter((id2) => validIds.has(id2)));
   return /* @__PURE__ */ jsx33(Card, { className, description: component.description, title: component.title, children: /* @__PURE__ */ jsx33("div", { className: "aui-toggle-group", "data-slot": "agent-ui-toggle-group", children: component.items.map((item) => /* @__PURE__ */ jsx33(
     "button",
@@ -9517,7 +9838,7 @@ function ToggleGroupView({ className, component, onSelect }) {
 
 // ../agent-ui/src/components/primitives/primitive-views.tsx
 import { createElement } from "react";
-import { jsx as jsx34, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs25 } from "react/jsx-runtime";
 var progressFormatter = new Intl.NumberFormat(void 0, { maximumFractionDigits: 0 });
 function HeadingView({ className, component }) {
   const level = component.level ?? 2;
@@ -9541,7 +9862,7 @@ function HeadingView({ className, component }) {
   );
 }
 function ButtonView({ className, component, onAction, onSelect }) {
-  return /* @__PURE__ */ jsxs24(
+  return /* @__PURE__ */ jsxs25(
     ActionButton,
     {
       className: mergeClassNames("aui-button-primitive", className),
@@ -9599,7 +9920,7 @@ function RatingView({ className, component }) {
 }
 function ProgressView({ className, component }) {
   const value = Math.min(Math.max(component.value, 0), 100);
-  return /* @__PURE__ */ jsxs24(
+  return /* @__PURE__ */ jsxs25(
     "span",
     {
       "aria-valuemax": 100,
@@ -9610,9 +9931,9 @@ function ProgressView({ className, component }) {
       role: "progressbar",
       ...component.label ? { "aria-label": component.label } : {},
       children: [
-        component.label ? /* @__PURE__ */ jsxs24("span", { className: "aui-progress__header", children: [
+        component.label ? /* @__PURE__ */ jsxs25("span", { className: "aui-progress__header", children: [
           /* @__PURE__ */ jsx34("span", { className: "aui-progress__label", children: component.label }),
-          /* @__PURE__ */ jsxs24("span", { className: "aui-progress__value", children: [
+          /* @__PURE__ */ jsxs25("span", { className: "aui-progress__value", children: [
             progressFormatter.format(value),
             "%"
           ] })
@@ -9653,6 +9974,7 @@ var leafViews = {
   "area-chart": AreaChartView,
   "bar-chart": BarChartView,
   callout: CalloutView,
+  "candlestick-chart": CandlestickChartView,
   "channel-message": ChannelMessageView,
   "code-block": CodeBlockView,
   "comparison-list": ComparisonListView,
@@ -9666,6 +9988,8 @@ var leafViews = {
   "flight-tracker": FlightTrackerView,
   followup: FollowupView,
   form: FormView,
+  "funnel-chart": FunnelChartView,
+  "gauge-chart": GaugeChartView,
   heatmap: HeatmapView,
   image: ImageView,
   "kpi-grid": KpiGridView,
@@ -9688,6 +10012,7 @@ var leafViews = {
   "sankey-chart": SankeyChartView,
   "scatter-chart": ScatterChartView,
   steps: StepsView,
+  "sunburst-chart": SunburstChartView,
   "switch-group": SwitchGroupView,
   "tag-list": TagListView,
   text: TextView,