@docyrus/ui-pro-ai-assistant 0.4.2 → 0.4.3

package/dist/index.js

@@ -9,7 +9,7 @@ import { Input } from '@docyrus/ui-pro-shared/components/input';
 import { Tabs as Tabs$1, TabsList as TabsList$1, TabsTrigger as TabsTrigger$1, TabsContent as TabsContent$1 } from '@docyrus/ui-pro-shared/components/tabs';
 import { cn } from '@docyrus/ui-pro-shared/lib/utils';
 import { DefaultChatTransport, lastAssistantMessageIsCompleteWithToolCalls } from 'ai';
-import { PilcrowIcon, Heading1Icon, Heading2Icon, Heading3Icon, SquareIcon, ListIcon, ListOrderedIcon, ChevronDownIcon, Code2Icon, QuoteIcon, LightbulbIcon, Columns3Icon, GripVertical, FileUpIcon, TableIcon, ImageIcon, FilmIcon, AudioLinesIcon, TableOfContentsIcon, RadicalIcon, RectangleVerticalIcon, CalendarIcon, PlusIcon, FileCodeIcon, MinusIcon, ChevronRightIcon, ListTree, PenToolIcon, Link2Icon, Check, Copy, FilesIcon, Link, Text, ExternalLink, Unlink, Bold, Italic, Underline, Strikethrough, Code2, MoreHorizontal, ArrowLeftIcon, ArrowRightIcon, Minus, Plus, CircleArrowDown, Minimize2, Trash2, FileUp, CheckCircle2, FileText, Loader2, CornerDownLeftIcon, PencilLineIcon, MessageSquareTextIcon, MessagesSquareIcon, ArrowUpIcon, CheckIcon, CaptionsIcon, ZoomInIcon, CircleArrowDownIcon, MoveUpRightIcon, MoreHorizontalIcon, Eye, Pencil, PlusCircle, HelpCircle, Maximize2, X, Download, FileSpreadsheet, ChevronDown, Search, Globe, CheckCircle, FolderOpen, User, ArrowRight, MapPin, CalendarClock, List, RefreshCw, FilePlus, XIcon, CornerUpLeftIcon, AlbumIcon, FeatherIcon, ListMinusIcon, ListPlusIcon, ListEnd, Wand, LanguagesIcon, BadgeHelpIcon, PenLineIcon, SearchIcon, MusicIcon, CompassIcon, SmileIcon, LeafIcon, ClockIcon, AppleIcon, FlagIcon, StarIcon, DeleteIcon, AlignLeft, AlignCenter, AlignRight, RotateCcw, AlertTriangle, XCircle, AlertCircle, ArrowUpDown, ArrowDownToLine, PenLine, PencilIcon, TrashIcon, RefreshCwIcon, PaintRoller, MessageSquareText, ArrowLeft, ChevronLeft, Bot, ChevronRight, Brain, Lightbulb, BookOpen, PenTool, SlidersHorizontal, Wand2, Mic, RefreshCcw, Code, Star, Trash, Edit, FolderInput, Archive, Sparkles, PanelLeft, MessageSquare, NotebookText, CirclePlus, MoreVertical, FileSearch, Microscope, Ruler, AudioLines, BrainCircuit, File as File$1, Plug, Inbox, Menu, LayoutDashboard, Table2, WandSparklesIcon, ArrowUpToLineIcon, BoldIcon, ItalicIcon, UnderlineIcon, StrikethroughIcon, HighlighterIcon, Undo2Icon, Redo2Icon, ArrowDownToLineIcon, AlignLeftIcon, AlignCenterIcon, AlignRightIcon, AlignJustifyIcon, ListOrdered, ListTodoIcon, ListCollapseIcon, Table, Grid3x3Icon, Combine, Ungroup, ArrowUp, ArrowDown, Trash2Icon, LinkIcon, WrapText, OutdentIcon, IndentIcon, EyeIcon, PenIcon } from 'lucide-react';
+import { PilcrowIcon, Heading1Icon, Heading2Icon, Heading3Icon, SquareIcon, ListIcon, ListOrderedIcon, ChevronDownIcon, Code2Icon, QuoteIcon, LightbulbIcon, Columns3Icon, GripVertical, FileUpIcon, TableIcon, ImageIcon, FilmIcon, AudioLinesIcon, TableOfContentsIcon, RadicalIcon, RectangleVerticalIcon, CalendarIcon, PlusIcon, FileCodeIcon, MinusIcon, ChevronRightIcon, ListTree, PenToolIcon, Link2Icon, Check, Copy, FilesIcon, Link, Text, ExternalLink, Unlink, Bold, Italic, Underline, Strikethrough, Code2, MoreHorizontal, ArrowLeftIcon, ArrowRightIcon, Minus, Plus, CircleArrowDown, Minimize2, Trash2, FileUp, CheckCircle2, FileText, Loader2, CornerDownLeftIcon, PencilLineIcon, MessageSquareTextIcon, MessagesSquareIcon, ArrowUpIcon, CheckIcon, CaptionsIcon, ZoomInIcon, CircleArrowDownIcon, MoveUpRightIcon, MoreHorizontalIcon, Eye, Pencil, PlusCircle, HelpCircle, Maximize2, X, Download, FileSpreadsheet, ChevronDown, CheckCircle, XCircle, Search, Globe, FolderOpen, User, ArrowRight, MapPin, CalendarClock, List, RefreshCw, FilePlus, XIcon, CornerUpLeftIcon, AlbumIcon, FeatherIcon, ListMinusIcon, ListPlusIcon, ListEnd, Wand, LanguagesIcon, BadgeHelpIcon, PenLineIcon, SearchIcon, MusicIcon, CompassIcon, SmileIcon, LeafIcon, ClockIcon, AppleIcon, FlagIcon, StarIcon, DeleteIcon, AlignLeft, AlignCenter, AlignRight, RotateCcw, AlertTriangle, AlertCircle, ArrowUpDown, ArrowDownToLine, PenLine, PencilIcon, TrashIcon, RefreshCwIcon, PaintRoller, MessageSquareText, ArrowLeft, ChevronLeft, Bot, ChevronRight, Brain, Lightbulb, BookOpen, PenTool, SlidersHorizontal, Wand2, Mic, RefreshCcw, Code, Star, Trash, Edit, FolderInput, Archive, Sparkles, PanelLeft, MessageSquare, NotebookText, CirclePlus, MoreVertical, FileSearch, Microscope, Ruler, AudioLines, BrainCircuit, File as File$1, Plug, Inbox, Menu, LayoutDashboard, Table2, WandSparklesIcon, ArrowUpToLineIcon, BoldIcon, ItalicIcon, UnderlineIcon, StrikethroughIcon, HighlighterIcon, Undo2Icon, Redo2Icon, ArrowDownToLineIcon, AlignLeftIcon, AlignCenterIcon, AlignRightIcon, AlignJustifyIcon, ListOrdered, ListTodoIcon, ListCollapseIcon, Table, Grid3x3Icon, Combine, Ungroup, ArrowUp, ArrowDown, Trash2Icon, LinkIcon, WrapText, OutdentIcon, IndentIcon, EyeIcon, PenIcon } from 'lucide-react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { AsyncTokenManager, RestApiClient } from '@docyrus/api-client';
 import { TooltipProvider, Tooltip as Tooltip$1, TooltipTrigger, TooltipContent } from '@docyrus/ui-pro-shared/components/tooltip';
