@cimplify/sdk 0.98.0 → 0.99.0

package/dist/react.js

@@ -1287,10 +1287,10 @@ function CimplifyProvider({
   }, [resolvedClient, baseCurrency, displayCurrency]);
   const convertPrice = React14.useCallback(
     (amount) => {
-      const num = typeof amount === "string" ? parseFloat(amount) : amount;
-      if (isNaN(num)) return 0;
-      if (!fxRate || displayCurrency === baseCurrency) return num;
-      return Math.round(num * fxRate * 100) / 100;
+      const num2 = typeof amount === "string" ? parseFloat(amount) : amount;
+      if (isNaN(num2)) return 0;
+      if (!fxRate || displayCurrency === baseCurrency) return num2;
+      return Math.round(num2 * fxRate * 100) / 100;
     },
     [fxRate, displayCurrency, baseCurrency]
   );
@@ -2738,8 +2738,8 @@ var STATE_TONE = {
   cancelled: "text-destructive",
   default: "text-foreground/55"
 };
-function StateDot({ label, tone = "default" }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cn("inline-flex items-center gap-1.5 text-xs font-medium", STATE_TONE[tone]), children: [
+function StateDot({ label, tone: tone2 = "default" }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cn("inline-flex items-center gap-1.5 text-xs font-medium", STATE_TONE[tone2]), children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "size-1.5 rounded-full bg-current" }),
     label
   ] });
@@ -17137,11 +17137,11 @@ function installHooks() {
 }
 var CACHE_LIMIT = 300;
 var cache = /* @__PURE__ */ new Map();
