@inshorts/glint-ui 0.5.4 → 0.6.0

package/dist/chunk-ZFSQVMLJ.js

@@ -0,0 +1,126 @@
+import {
+  cn
+} from "./chunk-HCA5ODCD.js";
+
+// src/tabs.tsx
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function TabPanel({
+  id,
+  labelledBy,
+  active,
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "tabpanel",
+      id,
+      "aria-labelledby": labelledBy,
+      hidden: !active,
+      className,
+      children: active ? children : null
+    }
+  );
+}
+function Tabs({
+  tabs,
+  value,
+  onChange,
+  ariaLabel,
+  className
+}) {
+  const refs = React.useRef(/* @__PURE__ */ new Map());
+  const reactId = React.useId();
+  const hasInlinePanels = tabs.some((tab) => tab.panel != null);
+  function tabDomId(key) {
+    return `${reactId}-tab-${key}`;
+  }
+  function panelDomId(tab) {
+    return tab.panelId ?? `${reactId}-panel-${tab.key}`;
+  }
+  function focusTab(key) {
+    onChange(key);
+    refs.current.get(key)?.focus();
+  }
+  function onKeyDown(event) {
+    const step = event.key === "ArrowRight" ? 1 : event.key === "ArrowLeft" ? -1 : 0;
+    if (step === 0) return;
+    const selectable = tabs.filter((tab) => !tab.disabled);
+    if (selectable.length < 2) return;
+    const current = selectable.findIndex((tab) => tab.key === value);
+    const next = selectable[(current + step + selectable.length) % selectable.length];
+    event.preventDefault();
+    focusTab(next.key);
+  }
+  const tablist = /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "tablist",
+      "aria-label": ariaLabel,
+      onKeyDown,
+      className: cn(
+        "border-border flex flex-wrap gap-1 border-b",
+        !hasInlinePanels ? className : void 0
+      ),
+      children: tabs.map((tab) => {
+        const active = tab.key === value;
+        const id = tabDomId(tab.key);
+        const controls = tab.panel != null || tab.panelId ? panelDomId(tab) : void 0;
+        return /* @__PURE__ */ jsxs(
+          "button",
+          {
+            id,
+            ref: (node) => {
+              refs.current.set(tab.key, node);
+            },
+            type: "button",
+            role: "tab",
+            "aria-selected": active,
+            "aria-controls": controls,
+            disabled: tab.disabled,
+            tabIndex: active ? 0 : -1,
+            onClick: () => onChange(tab.key),
+            className: cn(
+              "cursor-pointer rounded-t-md px-3 py-1.5 text-sm font-medium transition",
+              "focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none",
+              "disabled:cursor-not-allowed disabled:opacity-50",
+              // The filled-pill active state the five hand-rolled strips
+              // already used. Adopting it keeps this a deduplication rather
+              // than a restyle of every panel that has tabs.
+              active ? "bg-primary text-primary-foreground" : "text-muted-foreground hover:bg-muted"
+            ),
+            children: [
+              tab.label,
+              tab.badge != null ? /* @__PURE__ */ jsx("span", { className: "text-muted-foreground ml-1.5 text-xs", children: tab.badge }) : null
+            ]
+          },
+          tab.key
+        );
+      })
+    }
+  );
+  if (!hasInlinePanels) return tablist;
+  return /* @__PURE__ */ jsxs("div", { className: cn("space-y-3", className), children: [
+    tablist,
+    tabs.map(
+      (tab) => tab.panel != null ? /* @__PURE__ */ jsx(
+        TabPanel,
+        {
+          id: panelDomId(tab),
+          labelledBy: tabDomId(tab.key),
+          active: tab.key === value,
+          children: tab.panel
+        },
+        tab.key
+      ) : null
+    )
+  ] });
+}
+
+export {
+  TabPanel,
+  Tabs
+};
+//# sourceMappingURL=chunk-ZFSQVMLJ.js.map

