@withpotter/pages-admin 0.13.0-next.101

package/dist/admin/_ui/donut-chart.js

@@ -0,0 +1,193 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+const SIZE = 168;
+const STROKE = 26;
+const R = (SIZE - STROKE) / 2;
+const C = 2 * Math.PI * R;
+const CENTER = SIZE / 2;
+const fmt = (n) => Math.round(n).toLocaleString();
+function DonutChart({
+  data,
+  centerLabel,
+  emptyLabel = "No data yet"
+}) {
+  const [hover, setHover] = useState(null);
+  const { slices, total } = useMemo(() => {
+    const valid = data.filter((d) => d.value > 0);
+    const sum = valid.reduce((a, d) => a + d.value, 0);
+    const starts = valid.map(
+      (_, i) => (
+        // where each slice begins
+        valid.slice(0, i).reduce((a, d) => a + d.value, 0)
+      )
+    );
+    const computed = valid.map((d, i) => {
+      const frac = sum > 0 ? d.value / sum : 0;
+      return {
+        ...d,
+        frac,
+        dash: frac * C,
+        gap: C - frac * C,
+        rotation: starts[i] / (sum || 1) * 360
+      };
+    });
+    return { slices: computed, total: sum };
+  }, [data]);
+  if (total === 0) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          height: SIZE,
+          color: "var(--text-tertiary)",
+          fontSize: 13
+        },
+        children: emptyLabel
+      }
+    );
+  }
+  const active = hover != null ? slices[hover] : null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      style: {
+        display: "flex",
+        alignItems: "center",
+        gap: 20,
+        flexWrap: "wrap"
+      },
+      children: [
+        /* @__PURE__ */ jsxs(
+          "svg",
+          {
+            width: SIZE,
+            height: SIZE,
+            viewBox: `0 0 ${SIZE} ${SIZE}`,
+            style: { flexShrink: 0 },
+            children: [
+              /* @__PURE__ */ jsx(
+                "circle",
+                {
+                  cx: CENTER,
+                  cy: CENTER,
+                  r: R,
+                  fill: "none",
+                  stroke: "var(--border-subtle)",
+                  strokeWidth: STROKE
+                }
+              ),
+              slices.map((s, i) => /* @__PURE__ */ jsx(
+                "circle",
+                {
+                  cx: CENTER,
+                  cy: CENTER,
+                  r: R,
+                  fill: "none",
+                  stroke: s.color,
+                  strokeWidth: hover === i ? STROKE + 4 : STROKE,
+                  strokeDasharray: `${s.dash} ${s.gap}`,
+                  strokeDashoffset: -(s.rotation / 360 * C),
+                  transform: `rotate(-90 ${CENTER} ${CENTER})`,
+                  style: {
+                    transition: "stroke-width 120ms ease, opacity 120ms ease",
+                    opacity: hover == null || hover === i ? 1 : 0.35,
+                    cursor: "pointer"
+                  },
+                  onMouseEnter: () => setHover(i),
+                  onMouseLeave: () => setHover(null)
+                },
+                s.label
+              )),
+              /* @__PURE__ */ jsx(
+                "text",
+                {
+                  x: CENTER,
+                  y: CENTER - 4,
+                  textAnchor: "middle",
+                  style: { fontSize: 22, fontWeight: 500, fill: "var(--text-primary)" },
+                  children: active ? fmt(active.value) : fmt(total)
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "text",
+                {
+                  x: CENTER,
+                  y: CENTER + 16,
+                  textAnchor: "middle",
+                  style: { fontSize: 11, fill: "var(--text-tertiary)" },
+                  children: active ? `${Math.round(active.frac * 100)}% ${active.label}` : centerLabel ?? "total"
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: "adm-donut-legend", children: slices.map((s, i) => /* @__PURE__ */ jsxs(
+          "div",
+          {
+            onMouseEnter: () => setHover(i),
+            onMouseLeave: () => setHover(null),
+            style: {
+              display: "flex",
+              alignItems: "center",
+              gap: 8,
+              cursor: "pointer",
+              opacity: hover == null || hover === i ? 1 : 0.5,
+              transition: "opacity 120ms ease"
+            },
+            children: [
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  style: {
+                    width: 10,
+                    height: 10,
+                    borderRadius: 3,
+                    background: s.color,
+                    flexShrink: 0
+                  }
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  style: {
+                    fontSize: 13,
+                    color: "var(--text-secondary)",
+                    textTransform: "capitalize",
+                    whiteSpace: "nowrap"
+                  },
+                  children: s.label
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  style: {
+                    fontSize: 13,
+                    fontWeight: 600,
+                    color: "var(--text-primary)",
+                    marginLeft: "auto"
+                  },
+                  children: fmt(s.value)
+                }
+              ),
+              /* @__PURE__ */ jsxs("span", { className: "adm-donut-pct", children: [
+                Math.round(s.frac * 100),
+                "%"
+              ] })
+            ]
+          },
+          s.label
+        )) })
+      ]
+    }
+  );
+}
+export {
+  DonutChart
+};
+//# sourceMappingURL=donut-chart.js.map