-function renderMarkdown(text) {
-  const cached = cache.get(text);
+function renderMarkdown(text2) {
+  const cached = cache.get(text2);
   if (cached !== void 0) return cached;
   installHooks();
-  const html = DOMPurify__default.default.sanitize(marked.marked.parse(text), {
+  const html = DOMPurify__default.default.sanitize(marked.marked.parse(text2), {
     ALLOWED_TAGS,
     ALLOWED_ATTR
   });
@@ -17149,15 +17149,15 @@ function renderMarkdown(text) {
     const oldest = cache.keys().next().value;
     if (oldest !== void 0) cache.delete(oldest);
   }
-  cache.set(text, html);
+  cache.set(text2, html);
   return html;
 }
-function SettledMarkdown({ text, className }) {
-  const html = React14.useMemo(() => renderMarkdown(text), [text]);
+function SettledMarkdown({ text: text2, className }) {
+  const html = React14.useMemo(() => renderMarkdown(text2), [text2]);
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className, dangerouslySetInnerHTML: { __html: html } });
 }
 var ChatMarkdown = React14.memo(function ChatMarkdown2({
-  text,
+  text: text2,
   className,
   streaming = false
 }) {
@@ -17165,10 +17165,10 @@ var ChatMarkdown = React14.memo(function ChatMarkdown2({
     return (
       // While the streamdown chunk loads, the settled renderer keeps the
       // text on screen — no blank frame at stream start.
-      /* @__PURE__ */ jsxRuntime.jsx(React14.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(SettledMarkdown, { text, className }), children: /* @__PURE__ */ jsxRuntime.jsx(Streamdown, { className, children: text }) })
+      /* @__PURE__ */ jsxRuntime.jsx(React14.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(SettledMarkdown, { text: text2, className }), children: /* @__PURE__ */ jsxRuntime.jsx(Streamdown, { className, children: text2 }) })
     );
   }
-  return /* @__PURE__ */ jsxRuntime.jsx(SettledMarkdown, { text, className });
+  return /* @__PURE__ */ jsxRuntime.jsx(SettledMarkdown, { text: text2, className });
 });
 
 // src/react/chat-kit/motion.ts
@@ -17743,943 +17743,6 @@ function deliveryState(message, timeline, seenAt, isOptimistic2) {
   const seenCutoff = timeline.firstAgentMessageId ? seenAt : null;
   return seenCutoff && message.created_at <= seenCutoff ? "seen" : "delivered";
 }
-var MAX_ATTACHMENT_BYTES = 5 * 1024 * 1024;
-var KEEP_DISMISSED_KEY = "cimplify_keep_chat_dismissed";
-var AT_BOTTOM_SLACK_PX = 48;
-function ChatWidget({
-  client: clientProp,
-  businessName = "Support",
-  greeting = "Hi there!",
-  subtitle = "Ask us anything \u2014 we typically reply in a few seconds.",
-  starters,
-  placeholder = "Type a message\u2026",
-  position = "bottom-right",
-  defaultOpen = false,
-  pollInterval,
-  className,
-  classNames
-}) {
-  const context = useOptionalCimplifyClient();
-  const client = clientProp ?? context?.client;
-  const [open, setOpen] = React14.useState(defaultOpen);
-  const [readAt, setReadAt] = React14.useState(null);
-  const [attachError, setAttachError] = React14.useState(null);
-  const [replyTo, setReplyTo] = React14.useState(null);
-  const {
-    messages,
-    isLoading,
-    isSending,
-    awaitingReply,
-    seenAt,
-    error,
-    isActive,
-    humanRequested,
-    claimedAs,
-    signOut,
-    send,
-    react,
-    requestHuman,
-    startConversation,
-    loadOlder,
-    mayHaveOlder,
-    openIfExisting
-  } = useChat({ client, pollInterval });
-  const showTyping = isSending || awaitingReply;
-  const attachPhoto = React14.useCallback(
-    async (file) => {
-      if (!client) return;
-      setAttachError(null);
-      if (!file.type.startsWith("image/")) {
-        setAttachError(new chunkAETVRBKI_js.CimplifyError("invalid_attachment", "Only photos can be attached."));
-        return;
-      }
-      if (file.size > MAX_ATTACHMENT_BYTES) {
-        setAttachError(new chunkAETVRBKI_js.CimplifyError("attachment_too_large", "Photos must be under 5MB."));
-        return;
-      }
-      const uploaded = await client.uploads.upload(file);
-      if (!uploaded.ok) {
-        setAttachError(uploaded.error);
-        return;
-      }
-      const attachment = {
-        upload_id: uploaded.value.id,
-        url: uploaded.value.url,
-        mime_type: uploaded.value.content_type,
-        filename: uploaded.value.filename,
-        size: uploaded.value.size_bytes
-      };
-      await send("", { attachments: [attachment] });
-    },
-    [client, send]
-  );
-  const handleSend = React14.useCallback(
-    (content) => {
-      setAttachError(null);
-      const target = replyTo;
-      setReplyTo(null);
-      return send(content, target ? { replyTo: target } : void 0);
-    },
-    [send, replyTo]
-  );
-  const unread = open ? 0 : messages.filter(
-    (m) => m.sender_type !== "customer" && (!readAt || m.created_at > readAt)
-  ).length;
-  React14.useState(() => {
-    if (defaultOpen) void openIfExisting();
-  });
-  const handleOpen = React14.useCallback(() => {
-    setOpen(true);
-    void openIfExisting();
-  }, [openIfExisting]);
-  const handleClose = React14.useCallback(() => {
-    const newest = messages[messages.length - 1];
-    setReadAt(newest?.created_at ?? null);
-    setOpen(false);
-  }, [messages]);
-  const isLeft = position === "bottom-left";
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: cn(
-        "fixed bottom-6 z-[9999]",
-        isLeft ? "left-6" : "right-6",
-        className,
-        classNames?.root
-      ),
-      children: [
-        !open && /* @__PURE__ */ jsxRuntime.jsx(
-          Bubble,
-          {
-            unread,
-            onClick: handleOpen,
-            className: classNames?.bubble
-          }
-        ),
-        open && /* @__PURE__ */ jsxRuntime.jsx(
-          Panel,
-          {
-            client,
-            businessName,
-            greeting,
-            subtitle,
-            starters,
-            placeholder,
-            messages,
-            isLoading,
-            isSending,
-            isTyping: showTyping,
-            seenAt,
-            readAt,
-            error: error ?? attachError,
-            isActive,
-            isLeft,
-            humanRequested,
-            mayHaveOlder,
-            replyTo,
-            claimedAs,
-            onSignOut: () => void signOut(),
-            onClose: handleClose,
-            onSend: handleSend,
-            onReact: react,
-            onReply: setReplyTo,
-            onCancelReply: () => setReplyTo(null),
-            onRequestHuman: () => void requestHuman(),
-            onLoadOlder: () => void loadOlder(),
-            onAttach: attachPhoto,
-            onStartConversation: startConversation,
-            classNames
-          }
-        )
-      ]
-    }
-  );
-}
-function Bubble({
-  unread,
-  onClick,
-  className
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "button",
-    {
-      type: "button",
-      onClick,
-      "aria-label": "Open chat",
-      className: cn(
-        "relative flex h-14 w-14 items-center justify-center rounded-full",
-        "bg-foreground text-background shadow-lg",
-        "transition-transform duration-300 ease-out",
-        "hover:scale-[1.08] active:scale-95",
-        className
-      ),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ChatIcon, { className: "h-6 w-6" }),
-        unread > 0 && /* @__PURE__ */ jsxRuntime.jsx(
-          "span",
-          {
-            className: cn(
-              "absolute -right-0.5 -top-0.5 flex h-5 w-5 items-center justify-center",
-              "rounded-full bg-destructive text-[10px] font-bold text-white",
-              "ring-2 ring-background"
-            ),
-            children: unread > 9 ? "9+" : unread
-          }
-        )
-      ]
-    }
-  );
-}
-function Panel({
-  client,
-  businessName,
-  greeting,
-  subtitle,
-  starters,
-  placeholder,
-  messages,
-  isLoading,
-  isSending,
-  isTyping,
-  seenAt,
-  readAt,
-  error,
-  isActive,
-  isLeft,
-  humanRequested,
-  mayHaveOlder,
-  replyTo,
-  claimedAs,
-  onSignOut,
-  onClose,
-  onSend,
-  onReact,
-  onReply,
-  onCancelReply,
-  onRequestHuman,
-  onLoadOlder,
-  onAttach,
-  onStartConversation,
-  classNames
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: cn(
-        "flex flex-col overflow-hidden rounded-2xl bg-background shadow-2xl",
-        "w-[400px] max-w-[calc(100vw-3rem)]",
-        "h-[min(600px,calc(100vh-6rem))]",
-        "animate-in fade-in slide-in-from-bottom-4 duration-300",
-        isLeft ? "origin-bottom-left" : "origin-bottom-right",
-        classNames?.panel
-      ),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          Header,
-          {
-            businessName,
-            claimedAs,
-            onSignOut,
-            onClose,
-            className: classNames?.header
-          }
-        ),
-        !isActive && !isLoading ? /* @__PURE__ */ jsxRuntime.jsx(
-          Welcome,
-          {
-            greeting,
-            subtitle,
-            starters,
-            onStarter: onStartConversation,
-            className: classNames?.welcome
-          }
-        ) : /* @__PURE__ */ jsxRuntime.jsx(
-          MessageList,
-          {
-            messages,
-            businessName,
-            isLoading,
-            isSending: isTyping,
-            seenAt,
-            readAt,
-            humanRequested,
-            mayHaveOlder,
-            onReact,
-            onReply,
-            onRequestHuman,
-            onLoadOlder,
-            className: classNames?.messages
-          }
-        ),
-        isActive && !claimedAs && client && /* @__PURE__ */ jsxRuntime.jsx(KeepConversation, { client }),
-        humanRequested && isActive && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 border-t border-border bg-muted/50 px-4 py-2 text-[11px] text-muted-foreground", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-1.5 w-1.5 flex-shrink-0 animate-pulse rounded-full bg-amber-500" }),
-          "Waiting for ",
-          businessName,
-          " \u2014 usually replies in minutes"
-        ] }),
-        error != null && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t border-destructive/20 bg-destructive/10 px-4 py-2 text-xs text-destructive", children: error.userMessage || "Something went wrong. Please try again." }),
-        replyTo && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-2 border-t border-border bg-muted/50 px-4 py-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-[3px] shrink-0 self-stretch rounded-full bg-foreground/40" }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-[11px] font-semibold text-foreground", children: [
-              "Replying to ",
-              replyTo.sender_type === "customer" ? "yourself" : businessName
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-[11px] text-muted-foreground", children: proseOf(replyTo.content) || "Photo" })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "button",
-            {
-              type: "button",
-              "aria-label": "Cancel reply",
-              onClick: onCancelReply,
-              className: "flex-shrink-0 p-0.5 text-muted-foreground hover:text-foreground",
-              children: /* @__PURE__ */ jsxRuntime.jsx(CloseIcon, { className: "h-3.5 w-3.5" })
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ChatInput,
-          {
-            placeholder,
-            isSending,
-            onSend: isActive ? onSend : async (text) => {
-              await onStartConversation(text);
-              return true;
-            },
-            onAttach,
-            className: classNames?.input
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-shrink-0 border-t border-border bg-background px-4 py-1.5 text-center text-[10px] text-muted-foreground", children: [
-          "Powered by",
-          " ",
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-foreground", children: "Cimplify" })
-        ] })
-      ]
-    }
-  );
-}
-function Header({
-  businessName,
-  claimedAs,
-  onSignOut,
-  onClose,
-  className
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: cn(
-        "flex flex-shrink-0 items-center gap-3 bg-foreground px-5 py-4 text-background",
-        className
-      ),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-9 w-9 flex-shrink-0 items-center justify-center rounded-[10px] bg-background/15", children: /* @__PURE__ */ jsxRuntime.jsx(ChatIcon, { className: "h-5 w-5" }) }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-[15px] font-semibold leading-tight", children: businessName }),
-          claimedAs ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 truncate text-xs text-background/60", children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "truncate", children: [
-              "Chatting as ",
-              claimedAs
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: "\xB7" }),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "button",
-              {
-                type: "button",
-                onClick: onSignOut,
-                className: "flex-shrink-0 underline underline-offset-2 hover:text-background",
-                children: "Not you?"
-              }
-            )
-          ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5 text-xs text-background/60", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-[7px] w-[7px] flex-shrink-0 rounded-full bg-emerald-400" }),
-            "Online"
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "button",
-          {
-            type: "button",
-            onClick: onClose,
-            "aria-label": "Close chat",
-            className: cn(
-              "flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-lg",
-              "bg-background/10 text-background/70 transition-colors hover:bg-background/20 hover:text-background"
-            ),
-            children: /* @__PURE__ */ jsxRuntime.jsx(CloseIcon, { className: "h-[18px] w-[18px]" })
-          }
-        )
-      ]
-    }
-  );
-}
-function Welcome({
-  greeting,
-  subtitle,
-  starters,
-  onStarter,
-  className
-}) {
-  const defaultStarters = [
-    { icon: "\u{1F50D}", text: "Help me find a product" },
-    { icon: "\u{1F6D2}", text: "Check my cart" },
-    { icon: "\u{1F4E6}", text: "Track my order" }
-  ];
-  const items = starters ?? defaultStarters;
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: cn(
-        "flex flex-1 flex-col items-center justify-center overflow-y-auto bg-muted/50 px-8 py-10 text-center",
-        className
-      ),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-5 flex h-16 w-16 items-center justify-center rounded-2xl bg-muted", children: /* @__PURE__ */ jsxRuntime.jsx(ChatIcon, { className: "h-7 w-7 text-muted-foreground" }) }),
-        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-2 text-xl font-bold text-foreground", children: greeting }),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-6 max-w-[280px] text-sm leading-relaxed text-muted-foreground", children: subtitle }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-full max-w-[300px] flex-col gap-2", children: items.map((s) => /* @__PURE__ */ jsxRuntime.jsxs(
-          "button",
-          {
-            type: "button",
-            onClick: () => onStarter(s.text),
-            className: cn(
-              "flex items-center gap-3 rounded-xl border border-border bg-background px-4 py-3",
-              "text-left text-[13px] font-medium text-foreground",
-              "transition-all hover:-translate-y-px hover:border-foreground hover:shadow-sm"
-            ),
-            children: [
-              s.icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-lg bg-muted text-[15px]", children: s.icon }),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { children: s.text })
-            ]
-          },
-          s.text
-        )) })
-      ]
-    }
-  );
-}
-var QUICK_REACTIONS = ["\u{1F44D}", "\u2764\uFE0F"];
-function LetterAvatar({ name }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-6 items-center justify-center rounded-full bg-foreground text-[10px] font-bold text-background", children: name.charAt(0).toUpperCase() });
-}
-function MessageList({
-  messages,
-  businessName,
-  isLoading,
-  isSending,
-  seenAt,
-  readAt,
-  humanRequested,
-  mayHaveOlder,
-  onReact,
-  onReply,
-  onRequestHuman,
-  onLoadOlder,
-  className
-}) {
-  const scrolledUpRef = React14.useRef(false);
-  const timeline = chatTimeline(messages, { readAt });
-  const { bubbles, reactionsByTarget, firstUnreadId, unreadOnOpen, firstAgentMessageId } = timeline;
-  const lastBubble = bubbles[bubbles.length - 1];
-  const offerHuman = !humanRequested && lastBubble?.sender_type === "bot" && !isSending;
-  const handleScroll = (event) => {
-    const node = event.currentTarget;
-    scrolledUpRef.current = node.scrollHeight - node.scrollTop - node.clientHeight >= AT_BOTTOM_SLACK_PX;
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      onScroll: handleScroll,
-      style: { background: "var(--color-chat-canvas, var(--color-muted, #f3f5f3))" },
-      className: cn("flex flex-1 flex-col gap-0.5 overflow-y-auto px-3.5 py-3.5", className),
-      children: [
-        isLoading && messages.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(TypingDots, {}) }),
-        mayHaveOlder && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center pb-1", children: /* @__PURE__ */ jsxRuntime.jsx(
-          "button",
-          {
-            type: "button",
-            onClick: onLoadOlder,
-            className: "rounded-full border border-foreground/[0.06] bg-background px-3.5 py-[7px] text-xs font-semibold text-muted-foreground shadow-[0_1px_2px_rgba(15,23,42,0.04)]",
-            children: "Show earlier messages"
-          }
-        ) }),
-        bubbles.map((msg, i) => {
-          const prev = bubbles[i - 1];
-          const newDay = !prev || !sameDay(prev.created_at, msg.created_at);
-          const group = groupPosition(timeline, i);
-          const startsRun = group === "single" || group === "first";
-          const delivery = deliveryState(msg, timeline, seenAt, isOptimistic);
-          return /* @__PURE__ */ jsxRuntime.jsxs(
-            "div",
-            {
-              className: cn("flex flex-col gap-1.5", startsRun && i > 0 && "mt-2.5"),
-              children: [
-                newDay && /* @__PURE__ */ jsxRuntime.jsx(Seam, { variant: "chip", label: dayLabel(msg.created_at) }),
-                msg.id === firstUnreadId && /* @__PURE__ */ jsxRuntime.jsx(
-                  Seam,
-                  {
-                    variant: "unread",
-                    label: `${unreadOnOpen} new message${unreadOnOpen === 1 ? "" : "s"}`
-                  }
-                ),
-                msg.id === firstAgentMessageId && /* @__PURE__ */ jsxRuntime.jsx(Seam, { label: "A person joined" }),
-                msg.sender_type === "system" ? /* @__PURE__ */ jsxRuntime.jsx(Seam, { label: "Passing you to the team" }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group relative", children: [
-                  msg.sender_type !== "customer" && !isOptimistic(msg) && /* @__PURE__ */ jsxRuntime.jsx(HoverRail, { message: msg, onReact, onReply }),
-                  /* @__PURE__ */ jsxRuntime.jsx(
-                    MessageBubble,
-                    {
-                      message: msg,
-                      reactions: reactionsByTarget.get(msg.id),
-                      businessName,
-                      group,
-                      delivery,
-                      onReply,
-                      avatar: /* @__PURE__ */ jsxRuntime.jsx(LetterAvatar, { name: businessName }),
-                      onQuoteMiss: async () => {
-                        onLoadOlder();
-                        return true;
-                      }
-                    }
-                  )
-                ] })
-              ]
-            },
-            msg.id
-          );
-        }),
-        isSending && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mr-auto mt-1", children: /* @__PURE__ */ jsxRuntime.jsx(TypingDots, {}) }),
-        offerHuman && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2", children: /* @__PURE__ */ jsxRuntime.jsx(
-          "button",
-          {
-            type: "button",
-            onClick: onRequestHuman,
-            className: "rounded-full border border-border bg-background px-3 py-1.5 text-xs font-semibold text-foreground hover:border-foreground",
-            children: "Talk to a person"
-          }
-        ) }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            ref: (node) => {
-              if (node && !scrolledUpRef.current) node.scrollIntoView({ behavior: "smooth" });
-            }
-          },
-          `${messages.length}:${isSending}`
-        )
-      ]
-    }
-  );
-}
-function HoverRail({
-  message,
-  onReact,
-  onReply
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute -top-3 right-0 z-10 hidden gap-0.5 rounded-full border border-border bg-background px-1 py-0.5 shadow-sm group-hover:flex", children: [
-    QUICK_REACTIONS.map((emoji) => /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        type: "button",
-        "aria-label": `React ${emoji}`,
-        onClick: () => void onReact(message, emoji),
-        className: "flex h-6 w-6 items-center justify-center rounded-full text-[13px] hover:bg-muted",
-        children: emoji
-      },
-      emoji
-    )),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        type: "button",
-        "aria-label": "Reply",
-        onClick: () => onReply(message),
-        className: "flex h-6 w-6 items-center justify-center rounded-full text-muted-foreground hover:bg-muted hover:text-foreground",
-        children: /* @__PURE__ */ jsxRuntime.jsx(ReplyIcon, { className: "h-3.5 w-3.5" })
-      }
-    )
-  ] });
-}
-function readKeepDismissed() {
-  try {
-    return typeof window !== "undefined" && window.localStorage.getItem(KEEP_DISMISSED_KEY) === "1";
-  } catch {
-    return false;
-  }
-}
-function writeKeepDismissed() {
-  try {
-    window.localStorage.setItem(KEEP_DISMISSED_KEY, "1");
-  } catch {
-  }
-}
-function KeepConversation({ client }) {
-  const [step, setStep] = React14.useState("row");
-  const [dismissed, setDismissed] = React14.useState(readKeepDismissed);
-  const [contact, setContact] = React14.useState("");
-  const [code, setCode] = React14.useState("");
-  const [busy, setBusy] = React14.useState(false);
-  const [verifyError, setVerifyError] = React14.useState(null);
-  if (dismissed) return null;
-  const contactType = contact.includes("@") ? "email" : "phone";
-  const requestCode = async () => {
-    const trimmed = contact.trim();
-    if (!trimmed || busy) return;
-    setBusy(true);
-    setVerifyError(null);
-    const result = await client.link.requestOtp({ contact: trimmed, contact_type: contactType });
-    setBusy(false);
-    if (result.ok) {
-      setCode("");
-      setStep("code");
-    } else {
-      setVerifyError(result.error.userMessage || "Couldn't send a code \u2014 try again.");
-    }
-  };
-  const verify = async (value) => {
-    if (value.length !== 6 || busy) return;
-    setBusy(true);
-    setVerifyError(null);
-    const result = await client.link.verifyOtp({
-      contact: contact.trim(),
-      contact_type: contactType,
-      otp_code: value
-    });
-    setBusy(false);
-    if (!result.ok) {
-      setCode("");
-      setVerifyError(result.error.userMessage || "Invalid or expired code.");
-    }
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-shrink-0 border-t border-border bg-muted/50 px-4 py-2.5", children: [
-    step === "row" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2.5", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(
-        "button",
-        {
-          type: "button",
-          onClick: () => setStep("contact"),
-          className: "flex min-w-0 flex-1 flex-col text-left",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-semibold text-foreground", children: "Keep this conversation" }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-[11px] text-muted-foreground", children: "Verify your number and it follows you \u2014 any device" })
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "button",
-        {
-          type: "button",
-          "aria-label": "Dismiss",
-          onClick: () => {
-            writeKeepDismissed();
-            setDismissed(true);
-          },
-          className: "flex-shrink-0 p-1 text-muted-foreground hover:text-foreground",
-          children: /* @__PURE__ */ jsxRuntime.jsx(CloseIcon, { className: "h-3.5 w-3.5" })
-        }
-      )
-    ] }),
-    step === "contact" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "input",
-        {
-          type: "text",
-          inputMode: "email",
-          value: contact,
-          onChange: (e) => setContact(e.target.value),
-          onKeyDown: (e) => e.key === "Enter" && void requestCode(),
-          placeholder: "Phone or email",
-          autoFocus: true,
-          className: "h-9 min-w-0 flex-1 rounded-lg border border-border bg-background px-3 text-xs text-foreground outline-none placeholder:text-muted-foreground focus:border-foreground"
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "button",
-        {
-          type: "button",
-          onClick: () => void requestCode(),
-          disabled: !contact.trim() || busy,
-          className: "h-9 flex-shrink-0 rounded-lg bg-foreground px-3 text-xs font-semibold text-background disabled:opacity-50",
-          children: busy ? "Sending\u2026" : "Send code"
-        }
-      )
-    ] }),
-    step === "code" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "input",
-        {
-          type: "text",
-          inputMode: "numeric",
-          autoComplete: "one-time-code",
-          maxLength: 6,
-          value: code,
-          onChange: (e) => {
-            const digits = e.target.value.replace(/\D/g, "").slice(0, 6);
-            setCode(digits);
-            if (digits.length === 6) void verify(digits);
-          },
-          placeholder: "6-digit code",
-          autoFocus: true,
-          className: "h-9 min-w-0 flex-1 rounded-lg border border-border bg-background px-3 text-xs tracking-[0.2em] text-foreground outline-none placeholder:tracking-normal placeholder:text-muted-foreground focus:border-foreground"
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "button",
-        {
-          type: "button",
-          onClick: () => void requestCode(),
-          disabled: busy,
-          className: "h-9 flex-shrink-0 rounded-lg px-2 text-[11px] font-medium text-muted-foreground hover:text-foreground disabled:opacity-50",
-          children: "Resend"
-        }
-      )
-    ] }),
-    verifyError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1.5 text-[11px] text-destructive", children: verifyError })
-  ] });
-}
-function ChatInput({
-  placeholder,
-  isSending,
-  onSend,
-  onAttach,
-  className
-}) {
-  const [value, setValue] = React14.useState("");
-  const [uploading, setUploading] = React14.useState(false);
-  const textareaRef = React14.useRef(null);
-  const fileRef = React14.useRef(null);
-  const handleAttach = React14.useCallback(
-    async (file) => {
-      setUploading(true);
-      try {
-        await onAttach(file);
-      } finally {
-        setUploading(false);
-      }
-    },
-    [onAttach]
-  );
-  const handleSend = React14.useCallback(async () => {
-    const trimmed = value.trim();
-    if (!trimmed || isSending) return;
-    setValue("");
-    if (textareaRef.current) {
-      textareaRef.current.style.height = "auto";
-    }
-    const sent = await onSend(trimmed);
-    if (!sent) setValue((current) => current || trimmed);
-  }, [value, isSending, onSend]);
-  const handleKeyDown = React14.useCallback(
-    (e) => {
-      if (e.key === "Enter" && !e.shiftKey) {
-        e.preventDefault();
-        handleSend();
-      }
-    },
-    [handleSend]
-  );
-  const handleInput = React14.useCallback(() => {
-    const el = textareaRef.current;
-    if (!el) return;
-    el.style.height = "auto";
-    el.style.height = `${Math.min(el.scrollHeight, 100)}px`;
-  }, []);
-  const hasContent = value.trim().length > 0;
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: cn(
-        "flex flex-shrink-0 items-end gap-2 border-t border-border bg-background px-4 py-3",
-        className
-      ),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "input",
-          {
-            ref: fileRef,
-            type: "file",
-            accept: "image/*",
-            className: "hidden",
-            "aria-hidden": "true",
-            tabIndex: -1,
-            onChange: (e) => {
-              const file = e.target.files?.[0];
-              e.target.value = "";
-              if (file) void handleAttach(file);
-            }
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "button",
-          {
-            type: "button",
-            "aria-label": "Attach a photo",
-            disabled: uploading,
-            onClick: () => fileRef.current?.click(),
-            className: cn(
-              "flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-[10px]",
-              "bg-muted text-muted-foreground transition-colors hover:text-foreground",
-              uploading && "animate-pulse"
-            ),
-            children: /* @__PURE__ */ jsxRuntime.jsx(ImageIcon, { className: "h-[18px] w-[18px]" })
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            className: cn(
-              "flex flex-1 items-end rounded-xl border-[1.5px] border-transparent bg-muted px-1",
-              "transition-colors focus-within:border-foreground focus-within:bg-background"
-            ),
-            children: /* @__PURE__ */ jsxRuntime.jsx(
-              "textarea",
-              {
-                ref: textareaRef,
-                value,
-                onChange: (e) => setValue(e.target.value),
-                onKeyDown: handleKeyDown,
-                onInput: handleInput,
-                placeholder,
-                rows: 1,
-                className: cn(
-                  "max-h-[100px] min-h-[20px] flex-1 resize-none bg-transparent px-2.5 py-2",
-                  "text-sm text-foreground outline-none placeholder:text-muted-foreground"
-                )
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "button",
-          {
-            type: "button",
-            onClick: handleSend,
-            disabled: !hasContent || isSending,
-            "aria-label": "Send message",
-            className: cn(
-              "flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-[10px]",
-              "transition-all duration-200",
-              hasContent && !isSending ? "bg-foreground text-background hover:scale-105 active:scale-95" : "bg-muted text-muted-foreground"
-            ),
-            children: /* @__PURE__ */ jsxRuntime.jsx(SendIcon, { className: "h-[18px] w-[18px]" })
-          }
-        )
-      ]
-    }
-  );
-}
-function TypingDots() {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1 px-4 py-3", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsxRuntime.jsx(
-    "span",
-    {
-      className: "h-[7px] w-[7px] animate-bounce rounded-full bg-muted-foreground/40",
-      style: { animationDelay: `${i * 160}ms` }
-    },
-    i
-  )) });
-}
-function ChatIcon({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "svg",
-    {
-      className,
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: 2,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z" })
-    }
-  );
-}
-function CloseIcon({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "svg",
-    {
-      className,
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: 2,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6L6 18M6 6l12 12" })
-    }
-  );
-}
-function SendIcon({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "svg",
-    {
-      className,
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: 2,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "22", y1: "2", x2: "11", y2: "13" }),
-        /* @__PURE__ */ jsxRuntime.jsx("polygon", { points: "22 2 15 22 11 13 2 9 22 2" })
-      ]
-    }
-  );
-}
-function ImageIcon({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "svg",
-    {
-      className,
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: 2,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", ry: "2" }),
-        /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "8.5", cy: "8.5", r: "1.5" }),
-        /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "21 15 16 10 5 21" })
-      ]
-    }
-  );
-}
-function ReplyIcon({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "svg",
-    {
-      className,
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: 2,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "9 17 4 12 9 7" }),
-        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 18v-2a4 4 0 0 0-4-4H4" })
-      ]
-    }
-  );
-}
-
-// src/react/genui/catalog.ts
-function genUICatalog(registry) {
-  return new Map(
-    registry.components.map((component) => [
-      component.name,
-      {
-        params: component.params.map((param) => ({
-          name: param.name,
-          required: param.required ?? false
-        }))
-      }
-    ])
-  );
-}
 
 // src/genui/lang/parser/ast.ts
 function isRuntimeExpr(node) {
@@ -18882,10 +17945,10 @@ var BUILTINS = {
     signature: "Round(number, decimals?) \u2192 number",
     description: "Round to N decimal places (default 0)",
     fn: (n, decimals) => {
-      const num = toNumber2(n);
+      const num2 = toNumber2(n);
       const d = decimals != null ? toNumber2(decimals) : 0;
       const factor = Math.pow(10, d);
-      return Math.round(num * factor) / factor;
+      return Math.round(num2 * factor) / factor;
     }
   },
   Abs: {
@@ -19231,1226 +18294,2509 @@ function tokenize(src) {
       }
       continue;
     }
-    if (c === "!") {
-      if (i + 1 < n && src[i + 1] === "=") {
-        tokens.push({ t: 26 /* NotEq */ });
-        i += 2;
-      } else {
-        tokens.push({ t: 33 /* Not */ });
+    if (c === "!") {
+      if (i + 1 < n && src[i + 1] === "=") {
+        tokens.push({ t: 26 /* NotEq */ });
+        i += 2;
+      } else {
+        tokens.push({ t: 33 /* Not */ });
+        i++;
+      }
+      continue;
+    }
+    if (c === ">") {
+      if (i + 1 < n && src[i + 1] === "=") {
+        tokens.push({ t: 29 /* GreaterEq */ });
+        i += 2;
+      } else {
+        tokens.push({ t: 27 /* Greater */ });
+        i++;
+      }
+      continue;
+    }
+    if (c === "<") {
+      if (i + 1 < n && src[i + 1] === "=") {
+        tokens.push({ t: 30 /* LessEq */ });
+        i += 2;
+      } else {
+        tokens.push({ t: 28 /* Less */ });
+        i++;
+      }
+      continue;
+    }
+    if (c === "&") {
+      if (i + 1 < n && src[i + 1] === "&") {
+        tokens.push({ t: 31 /* And */ });
+        i += 2;
+      } else {
+        tokens.push({ t: 31 /* And */ });
+        i++;
+      }
+      continue;
+    }
+    if (c === "|") {
+      if (i + 1 < n && src[i + 1] === "|") {
+        tokens.push({ t: 32 /* Or */ });
+        i += 2;
+      } else {
+        tokens.push({ t: 32 /* Or */ });
+        i++;
+      }
+      continue;
+    }
+    if (c === ".") {
+      tokens.push({ t: 19 /* Dot */ });
+      i++;
+      continue;
+    }
+    if (c === "?") {
+      tokens.push({ t: 34 /* Question */ });
+      i++;
+      continue;
+    }
+    if (c === "+") {
+      tokens.push({ t: 20 /* Plus */ });
+      i++;
+      continue;
+    }
+    if (c === "*") {
+      tokens.push({ t: 22 /* Star */ });
+      i++;
+      continue;
+    }
+    if (c === "/") {
+      tokens.push({ t: 23 /* Slash */ });
+      i++;
+      continue;
+    }
+    if (c === "%") {
+      tokens.push({ t: 24 /* Percent */ });
+      i++;
+      continue;
+    }
+    if (c === '"') {
+      const start = i;
+      i++;
+      let isClosed = false;
+      while (i < n) {
+        if (src[i] === "\\") {
+          i += 2;
+        } else if (src[i] === '"') {
+          i++;
+          isClosed = true;
+          break;
+        } else {
+          i++;
+        }
+      }
+      const rawString = src.slice(start, i);
+      try {
+        const validJsonString = isClosed ? rawString : rawString + '"';
+        tokens.push({ t: 14 /* Str */, v: JSON.parse(validJsonString) });
+      } catch {
+        const stripped = rawString.replace(/^"|"$/g, "");
+        tokens.push({ t: 14 /* Str */, v: stripped });
+      }
+      continue;
+    }
+    if (c === "'") {
+      i++;
+      let result = "";
+      while (i < n) {
+        if (src[i] === "\\") {
+          i++;
+          if (i < n) {
+            const esc = src[i];
+            if (esc === "'") result += "'";
+            else if (esc === "\\") result += "\\";
+            else if (esc === "n") result += "\n";
+            else if (esc === "t") result += "	";
+            else result += esc;
+            i++;
+          }
+        } else if (src[i] === "'") {
+          i++;
+          break;
+        } else {
+          result += src[i];
+          i++;
+        }
+      }
+      tokens.push({ t: 14 /* Str */, v: result });
+      continue;
+    }
+    if (c === "-") {
+      const prev = tokens.length > 0 ? tokens[tokens.length - 1] : null;
+      const afterValue = prev != null && (prev.t === 15 /* Num */ || prev.t === 14 /* Str */ || prev.t === 16 /* Ident */ || prev.t === 17 /* Type */ || prev.t === 2 /* RParen */ || prev.t === 4 /* RBrack */ || prev.t === 10 /* True */ || prev.t === 11 /* False */ || prev.t === 12 /* Null */ || prev.t === 18 /* StateVar */ || prev.t === 35 /* BuiltinCall */);
+      if (!afterValue && i + 1 < n && src[i + 1] >= "0" && src[i + 1] <= "9") ; else {
+        tokens.push({ t: 21 /* Minus */ });
+        i++;
+        continue;
+      }
+    }
+    const isDigit = c >= "0" && c <= "9";
+    const isNegDigit = c === "-" && i + 1 < n && src[i + 1] >= "0" && src[i + 1] <= "9";
+    if (isDigit || isNegDigit) {
+      const start = i;
+      if (src[i] === "-") i++;
+      while (i < n && src[i] >= "0" && src[i] <= "9") i++;
+      if (i < n && src[i] === "." && i + 1 < n && src[i + 1] >= "0" && src[i + 1] <= "9") {
+        i++;
+        while (i < n && src[i] >= "0" && src[i] <= "9") i++;
+      }
+      if (i < n && (src[i] === "e" || src[i] === "E")) {
+        i++;
+        if (i < n && (src[i] === "+" || src[i] === "-")) i++;
+        while (i < n && src[i] >= "0" && src[i] <= "9") i++;
+      }
+      tokens.push({ t: 15 /* Num */, v: +src.slice(start, i) });
+      continue;
+    }
+    if (c === "$" && i + 1 < n && (src[i + 1] >= "a" && src[i + 1] <= "z" || src[i + 1] >= "A" && src[i + 1] <= "Z" || src[i + 1] === "_")) {
+      const start = i;
+      i++;
+      while (i < n && (src[i] >= "a" && src[i] <= "z" || src[i] >= "A" && src[i] <= "Z" || src[i] >= "0" && src[i] <= "9" || src[i] === "_"))
+        i++;
+      tokens.push({ t: 18 /* StateVar */, v: src.slice(start, i) });
+      continue;
+    }
+    const isAlpha = c >= "a" && c <= "z" || c >= "A" && c <= "Z" || c === "_";
+    if (isAlpha) {
+      const start = i;
+      while (i < n && (src[i] >= "a" && src[i] <= "z" || src[i] >= "A" && src[i] <= "Z" || src[i] >= "0" && src[i] <= "9" || src[i] === "_"))
+        i++;
+      const word = src.slice(start, i);
+      if (word === "true") {
+        tokens.push({ t: 10 /* True */ });
+        continue;
+      }
+      if (word === "false") {
+        tokens.push({ t: 11 /* False */ });
+        continue;
+      }
+      if (word === "null") {
+        tokens.push({ t: 12 /* Null */ });
+        continue;
+      }
+      const kind = c >= "A" && c <= "Z" ? 17 /* Type */ : 16 /* Ident */;
+      tokens.push({ t: kind, v: word });
+      continue;
+    }
+    if (c === "@" && i + 1 < n && (src[i + 1] >= "a" && src[i + 1] <= "z" || src[i + 1] >= "A" && src[i + 1] <= "Z" || src[i + 1] === "_")) {
+      i++;
+      const start = i;
+      while (i < n && (src[i] >= "a" && src[i] <= "z" || src[i] >= "A" && src[i] <= "Z" || src[i] >= "0" && src[i] <= "9" || src[i] === "_"))
         i++;
-      }
+      tokens.push({ t: 35 /* BuiltinCall */, v: src.slice(start, i) });
       continue;
     }
-    if (c === ">") {
-      if (i + 1 < n && src[i + 1] === "=") {
-        tokens.push({ t: 29 /* GreaterEq */ });
-        i += 2;
-      } else {
-        tokens.push({ t: 27 /* Greater */ });
-        i++;
+    i++;
+  }
+  tokens.push({ t: 13 /* EOF */ });
+  return tokens;
+}
+
+// src/genui/lang/parser/types.ts
+function isElementNode(value) {
+  if (!value || typeof value !== "object" || Array.isArray(value)) return false;
+  const node = value;
+  return node.type === "element" && typeof node.typeName === "string" && typeof node.props === "object" && node.props !== null && typeof node.partial === "boolean";
+}
+
+// src/genui/lang/parser/materialize.ts
+function containsDynamicValue(v) {
+  if (v == null || typeof v !== "object") return false;
+  if (isASTNode(v)) return true;
+  if (Array.isArray(v)) return v.some(containsDynamicValue);
+  if (isElementNode(v)) {
+    return Object.values(v.props).some(containsDynamicValue);
+  }
+  const obj = v;
+  return Object.values(obj).some(containsDynamicValue);
+}
+function resolveRef(name, ctx, mode) {
+  if (ctx.visited.has(name)) {
+    ctx.unres.push(name);
+    return mode === "expr" ? { k: "Ph", n: name } : null;
+  }
+  if (!ctx.syms.has(name)) {
+    ctx.unres.push(name);
+    return mode === "expr" ? { k: "Ph", n: name } : null;
+  }
+  const target = ctx.syms.get(name);
+  ctx.unreached?.delete(name);
+  if (target.k === "Comp" && isReservedCall(target.name)) {
+    const refType = target.name === RESERVED_CALLS.Mutation ? "mutation" : "query";
+    return { k: "RuntimeRef", n: name, refType };
+  }
+  ctx.visited.add(name);
+  const prevStatementId = ctx.currentStatementId;
+  ctx.currentStatementId = name;
+  try {
+    const result = mode === "value" ? materializeValue(target, ctx) : materializeExpr(target, ctx);
+    if (mode === "value" && isElementNode(result)) {
+      result.statementId = name;
+    }
+    return result;
+  } finally {
+    ctx.currentStatementId = prevStatementId;
+    ctx.visited.delete(name);
+  }
+}
+function materializeLazyBuiltin(node, ctx, scopedRefs) {
+  if (!LAZY_BUILTINS.has(node.name) || node.args.length < 3) return null;
+  const varArg = node.args[1];
+  const varName = varArg.k === "Ref" ? varArg.n : varArg.k === "Str" ? varArg.v : null;
+  if (!varName) return null;
+  const nextScopedRefs = new Set(scopedRefs);
+  nextScopedRefs.add(varName);
+  const recursedArgs = node.args.map(
+    (a, i) => i === 1 ? a : materializeExprInternal(a, ctx, nextScopedRefs)
+  );
+  return { ...node, args: recursedArgs };
+}
+function materializeExprInternal(node, ctx, scopedRefs) {
+  switch (node.k) {
+    case "Ref":
+      return scopedRefs.has(node.n) ? node : resolveRef(node.n, ctx, "expr");
+    case "Ph":
+      return node;
+    case "Comp": {
+      const lazy2 = materializeLazyBuiltin(node, ctx, scopedRefs);
+      if (lazy2) return lazy2;
+      const recursedArgs = node.args.map((a) => materializeExprInternal(a, ctx, scopedRefs));
+      if (isBuiltin(node.name) || isReservedCall(node.name)) {
+        return { ...node, args: recursedArgs };
       }
-      continue;
+      const def = ctx.cat?.get(node.name);
+      if (def) {
+        const mappedProps = {};
+        for (let i = 0; i < def.params.length && i < recursedArgs.length; i++) {
+          mappedProps[def.params[i].name] = recursedArgs[i];
+        }
+        return { ...node, args: recursedArgs, mappedProps };
+      }
+      ctx.errors.push({
+        code: "unknown-component",
+        component: node.name,
+        path: "",
+        message: `Unknown component "${node.name}" \u2014 not found in catalog or builtins`,
+        statementId: ctx.currentStatementId
+      });
+      return { ...node, args: recursedArgs };
     }
-    if (c === "<") {
-      if (i + 1 < n && src[i + 1] === "=") {
-        tokens.push({ t: 30 /* LessEq */ });
-        i += 2;
-      } else {
-        tokens.push({ t: 28 /* Less */ });
-        i++;
+    case "Arr":
+      return { ...node, els: node.els.map((e) => materializeExprInternal(e, ctx, scopedRefs)) };
+    case "Obj":
+      return {
+        ...node,
+        entries: node.entries.map(
+          ([k, v]) => [k, materializeExprInternal(v, ctx, scopedRefs)]
+        )
+      };
+    case "BinOp":
+      return {
+        ...node,
+        left: materializeExprInternal(node.left, ctx, scopedRefs),
+        right: materializeExprInternal(node.right, ctx, scopedRefs)
+      };
+    case "UnaryOp":
+      return { ...node, operand: materializeExprInternal(node.operand, ctx, scopedRefs) };
+    case "Ternary":
+      return {
+        ...node,
+        cond: materializeExprInternal(node.cond, ctx, scopedRefs),
+        then: materializeExprInternal(node.then, ctx, scopedRefs),
+        else: materializeExprInternal(node.else, ctx, scopedRefs)
+      };
+    case "Member":
+      return { ...node, obj: materializeExprInternal(node.obj, ctx, scopedRefs) };
+    case "Index":
+      return {
+        ...node,
+        obj: materializeExprInternal(node.obj, ctx, scopedRefs),
+        index: materializeExprInternal(node.index, ctx, scopedRefs)
+      };
+    case "Assign":
+      return { ...node, value: materializeExprInternal(node.value, ctx, scopedRefs) };
+    // Literals, StateRef, RuntimeRef — pass through unchanged
+    default:
+      return node;
+  }
+}
+function materializeExpr(node, ctx) {
+  return materializeExprInternal(node, ctx, /* @__PURE__ */ new Set());
+}
+function materializeValue(node, ctx) {
+  switch (node.k) {
+    // ── Ref resolution ───────────────────────────────────────────────────
+    case "Ref":
+      return resolveRef(node.n, ctx, "value");
+    // ── Literals → plain values ──────────────────────────────────────────
+    case "Str":
+      return node.v;
+    case "Num":
+      return node.v;
+    case "Bool":
+      return node.v;
+    case "Null":
+      return null;
+    case "Ph":
+      return null;
+    // ── Collections ──────────────────────────────────────────────────────
+    case "Arr": {
+      const items = [];
+      for (const e of node.els) {
+        if (e.k === "Ph") continue;
+        const value = materializeValue(e, ctx);
+        if (value === null && (e.k === "Comp" || e.k === "Ref")) continue;
+        items.push(value);
       }
-      continue;
+      return items;
     }
-    if (c === "&") {
-      if (i + 1 < n && src[i + 1] === "&") {
-        tokens.push({ t: 31 /* And */ });
-        i += 2;
-      } else {
-        tokens.push({ t: 31 /* And */ });
-        i++;
+    case "Obj": {
+      const o = {};
+      for (const [k, v] of node.entries) o[k] = materializeValue(v, ctx);
+      return o;
+    }
+    // ── Component nodes ──────────────────────────────────────────────────
+    case "Comp": {
+      const { name, args } = node;
+      if (isBuiltin(name)) {
+        const lazy2 = materializeLazyBuiltin(node, ctx, /* @__PURE__ */ new Set());
+        if (lazy2) return lazy2;
+        return { ...node, args: args.map((a) => materializeExpr(a, ctx)) };
+      }
+      if (isReservedCall(name)) {
+        ctx.errors.push({
+          code: "inline-reserved",
+          component: name,
+          path: "",
+          message: `${name}() must be declared as a top-level statement, not used inline as a value`,
+          statementId: ctx.currentStatementId
+        });
+        return null;
+      }
+      const def = ctx.cat?.get(name);
+      const props = {};
+      if (def) {
+        for (let i = 0; i < def.params.length && i < args.length; i++) {
+          props[def.params[i].name] = materializeValue(args[i], ctx);
+        }
+        if (args.length > def.params.length) {
+          const excessCount = args.length - def.params.length;
+          ctx.errors.push({
+            code: "excess-args",
+            component: name,
+            path: "",
+            message: `${name} takes ${def.params.length} arg(s), got ${args.length} (${excessCount} excess dropped)`,
+            statementId: ctx.currentStatementId
+          });
+        }
+        const missingRequired = def.params.filter(
+          (p) => p.required && (!(p.name in props) || props[p.name] === null)
+        );
+        if (missingRequired.length) {
+          const stillInvalid = missingRequired.filter((p) => {
+            if (p.defaultValue !== void 0) {
+              props[p.name] = p.defaultValue;
+              return false;
+            }
+            return true;
+          });
+          if (stillInvalid.length) {
+            for (const p of stillInvalid) {
+              const isNull = p.name in props;
+              ctx.errors.push({
+                code: isNull ? "null-required" : "missing-required",
+                component: name,
+                path: `/${p.name}`,
+                message: isNull ? `required field "${p.name}" cannot be null` : `missing required field "${p.name}"`,
+                statementId: ctx.currentStatementId
+              });
+            }
+            return null;
+          }
+        }
+      } else if (!isBuiltin(name) && !isReservedCall(name)) {
+        ctx.errors.push({
+          code: "unknown-component",
+          component: name,
+          path: "",
+          message: `Unknown component "${name}" \u2014 not found in catalog or builtins`,
+          statementId: ctx.currentStatementId
+        });
+        return null;
       }
-      continue;
+      const hasDynamicProps = Object.values(props).some((v) => containsDynamicValue(v));
+      return { type: "element", typeName: name, props, partial: ctx.partial, hasDynamicProps };
     }
-    if (c === "|") {
-      if (i + 1 < n && src[i + 1] === "|") {
-        tokens.push({ t: 32 /* Or */ });
-        i += 2;
-      } else {
-        tokens.push({ t: 32 /* Or */ });
-        i++;
+    // ── Runtime expression nodes → preserve as ASTNode, normalize children ─
+    default: {
+      if (isRuntimeExpr(node)) {
+        return materializeExpr(node, ctx);
       }
-      continue;
-    }
-    if (c === ".") {
-      tokens.push({ t: 19 /* Dot */ });
-      i++;
-      continue;
+      return node;
     }
-    if (c === "?") {
-      tokens.push({ t: 34 /* Question */ });
-      i++;
+  }
+}
+
+// src/genui/lang/parser/statements.ts
+function autoClose(input) {
+  const stack = [];
+  let inStr = false;
+  let esc = false;
+  for (let i = 0; i < input.length; i++) {
+    const c = input[i];
+    if (esc) {
+      esc = false;
       continue;
     }
-    if (c === "+") {
-      tokens.push({ t: 20 /* Plus */ });
-      i++;
+    if (c === "\\" && inStr) {
+      esc = true;
       continue;
     }
-    if (c === "*") {
-      tokens.push({ t: 22 /* Star */ });
-      i++;
+    if (inStr) {
+      if (c === inStr) inStr = false;
       continue;
     }
-    if (c === "/") {
-      tokens.push({ t: 23 /* Slash */ });
-      i++;
+    if (c === '"' || c === "'") {
+      inStr = c;
       continue;
     }
-    if (c === "%") {
-      tokens.push({ t: 24 /* Percent */ });
-      i++;
+    if (c === "(" || c === "[" || c === "{") stack.push(c);
+    else if (c === ")" && stack[stack.length - 1] === "(") stack.pop();
+    else if (c === "]" && stack[stack.length - 1] === "[") stack.pop();
+    else if (c === "}" && stack[stack.length - 1] === "{") stack.pop();
+  }
+  const wasIncomplete = !!inStr || stack.length > 0;
+  if (!wasIncomplete) return { text: input, wasIncomplete: false };
+  let out = input;
+  if (inStr) {
+    if (esc) out += "\\";
+    out += inStr;
+  }
+  for (let j = stack.length - 1; j >= 0; j--)
+    out += stack[j] === "(" ? ")" : stack[j] === "[" ? "]" : "}";
+  return { text: out, wasIncomplete: true };
+}
+function split(tokens) {
+  const stmts = [];
+  let pos = 0;
+  while (pos < tokens.length) {
+    while (pos < tokens.length && tokens[pos].t === 0 /* Newline */) pos++;
+    if (pos >= tokens.length || tokens[pos].t === 13 /* EOF */) break;
+    const tok = tokens[pos];
+    if (tok.t !== 16 /* Ident */ && tok.t !== 17 /* Type */ && tok.t !== 18 /* StateVar */) {
+      while (pos < tokens.length && tokens[pos].t !== 0 /* Newline */ && tokens[pos].t !== 13 /* EOF */) pos++;
       continue;
     }
-    if (c === '"') {
-      const start = i;
-      i++;
-      let isClosed = false;
-      while (i < n) {
-        if (src[i] === "\\") {
-          i += 2;
-        } else if (src[i] === '"') {
-          i++;
-          isClosed = true;
-          break;
-        } else {
-          i++;
-        }
-      }
-      const rawString = src.slice(start, i);
-      try {
-        const validJsonString = isClosed ? rawString : rawString + '"';
-        tokens.push({ t: 14 /* Str */, v: JSON.parse(validJsonString) });
-      } catch {
-        const stripped = rawString.replace(/^"|"$/g, "");
-        tokens.push({ t: 14 /* Str */, v: stripped });
-      }
+    const id = tok.v;
+    const idTokenType = tok.t;
+    pos++;
+    if (pos >= tokens.length || tokens[pos].t !== 9 /* Equals */) {
+      while (pos < tokens.length && tokens[pos].t !== 0 /* Newline */ && tokens[pos].t !== 13 /* EOF */) pos++;
       continue;
     }
-    if (c === "'") {
-      i++;
-      let result = "";
-      while (i < n) {
-        if (src[i] === "\\") {
-          i++;
-          if (i < n) {
-            const esc = src[i];
-            if (esc === "'") result += "'";
-            else if (esc === "\\") result += "\\";
-            else if (esc === "n") result += "\n";
-            else if (esc === "t") result += "	";
-            else result += esc;
-            i++;
-          }
-        } else if (src[i] === "'") {
-          i++;
-          break;
-        } else {
-          result += src[i];
-          i++;
+    pos++;
+    const expr = [];
+    let depth = 0;
+    let ternaryDepth = 0;
+    while (pos < tokens.length && tokens[pos].t !== 13 /* EOF */) {
+      const tt = tokens[pos].t;
+      if (tt === 0 /* Newline */ && depth <= 0 && ternaryDepth <= 0) {
+        let peek = pos + 1;
+        while (peek < tokens.length && tokens[peek].t === 0 /* Newline */) peek++;
+        const nextT = peek < tokens.length ? tokens[peek].t : 13 /* EOF */;
+        if (nextT === 34 /* Question */ || nextT === 8 /* Colon */ && ternaryDepth > 0) {
+          pos++;
+          continue;
         }
+        break;
       }
-      tokens.push({ t: 14 /* Str */, v: result });
-      continue;
-    }
-    if (c === "-") {
-      const prev = tokens.length > 0 ? tokens[tokens.length - 1] : null;
-      const afterValue = prev != null && (prev.t === 15 /* Num */ || prev.t === 14 /* Str */ || prev.t === 16 /* Ident */ || prev.t === 17 /* Type */ || prev.t === 2 /* RParen */ || prev.t === 4 /* RBrack */ || prev.t === 10 /* True */ || prev.t === 11 /* False */ || prev.t === 12 /* Null */ || prev.t === 18 /* StateVar */ || prev.t === 35 /* BuiltinCall */);
-      if (!afterValue && i + 1 < n && src[i + 1] >= "0" && src[i + 1] <= "9") ; else {
-        tokens.push({ t: 21 /* Minus */ });
-        i++;
-        continue;
-      }
-    }
-    const isDigit = c >= "0" && c <= "9";
-    const isNegDigit = c === "-" && i + 1 < n && src[i + 1] >= "0" && src[i + 1] <= "9";
-    if (isDigit || isNegDigit) {
-      const start = i;
-      if (src[i] === "-") i++;
-      while (i < n && src[i] >= "0" && src[i] <= "9") i++;
-      if (i < n && src[i] === "." && i + 1 < n && src[i + 1] >= "0" && src[i + 1] <= "9") {
-        i++;
-        while (i < n && src[i] >= "0" && src[i] <= "9") i++;
-      }
-      if (i < n && (src[i] === "e" || src[i] === "E")) {
-        i++;
-        if (i < n && (src[i] === "+" || src[i] === "-")) i++;
-        while (i < n && src[i] >= "0" && src[i] <= "9") i++;
-      }
-      tokens.push({ t: 15 /* Num */, v: +src.slice(start, i) });
-      continue;
-    }
-    if (c === "$" && i + 1 < n && (src[i + 1] >= "a" && src[i + 1] <= "z" || src[i + 1] >= "A" && src[i + 1] <= "Z" || src[i + 1] === "_")) {
-      const start = i;
-      i++;
-      while (i < n && (src[i] >= "a" && src[i] <= "z" || src[i] >= "A" && src[i] <= "Z" || src[i] >= "0" && src[i] <= "9" || src[i] === "_"))
-        i++;
-      tokens.push({ t: 18 /* StateVar */, v: src.slice(start, i) });
-      continue;
-    }
-    const isAlpha = c >= "a" && c <= "z" || c >= "A" && c <= "Z" || c === "_";
-    if (isAlpha) {
-      const start = i;
-      while (i < n && (src[i] >= "a" && src[i] <= "z" || src[i] >= "A" && src[i] <= "Z" || src[i] >= "0" && src[i] <= "9" || src[i] === "_"))
-        i++;
-      const word = src.slice(start, i);
-      if (word === "true") {
-        tokens.push({ t: 10 /* True */ });
-        continue;
-      }
-      if (word === "false") {
-        tokens.push({ t: 11 /* False */ });
-        continue;
-      }
-      if (word === "null") {
-        tokens.push({ t: 12 /* Null */ });
+      if (tt === 0 /* Newline */) {
+        pos++;
         continue;
       }
-      const kind = c >= "A" && c <= "Z" ? 17 /* Type */ : 16 /* Ident */;
-      tokens.push({ t: kind, v: word });
-      continue;
-    }
-    if (c === "@" && i + 1 < n && (src[i + 1] >= "a" && src[i + 1] <= "z" || src[i + 1] >= "A" && src[i + 1] <= "Z" || src[i + 1] === "_")) {
-      i++;
-      const start = i;
-      while (i < n && (src[i] >= "a" && src[i] <= "z" || src[i] >= "A" && src[i] <= "Z" || src[i] >= "0" && src[i] <= "9" || src[i] === "_"))
-        i++;
-      tokens.push({ t: 35 /* BuiltinCall */, v: src.slice(start, i) });
-      continue;
+      if (tt === 1 /* LParen */ || tt === 3 /* LBrack */ || tt === 5 /* LBrace */) depth++;
+      else if ((tt === 2 /* RParen */ || tt === 4 /* RBrack */ || tt === 6 /* RBrace */) && depth > 0) depth--;
+      else if (tt === 34 /* Question */ && depth === 0) ternaryDepth++;
+      else if (tt === 8 /* Colon */ && depth === 0 && ternaryDepth > 0) ternaryDepth--;
+      expr.push(tokens[pos++]);
     }
-    i++;
+    if (expr.length) stmts.push({ id, idTokenType, tokens: expr });
   }
-  tokens.push({ t: 13 /* EOF */ });
-  return tokens;
-}
-
-// src/genui/lang/parser/types.ts
-function isElementNode(value) {
-  if (!value || typeof value !== "object" || Array.isArray(value)) return false;
-  const node = value;
-  return node.type === "element" && typeof node.typeName === "string" && typeof node.props === "object" && node.props !== null && typeof node.partial === "boolean";
+  return stmts;
 }
 
-// src/genui/lang/parser/materialize.ts
-function containsDynamicValue(v) {
-  if (v == null || typeof v !== "object") return false;
-  if (isASTNode(v)) return true;
-  if (Array.isArray(v)) return v.some(containsDynamicValue);
-  if (isElementNode(v)) {
-    return Object.values(v.props).some(containsDynamicValue);
-  }
-  const obj = v;
-  return Object.values(obj).some(containsDynamicValue);
+// src/genui/lang/parser/parser.ts
+function emptyResult(incomplete = true) {
+  return {
+    root: null,
+    meta: {
+      incomplete,
+      unresolved: [],
+      orphaned: [],
+      statementCount: 0,
+      errors: []
+    },
+    stateDeclarations: {},
+    queryStatements: [],
+    mutationStatements: []
+  };
 }
-function resolveRef(name, ctx, mode) {
-  if (ctx.visited.has(name)) {
-    ctx.unres.push(name);
-    return mode === "expr" ? { k: "Ph", n: name } : null;
+function collectQueryDeps(node) {
+  if (!isASTNode(node)) return [];
+  const refs = /* @__PURE__ */ new Set();
+  walkAST(node, (current) => {
+    if (current.k === "StateRef") refs.add(current.n);
+  });
+  return [...refs];
+}
+function classifyStatement(raw, expr) {
+  if (expr.k === "Comp" && expr.name === RESERVED_CALLS.Query) {
+    const deps = collectQueryDeps(expr.args[1]);
+    return {
+      kind: "query",
+      id: raw.id,
+      call: { callee: RESERVED_CALLS.Query, args: expr.args },
+      expr,
+      deps: deps.length > 0 ? deps : void 0
+    };
   }
-  if (!ctx.syms.has(name)) {
-    ctx.unres.push(name);
-    return mode === "expr" ? { k: "Ph", n: name } : null;
+  if (expr.k === "Comp" && expr.name === RESERVED_CALLS.Mutation) {
+    return {
+      kind: "mutation",
+      id: raw.id,
+      call: { callee: RESERVED_CALLS.Mutation, args: expr.args },
+      expr
+    };
   }
-  const target = ctx.syms.get(name);
-  ctx.unreached?.delete(name);
-  if (target.k === "Comp" && isReservedCall(target.name)) {
-    const refType = target.name === RESERVED_CALLS.Mutation ? "mutation" : "query";
-    return { k: "RuntimeRef", n: name, refType };
+  if (raw.idTokenType === 18 /* StateVar */) {
+    return { kind: "state", id: raw.id, init: expr };
   }
-  ctx.visited.add(name);
-  const prevStatementId = ctx.currentStatementId;
-  ctx.currentStatementId = name;
-  try {
-    const result = mode === "value" ? materializeValue(target, ctx) : materializeExpr(target, ctx);
-    if (mode === "value" && isElementNode(result)) {
-      result.statementId = name;
+  return { kind: "value", id: raw.id, expr };
+}
+function extractStatements(stmts, ctx) {
+  const stateDeclarations = {};
+  const queryStatements = [];
+  const mutationStatements = [];
+  for (const stmt of stmts) {
+    switch (stmt.kind) {
+      case "state":
+        stateDeclarations[stmt.id] = materializeValue(stmt.init, ctx);
+        break;
+      case "query":
+        queryStatements.push({
+          statementId: stmt.id,
+          toolAST: stmt.call.args[0] ?? null,
+          argsAST: stmt.call.args[1] ?? null,
+          defaultsAST: stmt.call.args[2] ?? null,
+          refreshAST: stmt.call.args[3] ?? null,
+          deps: stmt.deps,
+          complete: true
+        });
+        break;
+      case "mutation":
+        mutationStatements.push({
+          statementId: stmt.id,
+          toolAST: stmt.call.args[0] ?? null,
+          argsAST: stmt.call.args[1] ?? null
+        });
+        break;
     }
-    return result;
-  } finally {
-    ctx.currentStatementId = prevStatementId;
-    ctx.visited.delete(name);
   }
-}
-function materializeLazyBuiltin(node, ctx, scopedRefs) {
-  if (!LAZY_BUILTINS.has(node.name) || node.args.length < 3) return null;
-  const varArg = node.args[1];
-  const varName = varArg.k === "Ref" ? varArg.n : varArg.k === "Str" ? varArg.v : null;
-  if (!varName) return null;
-  const nextScopedRefs = new Set(scopedRefs);
-  nextScopedRefs.add(varName);
-  const recursedArgs = node.args.map(
-    (a, i) => i === 1 ? a : materializeExprInternal(a, ctx, nextScopedRefs)
-  );
-  return { ...node, args: recursedArgs };
-}
-function materializeExprInternal(node, ctx, scopedRefs) {
-  switch (node.k) {
-    case "Ref":
-      return scopedRefs.has(node.n) ? node : resolveRef(node.n, ctx, "expr");
-    case "Ph":
-      return node;
-    case "Comp": {
-      const lazy2 = materializeLazyBuiltin(node, ctx, scopedRefs);
-      if (lazy2) return lazy2;
-      const recursedArgs = node.args.map((a) => materializeExprInternal(a, ctx, scopedRefs));
-      if (isBuiltin(node.name) || isReservedCall(node.name)) {
-        return { ...node, args: recursedArgs };
-      }
-      const def = ctx.cat?.get(node.name);
-      if (def) {
-        const mappedProps = {};
-        for (let i = 0; i < def.params.length && i < recursedArgs.length; i++) {
-          mappedProps[def.params[i].name] = recursedArgs[i];
+  for (const stmt of stmts) {
+    const nodes = stmt.kind === "state" ? [stmt.init] : stmt.kind === "value" ? [stmt.expr] : stmt.kind === "query" || stmt.kind === "mutation" ? stmt.call.args : [];
+    for (const node of nodes) {
+      for (const dep of collectQueryDeps(node)) {
+        if (!(dep in stateDeclarations)) {
+          stateDeclarations[dep] = null;
         }
-        return { ...node, args: recursedArgs, mappedProps };
       }
-      ctx.errors.push({
-        code: "unknown-component",
-        component: node.name,
-        path: "",
-        message: `Unknown component "${node.name}" \u2014 not found in catalog or builtins`,
-        statementId: ctx.currentStatementId
-      });
-      return { ...node, args: recursedArgs };
     }
-    case "Arr":
-      return { ...node, els: node.els.map((e) => materializeExprInternal(e, ctx, scopedRefs)) };
-    case "Obj":
-      return {
-        ...node,
-        entries: node.entries.map(
-          ([k, v]) => [k, materializeExprInternal(v, ctx, scopedRefs)]
-        )
-      };
-    case "BinOp":
-      return {
-        ...node,
-        left: materializeExprInternal(node.left, ctx, scopedRefs),
-        right: materializeExprInternal(node.right, ctx, scopedRefs)
-      };
-    case "UnaryOp":
-      return { ...node, operand: materializeExprInternal(node.operand, ctx, scopedRefs) };
-    case "Ternary":
-      return {
-        ...node,
-        cond: materializeExprInternal(node.cond, ctx, scopedRefs),
-        then: materializeExprInternal(node.then, ctx, scopedRefs),
-        else: materializeExprInternal(node.else, ctx, scopedRefs)
-      };
-    case "Member":
-      return { ...node, obj: materializeExprInternal(node.obj, ctx, scopedRefs) };
-    case "Index":
-      return {
-        ...node,
-        obj: materializeExprInternal(node.obj, ctx, scopedRefs),
-        index: materializeExprInternal(node.index, ctx, scopedRefs)
-      };
-    case "Assign":
-      return { ...node, value: materializeExprInternal(node.value, ctx, scopedRefs) };
-    // Literals, StateRef, RuntimeRef — pass through unchanged
-    default:
-      return node;
   }
+  return { stateDeclarations, queryStatements, mutationStatements };
 }
-function materializeExpr(node, ctx) {
-  return materializeExprInternal(node, ctx, /* @__PURE__ */ new Set());
+var DEFAULT_ROOT_STATEMENT_ID = "root";
+function isComponentStatement(stmt) {
+  return stmt.kind === "value" && stmt.expr.k === "Comp" && !isBuiltin(stmt.expr.name) && stmt.expr.name !== RESERVED_CALLS.Query && stmt.expr.name !== RESERVED_CALLS.Mutation;
 }
-function materializeValue(node, ctx) {
-  switch (node.k) {
-    // ── Ref resolution ───────────────────────────────────────────────────
-    case "Ref":
-      return resolveRef(node.n, ctx, "value");
-    // ── Literals → plain values ──────────────────────────────────────────
-    case "Str":
-      return node.v;
-    case "Num":
-      return node.v;
-    case "Bool":
-      return node.v;
-    case "Null":
-      return null;
-    case "Ph":
-      return null;
-    // ── Collections ──────────────────────────────────────────────────────
-    case "Arr": {
-      const items = [];
-      for (const e of node.els) {
-        if (e.k === "Ph") continue;
-        const value = materializeValue(e, ctx);
-        if (value === null && (e.k === "Comp" || e.k === "Ref")) continue;
-        items.push(value);
+function pickEntryId(stmtMap, typedStmts, firstId, rootName) {
+  if (stmtMap.has(DEFAULT_ROOT_STATEMENT_ID)) return DEFAULT_ROOT_STATEMENT_ID;
+  if (rootName && stmtMap.has(rootName)) return rootName;
+  const preferredComponent = rootName ? typedStmts.find((stmt) => isComponentStatement(stmt) && stmt.expr.name === rootName) : void 0;
+  if (preferredComponent) return preferredComponent.id;
+  const firstComponent = typedStmts.find(isComponentStatement);
+  return firstComponent?.id ?? firstId;
+}
+function buildResult(stmtMap, typedStmts, firstId, wasIncomplete, stmtCount, cat, rootName) {
+  const entryId = pickEntryId(stmtMap, typedStmts, firstId, rootName);
+  if (!stmtMap.has(entryId)) return emptyResult(wasIncomplete);
+  const syms = /* @__PURE__ */ new Map();
+  for (const [id, stmt] of stmtMap) {
+    syms.set(id, stmt.kind === "state" ? stmt.init : stmt.expr);
+  }
+  const unres = [];
+  const errors = [];
+  const unreached = /* @__PURE__ */ new Set();
+  for (const [id, stmt] of stmtMap) {
+    if (id === entryId) continue;
+    if (stmt.kind === "state" || stmt.kind === "query" || stmt.kind === "mutation") continue;
+    unreached.add(id);
+  }
+  const ctx = {
+    syms,
+    cat,
+    errors,
+    unres,
+    visited: /* @__PURE__ */ new Set(),
+    partial: wasIncomplete,
+    currentStatementId: entryId,
+    unreached
+  };
+  const materialized = materializeValue(syms.get(entryId), ctx);
+  const root = isElementNode(materialized) ? materialized : null;
+  if (root) root.statementId = entryId;
+  const { stateDeclarations, queryStatements, mutationStatements } = extractStatements(
+    typedStmts,
+    ctx
+  );
+  const orphaned = [...unreached];
+  return {
+    root,
+    meta: {
+      incomplete: wasIncomplete,
+      unresolved: unres,
+      orphaned,
+      statementCount: stmtCount,
+      errors
+    },
+    stateDeclarations,
+    queryStatements,
+    mutationStatements
+  };
+}
+function skipString(input, start) {
+  if (input[start] !== '"') return start;
+  let i = start + 1;
+  while (i < input.length) {
+    const c = input[i];
+    if (c === "\\") {
+      i += 2;
+    } else if (c === '"') {
+      return i + 1;
+    } else {
+      i++;
+    }
+  }
+  return i;
+}
+function stripFences(input) {
+  const blocks = [];
+  let i = 0;
+  while (i < input.length) {
+    let fenceStart = -1;
+    while (i < input.length) {
+      const nextI = skipString(input, i);
+      if (nextI > i) {
+        i = nextI;
+        continue;
       }
-      return items;
+      const c = input[i];
+      if (c === "`" && i + 1 < input.length && input[i + 1] === "`" && i + 2 < input.length && input[i + 2] === "`") {
+        fenceStart = i;
+        break;
+      }
+      i++;
     }
-    case "Obj": {
-      const o = {};
-      for (const [k, v] of node.entries) o[k] = materializeValue(v, ctx);
-      return o;
+    if (fenceStart === -1) break;
+    let j = fenceStart + 3;
+    while (j < input.length && input[j] !== "\n") j++;
+    if (j >= input.length) {
+      blocks.push(input.slice(fenceStart + 3).replace(/^[^\n]*\n?/, ""));
+      i = input.length;
+      break;
     }
-    // ── Component nodes ──────────────────────────────────────────────────
-    case "Comp": {
-      const { name, args } = node;
-      if (isBuiltin(name)) {
-        const lazy2 = materializeLazyBuiltin(node, ctx, /* @__PURE__ */ new Set());
-        if (lazy2) return lazy2;
-        return { ...node, args: args.map((a) => materializeExpr(a, ctx)) };
+    j++;
+    let closePos = -1;
+    let k = j;
+    while (k < input.length) {
+      const nextK = skipString(input, k);
+      if (nextK > k) {
+        k = nextK;
+        continue;
       }
-      if (isReservedCall(name)) {
-        ctx.errors.push({
-          code: "inline-reserved",
-          component: name,
-          path: "",
-          message: `${name}() must be declared as a top-level statement, not used inline as a value`,
-          statementId: ctx.currentStatementId
-        });
-        return null;
+      const c = input[k];
+      if (c === "`" && k + 1 < input.length && input[k + 1] === "`" && k + 2 < input.length && input[k + 2] === "`") {
+        closePos = k;
+        break;
       }
-      const def = ctx.cat?.get(name);
-      const props = {};
-      if (def) {
-        for (let i = 0; i < def.params.length && i < args.length; i++) {
-          props[def.params[i].name] = materializeValue(args[i], ctx);
-        }
-        if (args.length > def.params.length) {
-          const excessCount = args.length - def.params.length;
-          ctx.errors.push({
-            code: "excess-args",
-            component: name,
-            path: "",
-            message: `${name} takes ${def.params.length} arg(s), got ${args.length} (${excessCount} excess dropped)`,
-            statementId: ctx.currentStatementId
-          });
-        }
-        const missingRequired = def.params.filter(
-          (p) => p.required && (!(p.name in props) || props[p.name] === null)
-        );
-        if (missingRequired.length) {
-          const stillInvalid = missingRequired.filter((p) => {
-            if (p.defaultValue !== void 0) {
-              props[p.name] = p.defaultValue;
-              return false;
-            }
-            return true;
-          });
-          if (stillInvalid.length) {
-            for (const p of stillInvalid) {
-              const isNull = p.name in props;
-              ctx.errors.push({
-                code: isNull ? "null-required" : "missing-required",
-                component: name,
-                path: `/${p.name}`,
-                message: isNull ? `required field "${p.name}" cannot be null` : `missing required field "${p.name}"`,
-                statementId: ctx.currentStatementId
-              });
-            }
-            return null;
-          }
+      k++;
+    }
+    if (closePos !== -1) {
+      blocks.push(input.slice(j, closePos));
+      i = closePos + 3;
+    } else {
+      blocks.push(input.slice(j));
+      i = input.length;
+    }
+  }
+  if (blocks.length > 0) return blocks.join("\n");
+  if (input.startsWith("```")) {
+    let j = 3;
+    while (j < input.length && input[j] !== "\n") j++;
+    const start = j < input.length ? j + 1 : 3;
+    const body = input.slice(start);
+    const trailingFence = body.lastIndexOf("```");
+    if (trailingFence !== -1) {
+      return body.slice(0, trailingFence);
+    }
+    return body;
+  }
+  return input;
+}
+function stripComments(input) {
+  let inStr = false;
+  return input.split("\n").map((line) => {
+    for (let i = 0; i < line.length; i++) {
+      const c = line[i];
+      if (inStr) {
+        if (c === "\\" && i + 1 < line.length) {
+          i++;
+          continue;
         }
-      } else if (!isBuiltin(name) && !isReservedCall(name)) {
-        ctx.errors.push({
-          code: "unknown-component",
-          component: name,
-          path: "",
-          message: `Unknown component "${name}" \u2014 not found in catalog or builtins`,
-          statementId: ctx.currentStatementId
-        });
-        return null;
+        if (c === inStr) inStr = false;
+        continue;
       }
-      const hasDynamicProps = Object.values(props).some((v) => containsDynamicValue(v));
-      return { type: "element", typeName: name, props, partial: ctx.partial, hasDynamicProps };
-    }
-    // ── Runtime expression nodes → preserve as ASTNode, normalize children ─
-    default: {
-      if (isRuntimeExpr(node)) {
-        return materializeExpr(node, ctx);
+      if (c === '"' || c === "'") {
+        inStr = c;
+        continue;
+      }
+      if (c === "/" && line[i + 1] === "/") {
+        return line.substring(0, i).trimEnd();
+      }
+      if (c === "#") {
+        return line.substring(0, i).trimEnd();
       }
-      return node;
     }
+    return line;
+  }).join("\n");
+}
+function preprocess(input) {
+  return stripComments(stripFences(input.trim())).trim();
+}
+function parse(input, cat, rootName) {
+  const trimmed = preprocess(input);
+  if (!trimmed) return emptyResult();
+  const { text: text2, wasIncomplete } = autoClose(trimmed);
+  const stmts = split(tokenize(text2));
+  if (!stmts.length) return emptyResult(wasIncomplete);
+  const stmtMap = /* @__PURE__ */ new Map();
+  let firstId = "";
+  for (const s of stmts) {
+    const expr = parseExpression(s.tokens);
+    const stmt = classifyStatement(s, expr);
+    stmtMap.set(s.id, stmt);
+    if (!firstId) firstId = s.id;
   }
+  const typedStmts = [...stmtMap.values()];
+  return buildResult(stmtMap, typedStmts, firstId, wasIncomplete, stmtMap.size, cat, rootName);
 }
-
-// src/genui/lang/parser/statements.ts
-function autoClose(input) {
-  const stack = [];
-  let inStr = false;
-  let esc = false;
-  for (let i = 0; i < input.length; i++) {
-    const c = input[i];
-    if (esc) {
-      esc = false;
-      continue;
+function createStreamParser(cat, rootName) {
+  let buf = "";
+  let cleaned = "";
+  let completedEnd = 0;
+  const completedStmtMap = /* @__PURE__ */ new Map();
+  let firstId = "";
+  function addStmt(text2) {
+    const t = text2.trim();
+    if (!t) return;
+    for (const s of split(tokenize(t))) {
+      const expr = parseExpression(s.tokens);
+      const stmt = classifyStatement(s, expr);
+      completedStmtMap.set(s.id, stmt);
+      if (!firstId) firstId = s.id;
+    }
+  }
+  function refreshCleaned() {
+    const next = preprocess(buf);
+    if (!next.startsWith(cleaned.slice(0, completedEnd))) {
+      completedEnd = 0;
+      completedStmtMap.clear();
+      firstId = "";
+    }
+    cleaned = next;
+  }
+  function scanNewCompleted() {
+    let depth = 0, ternaryDepth = 0, inStr = false, esc = false;
+    let stmtStart = completedEnd;
+    for (let i = completedEnd; i < cleaned.length; i++) {
+      const c = cleaned[i];
+      if (esc) {
+        esc = false;
+        continue;
+      }
+      if (c === "\\" && inStr) {
+        esc = true;
+        continue;
+      }
+      if (inStr) {
+        if (c === inStr) inStr = false;
+        continue;
+      }
+      if (c === '"' || c === "'") {
+        inStr = c;
+        continue;
+      }
+      if (c === "(" || c === "[" || c === "{") depth++;
+      else if (c === ")" || c === "]" || c === "}") depth = Math.max(0, depth - 1);
+      else if (c === "?" && depth === 0) ternaryDepth++;
+      else if (c === ":" && depth === 0 && ternaryDepth > 0) ternaryDepth--;
+      else if (c === "\n" && depth <= 0 && ternaryDepth <= 0) {
+        let peek = i + 1;
+        while (peek < cleaned.length && (cleaned[peek] === " " || cleaned[peek] === "	" || cleaned[peek] === "\r" || cleaned[peek] === "\n"))
+          peek++;
+        if (peek < cleaned.length && (cleaned[peek] === "?" || cleaned[peek] === ":" && ternaryDepth > 0)) {
+          continue;
+        }
+        const t = cleaned.slice(stmtStart, i).trim();
+        if (t) addStmt(t);
+        stmtStart = i + 1;
+        completedEnd = i + 1;
+      }
     }
-    if (c === "\\" && inStr) {
-      esc = true;
-      continue;
+    return stmtStart;
+  }
+  function currentResult() {
+    refreshCleaned();
+    const pendingStart = scanNewCompleted();
+    const pendingText = cleaned.slice(pendingStart).trim();
+    if (!pendingText) {
+      if (completedStmtMap.size === 0) return emptyResult();
+      return buildResult(
+        completedStmtMap,
+        [...completedStmtMap.values()],
+        firstId,
+        false,
+        completedStmtMap.size,
+        cat,
+        rootName
+      );
     }
-    if (inStr) {
-      if (c === inStr) inStr = false;
-      continue;
+    const { text: closed, wasIncomplete } = autoClose(pendingText);
+    const stmts = split(tokenize(closed));
+    if (!stmts.length) {
+      if (completedStmtMap.size === 0) return emptyResult(wasIncomplete);
+      return buildResult(
+        completedStmtMap,
+        [...completedStmtMap.values()],
+        firstId,
+        wasIncomplete,
+        completedStmtMap.size,
+        cat,
+        rootName
+      );
     }
-    if (c === '"' || c === "'") {
-      inStr = c;
-      continue;
+    const allStmtMap = new Map(completedStmtMap);
+    for (const s of stmts) {
+      const expr = parseExpression(s.tokens);
+      const stmt = classifyStatement(s, expr);
+      allStmtMap.set(s.id, stmt);
     }
-    if (c === "(" || c === "[" || c === "{") stack.push(c);
-    else if (c === ")" && stack[stack.length - 1] === "(") stack.pop();
-    else if (c === "]" && stack[stack.length - 1] === "[") stack.pop();
-    else if (c === "}" && stack[stack.length - 1] === "{") stack.pop();
+    const allTypedStmts = [...allStmtMap.values()];
+    const fid = firstId || stmts[0].id;
+    return buildResult(
+      allStmtMap,
+      allTypedStmts,
+      fid,
+      wasIncomplete,
+      allStmtMap.size,
+      cat,
+      rootName
+    );
   }
-  const wasIncomplete = !!inStr || stack.length > 0;
-  if (!wasIncomplete) return { text: input, wasIncomplete: false };
-  let out = input;
-  if (inStr) {
-    if (esc) out += "\\";
-    out += inStr;
+  function reset() {
+    buf = "";
+    cleaned = "";
+    completedEnd = 0;
+    completedStmtMap.clear();
+    firstId = "";
   }
-  for (let j = stack.length - 1; j >= 0; j--)
-    out += stack[j] === "(" ? ")" : stack[j] === "[" ? "]" : "}";
-  return { text: out, wasIncomplete: true };
-}
-function split(tokens) {
-  const stmts = [];
-  let pos = 0;
-  while (pos < tokens.length) {
-    while (pos < tokens.length && tokens[pos].t === 0 /* Newline */) pos++;
-    if (pos >= tokens.length || tokens[pos].t === 13 /* EOF */) break;
-    const tok = tokens[pos];
-    if (tok.t !== 16 /* Ident */ && tok.t !== 17 /* Type */ && tok.t !== 18 /* StateVar */) {
-      while (pos < tokens.length && tokens[pos].t !== 0 /* Newline */ && tokens[pos].t !== 13 /* EOF */) pos++;
-      continue;
-    }
-    const id = tok.v;
-    const idTokenType = tok.t;
-    pos++;
-    if (pos >= tokens.length || tokens[pos].t !== 9 /* Equals */) {
-      while (pos < tokens.length && tokens[pos].t !== 0 /* Newline */ && tokens[pos].t !== 13 /* EOF */) pos++;
-      continue;
-    }
-    pos++;
-    const expr = [];
-    let depth = 0;
-    let ternaryDepth = 0;
-    while (pos < tokens.length && tokens[pos].t !== 13 /* EOF */) {
-      const tt = tokens[pos].t;
-      if (tt === 0 /* Newline */ && depth <= 0 && ternaryDepth <= 0) {
-        let peek = pos + 1;
-        while (peek < tokens.length && tokens[peek].t === 0 /* Newline */) peek++;
-        const nextT = peek < tokens.length ? tokens[peek].t : 13 /* EOF */;
-        if (nextT === 34 /* Question */ || nextT === 8 /* Colon */ && ternaryDepth > 0) {
-          pos++;
-          continue;
-        }
-        break;
-      }
-      if (tt === 0 /* Newline */) {
-        pos++;
-        continue;
+  return {
+    push(chunk) {
+      buf += chunk;
+      return currentResult();
+    },
+    set(fullText) {
+      if (fullText.length < buf.length || !fullText.startsWith(buf)) {
+        reset();
       }
-      if (tt === 1 /* LParen */ || tt === 3 /* LBrack */ || tt === 5 /* LBrace */) depth++;
-      else if ((tt === 2 /* RParen */ || tt === 4 /* RBrack */ || tt === 6 /* RBrace */) && depth > 0) depth--;
-      else if (tt === 34 /* Question */ && depth === 0) ternaryDepth++;
-      else if (tt === 8 /* Colon */ && depth === 0 && ternaryDepth > 0) ternaryDepth--;
-      expr.push(tokens[pos++]);
-    }
-    if (expr.length) stmts.push({ id, idTokenType, tokens: expr });
-  }
-  return stmts;
+      const delta = fullText.slice(buf.length);
+      if (delta) buf += delta;
+      return currentResult();
+    },
+    getResult: currentResult
+  };
 }
 
-// src/genui/lang/parser/parser.ts
-function emptyResult(incomplete = true) {
-  return {
-    root: null,
-    meta: {
-      incomplete,
-      unresolved: [],
-      orphaned: [],
-      statementCount: 0,
-      errors: []
+// src/genui/registry.ts
+var CIMPLIFY_GENUI_REGISTRY = {
+  version: "3",
+  components: [
+    {
+      name: "Stack",
+      description: 'Layout container. direction: "column" (default) or "row"; gap in points (default 12)',
+      params: [{ name: "children", required: true }, { name: "direction" }, { name: "gap" }]
+    },
+    {
+      name: "Card",
+      description: "Elevated surface grouping related content, with an optional title",
+      params: [{ name: "children", required: true }, { name: "title" }]
+    },
+    {
+      name: "TextContent",
+      description: 'Text block. size: "display", "heading", "title", "body" (default), "label", "caption"',
+      params: [{ name: "text", required: true }, { name: "size" }]
+    },
+    {
+      name: "Stat",
+      description: "Compact stat: small label over a bold value, optional sub line and tone",
+      params: [
+        { name: "label", required: true },
+        { name: "value", required: true },
+        { name: "sub" },
+        { name: "tone" }
+      ]
+    },
+    {
+      name: "Metric",
+      description: "KPI card with label, value, optional percent change and SF Symbol icon",
+      params: [
+        { name: "label", required: true },
+        { name: "value", required: true },
+        { name: "change" },
+        { name: "icon" }
+      ]
+    },
+    {
+      name: "KeyValue",
+      description: "Label/value row; set mono true for numeric values",
+      params: [
+        { name: "label", required: true },
+        { name: "value", required: true },
+        { name: "mono" }
+      ]
+    },
+    {
+      name: "Badge",
+      description: "Small status chip. tone: neutral, positive, info, indigo, violet, warning, danger",
+      params: [{ name: "label", required: true }, { name: "tone" }]
+    },
+    {
+      name: "Callout",
+      description: "Inline alert with title, optional message. tone: info (default), success, warning, danger, accent, neutral",
+      params: [{ name: "title", required: true }, { name: "message" }, { name: "tone" }]
+    },
+    {
+      name: "Button",
+      description: 'Action button. action: "action:name" string or Action([...]) steps. variant: primary, cta, secondary (default), ghost, destructive',
+      params: [
+        { name: "label", required: true },
+        { name: "action", required: true },
+        { name: "variant" }
+      ]
+    },
+    {
+      name: "Buttons",
+      description: 'Row (default) or column of Buttons; direction: "row" or "column"',
+      params: [{ name: "children", required: true }, { name: "direction" }]
+    },
+    {
+      name: "Divider",
+      description: "Hairline separator",
+      params: []
+    },
+    {
+      name: "Table",
+      description: "Data table: headers is an array of strings, rows an array of cell arrays",
+      params: [
+        { name: "headers", required: true },
+        { name: "rows", required: true }
+      ]
+    },
+    {
+      name: "BarChart",
+      description: "Bar chart: labels (x axis strings) and values (numbers), optional title",
+      params: [
+        { name: "labels", required: true },
+        { name: "values", required: true },
+        { name: "title" }
+      ]
+    },
+    {
+      name: "LineChart",
+      description: "Line chart with area fill: labels and values, optional title",
+      params: [
+        { name: "labels", required: true },
+        { name: "values", required: true },
+        { name: "title" }
+      ]
+    },
+    {
+      name: "Money",
+      description: "Formatted money amount, never abbreviated. currency: ISO code (default USD)",
+      params: [{ name: "amount", required: true }, { name: "currency" }]
     },
-    stateDeclarations: {},
-    queryStatements: [],
-    mutationStatements: []
-  };
-}
-function collectQueryDeps(node) {
-  if (!isASTNode(node)) return [];
-  const refs = /* @__PURE__ */ new Set();
-  walkAST(node, (current) => {
-    if (current.k === "StateRef") refs.add(current.n);
-  });
-  return [...refs];
-}
-function classifyStatement(raw, expr) {
-  if (expr.k === "Comp" && expr.name === RESERVED_CALLS.Query) {
-    const deps = collectQueryDeps(expr.args[1]);
-    return {
-      kind: "query",
-      id: raw.id,
-      call: { callee: RESERVED_CALLS.Query, args: expr.args },
-      expr,
-      deps: deps.length > 0 ? deps : void 0
-    };
-  }
-  if (expr.k === "Comp" && expr.name === RESERVED_CALLS.Mutation) {
-    return {
-      kind: "mutation",
-      id: raw.id,
-      call: { callee: RESERVED_CALLS.Mutation, args: expr.args },
-      expr
-    };
-  }
-  if (raw.idTokenType === 18 /* StateVar */) {
-    return { kind: "state", id: raw.id, init: expr };
-  }
-  return { kind: "value", id: raw.id, expr };
-}
-function extractStatements(stmts, ctx) {
-  const stateDeclarations = {};
-  const queryStatements = [];
-  const mutationStatements = [];
-  for (const stmt of stmts) {
-    switch (stmt.kind) {
-      case "state":
-        stateDeclarations[stmt.id] = materializeValue(stmt.init, ctx);
-        break;
-      case "query":
-        queryStatements.push({
-          statementId: stmt.id,
-          toolAST: stmt.call.args[0] ?? null,
-          argsAST: stmt.call.args[1] ?? null,
-          defaultsAST: stmt.call.args[2] ?? null,
-          refreshAST: stmt.call.args[3] ?? null,
-          deps: stmt.deps,
-          complete: true
-        });
-        break;
-      case "mutation":
-        mutationStatements.push({
-          statementId: stmt.id,
-          toolAST: stmt.call.args[0] ?? null,
-          argsAST: stmt.call.args[1] ?? null
-        });
-        break;
+    {
+      name: "Image",
+      description: "Remote image by URL with optional caption",
+      params: [{ name: "url", required: true }, { name: "caption" }]
+    },
+    {
+      name: "ListRow",
+      description: "Entity row for orders/customers/products/invoices: initials avatar (or SF Symbol tile via symbol), title + subtitle, trailing value and badge with tone",
+      params: [
+        { name: "title", required: true },
+        { name: "subtitle" },
+        { name: "value" },
+        { name: "badge" },
+        { name: "tone" },
+        { name: "symbol" }
+      ]
+    },
+    {
+      name: "Timeline",
+      description: "Event history (order journey, payment trail): events is an array of {title, detail?, time?, tone?} objects, newest first",
+      params: [{ name: "events", required: true }]
+    },
+    {
+      name: "Progress",
+      description: "Amount toward a bound (goal, stock cover, capacity): numeric value and target (default 100), optional detail caption and tone",
+      params: [
+        { name: "label", required: true },
+        { name: "value", required: true },
+        { name: "target" },
+        { name: "detail" },
+        { name: "tone" }
+      ]
+    },
+    {
+      name: "DonutChart",
+      description: "Share of a whole (sales by channel, revenue by category): labels + values, optional title and center display string (e.g. the formatted total)",
+      params: [
+        { name: "labels", required: true },
+        { name: "values", required: true },
+        { name: "title" },
+        { name: "center" }
+      ]
+    },
+    {
+      name: "StatusTrack",
+      description: "Stage tracker (order fulfilment, invoice lifecycle): steps are stage names, current is the active step name or index",
+      params: [
+        { name: "steps", required: true },
+        { name: "current", required: true }
+      ]
+    },
+    {
+      name: "LineItems",
+      description: "Order/quote/invoice money block: items is an array of {qty?, name, amount} with display-ready amount strings, adjustments an array of {label, amount, tone?}, total the anchored display string",
+      params: [
+        { name: "items", required: true },
+        { name: "total", required: true },
+        { name: "adjustments" }
+      ]
+    },
+    {
+      name: "Grid",
+      description: "Tile layout for Stat/Metric children, columns default 2",
+      params: [{ name: "children", required: true }, { name: "columns" }]
+    },
+    {
+      name: "Banner",
+      description: "Hero-stat moment on a tonal wash: big value, label, optional percent delta. tone: positive (default), warning, danger, info, neutral",
+      params: [
+        { name: "value", required: true },
+        { name: "label", required: true },
+        { name: "delta" },
+        { name: "tone" }
+      ]
+    },
+    {
+      name: "EmptyState",
+      description: "Nothing-to-show state with an SF Symbol and optional message",
+      params: [{ name: "title", required: true }, { name: "message" }, { name: "symbol" }]
     }
-  }
-  for (const stmt of stmts) {
-    const nodes = stmt.kind === "state" ? [stmt.init] : stmt.kind === "value" ? [stmt.expr] : stmt.kind === "query" || stmt.kind === "mutation" ? stmt.call.args : [];
-    for (const node of nodes) {
-      for (const dep of collectQueryDeps(node)) {
-        if (!(dep in stateDeclarations)) {
-          stateDeclarations[dep] = null;
-        }
+  ]
+};
+
+// src/react/genui/catalog.ts
+function genUICatalog(registry) {
+  return new Map(
+    registry.components.map((component) => [
+      component.name,
+      {
+        params: component.params.map((param) => ({
+          name: param.name,
+          required: param.required ?? false
+        }))
       }
-    }
-  }
-  return { stateDeclarations, queryStatements, mutationStatements };
-}
-var DEFAULT_ROOT_STATEMENT_ID = "root";
-function isComponentStatement(stmt) {
-  return stmt.kind === "value" && stmt.expr.k === "Comp" && !isBuiltin(stmt.expr.name) && stmt.expr.name !== RESERVED_CALLS.Query && stmt.expr.name !== RESERVED_CALLS.Mutation;
+    ])
+  );
 }
-function pickEntryId(stmtMap, typedStmts, firstId, rootName) {
-  if (stmtMap.has(DEFAULT_ROOT_STATEMENT_ID)) return DEFAULT_ROOT_STATEMENT_ID;
-  if (rootName && stmtMap.has(rootName)) return rootName;
-  const preferredComponent = rootName ? typedStmts.find((stmt) => isComponentStatement(stmt) && stmt.expr.name === rootName) : void 0;
-  if (preferredComponent) return preferredComponent.id;
-  const firstComponent = typedStmts.find(isComponentStatement);
-  return firstComponent?.id ?? firstId;
+var noop = () => {
+};
+function childKey(value, index) {
+  if (isElementNode(value) && value.statementId) return `s:${value.statementId}`;
+  return `i:${index}`;
 }
-function buildResult(stmtMap, typedStmts, firstId, wasIncomplete, stmtCount, cat, rootName) {
-  const entryId = pickEntryId(stmtMap, typedStmts, firstId, rootName);
-  if (!stmtMap.has(entryId)) return emptyResult(wasIncomplete);
-  const syms = /* @__PURE__ */ new Map();
-  for (const [id, stmt] of stmtMap) {
-    syms.set(id, stmt.kind === "state" ? stmt.init : stmt.expr);
-  }
-  const unres = [];
-  const errors = [];
-  const unreached = /* @__PURE__ */ new Set();
-  for (const [id, stmt] of stmtMap) {
-    if (id === entryId) continue;
-    if (stmt.kind === "state" || stmt.kind === "query" || stmt.kind === "mutation") continue;
-    unreached.add(id);
+var RenderDepthContext = React14.createContext(0);
+var MAX_DEPTH = 64;
+var GenUINode = React14.memo(function GenUINode2({
+  node,
+  components,
+  onAction,
+  isStreaming,
+  onTelemetry
+}) {
+  const depth = React14.useContext(RenderDepthContext);
+  if (depth > MAX_DEPTH) {
+    onTelemetry?.({ kind: "dropped-node", typeName: node.typeName });
+    return null;
   }
-  const ctx = {
-    syms,
-    cat,
-    errors,
-    unres,
-    visited: /* @__PURE__ */ new Set(),
-    partial: wasIncomplete,
-    currentStatementId: entryId,
-    unreached
-  };
-  const materialized = materializeValue(syms.get(entryId), ctx);
-  const root = isElementNode(materialized) ? materialized : null;
-  if (root) root.statementId = entryId;
-  const { stateDeclarations, queryStatements, mutationStatements } = extractStatements(
-    typedStmts,
-    ctx
-  );
-  const orphaned = [...unreached];
-  return {
-    root,
-    meta: {
-      incomplete: wasIncomplete,
-      unresolved: unres,
-      orphaned,
-      statementCount: stmtCount,
-      errors
-    },
-    stateDeclarations,
-    queryStatements,
-    mutationStatements
-  };
-}
-function skipString(input, start) {
-  if (input[start] !== '"') return start;
-  let i = start + 1;
-  while (i < input.length) {
-    const c = input[i];
-    if (c === "\\") {
-      i += 2;
-    } else if (c === '"') {
-      return i + 1;
-    } else {
-      i++;
-    }
+  const renderer = components[node.typeName];
+  if (!renderer) {
+    onTelemetry?.({ kind: "unknown-component", typeName: node.typeName });
+    return null;
   }
-  return i;
-}
-function stripFences(input) {
-  const blocks = [];
-  let i = 0;
-  while (i < input.length) {
-    let fenceStart = -1;
-    while (i < input.length) {
-      const nextI = skipString(input, i);
-      if (nextI > i) {
-        i = nextI;
-        continue;
-      }
-      const c = input[i];
-      if (c === "`" && i + 1 < input.length && input[i + 1] === "`" && i + 2 < input.length && input[i + 2] === "`") {
-        fenceStart = i;
-        break;
-      }
-      i++;
-    }
-    if (fenceStart === -1) break;
-    let j = fenceStart + 3;
-    while (j < input.length && input[j] !== "\n") j++;
-    if (j >= input.length) {
-      blocks.push(input.slice(fenceStart + 3).replace(/^[^\n]*\n?/, ""));
-      i = input.length;
-      break;
+  const render = (value) => {
+    if (value == null) return null;
+    if (isElementNode(value)) {
+      return /* @__PURE__ */ jsxRuntime.jsx(RenderDepthContext.Provider, { value: depth + 1, children: /* @__PURE__ */ jsxRuntime.jsx(
+        GenUINode2,
+        {
+          node: value,
+          components,
+          onAction,
+          isStreaming,
+          onTelemetry
+        }
+      ) });
     }
-    j++;
-    let closePos = -1;
-    let k = j;
-    while (k < input.length) {
-      const nextK = skipString(input, k);
-      if (nextK > k) {
-        k = nextK;
-        continue;
-      }
-      const c = input[k];
-      if (c === "`" && k + 1 < input.length && input[k + 1] === "`" && k + 2 < input.length && input[k + 2] === "`") {
-        closePos = k;
-        break;
-      }
-      k++;
+    if (Array.isArray(value)) {
+      return value.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: render(item) }, childKey(item, index)));
     }
-    if (closePos !== -1) {
-      blocks.push(input.slice(j, closePos));
-      i = closePos + 3;
-    } else {
-      blocks.push(input.slice(j));
-      i = input.length;
+    if (typeof value === "object" && isRuntimeExpr(value)) return null;
+    if (typeof value === "string" || typeof value === "number") return String(value);
+    return null;
+  };
+  return renderer({ node, ctx: { render, onAction, isStreaming } });
+});
+function GenUIView({
+  root,
+  components,
+  onAction = noop,
+  isStreaming = false,
+  onTelemetry,
+  placeholder = null
+}) {
+  if (!root) return placeholder;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    GenUINode,
+    {
+      node: root,
+      components,
+      onAction,
+      isStreaming,
+      onTelemetry
     }
+  );
+}
+var CHAT_ACTION_VIEW_PRODUCT = "view_product";
+var CHAT_ACTION_VIEW_ORDER = "view_order";
+function chatAction(verb, id) {
+  return `chat:${verb}:${id}`;
+}
+function parseChatAction(action) {
+  const [, verb, id] = action.split(":");
+  return verb && id ? { verb, id } : null;
+}
+function text(value) {
+  return typeof value === "string" ? value : typeof value === "number" ? String(value) : void 0;
+}
+function num(value) {
+  if (typeof value === "number" && Number.isFinite(value)) return value;
+  if (typeof value === "string" && Number.isFinite(Number(value))) return Number(value);
+  return void 0;
+}
+function rowsOf(value) {
+  if (!Array.isArray(value)) return [];
+  return value.filter(
+    (item) => typeof item === "object" && item !== null && !Array.isArray(item)
+  );
+}
+function tone(value) {
+  switch (value) {
+    case "positive":
+    case "success":
+      return "positive";
+    case "warning":
+      return "warning";
+    case "danger":
+    case "negative":
+      return "danger";
+    default:
+      return "neutral";
   }
-  if (blocks.length > 0) return blocks.join("\n");
-  if (input.startsWith("```")) {
-    let j = 3;
-    while (j < input.length && input[j] !== "\n") j++;
-    const start = j < input.length ? j + 1 : 3;
-    const body = input.slice(start);
-    const trailingFence = body.lastIndexOf("```");
-    if (trailingFence !== -1) {
-      return body.slice(0, trailingFence);
-    }
-    return body;
+}
+var WARNING_CHIP_STYLE = {
+  color: "var(--color-pending, #B45309)",
+  background: "var(--color-pending-wash, #FEF3C7)"
+};
+function toneChip(value) {
+  switch (tone(value)) {
+    case "positive":
+      return { className: "bg-primary/10 text-primary" };
+    case "warning":
+      return { className: "", style: WARNING_CHIP_STYLE };
+    case "danger":
+      return { className: "bg-destructive/10 text-destructive" };
+    default:
+      return { className: "bg-muted text-muted-foreground" };
   }
-  return input;
 }
-function stripComments(input) {
-  let inStr = false;
-  return input.split("\n").map((line) => {
-    for (let i = 0; i < line.length; i++) {
-      const c = line[i];
-      if (inStr) {
-        if (c === "\\" && i + 1 < line.length) {
-          i++;
-          continue;
-        }
-        if (c === inStr) inStr = false;
-        continue;
-      }
-      if (c === '"' || c === "'") {
-        inStr = c;
-        continue;
+function money(amount, currency) {
+  return chunkPTPOQVXS_js.formatPrice(chunkPTPOQVXS_js.parsePrice(num(amount) ?? 0), text(currency));
+}
+var CHAT_GENUI_COMPONENTS = {
+  Stack: ({ node, ctx }) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn("flex w-full", node.props.direction === "row" ? "flex-row" : "flex-col"),
+      style: { gap: num(node.props.gap) ?? 10 },
+      children: ctx.render(node.props.children)
+    }
+  ),
+  Card: ({ node, ctx }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col gap-2 rounded-2xl border border-border bg-background p-3.5", children: [
+    text(node.props.title) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold text-foreground", children: text(node.props.title) }),
+    ctx.render(node.props.children)
+  ] }),
+  TextContent: ({ node }) => {
+    const size = text(node.props.size);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "p",
+      {
+        className: cn(
+          "break-words text-foreground",
+          size === "display" || size === "heading" ? "text-[17px] font-bold leading-6" : size === "title" ? "text-[15px] font-semibold leading-5" : size === "label" || size === "caption" ? "text-xs text-muted-foreground" : "text-sm leading-5"
+        ),
+        children: text(node.props.text) ?? ""
       }
-      if (c === "/" && line[i + 1] === "/") {
-        return line.substring(0, i).trimEnd();
+    );
+  },
+  Stat: ({ node }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: text(node.props.label) }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[17px] font-bold text-foreground tabular-nums", children: text(node.props.value) }),
+    text(node.props.sub) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: text(node.props.sub) })
+  ] }),
+  KeyValue: ({ node }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline justify-between gap-3", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-muted-foreground", children: text(node.props.label) }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold text-foreground tabular-nums", children: text(node.props.value) })
+  ] }),
+  Badge: ({ node }) => {
+    const chip = toneChip(node.props.tone);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        style: chip.style,
+        className: cn("w-fit rounded-full px-2 py-0.5 text-[11px] font-semibold", chip.className),
+        children: text(node.props.label)
       }
-      if (c === "#") {
-        return line.substring(0, i).trimEnd();
+    );
+  },
+  Callout: ({ node }) => {
+    const chip = toneChip(node.props.tone);
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        style: chip.style,
+        className: cn("flex flex-col gap-0.5 rounded-xl px-3 py-2.5", chip.className),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] font-semibold", children: text(node.props.title) }),
+          text(node.props.message) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs leading-4 opacity-90", children: text(node.props.message) })
+        ]
       }
+    );
+  },
+  Button: ({ node, ctx }) => /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      type: "button",
+      disabled: ctx.isStreaming,
+      onClick: () => {
+        const action = node.props.action;
+        if (typeof action === "string") {
+          ctx.onAction({ action, label: text(node.props.label) ?? "" });
+        }
+      },
+      className: "w-fit rounded-full bg-foreground px-4 py-2 text-[13px] font-semibold text-background active:opacity-80",
+      children: text(node.props.label)
     }
-    return line;
-  }).join("\n");
-}
-function preprocess(input) {
-  return stripComments(stripFences(input.trim())).trim();
-}
-function parse(input, cat, rootName) {
-  const trimmed = preprocess(input);
-  if (!trimmed) return emptyResult();
-  const { text, wasIncomplete } = autoClose(trimmed);
-  const stmts = split(tokenize(text));
-  if (!stmts.length) return emptyResult(wasIncomplete);
-  const stmtMap = /* @__PURE__ */ new Map();
-  let firstId = "";
-  for (const s of stmts) {
-    const expr = parseExpression(s.tokens);
-    const stmt = classifyStatement(s, expr);
-    stmtMap.set(s.id, stmt);
-    if (!firstId) firstId = s.id;
-  }
-  const typedStmts = [...stmtMap.values()];
-  return buildResult(stmtMap, typedStmts, firstId, wasIncomplete, stmtMap.size, cat, rootName);
-}
-function createStreamParser(cat, rootName) {
-  let buf = "";
-  let cleaned = "";
-  let completedEnd = 0;
-  const completedStmtMap = /* @__PURE__ */ new Map();
-  let firstId = "";
-  function addStmt(text) {
-    const t = text.trim();
-    if (!t) return;
-    for (const s of split(tokenize(t))) {
-      const expr = parseExpression(s.tokens);
-      const stmt = classifyStatement(s, expr);
-      completedStmtMap.set(s.id, stmt);
-      if (!firstId) firstId = s.id;
+  ),
+  Buttons: ({ node, ctx }) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cn(
+        "flex gap-2",
+        node.props.direction === "column" ? "flex-col items-start" : "flex-row flex-wrap"
+      ),
+      children: ctx.render(node.props.children)
     }
+  ),
+  Divider: () => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-px w-full bg-border" }),
+  Table: ({ node }) => {
+    const headers = Array.isArray(node.props.headers) ? node.props.headers.map(String) : [];
+    const rows = Array.isArray(node.props.rows) ? node.props.rows : [];
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col", children: [
+      headers.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-3 border-b border-border pb-1", children: headers.map((header, index) => /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          className: "min-w-0 flex-1 text-[11px] font-semibold tracking-wide text-muted-foreground uppercase",
+          children: header
+        },
+        index
+      )) }),
+      rows.map((row, rowIndex) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-3 border-b border-border py-1.5 last:border-b-0", children: (Array.isArray(row) ? row : [row]).map((cell, cellIndex) => /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          className: "min-w-0 flex-1 text-[13px] text-foreground tabular-nums",
+          children: text(cell) ?? ""
+        },
+        cellIndex
+      )) }, rowIndex))
+    ] });
+  },
+  Money: ({ node }) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold text-foreground tabular-nums", children: money(node.props.amount, node.props.currency) }),
+  Image: ({ node }) => text(node.props.url) ? /* @__PURE__ */ jsxRuntime.jsx(
+    "img",
+    {
+      src: text(node.props.url),
+      alt: text(node.props.caption) ?? "",
+      loading: "lazy",
+      className: "max-h-40 w-full rounded-xl object-cover"
+    }
+  ) : null,
+  ListRow: ({ node, ctx }) => {
+    const action = text(node.props.action);
+    const title = text(node.props.title) ?? "";
+    const chip = toneChip(node.props.tone);
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        role: action ? "button" : void 0,
+        onClick: action ? () => ctx.onAction({ action, label: title }) : void 0,
+        className: cn("flex items-center gap-2.5 py-1", action && "cursor-pointer active:opacity-70"),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 grow flex-col", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-sm font-medium text-foreground", children: title }),
+            text(node.props.subtitle) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-xs text-muted-foreground", children: text(node.props.subtitle) })
+          ] }),
+          text(node.props.value) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 text-sm font-semibold text-foreground tabular-nums", children: text(node.props.value) }),
+          text(node.props.badge) && /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              style: chip.style,
+              className: cn(
+                "shrink-0 rounded-full px-2 py-0.5 text-[10.5px] font-semibold",
+                chip.className
+              ),
+              children: text(node.props.badge)
+            }
+          )
+        ]
+      }
+    );
+  },
+  Timeline: ({ node }) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col", children: rowsOf(node.props.events).map((event, index, events) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2.5", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-2.5 flex-col items-center", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mt-1.5 size-1.5 rounded-full bg-primary" }),
+      index < events.length - 1 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-px grow bg-border" })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col pb-2.5", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] font-medium text-foreground", children: text(event.title) }),
+      text(event.detail) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: text(event.detail) }),
+      text(event.time) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[11px] text-muted-foreground", children: text(event.time) })
+    ] })
+  ] }, index)) }),
+  Progress: ({ node }) => {
+    const value = num(node.props.value) ?? 0;
+    const target = num(node.props.target) || 100;
+    const ratio = Math.min(1, Math.max(0, target === 0 ? 0 : value / target));
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col gap-1", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: text(node.props.label) }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-semibold text-foreground tabular-nums", children: text(node.props.value) })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-1.5 w-full overflow-hidden rounded-full bg-muted", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full rounded-full bg-primary", style: { width: `${ratio * 100}%` } }) })
+    ] });
+  },
+  StatusTrack: ({ node }) => {
+    const steps = Array.isArray(node.props.steps) ? node.props.steps.map(String) : [];
+    const current = node.props.current;
+    const currentIndex = typeof current === "number" ? Math.min(Math.max(0, Math.trunc(current)), Math.max(0, steps.length - 1)) : Math.max(0, steps.indexOf(String(current ?? "")));
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col gap-1", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-1", children: steps.map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          className: cn(
+            "h-1 grow rounded-full",
+            index <= currentIndex ? "bg-primary" : "bg-muted"
+          )
+        },
+        index
+      )) }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-medium text-foreground", children: steps[currentIndex] })
+    ] });
+  },
+  LineItems: ({ node }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col", children: [
+    rowsOf(node.props.items).map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline gap-2 py-0.5", children: [
+      text(item.qty) && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "w-5 shrink-0 text-[13px] text-muted-foreground tabular-nums", children: [
+        text(item.qty),
+        "\xD7"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 grow truncate text-sm text-foreground", children: text(item.name) }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 text-sm font-semibold text-foreground tabular-nums", children: text(item.amount) })
+    ] }, index)),
+    rowsOf(node.props.adjustments).map((adjustment, index) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline justify-between py-0.5", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: text(adjustment.label) }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-medium text-muted-foreground tabular-nums", children: text(adjustment.amount) })
+    ] }, `adj-${index}`)),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-1 flex items-baseline justify-between border-t border-border pt-1.5", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold text-foreground", children: "Total" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[15px] font-bold text-foreground tabular-nums", children: text(node.props.total) })
+    ] })
+  ] }),
+  Grid: ({ node, ctx }) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid w-full grid-cols-2 gap-2", children: ctx.render(node.props.children) }),
+  EmptyState: ({ node }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-0.5 py-4 text-center", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold text-foreground", children: text(node.props.title) }),
+    text(node.props.message) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: text(node.props.message) })
+  ] })
+};
+var CATALOG = genUICatalog(CIMPLIFY_GENUI_REGISTRY);
+function ChatKitProgram({ source, onAction }) {
+  const parsed = React14.useMemo(() => parse(source, CATALOG, "root"), [source]);
+  if (!parsed.root) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full max-w-[290px]", children: /* @__PURE__ */ jsxRuntime.jsx(GenUIView, { root: parsed.root, components: CHAT_GENUI_COMPONENTS, onAction }) });
+}
+function ChatReplyCards({ message, currency, onAction }) {
+  const cards = chunkQPRI2NII_js.chatMessageCards(message);
+  if (cards.length === 0) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "scrollbar-hide flex max-w-full gap-2 overflow-x-auto pl-[30px]", children: cards.map((card, index) => /* @__PURE__ */ jsxRuntime.jsx(ReplyCardView, { card, currency, onAction }, index)) });
+}
+function ReplyCardView({
+  card,
+  currency,
+  onAction
+}) {
+  if (card.kind === "product") {
+    const fire2 = onAction ? () => onAction({ action: chatAction(CHAT_ACTION_VIEW_PRODUCT, card.id), label: card.name }) : void 0;
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: fire2,
+        disabled: !fire2,
+        className: cn(
+          "flex w-[230px] shrink-0 items-center gap-3 rounded-2xl border border-border bg-background p-2.5 text-left",
+          fire2 && "active:opacity-80"
+        ),
+        children: [
+          card.image_url && /* @__PURE__ */ jsxRuntime.jsx("img", { src: card.image_url, alt: "", className: "size-12 shrink-0 rounded-xl object-cover" }),
+          /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 flex-col gap-0.5", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-sm font-semibold text-foreground", children: card.name }),
+            card.price !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] font-semibold text-foreground tabular-nums", children: chunkPTPOQVXS_js.formatPrice(chunkPTPOQVXS_js.parsePrice(card.price), currency ?? void 0) }),
+            fire2 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-semibold text-primary", children: "View" })
+          ] })
+        ]
+      }
+    );
   }