package/dist/chunk-ZFSQVMLJ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/tabs.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\nimport { cn } from \"./utils\";\n\n/**\n * The tab strip five Managers were each drawing by hand, with the same\n * `rounded-t-md px-3 py-1.5 text-sm font-medium` and their own idea of what an\n * active tab looks like.\n *\n * It is a controlled component with no state of its own: every caller already\n * held the active key, usually because a URL or a query depends on it.\n *\n * Roles are the reason to use this rather than styling buttons again. A hand\n * -rolled strip is a row of buttons to a screen reader, which says nothing\n * about how many tabs there are or which is selected; `tablist` / `tab` /\n * `aria-selected` do. Arrow-key navigation comes with that expectation, so it\n * is implemented here too.\n *\n * Optional `panel` on a tab (or a sibling `TabPanel`) wires APG `aria-controls`\n * / `role=\"tabpanel\"`. Callers that already render content from `value` can\n * keep doing so and pass `panelId` for association, or switch to `panel`.\n */\nexport interface TabItem<Key extends string = string> {\n  key: Key;\n  label: React.ReactNode;\n  /** Rendered after the label — a count, usually. */\n  badge?: React.ReactNode;\n  disabled?: boolean;\n  /**\n   * Optional panel body. When any tab provides `panel`, panels render under\n   * the strip with `role=\"tabpanel\"`.\n   */\n  panel?: React.ReactNode;\n  /**\n   * External panel element id for `aria-controls` when panels live outside\n   * this component.\n   */\n  panelId?: string;\n}\n\nexport interface TabsProps<Key extends string = string> {\n  tabs: ReadonlyArray<TabItem<Key>>;\n  value: Key;\n  onChange: (key: Key) => void;\n  /** Names the strip for screen readers. */\n  ariaLabel?: string;\n  className?: string;\n}\n\nexport interface TabPanelProps {\n  /** Must match the controlling tab's generated or explicit id. */\n  id: string;\n  /** Id of the tab that labels this panel. */\n  labelledBy: string;\n  active: boolean;\n  children: React.ReactNode;\n  className?: string;\n}\n\n/** Companion panel for callers that keep content outside `Tabs`. */\nexport function TabPanel({\n  id,\n  labelledBy,\n  active,\n  children,\n  className,\n}: TabPanelProps) {\n  return (\n    <div\n      role=\"tabpanel\"\n      id={id}\n      aria-labelledby={labelledBy}\n      hidden={!active}\n      className={className}\n    >\n      {active ? children : null}\n    </div>\n  );\n}\n\nexport function Tabs<Key extends string = string>({\n  tabs,\n  value,\n  onChange,\n  ariaLabel,\n  className,\n}: TabsProps<Key>) {\n  const refs = React.useRef(new Map<Key, HTMLButtonElement | null>());\n  const reactId = React.useId();\n  const hasInlinePanels = tabs.some((tab) => tab.panel != null);\n\n  function tabDomId(key: Key) {\n    return `${reactId}-tab-${key}`;\n  }\n\n  function panelDomId(tab: TabItem<Key>) {\n    return tab.panelId ?? `${reactId}-panel-${tab.key}`;\n  }\n\n  function focusTab(key: Key) {\n    onChange(key);\n    // The newly selected tab has to take focus, or the next arrow press is\n    // still measured from the old one.\n    refs.current.get(key)?.focus();\n  }\n\n  function onKeyDown(event: React.KeyboardEvent<HTMLDivElement>) {\n    const step =\n      event.key === \"ArrowRight\" ? 1 : event.key === \"ArrowLeft\" ? -1 : 0;\n    if (step === 0) return;\n\n    const selectable = tabs.filter((tab) => !tab.disabled);\n    if (selectable.length < 2) return;\n\n    const current = selectable.findIndex((tab) => tab.key === value);\n    // Wraps, which is what a tablist is expected to do.\n    const next =\n      selectable[(current + step + selectable.length) % selectable.length];\n\n    event.preventDefault();\n    focusTab(next.key);\n  }\n\n  const tablist = (\n    <div\n      role=\"tablist\"\n      aria-label={ariaLabel}\n      onKeyDown={onKeyDown}\n      className={cn(\n        \"border-border flex flex-wrap gap-1 border-b\",\n        !hasInlinePanels ? className : undefined,\n      )}\n    >\n      {tabs.map((tab) => {\n        const active = tab.key === value;\n        const id = tabDomId(tab.key);\n        const controls =\n          tab.panel != null || tab.panelId ? panelDomId(tab) : undefined;\n        return (\n          <button\n            key={tab.key}\n            id={id}\n            ref={(node) => {\n              refs.current.set(tab.key, node);\n            }}\n            type=\"button\"\n            role=\"tab\"\n            aria-selected={active}\n            aria-controls={controls}\n            disabled={tab.disabled}\n            // Only the active tab is reachable by Tab; arrows move within the\n            // strip. Without this a keyboard user pages through every tab to\n            // get past the strip.\n            tabIndex={active ? 0 : -1}\n            onClick={() => onChange(tab.key)}\n            className={cn(\n              \"cursor-pointer rounded-t-md px-3 py-1.5 text-sm font-medium transition\",\n              \"focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none\",\n              \"disabled:cursor-not-allowed disabled:opacity-50\",\n              // The filled-pill active state the five hand-rolled strips\n              // already used. Adopting it keeps this a deduplication rather\n              // than a restyle of every panel that has tabs.\n              active\n                ? \"bg-primary text-primary-foreground\"\n                : \"text-muted-foreground hover:bg-muted\",\n            )}\n          >\n            {tab.label}\n            {tab.badge != null ? (\n              <span className=\"text-muted-foreground ml-1.5 text-xs\">\n                {tab.badge}\n              </span>\n            ) : null}\n          </button>\n        );\n      })}\n    </div>\n  );\n\n  if (!hasInlinePanels) return tablist;\n\n  return (\n    <div className={cn(\"space-y-3\", className)}>\n      {tablist}\n      {tabs.map((tab) =>\n        tab.panel != null ? (\n          <TabPanel\n            key={tab.key}\n            id={panelDomId(tab)}\n            labelledBy={tabDomId(tab.key)}\n            active={tab.key === value}\n          >\n            {tab.panel}\n          </TabPanel>\n        ) : null,\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-ZHATD73Y.js