package/dist/admin/_ui/donut-chart.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/_ui/donut-chart.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo, useState } from 'react';\n\nexport interface DonutSlice {\n  label: string;\n  value: number;\n  color: string;\n}\n\nconst SIZE = 168;\nconst STROKE = 26;\nconst R = (SIZE - STROKE) / 2;\nconst C = 2 * Math.PI * R;\nconst CENTER = SIZE / 2;\n\nconst fmt = (n: number) => Math.round(n).toLocaleString();\n\n/**\n * Donut chart with an interactive legend. Hovering a slice (or its legend row)\n * highlights the segment and surfaces its share in the center label.\n */\nexport function DonutChart({\n  data,\n  centerLabel,\n  emptyLabel = 'No data yet',\n}: {\n  data: DonutSlice[];\n  centerLabel?: string;\n  emptyLabel?: string;\n}) {\n  const [hover, setHover] = useState<number | null>(null);\n\n  const { slices, total } = useMemo(() => {\n    const valid = data.filter((d) => d.value > 0);\n    const sum = valid.reduce((a, d) => a + d.value, 0);\n    const starts = valid.map((_, i) =>\n      // where each slice begins\n      valid.slice(0, i).reduce((a, d) => a + d.value, 0),\n    );\n    const computed = valid.map((d, i) => {\n      const frac = sum > 0 ? d.value / sum : 0;\n      return {\n        ...d,\n        frac,\n        dash: frac * C,\n        gap: C - frac * C,\n        rotation: (starts[i] / (sum || 1)) * 360,\n      };\n    });\n    return { slices: computed, total: sum };\n  }, [data]);\n\n  if (total === 0) {\n    return (\n      <div\n        style={{\n          display: 'flex',\n          alignItems: 'center',\n          justifyContent: 'center',\n          height: SIZE,\n          color: 'var(--text-tertiary)',\n          fontSize: 13,\n        }}\n      >\n        {emptyLabel}\n      </div>\n    );\n  }\n\n  const active = hover != null ? slices[hover] : null;\n\n  return (\n    <div\n      style={{\n        display: 'flex',\n        alignItems: 'center',\n        gap: 20,\n        flexWrap: 'wrap',\n      }}\n    >\n      <svg\n        width={SIZE}\n        height={SIZE}\n        viewBox={`0 0 ${SIZE} ${SIZE}`}\n        style={{ flexShrink: 0 }}\n      >\n        <circle\n          cx={CENTER}\n          cy={CENTER}\n          r={R}\n          fill=\"none\"\n          stroke=\"var(--border-subtle)\"\n          strokeWidth={STROKE}\n        />\n        {slices.map((s, i) => (\n          <circle\n            key={s.label}\n            cx={CENTER}\n            cy={CENTER}\n            r={R}\n            fill=\"none\"\n            stroke={s.color}\n            strokeWidth={hover === i ? STROKE + 4 : STROKE}\n            strokeDasharray={`${s.dash} ${s.gap}`}\n            strokeDashoffset={-((s.rotation / 360) * C)}\n            transform={`rotate(-90 ${CENTER} ${CENTER})`}\n            style={{\n              transition: 'stroke-width 120ms ease, opacity 120ms ease',\n              opacity: hover == null || hover === i ? 1 : 0.35,\n              cursor: 'pointer',\n            }}\n            onMouseEnter={() => setHover(i)}\n            onMouseLeave={() => setHover(null)}\n          />\n        ))}\n        <text\n          x={CENTER}\n          y={CENTER - 4}\n          textAnchor=\"middle\"\n          style={{ fontSize: 22, fontWeight: 500, fill: 'var(--text-primary)' }}\n        >\n          {active ? fmt(active.value) : fmt(total)}\n        </text>\n        <text\n          x={CENTER}\n          y={CENTER + 16}\n          textAnchor=\"middle\"\n          style={{ fontSize: 11, fill: 'var(--text-tertiary)' }}\n        >\n          {active\n            ? `${Math.round(active.frac * 100)}% ${active.label}`\n            : (centerLabel ?? 'total')}\n        </text>\n      </svg>\n\n      <div className=\"adm-donut-legend\">\n        {slices.map((s, i) => (\n          <div\n            key={s.label}\n            onMouseEnter={() => setHover(i)}\n            onMouseLeave={() => setHover(null)}\n            style={{\n              display: 'flex',\n              alignItems: 'center',\n              gap: 8,\n              cursor: 'pointer',\n              opacity: hover == null || hover === i ? 1 : 0.5,\n              transition: 'opacity 120ms ease',\n            }}\n          >\n            <span\n              style={{\n                width: 10,\n                height: 10,\n                borderRadius: 3,\n                background: s.color,\n                flexShrink: 0,\n              }}\n            />\n            <span\n              style={{\n                fontSize: 13,\n                color: 'var(--text-secondary)',\n                textTransform: 'capitalize',\n                whiteSpace: 'nowrap',\n              }}\n            >\n              {s.label}\n            </span>\n            <span\n              style={{\n                fontSize: 13,\n                fontWeight: 600,\n                color: 'var(--text-primary)',\n                marginLeft: 'auto',\n              }}\n            >\n              {fmt(s.value)}\n            </span>\n            <span className=\"adm-donut-pct\">{Math.round(s.frac * 100)}%</span>\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AAuDM,cA0BA,YA1BA;AArDN,SAAS,SAAS,gBAAgB;AAQlC,MAAM,OAAO;AACb,MAAM,SAAS;AACf,MAAM,KAAK,OAAO,UAAU;AAC5B,MAAM,IAAI,IAAI,KAAK,KAAK;AACxB,MAAM,SAAS,OAAO;AAEtB,MAAM,MAAM,CAAC,MAAc,KAAK,MAAM,CAAC,EAAE,eAAe;AAMjD,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA,aAAa;AACf,GAIG;AACD,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAwB,IAAI;AAEtD,QAAM,EAAE,QAAQ,MAAM,IAAI,QAAQ,MAAM;AACtC,UAAM,QAAQ,KAAK,OAAO,CAAC,MAAM,EAAE,QAAQ,CAAC;AAC5C,UAAM,MAAM,MAAM,OAAO,CAAC,GAAG,MAAM,IAAI,EAAE,OAAO,CAAC;AACjD,UAAM,SAAS,MAAM;AAAA,MAAI,CAAC,GAAG;AAAA;AAAA,QAE3B,MAAM,MAAM,GAAG,CAAC,EAAE,OAAO,CAAC,GAAG,MAAM,IAAI,EAAE,OAAO,CAAC;AAAA;AAAA,IACnD;AACA,UAAM,WAAW,MAAM,IAAI,CAAC,GAAG,MAAM;AACnC,YAAM,OAAO,MAAM,IAAI,EAAE,QAAQ,MAAM;AACvC,aAAO;AAAA,QACL,GAAG;AAAA,QACH;AAAA,QACA,MAAM,OAAO;AAAA,QACb,KAAK,IAAI,OAAO;AAAA,QAChB,UAAW,OAAO,CAAC,KAAK,OAAO,KAAM;AAAA,MACvC;AAAA,IACF,CAAC;AACD,WAAO,EAAE,QAAQ,UAAU,OAAO,IAAI;AAAA,EACxC,GAAG,CAAC,IAAI,CAAC;AAET,MAAI,UAAU,GAAG;AACf,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,UACL,SAAS;AAAA,UACT,YAAY;AAAA,UACZ,gBAAgB;AAAA,UAChB,QAAQ;AAAA,UACR,OAAO;AAAA,UACP,UAAU;AAAA,QACZ;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,EAEJ;AAEA,QAAM,SAAS,SAAS,OAAO,OAAO,KAAK,IAAI;AAE/C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,QACL,SAAS;AAAA,QACT,YAAY;AAAA,QACZ,KAAK;AAAA,QACL,UAAU;AAAA,MACZ;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,OAAO;AAAA,YACP,QAAQ;AAAA,YACR,SAAS,OAAO,IAAI,IAAI,IAAI;AAAA,YAC5B,OAAO,EAAE,YAAY,EAAE;AAAA,YAEvB;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,IAAI;AAAA,kBACJ,IAAI;AAAA,kBACJ,GAAG;AAAA,kBACH,MAAK;AAAA,kBACL,QAAO;AAAA,kBACP,aAAa;AAAA;AAAA,cACf;AAAA,cACC,OAAO,IAAI,CAAC,GAAG,MACd;AAAA,gBAAC;AAAA;AAAA,kBAEC,IAAI;AAAA,kBACJ,IAAI;AAAA,kBACJ,GAAG;AAAA,kBACH,MAAK;AAAA,kBACL,QAAQ,EAAE;AAAA,kBACV,aAAa,UAAU,IAAI,SAAS,IAAI;AAAA,kBACxC,iBAAiB,GAAG,EAAE,IAAI,IAAI,EAAE,GAAG;AAAA,kBACnC,kBAAkB,EAAG,EAAE,WAAW,MAAO;AAAA,kBACzC,WAAW,cAAc,MAAM,IAAI,MAAM;AAAA,kBACzC,OAAO;AAAA,oBACL,YAAY;AAAA,oBACZ,SAAS,SAAS,QAAQ,UAAU,IAAI,IAAI;AAAA,oBAC5C,QAAQ;AAAA,kBACV;AAAA,kBACA,cAAc,MAAM,SAAS,CAAC;AAAA,kBAC9B,cAAc,MAAM,SAAS,IAAI;AAAA;AAAA,gBAhB5B,EAAE;AAAA,cAiBT,CACD;AAAA,cACD;AAAA,gBAAC;AAAA;AAAA,kBACC,GAAG;AAAA,kBACH,GAAG,SAAS;AAAA,kBACZ,YAAW;AAAA,kBACX,OAAO,EAAE,UAAU,IAAI,YAAY,KAAK,MAAM,sBAAsB;AAAA,kBAEnE,mBAAS,IAAI,OAAO,KAAK,IAAI,IAAI,KAAK;AAAA;AAAA,cACzC;AAAA,cACA;AAAA,gBAAC;AAAA;AAAA,kBACC,GAAG;AAAA,kBACH,GAAG,SAAS;AAAA,kBACZ,YAAW;AAAA,kBACX,OAAO,EAAE,UAAU,IAAI,MAAM,uBAAuB;AAAA,kBAEnD,mBACG,GAAG,KAAK,MAAM,OAAO,OAAO,GAAG,CAAC,KAAK,OAAO,KAAK,KAChD,eAAe;AAAA;AAAA,cACtB;AAAA;AAAA;AAAA,QACF;AAAA,QAEA,oBAAC,SAAI,WAAU,oBACZ,iBAAO,IAAI,CAAC,GAAG,MACd;AAAA,UAAC;AAAA;AAAA,YAEC,cAAc,MAAM,SAAS,CAAC;AAAA,YAC9B,cAAc,MAAM,SAAS,IAAI;AAAA,YACjC,OAAO;AAAA,cACL,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,KAAK;AAAA,cACL,QAAQ;AAAA,cACR,SAAS,SAAS,QAAQ,UAAU,IAAI,IAAI;AAAA,cAC5C,YAAY;AAAA,YACd;AAAA,YAEA;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,OAAO;AAAA,oBACL,OAAO;AAAA,oBACP,QAAQ;AAAA,oBACR,cAAc;AAAA,oBACd,YAAY,EAAE;AAAA,oBACd,YAAY;AAAA,kBACd;AAAA;AAAA,cACF;AAAA,cACA;AAAA,gBAAC;AAAA;AAAA,kBACC,OAAO;AAAA,oBACL,UAAU;AAAA,oBACV,OAAO;AAAA,oBACP,eAAe;AAAA,oBACf,YAAY;AAAA,kBACd;AAAA,kBAEC,YAAE;AAAA;AAAA,cACL;AAAA,cACA;AAAA,gBAAC;AAAA;AAAA,kBACC,OAAO;AAAA,oBACL,UAAU;AAAA,oBACV,YAAY;AAAA,oBACZ,OAAO;AAAA,oBACP,YAAY;AAAA,kBACd;AAAA,kBAEC,cAAI,EAAE,KAAK;AAAA;AAAA,cACd;AAAA,cACA,qBAAC,UAAK,WAAU,iBAAiB;AAAA,qBAAK,MAAM,EAAE,OAAO,GAAG;AAAA,gBAAE;AAAA,iBAAC;AAAA;AAAA;AAAA,UAzCtD,EAAE;AAAA,QA0CT,CACD,GACH;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/admin/_ui/drawer.js

@@ -0,0 +1,82 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { X } from "lucide-react";
+import styles from "./drawer.module.css";
+function Drawer({
+  open,
+  onClose,
+  title,
+  subtitle,
+  media,
+  meta,
+  actions,
+  children,
+  footer,
+  width = 480
+}) {
+  const [mounted, setMounted] = useState(open);
+  if (open && !mounted) setMounted(true);
+  useEffect(() => {
+    if (!open) return;
+    const onKey = (e) => {
+      if (e.key === "Escape") onClose();
+    };
+    window.addEventListener("keydown", onKey);
+    return () => window.removeEventListener("keydown", onKey);
+  }, [open, onClose]);
+  if (!mounted) return null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "dialog",
+      "aria-modal": "true",
+      className: styles.root,
+      "data-state": open ? "open" : "closed",
+      children: [
+        /* @__PURE__ */ jsx("div", { onClick: onClose, className: styles.scrim }),
+        /* @__PURE__ */ jsxs(
+          "aside",
+          {
+            className: styles.sheet,
+            style: { width },
+            onAnimationEnd: (event) => {
+              if (!open && event.target === event.currentTarget) setMounted(false);
+            },
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: styles.toolbar, children: [
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: onClose,
+                    "aria-label": "Close panel",
+                    className: styles.round,
+                    children: /* @__PURE__ */ jsx(X, { size: 18 })
+                  }
+                ),
+                actions && /* @__PURE__ */ jsx("div", { className: styles.headActions, children: actions })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: styles.body, children: [
+                /* @__PURE__ */ jsxs("header", { className: styles.header, children: [
+                  media && /* @__PURE__ */ jsx("div", { className: styles.media, children: media }),
+                  /* @__PURE__ */ jsxs("div", { className: styles.identity, children: [
+                    /* @__PURE__ */ jsx("h2", { className: styles.title, children: title }),
+                    subtitle && /* @__PURE__ */ jsx("div", { className: styles.subtitle, children: subtitle }),
+                    meta && /* @__PURE__ */ jsx("div", { className: styles.meta, children: meta })
+                  ] })
+                ] }),
+                children
+              ] }),
+              footer && /* @__PURE__ */ jsx("footer", { className: styles.footer, children: footer })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  Drawer
+};
+//# sourceMappingURL=drawer.js.map

package/dist/admin/_ui/drawer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/_ui/drawer.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useState, type ReactNode } from 'react';\nimport { X } from 'lucide-react';\nimport styles from './drawer.module.css';\n\n/**\n * Right-docked sheet in the Square manner: full height, the list it came from\n * still visible beside it, round controls on a toolbar, a large title that\n * scrolls with the record, decisions pinned in the footer. Springs in, eases\n * out, closes on Escape or a click back on the page.\n */\nexport function Drawer({\n  open,\n  onClose,\n  title,\n  subtitle,\n  media,\n  meta,\n  actions,\n  children,\n  footer,\n  width = 480,\n}: {\n  open: boolean;\n  onClose: () => void;\n  title: ReactNode;\n  subtitle?: ReactNode;\n  /** Avatar or logo beside the title. */\n  media?: ReactNode;\n  /** Status pills under the title. */\n  meta?: ReactNode;\n  /** Quick actions in the header, left of the close button. */\n  actions?: ReactNode;\n  children: ReactNode;\n  footer?: ReactNode;\n  width?: number;\n}) {\n  const [mounted, setMounted] = useState(open);\n\n  if (open && !mounted) setMounted(true);\n\n  useEffect(() => {\n    if (!open) return;\n\n    const onKey = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') onClose();\n    };\n\n    window.addEventListener('keydown', onKey);\n\n    return () => window.removeEventListener('keydown', onKey);\n  }, [open, onClose]);\n\n  if (!mounted) return null;\n\n  return (\n    <div\n      role=\"dialog\"\n      aria-modal=\"true\"\n      className={styles.root}\n      data-state={open ? 'open' : 'closed'}\n    >\n      {/* No veil: the list stays readable beside the record (Square). */}\n      <div onClick={onClose} className={styles.scrim} />\n      <aside\n        className={styles.sheet}\n        style={{ width }}\n        onAnimationEnd={(event) => {\n          // Unmount once the exit (timed by --adm-exit) has played.\n          if (!open && event.target === event.currentTarget) setMounted(false);\n        }}\n      >\n        <div className={styles.toolbar}>\n          <button\n            type=\"button\"\n            onClick={onClose}\n            aria-label=\"Close panel\"\n            className={styles.round}\n          >\n            <X size={18} />\n          </button>\n          {actions && <div className={styles.headActions}>{actions}</div>}\n        </div>\n        <div className={styles.body}>\n          <header className={styles.header}>\n            {media && <div className={styles.media}>{media}</div>}\n            <div className={styles.identity}>\n              <h2 className={styles.title}>{title}</h2>\n              {subtitle && <div className={styles.subtitle}>{subtitle}</div>}\n              {meta && <div className={styles.meta}>{meta}</div>}\n            </div>\n          </header>\n          {children}\n        </div>\n        {footer && <footer className={styles.footer}>{footer}</footer>}\n      </aside>\n    </div>\n  );\n}\n"],"mappings":";AAgEM,cASE,YATF;AA9DN,SAAS,WAAW,gBAAgC;AACpD,SAAS,SAAS;AAClB,OAAO,YAAY;AAQZ,SAAS,OAAO;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AACV,GAcG;AACD,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,IAAI;AAE3C,MAAI,QAAQ,CAAC,QAAS,YAAW,IAAI;AAErC,YAAU,MAAM;AACd,QAAI,CAAC,KAAM;AAEX,UAAM,QAAQ,CAAC,MAAqB;AAClC,UAAI,EAAE,QAAQ,SAAU,SAAQ;AAAA,IAClC;AAEA,WAAO,iBAAiB,WAAW,KAAK;AAExC,WAAO,MAAM,OAAO,oBAAoB,WAAW,KAAK;AAAA,EAC1D,GAAG,CAAC,MAAM,OAAO,CAAC;AAElB,MAAI,CAAC,QAAS,QAAO;AAErB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,cAAW;AAAA,MACX,WAAW,OAAO;AAAA,MAClB,cAAY,OAAO,SAAS;AAAA,MAG5B;AAAA,4BAAC,SAAI,SAAS,SAAS,WAAW,OAAO,OAAO;AAAA,QAChD;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,OAAO;AAAA,YAClB,OAAO,EAAE,MAAM;AAAA,YACf,gBAAgB,CAAC,UAAU;AAEzB,kBAAI,CAAC,QAAQ,MAAM,WAAW,MAAM,cAAe,YAAW,KAAK;AAAA,YACrE;AAAA,YAEA;AAAA,mCAAC,SAAI,WAAW,OAAO,SACrB;AAAA;AAAA,kBAAC;AAAA;AAAA,oBACC,MAAK;AAAA,oBACL,SAAS;AAAA,oBACT,cAAW;AAAA,oBACX,WAAW,OAAO;AAAA,oBAElB,8BAAC,KAAE,MAAM,IAAI;AAAA;AAAA,gBACf;AAAA,gBACC,WAAW,oBAAC,SAAI,WAAW,OAAO,aAAc,mBAAQ;AAAA,iBAC3D;AAAA,cACA,qBAAC,SAAI,WAAW,OAAO,MACrB;AAAA,qCAAC,YAAO,WAAW,OAAO,QACvB;AAAA,2BAAS,oBAAC,SAAI,WAAW,OAAO,OAAQ,iBAAM;AAAA,kBAC/C,qBAAC,SAAI,WAAW,OAAO,UACrB;AAAA,wCAAC,QAAG,WAAW,OAAO,OAAQ,iBAAM;AAAA,oBACnC,YAAY,oBAAC,SAAI,WAAW,OAAO,UAAW,oBAAS;AAAA,oBACvD,QAAQ,oBAAC,SAAI,WAAW,OAAO,MAAO,gBAAK;AAAA,qBAC9C;AAAA,mBACF;AAAA,gBACC;AAAA,iBACH;AAAA,cACC,UAAU,oBAAC,YAAO,WAAW,OAAO,QAAS,kBAAO;AAAA;AAAA;AAAA,QACvD;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/admin/_ui/drawer.module.css

@@ -0,0 +1,157 @@
+/* Docked side sheet: full height, no frame around the page behind it. */
+
+.root {
+  position: fixed;
+  inset: 0;
+  z-index: 50;
+  display: flex;
+  justify-content: flex-end;
+}
+
+/* A light veil: the list stays readable, a click on it closes the sheet. */
+.scrim {
+  position: absolute;
+  inset: 0;
+  animation: scrim-in var(--adm-moderate) both;
+}
+
+.sheet {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  max-width: 100vw;
+  height: 100%;
+  overflow: hidden;
+  background: var(--card-bg);
+  box-shadow: var(--adm-shadow-sheet);
+  animation: sheet-in var(--adm-moderate) both;
+}
+
+.root[data-state='closed'] .scrim {
+  animation: scrim-out var(--adm-exit) both;
+}
+
+.root[data-state='closed'] .sheet {
+  animation: sheet-out var(--adm-exit) both;
+}
+
+@keyframes scrim-in {
+  from {
+    opacity: 0;
+  }
+}
+
+@keyframes scrim-out {
+  to {
+    opacity: 0;
+  }
+}
+
+@keyframes sheet-in {
+  from {
+    opacity: 0.4;
+    transform: translateX(32px);
+  }
+}
+
+@keyframes sheet-out {
+  to {
+    opacity: 0;
+    transform: translateX(24px);
+  }
+}
+
+.toolbar {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  padding: 20px 24px 8px;
+}
+
+.headActions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.round {
+  display: grid;
+  place-items: center;
+  width: 40px;
+  height: 40px;
+  border-radius: 999px;
+  background: var(--adm-hover);
+  color: var(--text-primary);
+  cursor: pointer;
+  transition: background var(--adm-fast);
+}
+
+.round:hover {
+  background: color-mix(in srgb, var(--text-primary) 10%, transparent);
+}
+
+.header {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  padding: 16px 0 24px;
+}
+
+.media {
+  flex-shrink: 0;
+}
+
+.identity {
+  flex: 1;
+  min-width: 0;
+}
+
+.title {
+  margin: 0;
+  overflow: hidden;
+  font-family: var(--font-display);
+  font-size: 28px;
+  font-weight: 600;
+  letter-spacing: -0.02em;
+  line-height: 36px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.subtitle {
+  margin-top: 4px;
+  overflow: hidden;
+  font-size: 14px;
+  line-height: 20px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: var(--text-secondary);
+}
+
+.meta {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  margin-top: 12px;
+}
+
+.body {
+  flex: 1;
+  padding: 0 24px 32px;
+  overflow-y: auto;
+}
+
+.footer {
+  display: flex;
+  justify-content: flex-end;
+  gap: 8px;
+  padding: 16px 24px;
+  border-top: 1px solid var(--border-subtle);
+}
+
+@media (max-width: 640px) {
+  .sheet {
+    width: 100vw !important;
+  }
+}

package/dist/admin/_ui/empty-state.js

@@ -0,0 +1,47 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+function EmptyState({
+  title,
+  description,
+  action,
+  tone = "muted"
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        justifyContent: "center",
+        gap: 4,
+        padding: "24px 16px",
+        textAlign: "center"
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: {
+              fontSize: 13,
+              fontWeight: 500,
+              color: tone === "error" ? "var(--error)" : "var(--text-secondary)"
+            },
+            children: title
+          }
+        ),
+        description && /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: { fontSize: 12, color: "var(--text-tertiary)", maxWidth: 360 },
+            children: description
+          }
+        ),
+        action && /* @__PURE__ */ jsx("div", { style: { marginTop: 8 }, children: action })
+      ]
+    }
+  );
+}
+export {
+  EmptyState
+};
+//# sourceMappingURL=empty-state.js.map

package/dist/admin/_ui/empty-state.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/_ui/empty-state.tsx"],"sourcesContent":["import type { ComponentType, ReactNode } from 'react';\n\n/**\n * Centred empty / error state for tables and panels: plain words and at most\n * one action, no art. `icon` is accepted and ignored so older callers (and\n * `emptyIcon` on DataTable / ListCard) compile; empty states carry no icon.\n */\nexport function EmptyState({\n  title,\n  description,\n  action,\n  tone = 'muted',\n}: {\n  icon?: ComponentType<{ size?: number; color?: string }>;\n  title: string;\n  description?: string;\n  action?: ReactNode;\n  tone?: 'muted' | 'error';\n}) {\n  return (\n    <div\n      style={{\n        display: 'flex',\n        flexDirection: 'column',\n        alignItems: 'center',\n        justifyContent: 'center',\n        gap: 4,\n        padding: '24px 16px',\n        textAlign: 'center',\n      }}\n    >\n      <div\n        style={{\n          fontSize: 13,\n          fontWeight: 500,\n          color: tone === 'error' ? 'var(--error)' : 'var(--text-secondary)',\n        }}\n      >\n        {title}\n      </div>\n      {description && (\n        <div\n          style={{ fontSize: 12, color: 'var(--text-tertiary)', maxWidth: 360 }}\n        >\n          {description}\n        </div>\n      )}\n      {action && <div style={{ marginTop: 8 }}>{action}</div>}\n    </div>\n  );\n}\n"],"mappings":"AAoBI,SAWE,KAXF;AAbG,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AACT,GAMG;AACD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,QACL,SAAS;AAAA,QACT,eAAe;AAAA,QACf,YAAY;AAAA,QACZ,gBAAgB;AAAA,QAChB,KAAK;AAAA,QACL,SAAS;AAAA,QACT,WAAW;AAAA,MACb;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,OAAO;AAAA,cACL,UAAU;AAAA,cACV,YAAY;AAAA,cACZ,OAAO,SAAS,UAAU,iBAAiB;AAAA,YAC7C;AAAA,YAEC;AAAA;AAAA,QACH;AAAA,QACC,eACC;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,EAAE,UAAU,IAAI,OAAO,wBAAwB,UAAU,IAAI;AAAA,YAEnE;AAAA;AAAA,QACH;AAAA,QAED,UAAU,oBAAC,SAAI,OAAO,EAAE,WAAW,EAAE,GAAI,kBAAO;AAAA;AAAA;AAAA,EACnD;AAEJ;","names":[]}

package/dist/admin/_ui/filter-bar.js

@@ -0,0 +1,24 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Filters, FilterSearch } from "./filters";
+function FilterBar({
+  search,
+  onSearch,
+  placeholder = "Search\u2026",
+  children
+}) {
+  return /* @__PURE__ */ jsxs(Filters, { label: "Filter", className: "mb-4", children: [
+    /* @__PURE__ */ jsx(
+      FilterSearch,
+      {
+        value: search,
+        onChange: onSearch,
+        placeholder
+      }
+    ),
+    children
+  ] });
+}
+export {
+  FilterBar
+};
+//# sourceMappingURL=filter-bar.js.map