@@ -4799,6 +4799,368 @@ function AssistantAnimations({
     }
   );
 }
+function getFieldLabel(key, property) {
+  if (property?.title) return property.title;
+  return key.toString().replace(/_/g, " ").replace(/([A-Z])/g, " $1").split(" ").map((w) => w.charAt(0).toUpperCase() + w.slice(1).toLowerCase()).join(" ").trim();
+}
+function formatLabel(key) {
+  return key.replace(/([A-Z])/g, " $1").replace(/^./, (s) => s.toUpperCase());
+}
+function inferType(value) {
+  if (value === null || value === void 0) return "string";
+  if (Array.isArray(value)) return "array";
+  if (typeof value === "object") return "object";
+  return typeof value;
+}
+function formatValue(value, property) {
+  if (value === null || value === void 0) return "\u2014";
+  const type = property?.type;
+  switch (type) {
+    case "boolean":
+      return value ? "Yes" : "No";
+    case "number":
+    case "integer":
+      return String(value);
+    case "string":
+      if (property?.format === "date") return new Date(value).toLocaleDateString();
+      if (property?.format === "date-time") return new Date(value).toLocaleString();
+      if (typeof value === "object") return JSON.stringify(value, null, 2);
+      return String(value);
+    case "array":
+      return Array.isArray(value) ? `${value.length} items` : "\u2014";
+    case "object":
+      return typeof value === "object" ? JSON.stringify(value, null, 2) : "\u2014";
+    default:
+      return String(value);
+  }
+}
+function formatNestedObject(value) {
+  if (value === null || value === void 0) return "\u2014";
+  if (typeof value !== "object") return String(value);
+  return Object.entries(value).map(([k, v]) => typeof v === "object" && v !== null ? `${k}: ${JSON.stringify(v)}` : `${k}: ${v}`).join("\n");
+}
+function formatNestedArray(value) {
+  if (!Array.isArray(value)) return "\u2014";
+  if (value.length === 0) return "(empty)";
+  if (value.every((item) => typeof item !== "object" || item === null)) return value.join(", ");
+  return `${value.length} items:
+${JSON.stringify(value[0], null, 2)}${value.length > 1 ? "\n..." : ""}`;
+}
+function formatPrimitive(value) {
+  if (value === null || value === void 0) return "\u2014";
+  if (typeof value === "boolean") return value ? "Yes" : "No";
+  return String(value);
+}
+function getCitationsForField(basis, fieldKey) {
+  if (!Array.isArray(basis) || basis.length === 0) return [];
+  const entry = basis.find((item) => item.field === fieldKey);
+  return entry?.citations || [];
+}
+function JsonSchemaArray({ schema, data, showHeader = true }) {
+  const isEmpty = !data || data.length === 0;
+  const isArrayOfObjects = !isEmpty && (schema?.items?.type === "object" || data.some((item) => typeof item === "object" && item !== null && !Array.isArray(item)));
+  const columns = useMemo(() => {
+    const itemSchema = schema?.items;
+    if (itemSchema?.properties) {
+      const cols = {};
+      Object.keys(itemSchema.properties).forEach((key) => {
+        cols[key] = {
+          label: itemSchema.properties[key]?.title || formatLabel(key),
+          property: itemSchema.properties[key]
+        };
+      });
+      return cols;
+    }
+    if (isArrayOfObjects && data.length > 0) {
+      const allKeys = /* @__PURE__ */ new Set();
+      data.forEach((item) => {
+        if (typeof item === "object" && item !== null) Object.keys(item).forEach((k) => allKeys.add(k));
+      });
+      const cols = {};
+      allKeys.forEach((key) => {
+        cols[key] = {
+          label: formatLabel(key),
+          property: { type: inferType(data[0]?.[key]) }
+        };
+      });
+      return cols;
+    }
+    return {};
+  }, [schema, data, isArrayOfObjects]);
+  return /* @__PURE__ */ jsxs("div", { className: "w-full not-prose", children: [
+    showHeader && schema?.title && /* @__PURE__ */ jsx("div", { className: "text-lg font-semibold text-slate-700 mb-3", children: schema.title }),
+    showHeader && schema?.description && /* @__PURE__ */ jsx("div", { className: "text-sm text-slate-600 mb-3", children: schema.description }),
+    isEmpty ? /* @__PURE__ */ jsx("div", { className: "text-sm text-slate-500 italic py-4", children: "No items" }) : isArrayOfObjects ? /* @__PURE__ */ jsx("div", { className: "overflow-x-auto overflow-hidden shadow-sm rounded-lg border border-slate-200", children: /* @__PURE__ */ jsxs("table", { className: "min-w-full divide-y divide-slate-200", children: [
+      /* @__PURE__ */ jsx("thead", { className: "bg-slate-50", children: /* @__PURE__ */ jsx("tr", { children: Object.entries(columns).map(([key, col]) => /* @__PURE__ */ jsx(
+        "th",
+        {
+          className: "px-4 py-3 text-left text-xs font-medium text-slate-700 uppercase tracking-wider",
+          children: col.label
+        },
+        key
+      )) }) }),
+      /* @__PURE__ */ jsx("tbody", { className: "bg-white divide-y divide-slate-200", children: data.map((item, index) => /* @__PURE__ */ jsx("tr", { className: "hover:bg-slate-50", children: Object.entries(columns).map(([key, col]) => /* @__PURE__ */ jsx("td", { className: "px-4 py-3 text-sm text-slate-700", children: col.property?.type === "object" ? /* @__PURE__ */ jsx("div", { className: "text-xs font-mono bg-slate-100 rounded px-2 py-1 whitespace-pre-wrap break-all max-w-xs", children: formatNestedObject(item[key]) }) : col.property?.type === "array" ? /* @__PURE__ */ jsx("div", { className: "text-xs font-mono bg-slate-100 rounded px-2 py-1 whitespace-pre-wrap break-all max-w-xs", children: formatNestedArray(item[key]) }) : /* @__PURE__ */ jsx("span", { className: col.property?.type === "number" || col.property?.type === "integer" ? "font-mono" : "", children: formatValue(item[key], col.property) }) }, key)) }, index)) })
+    ] }) }) : /* @__PURE__ */ jsx("div", { className: "space-y-2", children: data.map((item, index) => /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "px-3 py-2 bg-white border border-slate-200 rounded-md text-sm text-slate-700",
+        children: formatPrimitive(item)
+      },
+      index
+    )) })
+  ] });
+}
+function JsonSchemaObject({ schema, data, basis = [] }) {
+  const properties = schema?.properties || {};
+  const required = schema?.required || [];
+  return /* @__PURE__ */ jsxs("div", { className: "w-full", children: [
+    schema?.title && /* @__PURE__ */ jsx("div", { className: "text-lg font-semibold text-slate-700 mb-4", children: schema.title }),
+    schema?.description && /* @__PURE__ */ jsx("div", { className: "text-sm text-slate-600 mb-4", children: schema.description }),
+    /* @__PURE__ */ jsx("div", { className: "space-y-4", children: Object.entries(properties).map(([key, property]) => {
+      const isNestedObject = property?.type === "object" && property?.properties;
+      const isArr = property?.type === "array";
+      const citations = getCitationsForField(basis, key);
+      const isReq = required.includes(key);
+      if (isNestedObject) {
+        return /* @__PURE__ */ jsx("div", { className: "border border-slate-200 rounded-lg p-4 bg-slate-50", children: /* @__PURE__ */ jsx(JsonSchemaObject, { schema: property, data: data?.[key] || {}, basis }) }, key);
+      }
+      if (isArr) {
+        return /* @__PURE__ */ jsxs("div", { className: "border border-slate-200 rounded-lg p-4 bg-slate-50", children: [
+          property?.title && /* @__PURE__ */ jsx("div", { className: "text-sm font-medium text-slate-700 mb-2", children: property.title }),
+          /* @__PURE__ */ jsx(JsonSchemaArray, { schema: property, data: data?.[key] || [], showHeader: false })
+        ] }, key);
+      }
+      return /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+        /* @__PURE__ */ jsx("label", { className: `text-sm font-medium text-slate-700 mb-1${isReq ? " after:content-['*'] after:ml-0.5 after:text-red-500" : ""}`, children: getFieldLabel(key, property) }),
+        property?.description && /* @__PURE__ */ jsx("div", { className: "text-xs text-slate-500 mb-1", children: property.description }),
+        /* @__PURE__ */ jsx("div", { className: `px-3 py-2 bg-white border border-slate-300 rounded-md text-sm text-slate-700${property?.type === "number" || property?.type === "integer" ? " font-mono" : ""}`, children: formatValue(data?.[key], property) }),
+        citations.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mt-2 text-xs text-slate-600 bg-slate-50 border border-slate-200 rounded-md p-3", children: [
+          /* @__PURE__ */ jsxs("div", { className: "font-medium text-slate-700 mb-2 flex items-center gap-1", children: [
+            /* @__PURE__ */ jsx("svg", { className: "w-3 h-3", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx(
+              "path",
+              {
+                fillRule: "evenodd",
+                d: "M12.586 4.586a2 2 0 112.828 2.828l-3 3a2 2 0 01-2.828 0 1 1 0 00-1.414 1.414 4 4 0 005.656 0l3-3a4 4 0 00-5.656-5.656l-1.5 1.5a1 1 0 101.414 1.414l1.5-1.5zm-5 5a2 2 0 012.828 0 1 1 0 101.414-1.414 4 4 0 00-5.656 0l-3 3a4 4 0 105.656 5.656l1.5-1.5a1 1 0 10-1.414-1.414l-1.5 1.5a2 2 0 11-2.828-2.828l3-3z",
+                clipRule: "evenodd"
+              }
+            ) }),
+            "Sources (",
+            citations.length,
+            ")"
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "space-y-2", children: citations.map((citation, idx) => /* @__PURE__ */ jsxs("div", { className: "flex gap-2 scroll-mt-4", children: [
+            /* @__PURE__ */ jsxs("span", { className: "font-mono text-slate-500", children: [
+              "[",
+              idx + 1,
+              "]"
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+              /* @__PURE__ */ jsx(
+                "a",
+                {
+                  href: citation.url,
+                  target: "_blank",
+                  rel: "noopener noreferrer",
+                  className: "text-blue-600 hover:text-blue-800 hover:underline break-all truncate block",
+                  children: citation.url
+                }
+              ),
+              citation.excerpts && citation.excerpts.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mt-1 text-slate-600 italic truncate", children: [
+                '"',
+                citation.excerpts[0],
+                '"'
+              ] })
+            ] })
+          ] }, idx)) })
+        ] })
+      ] }, key);
+    }) })
+  ] });
+}
+function JsonSchemaLayout({ schema, data, basis = [] }) {
+  const schemaType = schema?.type || (Array.isArray(data) ? "array" : "object");
+  if (schemaType === "array") {
+    return /* @__PURE__ */ jsx(JsonSchemaArray, { schema, data });
+  }
+  return /* @__PURE__ */ jsx(JsonSchemaObject, { schema, data, basis });
+}
+function generateSchemaFromValue(value) {
+  if (value === null || value === void 0) return { type: "string" };
+  if (Array.isArray(value)) {
+    return {
+      type: "array",
+      items: value.length > 0 ? generateSchemaFromValue(value[0]) : { type: "string" }
+    };
+  }
+  if (typeof value === "object") {
+    const properties = {};
+    for (const [k, v] of Object.entries(value)) {
+      properties[k] = generateSchemaFromValue(v);
+    }
+    return { type: "object", properties };
+  }
+  if (typeof value === "number") return { type: Number.isInteger(value) ? "integer" : "number" };
+  if (typeof value === "boolean") return { type: "boolean" };
+  return { type: "string" };
+}
+function safeParse(value) {
+  if (value == null) return null;
+  if (typeof value === "string") {
+    try {
+      return JSON.parse(value);
+    } catch {
+      return null;
+    }
+  }
+  return value;
+}
+function CreateRecord({
+  dataSourceId,
+  record,
+  records,
+  state,
+  toolName = "createRecord",
+  toolCallId,
+  onToolAction
+}) {
+  const apiClient = useApiClient();
+  const [loading, setLoading] = useState(false);
+  const [submitted, setSubmitted] = useState(false);
+  const [resultMessage, setResultMessage] = useState("");
+  const [resultError, setResultError] = useState(false);
+  const parsedRecord = useMemo(() => safeParse(record), [record]);
+  const parsedRecords = useMemo(() => {
+    const parsed = safeParse(records);
+    return Array.isArray(parsed) ? parsed : null;
+  }, [records]);
+  const isBatch = parsedRecords != null && parsedRecords.length > 0;
+  const recordCount = isBatch ? parsedRecords.length : 1;
+  const parsedData = isBatch ? parsedRecords : parsedRecord;
+  const generatedSchema = useMemo(() => {
+    if (!parsedData) return null;
+    return generateSchemaFromValue(parsedData);
+  }, [parsedData]);
+  const handleApprove = useCallback(async () => {
+    setLoading(true);
+    setResultError(false);
+    try {
+      const metaRes = await apiClient.get(`/dev/data-sources/${dataSourceId}`);
+      if (!metaRes.success || !metaRes.data) {
+        throw new Error("Data source metadata not available");
+      }
+      const ds = metaRes.data;
+      const appSlug = ds.app_slug || ds.app?.slug;
+      const dsSlug = ds.slug;
+      if (!appSlug || !dsSlug) {
+        throw new Error("Data source metadata not available");
+      }
+      const endpoint = `/apps/${appSlug}/data-sources/${dsSlug}/items`;
+      let result;
+      if (isBatch) {
+        result = await apiClient.post(endpoint, { records: parsedRecords });
+      } else {
+        result = await apiClient.post(endpoint, parsedRecord);
+      }
+      if (!result.success) {
+        throw new Error(
+          typeof result.error === "string" ? result.error : "Failed to create record(s)"
+        );
+      }
+      setSubmitted(true);
+      setResultMessage(
+        isBatch ? `${recordCount} record(s) created successfully` : "Record created successfully"
+      );
+      onToolAction({
+        tool: toolName,
+        toolCallId,
+        decision: "submit",
+        input: {
+          success: true,
+          data: result.data,
+          count: isBatch ? result.data?.length ?? recordCount : 1
+        }
+      });
+    } catch (error) {
+      const message = error instanceof Error ? error.message : "Failed to create record(s)";
+      setResultError(true);
+      setResultMessage(message);
+      onToolAction({
+        tool: toolName,
+        toolCallId,
+        decision: "submit",
+        input: {
+          success: false,
+          error: message
+        }
+      });
+    } finally {
+      setLoading(false);
+    }
+  }, [
+    apiClient,
+    dataSourceId,
+    isBatch,
+    parsedRecord,
+    parsedRecords,
+    recordCount,
+    toolName,
+    toolCallId,
+    onToolAction
+  ]);
+  const handleReject = useCallback(() => {
+    setSubmitted(true);
+    setResultMessage("Record creation rejected by user");
+    setResultError(true);
+    onToolAction({
+      tool: toolName,
+      toolCallId,
+      decision: "submit",
+      input: {
+        success: false,
+        error: "User rejected the record creation"
+      }
+    });
+  }, [toolName, toolCallId, onToolAction]);
+  const showActions = state !== "output-available" && !submitted;
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-lg border bg-card p-4 space-y-3", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx(PlusCircle, { className: "size-5 text-blue-500" }),
+      /* @__PURE__ */ jsx("h4", { className: "font-medium text-sm", children: isBatch ? `Create ${recordCount} new records` : "Create new record" })
+    ] }),
+    parsedData && /* @__PURE__ */ jsx("div", { className: "max-h-80 overflow-auto", children: generatedSchema ? /* @__PURE__ */ jsx(JsonSchemaLayout, { schema: generatedSchema, data: parsedData }) : /* @__PURE__ */ jsx(CodeBlock, { code: JSON.stringify(parsedData, null, 2), language: "json", children: /* @__PURE__ */ jsx(CodeBlockCopyButton, {}) }) }),
+    showActions && /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          size: "sm",
+          onClick: handleApprove,
+          disabled: loading,
+          children: loading ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(Loader2, { className: "size-3.5 mr-1.5 animate-spin" }),
+            isBatch ? `Creating ${recordCount} Records\u2026` : "Creating\u2026"
+          ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(CheckCircle, { className: "size-3.5 mr-1.5" }),
+            isBatch ? `Create ${recordCount} Records` : "Create Record"
+          ] })
+        }
+      ),
+      /* @__PURE__ */ jsxs(
+        Button,
+        {
+          size: "sm",
+          variant: "outline",
+          onClick: handleReject,
+          disabled: loading,
+          children: [
+            /* @__PURE__ */ jsx(XCircle, { className: "size-3.5 mr-1.5" }),
+            "Reject"
+          ]
+        }
+      )
+    ] }),
+    resultMessage && /* @__PURE__ */ jsx("div", { className: `text-xs font-medium ${resultError ? "text-destructive" : "text-green-600"}`, children: resultMessage })
+  ] });
+}
 function truncateText(text, maxLength) {
   if (!text) return "";
   return text.length > maxLength ? `${text.substring(0, maxLength)}...` : text;
@@ -6734,6 +7096,20 @@ function GenerativeUITool({
       }
     ) });
   }