@@ -0,0 +1,46 @@
+import {
+  cn
+} from "./chunk-HCA5ODCD.js";
+
+// src/switch.tsx
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+var Switch = React.forwardRef(
+  ({ checked, onCheckedChange, className, disabled, id, ...props }, ref) => /* @__PURE__ */ jsx(
+    "button",
+    {
+      ref,
+      id,
+      type: "button",
+      role: "switch",
+      "aria-checked": checked,
+      disabled,
+      onClick: () => onCheckedChange(!checked),
+      className: cn(
+        // 24×44px track meets DESIGN.md 24px minimum target size.
+        "relative inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border transition-colors",
+        "focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none",
+        "disabled:cursor-not-allowed disabled:opacity-50",
+        checked ? "border-primary bg-primary" : "border-border bg-muted",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(
+        "span",
+        {
+          "aria-hidden": true,
+          className: cn(
+            "bg-background pointer-events-none block size-5 rounded-full shadow-sm transition-transform",
+            checked ? "translate-x-5" : "translate-x-0.5"
+          )
+        }
+      )
+    }
+  )
+);
+Switch.displayName = "Switch";
+
+export {
+  Switch
+};
+//# sourceMappingURL=chunk-ZHATD73Y.js.map

package/dist/chunk-ZHATD73Y.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/switch.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\nimport { cn } from \"./utils\";\n\nexport type SwitchProps = Omit<\n  React.ButtonHTMLAttributes<HTMLButtonElement>,\n  \"onChange\"\n> & {\n  checked: boolean;\n  onCheckedChange: (checked: boolean) => void;\n};\n\n/** Compact accessible toggle — use instead of full-width checkbox inputs. */\nexport const Switch = React.forwardRef<HTMLButtonElement, SwitchProps>(\n  ({ checked, onCheckedChange, className, disabled, id, ...props }, ref) => (\n    <button\n      ref={ref}\n      id={id}\n      type=\"button\"\n      role=\"switch\"\n      aria-checked={checked}\n      disabled={disabled}\n      onClick={() => onCheckedChange(!checked)}\n      className={cn(\n        // 24×44px track meets DESIGN.md 24px minimum target size.\n        \"relative inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border transition-colors\",\n        \"focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none\",\n        \"disabled:cursor-not-allowed disabled:opacity-50\",\n        checked ? \"border-primary bg-primary\" : \"border-border bg-muted\",\n        className,\n      )}\n      {...props}\n    >\n      <span\n        aria-hidden\n        className={cn(\n          \"bg-background pointer-events-none block size-5 rounded-full shadow-sm transition-transform\",\n          checked ? \"translate-x-5\" : \"translate-x-0.5\",\n        )}\n      />\n    </button>\n  ),\n);\n\nSwitch.displayName = \"Switch\";\n"],"mappings":";;;;;AAEA,YAAY,WAAW;AAiCjB;AApBC,IAAM,SAAe;AAAA,EAC1B,CAAC,EAAE,SAAS,iBAAiB,WAAW,UAAU,IAAI,GAAG,MAAM,GAAG,QAChE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,MAAK;AAAA,MACL,MAAK;AAAA,MACL,gBAAc;AAAA,MACd;AAAA,MACA,SAAS,MAAM,gBAAgB,CAAC,OAAO;AAAA,MACvC,WAAW;AAAA;AAAA,QAET;AAAA,QACA;AAAA,QACA;AAAA,QACA,UAAU,8BAA8B;AAAA,QACxC;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ;AAAA,QAAC;AAAA;AAAA,UACC,eAAW;AAAA,UACX,WAAW;AAAA,YACT;AAAA,YACA,UAAU,kBAAkB;AAAA,UAC9B;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAEA,OAAO,cAAc;","names":[]}

package/dist/chunk-ZLAA4DGG.js

@@ -0,0 +1,111 @@
+import {
+  cn
+} from "./chunk-HCA5ODCD.js";
+
+// src/data-table.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var HEADER_VARIANTS = {
+  uppercase: "border-border bg-muted/40 text-muted-foreground border-b text-xs tracking-wide uppercase",
+  plain: "text-muted-foreground border-border border-b text-left"
+};
+var DENSITY = {
+  comfortable: "px-4 py-3",
+  compact: "px-3 py-2"
+};
+var ALIGN = {
+  left: "text-left",
+  right: "text-right",
+  center: "text-center"
+};
+function DataTable({
+  columns,
+  rows,
+  rowKey,
+  variant = "uppercase",
+  density = "comfortable",
+  stickyHeader = false,
+  rowClassName,
+  emptyMessage,
+  footer,
+  ariaLabel,
+  className,
+  tableClassName
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "border-border bg-background/80 overflow-x-auto rounded-lg border",
+        className
+      ),
+      children: /* @__PURE__ */ jsxs(
+        "table",
+        {
+          "aria-label": ariaLabel,
+          className: cn("min-w-full text-left text-sm", tableClassName),
+          children: [
+            /* @__PURE__ */ jsx(
+              "thead",
+              {
+                className: cn(
+                  HEADER_VARIANTS[variant],
+                  stickyHeader && "bg-muted sticky top-0 z-10"
+                ),
+                children: /* @__PURE__ */ jsx("tr", { children: columns.map((column) => /* @__PURE__ */ jsx(
+                  "th",
+                  {
+                    scope: "col",
+                    "aria-sort": column.ariaSort,
+                    className: cn(
+                      DENSITY[density],
+                      "font-medium",
+                      ALIGN[column.align ?? "left"],
+                      column.headerClassName
+                    ),
+                    children: column.title
+                  },
+                  column.key
+                )) })
+              }
+            ),
+            /* @__PURE__ */ jsx("tbody", { children: rows.length === 0 && emptyMessage != null ? /* @__PURE__ */ jsx("tr", { children: /* @__PURE__ */ jsx(
+              "td",
+              {
+                colSpan: columns.length,
+                className: "text-muted-foreground px-4 py-6 text-center text-sm",
+                children: emptyMessage
+              }
+            ) }) : rows.map((row, index) => /* @__PURE__ */ jsx(
+              "tr",
+              {
+                className: cn(
+                  "border-border/70 border-b last:border-0",
+                  rowClassName?.(row, index)
+                ),
+                children: columns.map((column) => /* @__PURE__ */ jsx(
+                  "td",
+                  {
+                    className: cn(
+                      DENSITY[density],
+                      ALIGN[column.align ?? "left"],
+                      column.className
+                    ),
+                    children: column.cell(row, index)
+                  },
+                  column.key
+                ))
+              },
+              rowKey(row, index)
+            )) }),
+            footer != null ? /* @__PURE__ */ jsx("tfoot", { children: footer }) : null
+          ]
+        }
+      )
+    }
+  );
+}
+
+export {
+  DataTable
+};
+//# sourceMappingURL=chunk-ZLAA4DGG.js.map