package/dist/admin/_ui/filter-bar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/_ui/filter-bar.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { Filters, FilterSearch } from './filters';\n\n/**\n * Filter row for list pages: a search box plus optional trailing controls\n * (status selects, etc.), on the console's one toolbar.\n */\nexport function FilterBar({\n  search,\n  onSearch,\n  placeholder = 'Search…',\n  children,\n}: {\n  search: string;\n  onSearch: (value: string) => void;\n  placeholder?: string;\n  children?: ReactNode;\n}) {\n  return (\n    <Filters label=\"Filter\" className=\"mb-4\">\n      <FilterSearch\n        value={search}\n        onChange={onSearch}\n        placeholder={placeholder}\n      />\n      {children}\n    </Filters>\n  );\n}\n"],"mappings":"AAmBI,SACE,KADF;AAlBJ,SAAS,SAAS,oBAAoB;AAM/B,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd;AACF,GAKG;AACD,SACE,qBAAC,WAAQ,OAAM,UAAS,WAAU,QAChC;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP,UAAU;AAAA,QACV;AAAA;AAAA,IACF;AAAA,IACC;AAAA,KACH;AAEJ;","names":[]}

package/dist/admin/_ui/filter-dates.js

@@ -0,0 +1,67 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { DateField } from "@withpotter/ui-kit";
+import { cn } from "@withpotter/lib/utils";
+import styles from "./filters.module.css";
+const face = (on) => cn(
+  "h-7 py-0 rounded-lg",
+  on && "border-[var(--adm-tint-line)] bg-[var(--adm-tint)] [&>span]:text-[var(--adm-tint-ink)]"
+);
+function FilterDate({
+  value,
+  onChange,
+  label,
+  min,
+  max
+}) {
+  return /* @__PURE__ */ jsx(
+    DateField,
+    {
+      size: "sm",
+      "aria-label": label,
+      placeholder: label,
+      value,
+      min,
+      max,
+      onChange,
+      className: styles.date,
+      faceClassName: face(!!value)
+    }
+  );
+}
+function FilterDates({
+  from,
+  to,
+  onFrom,
+  onTo,
+  fromLabel = "From",
+  toLabel = "To",
+  label = "Date range"
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: styles.dates, role: "group", "aria-label": label, children: [
+    /* @__PURE__ */ jsx(
+      FilterDate,
+      {
+        label: fromLabel,
+        value: from,
+        max: to || void 0,
+        onChange: onFrom
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { className: styles.dash, "aria-hidden": true, children: "\u2013" }),
+    /* @__PURE__ */ jsx(
+      FilterDate,
+      {
+        label: toLabel,
+        value: to,
+        min: from || void 0,
+        onChange: onTo
+      }
+    )
+  ] });
+}
+export {
+  FilterDate,
+  FilterDates
+};
+//# sourceMappingURL=filter-dates.js.map