-  function refreshCleaned() {
-    const next = preprocess(buf);
-    if (!next.startsWith(cleaned.slice(0, completedEnd))) {
-      completedEnd = 0;
-      completedStmtMap.clear();
-      firstId = "";
+  const fire = onAction ? () => onAction({
+    action: chatAction(CHAT_ACTION_VIEW_ORDER, card.order_id),
+    label: card.order_number ?? card.order_id
+  }) : void 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      type: "button",
+      onClick: fire,
+      disabled: !fire,
+      className: cn(
+        "flex w-[230px] shrink-0 flex-col gap-1 rounded-2xl border border-border bg-background p-3 text-left",
+        fire && "active:opacity-80"
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm font-semibold text-foreground", children: [
+          "Order ",
+          card.order_number ? `#${card.order_number}` : ""
+        ] }),
+        card.status && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: card.status }),
+        fire && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] font-medium text-primary", children: "View order" })
+      ]
     }
-    cleaned = next;
-  }
-  function scanNewCompleted() {
-    let depth = 0, ternaryDepth = 0, inStr = false, esc = false;
-    let stmtStart = completedEnd;
-    for (let i = completedEnd; i < cleaned.length; i++) {
-      const c = cleaned[i];
-      if (esc) {
-        esc = false;
-        continue;
-      }
-      if (c === "\\" && inStr) {
-        esc = true;
-        continue;
-      }
-      if (inStr) {
-        if (c === inStr) inStr = false;
-        continue;
+  );
+}
+var MAX_ATTACHMENT_BYTES = 5 * 1024 * 1024;
+var KEEP_DISMISSED_KEY = "cimplify_keep_chat_dismissed";
+var AT_BOTTOM_SLACK_PX = 48;
+function ChatWidget({
+  client: clientProp,
+  businessName = "Support",
+  greeting = "Hi there!",
+  subtitle = "Ask us anything \u2014 we typically reply in a few seconds.",
+  starters,
+  placeholder = "Type a message\u2026",
+  position = "bottom-right",
+  defaultOpen = false,
+  pollInterval,
+  currency,
+  onGenUIAction,
+  className,
+  classNames
+}) {
+  const context = useOptionalCimplifyClient();
+  const client = clientProp ?? context?.client;
+  const [open, setOpen] = React14.useState(defaultOpen);
+  const [readAt, setReadAt] = React14.useState(null);
+  const [attachError, setAttachError] = React14.useState(null);
+  const [replyTo, setReplyTo] = React14.useState(null);
+  const {
+    messages,
+    isLoading,
+    isSending,
+    awaitingReply,
+    seenAt,
+    error,
+    isActive,
+    humanRequested,
+    claimedAs,
+    signOut,
+    send,
+    react,
+    requestHuman,
+    startConversation,
+    loadOlder,
+    mayHaveOlder,
+    openIfExisting
+  } = useChat({ client, pollInterval });
+  const showTyping = isSending || awaitingReply;
+  const attachPhoto = React14.useCallback(
+    async (file) => {
+      if (!client) return;
+      setAttachError(null);
+      if (!file.type.startsWith("image/")) {
+        setAttachError(new chunkAETVRBKI_js.CimplifyError("invalid_attachment", "Only photos can be attached."));
+        return;
       }
-      if (c === '"' || c === "'") {
-        inStr = c;
-        continue;
+      if (file.size > MAX_ATTACHMENT_BYTES) {
+        setAttachError(new chunkAETVRBKI_js.CimplifyError("attachment_too_large", "Photos must be under 5MB."));
+        return;
       }
-      if (c === "(" || c === "[" || c === "{") depth++;
-      else if (c === ")" || c === "]" || c === "}") depth = Math.max(0, depth - 1);
-      else if (c === "?" && depth === 0) ternaryDepth++;
-      else if (c === ":" && depth === 0 && ternaryDepth > 0) ternaryDepth--;
-      else if (c === "\n" && depth <= 0 && ternaryDepth <= 0) {
-        let peek = i + 1;
-        while (peek < cleaned.length && (cleaned[peek] === " " || cleaned[peek] === "	" || cleaned[peek] === "\r" || cleaned[peek] === "\n"))
-          peek++;
-        if (peek < cleaned.length && (cleaned[peek] === "?" || cleaned[peek] === ":" && ternaryDepth > 0)) {
-          continue;
-        }
-        const t = cleaned.slice(stmtStart, i).trim();
-        if (t) addStmt(t);
-        stmtStart = i + 1;
-        completedEnd = i + 1;
+      const uploaded = await client.uploads.upload(file);
+      if (!uploaded.ok) {
+        setAttachError(uploaded.error);
+        return;
       }
+      const attachment = {
+        upload_id: uploaded.value.id,
+        url: uploaded.value.url,
+        mime_type: uploaded.value.content_type,
+        filename: uploaded.value.filename,
+        size: uploaded.value.size_bytes
+      };
+      await send("", { attachments: [attachment] });
+    },
+    [client, send]
+  );
+  const handleSend = React14.useCallback(
+    (content) => {
+      setAttachError(null);
+      const target = replyTo;
+      setReplyTo(null);
+      return send(content, target ? { replyTo: target } : void 0);
+    },
+    [send, replyTo]
+  );
+  const unread = open ? 0 : messages.filter(
+    (m) => m.sender_type !== "customer" && (!readAt || m.created_at > readAt)
+  ).length;
+  React14.useState(() => {
+    if (defaultOpen) void openIfExisting();
+  });
+  const handleOpen = React14.useCallback(() => {
+    setOpen(true);
+    void openIfExisting();
+  }, [openIfExisting]);
+  const handleClose = React14.useCallback(() => {
+    const newest = messages[messages.length - 1];
+    setReadAt(newest?.created_at ?? null);
+    setOpen(false);
+  }, [messages]);
+  const isLeft = position === "bottom-left";
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "fixed bottom-6 z-[9999]",
+        isLeft ? "left-6" : "right-6",
+        className,
+        classNames?.root
+      ),
+      children: [
+        !open && /* @__PURE__ */ jsxRuntime.jsx(
+          Bubble,
+          {
+            unread,
+            onClick: handleOpen,
+            className: classNames?.bubble
+          }
+        ),
+        open && /* @__PURE__ */ jsxRuntime.jsx(
+          Panel,
+          {
+            client,
+            businessName,
+            greeting,
+            subtitle,
+            starters,
+            placeholder,
+            messages,
+            isLoading,
+            isSending,
+            isTyping: showTyping,
+            seenAt,
+            readAt,
+            error: error ?? attachError,
+            isActive,
+            isLeft,
+            humanRequested,
+            mayHaveOlder,
+            replyTo,
+            claimedAs,
+            onSignOut: () => void signOut(),
+            onClose: handleClose,
+            onSend: handleSend,
+            onReact: react,
+            onReply: setReplyTo,
+            onCancelReply: () => setReplyTo(null),
+            onRequestHuman: () => void requestHuman(),
+            onLoadOlder: () => void loadOlder(),
+            onAttach: attachPhoto,
+            onStartConversation: startConversation,
+            currency,
+            onGenUIAction,
+            classNames
+          }
+        )
+      ]
     }
-    return stmtStart;
-  }
-  function currentResult() {
-    refreshCleaned();
-    const pendingStart = scanNewCompleted();
-    const pendingText = cleaned.slice(pendingStart).trim();
-    if (!pendingText) {
-      if (completedStmtMap.size === 0) return emptyResult();
-      return buildResult(
-        completedStmtMap,
-        [...completedStmtMap.values()],
-        firstId,
-        false,
-        completedStmtMap.size,
-        cat,
-        rootName
-      );
-    }
-    const { text: closed, wasIncomplete } = autoClose(pendingText);
-    const stmts = split(tokenize(closed));
-    if (!stmts.length) {
-      if (completedStmtMap.size === 0) return emptyResult(wasIncomplete);
-      return buildResult(
-        completedStmtMap,
-        [...completedStmtMap.values()],
-        firstId,
-        wasIncomplete,
-        completedStmtMap.size,
-        cat,
-        rootName
-      );
+  );
+}
+function Bubble({
+  unread,
+  onClick,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      type: "button",
+      onClick,
+      "aria-label": "Open chat",
+      className: cn(
+        "relative flex h-14 w-14 items-center justify-center rounded-full",
+        "bg-foreground text-background shadow-lg",
+        "transition-transform duration-300 ease-out",
+        "hover:scale-[1.08] active:scale-95",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ChatIcon, { className: "h-6 w-6" }),
+        unread > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: cn(
+              "absolute -right-0.5 -top-0.5 flex h-5 w-5 items-center justify-center",
+              "rounded-full bg-destructive text-[10px] font-bold text-white",
+              "ring-2 ring-background"
+            ),
+            children: unread > 9 ? "9+" : unread
+          }
+        )
+      ]
     }