package/dist/chunk-ZLAA4DGG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/data-table.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { cn } from \"./utils\";\n\n/**\n * The list table every feature panel was hand-rolling.\n *\n * Seventeen files repeated the same wrapper string\n * (`border-border bg-background/80 overflow-x-auto rounded-lg border`) and the\n * header had already drifted into two incompatible looks, so Campaigns and\n * Targets did not resemble each other. Both are kept as `variant` rather than\n * unified here: collapsing them is a visual change to ten panels and belongs in\n * its own reviewable diff, not smuggled in with a refactor.\n *\n * The column contract deliberately echoes `GridColumn` in\n * `spreadsheet-grid.tsx` — `key`, `title`, a renderer, an optional class — so\n * the repo has one shape to learn. It drops that type's `value: (row) => string`\n * because there is no clipboard or CSV here; nothing would keep it honest, and\n * a required field nobody reads gets filled in with lies.\n *\n * **Not for every table.** `GroupTable` renders parent and child rows with\n * different column counts, and `BusinessTable`'s rows are dnd-kit sortables that\n * own their own refs and transforms. `PublishModal`, `BulkCreateModal` and the\n * clone queue in `MetaAdSetsPanel` are grids of inputs rather than lists of\n * values — every cell is an editable control, and they size their header and\n * body rows differently on purpose. All five are legitimately tables of a\n * different kind; bending this component around them would cost more than it\n * saves.\n */\nexport type TableColumn<Row> = {\n  key: string;\n  /** Node, not string: a header can carry a select-all box or a sort control. */\n  title: React.ReactNode;\n  cell: (row: Row, index: number) => React.ReactNode;\n  align?: \"left\" | \"right\" | \"center\";\n  /**\n   * Set on a sortable column so a screen reader announces the current sort.\n   * Only the sorted column says `ascending`/`descending`; the rest say `none`,\n   * which is what marks them as sortable at all.\n   */\n  ariaSort?: \"ascending\" | \"descending\" | \"none\";\n  /** Extra classes for this column's `<td>`. */\n  className?: string;\n  /** Extra classes for this column's `<th>`. */\n  headerClassName?: string;\n};\n\nexport interface DataTableProps<Row> {\n  columns: TableColumn<Row>[];\n  rows: Row[];\n  /** Stable React key per row. */\n  rowKey: (row: Row, index: number) => string;\n  /**\n   * `uppercase` — the tinted small-caps header (campaigns, showcase, filters).\n   * `plain` — the quieter left-aligned header (ads, targets, creatives).\n   */\n  variant?: \"uppercase\" | \"plain\";\n  /**\n   * `comfortable` — the roomy default, for tables of a handful of columns.\n   * `compact` — what every table of eight columns or more had already chosen by\n   * hand, because the roomy padding pushes them into a horizontal scroll.\n   */\n  density?: \"comfortable\" | \"compact\";\n  /** Pins the header for a table inside its own scroll container. */\n  stickyHeader?: boolean;\n  rowClassName?: (row: Row, index: number) => string | undefined;\n  /** Rendered in place of `<tbody>` rows when there are none. */\n  emptyMessage?: React.ReactNode;\n  /**\n   * Rows for a `<tfoot>` — a totals line, typically. The caller supplies the\n   * `<tr>` itself because a summary row rarely lines up with the columns above\n   * it; designer-counts spans its first two.\n   */\n  footer?: React.ReactNode;\n  /** Names the table for screen readers when no visible caption fits. */\n  ariaLabel?: string;\n  /** Classes for the scroll wrapper. */\n  className?: string;\n  /** Classes for the `<table>`. */\n  tableClassName?: string;\n}\n\nconst HEADER_VARIANTS = {\n  uppercase:\n    \"border-border bg-muted/40 text-muted-foreground border-b text-xs tracking-wide uppercase\",\n  plain: \"text-muted-foreground border-border border-b text-left\",\n} as const;\n\nconst DENSITY = {\n  comfortable: \"px-4 py-3\",\n  compact: \"px-3 py-2\",\n} as const;\n\nconst ALIGN = {\n  left: \"text-left\",\n  right: \"text-right\",\n  center: \"text-center\",\n} as const;\n\nexport function DataTable<Row>({\n  columns,\n  rows,\n  rowKey,\n  variant = \"uppercase\",\n  density = \"comfortable\",\n  stickyHeader = false,\n  rowClassName,\n  emptyMessage,\n  footer,\n  ariaLabel,\n  className,\n  tableClassName,\n}: DataTableProps<Row>) {\n  return (\n    <div\n      className={cn(\n        \"border-border bg-background/80 overflow-x-auto rounded-lg border\",\n        className,\n      )}\n    >\n      <table\n        aria-label={ariaLabel}\n        className={cn(\"min-w-full text-left text-sm\", tableClassName)}\n      >\n        <thead\n          className={cn(\n            HEADER_VARIANTS[variant],\n            stickyHeader && \"bg-muted sticky top-0 z-10\",\n          )}\n        >\n          <tr>\n            {columns.map((column) => (\n              <th\n                key={column.key}\n                scope=\"col\"\n                aria-sort={column.ariaSort}\n                className={cn(\n                  DENSITY[density],\n                  \"font-medium\",\n                  ALIGN[column.align ?? \"left\"],\n                  column.headerClassName,\n                )}\n              >\n                {column.title}\n              </th>\n            ))}\n          </tr>\n        </thead>\n        <tbody>\n          {rows.length === 0 && emptyMessage != null ? (\n            <tr>\n              {/* One cell across the whole width — a short row would otherwise\n                  leave the message sitting under the first column. */}\n              <td\n                colSpan={columns.length}\n                className=\"text-muted-foreground px-4 py-6 text-center text-sm\"\n              >\n                {emptyMessage}\n              </td>\n            </tr>\n          ) : (\n            rows.map((row, index) => (\n              <tr\n                key={rowKey(row, index)}\n                className={cn(\n                  \"border-border/70 border-b last:border-0\",\n                  rowClassName?.(row, index),\n                )}\n              >\n                {columns.map((column) => (\n                  <td\n                    key={column.key}\n                    className={cn(\n                      DENSITY[density],\n                      ALIGN[column.align ?? \"left\"],\n                      column.className,\n                    )}\n                  >\n                    {column.cell(row, index)}\n                  </td>\n                ))}\n              </tr>\n            ))\n          )}\n        </tbody>\n        {footer != null ? <tfoot>{footer}</tfoot> : null}\n      </table>\n    </div>\n  );\n}\n"],"mappings":";;;;;AAwHM,SAYQ,KAZR;AAtCN,IAAM,kBAAkB;AAAA,EACtB,WACE;AAAA,EACF,OAAO;AACT;AAEA,IAAM,UAAU;AAAA,EACd,aAAa;AAAA,EACb,SAAS;AACX;AAEA,IAAM,QAAQ;AAAA,EACZ,MAAM;AAAA,EACN,OAAO;AAAA,EACP,QAAQ;AACV;AAEO,SAAS,UAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,UAAU;AAAA,EACV,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAwB;AACtB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,cAAY;AAAA,UACZ,WAAW,GAAG,gCAAgC,cAAc;AAAA,UAE5D;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,WAAW;AAAA,kBACT,gBAAgB,OAAO;AAAA,kBACvB,gBAAgB;AAAA,gBAClB;AAAA,gBAEA,8BAAC,QACE,kBAAQ,IAAI,CAAC,WACZ;AAAA,kBAAC;AAAA;AAAA,oBAEC,OAAM;AAAA,oBACN,aAAW,OAAO;AAAA,oBAClB,WAAW;AAAA,sBACT,QAAQ,OAAO;AAAA,sBACf;AAAA,sBACA,MAAM,OAAO,SAAS,MAAM;AAAA,sBAC5B,OAAO;AAAA,oBACT;AAAA,oBAEC,iBAAO;AAAA;AAAA,kBAVH,OAAO;AAAA,gBAWd,CACD,GACH;AAAA;AAAA,YACF;AAAA,YACA,oBAAC,WACE,eAAK,WAAW,KAAK,gBAAgB,OACpC,oBAAC,QAGC;AAAA,cAAC;AAAA;AAAA,gBACC,SAAS,QAAQ;AAAA,gBACjB,WAAU;AAAA,gBAET;AAAA;AAAA,YACH,GACF,IAEA,KAAK,IAAI,CAAC,KAAK,UACb;AAAA,cAAC;AAAA;AAAA,gBAEC,WAAW;AAAA,kBACT;AAAA,kBACA,eAAe,KAAK,KAAK;AAAA,gBAC3B;AAAA,gBAEC,kBAAQ,IAAI,CAAC,WACZ;AAAA,kBAAC;AAAA;AAAA,oBAEC,WAAW;AAAA,sBACT,QAAQ,OAAO;AAAA,sBACf,MAAM,OAAO,SAAS,MAAM;AAAA,sBAC5B,OAAO;AAAA,oBACT;AAAA,oBAEC,iBAAO,KAAK,KAAK,KAAK;AAAA;AAAA,kBAPlB,OAAO;AAAA,gBAQd,CACD;AAAA;AAAA,cAjBI,OAAO,KAAK,KAAK;AAAA,YAkBxB,CACD,GAEL;AAAA,YACC,UAAU,OAAO,oBAAC,WAAO,kBAAO,IAAW;AAAA;AAAA;AAAA,MAC9C;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/chunk-ZP252OJZ.js

