@flytedan/flytebot-design-system 0.56.0 → 0.58.0

package/dist/index.js

@@ -1128,9 +1128,11 @@ import * as React10 from "react";
 // src/kits/cornerStack.tsx
 import * as React9 from "react";
 import { createPortal as createPortal4 } from "react-dom";
+var CORNER_STACK_INSET_PROPERTY = "--fd-corner-stack-inset";
 var SLOTS = ["jobs", "toasts"];
 var references = /* @__PURE__ */ new Map();
 var host = null;
+var hostObserver = null;
 var slotElements = /* @__PURE__ */ new Map();
 function createHost() {
   const stack = document.createElement("div");
@@ -1144,8 +1146,18 @@ function createHost() {
     slotElements.set(slot, element);
   }
   document.body.appendChild(stack);
+  publishInset(stack);
+  if (typeof ResizeObserver === "function") {
+    hostObserver = new ResizeObserver(() => publishInset(stack));
+    hostObserver.observe(stack);
+  }
   return stack;
 }
+function publishInset(stack) {
+  const height = stack.offsetHeight;
+  const inset = height > 0 ? height + parseFloat(getComputedStyle(stack).bottom) : 0;
+  document.documentElement.style.setProperty(CORNER_STACK_INSET_PROPERTY, `${inset}px`);
+}
 function acquire(slot) {
   host ??= createHost();
   references.set(slot, (references.get(slot) ?? 0) + 1);
@@ -1156,6 +1168,9 @@ function release(slot) {
   if (remaining > 0) references.set(slot, remaining);
   else references.delete(slot);
   if (references.size === 0 && host) {
+    hostObserver?.disconnect();
+    hostObserver = null;
+    document.documentElement.style.removeProperty(CORNER_STACK_INSET_PROPERTY);
     host.remove();
     host = null;
     slotElements.clear();
@@ -1594,7 +1609,7 @@ function AppShell({
             /* @__PURE__ */ jsx21(
               "div",
               {
-                className: contentClassName,
+                className: ["fd-app-shell-content", contentClassName].filter(Boolean).join(" "),
                 style: {
                   flex: 1,
                   minWidth: 0,
@@ -1602,7 +1617,6 @@ function AppShell({
                   // table) is contained and clipped by this scroller, never stretching the document.
                   position: "relative",
                   overflowY: "auto",
-                  padding: 24,
                   maxWidth: contentMaxWidth,
                   margin: "0 auto",
                   width: "100%",
@@ -5427,53 +5441,156 @@ function InlinePanelSurface({ panel, align = "right", ...popover }) {
 }
 
 // src/components/data/SortMenu.tsx
-import { jsx as jsx57, jsxs as jsxs49 } from "react/jsx-runtime";
-function SortMenu({ fields = [], sort, onSort, align = "right", size = "md", className = "", ...rest }) {
+import { Fragment as Fragment11, jsx as jsx57, jsxs as jsxs49 } from "react/jsx-runtime";
+var directionWord = (field, dir) => dir === "asc" ? field.numeric ? "lowest first" : "A to Z" : field.numeric ? "highest first" : "Z to A";
+function moved(sort, from, to) {
+  const next = [...sort];
+  const [entry] = next.splice(from, 1);
+  next.splice(to, 0, entry);
+  return next;
+}
+function SortMenu({
+  fields = [],
+  sort = [],
+  onSortChange,
+  multiple = false,
+  align = "right",
+  size = "md",
+  className = "",
+  ...rest
+}) {
   const panel = useInlinePanel();
   const { open: open2, setOpen, ref } = panel;
-  const cur = fields.find((f) => f.key === (sort && sort.key));
-  const dir = sort && sort.dir;
-  const arrow = (f, d) => {
-    const on = cur && cur.key === f.key && dir === d;
-    const label = d === "asc" ? f.numeric ? "lowest first" : "A to Z" : f.numeric ? "highest first" : "Z to A";
-    return /* @__PURE__ */ jsx57(
-      "button",
+  const change = (next) => onSortChange && onSortChange(next);
+  const fieldOf = (key) => fields.find((f) => f.key === key);
+  const active = sort.filter((entry) => fieldOf(entry.key));
+  const first = active[0];
+  const firstField = first && fieldOf(first.key);
+  const triggerLabel = firstField ? firstField.label + (active.length > 1 ? " +" + (active.length - 1) : "") : "Unsorted";
+  const triggerTitle = active.map((entry) => {
+    const field = fieldOf(entry.key);
+    return field.label + " " + directionWord(field, entry.dir);
+  }).join(", then ");
+  const arrow = (field, dir, on, onClick) => /* @__PURE__ */ jsx57(
+    "button",
+    {
+      type: "button",
+      "aria-label": field.label + ", " + directionWord(field, dir),
+      "aria-pressed": on,
+      onClick,
+      style: {
+        display: "grid",
+        placeItems: "center",
+        width: 26,
+        height: 26,
+        borderRadius: 6,
+        cursor: "pointer",
+        flex: "none",
+        border: "1px solid " + (on ? "var(--brand)" : "var(--border)"),
+        background: on ? "var(--brand)" : "var(--surface)",
+        color: on ? "#fff" : "var(--text-muted)"
+      },
+      children: /* @__PURE__ */ jsx57("i", { className: "ph ph-arrow-" + (dir === "asc" ? "up" : "down"), style: { fontSize: 13 } })
+    }
+  );
+  const rowStyle = (highlight) => ({
+    gap: 8,
+    padding: "4px 8px",
+    borderRadius: 7,
+    background: highlight ? "var(--surface-brand)" : "transparent"
+  });
+  const labelStyle = (highlight) => ({
+    flex: 1,
+    minWidth: 0,
+    fontWeight: highlight ? 700 : 500,
+    color: highlight ? "var(--text-on-surface-brand)" : "var(--text)"
+  });
+  const singleBody = fields.map((f) => {
+    const on = !!first && first.key === f.key;
+    return /* @__PURE__ */ jsxs49("span", { className: "fd-row", style: rowStyle(on), children: [
+      /* @__PURE__ */ jsx57("span", { className: "fd-body-sm", style: labelStyle(on), children: f.label }),
+      arrow(f, "asc", on && first.dir === "asc", () => change([{ key: f.key, dir: "asc" }])),
+      arrow(f, "desc", on && first.dir === "desc", () => change([{ key: f.key, dir: "desc" }]))
+    ] }, f.key);
+  });
+  const unused = fields.filter((f) => !active.some((entry) => entry.key === f.key));
+  const multipleBody = /* @__PURE__ */ jsxs49(Fragment11, { children: [
+    /* @__PURE__ */ jsx57("span", { className: "fd-overline fd-muted", style: { padding: "4px 8px 6px" }, children: "Sorted by" }),
+    active.length === 0 ? /* @__PURE__ */ jsx57("span", { className: "fd-body-sm fd-muted", style: { padding: "4px 8px" }, children: "Unsorted" }) : /* @__PURE__ */ jsx57("ol", { className: "fd-stack", style: { gap: 2, margin: 0, padding: 0, listStyle: "none" }, "aria-label": "Sort order", children: active.map((entry, index) => {
+      const f = fieldOf(entry.key);
+      const flipped = entry.dir === "asc" ? "desc" : "asc";
+      return /* @__PURE__ */ jsxs49("li", { className: "fd-row", style: rowStyle(false), children: [
+        /* @__PURE__ */ jsx57("span", { className: "fd-body-sm fd-muted", "aria-hidden": "true", style: { width: 14, flex: "none" }, children: index + 1 }),
+        /* @__PURE__ */ jsx57("span", { className: "fd-body-sm", style: labelStyle(false), children: f.label }),
+        /* @__PURE__ */ jsx57(
+          IconButton,
+          {
+            size: "sm",
+            variant: "outline",
+            icon: entry.dir === "asc" ? "arrow-up" : "arrow-down",
+            label: f.label + ", " + directionWord(f, entry.dir) + ". Switch to " + directionWord(f, flipped),
+            onClick: () => change(active.map((e) => e.key === entry.key ? { key: e.key, dir: flipped } : e))
+          }
+        ),
+        /* @__PURE__ */ jsx57(
+          IconButton,
+          {
+            size: "sm",
+            icon: "caret-up",
+            label: "Sort " + f.label + " earlier",
+            disabled: index === 0,
+            onClick: () => change(moved(active, index, index - 1))
+          }
+        ),
+        /* @__PURE__ */ jsx57(
+          IconButton,
+          {
+            size: "sm",
+            icon: "caret-down",
+            label: "Sort " + f.label + " later",
+            disabled: index === active.length - 1,
+            onClick: () => change(moved(active, index, index + 1))
+          }
+        ),
+        /* @__PURE__ */ jsx57(
+          IconButton,
+          {
+            size: "sm",
+            icon: "x",
+            label: "Remove " + f.label + " from the sort",
+            onClick: () => change(active.filter((e) => e.key !== entry.key))
+          }
+        )
+      ] }, entry.key);
+    }) }),
+    unused.length > 0 ? /* @__PURE__ */ jsxs49(Fragment11, { children: [
+      /* @__PURE__ */ jsx57("span", { className: "fd-overline fd-muted", style: { padding: "10px 8px 6px" }, children: "Add a sort" }),
+      unused.map((f) => /* @__PURE__ */ jsxs49("span", { className: "fd-row", style: rowStyle(false), children: [
+        /* @__PURE__ */ jsx57("span", { className: "fd-body-sm", style: labelStyle(false), children: f.label }),
+        arrow(f, "asc", false, () => change([...active, { key: f.key, dir: "asc" }])),
+        arrow(f, "desc", false, () => change([...active, { key: f.key, dir: "desc" }]))
+      ] }, f.key))
+    ] }) : null
+  ] });
+  return /* @__PURE__ */ jsxs49("span", { className, style: { display: "inline-flex", minWidth: 0 }, ref, ...rest, children: [
+    /* @__PURE__ */ jsxs49(
+      Button,
       {
-        type: "button",
-        "aria-label": f.label + ", " + label,
-        "aria-pressed": on,
-        onClick: () => onSort && onSort(f.key, d),
-        style: {
-          display: "grid",
-          placeItems: "center",
-          width: 26,
-          height: 26,
-          borderRadius: 6,
-          cursor: "pointer",
-          border: "1px solid " + (on ? "var(--brand)" : "var(--border)"),
-          background: on ? "var(--brand)" : "var(--surface)",
-          color: on ? "#fff" : "var(--text-muted)"
-        },
-        children: /* @__PURE__ */ jsx57("i", { className: "ph ph-arrow-" + (d === "asc" ? "up" : "down"), style: { fontSize: 13 } })
+        size,
+        variant: "secondary",
+        icon: first && first.dir === "asc" ? "sort-ascending" : "sort-descending",
+        title: triggerTitle || void 0,
+        onClick: () => setOpen(!open2),
+        children: [
+          triggerLabel,
+          /* @__PURE__ */ jsx57("i", { className: "ph ph-" + (first && first.dir === "asc" ? "arrow-up" : "arrow-down"), style: { fontSize: 12, marginLeft: 6, opacity: 0.75 } })
+        ]
       }
-    );
-  };
-  return /* @__PURE__ */ jsxs49("span", { className, style: { display: "inline-flex" }, ref, ...rest, children: [
-    /* @__PURE__ */ jsxs49(Button, { size, variant: "secondary", icon: dir === "asc" ? "sort-ascending" : "sort-descending", onClick: () => setOpen(!open2), children: [
-      cur ? cur.label : "Unsorted",
-      /* @__PURE__ */ jsx57("i", { className: "ph ph-" + (dir === "asc" ? "arrow-up" : "arrow-down"), style: { fontSize: 12, marginLeft: 6, opacity: 0.75 } })
-    ] }),
-    /* @__PURE__ */ jsx57(InlinePanelSurface, { panel, align, offset: 6, width: 280, label: "Sort by", children: /* @__PURE__ */ jsxs49("span", { className: "fd-stack", style: { gap: 2, padding: 8 }, children: [
+    ),
+    /* @__PURE__ */ jsx57(InlinePanelSurface, { panel, align, offset: 6, width: multiple ? 340 : 280, label: "Sort by", children: /* @__PURE__ */ jsx57("span", { className: "fd-stack", style: { gap: 2, padding: 8 }, children: multiple ? multipleBody : /* @__PURE__ */ jsxs49(Fragment11, { children: [
       /* @__PURE__ */ jsx57("span", { className: "fd-overline fd-muted", style: { padding: "4px 8px 6px" }, children: "Sort by" }),
-      fields.map((f) => {
-        const active = cur && cur.key === f.key;
-        return /* @__PURE__ */ jsxs49("span", { className: "fd-row", style: { gap: 8, padding: "4px 8px", borderRadius: 7, background: active ? "var(--surface-brand)" : "transparent" }, children: [
-          /* @__PURE__ */ jsx57("span", { className: "fd-body-sm", style: { flex: 1, fontWeight: active ? 700 : 500, color: active ? "var(--text-on-surface-brand)" : "var(--text)" }, children: f.label }),
-          arrow(f, "asc"),
-          arrow(f, "desc")
-        ] }, f.key);
-      })
-    ] }) })
+      singleBody
+    ] }) }) })
   ] });
 }
 
@@ -6011,7 +6128,7 @@ function TransferList({
           cfg.header ? /* @__PURE__ */ jsx63("div", { className: "fd-tlist-header", children: cfg.header }) : null,
           /* @__PURE__ */ jsxs54("span", { className: "fd-row", style: { gap: 8 }, children: [
             /* @__PURE__ */ jsx63(SearchField, { value: cfg.search, onChange: cfg.onSearchChange, placeholder: "Search", "aria-label": (cfg.label || side) + " search", style: { flex: 1 } }),
-            /* @__PURE__ */ jsx63(SortMenu, { fields: cfg.sortFields, sort: cfg.sort, onSort: cfg.onSort, align: side === "left" ? "left" : "right" })
+            /* @__PURE__ */ jsx63(SortMenu, { fields: cfg.sortFields, sort: cfg.sort ? [cfg.sort] : [], onSortChange: (next) => next[0] && cfg.onSort(next[0].key, next[0].dir), align: side === "left" ? "left" : "right" })
           ] }),
           /* @__PURE__ */ jsx63(
             VirtualList,
@@ -7734,7 +7851,7 @@ function useSessionContext() {
 }
 
 // src/components/platform/AccountMenu.tsx
-import { Fragment as Fragment16, jsx as jsx75, jsxs as jsxs66 } from "react/jsx-runtime";
+import { Fragment as Fragment17, jsx as jsx75, jsxs as jsxs66 } from "react/jsx-runtime";
 var DEFAULT_LINKS = [];
 var DEFAULT_GROUPS = [];
 function Item({ item, onPick }) {
@@ -7796,7 +7913,7 @@ function AccountMenu({
     }
   };
   const showSwitcher = allowUserSwitch && !!demo;
-  return /* @__PURE__ */ jsxs66(Fragment16, { children: [
+  return /* @__PURE__ */ jsxs66(Fragment17, { children: [
     /* @__PURE__ */ jsxs66(
       "button",
       {
@@ -8554,7 +8671,7 @@ function ProfilePage({
 
 // src/components/platform/SessionScreen.tsx
 import * as React55 from "react";
-import { Fragment as Fragment19, jsx as jsx80, jsxs as jsxs71 } from "react/jsx-runtime";
+import { Fragment as Fragment20, jsx as jsx80, jsxs as jsxs71 } from "react/jsx-runtime";
 var COPY = {
   "signing-in": { busy: "Signing you in\u2026" },
   "session-expired": { busy: "Your session expired \u2014 signing you back in\u2026" },
@@ -8582,7 +8699,7 @@ function SessionScreen({ kind, error, onRetry, productName }) {
       /* @__PURE__ */ jsx80("div", { className: "fd-session-screen-stripe" }),
       /* @__PURE__ */ jsx80(Card, { children: /* @__PURE__ */ jsxs71("div", { className: "fd-session-screen-body", children: [
         /* @__PURE__ */ jsx80("h1", { ref: titleRef, tabIndex: -1, className: "fd-h3 fd-session-screen-title", children: productName }),
-        /* @__PURE__ */ jsx80("div", { role: "status", "aria-live": "polite", className: "fd-session-screen-status", children: busyMessage !== null ? /* @__PURE__ */ jsxs71(Fragment19, { children: [
+        /* @__PURE__ */ jsx80("div", { role: "status", "aria-live": "polite", className: "fd-session-screen-status", children: busyMessage !== null ? /* @__PURE__ */ jsxs71(Fragment20, { children: [
           /* @__PURE__ */ jsx80("span", { className: "fd-spinner fd-spinner-lg fd-session-screen-spinner", "aria-hidden": "true" }),
           /* @__PURE__ */ jsx80("p", { className: "fd-body fd-session-screen-message", children: announced })
         ] }) : null }),
@@ -10609,7 +10726,7 @@ function RoadmapTimeline({ onOpenFlag, title = "Roadmap", lede }) {
 // src/components/platform/ComingSoon.tsx
 import * as React59 from "react";
 import { createPortal as createPortal6 } from "react-dom";
-import { Fragment as Fragment21, jsx as jsx82, jsxs as jsxs73 } from "react/jsx-runtime";
+import { Fragment as Fragment22, jsx as jsx82, jsxs as jsxs73 } from "react/jsx-runtime";
 var BYPASS_STORE = "fd.soon.bypass.v1";
 function readBypassed() {
   try {
@@ -10639,7 +10756,7 @@ function useBypass(key) {
   return [on, set];
 }
 function SoonCard({ label, detail, backend, eta, effort, onRoadmap, allowed, onBypass }) {
-  return /* @__PURE__ */ jsxs73(Fragment21, { children: [
+  return /* @__PURE__ */ jsxs73(Fragment22, { children: [
     /* @__PURE__ */ jsxs73("span", { className: "fd-soon-badge", children: [
       /* @__PURE__ */ jsx82("i", { className: "ph ph-traffic-cone", "aria-hidden": "true" }),
       label
@@ -11029,7 +11146,7 @@ function PermissionHint({ perm, children }) {
 }
 
 // src/components/platform/ModeSwitch.tsx
-import { Fragment as Fragment22, jsx as jsx84, jsxs as jsxs75 } from "react/jsx-runtime";
+import { Fragment as Fragment23, jsx as jsx84, jsxs as jsxs75 } from "react/jsx-runtime";
 function ModeSwitch({ canToggle = false, requestCount = 0, onClearLog, renderLog, onOpenSpec, summary }) {
   const mode2 = useRuntimeMode();
   const panel = useInlinePanel();
@@ -11084,7 +11201,7 @@ function ModeSwitch({ canToggle = false, requestCount = 0, onClearLog, renderLog
             s.total,
             " features complete"
           ] }),
-          onOpenSpec ? /* @__PURE__ */ jsxs75(Fragment22, { children: [
+          onOpenSpec ? /* @__PURE__ */ jsxs75(Fragment23, { children: [
             /* @__PURE__ */ jsx84("span", { style: { flex: 1 } }),
             /* @__PURE__ */ jsxs75("button", { type: "button", className: "fd-soon-link", onClick: () => {
               setOpen(false);
@@ -11276,7 +11393,7 @@ function SaturationDistribution({ campuses = [], floorBand, floorScore, onSelect
 
 // src/components/planner/MixGap.tsx
 import * as React60 from "react";
-import { Fragment as Fragment23, jsx as jsx87, jsxs as jsxs78 } from "react/jsx-runtime";
+import { Fragment as Fragment24, jsx as jsx87, jsxs as jsxs78 } from "react/jsx-runtime";
 var MIX_GAP_LAYOUT = {
   trackHeight: 30,
   barHeight: 20,
@@ -11320,7 +11437,7 @@ function MixGap({ rows = [], loading = false, className = "" }) {
           onMouseLeave: () => setHover(null),
           children: [
             /* @__PURE__ */ jsx87("span", { style: { width: 128, flex: "none" }, children: /* @__PURE__ */ jsx87(ChannelTag, { channel: r.channel, size: "sm" }) }),
-            /* @__PURE__ */ jsx87("span", { style: { position: "relative", flex: 1, height: trackHeight, minWidth: 120 }, children: loading ? /* @__PURE__ */ jsx87("span", { className: "fd-skel", style: { position: "absolute", left: 0, right: 0, top: barTop, height: barHeight, borderRadius: 3 } }) : /* @__PURE__ */ jsxs78(Fragment23, { children: [
+            /* @__PURE__ */ jsx87("span", { style: { position: "relative", flex: 1, height: trackHeight, minWidth: 120 }, children: loading ? /* @__PURE__ */ jsx87("span", { className: "fd-skel", style: { position: "absolute", left: 0, right: 0, top: barTop, height: barHeight, borderRadius: 3 } }) : /* @__PURE__ */ jsxs78(Fragment24, { children: [
               /* @__PURE__ */ jsx87("span", { "data-mixgap-bar": "", style: { position: "absolute", left: 0, top: barTop, height: barHeight, width: mixGapOffset(r.realized, max), background: TONE[tone], borderRadius: "2px 3px 3px 2px", transition: "width var(--dur-slow) var(--ease), background var(--dur-base) var(--ease)" } }),
               /* @__PURE__ */ jsx87("span", { "data-mixgap-target": "", style: { position: "absolute", left: `calc(${mixGapOffset(r.target, max)} - ${targetWidth / 2}px)`, top: 0, width: targetWidth, height: trackHeight, background: MIX_GAP_TARGET_STRIPE, borderRadius: 1 } }),
               /* @__PURE__ */ jsxs78("span", { "data-mixgap-label": "", className: "fd-num", style: { position: "absolute", left: labelLeft, top: "50%", transform: "translateY(-50%)", fontSize: 12, color: "var(--text-muted)", whiteSpace: "nowrap" }, children: [
@@ -11434,7 +11551,7 @@ function ChannelContribution({
 
 // src/components/planner/BudgetReallocator.tsx
 import * as React61 from "react";
-import { Fragment as Fragment24, jsx as jsx89, jsxs as jsxs80 } from "react/jsx-runtime";
+import { Fragment as Fragment25, jsx as jsx89, jsxs as jsxs80 } from "react/jsx-runtime";
 var bandFor = (crp) => crp >= 200 ? "dominant" : crp >= 100 ? "strong" : crp >= 50 ? "adequate" : "weak";
 function BudgetReallocator({
   campus,
@@ -11498,7 +11615,7 @@ function BudgetReallocator({
         /* @__PURE__ */ jsxs80("div", { className: "fd-row", style: { gap: 12, flexWrap: "wrap" }, children: [
           /* @__PURE__ */ jsx89("span", { className: "fd-h4", style: { flex: 1, minWidth: 140 }, children: campus }),
           /* @__PURE__ */ jsx89(CsiBadge, { band: nowBand, crp, size: "medium" }),
-          dirty ? /* @__PURE__ */ jsxs80(Fragment24, { children: [
+          dirty ? /* @__PURE__ */ jsxs80(Fragment25, { children: [
             /* @__PURE__ */ jsx89("i", { className: "ph ph-arrow-right fd-muted", "aria-hidden": "true" }),
             /* @__PURE__ */ jsx89(CsiBadge, { band: nextBand, crp: nextCrp, size: "medium", preview: true })
           ] }) : null
@@ -13437,7 +13554,7 @@ function FileViewer({ file, resolveUrl, sidePanel, sidePanelLabel = "Details", o
 
 // src/components/files/FileBrowser.tsx
 import * as React70 from "react";
-import { Fragment as Fragment28, jsx as jsx99, jsxs as jsxs90 } from "react/jsx-runtime";
+import { Fragment as Fragment29, jsx as jsx99, jsxs as jsxs90 } from "react/jsx-runtime";
 function childrenOf(folders, parentId) {
   return folders.filter((f) => f.parentId === parentId).sort((a, b) => a.name.localeCompare(b.name));
 }
@@ -13736,7 +13853,7 @@ function FileBrowser({
       ] }),
       /* @__PURE__ */ jsxs90("span", { className: "fd-fb-actions", children: [
         canCreateFolder ? /* @__PURE__ */ jsx99(Button, { variant: "secondary", size: "sm", icon: "folder-simple-plus", onClick: openCreate, children: "New folder" }) : null,
-        canUpload ? /* @__PURE__ */ jsxs90(Fragment28, { children: [
+        canUpload ? /* @__PURE__ */ jsxs90(Fragment29, { children: [
           /* @__PURE__ */ jsx99(Button, { variant: "secondary", size: "sm", icon: "upload-simple", onClick: () => uploadInputRef.current && uploadInputRef.current.click(), children: "Upload" }),
           /* @__PURE__ */ jsx99(
             "input",
@@ -13803,7 +13920,7 @@ function FileBrowser({
                 draggableId: canMove ? { kind: "folder", id: f.id } : void 0,
                 isDropTarget: canMove,
                 onDropPayload: (p) => moveIntoFolder(p, f.id),
-                actions: /* @__PURE__ */ jsxs90(Fragment28, { children: [
+                actions: /* @__PURE__ */ jsxs90(Fragment29, { children: [
                   canRenameFolder ? /* @__PURE__ */ jsx99(IconButton, { icon: "pencil-simple", label: "Rename " + f.name, size: "sm", variant: "ghost", onClick: () => openRename(f) }) : null,
                   canMove ? /* @__PURE__ */ jsx99(
                     FolderPickerMenu,
@@ -13826,7 +13943,7 @@ function FileBrowser({
                 meta: file.size ? formatBytes(file.size) : void 0,
                 onOpen: onOpenFile ? () => onOpenFile(file) : void 0,
                 draggableId: canMove ? { kind: "file", id: file.id } : void 0,
-                actions: /* @__PURE__ */ jsxs90(Fragment28, { children: [
+                actions: /* @__PURE__ */ jsxs90(Fragment29, { children: [
                   canMove ? /* @__PURE__ */ jsx99(
                     FolderPickerMenu,
                     {
@@ -13844,7 +13961,7 @@ function FileBrowser({
         }
       ) })
     ] }),
-    /* @__PURE__ */ jsx99(Modal, { open: createOpen, title: "New folder", onClose: () => setCreateOpen(false), footer: /* @__PURE__ */ jsxs90(Fragment28, { children: [
+    /* @__PURE__ */ jsx99(Modal, { open: createOpen, title: "New folder", onClose: () => setCreateOpen(false), footer: /* @__PURE__ */ jsxs90(Fragment29, { children: [
       /* @__PURE__ */ jsx99(Button, { variant: "secondary", onClick: () => setCreateOpen(false), children: "Cancel" }),
       /* @__PURE__ */ jsx99(Button, { onClick: submitCreate, disabled: !createName.trim(), children: "Create" })
     ] }), children: /* @__PURE__ */ jsx99(
@@ -13861,7 +13978,7 @@ function FileBrowser({
         autoFocus: true
       }
     ) }),
-    /* @__PURE__ */ jsx99(Modal, { open: renameTarget != null, title: "Rename folder", onClose: () => setRenameTarget(null), footer: /* @__PURE__ */ jsxs90(Fragment28, { children: [
+    /* @__PURE__ */ jsx99(Modal, { open: renameTarget != null, title: "Rename folder", onClose: () => setRenameTarget(null), footer: /* @__PURE__ */ jsxs90(Fragment29, { children: [
       /* @__PURE__ */ jsx99(Button, { variant: "secondary", onClick: () => setRenameTarget(null), children: "Cancel" }),
       /* @__PURE__ */ jsx99(Button, { onClick: submitRename, disabled: !renameValue.trim(), children: "Save" })
     ] }), children: /* @__PURE__ */ jsx99(
@@ -13885,7 +14002,7 @@ function FileBrowser({
         title: deleteTarget ? "Delete \u201C" + deleteTarget.name + "\u201D?" : "Delete folder?",
         description: "This can't be undone. The folder must be empty.",
         onClose: () => setDeleteTarget(null),
-        footer: /* @__PURE__ */ jsxs90(Fragment28, { children: [
+        footer: /* @__PURE__ */ jsxs90(Fragment29, { children: [
           /* @__PURE__ */ jsx99(Button, { variant: "secondary", onClick: () => setDeleteTarget(null), children: "Cancel" }),
           /* @__PURE__ */ jsx99(Button, { variant: "danger", onClick: confirmDelete, children: "Delete" })
         ] })
@@ -14351,6 +14468,7 @@ export {
   CHANNEL_WEIGHTS,
   CHAT_UNAVAILABLE,
   COPIED_FEEDBACK_MS,
+  CORNER_STACK_INSET_PROPERTY,
   Calendar,
   Card,
   CardGrid,