-    const allStmtMap = new Map(completedStmtMap);
-    for (const s of stmts) {
-      const expr = parseExpression(s.tokens);
-      const stmt = classifyStatement(s, expr);
-      allStmtMap.set(s.id, stmt);
+  );
+}
+function Panel({
+  client,
+  businessName,
+  greeting,
+  subtitle,
+  starters,
+  placeholder,
+  messages,
+  isLoading,
+  isSending,
+  isTyping,
+  seenAt,
+  readAt,
+  error,
+  isActive,
+  isLeft,
+  humanRequested,
+  mayHaveOlder,
+  replyTo,
+  claimedAs,
+  onSignOut,
+  onClose,
+  onSend,
+  onReact,
+  onReply,
+  onCancelReply,
+  onRequestHuman,
+  onLoadOlder,
+  onAttach,
+  onStartConversation,
+  currency,
+  onGenUIAction,
+  classNames
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex flex-col overflow-hidden rounded-2xl bg-background shadow-2xl",
+        "w-[400px] max-w-[calc(100vw-3rem)]",
+        "h-[min(600px,calc(100vh-6rem))]",
+        "animate-in fade-in slide-in-from-bottom-4 duration-300",
+        isLeft ? "origin-bottom-left" : "origin-bottom-right",
+        classNames?.panel
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Header,
+          {
+            businessName,
+            claimedAs,
+            onSignOut,
+            onClose,
+            className: classNames?.header
+          }
+        ),
+        !isActive && !isLoading ? /* @__PURE__ */ jsxRuntime.jsx(
+          Welcome,
+          {
+            greeting,
+            subtitle,
+            starters,
+            onStarter: onStartConversation,
+            className: classNames?.welcome
+          }
+        ) : /* @__PURE__ */ jsxRuntime.jsx(
+          MessageList,
+          {
+            messages,
+            businessName,
+            isLoading,
+            isSending: isTyping,
+            seenAt,
+            readAt,
+            humanRequested,
+            mayHaveOlder,
+            onReact,
+            onReply,
+            onRequestHuman,
+            onLoadOlder,
+            currency,
+            onGenUIAction,
+            className: classNames?.messages
+          }
+        ),
+        isActive && !claimedAs && client && /* @__PURE__ */ jsxRuntime.jsx(KeepConversation, { client }),
+        humanRequested && isActive && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 border-t border-border bg-muted/50 px-4 py-2 text-[11px] text-muted-foreground", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-1.5 w-1.5 flex-shrink-0 animate-pulse rounded-full bg-amber-500" }),
+          "Waiting for ",
+          businessName,
+          " \u2014 usually replies in minutes"
+        ] }),
+        error != null && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t border-destructive/20 bg-destructive/10 px-4 py-2 text-xs text-destructive", children: error.userMessage || "Something went wrong. Please try again." }),
+        replyTo && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-2 border-t border-border bg-muted/50 px-4 py-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-[3px] shrink-0 self-stretch rounded-full bg-foreground/40" }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-[11px] font-semibold text-foreground", children: [
+              "Replying to ",
+              replyTo.sender_type === "customer" ? "yourself" : businessName
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-[11px] text-muted-foreground", children: proseOf(replyTo.content) || "Photo" })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              type: "button",
+              "aria-label": "Cancel reply",
+              onClick: onCancelReply,
+              className: "flex-shrink-0 p-0.5 text-muted-foreground hover:text-foreground",
+              children: /* @__PURE__ */ jsxRuntime.jsx(CloseIcon, { className: "h-3.5 w-3.5" })
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ChatInput,
+          {
+            placeholder,
+            isSending,
+            onSend: isActive ? onSend : async (text2) => {
+              await onStartConversation(text2);
+              return true;
+            },
+            onAttach,
+            className: classNames?.input
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-shrink-0 border-t border-border bg-background px-4 py-1.5 text-center text-[10px] text-muted-foreground", children: [
+          "Powered by",
+          " ",
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-foreground", children: "Cimplify" })
+        ] })
+      ]
     }