@@ -0,0 +1,56 @@
+import {
+  cn
+} from "./chunk-HCA5ODCD.js";
+
+// src/alert.tsx
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { jsx, jsxs } from "react/jsx-runtime";
+var alertVariants = cva("rounded-lg border px-3 py-2 text-sm", {
+  variants: {
+    variant: {
+      danger: "border-destructive/30 bg-destructive/5 text-destructive",
+      warning: "border-warning/30 bg-warning/5 text-warning",
+      success: "border-success/30 bg-success/5 text-success",
+      info: "border-info/30 bg-info/5 text-info",
+      /**
+       * The quiet state of a banner that also has loud ones — "no default
+       * campaign set" next to "this is the default". Without it those callers
+       * keep a ternary of raw class strings and the shared component only
+       * covers half of what they draw.
+       */
+      neutral: "border-border bg-muted/40 text-muted-foreground"
+    }
+  },
+  defaultVariants: {
+    // Failure is what a banner almost always reports here, and defaulting to
+    // it means the noisy case cannot be forgotten.
+    variant: "danger"
+  }
+});
+var Alert = React.forwardRef(
+  ({ className, variant, action, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      role: variant === "danger" || variant == null ? "alert" : "status",
+      className: cn(
+        alertVariants({ variant }),
+        action && "flex flex-wrap items-center justify-between gap-3",
+        className
+      ),
+      ...props,
+      children: [
+        action ? /* @__PURE__ */ jsx("span", { children }) : children,
+        action
+      ]
+    }
+  )
+);
+Alert.displayName = "Alert";
+
+export {
+  alertVariants,
+  Alert
+};
+//# sourceMappingURL=chunk-ZP252OJZ.js.map