+  if (toolName === "createRecord") {
+    return /* @__PURE__ */ jsx("div", { className: "not-prose mb-4 w-full", children: /* @__PURE__ */ jsx(
+      CreateRecord,
+      {
+        dataSourceId: part.input?.dataSourceId,
+        record: part.input?.record,
+        records: part.input?.records,
+        state: part.state,
+        toolName,
+        toolCallId: part.toolCallId,
+        onToolAction
+      }
+    ) });
+  }
   if (toolName === "showCreateRecordForm" || toolName === "showUpdateRecordForm" || toolName === "showRecordDetailsForm") {
     const recordMode = toolName === "showCreateRecordForm" ? "add" : toolName === "showUpdateRecordForm" ? "edit" : "view";
     const dataSourceId = part.input?.dataSourceId || part.output?.result?.dataSourceId;
@@ -7241,7 +7617,12 @@ var DISPLAY_ONLY_TOOLS = /* @__PURE__ */ new Set([
   "showGeneratedContentOptions",
   "createAgentTask"
 ]);
-var INTERACTIVE_GENERATIVE_TOOLS = /* @__PURE__ */ new Set(["requestApproval", "previewCode", "requestUserInput"]);
+var INTERACTIVE_GENERATIVE_TOOLS = /* @__PURE__ */ new Set([
+  "requestApproval",
+  "previewCode",
+  "requestUserInput",
+  "createRecord"
+]);
 function CopyButton({ text }) {
   const { t } = useAssistantTranslation();
   const [copied, setCopied] = useState(false);
@@ -9767,191 +10148,6 @@ function CanvasSpreadsheetView({
     }
   ) });
 }