-    const allTypedStmts = [...allStmtMap.values()];
-    const fid = firstId || stmts[0].id;
-    return buildResult(
-      allStmtMap,
-      allTypedStmts,
-      fid,
-      wasIncomplete,
-      allStmtMap.size,
-      cat,
-      rootName
-    );
-  }
-  function reset() {
-    buf = "";
-    cleaned = "";
-    completedEnd = 0;
-    completedStmtMap.clear();
-    firstId = "";
-  }
-  return {
-    push(chunk) {
-      buf += chunk;
-      return currentResult();
-    },
-    set(fullText) {
-      if (fullText.length < buf.length || !fullText.startsWith(buf)) {
-        reset();
-      }
-      const delta = fullText.slice(buf.length);
-      if (delta) buf += delta;
-      return currentResult();
-    },
-    getResult: currentResult
-  };
+  );
 }
-function useGenUIProgram(text, catalog) {
-  const parserRef = React14.useRef(
-    null
+function Header({
+  businessName,
+  claimedAs,
+  onSignOut,
+  onClose,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex flex-shrink-0 items-center gap-3 bg-foreground px-5 py-4 text-background",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-9 w-9 flex-shrink-0 items-center justify-center rounded-[10px] bg-background/15", children: /* @__PURE__ */ jsxRuntime.jsx(ChatIcon, { className: "h-5 w-5" }) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-[15px] font-semibold leading-tight", children: businessName }),
+          claimedAs ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 truncate text-xs text-background/60", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "truncate", children: [
+              "Chatting as ",
+              claimedAs
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: "\xB7" }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                type: "button",
+                onClick: onSignOut,
+                className: "flex-shrink-0 underline underline-offset-2 hover:text-background",
+                children: "Not you?"
+              }
+            )
+          ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5 text-xs text-background/60", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-[7px] w-[7px] flex-shrink-0 rounded-full bg-emerald-400" }),
+            "Online"
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onClose,
+            "aria-label": "Close chat",
+            className: cn(
+              "flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-lg",
+              "bg-background/10 text-background/70 transition-colors hover:bg-background/20 hover:text-background"
+            ),
+            children: /* @__PURE__ */ jsxRuntime.jsx(CloseIcon, { className: "h-[18px] w-[18px]" })
+          }
+        )
+      ]
+    }
   );