package/dist/chunk-ZP252OJZ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/alert.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"./utils\";\n\n/**\n * The inline message banner — a failed load, a warning above a form, a note.\n *\n * This was the most duplicated markup in the panel: thirty blocks across\n * twenty-eight files, spelled seven different ways. `px-3 py-2` in most places\n * and `px-4 py-3` in others, `text-rose-700` here and `text-destructive`\n * there — all meaning \"something went wrong\".\n *\n * `role` is derived from the variant rather than left to callers. An error a\n * user needs to act on should interrupt a screen reader; a note should not.\n * Almost none of the hand-rolled copies set either.\n */\nconst alertVariants = cva(\"rounded-lg border px-3 py-2 text-sm\", {\n  variants: {\n    variant: {\n      danger: \"border-destructive/30 bg-destructive/5 text-destructive\",\n      warning: \"border-warning/30 bg-warning/5 text-warning\",\n      success: \"border-success/30 bg-success/5 text-success\",\n      info: \"border-info/30 bg-info/5 text-info\",\n      /**\n       * The quiet state of a banner that also has loud ones — \"no default\n       * campaign set\" next to \"this is the default\". Without it those callers\n       * keep a ternary of raw class strings and the shared component only\n       * covers half of what they draw.\n       */\n      neutral: \"border-border bg-muted/40 text-muted-foreground\",\n    },\n  },\n  defaultVariants: {\n    // Failure is what a banner almost always reports here, and defaulting to\n    // it means the noisy case cannot be forgotten.\n    variant: \"danger\",\n  },\n});\n\nexport interface AlertProps\n  extends\n    React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof alertVariants> {\n  /**\n   * A control belonging to the message, such as Retry. Given one, the banner\n   * lays out as a row and keeps the action at its end.\n   */\n  action?: React.ReactNode;\n}\n\nexport const Alert = React.forwardRef<HTMLDivElement, AlertProps>(\n  ({ className, variant, action, children, ...props }, ref) => (\n    <div\n      ref={ref}\n      role={variant === \"danger\" || variant == null ? \"alert\" : \"status\"}\n      className={cn(\n        alertVariants({ variant }),\n        action && \"flex flex-wrap items-center justify-between gap-3\",\n        className,\n      )}\n      {...props}\n    >\n      {/* Wrapped so the action sits opposite the text rather than being\n          pushed around by whatever the caller passed as children. */}\n      {action ? <span>{children}</span> : children}\n      {action}\n    </div>\n  ),\n);\n\nAlert.displayName = \"Alert\";\n\nexport { alertVariants };\n"],"mappings":";;;;;AAAA,YAAY,WAAW;AACvB,SAAS,WAA8B;AAoDnC,SAYY,KAZZ;AApCJ,IAAM,gBAAgB,IAAI,uCAAuC;AAAA,EAC/D,UAAU;AAAA,IACR,SAAS;AAAA,MACP,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAON,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA;AAAA;AAAA,IAGf,SAAS;AAAA,EACX;AACF,CAAC;AAaM,IAAM,QAAc;AAAA,EACzB,CAAC,EAAE,WAAW,SAAS,QAAQ,UAAU,GAAG,MAAM,GAAG,QACnD;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,MAAM,YAAY,YAAY,WAAW,OAAO,UAAU;AAAA,MAC1D,WAAW;AAAA,QACT,cAAc,EAAE,QAAQ,CAAC;AAAA,QACzB,UAAU;AAAA,QACV;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAIH;AAAA,iBAAS,oBAAC,UAAM,UAAS,IAAU;AAAA,QACnC;AAAA;AAAA;AAAA,EACH;AAEJ;AAEA,MAAM,cAAc;","names":[]}

package/dist/clipboard.cjs

@@ -0,0 +1,125 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/clipboard.ts
+var clipboard_exports = {};
+__export(clipboard_exports, {
+  CSV_DELIMITER: () => CSV_DELIMITER,
+  TSV_DELIMITER: () => TSV_DELIMITER,
+  buildRangeText: () => buildRangeText,
+  countCells: () => countCells,
+  describeRange: () => describeRange,
+  escapeCell: () => escapeCell,
+  fullRange: () => fullRange,
+  normalizeRange: () => normalizeRange,
+  writeToClipboard: () => writeToClipboard
+});
+module.exports = __toCommonJS(clipboard_exports);
+var TSV_DELIMITER = "	";
+var CSV_DELIMITER = ",";
+function normalizeRange(anchor, focus) {
+  if (!anchor || !focus) return null;
+  return {
+    r1: Math.min(anchor.r, focus.r),
+    r2: Math.max(anchor.r, focus.r),
+    c1: Math.min(anchor.c, focus.c),
+    c2: Math.max(anchor.c, focus.c)
+  };
+}
+function escapeCell(raw, delimiter) {
+  const value = raw == null ? "" : String(raw);
+  if (value.includes(delimiter) || value.includes("\n") || value.includes("\r") || value.includes('"')) {
+    return `"${value.replace(/"/g, '""')}"`;
+  }
+  return value;
+}
+function buildRangeText(range, columns, rows, delimiter, includeHeaders) {
+  if (!range) return "";
+  const lines = [];
+  if (includeHeaders) {
+    const header = [];
+    for (let c = range.c1; c <= range.c2; c++) {
+      header.push(escapeCell(columns[c]?.title, delimiter));
+    }
+    lines.push(header.join(delimiter));
+  }
+  for (let r = range.r1; r <= range.r2; r++) {
+    const line = [];
+    const row = rows[r];
+    for (let c = range.c1; c <= range.c2; c++) {
+      const column = columns[c];
+      line.push(
+        escapeCell(
+          column && row !== void 0 ? column.value(row) : "",
+          delimiter
+        )
+      );
+    }
+    lines.push(line.join(delimiter));
+  }
+  return lines.join("\n");
+}
+function fullRange(columns, rows) {
+  if (!rows.length || !columns.length) return null;
+  return { r1: 0, r2: rows.length - 1, c1: 0, c2: columns.length - 1 };
+}
+function describeRange(range) {
+  if (!range) return "No selection";
+  const rowCount = range.r2 - range.r1 + 1;
+  const colCount = range.c2 - range.c1 + 1;
+  if (rowCount === 1 && colCount === 1) return "1 cell selected";
+  return `${rowCount} \xD7 ${colCount} selected`;
+}
+function countCells(range) {
+  return {
+    rows: range.r2 - range.r1 + 1,
+    columns: range.c2 - range.c1 + 1
+  };
+}
+async function writeToClipboard(text) {
+  if (navigator.clipboard?.writeText) {
+    return navigator.clipboard.writeText(text);
+  }
+  const textarea = document.createElement("textarea");
+  textarea.value = text;
+  textarea.style.position = "fixed";
+  textarea.style.top = "-1000px";
+  document.body.appendChild(textarea);
+  textarea.select();
+  try {
+    if (!document.execCommand("copy")) {
+      throw new Error("Could not write to the clipboard");
+    }
+  } finally {
+    document.body.removeChild(textarea);
+  }
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  CSV_DELIMITER,
+  TSV_DELIMITER,
+  buildRangeText,
+  countCells,
+  describeRange,
+  escapeCell,
+  fullRange,
+  normalizeRange,
+  writeToClipboard
+});
+//# sourceMappingURL=clipboard.cjs.map