-function getFieldLabel(key, property) {
-  if (property?.title) return property.title;
-  return key.toString().replace(/_/g, " ").replace(/([A-Z])/g, " $1").split(" ").map((w) => w.charAt(0).toUpperCase() + w.slice(1).toLowerCase()).join(" ").trim();
-}
-function formatLabel(key) {
-  return key.replace(/([A-Z])/g, " $1").replace(/^./, (s) => s.toUpperCase());
-}
-function inferType(value) {
-  if (value === null || value === void 0) return "string";
-  if (Array.isArray(value)) return "array";
-  if (typeof value === "object") return "object";
-  return typeof value;
-}
-function formatValue(value, property) {
-  if (value === null || value === void 0) return "\u2014";
-  const type = property?.type;
-  switch (type) {
-    case "boolean":
-      return value ? "Yes" : "No";
-    case "number":
-    case "integer":
-      return String(value);
-    case "string":
-      if (property?.format === "date") return new Date(value).toLocaleDateString();
-      if (property?.format === "date-time") return new Date(value).toLocaleString();
-      if (typeof value === "object") return JSON.stringify(value, null, 2);
-      return String(value);
-    case "array":
-      return Array.isArray(value) ? `${value.length} items` : "\u2014";
-    case "object":
-      return typeof value === "object" ? JSON.stringify(value, null, 2) : "\u2014";
-    default:
-      return String(value);
-  }
-}
-function formatNestedObject(value) {
-  if (value === null || value === void 0) return "\u2014";
-  if (typeof value !== "object") return String(value);
-  return Object.entries(value).map(([k, v]) => typeof v === "object" && v !== null ? `${k}: ${JSON.stringify(v)}` : `${k}: ${v}`).join("\n");
-}
-function formatNestedArray(value) {
-  if (!Array.isArray(value)) return "\u2014";
-  if (value.length === 0) return "(empty)";
-  if (value.every((item) => typeof item !== "object" || item === null)) return value.join(", ");
-  return `${value.length} items:
-${JSON.stringify(value[0], null, 2)}${value.length > 1 ? "\n..." : ""}`;
-}
-function formatPrimitive(value) {
-  if (value === null || value === void 0) return "\u2014";
-  if (typeof value === "boolean") return value ? "Yes" : "No";
-  return String(value);
-}
-function getCitationsForField(basis, fieldKey) {
-  if (!Array.isArray(basis) || basis.length === 0) return [];
-  const entry = basis.find((item) => item.field === fieldKey);
-  return entry?.citations || [];
-}
-function JsonSchemaArray({ schema, data, showHeader = true }) {
-  const isEmpty = !data || data.length === 0;
-  const isArrayOfObjects = !isEmpty && (schema?.items?.type === "object" || data.some((item) => typeof item === "object" && item !== null && !Array.isArray(item)));
-  const columns = useMemo(() => {
-    const itemSchema = schema?.items;
-    if (itemSchema?.properties) {
-      const cols = {};
-      Object.keys(itemSchema.properties).forEach((key) => {
-        cols[key] = {
-          label: itemSchema.properties[key]?.title || formatLabel(key),
-          property: itemSchema.properties[key]
-        };
-      });
-      return cols;
-    }
-    if (isArrayOfObjects && data.length > 0) {
-      const allKeys = /* @__PURE__ */ new Set();
-      data.forEach((item) => {
-        if (typeof item === "object" && item !== null) Object.keys(item).forEach((k) => allKeys.add(k));
-      });
-      const cols = {};
-      allKeys.forEach((key) => {
-        cols[key] = {
-          label: formatLabel(key),
-          property: { type: inferType(data[0]?.[key]) }
-        };
-      });
-      return cols;
-    }
-    return {};
-  }, [schema, data, isArrayOfObjects]);
-  return /* @__PURE__ */ jsxs("div", { className: "w-full not-prose", children: [
-    showHeader && schema?.title && /* @__PURE__ */ jsx("div", { className: "text-lg font-semibold text-slate-700 mb-3", children: schema.title }),
-    showHeader && schema?.description && /* @__PURE__ */ jsx("div", { className: "text-sm text-slate-600 mb-3", children: schema.description }),
-    isEmpty ? /* @__PURE__ */ jsx("div", { className: "text-sm text-slate-500 italic py-4", children: "No items" }) : isArrayOfObjects ? /* @__PURE__ */ jsx("div", { className: "overflow-x-auto overflow-hidden shadow-sm rounded-lg border border-slate-200", children: /* @__PURE__ */ jsxs("table", { className: "min-w-full divide-y divide-slate-200", children: [
-      /* @__PURE__ */ jsx("thead", { className: "bg-slate-50", children: /* @__PURE__ */ jsx("tr", { children: Object.entries(columns).map(([key, col]) => /* @__PURE__ */ jsx(
-        "th",
-        {
-          className: "px-4 py-3 text-left text-xs font-medium text-slate-700 uppercase tracking-wider",
-          children: col.label
-        },
-        key
-      )) }) }),
-      /* @__PURE__ */ jsx("tbody", { className: "bg-white divide-y divide-slate-200", children: data.map((item, index) => /* @__PURE__ */ jsx("tr", { className: "hover:bg-slate-50", children: Object.entries(columns).map(([key, col]) => /* @__PURE__ */ jsx("td", { className: "px-4 py-3 text-sm text-slate-700", children: col.property?.type === "object" ? /* @__PURE__ */ jsx("div", { className: "text-xs font-mono bg-slate-100 rounded px-2 py-1 whitespace-pre-wrap break-all max-w-xs", children: formatNestedObject(item[key]) }) : col.property?.type === "array" ? /* @__PURE__ */ jsx("div", { className: "text-xs font-mono bg-slate-100 rounded px-2 py-1 whitespace-pre-wrap break-all max-w-xs", children: formatNestedArray(item[key]) }) : /* @__PURE__ */ jsx("span", { className: col.property?.type === "number" || col.property?.type === "integer" ? "font-mono" : "", children: formatValue(item[key], col.property) }) }, key)) }, index)) })
-    ] }) }) : /* @__PURE__ */ jsx("div", { className: "space-y-2", children: data.map((item, index) => /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: "px-3 py-2 bg-white border border-slate-200 rounded-md text-sm text-slate-700",
-        children: formatPrimitive(item)
-      },
-      index
-    )) })
-  ] });
-}
-function JsonSchemaObject({ schema, data, basis = [] }) {
-  const properties = schema?.properties || {};
-  const required = schema?.required || [];
-  return /* @__PURE__ */ jsxs("div", { className: "w-full", children: [
-    schema?.title && /* @__PURE__ */ jsx("div", { className: "text-lg font-semibold text-slate-700 mb-4", children: schema.title }),
-    schema?.description && /* @__PURE__ */ jsx("div", { className: "text-sm text-slate-600 mb-4", children: schema.description }),
-    /* @__PURE__ */ jsx("div", { className: "space-y-4", children: Object.entries(properties).map(([key, property]) => {
-      const isNestedObject = property?.type === "object" && property?.properties;
-      const isArr = property?.type === "array";
-      const citations = getCitationsForField(basis, key);
-      const isReq = required.includes(key);
-      if (isNestedObject) {
-        return /* @__PURE__ */ jsx("div", { className: "border border-slate-200 rounded-lg p-4 bg-slate-50", children: /* @__PURE__ */ jsx(JsonSchemaObject, { schema: property, data: data?.[key] || {}, basis }) }, key);
-      }
-      if (isArr) {
-        return /* @__PURE__ */ jsxs("div", { className: "border border-slate-200 rounded-lg p-4 bg-slate-50", children: [
-          property?.title && /* @__PURE__ */ jsx("div", { className: "text-sm font-medium text-slate-700 mb-2", children: property.title }),
-          /* @__PURE__ */ jsx(JsonSchemaArray, { schema: property, data: data?.[key] || [], showHeader: false })
-        ] }, key);
-      }
-      return /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
-        /* @__PURE__ */ jsx("label", { className: `text-sm font-medium text-slate-700 mb-1${isReq ? " after:content-['*'] after:ml-0.5 after:text-red-500" : ""}`, children: getFieldLabel(key, property) }),
-        property?.description && /* @__PURE__ */ jsx("div", { className: "text-xs text-slate-500 mb-1", children: property.description }),
-        /* @__PURE__ */ jsx("div", { className: `px-3 py-2 bg-white border border-slate-300 rounded-md text-sm text-slate-700${property?.type === "number" || property?.type === "integer" ? " font-mono" : ""}`, children: formatValue(data?.[key], property) }),
-        citations.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mt-2 text-xs text-slate-600 bg-slate-50 border border-slate-200 rounded-md p-3", children: [
-          /* @__PURE__ */ jsxs("div", { className: "font-medium text-slate-700 mb-2 flex items-center gap-1", children: [
-            /* @__PURE__ */ jsx("svg", { className: "w-3 h-3", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx(
-              "path",
-              {
-                fillRule: "evenodd",
-                d: "M12.586 4.586a2 2 0 112.828 2.828l-3 3a2 2 0 01-2.828 0 1 1 0 00-1.414 1.414 4 4 0 005.656 0l3-3a4 4 0 00-5.656-5.656l-1.5 1.5a1 1 0 101.414 1.414l1.5-1.5zm-5 5a2 2 0 012.828 0 1 1 0 101.414-1.414 4 4 0 00-5.656 0l-3 3a4 4 0 105.656 5.656l1.5-1.5a1 1 0 10-1.414-1.414l-1.5 1.5a2 2 0 11-2.828-2.828l3-3z",
-                clipRule: "evenodd"
-              }
-            ) }),
-            "Sources (",
-            citations.length,
-            ")"
-          ] }),
-          /* @__PURE__ */ jsx("div", { className: "space-y-2", children: citations.map((citation, idx) => /* @__PURE__ */ jsxs("div", { className: "flex gap-2 scroll-mt-4", children: [
-            /* @__PURE__ */ jsxs("span", { className: "font-mono text-slate-500", children: [
-              "[",
-              idx + 1,
-              "]"
-            ] }),
-            /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
-              /* @__PURE__ */ jsx(
-                "a",
-                {
-                  href: citation.url,
-                  target: "_blank",
-                  rel: "noopener noreferrer",
-                  className: "text-blue-600 hover:text-blue-800 hover:underline break-all truncate block",
-                  children: citation.url
-                }
-              ),
-              citation.excerpts && citation.excerpts.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mt-1 text-slate-600 italic truncate", children: [
-                '"',
-                citation.excerpts[0],
-                '"'
-              ] })
-            ] })
-          ] }, idx)) })
-        ] })
-      ] }, key);
-    }) })
-  ] });
-}
-function JsonSchemaLayout({ schema, data, basis = [] }) {
-  const schemaType = schema?.type || (Array.isArray(data) ? "array" : "object");
-  if (schemaType === "array") {
-    return /* @__PURE__ */ jsx(JsonSchemaArray, { schema, data });
-  }
-  return /* @__PURE__ */ jsx(JsonSchemaObject, { schema, data, basis });
-}
 function CanvasDeepResearchView({
   title,
   output_schema,
@@ -10505,7 +10701,7 @@ var buttonVariants = cva(
     }
   }
 );
