@dybo-ai/design 1.2.0 → 2.0.0

package/dist/index.js

@@ -47,7 +47,7 @@ function Card({
       className: cx2("dybo-glass", className),
       style: {
         padding,
-        background: solid ? "var(--dybo-surface-card-solid)" : void 0,
+        background: solid ? "var(--card-bg-with-opacity)" : void 0,
         ...style
       },
       ...props
@@ -65,7 +65,7 @@ function Input({ label, error, className, id, ...props }) {
         style: {
           fontSize: "var(--dybo-font-size-sm)",
           fontWeight: "var(--dybo-font-weight-medium)",
-          color: "var(--dybo-color-text-muted)"
+          color: "hsl(var(--muted-foreground))"
         },
         children: label
       }
@@ -79,10 +79,6 @@ function Input({ label, error, className, id, ...props }) {
           error ? "dybo-input--error" : void 0,
           className
         ),
-        style: error ? {
-          borderColor: "var(--dybo-danger)",
-          boxShadow: "0 0 0 3px rgba(162,26,23,0.12)"
-        } : void 0,
         ...props
       }
     ),
@@ -91,7 +87,7 @@ function Input({ label, error, className, id, ...props }) {
       {
         style: {
           fontSize: "var(--dybo-font-size-xs)",
-          color: "var(--dybo-danger)",
+          color: "hsl(var(--destructive))",
           fontWeight: "var(--dybo-font-weight-medium)"
         },
         children: error
@@ -255,8 +251,8 @@ function Sidebar({
             lineHeight: 1.3
           },
           children: [
-            /* @__PURE__ */ jsx("b", { style: { color: "#fff", fontSize: "13px" }, children: user.name }),
-            user.email && /* @__PURE__ */ jsx("span", { style: { color: "#7f8592", fontSize: "11px" }, children: user.email })
+            /* @__PURE__ */ jsx("b", { style: { color: "hsl(var(--brand-white))", fontSize: "13px" }, children: user.name }),
+            user.email && /* @__PURE__ */ jsx("span", { style: { color: "hsl(var(--brand-white) / 0.6)", fontSize: "11px" }, children: user.email })
           ]
         }
       ),
@@ -268,8 +264,8 @@ function Sidebar({
           onClick: onLogout,
           style: {
             background: "transparent",
-            border: "1px solid rgba(255,255,255,0.18)",
-            color: "var(--dybo-sidebar-text)",
+            border: "1px solid hsl(var(--brand-white) / 0.18)",
+            color: "hsl(var(--brand-white) / 0.75)",
             padding: "6px 10px",
             fontSize: "12px",
             borderRadius: "8px",
@@ -322,62 +318,100 @@ function DataTable({
   rows,
   rowKey,
   onRowClick,
-  emptyMessage = "Nenhum resultado.",
-  className
+  emptyMessage = "No results.",
+  className,
+  toolbar,
+  sortColumn,
+  sortDirection,
+  onSort
 }) {
   function getRowKey(row, index) {
     if (!rowKey) return index;
     if (typeof rowKey === "function") return rowKey(row, index);
     return row[rowKey];
   }
-  return /* @__PURE__ */ jsx("div", { className: cx14("dybo-table-wrap", className), children: /* @__PURE__ */ jsxs("table", { className: "dybo-table", children: [
-    /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: columns.map((col) => /* @__PURE__ */ jsx(
-      "th",
-      {
-        className: cx14(
-          col.align === "left" ? "left" : void 0,
-          col.className
-        ),
-        children: col.label
-      },
-      col.key
-    )) }) }),
-    /* @__PURE__ */ jsx("tbody", { children: rows.length === 0 ? /* @__PURE__ */ jsx("tr", { children: /* @__PURE__ */ jsx(
-      "td",
-      {
-        colSpan: columns.length,
-        style: {
-          textAlign: "center",
-          padding: "32px",
-          color: "var(--dybo-color-text-muted)"
-        },
-        children: emptyMessage
-      }
-    ) }) : rows.map((row, index) => /* @__PURE__ */ jsx(
-      "tr",
-      {
-        className: cx14(
-          onRowClick ? "dybo-table__row--clickable" : void 0
-        ),
-        onClick: onRowClick ? () => onRowClick(row) : void 0,
-        children: columns.map((col) => {
-          const value = row[col.key];
-          return /* @__PURE__ */ jsx(
-            "td",
+  return /* @__PURE__ */ jsxs("div", { className: cx14("dybo-table-wrap", className), children: [
+    toolbar && /* @__PURE__ */ jsx("div", { className: "dybo-table__toolbar", children: toolbar }),
+    /* @__PURE__ */ jsxs("table", { className: "dybo-table", children: [
+      /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: columns.map((col) => /* @__PURE__ */ jsx(
+        "th",
+        {
+          className: cx14(
+            col.align === "left" ? "left" : void 0,
+            col.className
+          ),
+          children: col.sortable ? /* @__PURE__ */ jsxs(
+            "button",
             {
-              className: cx14(
-                col.align === "left" ? "left" : void 0,
-                col.className
-              ),
-              children: col.format ? col.format(value, row) : String(value ?? "")
-            },
-            col.key
-          );
-        })
-      },
-      getRowKey(row, index)
-    )) })
-  ] }) });
+              type: "button",
+              className: "dybo-table__sort-btn",
+              onClick: () => onSort?.(col.key),
+              children: [
+                col.label,
+                /* @__PURE__ */ jsxs(
+                  "svg",
+                  {
+                    width: "14",
+                    height: "14",
+                    viewBox: "0 0 24 24",
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeWidth: "2",
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round",
+                    style: {
+                      opacity: sortColumn === col.key ? 1 : 0.45,
+                      transform: sortColumn === col.key && sortDirection === "desc" ? "rotate(180deg)" : void 0
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx("path", { d: "M8 9l4 -4l4 4" }),
+                      /* @__PURE__ */ jsx("path", { d: "M16 15l-4 4l-4 -4" })
+                    ]
+                  }
+                )
+              ]
+            }
+          ) : col.label
+        },
+        col.key
+      )) }) }),
+      /* @__PURE__ */ jsx("tbody", { children: rows.length === 0 ? /* @__PURE__ */ jsx("tr", { children: /* @__PURE__ */ jsx(
+        "td",
+        {
+          colSpan: columns.length,
+          style: {
+            textAlign: "center",
+            padding: "32px",
+            color: "hsl(var(--muted-foreground))"
+          },
+          children: emptyMessage
+        }
+      ) }) : rows.map((row, index) => /* @__PURE__ */ jsx(
+        "tr",
+        {
+          className: cx14(
+            onRowClick ? "dybo-table__row--clickable" : void 0
+          ),
+          onClick: onRowClick ? () => onRowClick(row) : void 0,
+          children: columns.map((col) => {
+            const value = row[col.key];
+            return /* @__PURE__ */ jsx(
+              "td",
+              {
+                className: cx14(
+                  col.align === "left" ? "left" : void 0,
+                  col.className
+                ),
+                children: col.format ? col.format(value, row) : String(value ?? "")
+              },
+              col.key
+            );
+          })
+        },
+        getRowKey(row, index)
+      )) })
+    ] })
+  ] });
 }
 var cx15 = (...c) => c.filter(Boolean).join(" ");
 function Tabs({ tabs, active, onChange, className }) {
@@ -432,7 +466,7 @@ function Select({
         style: {
           fontSize: "var(--dybo-font-size-sm)",
           fontWeight: "var(--dybo-font-weight-medium)",
-          color: "var(--dybo-color-text-muted)"
+          color: "hsl(var(--muted-foreground))"
         },
         children: label
       }
@@ -441,11 +475,7 @@ function Select({
       "select",
       {
         id: selectId,
-        className: cx17("dybo-select", className),
-        style: error ? {
-          borderColor: "var(--dybo-danger)",
-          boxShadow: "0 0 0 3px rgba(162,26,23,0.12)"
-        } : void 0,
+        className: cx17("dybo-select", error ? "dybo-select--error" : void 0, className),
         ...props,
         children: [
           placeholder && /* @__PURE__ */ jsx("option", { value: "", disabled: true, children: placeholder }),
@@ -458,7 +488,7 @@ function Select({
       {
         style: {
           fontSize: "var(--dybo-font-size-xs)",
-          color: "var(--dybo-danger)",
+          color: "hsl(var(--destructive))",
           fontWeight: "var(--dybo-font-weight-medium)"
         },
         children: error
@@ -577,6 +607,82 @@ function Modal({
     document.body
   );
 }
+function Drawer({
+  open,
+  onClose,
+  title,
+  children,
+  footer,
+  side = "right",
+  width,
+  closeOnBackdrop = true,
+  hideHeader = false
+}) {
+  useEffect(() => {
+    if (!open) return;
+    function onKeyDown(e) {
+      if (e.key === "Escape") onClose();
+    }
+    document.addEventListener("keydown", onKeyDown);
+    return () => document.removeEventListener("keydown", onKeyDown);
+  }, [open, onClose]);
+  if (!open) return null;
+  const panelClass = side === "left" ? "dybo-drawer-panel dybo-drawer-panel--left" : "dybo-drawer-panel dybo-drawer-panel--right";
+  return createPortal(
+    /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "dybo-drawer-backdrop",
+          onClick: closeOnBackdrop ? onClose : void 0,
+          "aria-hidden": true
+        }
+      ),
+      /* @__PURE__ */ jsxs(
+        "aside",
+        {
+          className: panelClass,
+          style: width !== void 0 ? { width, maxWidth: "100%" } : void 0,
+          "aria-modal": "true",
+          role: "dialog",
+          onClick: (e) => e.stopPropagation(),
+          children: [
+            !hideHeader && /* @__PURE__ */ jsxs("div", { className: "dybo-drawer-panel__header", children: [
+              title ? /* @__PURE__ */ jsx("h2", { className: "dybo-drawer-panel__title", children: title }) : /* @__PURE__ */ jsx("span", {}),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  className: "dybo-drawer-panel__close",
+                  onClick: onClose,
+                  "aria-label": "Close",
+                  children: /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ jsx(
+                    "path",
+                    {
+                      d: "M2 2l12 12M14 2L2 14",
+                      stroke: "currentColor",
+                      strokeWidth: "2",
+                      strokeLinecap: "round"
+                    }
+                  ) })
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: hideHeader ? "dybo-drawer-panel__body dybo-drawer-panel__body--flush" : "dybo-drawer-panel__body",
+                children
+              }
+            ),
+            footer && /* @__PURE__ */ jsx("div", { className: "dybo-drawer-panel__footer", children: footer })
+          ]
+        }
+      )
+    ] }),
+    document.body
+  );
+}
 var cx19 = (...c) => c.filter(Boolean).join(" ");
 function LoginCard({
   logo,
@@ -600,7 +706,1215 @@ function LoginCard({
     children
   ] }) });
 }
+var cx20 = (...c) => c.filter(Boolean).join(" ");
+function OrgEntitySelector({
+  label,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      className: cx20("dybo-org-selector", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "dybo-org-selector__label", children: label }),
+        /* @__PURE__ */ jsx(
+          "svg",
+          {
+            className: "dybo-org-selector__chevron",
+            width: "20",
+            height: "20",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            children: /* @__PURE__ */ jsx("path", { d: "M6 9l6 6l6 -6" })
+          }
+        )
+      ]
+    }
+  );
+}
+var cx21 = (...c) => c.filter(Boolean).join(" ");
+function ThemeToggle({ theme, onChange, className }) {
+  return /* @__PURE__ */ jsxs("div", { className: cx21("dybo-theme-toggle", className), children: [
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        "aria-pressed": theme === "dark",
+        className: cx21(
+          "dybo-theme-toggle__btn",
+          theme === "dark" ? "dybo-theme-toggle__btn--active" : void 0
+        ),
+        onClick: () => onChange("dark"),
+        title: "Dark",
+        children: /* @__PURE__ */ jsx(
+          "svg",
+          {
+            width: "18",
+            height: "18",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            children: /* @__PURE__ */ jsx("path", { d: "M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z" })
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        "aria-pressed": theme === "light",
+        className: cx21(
+          "dybo-theme-toggle__btn",
+          theme === "light" ? "dybo-theme-toggle__btn--active" : void 0
+        ),
+        onClick: () => onChange("light"),
+        title: "Light",
+        children: /* @__PURE__ */ jsxs(
+          "svg",
+          {
+            width: "18",
+            height: "18",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            children: [
+              /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "4" }),
+              /* @__PURE__ */ jsx("path", { d: "M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4" })
+            ]
+          }
+        )
+      }
+    )
+  ] });
+}
+var cx22 = (...c) => c.filter(Boolean).join(" ");
+function Avatar({
+  initials,
+  size = "md",
+  shape = "square",
+  onClick,
+  className
+}) {
+  const classes = cx22(
+    "dybo-avatar",
+    size === "sm" ? "dybo-avatar--sm" : "dybo-avatar--md",
+    size === "md" ? shape === "circle" ? "dybo-avatar--circle" : "dybo-avatar--square" : void 0,
+    className
+  );
+  if (onClick) {
+    return /* @__PURE__ */ jsx("button", { type: "button", className: classes, onClick, children: /* @__PURE__ */ jsx("span", { children: initials }) });
+  }
+  return /* @__PURE__ */ jsx("div", { className: classes, children: /* @__PURE__ */ jsx("span", { children: initials }) });
+}
+var cx23 = (...c) => c.filter(Boolean).join(" ");
+function NotificationsButton({
+  unread = false,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      className: cx23("dybo-notifications-btn", className),
+      title: "Notifications",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs(
+          "svg",
+          {
+            width: "20",
+            height: "20",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            children: [
+              /* @__PURE__ */ jsx("path", { d: "M10 5a2 2 0 1 1 4 0a7 7 0 0 1 4 6v3a4 4 0 0 0 2 3h-16a4 4 0 0 0 2 -3v-3a7 7 0 0 1 4 -6" }),
+              /* @__PURE__ */ jsx("path", { d: "M9 17v1a3 3 0 0 0 6 0v-1" })
+            ]
+          }
+        ),
+        unread && /* @__PURE__ */ jsx("span", { className: "dybo-notifications-btn__dot" })
+      ]
+    }
+  );
+}
+var cx24 = (...c) => c.filter(Boolean).join(" ");
+function PlatformSwitcher({ apps, open, onToggle, className }) {
+  return /* @__PURE__ */ jsxs("div", { style: { position: "relative" }, children: [
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "dybo-btn dybo-btn--ghost",
+        style: { padding: 10 },
+        onClick: onToggle,
+        "aria-expanded": open,
+        title: "Switch app",
+        children: /* @__PURE__ */ jsxs(
+          "svg",
+          {
+            width: "20",
+            height: "20",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            children: [
+              /* @__PURE__ */ jsx("rect", { x: "4", y: "4", width: "6", height: "6", rx: "1" }),
+              /* @__PURE__ */ jsx("rect", { x: "14", y: "4", width: "6", height: "6", rx: "1" }),
+              /* @__PURE__ */ jsx("rect", { x: "4", y: "14", width: "6", height: "6", rx: "1" }),
+              /* @__PURE__ */ jsx("rect", { x: "14", y: "14", width: "6", height: "6", rx: "1" })
+            ]
+          }
+        )
+      }
+    ),
+    open && /* @__PURE__ */ jsx("div", { className: cx24("dybo-platform-switcher", className), children: /* @__PURE__ */ jsx("div", { className: "dybo-platform-switcher__grid", children: apps.map((app) => /* @__PURE__ */ jsxs("a", { href: app.href, className: "dybo-platform-switcher__card", children: [
+      /* @__PURE__ */ jsx("span", { className: "dybo-platform-switcher__icon", children: app.icon }),
+      /* @__PURE__ */ jsxs("span", { style: { display: "flex", flexDirection: "column", gap: 2 }, children: [
+        /* @__PURE__ */ jsx("span", { className: "dybo-platform-switcher__title", children: app.title }),
+        /* @__PURE__ */ jsx("span", { className: "dybo-platform-switcher__desc", children: app.description })
+      ] })
+    ] }, app.title)) }) })
+  ] });
+}
+var cx25 = (...c) => c.filter(Boolean).join(" ");
+function UnderlineTabs({ tabs, active, onChange, className }) {
+  return /* @__PURE__ */ jsx("div", { className: cx25("dybo-underline-tabs", className), role: "tablist", children: tabs.map((tab) => /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      role: "tab",
+      "aria-selected": tab.key === active,
+      disabled: tab.disabled,
+      className: "dybo-underline-tabs__tab",
+      onClick: () => !tab.disabled && onChange(tab.key),
+      children: tab.label
+    },
+    tab.key
+  )) });
+}
+var cx26 = (...c) => c.filter(Boolean).join(" ");
+function FilterPills({ options, active, onChange, className }) {
+  return /* @__PURE__ */ jsx("div", { className: cx26("dybo-filter-pills", className), role: "tablist", children: options.map((opt) => /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      role: "tab",
+      "aria-selected": opt.value === active,
+      className: cx26(
+        "dybo-filter-pill",
+        opt.value === active ? "dybo-filter-pill--active" : void 0
+      ),
+      onClick: () => onChange(opt.value),
+      children: opt.label
+    },
+    opt.value
+  )) });
+}
+var cx27 = (...c) => c.filter(Boolean).join(" ");
+function Pagination({
+  page,
+  pageCount,
+  pageSize,
+  total,
+  pageSizeOptions = [5, 10, 25, 50, 100],
+  onPageChange,
+  onPageSizeChange,
+  className
+}) {
+  const start = total === 0 ? 0 : (page - 1) * pageSize + 1;
+  const end = Math.min(page * pageSize, total);
+  return /* @__PURE__ */ jsxs("div", { className: cx27("dybo-pagination", className), children: [
+    /* @__PURE__ */ jsxs("p", { className: "dybo-pagination__summary", children: [
+      start,
+      "\u2013",
+      end,
+      " of ",
+      total
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "dybo-pagination__controls", children: [
+      onPageSizeChange && /* @__PURE__ */ jsxs("label", { className: "dybo-pagination__size", children: [
+        /* @__PURE__ */ jsx("span", { children: "Rows per page" }),
+        /* @__PURE__ */ jsx(
+          "select",
+          {
+            className: "dybo-select",
+            value: pageSize,
+            onChange: (e) => onPageSizeChange(Number(e.target.value)),
+            children: pageSizeOptions.map((n) => /* @__PURE__ */ jsx("option", { value: n, children: n }, n))
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("nav", { className: "dybo-pagination__nav", "aria-label": "Pagination", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "dybo-pagination__btn",
+            disabled: page <= 1,
+            onClick: () => onPageChange(page - 1),
+            "aria-label": "Previous page",
+            children: /* @__PURE__ */ jsx(
+              "svg",
+              {
+                width: "16",
+                height: "16",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                children: /* @__PURE__ */ jsx("path", { d: "M15 6l-6 6l6 6" })
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "aria-current": "page",
+            className: "dybo-pagination__btn dybo-pagination__btn--active",
+            children: page
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "dybo-pagination__btn",
+            disabled: page >= pageCount,
+            onClick: () => onPageChange(page + 1),
+            "aria-label": "Next page",
+            children: /* @__PURE__ */ jsx(
+              "svg",
+              {
+                width: "16",
+                height: "16",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                children: /* @__PURE__ */ jsx("path", { d: "M9 6l6 6l-6 6" })
+              }
+            )
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+var cx28 = (...c) => c.filter(Boolean).join(" ");
+function EmptyState({
+  variant = "simple",
+  icon,
+  title,
+  description,
+  className
+}) {
+  if (variant === "table-row") {
+    return /* @__PURE__ */ jsx("p", { className: cx28("dybo-empty-row", className), children: title ?? "No results." });
+  }
+  if (variant === "rich") {
+    return /* @__PURE__ */ jsx("div", { className: cx28("dybo-empty--rich", className), children: /* @__PURE__ */ jsxs("div", { className: "dybo-empty__inner", children: [
+      icon && /* @__PURE__ */ jsx("div", { className: "dybo-empty__icon", children: icon }),
+      /* @__PURE__ */ jsx("p", { className: "dybo-empty__title", children: title ?? "No data to display" }),
+      description && /* @__PURE__ */ jsx("p", { className: "dybo-empty__desc", children: description })
+    ] }) });
+  }
+  return /* @__PURE__ */ jsx("div", { className: cx28("dybo-empty", className), children: /* @__PURE__ */ jsx("p", { className: "dybo-empty__text", children: title ?? "Available Soon" }) });
+}
+var cx29 = (...c) => c.filter(Boolean).join(" ");
+function KpiCard({
+  label,
+  value,
+  icon,
+  variant = "ghost",
+  className
+}) {
+  if (variant === "tile") {
+    return /* @__PURE__ */ jsxs("div", { className: cx29("dybo-kpi-tile", className), children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("span", { className: "dybo-kpi-tile__label", children: label }),
+        /* @__PURE__ */ jsx("div", { className: "dybo-kpi-tile__value", children: value })
+      ] }),
+      icon && /* @__PURE__ */ jsx("span", { className: "dybo-kpi-tile__icon", children: icon })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: cx29("dybo-kpi", className), children: [
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("p", { className: "dybo-kpi__label", children: label }),
+      /* @__PURE__ */ jsx("p", { className: "dybo-kpi__value", children: value })
+    ] }),
+    icon && /* @__PURE__ */ jsx("span", { className: "dybo-kpi__icon", children: icon })
+  ] });
+}
+var cx30 = (...c) => c.filter(Boolean).join(" ");
+function KpiGrid({ cells, className }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cx30("dybo-kpi-grid", className),
+      style: { gridTemplateColumns: `repeat(${cells.length || 1}, minmax(0, 1fr))` },
+      children: cells.map((cell, i) => /* @__PURE__ */ jsxs("div", { className: "dybo-kpi-grid__cell", children: [
+        /* @__PURE__ */ jsx("div", { className: "dybo-kpi-grid__label", children: cell.label }),
+        /* @__PURE__ */ jsx("div", { className: "dybo-kpi-grid__value", children: cell.value }),
+        cell.sublabel && /* @__PURE__ */ jsx("div", { className: "dybo-kpi-grid__sublabel", children: cell.sublabel })
+      ] }, i))
+    }
+  );
+}
+var cx31 = (...c) => c.filter(Boolean).join(" ");
+function KpiStrip({ items, className }) {
+  return /* @__PURE__ */ jsx("div", { className: cx31("dybo-kpi-strip", className), children: items.map((item, i) => /* @__PURE__ */ jsxs("div", { className: "dybo-kpi-strip__item", children: [
+    /* @__PURE__ */ jsx("span", { className: "dybo-kpi-strip__icon", children: item.icon }),
+    /* @__PURE__ */ jsxs("div", { className: "dybo-kpi-strip__row", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("span", { className: "dybo-kpi-strip__label", children: item.label }),
+        item.delta && /* @__PURE__ */ jsx("span", { className: "dybo-kpi-strip__delta", children: item.delta })
+      ] }),
+      /* @__PURE__ */ jsx("span", { className: "dybo-kpi-strip__value", children: item.value })
+    ] })
+  ] }, i)) });
+}
+var cx32 = (...c) => c.filter(Boolean).join(" ");
+function ViewToggle({ value, options, onChange, className }) {
+  return /* @__PURE__ */ jsx("div", { className: cx32("dybo-view-toggle", className), children: options.map((opt) => /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      title: opt.label,
+      "aria-pressed": opt.value === value,
+      className: cx32(
+        "dybo-view-toggle__btn",
+        opt.value === value ? "dybo-view-toggle__btn--active" : void 0
+      ),
+      onClick: () => onChange(opt.value),
+      children: opt.icon
+    },
+    opt.value
+  )) });
+}
+var cx33 = (...c) => c.filter(Boolean).join(" ");
+function MetadataBadge({ label, value, className }) {
+  return /* @__PURE__ */ jsx("div", { className: cx33("dybo-metadata-badge", className), children: /* @__PURE__ */ jsxs("p", { children: [
+    label,
+    ": ",
+    /* @__PURE__ */ jsx("b", { children: value })
+  ] }) });
+}
+var cx34 = (...c) => c.filter(Boolean).join(" ");
+function Toast({ open, message, icon, className }) {
+  if (!open) return null;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      style: {
+        position: "fixed",
+        left: "50%",
+        bottom: 24,
+        transform: "translateX(-50%)",
+        zIndex: 80,
+        width: "100%",
+        maxWidth: 480,
+        padding: "0 16px"
+      },
+      children: /* @__PURE__ */ jsxs("div", { className: cx34("dybo-toast", className), children: [
+        icon && /* @__PURE__ */ jsx("span", { className: "dybo-toast__icon", children: icon }),
+        /* @__PURE__ */ jsx("span", { className: "dybo-toast__text", children: message })
+      ] })
+    }
+  );
+}
+var cx35 = (...c) => c.filter(Boolean).join(" ");
+function WarningIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: /* @__PURE__ */ jsx("path", { d: "M12 9v4M12 17h.01M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" })
+    }
+  );
+}
+function Banner({ variant, title, description, items, className }) {
+  const modifier = variant === "warning" ? "dybo-banner--warning" : "dybo-banner--error";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cx35("dybo-banner", modifier, className),
+      role: variant === "blocking-error" ? "alert" : void 0,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "dybo-banner__icon", children: /* @__PURE__ */ jsx(WarningIcon, {}) }),
+        /* @__PURE__ */ jsxs("div", { className: "dybo-banner__body", children: [
+          /* @__PURE__ */ jsx("span", { className: "dybo-banner__title", children: title }),
+          description && /* @__PURE__ */ jsx("span", { className: "dybo-banner__desc", children: description }),
+          items && items.length > 0 && /* @__PURE__ */ jsx("ul", { className: "dybo-banner__list", children: items.map((item, i) => /* @__PURE__ */ jsx("li", { children: item }, i)) })
+        ] })
+      ]
+    }
+  );
+}
+var cx36 = (...c) => c.filter(Boolean).join(" ");
+function Accordion({
+  question,
+  children,
+  defaultOpen = false,
+  variant = "plain",
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "details",
+    {
+      className: cx36("dybo-accordion", `dybo-accordion--${variant}`, className),
+      open: defaultOpen,
+      children: [
+        /* @__PURE__ */ jsxs("summary", { children: [
+          /* @__PURE__ */ jsx("span", { className: "dybo-accordion__q", children: question }),
+          /* @__PURE__ */ jsx(
+            "svg",
+            {
+              className: "dybo-accordion__chevron",
+              width: "20",
+              height: "20",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              children: /* @__PURE__ */ jsx("path", { d: "M6 9l6 6l6-6" })
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "dybo-accordion__body", children })
+      ]
+    }
+  );
+}
+var cx37 = (...c) => c.filter(Boolean).join(" ");
+function ReadOnlyField({ label, value, className }) {
+  return /* @__PURE__ */ jsxs("div", { className: cx37("dybo-readonly-field", className), children: [
+    /* @__PURE__ */ jsx("p", { className: "dybo-readonly-field__label", children: label }),
+    /* @__PURE__ */ jsx("p", { className: "dybo-readonly-field__value", children: value })
+  ] });
+}
+var cx38 = (...c) => c.filter(Boolean).join(" ");
+function SearchField({
+  iconPosition = "left",
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: cx38("dybo-search", `dybo-search--icon-${iconPosition}`, className), children: [
+    /* @__PURE__ */ jsx("span", { className: "dybo-search__icon", children: /* @__PURE__ */ jsxs(
+      "svg",
+      {
+        width: "16",
+        height: "16",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        children: [
+          /* @__PURE__ */ jsx("circle", { cx: "10", cy: "10", r: "7" }),
+          /* @__PURE__ */ jsx("path", { d: "M21 21l-6 -6" })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsx("input", { type: "search", className: "dybo-search__input", ...props })
+  ] });
+}
+var cx39 = (...c) => c.filter(Boolean).join(" ");
+function DateRangeTrigger({
+  label,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      className: cx39("dybo-date-trigger", className),
+      "aria-haspopup": "dialog",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs(
+          "svg",
+          {
+            width: "18",
+            height: "18",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            children: [
+              /* @__PURE__ */ jsx("rect", { x: "4", y: "5", width: "16", height: "16", rx: "2" }),
+              /* @__PURE__ */ jsx("path", { d: "M16 3v4M8 3v4M4 11h16" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { children: label })
+      ]
+    }
+  );
+}
+var cx40 = (...c) => c.filter(Boolean).join(" ");
+function UploadDropzone({
+  label = "Upload Files",
+  error = false,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      className: cx40(
+        "dybo-dropzone",
+        error ? "dybo-dropzone--error" : void 0,
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "dybo-dropzone__icon", children: /* @__PURE__ */ jsxs(
+          "svg",
+          {
+            width: "20",
+            height: "20",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            children: [
+              /* @__PURE__ */ jsx("path", { d: "M7 18a4.6 4.4 0 0 1 0 -9a5 4.5 0 0 1 11 2h1a3.5 3.5 0 0 1 0 7h-1" }),
+              /* @__PURE__ */ jsx("path", { d: "M9 15l3 -3l3 3M12 12l0 9" })
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ jsx("span", { className: "dybo-dropzone__label", children: label })
+      ]
+    }
+  );
+}
+var cx41 = (...c) => c.filter(Boolean).join(" ");
+function StatusIcon({ status }) {
+  if (status === "filled") {
+    return /* @__PURE__ */ jsx("span", { className: "dybo-step-nav__status dybo-step-nav__status--filled", children: /* @__PURE__ */ jsx(
+      "svg",
+      {
+        width: "14",
+        height: "14",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        children: /* @__PURE__ */ jsx("path", { d: "M5 12l5 5l10 -10" })
+      }
+    ) });
+  }
+  if (status === "extracting") {
+    return /* @__PURE__ */ jsx(
+      "span",
+      {
+        className: "dybo-step-nav__status dybo-step-nav__status--extracting",
+        title: "AI Extracting",
+        children: /* @__PURE__ */ jsx(
+          "svg",
+          {
+            width: "14",
+            height: "14",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            children: /* @__PURE__ */ jsx("path", { d: "M12 3l1.9 4.6l4.6 1.9l-4.6 1.9l-1.9 4.6l-1.9 -4.6l-4.6 -1.9l4.6 -1.9z" })
+          }
+        )
+      }
+    );
+  }
+  if (status === "partial") {
+    return /* @__PURE__ */ jsx(
+      "span",
+      {
+        className: "dybo-step-nav__status dybo-step-nav__status--partial",
+        title: "Partially Filled"
+      }
+    );
+  }
+  return null;
+}
+function StepNavigator({
+  title,
+  steps,
+  activeKey,
+  onStepClick,
+  progressPercent,
+  progressLabel,
+  onSaveExit,
+  onContinue,
+  continueLabel = "Create",
+  className
+}) {
+  const filledCount = steps.filter((s) => s.status === "filled").length;
+  return /* @__PURE__ */ jsxs("div", { className: cx41("dybo-step-nav", className), children: [
+    /* @__PURE__ */ jsx("h3", { className: "dybo-step-nav__title", children: title }),
+    /* @__PURE__ */ jsx("nav", { className: "dybo-step-nav__list", children: steps.map((step) => /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: cx41(
+          "dybo-step-nav__item",
+          step.key === activeKey ? "dybo-step-nav__item--active" : void 0
+        ),
+        onClick: () => onStepClick?.(step.key),
+        children: [
+          step.icon && /* @__PURE__ */ jsx("span", { className: "dybo-step-nav__item-icon", children: step.icon }),
+          /* @__PURE__ */ jsxs("span", { className: "dybo-step-nav__item-text", children: [
+            /* @__PURE__ */ jsx("span", { className: "dybo-step-nav__item-label", children: step.label }),
+            step.sublabel && /* @__PURE__ */ jsx("span", { className: "dybo-step-nav__item-sub", children: step.sublabel })
+          ] }),
+          step.status && step.status !== "empty" && /* @__PURE__ */ jsx(StatusIcon, { status: step.status })
+        ]
+      },
+      step.key
+    )) }),
+    /* @__PURE__ */ jsxs("div", { className: "dybo-step-nav__progress", children: [
+      /* @__PURE__ */ jsxs("div", { className: "dybo-step-nav__progress-row", children: [
+        /* @__PURE__ */ jsx("span", { style: { opacity: 0.64, fontWeight: 500 }, children: "Overall Progress" }),
+        /* @__PURE__ */ jsxs("span", { style: { fontWeight: 700 }, children: [
+          progressPercent,
+          "%"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "dybo-step-nav__progress-track", children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "dybo-step-nav__progress-fill",
+          style: { width: `${progressPercent}%` }
+        }
+      ) }),
+      /* @__PURE__ */ jsx("p", { className: "dybo-step-nav__progress-note", children: progressLabel ?? `${filledCount} of ${steps.length} sections filled` })
+    ] }),
+    (onSaveExit || onContinue) && /* @__PURE__ */ jsxs("div", { className: "dybo-step-nav__actions", children: [
+      onSaveExit && /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "dybo-btn dybo-btn--secondary",
+          onClick: onSaveExit,
+          children: "Save & Exit"
+        }
+      ),
+      onContinue && /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "dybo-btn dybo-btn--primary",
+          onClick: onContinue,
+          children: continueLabel
+        }
+      )
+    ] })
+  ] });
+}
+var cx42 = (...c) => c.filter(Boolean).join(" ");
+function DocumentTypeGrid({ options, value, onChange, className }) {
+  return /* @__PURE__ */ jsx("div", { className: cx42("dybo-doc-type-grid", className), children: options.map((opt) => /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      disabled: opt.disabled,
+      className: cx42(
+        "dybo-doc-type-card",
+        opt.disabled ? "dybo-doc-type-card--disabled" : void 0
+      ),
+      onClick: () => onChange(opt.key),
+      "aria-pressed": opt.key === value,
+      children: [
+        opt.icon,
+        /* @__PURE__ */ jsx("span", { className: "dybo-doc-type-card__label", children: opt.label }),
+        opt.disabled && /* @__PURE__ */ jsx(
+          "span",
+          {
+            style: {
+              position: "absolute",
+              top: 8,
+              right: 8,
+              padding: "2px 6px",
+              borderRadius: 999,
+              background: "hsl(var(--warning-background))",
+              color: "hsl(var(--warning))",
+              fontSize: 10,
+              fontWeight: 500
+            },
+            children: "Available Soon"
+          }
+        )
+      ]
+    },
+    opt.key
+  )) });
+}
+var cx43 = (...c) => c.filter(Boolean).join(" ");
+function FilePreviewCard({
+  fileName,
+  uploadedBy,
+  uploadedAt,
+  imageSrc,
+  onPrev,
+  onNext,
+  hasPrev = false,
+  hasNext = false,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cx43(className),
+      style: { display: "flex", flexDirection: "column", gap: 8 },
+      children: [
+        (onPrev || onNext) && /* @__PURE__ */ jsxs("div", { className: "dybo-file-preview-pager", role: "group", "aria-label": "Recently added", children: [
+          /* @__PURE__ */ jsx("button", { type: "button", disabled: !hasPrev, onClick: onPrev, "aria-label": "Previous file", children: /* @__PURE__ */ jsx(
+            "svg",
+            {
+              width: "16",
+              height: "16",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              children: /* @__PURE__ */ jsx("path", { d: "M15 6l-6 6l6 6" })
+            }
+          ) }),
+          /* @__PURE__ */ jsx("div", { style: { height: 16, width: 1, background: "hsl(var(--border) / 0.7)" } }),
+          /* @__PURE__ */ jsx("button", { type: "button", disabled: !hasNext, onClick: onNext, "aria-label": "Next file", children: /* @__PURE__ */ jsx(
+            "svg",
+            {
+              width: "16",
+              height: "16",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              children: /* @__PURE__ */ jsx("path", { d: "M9 6l6 6l-6 6" })
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "dybo-file-preview", children: [
+          /* @__PURE__ */ jsx("p", { className: "dybo-file-preview__name", title: fileName, children: fileName }),
+          /* @__PURE__ */ jsxs("div", { className: "dybo-file-preview__meta", children: [
+            /* @__PURE__ */ jsxs("p", { children: [
+              "Uploaded by: ",
+              uploadedBy
+            ] }),
+            /* @__PURE__ */ jsx("p", { children: uploadedAt })
+          ] }),
+          imageSrc && /* @__PURE__ */ jsx("div", { className: "dybo-file-preview__image", children: /* @__PURE__ */ jsx("img", { alt: "", src: imageSrc }) })
+        ] })
+      ]
+    }
+  );
+}
+var cx44 = (...c) => c.filter(Boolean).join(" ");
+function FileReviewRow({
+  fileName,
+  fileSize,
+  fileType,
+  classification,
+  location,
+  status,
+  onView,
+  onChangeLocation,
+  onApprove,
+  onReject,
+  className
+}) {
+  return /* @__PURE__ */ jsx("div", { className: cx44("dybo-file-review", className), children: /* @__PURE__ */ jsxs("div", { className: "dybo-file-review__main", children: [
+    /* @__PURE__ */ jsx("span", { className: "dybo-file-review__icon", children: /* @__PURE__ */ jsxs(
+      "svg",
+      {
+        width: "16",
+        height: "16",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        children: [
+          /* @__PURE__ */ jsx("path", { d: "M14 3v4a1 1 0 0 0 1 1h4" }),
+          /* @__PURE__ */ jsx("path", { d: "M17 21H7a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h7l5 5v11a2 2 0 0 1-2 2" })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 150 }, children: [
+      /* @__PURE__ */ jsxs("div", { className: "dybo-file-review__name-row", children: [
+        /* @__PURE__ */ jsx("span", { className: "dybo-file-review__name", children: fileName }),
+        /* @__PURE__ */ jsxs("span", { className: "dybo-file-review__size", children: [
+          fileSize,
+          " \xB7 ",
+          fileType
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "dybo-file-review__sub", children: [
+        "Classified as ",
+        classification,
+        " \xB7 Location: ",
+        location
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "dybo-file-review__actions", children: [
+      status,
+      onView && /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          title: "View file",
+          className: "dybo-file-review__ic",
+          onClick: onView,
+          children: /* @__PURE__ */ jsxs(
+            "svg",
+            {
+              width: "16",
+              height: "16",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              children: [
+                /* @__PURE__ */ jsx("path", { d: "M10 12a2 2 0 1 0 4 0a2 2 0 1 0-4 0" }),
+                /* @__PURE__ */ jsx("path", { d: "M21 12c-2.4 4-5.4 6-9 6s-6.6-2-9-6c2.4-4 5.4-6 9-6s6.6 2 9 6" })
+              ]
+            }
+          )
+        }
+      ),
+      onChangeLocation && /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          title: "Change location",
+          className: "dybo-file-review__ic",
+          onClick: onChangeLocation,
+          children: /* @__PURE__ */ jsx(
+            "svg",
+            {
+              width: "16",
+              height: "16",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              children: /* @__PURE__ */ jsx("path", { d: "M5 4h4l3 3h7a1 1 0 0 1 1 1v9a1 1 0 0 1-1 1h-14a1 1 0 0 1-1-1v-12a1 1 0 0 1 1-1" })
+            }
+          )
+        }
+      ),
+      onApprove && /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          title: "Approve",
+          className: "dybo-file-review__ic dybo-file-review__ic--approve",
+          onClick: onApprove,
+          children: /* @__PURE__ */ jsx(
+            "svg",
+            {
+              width: "16",
+              height: "16",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              children: /* @__PURE__ */ jsx("path", { d: "M5 12l5 5l10 -10" })
+            }
+          )
+        }
+      ),
+      onReject && /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          title: "Reject",
+          className: "dybo-file-review__ic dybo-file-review__ic--reject",
+          onClick: onReject,
+          children: /* @__PURE__ */ jsxs(
+            "svg",
+            {
+              width: "16",
+              height: "16",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              children: [
+                /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "9" }),
+                /* @__PURE__ */ jsx("path", { d: "M8.5 8.5l7 7" })
+              ]
+            }
+          )
+        }
+      )
+    ] })
+  ] }) });
+}
+var cx45 = (...c) => c.filter(Boolean).join(" ");
+function RejectionReasonPanel({
+  reasons,
+  selectedReasons,
+  onToggleReason,
+  note,
+  onNoteChange,
+  onCancel,
+  onConfirm,
+  className
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: cx45("dybo-reject-panel", className), children: [
+    /* @__PURE__ */ jsx("span", { className: "dybo-reject-panel__label", children: "Why is this file being rejected?" }),
+    /* @__PURE__ */ jsx("div", { className: "dybo-reason-chips", children: reasons.map((reason) => /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: cx45(
+          "dybo-reason-chip",
+          selectedReasons.includes(reason.key) ? "dybo-reason-chip--on" : void 0
+        ),
+        onClick: () => onToggleReason(reason.key),
+        children: reason.label
+      },
+      reason.key
+    )) }),
+    /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        rows: 2,
+        placeholder: "Add a note (optional)",
+        className: "dybo-reject-panel__note",
+        value: note,
+        onChange: (e) => onNoteChange(e.target.value)
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "dybo-reject-panel__footer", children: [
+      /* @__PURE__ */ jsxs("span", { className: "dybo-reject-panel__notice", children: [
+        /* @__PURE__ */ jsxs(
+          "svg",
+          {
+            width: "14",
+            height: "14",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            children: [
+              /* @__PURE__ */ jsx("path", { d: "M10 5a2 2 0 1 1 4 0a7 7 0 0 1 4 6v3a4 4 0 0 0 2 3h-16a4 4 0 0 0 2 -3v-3a7 7 0 0 1 4 -6" }),
+              /* @__PURE__ */ jsx("path", { d: "M9 17v1a3 3 0 0 0 6 0v-1" })
+            ]
+          }
+        ),
+        "The recipient will be notified with this reason."
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "dybo-reject-panel__actions", children: [
+        /* @__PURE__ */ jsx("button", { type: "button", className: "dybo-reject-btn", onClick: onCancel, children: "Cancel" }),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "dybo-reject-btn dybo-reject-btn--solid",
+            onClick: onConfirm,
+            children: "Reject & send"
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+var cx46 = (...c) => c.filter(Boolean).join(" ");
+var defaultLabels2 = {
+  processing: "Processing",
+  pending: "Pending",
+  editing: "Editing",
+  failed: "Failed"
+};
+function QueueStatusBadge({
+  status,
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cx46("dybo-queue-status", `dybo-queue-status--${status}`, className),
+      ...props,
+      children: children ?? defaultLabels2[status]
+    }
+  );
+}
+var cx47 = (...c) => c.filter(Boolean).join(" ");
+function TicketCard({
+  id,
+  signals,
+  priority,
+  status,
+  fields,
+  selected = false,
+  closed = false,
+  href,
+  onClick,
+  className
+}) {
+  const classes = cx47(
+    "dybo-ticket-card",
+    selected ? "dybo-ticket-card--selected" : void 0,
+    closed ? "dybo-ticket-card--closed" : void 0,
+    className
+  );
+  const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "dybo-ticket-card__top", children: [
+      /* @__PURE__ */ jsxs("span", { className: "dybo-ticket-card__id", children: [
+        "#",
+        id
+      ] }),
+      /* @__PURE__ */ jsx("span", { style: { marginLeft: "auto" } }),
+      signals,
+      priority,
+      status
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "dybo-ticket-card__fields", children: fields.map((field) => /* @__PURE__ */ jsxs("div", { className: "dybo-ticket-card__field", children: [
+      /* @__PURE__ */ jsx("span", { className: "dybo-ticket-card__field-label", children: field.label }),
+      /* @__PURE__ */ jsx("span", { className: "dybo-ticket-card__field-value", children: field.value })
+    ] }, field.label)) })
+  ] });
+  if (href) {
+    return /* @__PURE__ */ jsx("a", { href, className: classes, onClick, children: content });
+  }
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      className: classes,
+      onClick,
+      style: { textAlign: "left", width: "100%" },
+      children: content
+    }
+  );
+}
+var cx48 = (...c) => c.filter(Boolean).join(" ");
+function ChatMessage({ author, initials, timestamp, body, mine }) {
+  return /* @__PURE__ */ jsxs("div", { className: cx48("dybo-chat-message", mine ? "dybo-chat-message--mine" : void 0), children: [
+    /* @__PURE__ */ jsx("div", { className: "dybo-chat-message__avatar", children: initials }),
+    /* @__PURE__ */ jsxs("div", { className: "dybo-chat-message__body", children: [
+      /* @__PURE__ */ jsx("div", { className: "dybo-chat-message__meta", children: mine ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("span", { className: "dybo-chat-message__time", children: timestamp }),
+        /* @__PURE__ */ jsx("span", { className: "dybo-chat-message__author", children: author })
+      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("span", { className: "dybo-chat-message__author", children: author }),
+        /* @__PURE__ */ jsx("span", { className: "dybo-chat-message__time", children: timestamp })
+      ] }) }),
+      /* @__PURE__ */ jsx("div", { className: "dybo-chat-message__bubble", children: body })
+    ] })
+  ] });
+}
+function ChatThread({ messages, className }) {
+  return /* @__PURE__ */ jsx("div", { className: cx48(className), style: { display: "flex", flexDirection: "column", gap: 16 }, children: messages.map((message) => /* @__PURE__ */ jsx(ChatMessage, { ...message }, message.id)) });
+}
+var cx49 = (...c) => c.filter(Boolean).join(" ");
+function InternalNoteCard({
+  author,
+  timestamp,
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: cx49("dybo-internal-note", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "dybo-internal-note__head", children: [
+      /* @__PURE__ */ jsx("span", { className: "dybo-internal-note__author", children: author }),
+      /* @__PURE__ */ jsx("span", { className: "dybo-internal-note__time", children: timestamp })
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: "dybo-internal-note__body", children })
+  ] });
+}
+var cx50 = (...c) => c.filter(Boolean).join(" ");
+function ChannelBadge({ icon, label, className }) {
+  return /* @__PURE__ */ jsxs("span", { className: cx50("dybo-channel-badge", className), children: [
+    icon,
+    label
+  ] });
+}
+var cx51 = (...c) => c.filter(Boolean).join(" ");
+function SignalBadge({ variant, children, className }) {
+  return /* @__PURE__ */ jsx("span", { className: cx51(`dybo-signal--${variant}`, className), children });
+}
+var cx52 = (...c) => c.filter(Boolean).join(" ");
+function CategoryLabel({ label, color, className }) {
+  const style = color ? { "--lbl-c": color } : void 0;
+  return /* @__PURE__ */ jsx("span", { className: cx52("dybo-label", className), style, children: label });
+}
+var cx53 = (...c) => c.filter(Boolean).join(" ");
+function LinkedAppIndicator({ icon, appName, className }) {
+  if (!appName) {
+    return /* @__PURE__ */ jsx("span", { className: cx53("dybo-linked-app--empty", className), children: "\u2013" });
+  }
+  return /* @__PURE__ */ jsxs("span", { className: cx53("dybo-linked-app", className), children: [
+    icon,
+    appName
+  ] });
+}
 
-export { Alert, AppShell, Badge, Button, Card, DataTable, IconRail, IconRailItem, Input, LoginCard, Modal, NavItem, NavSection, NavTabs, OverviewField, OverviewGrid, PriorityBadge, ScopeTabs, Select, Sidebar, Tabs, TicketStatusBadge, TopBar };
+export { Accordion, Alert, AppShell, Avatar, Badge, Banner, Button, Card, CategoryLabel, ChannelBadge, ChatMessage, ChatThread, DataTable, DateRangeTrigger, DocumentTypeGrid, Drawer, EmptyState, FilePreviewCard, FileReviewRow, FilterPills, IconRail, IconRailItem, Input, InternalNoteCard, KpiCard, KpiGrid, KpiStrip, LinkedAppIndicator, LoginCard, MetadataBadge, Modal, NavItem, NavSection, NavTabs, NotificationsButton, OrgEntitySelector, OverviewField, OverviewGrid, Pagination, PlatformSwitcher, PriorityBadge, QueueStatusBadge, ReadOnlyField, RejectionReasonPanel, ScopeTabs, SearchField, Select, Sidebar, SignalBadge, StepNavigator, Tabs, ThemeToggle, TicketCard, TicketStatusBadge, Toast, TopBar, UnderlineTabs, UploadDropzone, ViewToggle };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map