-  if (!parserRef.current || parserRef.current.catalog !== catalog) {
-    parserRef.current = { catalog, parser: createStreamParser(catalog, "root") };
-  }
-  const lastGoodRef = React14.useRef(null);
-  return React14.useMemo(() => {
-    const result = parserRef.current.parser.set(text);
-    if (result.root) {
-      lastGoodRef.current = result.root;
+}
+function Welcome({
+  greeting,
+  subtitle,
+  starters,
+  onStarter,
+  className
+}) {
+  const defaultStarters = [
+    { icon: "\u{1F50D}", text: "Help me find a product" },
+    { icon: "\u{1F6D2}", text: "Check my cart" },
+    { icon: "\u{1F4E6}", text: "Track my order" }
+  ];
+  const items = starters ?? defaultStarters;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "flex flex-1 flex-col items-center justify-center overflow-y-auto bg-muted/50 px-8 py-10 text-center",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-5 flex h-16 w-16 items-center justify-center rounded-2xl bg-muted", children: /* @__PURE__ */ jsxRuntime.jsx(ChatIcon, { className: "h-7 w-7 text-muted-foreground" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-2 text-xl font-bold text-foreground", children: greeting }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-6 max-w-[280px] text-sm leading-relaxed text-muted-foreground", children: subtitle }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-full max-w-[300px] flex-col gap-2", children: items.map((s) => /* @__PURE__ */ jsxRuntime.jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => onStarter(s.text),
+            className: cn(
+              "flex items-center gap-3 rounded-xl border border-border bg-background px-4 py-3",
+              "text-left text-[13px] font-medium text-foreground",
+              "transition-all hover:-translate-y-px hover:border-foreground hover:shadow-sm"
+            ),
+            children: [
+              s.icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-lg bg-muted text-[15px]", children: s.icon }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { children: s.text })
+            ]
+          },
+          s.text
+        )) })
+      ]
     }