package/dist/admin/_ui/filter-dates.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/_ui/filter-dates.tsx"],"sourcesContent":["'use client';\n\nimport { DateField } from '@withpotter/ui-kit';\nimport { cn } from '@withpotter/lib/utils';\nimport styles from './filters.module.css';\n\n/** The date face is not reachable by token, so its look goes in as classes. */\nconst face = (on: boolean) =>\n  cn(\n    'h-7 py-0 rounded-lg',\n    on &&\n      'border-[var(--adm-tint-line)] bg-[var(--adm-tint)] [&>span]:text-[var(--adm-tint-ink)]',\n  );\n\nexport function FilterDate({\n  value,\n  onChange,\n  label,\n  min,\n  max,\n}: {\n  value: string;\n  onChange: (value: string) => void;\n  label: string;\n  min?: string;\n  max?: string;\n}) {\n  return (\n    <DateField\n      size=\"sm\"\n      aria-label={label}\n      placeholder={label}\n      value={value}\n      min={min}\n      max={max}\n      onChange={onChange}\n      className={styles.date}\n      faceClassName={face(!!value)}\n    />\n  );\n}\n\n/** From – To as one unit that never splits across rows. */\nexport function FilterDates({\n  from,\n  to,\n  onFrom,\n  onTo,\n  fromLabel = 'From',\n  toLabel = 'To',\n  label = 'Date range',\n}: {\n  from: string;\n  to: string;\n  onFrom: (value: string) => void;\n  onTo: (value: string) => void;\n  fromLabel?: string;\n  toLabel?: string;\n  label?: string;\n}) {\n  return (\n    <div className={styles.dates} role=\"group\" aria-label={label}>\n      <FilterDate\n        label={fromLabel}\n        value={from}\n        max={to || undefined}\n        onChange={onFrom}\n      />\n      <span className={styles.dash} aria-hidden>\n        –\n      </span>\n      <FilterDate\n        label={toLabel}\n        value={to}\n        min={from || undefined}\n        onChange={onTo}\n      />\n    </div>\n  );\n}\n"],"mappings":";AA4BI,cAiCA,YAjCA;AA1BJ,SAAS,iBAAiB;AAC1B,SAAS,UAAU;AACnB,OAAO,YAAY;AAGnB,MAAM,OAAO,CAAC,OACZ;AAAA,EACE;AAAA,EACA,MACE;AACJ;AAEK,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAMG;AACD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,cAAY;AAAA,MACZ,aAAa;AAAA,MACb;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW,OAAO;AAAA,MAClB,eAAe,KAAK,CAAC,CAAC,KAAK;AAAA;AAAA,EAC7B;AAEJ;AAGO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,QAAQ;AACV,GAQG;AACD,SACE,qBAAC,SAAI,WAAW,OAAO,OAAO,MAAK,SAAQ,cAAY,OACrD;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP,OAAO;AAAA,QACP,KAAK,MAAM;AAAA,QACX,UAAU;AAAA;AAAA,IACZ;AAAA,IACA,oBAAC,UAAK,WAAW,OAAO,MAAM,eAAW,MAAC,oBAE1C;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP,OAAO;AAAA,QACP,KAAK,QAAQ;AAAA,QACb,UAAU;AAAA;AAAA,IACZ;AAAA,KACF;AAEJ;","names":[]}