package/dist/clipboard.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/clipboard.ts"],"sourcesContent":["/**\n * Range maths and clipboard text for the card table's spreadsheet selection.\n *\n * Ported from video-shorts-panel `app/src/common/components/ExcelTable.jsx`.\n * Kept free of React and the DOM (except `writeToClipboard`) so the escaping\n * and range rules are unit-testable.\n */\n\nexport type CellRef = { r: number; c: number };\n\nexport type CellRange = { r1: number; r2: number; c1: number; c2: number };\n\n/** Tab for the clipboard (Excel/Sheets split on it), comma for a .csv file. */\nexport const TSV_DELIMITER = \"\\t\";\nexport const CSV_DELIMITER = \",\";\n\n/**\n * Anchor and focus can be dragged in any direction, so the range is whichever\n * corners they happen to be — normalize to top-left / bottom-right.\n */\nexport function normalizeRange(\n  anchor: CellRef | null | undefined,\n  focus: CellRef | null | undefined,\n): CellRange | null {\n  if (!anchor || !focus) return null;\n  return {\n    r1: Math.min(anchor.r, focus.r),\n    r2: Math.max(anchor.r, focus.r),\n    c1: Math.min(anchor.c, focus.c),\n    c2: Math.max(anchor.c, focus.c),\n  };\n}\n\n/**\n * A cell needs quoting once it carries the delimiters themselves — the same\n * rule Excel uses when it parses the clipboard. Without it, a title containing\n * a tab or a newline silently becomes extra columns or rows on paste.\n */\nexport function escapeCell(raw: unknown, delimiter: string): string {\n  const value = raw == null ? \"\" : String(raw);\n  if (\n    value.includes(delimiter) ||\n    value.includes(\"\\n\") ||\n    value.includes(\"\\r\") ||\n    value.includes('\"')\n  ) {\n    return `\"${value.replace(/\"/g, '\"\"')}\"`;\n  }\n  return value;\n}\n\nexport type TextColumn<Row> = {\n  title: string;\n  value: (row: Row) => string;\n};\n\n/** Renders a range as delimited text, optionally with a header line. */\nexport function buildRangeText<Row>(\n  range: CellRange | null,\n  columns: TextColumn<Row>[],\n  rows: Row[],\n  delimiter: string,\n  includeHeaders: boolean,\n): string {\n  if (!range) return \"\";\n  const lines: string[] = [];\n\n  if (includeHeaders) {\n    const header: string[] = [];\n    for (let c = range.c1; c <= range.c2; c++) {\n      header.push(escapeCell(columns[c]?.title, delimiter));\n    }\n    lines.push(header.join(delimiter));\n  }\n\n  for (let r = range.r1; r <= range.r2; r++) {\n    const line: string[] = [];\n    const row = rows[r];\n    for (let c = range.c1; c <= range.c2; c++) {\n      const column = columns[c];\n      line.push(\n        escapeCell(\n          column && row !== undefined ? column.value(row) : \"\",\n          delimiter,\n        ),\n      );\n    }\n    lines.push(line.join(delimiter));\n  }\n\n  return lines.join(\"\\n\");\n}\n\n/** The whole grid, or null when there is nothing to select. */\nexport function fullRange<Row>(\n  columns: TextColumn<Row>[],\n  rows: Row[],\n): CellRange | null {\n  if (!rows.length || !columns.length) return null;\n  return { r1: 0, r2: rows.length - 1, c1: 0, c2: columns.length - 1 };\n}\n\n/** \"3 × 2 selected\" — what the toolbar reports back to the user. */\nexport function describeRange(range: CellRange | null): string {\n  if (!range) return \"No selection\";\n  const rowCount = range.r2 - range.r1 + 1;\n  const colCount = range.c2 - range.c1 + 1;\n  if (rowCount === 1 && colCount === 1) return \"1 cell selected\";\n  return `${rowCount} × ${colCount} selected`;\n}\n\nexport function countCells(range: CellRange): {\n  rows: number;\n  columns: number;\n} {\n  return {\n    rows: range.r2 - range.r1 + 1,\n    columns: range.c2 - range.c1 + 1,\n  };\n}\n\n/**\n * `navigator.clipboard` is unavailable on http origins and older browsers, so\n * fall back to a hidden textarea + execCommand rather than failing the copy.\n */\nexport async function writeToClipboard(text: string): Promise<void> {\n  if (navigator.clipboard?.writeText) {\n    return navigator.clipboard.writeText(text);\n  }\n\n  const textarea = document.createElement(\"textarea\");\n  textarea.value = text;\n  textarea.style.position = \"fixed\";\n  textarea.style.top = \"-1000px\";\n  document.body.appendChild(textarea);\n  textarea.select();\n  try {\n    if (!document.execCommand(\"copy\")) {\n      throw new Error(\"Could not write to the clipboard\");\n    }\n  } finally {\n    document.body.removeChild(textarea);\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/clipboard.d.cts