-    return { result, root: result.root ?? lastGoodRef.current };
-  }, [text, catalog]);
+  );
 }
-var noop = () => {
-};
-function childKey(value, index) {
-  if (isElementNode(value) && value.statementId) return `s:${value.statementId}`;
-  return `i:${index}`;
+var QUICK_REACTIONS = ["\u{1F44D}", "\u2764\uFE0F"];
+function LetterAvatar({ name }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-6 items-center justify-center rounded-full bg-foreground text-[10px] font-bold text-background", children: name.charAt(0).toUpperCase() });
 }
-var RenderDepthContext = React14.createContext(0);
-var MAX_DEPTH = 64;
-var GenUINode = React14.memo(function GenUINode2({
-  node,
-  components,
-  onAction,
-  isStreaming,
-  onTelemetry
+function MessageList({
+  messages,
+  businessName,
+  isLoading,
+  isSending,
+  seenAt,
+  readAt,
+  humanRequested,
+  mayHaveOlder,
+  onReact,
+  onReply,
+  onRequestHuman,
+  onLoadOlder,
+  currency,
+  onGenUIAction,
+  className
 }) {
-  const depth = React14.useContext(RenderDepthContext);
-  if (depth > MAX_DEPTH) {
-    onTelemetry?.({ kind: "dropped-node", typeName: node.typeName });
-    return null;
+  const scrolledUpRef = React14.useRef(false);
+  const timeline = chatTimeline(messages, { readAt, rendersPrograms: true });
+  const { bubbles, reactionsByTarget, firstUnreadId, unreadOnOpen, firstAgentMessageId } = timeline;
+  const lastBubble = bubbles[bubbles.length - 1];
+  const offerHuman = !humanRequested && lastBubble?.sender_type === "bot" && !isSending;
+  const handleScroll = (event) => {
+    const node = event.currentTarget;
+    scrolledUpRef.current = node.scrollHeight - node.scrollTop - node.clientHeight >= AT_BOTTOM_SLACK_PX;
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      onScroll: handleScroll,
+      style: { background: "var(--color-chat-canvas, var(--color-muted, #f3f5f3))" },
+      className: cn("flex flex-1 flex-col gap-0.5 overflow-y-auto px-3.5 py-3.5", className),
+      children: [
+        isLoading && messages.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(TypingDots, {}) }),
+        mayHaveOlder && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center pb-1", children: /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onLoadOlder,
+            className: "rounded-full border border-foreground/[0.06] bg-background px-3.5 py-[7px] text-xs font-semibold text-muted-foreground shadow-[0_1px_2px_rgba(15,23,42,0.04)]",
+            children: "Show earlier messages"
+          }
+        ) }),
+        bubbles.map((msg, i) => {
+          const prev = bubbles[i - 1];
+          const newDay = !prev || !sameDay(prev.created_at, msg.created_at);
+          const group = groupPosition(timeline, i);
+          const startsRun = group === "single" || group === "first";
+          const delivery = deliveryState(msg, timeline, seenAt, isOptimistic);
+          return /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              className: cn("flex flex-col gap-1.5", startsRun && i > 0 && "mt-2.5"),
+              children: [
+                newDay && /* @__PURE__ */ jsxRuntime.jsx(Seam, { variant: "chip", label: dayLabel(msg.created_at) }),
+                msg.id === firstUnreadId && /* @__PURE__ */ jsxRuntime.jsx(
+                  Seam,
+                  {
+                    variant: "unread",
+                    label: `${unreadOnOpen} new message${unreadOnOpen === 1 ? "" : "s"}`
+                  }
+                ),
+                msg.id === firstAgentMessageId && /* @__PURE__ */ jsxRuntime.jsx(Seam, { label: "A person joined" }),
+                msg.sender_type === "system" ? /* @__PURE__ */ jsxRuntime.jsx(Seam, { label: "Passing you to the team" }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group relative", children: [
+                  msg.sender_type !== "customer" && !isOptimistic(msg) && /* @__PURE__ */ jsxRuntime.jsx(HoverRail, { message: msg, onReact, onReply }),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    MessageBubble,
+                    {
+                      message: msg,
+                      reactions: reactionsByTarget.get(msg.id),
+                      businessName,
+                      group,
+                      delivery,
+                      onReply,
+                      avatar: /* @__PURE__ */ jsxRuntime.jsx(LetterAvatar, { name: businessName }),
+                      renderProgram: (source) => /* @__PURE__ */ jsxRuntime.jsx(ChatKitProgram, { source, onAction: onGenUIAction }),
+                      renderCards: (target) => /* @__PURE__ */ jsxRuntime.jsx(ChatReplyCards, { message: target, currency, onAction: onGenUIAction }),
+                      onQuoteMiss: async () => {
+                        onLoadOlder();
+                        return true;
+                      }
+                    }
+                  )
+                ] })
+              ]
+            },
+            msg.id
+          );
+        }),
+        isSending && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mr-auto mt-1", children: /* @__PURE__ */ jsxRuntime.jsx(TypingDots, {}) }),
+        offerHuman && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2", children: /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onRequestHuman,
+            className: "rounded-full border border-border bg-background px-3 py-1.5 text-xs font-semibold text-foreground hover:border-foreground",
+            children: "Talk to a person"
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            ref: (node) => {
+              if (node && !scrolledUpRef.current) node.scrollIntoView({ behavior: "smooth" });
+            }
+          },
+          `${messages.length}:${isSending}`
+        )
+      ]
+    }
+  );
+}
+function HoverRail({
+  message,
+  onReact,
+  onReply
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute -top-3 right-0 z-10 hidden gap-0.5 rounded-full border border-border bg-background px-1 py-0.5 shadow-sm group-hover:flex", children: [
+    QUICK_REACTIONS.map((emoji) => /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        type: "button",
+        "aria-label": `React ${emoji}`,
+        onClick: () => void onReact(message, emoji),
+        className: "flex h-6 w-6 items-center justify-center rounded-full text-[13px] hover:bg-muted",
+        children: emoji
+      },
+      emoji
+    )),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        type: "button",
+        "aria-label": "Reply",
+        onClick: () => onReply(message),
+        className: "flex h-6 w-6 items-center justify-center rounded-full text-muted-foreground hover:bg-muted hover:text-foreground",
+        children: /* @__PURE__ */ jsxRuntime.jsx(ReplyIcon, { className: "h-3.5 w-3.5" })
+      }
+    )
+  ] });
+}
+function readKeepDismissed() {
+  try {
+    return typeof window !== "undefined" && window.localStorage.getItem(KEEP_DISMISSED_KEY) === "1";
+  } catch {
+    return false;
   }
-  const renderer = components[node.typeName];
-  if (!renderer) {
-    onTelemetry?.({ kind: "unknown-component", typeName: node.typeName });
-    return null;
+}
+function writeKeepDismissed() {
+  try {
+    window.localStorage.setItem(KEEP_DISMISSED_KEY, "1");
+  } catch {
   }
-  const render = (value) => {
-    if (value == null) return null;
-    if (isElementNode(value)) {
-      return /* @__PURE__ */ jsxRuntime.jsx(RenderDepthContext.Provider, { value: depth + 1, children: /* @__PURE__ */ jsxRuntime.jsx(
-        GenUINode2,
-        {
-          node: value,
-          components,
-          onAction,
-          isStreaming,
-          onTelemetry
-        }
-      ) });
+}
+function KeepConversation({ client }) {
+  const [step, setStep] = React14.useState("row");
+  const [dismissed, setDismissed] = React14.useState(readKeepDismissed);
+  const [contact, setContact] = React14.useState("");
+  const [code, setCode] = React14.useState("");
+  const [busy, setBusy] = React14.useState(false);
+  const [verifyError, setVerifyError] = React14.useState(null);
+  if (dismissed) return null;
+  const contactType = contact.includes("@") ? "email" : "phone";
+  const requestCode = async () => {
+    const trimmed = contact.trim();
+    if (!trimmed || busy) return;
+    setBusy(true);
+    setVerifyError(null);
+    const result = await client.link.requestOtp({ contact: trimmed, contact_type: contactType });
+    setBusy(false);
+    if (result.ok) {
+      setCode("");
+      setStep("code");
+    } else {
+      setVerifyError(result.error.userMessage || "Couldn't send a code \u2014 try again.");
     }
-    if (Array.isArray(value)) {
-      return value.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: render(item) }, childKey(item, index)));
+  };
+  const verify = async (value) => {
+    if (value.length !== 6 || busy) return;
+    setBusy(true);
+    setVerifyError(null);
+    const result = await client.link.verifyOtp({
+      contact: contact.trim(),
+      contact_type: contactType,
+      otp_code: value
+    });
+    setBusy(false);
+    if (!result.ok) {
+      setCode("");
+      setVerifyError(result.error.userMessage || "Invalid or expired code.");
     }
-    if (typeof value === "object" && isRuntimeExpr(value)) return null;
-    if (typeof value === "string" || typeof value === "number") return String(value);
-    return null;
   };
-  return renderer({ node, ctx: { render, onAction, isStreaming } });
-});
-function GenUIView({
-  root,
-  components,
-  onAction = noop,
-  isStreaming = false,
-  onTelemetry,
-  placeholder = null
-}) {
-  if (!root) return placeholder;
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    GenUINode,
-    {
-      node: root,
-      components,
-      onAction,
-      isStreaming,
-      onTelemetry
-    }
-  );
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-shrink-0 border-t border-border bg-muted/50 px-4 py-2.5", children: [
+    step === "row" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2.5", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "button",
+        {
+          type: "button",
+          onClick: () => setStep("contact"),
+          className: "flex min-w-0 flex-1 flex-col text-left",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-semibold text-foreground", children: "Keep this conversation" }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-[11px] text-muted-foreground", children: "Verify your number and it follows you \u2014 any device" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          "aria-label": "Dismiss",
+          onClick: () => {
+            writeKeepDismissed();
+            setDismissed(true);
+          },
+          className: "flex-shrink-0 p-1 text-muted-foreground hover:text-foreground",
+          children: /* @__PURE__ */ jsxRuntime.jsx(CloseIcon, { className: "h-3.5 w-3.5" })
+        }
+      )
+    ] }),
+    step === "contact" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          type: "text",
+          inputMode: "email",
+          value: contact,
+          onChange: (e) => setContact(e.target.value),
+          onKeyDown: (e) => e.key === "Enter" && void requestCode(),
+          placeholder: "Phone or email",
+          autoFocus: true,
+          className: "h-9 min-w-0 flex-1 rounded-lg border border-border bg-background px-3 text-xs text-foreground outline-none placeholder:text-muted-foreground focus:border-foreground"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => void requestCode(),
+          disabled: !contact.trim() || busy,
+          className: "h-9 flex-shrink-0 rounded-lg bg-foreground px-3 text-xs font-semibold text-background disabled:opacity-50",
+          children: busy ? "Sending\u2026" : "Send code"
+        }
+      )
+    ] }),
+    step === "code" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          type: "text",
+          inputMode: "numeric",
+          autoComplete: "one-time-code",
+          maxLength: 6,
+          value: code,
+          onChange: (e) => {
+            const digits = e.target.value.replace(/\D/g, "").slice(0, 6);
+            setCode(digits);
+            if (digits.length === 6) void verify(digits);
+          },
+          placeholder: "6-digit code",
+          autoFocus: true,
+          className: "h-9 min-w-0 flex-1 rounded-lg border border-border bg-background px-3 text-xs tracking-[0.2em] text-foreground outline-none placeholder:tracking-normal placeholder:text-muted-foreground focus:border-foreground"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => void requestCode(),
+          disabled: busy,
+          className: "h-9 flex-shrink-0 rounded-lg px-2 text-[11px] font-medium text-muted-foreground hover:text-foreground disabled:opacity-50",
+          children: "Resend"
+        }
+      )
+    ] }),
+    verifyError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1.5 text-[11px] text-destructive", children: verifyError })
+  ] });
 }
