@timbal-ai/timbal-react 0.6.0 → 0.7.0

package/dist/chunk-M4V6Q6XO.esm.js

@@ -1,1082 +0,0 @@
-import {
-  SIDEBAR_INSET_PX_EXPANDED,
-  ShellInsetProvider,
-  studioChromeShellStyle,
-  studioSidebarWidthTransition
-} from "./chunk-OFHLFNJH.esm.js";
-import {
-  ChartArtifactView,
-  Thread,
-  TimbalRuntimeProvider,
-  studioIntegrationCardClass,
-  studioSearchChromeClass,
-  studioSecondaryChromeClass,
-  studioTopbarPillHeightClass
-} from "./chunk-YJQLLFKP.esm.js";
-import {
-  PillSegmentedTabs
-} from "./chunk-IYENDIRY.esm.js";
-import {
-  Dialog,
-  DialogContent,
-  DialogTitle,
-  TIMBAL_V2_SWITCH_THUMB,
-  TIMBAL_V2_SWITCH_TRACK_OFF,
-  TimbalV2Button,
-  cn
-} from "./chunk-4TCJQSIX.esm.js";
-
-// src/design/app-classes.ts
-var appPageColumnClass = "mx-auto w-full max-w-6xl px-4 md:px-6";
-var appShellTopbarInsetClass = "w-full px-4 md:px-6";
-var appShellInsetTopClass = "pt-4 md:pt-6";
-var appShellTopbarRowClass = cn(
-  studioTopbarPillHeightClass,
-  "flex w-full items-center justify-between gap-2"
-);
-var appShellTopbarStickyClass = cn(
-  "sticky top-0 z-20 shrink-0 bg-background pb-2",
-  appShellInsetTopClass
-);
-var appPageHeaderClass = cn(
-  "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between",
-  "pb-4 pt-2"
-);
-var appSectionClass = "flex flex-col gap-4 py-4";
-var appSectionTitleClass = "text-lg font-semibold text-foreground";
-var appSectionDescriptionClass = "text-sm text-muted-foreground";
-var appSurfaceCardClass = cn(
-  studioIntegrationCardClass,
-  "p-4 md:p-5"
-);
-var appStatTileClass = cn(
-  appSurfaceCardClass,
-  "flex flex-col gap-1"
-);
-var appStatValueClass = "text-2xl font-semibold tracking-tight text-foreground";
-var appStatLabelClass = "text-sm text-muted-foreground";
-var appFilterBarClass = cn(
-  "flex flex-wrap items-center gap-2",
-  studioTopbarPillHeightClass
-);
-var appSearchInputClass = cn(studioSearchChromeClass, "text-sm");
-var appBreadcrumbsClass = "flex flex-wrap items-center gap-1.5 text-sm text-muted-foreground";
-var appBreadcrumbLinkClass = "transition-colors hover:text-foreground";
-var appFieldClass = "flex flex-col gap-1.5";
-var appFieldLabelClass = "text-sm font-medium text-foreground";
-var appFieldHintClass = "text-xs text-muted-foreground";
-var appInputClass = cn(
-  studioSecondaryChromeClass,
-  "h-10 w-full rounded-lg px-3 text-sm text-foreground outline-none",
-  "placeholder:text-muted-foreground/70",
-  "focus-visible:ring-2 focus-visible:ring-foreground/10"
-);
-var appEmptyStateClass = cn(
-  appSurfaceCardClass,
-  "flex flex-col items-center justify-center gap-2 py-12 text-center"
-);
-var appEmptyStateTitleClass = "text-base font-medium text-foreground";
-var appEmptyStateDescriptionClass = "max-w-sm text-sm text-muted-foreground";
-var appChartPanelClass = cn(appSurfaceCardClass, "flex flex-col gap-3");
-var appChartPanelTitleClass = "text-sm font-medium text-foreground";
-
-// src/app/layout/app-shell-chat-context.tsx
-import { createContext, useContext } from "react";
-var AppShellChatContext = createContext(null);
-var AppShellChatProvider = AppShellChatContext.Provider;
-function useAppShellChat() {
-  return useContext(AppShellChatContext);
-}
-
-// src/app/layout/AppShell.tsx
-import { motion, useReducedMotion } from "motion/react";
-import { useCallback, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-var floatingTriggerClass = cn(
-  "aui-app-shell-chat-trigger-fixed fixed z-50 rounded-full px-5 py-2.5 text-sm font-medium shadow-card-elevated",
-  "bg-primary text-primary-foreground transition-colors hover:bg-primary/90",
-  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
-  "bottom-6 right-6 max-sm:bottom-4 max-sm:right-4"
-);
-var floatingPanelClass = cn(
-  "aui-app-shell-chat-float fixed z-50 flex flex-col overflow-hidden rounded-2xl border border-border/60 shadow-card-elevated",
-  "bg-card/85 backdrop-blur-xl supports-backdrop-filter:bg-card/75",
-  // Mobile: stretch between insets (no fixed width — avoids a wide empty strip on the right)
-  "max-sm:inset-x-3 max-sm:top-3 max-sm:bottom-3 max-sm:w-auto",
-  "sm:top-6 sm:right-6 sm:bottom-6 sm:w-[var(--app-shell-chat-width)] sm:max-w-[calc(100vw-3rem)]"
-);
-var AppShellBody = ({
-  sidebar,
-  topbarContent,
-  mainClassName,
-  insetPaddingPx,
-  insetExpanded,
-  children
-}) => {
-  const reducedMotion = useReducedMotion();
-  const layoutDirection = insetExpanded ? "expand" : "collapse";
-  const layoutTransition = studioSidebarWidthTransition(
-    !!reducedMotion,
-    layoutDirection
-  );
-  const insetPadding = sidebar ? insetPaddingPx : 0;
-  return /* @__PURE__ */ jsx(
-    motion.div,
-    {
-      className: "aui-app-shell-body relative z-10 flex min-h-0 min-w-0 flex-1 flex-col",
-      initial: false,
-      animate: { paddingLeft: insetPadding },
-      transition: layoutTransition,
-      children: /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: cn(
-            "aui-app-shell-scroll flex min-h-0 flex-1 flex-col overflow-y-auto",
-            !topbarContent && appShellInsetTopClass
-          ),
-          children: [
-            topbarContent ? /* @__PURE__ */ jsx("header", { className: cn("aui-app-shell-topbar-region", appShellTopbarStickyClass), children: /* @__PURE__ */ jsx("div", { className: appShellTopbarInsetClass, children: topbarContent }) }) : null,
-            /* @__PURE__ */ jsx("main", { className: cn("aui-app-shell-main min-w-0 flex-1", mainClassName), children })
-          ]
-        }
-      )
-    }
-  );
-};
-var AppShell = ({
-  sidebar,
-  topbar,
-  header,
-  children,
-  chat,
-  chatWidth = "24rem",
-  chatHeight,
-  chatOpen: chatOpenProp,
-  defaultChatOpen = false,
-  onChatOpenChange,
-  chatCollapsible = true,
-  chatTriggerLabel = "Assistant",
-  hideChatTrigger = false,
-  className,
-  mainClassName
-}) => {
-  const topbarContent = topbar ?? header;
-  const hasChat = Boolean(chat);
-  const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultChatOpen);
-  const isChatControlled = chatOpenProp !== void 0;
-  const chatOpen = isChatControlled ? chatOpenProp : uncontrolledOpen;
-  const setChatOpen = useCallback(
-    (open) => {
-      if (!isChatControlled) {
-        setUncontrolledOpen(open);
-      }
-      onChatOpenChange?.(open);
-    },
-    [isChatControlled, onChatOpenChange]
-  );
-  const toggleChat = useCallback(() => {
-    setChatOpen(!chatOpen);
-  }, [chatOpen, setChatOpen]);
-  const [insetPaddingPx, setInsetPaddingPx] = useState(
-    sidebar ? SIDEBAR_INSET_PX_EXPANDED : 0
-  );
-  const reportShellInset = useCallback((insetPx) => {
-    setInsetPaddingPx(insetPx);
-  }, []);
-  const insetExpanded = insetPaddingPx >= SIDEBAR_INSET_PX_EXPANDED;
-  const shellBody = /* @__PURE__ */ jsx(
-    AppShellBody,
-    {
-      sidebar,
-      topbarContent,
-      mainClassName,
-      insetPaddingPx,
-      insetExpanded,
-      children
-    }
-  );
-  const tree = /* @__PURE__ */ jsx(ShellInsetProvider, { value: sidebar ? reportShellInset : null, children: /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: cn(
-        "aui-app-shell relative flex h-dvh overflow-hidden bg-background",
-        className
-      ),
-      style: studioChromeShellStyle,
-      children: [
-        sidebar,
-        shellBody,
-        hasChat && chatOpen ? /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: floatingPanelClass,
-            style: {
-              ["--app-shell-chat-width"]: chatWidth,
-              ...chatHeight ? { height: chatHeight } : void 0
-            },
-            role: "dialog",
-            "aria-label": typeof chatTriggerLabel === "string" ? chatTriggerLabel : "Assistant",
-            children: chat
-          }
-        ) : null,
-        hasChat && chatCollapsible && !chatOpen && !hideChatTrigger ? /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            className: floatingTriggerClass,
-            onClick: () => setChatOpen(true),
-            "aria-expanded": false,
-            children: chatTriggerLabel
-          }
-        ) : null
-      ]
-    }
-  ) });
-  if (!hasChat) {
-    return tree;
-  }
-  return /* @__PURE__ */ jsx(
-    AppShellChatProvider,
-    {
-      value: {
-        open: chatOpen,
-        setOpen: setChatOpen,
-        toggle: toggleChat,
-        collapsible: chatCollapsible
-      },
-      children: tree
-    }
-  );
-};
-
-// src/app/layout/AppShellTopbar.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var AppShellTopbar = ({
-  start,
-  actions,
-  children,
-  className
-}) => {
-  return /* @__PURE__ */ jsxs2("div", { className: cn("aui-app-shell-topbar", appShellTopbarRowClass, className), children: [
-    /* @__PURE__ */ jsxs2("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
-      start,
-      children
-    ] }),
-    actions ? /* @__PURE__ */ jsx2("div", { className: "aui-app-shell-topbar-actions flex shrink-0 items-center gap-2", children: actions }) : null
-  ] });
-};
-
-// src/app/layout/AppShellChatTrigger.tsx
-import { jsx as jsx3 } from "react/jsx-runtime";
-var floatingPositionClass = "fixed bottom-6 right-6 z-50 max-sm:bottom-4 max-sm:right-4";
-var AppShellChatTrigger = ({
-  className,
-  label = "Assistant",
-  placement = "inline"
-}) => {
-  const shellChat = useAppShellChat();
-  if (!shellChat || shellChat.open) return null;
-  return /* @__PURE__ */ jsx3(
-    TimbalV2Button,
-    {
-      type: "button",
-      variant: placement === "floating" ? "primary" : "secondary",
-      size: "sm",
-      className: cn(
-        "aui-app-shell-chat-trigger",
-        placement === "floating" && floatingPositionClass,
-        placement === "floating" && "shadow-card-elevated",
-        className
-      ),
-      onClick: () => shellChat.setOpen(true),
-      "aria-expanded": false,
-      children: label
-    }
-  );
-};
-
-// src/app/layout/PageHeader.tsx
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-var PageHeader = ({
-  title,
-  description,
-  actions,
-  className
-}) => {
-  return /* @__PURE__ */ jsxs3("header", { className: cn("aui-app-page-header", appPageHeaderClass, className), children: [
-    /* @__PURE__ */ jsxs3("div", { className: "min-w-0", children: [
-      /* @__PURE__ */ jsx4("h1", { className: "text-2xl font-semibold tracking-tight text-foreground", children: title }),
-      description ? /* @__PURE__ */ jsx4("p", { className: "mt-1 text-sm text-muted-foreground", children: description }) : null
-    ] }),
-    actions ? /* @__PURE__ */ jsx4("div", { className: "aui-app-page-header-actions flex shrink-0 flex-wrap items-center gap-2", children: actions }) : null
-  ] });
-};
-
-// src/app/layout/Page.tsx
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
-var Page = ({
-  children,
-  breadcrumbs,
-  className,
-  ...headerProps
-}) => {
-  return /* @__PURE__ */ jsxs4("div", { className: cn("aui-app-page", appPageColumnClass, className), children: [
-    breadcrumbs,
-    /* @__PURE__ */ jsx5(PageHeader, { ...headerProps }),
-    children
-  ] });
-};
-
-// src/app/layout/Section.tsx
-import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
-var Section = ({
-  title,
-  description,
-  children,
-  className
-}) => {
-  return /* @__PURE__ */ jsxs5("section", { className: cn("aui-app-section", appSectionClass, className), children: [
-    title ? /* @__PURE__ */ jsx6("h2", { className: appSectionTitleClass, children: title }) : null,
-    description ? /* @__PURE__ */ jsx6("p", { className: appSectionDescriptionClass, children: description }) : null,
-    children
-  ] });
-};
-
-// src/app/copilot/app-copilot-context.tsx
-import { createContext as createContext2, useContext as useContext2 } from "react";
-import { jsx as jsx7 } from "react/jsx-runtime";
-var AppCopilotContext = createContext2(null);
-var AppCopilotProvider = ({
-  value,
-  children
-}) => {
-  return /* @__PURE__ */ jsx7(AppCopilotContext.Provider, { value, children });
-};
-function useAppCopilotContext() {
-  return useContext2(AppCopilotContext) ?? {};
-}
-
-// src/app/chat/AppChatPanel.tsx
-import { XIcon } from "lucide-react";
-import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
-var shellClass = "aui-app-chat-panel flex h-full min-h-0 flex-col overflow-hidden";
-var chromeClass = cn(
-  "aui-app-chat-panel-chrome relative z-20 flex min-h-12 shrink-0 items-center justify-end",
-  "bg-card/90 px-2 pt-3 pb-3 backdrop-blur-sm"
-);
-var closeButtonClass = cn(
-  "aui-app-chat-panel-close flex size-8 shrink-0 items-center justify-center rounded-md",
-  "text-muted-foreground transition-colors hover:bg-foreground/5 hover:text-foreground",
-  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-transparent"
-);
-var bodyClass = cn(
-  "aui-app-chat-panel-body relative min-h-0 flex-1 overflow-hidden",
-  "[&_.aui-thread-root]:h-full",
-  "[&_.aui-thread-viewport]:scrollbar-thin",
-  "[&_.aui-thread-viewport]:[scrollbar-color:var(--border)_transparent]",
-  // Reserve the scrollbar gutter on BOTH edges so the composer + messages
-  // stay symmetric (otherwise the right-side scrollbar adds a phantom inset).
-  "[&_.aui-thread-viewport]:[scrollbar-gutter:stable_both-edges]",
-  // Tighter symmetric horizontal inset for panel + composer
-  "[&_.aui-thread-viewport]:!px-2",
-  "[&_.aui-thread-viewport]:!pt-2",
-  "[&_.aui-user-message-root]:!px-0",
-  "[&_.aui-composer-input]:!px-2",
-  "[&_.aui-composer-action-wrapper]:!px-2"
-);
-var AppChatPanel = ({
-  className,
-  workforceId,
-  baseUrl,
-  fetch,
-  attachments,
-  attachmentsUploadUrl,
-  attachmentsAccept,
-  debug,
-  welcome,
-  suggestions,
-  composerPlaceholder,
-  components,
-  artifacts,
-  onArtifactEvent,
-  ...rest
-}) => {
-  const shellChat = useAppShellChat();
-  return /* @__PURE__ */ jsxs6("div", { className: cn(shellClass, className), children: [
-    shellChat?.collapsible ? /* @__PURE__ */ jsx8("div", { className: chromeClass, children: /* @__PURE__ */ jsx8(
-      "button",
-      {
-        type: "button",
-        className: closeButtonClass,
-        onClick: () => shellChat.setOpen(false),
-        "aria-label": "Close assistant",
-        children: /* @__PURE__ */ jsx8(XIcon, { className: "size-4", "aria-hidden": true })
-      }
-    ) }) : null,
-    /* @__PURE__ */ jsx8("div", { className: bodyClass, children: /* @__PURE__ */ jsx8(
-      TimbalRuntimeProvider,
-      {
-        workforceId,
-        baseUrl,
-        fetch,
-        attachments,
-        attachmentsUploadUrl,
-        attachmentsAccept,
-        debug,
-        children: /* @__PURE__ */ jsx8(
-          Thread,
-          {
-            variant: "panel",
-            className: "aui-app-chat-panel-thread",
-            welcome,
-            suggestions,
-            composerPlaceholder,
-            components,
-            artifacts,
-            onArtifactEvent,
-            ...rest
-          }
-        )
-      }
-    ) })
-  ] });
-};
-
-// src/app/surfaces/SurfaceCard.tsx
-import { jsx as jsx9 } from "react/jsx-runtime";
-var SurfaceCard = ({ children, className }) => {
-  return /* @__PURE__ */ jsx9("div", { className: cn("aui-app-surface-card", appSurfaceCardClass, className), children });
-};
-
-// src/app/surfaces/StatTile.tsx
-import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
-var StatTile = ({ label, value, hint, className }) => {
-  return /* @__PURE__ */ jsxs7("div", { className: cn("aui-app-stat-tile", appStatTileClass, className), children: [
-    /* @__PURE__ */ jsx10("span", { className: appStatLabelClass, children: label }),
-    /* @__PURE__ */ jsx10("span", { className: appStatValueClass, children: value }),
-    hint ? /* @__PURE__ */ jsx10("span", { className: "text-xs text-muted-foreground", children: hint }) : null
-  ] });
-};
-
-// src/app/surfaces/EmptyState.tsx
-import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
-var EmptyState = ({
-  title,
-  description,
-  action,
-  className
-}) => {
-  return /* @__PURE__ */ jsxs8("div", { className: cn("aui-app-empty-state", appEmptyStateClass, className), children: [
-    /* @__PURE__ */ jsx11("p", { className: appEmptyStateTitleClass, children: title }),
-    description ? /* @__PURE__ */ jsx11("p", { className: appEmptyStateDescriptionClass, children: description }) : null,
-    action
-  ] });
-};
-
-// src/app/surfaces/StatusBadge.tsx
-import { jsx as jsx12 } from "react/jsx-runtime";
-var statusBadgeToneClass = {
-  default: "bg-muted text-foreground",
-  primary: "bg-primary/10 text-primary",
-  success: "bg-emerald-500/10 text-emerald-600 dark:text-emerald-400",
-  warn: "bg-amber-500/10 text-amber-600 dark:text-amber-400",
-  muted: "bg-muted/80 text-muted-foreground"
-};
-var StatusBadge = ({
-  children,
-  tone = "default",
-  className
-}) => {
-  return /* @__PURE__ */ jsx12(
-    "span",
-    {
-      className: cn(
-        "aui-app-status-badge inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium",
-        statusBadgeToneClass[tone],
-        className
-      ),
-      children
-    }
-  );
-};
-
-// src/app/surfaces/AppConfirmDialog.tsx
-import { jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
-var bodyClass2 = "flex flex-col gap-4 p-6";
-var titleClass = "pr-8";
-var actionsClass = "flex flex-wrap justify-end gap-2";
-var AppConfirmDialog = ({
-  open,
-  onOpenChange,
-  title,
-  description,
-  confirmLabel = "Confirm",
-  cancelLabel = "Cancel",
-  onConfirm,
-  destructive = false,
-  className
-}) => {
-  return /* @__PURE__ */ jsx13(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsx13(
-    DialogContent,
-    {
-      className: cn("gap-0 p-0 sm:max-w-md", className),
-      children: /* @__PURE__ */ jsxs9("div", { className: bodyClass2, children: [
-        /* @__PURE__ */ jsx13(DialogTitle, { className: titleClass, children: title }),
-        description ? /* @__PURE__ */ jsx13("p", { className: "text-sm text-muted-foreground", children: description }) : null,
-        /* @__PURE__ */ jsxs9("div", { className: actionsClass, children: [
-          /* @__PURE__ */ jsx13(
-            TimbalV2Button,
-            {
-              type: "button",
-              variant: "secondary",
-              size: "sm",
-              onClick: () => onOpenChange(false),
-              children: cancelLabel
-            }
-          ),
-          /* @__PURE__ */ jsx13(
-            TimbalV2Button,
-            {
-              type: "button",
-              variant: destructive ? "destructive" : "primary",
-              size: "sm",
-              onClick: () => {
-                onConfirm();
-                onOpenChange(false);
-              },
-              children: confirmLabel
-            }
-          )
-        ] })
-      ] })
-    }
-  ) });
-};
-
-// src/app/navigation/SubNav.tsx
-import { jsx as jsx14 } from "react/jsx-runtime";
-var SubNav = ({
-  items,
-  activeId,
-  onChange,
-  className,
-  "aria-label": ariaLabel = "Section navigation",
-  layoutId
-}) => {
-  return /* @__PURE__ */ jsx14("nav", { className: cn("aui-app-sub-nav", className), "aria-label": ariaLabel, children: /* @__PURE__ */ jsx14(
-    PillSegmentedTabs,
-    {
-      value: activeId,
-      onChange,
-      tabs: items.map((item) => ({ key: item.id, label: item.label })),
-      trackVariant: "flush",
-      layoutId: layoutId ?? "app-sub-nav-segmented",
-      "aria-label": ariaLabel
-    }
-  ) });
-};
-
-// src/app/navigation/Breadcrumbs.tsx
-import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
-var Breadcrumbs = ({ items, className }) => {
-  return /* @__PURE__ */ jsx15("nav", { className: cn("aui-app-breadcrumbs", appBreadcrumbsClass, className), "aria-label": "Breadcrumb", children: /* @__PURE__ */ jsx15("ol", { className: "flex flex-wrap items-center gap-1.5", children: items.map((item, index) => {
-    const isLast = index === items.length - 1;
-    return /* @__PURE__ */ jsxs10("li", { className: "inline-flex items-center gap-1.5", children: [
-      index > 0 ? /* @__PURE__ */ jsx15("span", { className: "text-muted-foreground/50", "aria-hidden": true, children: "/" }) : null,
-      isLast ? /* @__PURE__ */ jsx15("span", { className: "text-foreground", "aria-current": "page", children: item.label }) : item.href ? /* @__PURE__ */ jsx15("a", { href: item.href, className: appBreadcrumbLinkClass, children: item.label }) : /* @__PURE__ */ jsx15(
-        "button",
-        {
-          type: "button",
-          className: appBreadcrumbLinkClass,
-          onClick: item.onClick,
-          children: item.label
-        }
-      )
-    ] }, index);
-  }) }) });
-};
-
-// src/app/forms/Field.tsx
-import { jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
-var Field = ({
-  label,
-  hint,
-  error,
-  children,
-  className,
-  htmlFor
-}) => {
-  return /* @__PURE__ */ jsxs11("div", { className: cn("aui-app-field", appFieldClass, className), children: [
-    /* @__PURE__ */ jsx16("label", { className: appFieldLabelClass, htmlFor, children: label }),
-    children,
-    hint && !error ? /* @__PURE__ */ jsx16("p", { className: appFieldHintClass, children: hint }) : null,
-    error ? /* @__PURE__ */ jsx16("p", { className: "text-xs text-destructive", role: "alert", children: error }) : null
-  ] });
-};
-var FieldInput = ({
-  label,
-  hint,
-  error,
-  fieldClassName,
-  className,
-  id,
-  ...inputProps
-}) => {
-  const inputId = id ?? inputProps.name;
-  return /* @__PURE__ */ jsx16(
-    Field,
-    {
-      label,
-      hint,
-      error,
-      htmlFor: inputId,
-      className: fieldClassName,
-      children: /* @__PURE__ */ jsx16(
-        "input",
-        {
-          id: inputId,
-          className: cn(appInputClass, className),
-          "aria-invalid": error ? true : void 0,
-          ...inputProps
-        }
-      )
-    }
-  );
-};
-
-// src/app/forms/FieldTextarea.tsx
-import { jsx as jsx17 } from "react/jsx-runtime";
-var textareaClass = cn(
-  appInputClass,
-  "min-h-[5.5rem] resize-y py-2.5 leading-relaxed"
-);
-var FieldTextarea = ({
-  label,
-  hint,
-  error,
-  fieldClassName,
-  className,
-  id,
-  ...props
-}) => {
-  const textareaId = id ?? props.name;
-  return /* @__PURE__ */ jsx17(
-    Field,
-    {
-      label,
-      hint,
-      error,
-      htmlFor: textareaId,
-      className: fieldClassName,
-      children: /* @__PURE__ */ jsx17(
-        "textarea",
-        {
-          id: textareaId,
-          className: cn(textareaClass, className),
-          "aria-invalid": error ? true : void 0,
-          ...props
-        }
-      )
-    }
-  );
-};
-
-// src/app/forms/FieldSelect.tsx
-import { ChevronDownIcon } from "lucide-react";
-import { jsx as jsx18, jsxs as jsxs12 } from "react/jsx-runtime";
-var selectWrapClass = "relative";
-var selectClass = cn(
-  appInputClass,
-  "appearance-none pr-9"
-);
-var FieldSelect = ({
-  label,
-  hint,
-  error,
-  fieldClassName,
-  className,
-  children,
-  id,
-  ...props
-}) => {
-  const selectId = id ?? props.name;
-  return /* @__PURE__ */ jsx18(
-    Field,
-    {
-      label,
-      hint,
-      error,
-      htmlFor: selectId,
-      className: fieldClassName,
-      children: /* @__PURE__ */ jsxs12("div", { className: selectWrapClass, children: [
-        /* @__PURE__ */ jsx18(
-          "select",
-          {
-            id: selectId,
-            className: cn(selectClass, className),
-            "aria-invalid": error ? true : void 0,
-            ...props,
-            children
-          }
-        ),
-        /* @__PURE__ */ jsx18(
-          ChevronDownIcon,
-          {
-            className: "pointer-events-none absolute top-1/2 right-3 size-4 -translate-y-1/2 text-muted-foreground",
-            "aria-hidden": true
-          }
-        )
-      ] })
-    }
-  );
-};
-
-// src/app/forms/FieldSwitch.tsx
-import { jsx as jsx19, jsxs as jsxs13 } from "react/jsx-runtime";
-var trackClass = cn(
-  "relative inline-flex h-5 w-9 shrink-0 items-center rounded-full transition-[background,box-shadow,border-color] duration-200",
-  "peer-focus-visible:ring-2 peer-focus-visible:ring-foreground/10",
-  "peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
-  TIMBAL_V2_SWITCH_TRACK_OFF,
-  "peer-checked:border-foreground/15 peer-checked:from-primary-fill-from peer-checked:to-primary-fill-to peer-checked:shadow-card",
-  "peer-checked:[&>span]:translate-x-4"
-);
-var thumbClass = cn(
-  "pointer-events-none inline-block size-4 shrink-0 translate-x-0.5 rounded-full transition-transform",
-  TIMBAL_V2_SWITCH_THUMB
-);
-var FieldSwitch = ({
-  label,
-  description,
-  className,
-  id,
-  ...props
-}) => {
-  const inputId = id ?? props.name ?? "switch";
-  return /* @__PURE__ */ jsxs13(
-    "label",
-    {
-      className: cn(
-        "aui-app-field-switch flex cursor-pointer items-start gap-3",
-        className
-      ),
-      htmlFor: inputId,
-      children: [
-        /* @__PURE__ */ jsxs13("span", { className: "relative mt-0.5", children: [
-          /* @__PURE__ */ jsx19(
-            "input",
-            {
-              id: inputId,
-              type: "checkbox",
-              role: "switch",
-              className: "peer sr-only",
-              ...props
-            }
-          ),
-          /* @__PURE__ */ jsx19("span", { className: trackClass, "aria-hidden": true, children: /* @__PURE__ */ jsx19("span", { className: thumbClass }) })
-        ] }),
-        /* @__PURE__ */ jsxs13("span", { className: "flex min-w-0 flex-col gap-0.5", children: [
-          /* @__PURE__ */ jsx19("span", { className: "text-sm font-medium text-foreground", children: label }),
-          description ? /* @__PURE__ */ jsx19("span", { className: "text-xs text-muted-foreground", children: description }) : null
-        ] })
-      ]
-    }
-  );
-};
-
-// src/app/forms/SearchInput.tsx
-import { SearchIcon } from "lucide-react";
-import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
-var SearchInput = ({
-  className,
-  placeholder = "Search\u2026",
-  ...props
-}) => {
-  return /* @__PURE__ */ jsxs14(
-    "label",
-    {
-      className: cn(
-        "aui-app-search-input inline-flex min-w-[12rem] items-center gap-2",
-        appSearchInputClass,
-        className
-      ),
-      children: [
-        /* @__PURE__ */ jsx20(SearchIcon, { className: "size-4 shrink-0 text-muted-foreground", "aria-hidden": true }),
-        /* @__PURE__ */ jsx20(
-          "input",
-          {
-            type: "search",
-            placeholder,
-            className: "min-w-0 flex-1 border-0 bg-transparent text-sm outline-none placeholder:text-muted-foreground/70",
-            ...props
-          }
-        )
-      ]
-    }
-  );
-};
-
-// src/app/forms/FormSection.tsx
-import { jsx as jsx21, jsxs as jsxs15 } from "react/jsx-runtime";
-var FormSection = ({ title, children, className }) => {
-  return /* @__PURE__ */ jsxs15("fieldset", { className: cn("aui-app-form-section", appSectionClass, "border-0 p-0", className), children: [
-    title ? /* @__PURE__ */ jsx21("legend", { className: cn(appSectionTitleClass, "mb-3 px-0"), children: title }) : null,
-    /* @__PURE__ */ jsx21("div", { className: "flex flex-col gap-4", children })
-  ] });
-};
-
-// src/app/data/FilterBar.tsx
-import { jsx as jsx22 } from "react/jsx-runtime";
-var FilterBar = ({ children, className }) => {
-  return /* @__PURE__ */ jsx22(
-    "div",
-    {
-      className: cn("aui-app-filter-bar", appFilterBarClass, className),
-      role: "toolbar",
-      "aria-label": "Filters",
-      children
-    }
-  );
-};
-
-// src/app/data/DataTable.tsx
-import { useMemo, useState as useState2 } from "react";
-import { ArrowDownIcon, ArrowUpDownIcon, ArrowUpIcon } from "lucide-react";
-import { jsx as jsx23, jsxs as jsxs16 } from "react/jsx-runtime";
-var shellClass2 = "overflow-hidden rounded-xl border border-border bg-card shadow-card";
-var tableClass = "w-full border-collapse bg-transparent text-sm";
-var headCellClass = "border-b border-border/60 bg-transparent px-4 py-2.5 text-left text-xs font-medium uppercase tracking-wide text-muted-foreground";
-var bodyCellClass = "border-b border-border/40 bg-transparent px-4 py-2.5 text-foreground";
-var rowClass = "bg-transparent transition-colors hover:bg-foreground/[0.03] data-[clickable=true]:cursor-pointer";
-var footCellClass = "border-t border-border/60 bg-transparent px-4 py-2.5 text-xs text-muted-foreground";
-var footInnerClass = "flex flex-wrap items-center gap-2";
-var emptyCellClass = "bg-transparent px-4 py-10 text-center text-sm text-muted-foreground";
-var sortButtonClass = "group inline-flex min-w-0 items-center gap-1.5 rounded-md -mx-1 px-1 py-0.5 text-left font-medium text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-foreground/10";
-var stickyHeadClass = "sticky top-0 z-[1] bg-card/95 shadow-[0_1px_0_0_hsl(var(--border)/0.5)] backdrop-blur-sm [&_th]:bg-card/95";
-var alignClass = {
-  left: "text-left",
-  center: "text-center",
-  right: "text-right"
-};
-function compareSortValues(a, b) {
-  if (a == null && b == null) return 0;
-  if (a == null) return 1;
-  if (b == null) return -1;
-  if (a instanceof Date && b instanceof Date) return a.getTime() - b.getTime();
-  if (typeof a === "number" && typeof b === "number") return a - b;
-  if (typeof a === "boolean" && typeof b === "boolean") return Number(a) - Number(b);
-  return String(a).localeCompare(String(b), void 0, { sensitivity: "base" });
-}
-function nextSort(current, columnId) {
-  if (current?.columnId !== columnId) {
-    return { columnId, direction: "asc" };
-  }
-  if (current.direction === "asc") {
-    return { columnId, direction: "desc" };
-  }
-  return null;
-}
-function SortIndicator({
-  active,
-  direction
-}) {
-  const iconClass = "size-3.5 shrink-0 opacity-60 group-hover:opacity-100";
-  if (!active) {
-    return /* @__PURE__ */ jsx23(ArrowUpDownIcon, { className: iconClass, "aria-hidden": true });
-  }
-  if (direction === "desc") {
-    return /* @__PURE__ */ jsx23(ArrowDownIcon, { className: iconClass, "aria-hidden": true });
-  }
-  return /* @__PURE__ */ jsx23(ArrowUpIcon, { className: iconClass, "aria-hidden": true });
-}
-function DataTable({
-  columns,
-  rows,
-  getRowKey,
-  emptyTitle = "No data",
-  emptyDescription,
-  emptyMode = "replace",
-  className,
-  sort: sortProp,
-  defaultSort = null,
-  onSortChange,
-  showRowCount = false,
-  rowCountLabel,
-  footer,
-  onRowClick,
-  stickyHeader = false,
-  dense = false,
-  caption
-}) {
-  const [uncontrolledSort, setUncontrolledSort] = useState2(
-    defaultSort
-  );
-  const isSortControlled = sortProp !== void 0;
-  const sort = isSortControlled ? sortProp : uncontrolledSort;
-  const setSort = (next) => {
-    if (!isSortControlled) {
-      setUncontrolledSort(next);
-    }
-    onSortChange?.(next);
-  };
-  const sortedRows = useMemo(() => {
-    if (!sort) return rows;
-    const column = columns.find((col) => col.id === sort.columnId);
-    if (!column?.sortable) return rows;
-    const getValue = column.sortValue ?? ((row) => {
-      const rendered = column.cell(row);
-      if (rendered === null || rendered === void 0 || typeof rendered === "string" || typeof rendered === "number" || typeof rendered === "boolean") {
-        return rendered;
-      }
-      return String(rendered);
-    });
-    return [...rows].sort((a, b) => {
-      const cmp = compareSortValues(getValue(a), getValue(b));
-      return sort.direction === "asc" ? cmp : -cmp;
-    });
-  }, [columns, rows, sort]);
-  const cellPad = dense ? "px-3 py-2" : void 0;
-  const headPad = dense ? "px-3 py-2" : void 0;
-  if (rows.length === 0 && emptyMode === "replace") {
-    return /* @__PURE__ */ jsx23(EmptyState, { title: emptyTitle, description: emptyDescription, className });
-  }
-  const rowCountText = rowCountLabel?.(sortedRows.length) ?? `${sortedRows.length} row${sortedRows.length === 1 ? "" : "s"}`;
-  const hasFoot = Boolean((showRowCount || footer) && sortedRows.length > 0);
-  return /* @__PURE__ */ jsx23("div", { className: cn("aui-app-data-table", shellClass2, className), children: /* @__PURE__ */ jsx23("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs16("table", { className: tableClass, children: [
-    caption ? /* @__PURE__ */ jsx23("caption", { className: "sr-only", children: caption }) : null,
-    /* @__PURE__ */ jsx23("thead", { className: cn(stickyHeader && stickyHeadClass), children: /* @__PURE__ */ jsx23("tr", { children: columns.map((col) => {
-      const isSorted = sort?.columnId === col.id;
-      const ariaSort = col.sortable ? isSorted ? sort.direction === "asc" ? "ascending" : "descending" : "none" : void 0;
-      const headerContent = col.sortable ? /* @__PURE__ */ jsxs16(
-        "button",
-        {
-          type: "button",
-          className: sortButtonClass,
-          onClick: () => setSort(nextSort(sort, col.id)),
-          children: [
-            /* @__PURE__ */ jsx23("span", { className: "truncate", children: col.header }),
-            /* @__PURE__ */ jsx23(SortIndicator, { active: Boolean(isSorted), direction: sort?.direction })
-          ]
-        }
-      ) : col.header;
-      return /* @__PURE__ */ jsx23(
-        "th",
-        {
-          scope: "col",
-          "aria-sort": ariaSort,
-          className: cn(
-            headCellClass,
-            headPad,
-            col.align && alignClass[col.align],
-            col.headerClassName
-          ),
-          children: headerContent
-        },
-        col.id
-      );
-    }) }) }),
-    /* @__PURE__ */ jsx23("tbody", { className: cn(!hasFoot && "[&_tr:last-child_td]:border-b-0"), children: sortedRows.length === 0 ? /* @__PURE__ */ jsx23("tr", { children: /* @__PURE__ */ jsx23("td", { colSpan: columns.length, className: emptyCellClass, children: /* @__PURE__ */ jsxs16("div", { className: "flex flex-col items-center gap-1", children: [
-      /* @__PURE__ */ jsx23("p", { className: "font-medium text-foreground", children: emptyTitle }),
-      emptyDescription ? /* @__PURE__ */ jsx23("p", { className: "max-w-sm text-muted-foreground", children: emptyDescription }) : null
-    ] }) }) }) : sortedRows.map((row) => /* @__PURE__ */ jsx23(
-      "tr",
-      {
-        className: rowClass,
-        "data-clickable": onRowClick ? "true" : void 0,
-        onClick: onRowClick ? () => onRowClick(row) : void 0,
-        onKeyDown: onRowClick ? (event) => {
-          if (event.key === "Enter" || event.key === " ") {
-            event.preventDefault();
-            onRowClick(row);
-          }
-        } : void 0,
-        tabIndex: onRowClick ? 0 : void 0,
-        role: onRowClick ? "button" : void 0,
-        children: columns.map((col) => /* @__PURE__ */ jsx23(
-          "td",
-          {
-            className: cn(
-              bodyCellClass,
-              cellPad,
-              col.align && alignClass[col.align],
-              col.className
-            ),
-            children: col.cell(row)
-          },
-          col.id
-        ))
-      },
-      getRowKey(row)
-    )) }),
-    hasFoot ? /* @__PURE__ */ jsx23("tfoot", { children: /* @__PURE__ */ jsx23("tr", { children: /* @__PURE__ */ jsx23("td", { colSpan: columns.length, className: footCellClass, children: /* @__PURE__ */ jsxs16(
-      "div",
-      {
-        className: cn(
-          footInnerClass,
-          showRowCount && footer ? "justify-between" : "justify-start"
-        ),
-        children: [
-          showRowCount ? /* @__PURE__ */ jsx23("span", { children: rowCountText }) : null,
-          footer
-        ]
-      }
-    ) }) }) }) : null
-  ] }) }) });
-}
-
-// src/app/data/ChartPanel.tsx
-import { jsx as jsx24, jsxs as jsxs17 } from "react/jsx-runtime";
-var chartEmbedClass = "[&_.aui-artifact-root]:my-0 [&_.aui-artifact-root]:rounded-none [&_.aui-artifact-root]:border-0 [&_.aui-artifact-root]:bg-transparent [&_.aui-artifact-root]:shadow-none";
-var ChartPanel = ({
-  title,
-  artifact,
-  children,
-  actions,
-  className
-}) => {
-  const body = children ?? (artifact ? /* @__PURE__ */ jsx24("div", { className: chartEmbedClass, children: /* @__PURE__ */ jsx24(ChartArtifactView, { artifact }) }) : null);
-  return /* @__PURE__ */ jsxs17("div", { className: cn("aui-app-chart-panel", appChartPanelClass, className), children: [
-    title || actions ? /* @__PURE__ */ jsxs17("div", { className: "flex items-center justify-between gap-2", children: [
-      title ? /* @__PURE__ */ jsx24("h3", { className: appChartPanelTitleClass, children: title }) : /* @__PURE__ */ jsx24("span", {}),
-      actions
-    ] }) : null,
-    /* @__PURE__ */ jsx24("div", { className: "min-h-[12rem] w-full", children: body })
-  ] });
-};
-
-export {
-  appPageColumnClass,
-  appShellTopbarInsetClass,
-  appShellInsetTopClass,
-  appSurfaceCardClass,
-  appStatTileClass,
-  appFilterBarClass,
-  appSearchInputClass,
-  useAppShellChat,
-  AppShell,
-  AppShellTopbar,
-  AppShellChatTrigger,
-  PageHeader,
-  Page,
-  Section,
-  AppCopilotProvider,
-  useAppCopilotContext,
-  AppChatPanel,
-  SurfaceCard,
-  StatTile,
-  EmptyState,
-  StatusBadge,
-  AppConfirmDialog,
-  SubNav,
-  Breadcrumbs,
-  Field,
-  FieldInput,
-  FieldTextarea,
-  FieldSelect,
-  FieldSwitch,
-  SearchInput,
-  FormSection,
-  FilterBar,
-  DataTable,
-  ChartPanel
-};