-var Button12 = withTooltip(({
+var Button13 = withTooltip(({
   active,
   asChild = false,
   children,
@@ -11113,7 +11309,7 @@ function AIMenu() {
               }
             ),
             /* @__PURE__ */ jsx(
-              Button12,
+              Button13,
               {
                 className: "no-focus-ring mt-1 shrink-0",
                 disabled: !isLoading && input.trim().length === 0,
@@ -11987,7 +12183,7 @@ function Comment(props) {
           ] }),
           isMyComment && (hovering || dropdownOpen) && /* @__PURE__ */ jsxs("div", { className: "absolute top-0 right-0 flex space-x-1", children: [
             index === 0 && /* @__PURE__ */ jsx(
-              Button12,
+              Button13,
               {
                 className: "h-6 p-1 text-muted-foreground",
                 onClick: onResolveComment,
@@ -12036,7 +12232,7 @@ function Comment(props) {
             ),
             isEditing && /* @__PURE__ */ jsxs("div", { className: "ml-auto flex shrink-0 gap-1", children: [
               /* @__PURE__ */ jsx(
-                Button12,
+                Button13,
                 {
                   className: "size-[28px]",
                   onClick: (e) => {
@@ -12049,7 +12245,7 @@ function Comment(props) {
                 }
               ),
               /* @__PURE__ */ jsx(
-                Button12,
+                Button13,
                 {
                   onClick: (e) => {
                     e.stopPropagation();
@@ -12117,7 +12313,7 @@ function CommentMoreDropdown(props) {
       onOpenChange: setDropdownOpen,
       open: dropdownOpen,
       children: [
-        /* @__PURE__ */ jsx(DropdownMenuTrigger3, { asChild: true, onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx(Button12, { className: cn("h-6 p-1 text-muted-foreground"), variant: "ghost", children: /* @__PURE__ */ jsx(MoreHorizontalIcon, { className: "size-4" }) }) }),
+        /* @__PURE__ */ jsx(DropdownMenuTrigger3, { asChild: true, onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx(Button13, { className: cn("h-6 p-1 text-muted-foreground"), variant: "ghost", children: /* @__PURE__ */ jsx(MoreHorizontalIcon, { className: "size-4" }) }) }),
         /* @__PURE__ */ jsx(
           DropdownMenuContent3,
           {
@@ -12289,7 +12485,7 @@ function CommentCreateForm({
             }
           ),
           /* @__PURE__ */ jsx(
-            Button12,
+            Button13,
             {
               className: "absolute right-0 bottom-0 ml-auto shrink-0",
               disabled: commentContent.trim().length === 0,
@@ -12623,7 +12819,7 @@ function BlockSuggestionCard({
           )),
           hovering && /* @__PURE__ */ jsxs("div", { className: "absolute top-4 right-4 flex gap-2", children: [
             /* @__PURE__ */ jsx(
-              Button12,
+              Button13,
               {
                 variant: "ghost",
                 className: "size-6 p-1 text-muted-foreground",
@@ -12632,7 +12828,7 @@ function BlockSuggestionCard({
               }
             ),
             /* @__PURE__ */ jsx(
-              Button12,
+              Button13,
               {
                 variant: "ghost",
                 className: "size-6 p-1 text-muted-foreground",
@@ -13102,7 +13298,7 @@ var BlockCommentsContent = ({
           }
         ),
         totalCount > 0 && /* @__PURE__ */ jsx("div", { className: "relative left-0 size-0 select-none", children: /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
-          Button12,
+          Button13,
           {
             className: "mt-1 ml-1 flex h-6 gap-1 px-1.5 py-0 text-muted-foreground/80 hover:text-muted-foreground/80 data-[active=true]:bg-muted",
             contentEditable: false,
@@ -15018,7 +15214,7 @@ function BlockActionButton({
   const editor = useEditorRef();
   const element = useElement();
   return /* @__PURE__ */ jsx(
-    Button12,
+    Button13,
     {
       className: cn(
         defaultStyles && "absolute top-1 right-1 opacity-0 transition-opacity group-hover:opacity-100",
@@ -15357,7 +15553,7 @@ function EmojiPickerSearchAndClear({
       }
     ),
     searchValue && /* @__PURE__ */ jsx(
-      Button12,
+      Button13,
       {
         "aria-label": "Clear",
         className: cn(
@@ -15446,7 +15642,7 @@ function EmojiPickerNavigation({
       id: "emoji-nav",
       children: /* @__PURE__ */ jsxs("div", { className: "relative flex items-center", children: [
         emojiLibrary.getGrid().sections().map(({ id }) => /* @__PURE__ */ jsx(
-          Button12,
+          Button13,
           {
             "aria-label": i18n.categories[id],
             className: cn(
@@ -15608,7 +15804,7 @@ function CalloutElement(props) {
           {
             ...emojiToolbarDropdownProps,
             control: /* @__PURE__ */ jsx(
-              Button12,
+              Button13,
               {
                 className: "size-6 select-none p-1 text-[18px] hover:bg-muted-foreground/15",
                 contentEditable: false,
@@ -15847,7 +16043,7 @@ function CodeBlockElement(props) {
             contentEditable: false,
             children: [
               /* @__PURE__ */ jsxs(
-                Button12,
+                Button13,
                 {
                   className: "relative top-0 right-0 w-auto",
                   onClick: () => {
@@ -15892,7 +16088,7 @@ function CodeBlockCombobox({ className }) {
   if (readOnly) return null;
   return /* @__PURE__ */ jsxs(Popover, { onOpenChange: setOpen, open, children: [
     /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
-      Button12,
+      Button13,
       {
         "aria-expanded": open,
         className: cn(
@@ -16253,7 +16449,7 @@ function Draggable(props) {
                 ),
                 children: [
                   /* @__PURE__ */ jsx(
-                    Button12,
+                    Button13,
                     {
                       className: "absolute right-0 h-6 w-6 p-0",
                       "data-plate-prevent-deselect": true,
@@ -16440,7 +16636,7 @@ var DraggableInsertHandle = () => {
   const editor = useEditorRef();
   const element = useElement();
   return /* @__PURE__ */ jsx(
-    Button12,
+    Button13,
     {
       className: "size-6 shrink-0 p-1",
       onClick: (event) => {
@@ -17671,7 +17867,7 @@ function EquationPopoverContent({
             ...props
           }
         ),
-        /* @__PURE__ */ jsxs(Button12, { className: "px-3", onClick: onClose, variant: "brand", children: [
+        /* @__PURE__ */ jsxs(Button13, { className: "px-3", onClick: onClose, variant: "brand", children: [
           "Done ",
           /* @__PURE__ */ jsx(CornerDownLeftIcon, { className: "size-3.5" })
         ] })
@@ -18549,7 +18745,7 @@ function MediaPlaceholderPopover({ children }) {
             /* @__PURE__ */ jsx(TabsTrigger, { value: "password", children: "Embed link" })
           ] }),
           /* @__PURE__ */ jsxs(TabsContent, { className: "w-[300px] px-3 py-2", value: "account", children: [
-            /* @__PURE__ */ jsx(Button12, { className: "w-full", onClick: openFilePicker, variant: "brand", children: currentMedia.buttonText }),
+            /* @__PURE__ */ jsx(Button13, { className: "w-full", onClick: openFilePicker, variant: "brand", children: currentMedia.buttonText }),
             /* @__PURE__ */ jsx("div", { className: "mt-3 text-muted-foreground text-xs", children: "The maximum size per file is 5MB" })
           ] }),
           /* @__PURE__ */ jsxs(
@@ -18567,7 +18763,7 @@ function MediaPlaceholderPopover({ children }) {
                   }
                 ),
                 /* @__PURE__ */ jsx(
-                  Button12,
+                  Button13,
                   {
                     className: "mt-2 w-full max-w-[300px]",
                     onClick: () => onEmbed(embedValue),
@@ -18687,12 +18883,12 @@ function ImagePreview() {
             onClick: (e) => e.stopPropagation(),
             children: [
               !prevDisabled && !nextDisabled && /* @__PURE__ */ jsxs("div", { className: "flex rounded-sm bg-black/70", children: [
-                /* @__PURE__ */ jsx(Button12, { ...prevProps, disabled: prevDisabled, children: /* @__PURE__ */ jsx(ArrowLeftIcon, { className: "size-5" }) }),
-                /* @__PURE__ */ jsx(Button12, { ...nextProps, disabled: nextDisabled, children: /* @__PURE__ */ jsx(ArrowRightIcon, { className: "size-5" }) })
+                /* @__PURE__ */ jsx(Button13, { ...prevProps, disabled: prevDisabled, children: /* @__PURE__ */ jsx(ArrowLeftIcon, { className: "size-5" }) }),
+                /* @__PURE__ */ jsx(Button13, { ...nextProps, disabled: nextDisabled, children: /* @__PURE__ */ jsx(ArrowRightIcon, { className: "size-5" }) })
               ] }),
               currentPreview && /* @__PURE__ */ jsxs("div", { className: "flex rounded-sm bg-black/70", children: [
                 /* @__PURE__ */ jsx(
-                  Button12,
+                  Button13,
                   {
                     ...zommOutProps,
                     disabled: zoomOutDisabled,
@@ -18705,7 +18901,7 @@ function ImagePreview() {
                   /* @__PURE__ */ jsx("div", { children: "%" })
                 ] }),
                 /* @__PURE__ */ jsx(
-                  Button12,
+                  Button13,
                   {
                     ...zoomInProps,
                     disabled: zoomInDisabled,
@@ -18714,7 +18910,7 @@ function ImagePreview() {
                   }
                 ),
                 /* @__PURE__ */ jsx(
-                  Button12,
+                  Button13,
                   {
                     onClick: () => {
                       void downloadFile(currentPreview.url, currentPreview.id);
@@ -18723,7 +18919,7 @@ function ImagePreview() {
                     children: /* @__PURE__ */ jsx(CircleArrowDown, { className: "size-4" })
                   }
                 ),
-                /* @__PURE__ */ jsx(Button12, { ...closeProps, tooltip: "Close", children: /* @__PURE__ */ jsx(Minimize2, { className: "size-4" }) })
+                /* @__PURE__ */ jsx(Button13, { ...closeProps, tooltip: "Close", children: /* @__PURE__ */ jsx(Minimize2, { className: "size-4" }) })
               ] })
             ]
           }
@@ -19363,7 +19559,7 @@ var TableElement = withHOC(
                   "group-has-[tr:last-child:hover]/table:opacity-100 max-sm:group-has-[tr[data-selected]:last-child]/table:opacity-100"
                 ),
                 children: /* @__PURE__ */ jsx(
-                  Button12,
+                  Button13,
                   {
                     className: "flex h-4 w-full grow items-center justify-center bg-muted",
                     onClick: () => tf.insert.tableRow({ at: editor.api.findPath(element) }),
@@ -19385,7 +19581,7 @@ var TableElement = withHOC(
                   "group-has-[td:last-child:hover,th:last-child:hover]/table:opacity-100 max-sm:group-has-[td[data-selected]:last-child,th[data-selected]:last-child]/table:opacity-100"
                 ),
                 children: /* @__PURE__ */ jsx(
-                  Button12,
+                  Button13,
                   {
                     className: "flex h-full w-4 grow items-center justify-center bg-muted",
                     onClick: () => tf.insert.tableColumn({
@@ -19409,7 +19605,7 @@ var TableElement = withHOC(
                   "group-has-[td:last-child:hover,th:last-child:hover]/table:group-has-[tr:last-child:hover]/table:opacity-100 max-sm:group-has-[td[data-selected]:last-child,th[data-selected]:last-child]/table:group-has-[tr[data-selected]:last-child]/table:opacity-100"
                 ),
                 children: /* @__PURE__ */ jsx(
-                  Button12,
+                  Button13,
                   {
                     className: "flex size-4 items-center justify-center rounded-full bg-muted",
                     onClick: () => {
@@ -19615,7 +19811,7 @@ function TocElement(props) {
   const { headingList } = state;
   return /* @__PURE__ */ jsxs(PlateElement, { ...props, className: "my-1", children: [
     /* @__PURE__ */ jsx("div", { contentEditable: false, children: headingList.length > 0 ? headingList.map((item) => /* @__PURE__ */ jsx(
-      Button12,
+      Button13,
       {
         "aria-current": true,
         className: headingItemVariants({ depth: item.depth }),
@@ -20717,7 +20913,7 @@ function TocElementStatic(props) {
   const headingList = getHeadingList(editor);
   return /* @__PURE__ */ jsxs(SlateElement, { ...props, className: "mb-1 p-0", children: [
     /* @__PURE__ */ jsx("div", { children: headingList.length > 0 ? headingList.map((item) => /* @__PURE__ */ jsx(
-      Button12,
+      Button13,
       {
         className: headingItemVariants2({ depth: item.depth }),
         variant: "ghost",