-
-// src/genui/registry.ts
-var CIMPLIFY_GENUI_REGISTRY = {
-  version: "3",
-  components: [
-    {
-      name: "Stack",
-      description: 'Layout container. direction: "column" (default) or "row"; gap in points (default 12)',
-      params: [{ name: "children", required: true }, { name: "direction" }, { name: "gap" }]
-    },
-    {
-      name: "Card",
-      description: "Elevated surface grouping related content, with an optional title",
-      params: [{ name: "children", required: true }, { name: "title" }]
-    },
-    {
-      name: "TextContent",
-      description: 'Text block. size: "display", "heading", "title", "body" (default), "label", "caption"',
-      params: [{ name: "text", required: true }, { name: "size" }]
-    },
-    {
-      name: "Stat",
-      description: "Compact stat: small label over a bold value, optional sub line and tone",
-      params: [
-        { name: "label", required: true },
-        { name: "value", required: true },
-        { name: "sub" },
-        { name: "tone" }
-      ]
-    },
-    {
-      name: "Metric",
-      description: "KPI card with label, value, optional percent change and SF Symbol icon",
-      params: [
-        { name: "label", required: true },
-        { name: "value", required: true },
-        { name: "change" },
-        { name: "icon" }
-      ]
-    },
-    {
-      name: "KeyValue",
-      description: "Label/value row; set mono true for numeric values",
-      params: [
-        { name: "label", required: true },
-        { name: "value", required: true },
-        { name: "mono" }
-      ]
-    },
-    {
-      name: "Badge",
-      description: "Small status chip. tone: neutral, positive, info, indigo, violet, warning, danger",
-      params: [{ name: "label", required: true }, { name: "tone" }]
-    },
-    {
-      name: "Callout",
-      description: "Inline alert with title, optional message. tone: info (default), success, warning, danger, accent, neutral",
-      params: [{ name: "title", required: true }, { name: "message" }, { name: "tone" }]
-    },
-    {
-      name: "Button",
-      description: 'Action button. action: "action:name" string or Action([...]) steps. variant: primary, cta, secondary (default), ghost, destructive',
-      params: [
-        { name: "label", required: true },
-        { name: "action", required: true },
-        { name: "variant" }
-      ]
-    },
-    {
-      name: "Buttons",
-      description: 'Row (default) or column of Buttons; direction: "row" or "column"',
-      params: [{ name: "children", required: true }, { name: "direction" }]
-    },
-    {
-      name: "Divider",
-      description: "Hairline separator",
-      params: []
-    },
-    {
-      name: "Table",
-      description: "Data table: headers is an array of strings, rows an array of cell arrays",
-      params: [
-        { name: "headers", required: true },
-        { name: "rows", required: true }
-      ]
-    },
-    {
-      name: "BarChart",
-      description: "Bar chart: labels (x axis strings) and values (numbers), optional title",
-      params: [
-        { name: "labels", required: true },
-        { name: "values", required: true },
-        { name: "title" }
-      ]
-    },
-    {
-      name: "LineChart",
-      description: "Line chart with area fill: labels and values, optional title",
-      params: [
-        { name: "labels", required: true },
-        { name: "values", required: true },
-        { name: "title" }
-      ]
-    },
-    {
-      name: "Money",
-      description: "Formatted money amount, never abbreviated. currency: ISO code (default USD)",
-      params: [{ name: "amount", required: true }, { name: "currency" }]
+function ChatInput({
+  placeholder,
+  isSending,
+  onSend,
+  onAttach,
+  className
+}) {
+  const [value, setValue] = React14.useState("");
+  const [uploading, setUploading] = React14.useState(false);
+  const textareaRef = React14.useRef(null);
+  const fileRef = React14.useRef(null);
+  const handleAttach = React14.useCallback(
+    async (file) => {
+      setUploading(true);
+      try {
+        await onAttach(file);
+      } finally {
+        setUploading(false);
+      }
     },
-    {
-      name: "Image",
-      description: "Remote image by URL with optional caption",
-      params: [{ name: "url", required: true }, { name: "caption" }]
+    [onAttach]
+  );
+  const handleSend = React14.useCallback(async () => {
+    const trimmed = value.trim();
+    if (!trimmed || isSending) return;
+    setValue("");
+    if (textareaRef.current) {
+      textareaRef.current.style.height = "auto";
+    }
+    const sent = await onSend(trimmed);
+    if (!sent) setValue((current) => current || trimmed);
+  }, [value, isSending, onSend]);
+  const handleKeyDown = React14.useCallback(
+    (e) => {
+      if (e.key === "Enter" && !e.shiftKey) {
+        e.preventDefault();
+        handleSend();
+      }
     },
+    [handleSend]
+  );
+  const handleInput = React14.useCallback(() => {
+    const el = textareaRef.current;
+    if (!el) return;
+    el.style.height = "auto";
+    el.style.height = `${Math.min(el.scrollHeight, 100)}px`;
+  }, []);
+  const hasContent = value.trim().length > 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
     {
-      name: "ListRow",
-      description: "Entity row for orders/customers/products/invoices: initials avatar (or SF Symbol tile via symbol), title + subtitle, trailing value and badge with tone",
-      params: [
-        { name: "title", required: true },
-        { name: "subtitle" },
-        { name: "value" },
-        { name: "badge" },
-        { name: "tone" },
-        { name: "symbol" }
+      className: cn(
+        "flex flex-shrink-0 items-end gap-2 border-t border-border bg-background px-4 py-3",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "input",
+          {
+            ref: fileRef,
+            type: "file",
+            accept: "image/*",
+            className: "hidden",
+            "aria-hidden": "true",
+            tabIndex: -1,
+            onChange: (e) => {
+              const file = e.target.files?.[0];
+              e.target.value = "";
+              if (file) void handleAttach(file);
+            }
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            "aria-label": "Attach a photo",
+            disabled: uploading,
+            onClick: () => fileRef.current?.click(),
+            className: cn(
+              "flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-[10px]",
+              "bg-muted text-muted-foreground transition-colors hover:text-foreground",
+              uploading && "animate-pulse"
+            ),
+            children: /* @__PURE__ */ jsxRuntime.jsx(ImageIcon, { className: "h-[18px] w-[18px]" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: cn(
+              "flex flex-1 items-end rounded-xl border-[1.5px] border-transparent bg-muted px-1",
+              "transition-colors focus-within:border-foreground focus-within:bg-background"
+            ),
+            children: /* @__PURE__ */ jsxRuntime.jsx(
+              "textarea",
+              {
+                ref: textareaRef,
+                value,
+                onChange: (e) => setValue(e.target.value),
+                onKeyDown: handleKeyDown,
+                onInput: handleInput,
+                placeholder,
+                rows: 1,
+                className: cn(
+                  "max-h-[100px] min-h-[20px] flex-1 resize-none bg-transparent px-2.5 py-2",
+                  "text-sm text-foreground outline-none placeholder:text-muted-foreground"
+                )
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: handleSend,
+            disabled: !hasContent || isSending,
+            "aria-label": "Send message",
+            className: cn(
+              "flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-[10px]",
+              "transition-all duration-200",
+              hasContent && !isSending ? "bg-foreground text-background hover:scale-105 active:scale-95" : "bg-muted text-muted-foreground"
+            ),
+            children: /* @__PURE__ */ jsxRuntime.jsx(SendIcon, { className: "h-[18px] w-[18px]" })
+          }
+        )
       ]
-    },
+    }
+  );
+}
+function TypingDots() {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1 px-4 py-3", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
     {
-      name: "Timeline",
-      description: "Event history (order journey, payment trail): events is an array of {title, detail?, time?, tone?} objects, newest first",
-      params: [{ name: "events", required: true }]
+      className: "h-[7px] w-[7px] animate-bounce rounded-full bg-muted-foreground/40",
+      style: { animationDelay: `${i * 160}ms` }
     },
+    i
+  )) });
+}
+function ChatIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
     {
-      name: "Progress",
-      description: "Amount toward a bound (goal, stock cover, capacity): numeric value and target (default 100), optional detail caption and tone",
-      params: [
-        { name: "label", required: true },
-        { name: "value", required: true },
-        { name: "target" },
-        { name: "detail" },
-        { name: "tone" }
-      ]
-    },
+      className,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z" })
+    }
+  );
+}
+function CloseIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
     {
-      name: "DonutChart",
-      description: "Share of a whole (sales by channel, revenue by category): labels + values, optional title and center display string (e.g. the formatted total)",
-      params: [
-        { name: "labels", required: true },
-        { name: "values", required: true },
-        { name: "title" },
-        { name: "center" }
-      ]
-    },
+      className,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6L6 18M6 6l12 12" })
+    }
+  );
+}
+function SendIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
     {
-      name: "StatusTrack",
-      description: "Stage tracker (order fulfilment, invoice lifecycle): steps are stage names, current is the active step name or index",
-      params: [
-        { name: "steps", required: true },
-        { name: "current", required: true }
+      className,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "22", y1: "2", x2: "11", y2: "13" }),
+        /* @__PURE__ */ jsxRuntime.jsx("polygon", { points: "22 2 15 22 11 13 2 9 22 2" })
       ]
-    },
+    }
+  );
+}
+function ImageIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
     {
-      name: "LineItems",
-      description: "Order/quote/invoice money block: items is an array of {qty?, name, amount} with display-ready amount strings, adjustments an array of {label, amount, tone?}, total the anchored display string",
-      params: [
-        { name: "items", required: true },
-        { name: "total", required: true },
-        { name: "adjustments" }
+      className,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", ry: "2" }),
+        /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "8.5", cy: "8.5", r: "1.5" }),
+        /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "21 15 16 10 5 21" })
       ]
-    },
-    {
-      name: "Grid",
-      description: "Tile layout for Stat/Metric children, columns default 2",
-      params: [{ name: "children", required: true }, { name: "columns" }]
-    },
+    }
+  );
+}
+function ReplyIcon({ className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
     {
-      name: "Banner",
-      description: "Hero-stat moment on a tonal wash: big value, label, optional percent delta. tone: positive (default), warning, danger, info, neutral",
-      params: [
-        { name: "value", required: true },
-        { name: "label", required: true },
-        { name: "delta" },
-        { name: "tone" }
+      className,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "9 17 4 12 9 7" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 18v-2a4 4 0 0 0-4-4H4" })
       ]
-    },
-    {
-      name: "EmptyState",
-      description: "Nothing-to-show state with an SF Symbol and optional message",
-      params: [{ name: "title", required: true }, { name: "message" }, { name: "symbol" }]
     }
-  ]
-};
+  );
+}
+function useGenUIProgram(text2, catalog) {
+  const parserRef = React14.useRef(
+    null
+  );
+  if (!parserRef.current || parserRef.current.catalog !== catalog) {
+    parserRef.current = { catalog, parser: createStreamParser(catalog, "root") };
+  }
+  const lastGoodRef = React14.useRef(null);
+  return React14.useMemo(() => {
+    const result = parserRef.current.parser.set(text2);
+    if (result.root) {
+      lastGoodRef.current = result.root;
+    }
+    return { result, root: result.root ?? lastGoodRef.current };
+  }, [text2, catalog]);
+}
 
 // src/genui/manifest.ts
 function genUIManifest(registry) {
@@ -20535,6 +20881,9 @@ exports.BundleProductCard = BundleProductCard;
 exports.BundleProductLayout = BundleProductLayout;
 exports.BundleSelector = BundleSelector;
 exports.Button = Button;
+exports.CHAT_ACTION_VIEW_ORDER = CHAT_ACTION_VIEW_ORDER;
+exports.CHAT_ACTION_VIEW_PRODUCT = CHAT_ACTION_VIEW_PRODUCT;
+exports.CHAT_GENUI_COMPONENTS = CHAT_GENUI_COMPONENTS;
 exports.CIMPLIFY_GENUI_REGISTRY = CIMPLIFY_GENUI_REGISTRY;
 exports.CardImage = CardImage;
 exports.CardShell = CardShell;
@@ -20549,7 +20898,9 @@ exports.CataloguePage = CataloguePage;
 exports.CatalogueTemplate = CatalogueTemplate;
 exports.CategoryFilter = CategoryFilter;
 exports.CategoryGrid = CategoryGrid;
+exports.ChatKitProgram = ChatKitProgram;
 exports.ChatMarkdown = ChatMarkdown;
+exports.ChatReplyCards = ChatReplyCards;
 exports.ChatWidget = ChatWidget;
 exports.CheckIcon = CheckIcon;
 exports.CheckoutPage = CheckoutPage;
@@ -20702,6 +21053,7 @@ exports.isImageAttachment = isImageAttachment;
 exports.isOptimistic = isOptimistic;
 exports.isTerminalOrderStatus = isTerminalOrderStatus;
 exports.optimisticId = optimisticId;
+exports.parseChatAction = parseChatAction;
 exports.parseGenUIProgram = parse;
 exports.partitionMessages = partitionMessages;
 exports.prefersReducedMotion = prefersReducedMotion;