@@ -0,0 +1,52 @@
+/**
+ * Range maths and clipboard text for the card table's spreadsheet selection.
+ *
+ * Ported from video-shorts-panel `app/src/common/components/ExcelTable.jsx`.
+ * Kept free of React and the DOM (except `writeToClipboard`) so the escaping
+ * and range rules are unit-testable.
+ */
+type CellRef = {
+    r: number;
+    c: number;
+};
+type CellRange = {
+    r1: number;
+    r2: number;
+    c1: number;
+    c2: number;
+};
+/** Tab for the clipboard (Excel/Sheets split on it), comma for a .csv file. */
+declare const TSV_DELIMITER = "\t";
+declare const CSV_DELIMITER = ",";
+/**
+ * Anchor and focus can be dragged in any direction, so the range is whichever
+ * corners they happen to be — normalize to top-left / bottom-right.
+ */
+declare function normalizeRange(anchor: CellRef | null | undefined, focus: CellRef | null | undefined): CellRange | null;
+/**
+ * A cell needs quoting once it carries the delimiters themselves — the same
+ * rule Excel uses when it parses the clipboard. Without it, a title containing
+ * a tab or a newline silently becomes extra columns or rows on paste.
+ */
+declare function escapeCell(raw: unknown, delimiter: string): string;
+type TextColumn<Row> = {
+    title: string;
+    value: (row: Row) => string;
+};
+/** Renders a range as delimited text, optionally with a header line. */
+declare function buildRangeText<Row>(range: CellRange | null, columns: TextColumn<Row>[], rows: Row[], delimiter: string, includeHeaders: boolean): string;
+/** The whole grid, or null when there is nothing to select. */
+declare function fullRange<Row>(columns: TextColumn<Row>[], rows: Row[]): CellRange | null;
+/** "3 × 2 selected" — what the toolbar reports back to the user. */
+declare function describeRange(range: CellRange | null): string;
+declare function countCells(range: CellRange): {
+    rows: number;
+    columns: number;
+};
+/**
+ * `navigator.clipboard` is unavailable on http origins and older browsers, so
+ * fall back to a hidden textarea + execCommand rather than failing the copy.
+ */
+declare function writeToClipboard(text: string): Promise<void>;
+
+export { CSV_DELIMITER, type CellRange, type CellRef, TSV_DELIMITER, type TextColumn, buildRangeText, countCells, describeRange, escapeCell, fullRange, normalizeRange, writeToClipboard };

package/dist/clipboard.d.ts

@@ -0,0 +1,52 @@
+/**
+ * Range maths and clipboard text for the card table's spreadsheet selection.
+ *
+ * Ported from video-shorts-panel `app/src/common/components/ExcelTable.jsx`.
+ * Kept free of React and the DOM (except `writeToClipboard`) so the escaping
+ * and range rules are unit-testable.
+ */
+type CellRef = {
+    r: number;
+    c: number;
+};
+type CellRange = {
+    r1: number;
+    r2: number;
+    c1: number;
+    c2: number;
+};
+/** Tab for the clipboard (Excel/Sheets split on it), comma for a .csv file. */
+declare const TSV_DELIMITER = "\t";
+declare const CSV_DELIMITER = ",";
+/**
+ * Anchor and focus can be dragged in any direction, so the range is whichever
+ * corners they happen to be — normalize to top-left / bottom-right.
+ */
+declare function normalizeRange(anchor: CellRef | null | undefined, focus: CellRef | null | undefined): CellRange | null;
+/**
+ * A cell needs quoting once it carries the delimiters themselves — the same
+ * rule Excel uses when it parses the clipboard. Without it, a title containing
+ * a tab or a newline silently becomes extra columns or rows on paste.
+ */
+declare function escapeCell(raw: unknown, delimiter: string): string;
+type TextColumn<Row> = {
+    title: string;
+    value: (row: Row) => string;
+};
+/** Renders a range as delimited text, optionally with a header line. */
+declare function buildRangeText<Row>(range: CellRange | null, columns: TextColumn<Row>[], rows: Row[], delimiter: string, includeHeaders: boolean): string;
+/** The whole grid, or null when there is nothing to select. */
+declare function fullRange<Row>(columns: TextColumn<Row>[], rows: Row[]): CellRange | null;
+/** "3 × 2 selected" — what the toolbar reports back to the user. */
+declare function describeRange(range: CellRange | null): string;
+declare function countCells(range: CellRange): {
+    rows: number;
+    columns: number;
+};
+/**
+ * `navigator.clipboard` is unavailable on http origins and older browsers, so
+ * fall back to a hidden textarea + execCommand rather than failing the copy.
+ */
+declare function writeToClipboard(text: string): Promise<void>;
+
+export { CSV_DELIMITER, type CellRange, type CellRef, TSV_DELIMITER, type TextColumn, buildRangeText, countCells, describeRange, escapeCell, fullRange, normalizeRange, writeToClipboard };

package/dist/clipboard.js

@@ -0,0 +1,23 @@
+import {
+  CSV_DELIMITER,
+  TSV_DELIMITER,
+  buildRangeText,
+  countCells,
+  describeRange,
+  escapeCell,
+  fullRange,
+  normalizeRange,
+  writeToClipboard
+} from "./chunk-Y5WCT6XN.js";
+export {
+  CSV_DELIMITER,
+  TSV_DELIMITER,
+  buildRangeText,
+  countCells,
+  describeRange,
+  escapeCell,
+  fullRange,
+  normalizeRange,
+  writeToClipboard
+};
+//# sourceMappingURL=clipboard.js.map