@arbidocs/blocks 0.3.184 → 0.4.0

package/dist/chunk-UFHMLHIR.cjs

@@ -0,0 +1,66 @@
+"use client";
+'use strict';
+
+var chunkWJMEXTVD_cjs = require('./chunk-WJMEXTVD.cjs');
+var lucideReact = require('lucide-react');
+var ui = require('@arbidocs/react/ui');
+var jsxRuntime = require('react/jsx-runtime');
+
+var MAX_DEFAULT = 3;
+function MemberAvatarStack({
+  members,
+  total,
+  max = MAX_DEFAULT,
+  hidden = false,
+  onClick,
+  expanded = false,
+  ringClassName = "border-card",
+  className,
+  testId
+}) {
+  const count = total ?? members.length;
+  const shown = hidden ? [] : members.slice(0, max);
+  const extra = count - shown.length;
+  const faces = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    hidden ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-muted-foreground", children: "\u2014" }) : shown.map((m, i) => /* @__PURE__ */ jsxRuntime.jsxs(ui.Avatar, { className: ui.cn("size-6 border-2", ringClassName), title: m.name, children: [
+      m.picture && /* @__PURE__ */ jsxRuntime.jsx(ui.AvatarImage, { src: m.picture, alt: m.name }),
+      /* @__PURE__ */ jsxRuntime.jsx(ui.AvatarFallback, { className: "bg-foreground text-xs font-medium text-background", children: chunkWJMEXTVD_cjs.initials(m.name || "?") })
+    ] }, i)),
+    !hidden && extra > 0 && /* @__PURE__ */ jsxRuntime.jsx(ui.Avatar, { className: ui.cn("size-6 border-2", ringClassName), children: /* @__PURE__ */ jsxRuntime.jsxs(ui.AvatarFallback, { className: "bg-accent text-xs font-medium text-muted-foreground", children: [
+      "+",
+      extra
+    ] }) })
+  ] });
+  if (!onClick) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: ui.cn("flex shrink-0 -space-x-2", className), "data-testid": testId, children: faces });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      type: "button",
+      onClick,
+      "aria-expanded": expanded,
+      className: ui.cn(
+        "flex shrink-0 cursor-pointer items-center gap-1.5 rounded-full py-0.5 pl-0.5 pr-1.5 transition-colors hover:bg-accent/60 pointer-coarse:min-h-11 pointer-coarse:pr-3",
+        className
+      ),
+      "data-testid": testId,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex -space-x-2", children: faces }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          lucideReact.ChevronDown,
+          {
+            className: ui.cn(
+              "size-3.5 text-muted-foreground transition-transform",
+              expanded && "rotate-180"
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+
+exports.MemberAvatarStack = MemberAvatarStack;
+//# sourceMappingURL=chunk-UFHMLHIR.cjs.map
+//# sourceMappingURL=chunk-UFHMLHIR.cjs.map

package/dist/chunk-UFHMLHIR.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/MemberAvatarStack.tsx"],"names":["jsxs","Fragment","jsx","Avatar","cn","AvatarImage","AvatarFallback","ChevronDown"],"mappings":";;;;;;;AAgCA,IAAM,WAAA,GAAc,CAAA;AAWb,SAAS,iBAAA,CAAkB;AAAA,EAChC,OAAA;AAAA,EACA,KAAA;AAAA,EACA,GAAA,GAAM,WAAA;AAAA,EACN,MAAA,GAAS,KAAA;AAAA,EACT,OAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,aAAA,GAAgB,aAAA;AAAA,EAChB,SAAA;AAAA,EACA;AACF,CAAA,EAA2B;AACzB,EAAA,MAAM,KAAA,GAAQ,SAAS,OAAA,CAAQ,MAAA;AAC/B,EAAA,MAAM,QAAQ,MAAA,GAAS,KAAK,OAAA,CAAQ,KAAA,CAAM,GAAG,GAAG,CAAA;AAChD,EAAA,MAAM,KAAA,GAAQ,QAAQ,KAAA,CAAM,MAAA;AAE5B,EAAA,MAAM,wBACJA,eAAA,CAAAC,mBAAA,EAAA,EACG,QAAA,EAAA;AAAA,IAAA,MAAA,mBACCC,cAAA,CAAC,UAAK,SAAA,EAAU,+BAAA,EAAgC,oBAAC,CAAA,GAEjD,KAAA,CAAM,IAAI,CAAC,CAAA,EAAG,sBACZF,eAAA,CAACG,SAAA,EAAA,EAAe,WAAWC,KAAA,CAAG,iBAAA,EAAmB,aAAa,CAAA,EAAG,KAAA,EAAO,EAAE,IAAA,EACvE,QAAA,EAAA;AAAA,MAAA,CAAA,CAAE,OAAA,mCAAYC,cAAA,EAAA,EAAY,GAAA,EAAK,EAAE,OAAA,EAAS,GAAA,EAAK,EAAE,IAAA,EAAM,CAAA;AAAA,sBACxDH,cAAA,CAACI,qBAAe,SAAA,EAAU,mDAAA,EACvB,qCAAS,CAAA,CAAE,IAAA,IAAQ,GAAG,CAAA,EACzB;AAAA,KAAA,EAAA,EAJW,CAKb,CACD,CAAA;AAAA,IAEF,CAAC,MAAA,IAAU,KAAA,GAAQ,CAAA,mCACjBH,SAAA,EAAA,EAAO,SAAA,EAAWC,KAAA,CAAG,iBAAA,EAAmB,aAAa,CAAA,EACpD,QAAA,kBAAAJ,eAAA,CAACM,iBAAA,EAAA,EAAe,WAAU,qDAAA,EAAsD,QAAA,EAAA;AAAA,MAAA,GAAA;AAAA,MAC5E;AAAA,KAAA,EACJ,CAAA,EACF;AAAA,GAAA,EAEJ,CAAA;AAGF,EAAA,IAAI,CAAC,OAAA,EAAS;AACZ,IAAA,uBACEJ,cAAA,CAAC,SAAI,SAAA,EAAWE,KAAA,CAAG,4BAA4B,SAAS,CAAA,EAAG,aAAA,EAAa,MAAA,EACrE,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,EAEJ;AAEA,EAAA,uBACEJ,eAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,QAAA;AAAA,MACL,OAAA;AAAA,MACA,eAAA,EAAe,QAAA;AAAA,MACf,SAAA,EAAWI,KAAA;AAAA,QACT,sKAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,aAAA,EAAa,MAAA;AAAA,MAEb,QAAA,EAAA;AAAA,wBAAAF,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,iBAAA,EAAmB,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,wBACzCA,cAAA;AAAA,UAACK,uBAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAWH,KAAA;AAAA,cACT,qDAAA;AAAA,cACA,QAAA,IAAY;AAAA;AACd;AAAA;AACF;AAAA;AAAA,GACF;AAEJ","file":"chunk-UFHMLHIR.cjs","sourcesContent":["import { ChevronDown } from 'lucide-react'\nimport { Avatar, AvatarFallback, AvatarImage, cn } from '@arbidocs/react/ui'\nimport { initials } from '../lib/format'\n\n/** One face in the stack — source-agnostic, not a raw SDK user. */\nexport interface StackedMember {\n  name: string\n  picture?: string | null\n}\n\nexport interface MemberAvatarStackProps {\n  members: StackedMember[]\n  /** Total, when it exceeds what's shown. Defaults to `members.length`. */\n  total?: number\n  /** Faces before the rest collapse into a `+N`. */\n  max?: number\n  /**\n   * The viewer isn't allowed to see who is here (e.g. row-level security hides\n   * the members of a public workspace you haven't joined). Renders an em dash\n   * rather than lying with an empty stack.\n   */\n  hidden?: boolean\n  /** Makes the stack a button — e.g. to expand the member list below it. */\n  onClick?: () => void\n  /** Rotates the chevron and drives `aria-expanded` when it is a toggle. */\n  expanded?: boolean\n  /** Ring colour behind each face; match the surface it sits on. */\n  ringClassName?: string\n  className?: string\n  testId?: string\n}\n\nconst MAX_DEFAULT = 3\n\n/**\n * An overlapping stack of member faces, with the overflow collapsed to `+N`.\n *\n * Lives here rather than inside a card because \"who is in this thing\" is shown\n * in more than one place — a workspace card, a workspace's own header — and\n * those had drawn it twice. Given `onClick` it becomes the control that expands\n * the full list, which is a better affordance than a button labelled \"Members\"\n * beside the very faces it would reveal.\n */\nexport function MemberAvatarStack({\n  members,\n  total,\n  max = MAX_DEFAULT,\n  hidden = false,\n  onClick,\n  expanded = false,\n  ringClassName = 'border-card',\n  className,\n  testId,\n}: MemberAvatarStackProps) {\n  const count = total ?? members.length\n  const shown = hidden ? [] : members.slice(0, max)\n  const extra = count - shown.length\n\n  const faces = (\n    <>\n      {hidden ? (\n        <span className=\"text-sm text-muted-foreground\">—</span>\n      ) : (\n        shown.map((m, i) => (\n          <Avatar key={i} className={cn('size-6 border-2', ringClassName)} title={m.name}>\n            {m.picture && <AvatarImage src={m.picture} alt={m.name} />}\n            <AvatarFallback className=\"bg-foreground text-xs font-medium text-background\">\n              {initials(m.name || '?')}\n            </AvatarFallback>\n          </Avatar>\n        ))\n      )}\n      {!hidden && extra > 0 && (\n        <Avatar className={cn('size-6 border-2', ringClassName)}>\n          <AvatarFallback className=\"bg-accent text-xs font-medium text-muted-foreground\">\n            +{extra}\n          </AvatarFallback>\n        </Avatar>\n      )}\n    </>\n  )\n\n  if (!onClick) {\n    return (\n      <div className={cn('flex shrink-0 -space-x-2', className)} data-testid={testId}>\n        {faces}\n      </div>\n    )\n  }\n\n  return (\n    <button\n      type=\"button\"\n      onClick={onClick}\n      aria-expanded={expanded}\n      className={cn(\n        'flex shrink-0 cursor-pointer items-center gap-1.5 rounded-full py-0.5 pl-0.5 pr-1.5 transition-colors hover:bg-accent/60 pointer-coarse:min-h-11 pointer-coarse:pr-3',\n        className\n      )}\n      data-testid={testId}\n    >\n      <span className=\"flex -space-x-2\">{faces}</span>\n      <ChevronDown\n        className={cn(\n          'size-3.5 text-muted-foreground transition-transform',\n          expanded && 'rotate-180'\n        )}\n      />\n    </button>\n  )\n}\n"]}

package/dist/chunk-UJE32SST.js

@@ -0,0 +1,39 @@
+"use client";
+import { XCircle, AlertTriangle, CheckCircle2, Info } from 'lucide-react';
+import { cn } from '@arbidocs/react/ui';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/components/Callout.tsx
+var STYLES = {
+  info: { wrap: "border-primary/30 bg-primary/5", icon: "text-primary", Icon: Info },
+  success: { wrap: "border-success/30 bg-success/10", icon: "text-success", Icon: CheckCircle2 },
+  warning: { wrap: "border-warning/40 bg-warning/10", icon: "text-warning", Icon: AlertTriangle },
+  danger: {
+    wrap: "border-destructive/30 bg-destructive/10",
+    icon: "text-destructive",
+    Icon: XCircle
+  }
+};
+function Callout({ variant = "info", title, body, testId }) {
+  const style = STYLES[variant] ?? STYLES.info;
+  const Icon = style.Icon;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("flex gap-3 rounded-lg border p-4 text-foreground", style.wrap),
+      "data-testid": testId,
+      role: "note",
+      children: [
+        /* @__PURE__ */ jsx(Icon, { className: cn("mt-0.5 size-5 shrink-0", style.icon), "aria-hidden": true }),
+        /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+          title && /* @__PURE__ */ jsx("p", { className: "font-semibold", children: title }),
+          body && /* @__PURE__ */ jsx("p", { className: "text-sm leading-relaxed text-muted-foreground", children: body })
+        ] })
+      ]
+    }
+  );
+}
+
+export { Callout };
+//# sourceMappingURL=chunk-UJE32SST.js.map
+//# sourceMappingURL=chunk-UJE32SST.js.map

package/dist/chunk-UJE32SST.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Callout.tsx"],"names":[],"mappings":";;;;;AAaA,IAAM,MAAA,GAAmF;AAAA,EACvF,MAAM,EAAE,IAAA,EAAM,kCAAkC,IAAA,EAAM,cAAA,EAAgB,MAAM,IAAA,EAAK;AAAA,EACjF,SAAS,EAAE,IAAA,EAAM,mCAAmC,IAAA,EAAM,cAAA,EAAgB,MAAM,YAAA,EAAa;AAAA,EAC7F,SAAS,EAAE,IAAA,EAAM,mCAAmC,IAAA,EAAM,cAAA,EAAgB,MAAM,aAAA,EAAc;AAAA,EAC9F,MAAA,EAAQ;AAAA,IACN,IAAA,EAAM,yCAAA;AAAA,IACN,IAAA,EAAM,kBAAA;AAAA,IACN,IAAA,EAAM;AAAA;AAEV,CAAA;AAGO,SAAS,QAAQ,EAAE,OAAA,GAAU,QAAQ,KAAA,EAAO,IAAA,EAAM,QAAO,EAAiB;AAC/E,EAAA,MAAM,KAAA,GAAQ,MAAA,CAAO,OAAO,CAAA,IAAK,MAAA,CAAO,IAAA;AACxC,EAAA,MAAM,OAAO,KAAA,CAAM,IAAA;AACnB,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA,CAAG,kDAAA,EAAoD,KAAA,CAAM,IAAI,CAAA;AAAA,MAC5E,aAAA,EAAa,MAAA;AAAA,MACb,IAAA,EAAK,MAAA;AAAA,MAEL,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,WAAW,EAAA,CAAG,wBAAA,EAA0B,MAAM,IAAI,CAAA,EAAG,eAAW,IAAA,EAAC,CAAA;AAAA,wBACvE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,SAAA,EACZ,QAAA,EAAA;AAAA,UAAA,KAAA,oBAAS,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,eAAA,EAAiB,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,UAC7C,IAAA,oBAAQ,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,iDAAiD,QAAA,EAAA,IAAA,EAAK;AAAA,SAAA,EAC9E;AAAA;AAAA;AAAA,GACF;AAEJ","file":"chunk-UJE32SST.js","sourcesContent":["import type { LucideIcon } from 'lucide-react'\nimport { AlertTriangle, CheckCircle2, Info, XCircle } from 'lucide-react'\nimport { cn } from '@arbidocs/react/ui'\n\nexport type CalloutVariant = 'info' | 'success' | 'warning' | 'danger'\n\nexport interface CalloutProps {\n  variant?: CalloutVariant\n  title?: string\n  body?: string\n  testId?: string\n}\n\nconst STYLES: Record<CalloutVariant, { wrap: string; icon: string; Icon: LucideIcon }> = {\n  info: { wrap: 'border-primary/30 bg-primary/5', icon: 'text-primary', Icon: Info },\n  success: { wrap: 'border-success/30 bg-success/10', icon: 'text-success', Icon: CheckCircle2 },\n  warning: { wrap: 'border-warning/40 bg-warning/10', icon: 'text-warning', Icon: AlertTriangle },\n  danger: {\n    wrap: 'border-destructive/30 bg-destructive/10',\n    icon: 'text-destructive',\n    Icon: XCircle,\n  },\n}\n\n/** Inline notice box in one of four semantic tones. */\nexport function Callout({ variant = 'info', title, body, testId }: CalloutProps) {\n  const style = STYLES[variant] ?? STYLES.info\n  const Icon = style.Icon\n  return (\n    <div\n      className={cn('flex gap-3 rounded-lg border p-4 text-foreground', style.wrap)}\n      data-testid={testId}\n      role=\"note\"\n    >\n      <Icon className={cn('mt-0.5 size-5 shrink-0', style.icon)} aria-hidden />\n      <div className=\"min-w-0\">\n        {title && <p className=\"font-semibold\">{title}</p>}\n        {body && <p className=\"text-sm leading-relaxed text-muted-foreground\">{body}</p>}\n      </div>\n    </div>\n  )\n}\n"]}

package/dist/chunk-ULWRNGGE.cjs

@@ -0,0 +1,146 @@
+"use client";
+'use strict';
+
+var ui = require('@arbidocs/react/ui');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/settings/ModalScaffold.tsx
+function useRestoreFocus() {
+  const origin = react.useRef(null);
+  return react.useMemo(
+    () => ({
+      onOpenAutoFocus: () => {
+        origin.current = document.activeElement instanceof HTMLElement ? document.activeElement : null;
+      },
+      onCloseAutoFocus: (event) => {
+        const element = origin.current;
+        origin.current = null;
+        if (element && element.isConnected && element !== document.body) {
+          event.preventDefault();
+          element.focus();
+        }
+      }
+    }),
+    []
+  );
+}
+var MODAL_SECTION_TITLE_CLASS = "mb-2 flex items-center gap-1 text-sm font-medium text-muted-foreground";
+function ModalHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ui.DialogHeader,
+    {
+      "data-slot": "modal-header",
+      className: ui.cn("flex-shrink-0 rounded-t-lg bg-transparent p-6 pb-3 pr-12", className),
+      ...props
+    }
+  );
+}
+function ModalSection({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "modal-section", className: ui.cn("pt-4", className), ...props });
+}
+function ModalSectionTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "modal-section-title",
+      className: ui.cn(MODAL_SECTION_TITLE_CLASS, className),
+      ...props
+    }
+  );
+}
+var SIZE_CLASS = {
+  sm: "sm:max-w-sm",
+  md: "sm:max-w-md",
+  lg: "sm:max-w-2xl",
+  xl: "sm:max-w-4xl"
+};
+function ModalBody({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "modal-body", className: ui.cn("space-y-4", className), ...props });
+}
+function ModalFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ui.DialogFooter,
+    {
+      "data-slot": "modal-footer",
+      className: ui.cn(
+        "sticky bottom-0 -mx-6 -mb-6 mt-4 border-t border-border bg-background px-6 py-3",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function ModalScaffold({
+  open,
+  onOpenChange,
+  title,
+  description,
+  showDescription = false,
+  icon,
+  size = "md",
+  presentation,
+  className,
+  testId,
+  role = "dialog",
+  initialFocusRef,
+  dismissible = true,
+  onInteractOutside,
+  onEscapeKeyDown,
+  children
+}) {
+  const restoreFocus = useRestoreFocus();
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    ui.DialogContent,
+    {
+      role,
+      presentation: presentation ?? (size === "lg" || size === "xl" ? "sheet" : "center"),
+      className: ui.cn(SIZE_CLASS[size], "flex flex-col gap-0 overflow-hidden p-0", className),
+      "data-testid": testId,
+      onInteractOutside: (e) => {
+        if (role === "alertdialog" || !dismissible) e.preventDefault();
+        onInteractOutside?.(e);
+      },
+      onEscapeKeyDown: (e) => {
+        if (!dismissible) e.preventDefault();
+        onEscapeKeyDown?.(e);
+      },
+      onOpenAutoFocus: (e) => {
+        restoreFocus.onOpenAutoFocus(e);
+        if (initialFocusRef?.current) {
+          e.preventDefault();
+          initialFocusRef.current.focus();
+        }
+      },
+      onCloseAutoFocus: restoreFocus.onCloseAutoFocus,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(ModalHeader, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.DialogTitle, { className: "flex items-center gap-2", children: [
+            icon,
+            title
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.DialogDescription, { className: showDescription ? void 0 : "sr-only", children: description ?? title })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            "data-slot": "modal-scroll",
+            className: "min-h-0 flex-1 space-y-4 overflow-y-auto overscroll-contain px-6 pb-6",
+            children
+          }
+        )
+      ]
+    }
+  ) });
+}
+ModalScaffold.Body = ModalBody;
+ModalScaffold.Footer = ModalFooter;
+
+exports.MODAL_SECTION_TITLE_CLASS = MODAL_SECTION_TITLE_CLASS;
+exports.ModalHeader = ModalHeader;
+exports.ModalScaffold = ModalScaffold;
+exports.ModalSection = ModalSection;
+exports.ModalSectionTitle = ModalSectionTitle;
+exports.useRestoreFocus = useRestoreFocus;
+//# sourceMappingURL=chunk-ULWRNGGE.cjs.map
+//# sourceMappingURL=chunk-ULWRNGGE.cjs.map

package/dist/chunk-ULWRNGGE.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/useRestoreFocus.ts","../src/settings/ModalScaffold.tsx"],"names":["useRef","useMemo","jsx","DialogHeader","cn","DialogFooter","Dialog","jsxs","DialogContent","DialogTitle","DialogDescription"],"mappings":"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","file":"chunk-ULWRNGGE.cjs","sourcesContent":["import { useMemo, useRef } from 'react'\n\n/**\n * Props for a Radix `DialogContent` that put focus back where it was when the dialog opened.\n *\n * Radix Dialog returns focus to its `Trigger` on close and, when the dialog is opened from state\n * (no `DialogTrigger`, as every controlled dialog in the blocks is), drops it to `<body>`:\n * a keyboard or screen-reader user loses their place. Spread the result on `DialogContent`.\n */\nexport function useRestoreFocus(): {\n  onOpenAutoFocus: (event: Event) => void\n  onCloseAutoFocus: (event: Event) => void\n} {\n  const origin = useRef<HTMLElement | null>(null)\n  return useMemo(\n    () => ({\n      onOpenAutoFocus: () => {\n        // Runs before the dialog moves focus inside, so this is still the opener.\n        origin.current =\n          document.activeElement instanceof HTMLElement ? document.activeElement : null\n      },\n      onCloseAutoFocus: (event: Event) => {\n        const element = origin.current\n        origin.current = null\n        if (element && element.isConnected && element !== document.body) {\n          event.preventDefault()\n          element.focus()\n        }\n      },\n    }),\n    []\n  )\n}\n","import type { ComponentProps, ReactNode, RefObject } from 'react'\nimport {\n  cn,\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n  type DialogPresentation,\n} from '@arbidocs/react/ui'\nimport { useRestoreFocus } from '../lib/useRestoreFocus'\n\n/** Tailwind classes for a modal section heading (also usable on a `Label`). */\nexport const MODAL_SECTION_TITLE_CLASS =\n  'mb-2 flex items-center gap-1 text-sm font-medium text-muted-foreground'\n\n/** Header of a hand-assembled modal: no tinted band, just space. */\nexport function ModalHeader({ className, ...props }: ComponentProps<typeof DialogHeader>) {\n  return (\n    <DialogHeader\n      data-slot=\"modal-header\"\n      className={cn('flex-shrink-0 rounded-t-lg bg-transparent p-6 pb-3 pr-12', className)}\n      {...props}\n    />\n  )\n}\n\n/** A padded group inside a modal body. */\nexport function ModalSection({ className, ...props }: ComponentProps<'div'>) {\n  return <div data-slot=\"modal-section\" className={cn('pt-4', className)} {...props} />\n}\n\n/** Muted label above the content of a {@link ModalSection}. */\nexport function ModalSectionTitle({ className, ...props }: ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"modal-section-title\"\n      className={cn(MODAL_SECTION_TITLE_CLASS, className)}\n      {...props}\n    />\n  )\n}\n\nexport type ModalSize = 'sm' | 'md' | 'lg' | 'xl'\n\nconst SIZE_CLASS: Record<ModalSize, string> = {\n  sm: 'sm:max-w-sm',\n  md: 'sm:max-w-md',\n  lg: 'sm:max-w-2xl',\n  xl: 'sm:max-w-4xl',\n}\n\nexport interface ModalScaffoldProps {\n  open: boolean\n  onOpenChange: (open: boolean) => void\n  title: ReactNode\n  /** Accessible description; visually hidden unless `showDescription`. */\n  description?: ReactNode\n  showDescription?: boolean\n  /** Icon shown before the title. */\n  icon?: ReactNode\n  size?: ModalSize\n  /** Phone presentation; defaults to a bottom sheet for `lg`/`xl`, a centred box otherwise. */\n  presentation?: DialogPresentation\n  className?: string\n  testId?: string\n  /**\n   * `alertdialog` for a destructive or blocking confirmation: announced as an alert, dismissed\n   * only through its own buttons or Escape (not by clicking outside).\n   */\n  role?: 'dialog' | 'alertdialog'\n  /**\n   * Block dismissal by outside click AND Escape; only the dialog's own buttons close it. For a\n   * dialog that shows a secret once (a new API key). Default false. An `alertdialog` already\n   * ignores outside clicks.\n   */\n  dismissible?: boolean\n  /** Called on a pointer/focus interaction outside; `preventDefault()` keeps the dialog open. */\n  onInteractOutside?: (event: Event) => void\n  /** Called on Escape; `preventDefault()` keeps the dialog open. */\n  onEscapeKeyDown?: (event: KeyboardEvent) => void\n  /** Element that receives focus when the dialog opens (an alert dialog focuses its safe action). */\n  initialFocusRef?: RefObject<HTMLElement | null>\n  children?: ReactNode\n}\n\nfunction ModalBody({ className, ...props }: ComponentProps<'div'>) {\n  return <div data-slot=\"modal-body\" className={cn('space-y-4', className)} {...props} />\n}\n\n/**\n * Action row. Stacked full-width on phones (primary action on top), right-aligned on wider\n * screens. Sticks to the bottom of the scrolling dialog body so the actions stay reachable.\n */\nfunction ModalFooter({ className, ...props }: ComponentProps<typeof DialogFooter>) {\n  return (\n    <DialogFooter\n      data-slot=\"modal-footer\"\n      className={cn(\n        'sticky bottom-0 -mx-6 -mb-6 mt-4 border-t border-border bg-background px-6 py-3',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\n/**\n * Standard dialog: icon + title + description header, then the compound\n * `ModalScaffold.Body` / `ModalScaffold.Footer` slots.\n */\nexport function ModalScaffold({\n  open,\n  onOpenChange,\n  title,\n  description,\n  showDescription = false,\n  icon,\n  size = 'md',\n  presentation,\n  className,\n  testId,\n  role = 'dialog',\n  initialFocusRef,\n  dismissible = true,\n  onInteractOutside,\n  onEscapeKeyDown,\n  children,\n}: ModalScaffoldProps) {\n  const restoreFocus = useRestoreFocus()\n  return (\n    <Dialog open={open} onOpenChange={onOpenChange}>\n      <DialogContent\n        role={role}\n        presentation={presentation ?? (size === 'lg' || size === 'xl' ? 'sheet' : 'center')}\n        className={cn(SIZE_CLASS[size], 'flex flex-col gap-0 overflow-hidden p-0', className)}\n        data-testid={testId}\n        onInteractOutside={(e) => {\n          if (role === 'alertdialog' || !dismissible) e.preventDefault()\n          onInteractOutside?.(e)\n        }}\n        onEscapeKeyDown={(e) => {\n          if (!dismissible) e.preventDefault()\n          onEscapeKeyDown?.(e)\n        }}\n        onOpenAutoFocus={(e) => {\n          restoreFocus.onOpenAutoFocus(e)\n          if (initialFocusRef?.current) {\n            e.preventDefault()\n            initialFocusRef.current.focus()\n          }\n        }}\n        onCloseAutoFocus={restoreFocus.onCloseAutoFocus}\n      >\n        <ModalHeader>\n          <DialogTitle className=\"flex items-center gap-2\">\n            {icon}\n            {title}\n          </DialogTitle>\n          <DialogDescription className={showDescription ? undefined : 'sr-only'}>\n            {description ?? title}\n          </DialogDescription>\n        </ModalHeader>\n        <div\n          data-slot=\"modal-scroll\"\n          className=\"min-h-0 flex-1 space-y-4 overflow-y-auto overscroll-contain px-6 pb-6\"\n        >\n          {children}\n        </div>\n      </DialogContent>\n    </Dialog>\n  )\n}\n\nModalScaffold.Body = ModalBody\nModalScaffold.Footer = ModalFooter\n"]}

package/dist/chunk-UTWX2X2A.js

@@ -0,0 +1,165 @@
+"use client";
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import { useMemo } from 'react';
+import { cn } from '@arbidocs/react/ui';
+
+// src/components/CollectionDetail.tsx
+function CollectionDetail({
+  items,
+  slug,
+  getSlug,
+  renderList,
+  renderDetail,
+  renderNotFound
+}) {
+  if (!slug) return /* @__PURE__ */ jsx(Fragment, { children: renderList(items) });
+  const index = items.findIndex((item) => getSlug(item) === slug);
+  if (index === -1) {
+    return /* @__PURE__ */ jsx(Fragment, { children: renderNotFound ? renderNotFound(slug) : /* @__PURE__ */ jsx("p", { role: "status", "data-slot": "collection-not-found", children: "Not found" }) });
+  }
+  return /* @__PURE__ */ jsx(Fragment, { children: renderDetail(items[index], { previous: items[index - 1], next: items[index + 1] }) });
+}
+var W = 440;
+var H = 160;
+var PAD = { top: 8, right: 8, bottom: 22, left: 40 };
+var color = (i) => `hsl(var(--chart-${i % 5 + 1}))`;
+var defaultFormat = (v) => v >= 1e3 ? `${Math.round(v / 100) / 10}k` : String(v);
+function polar(cx, cy, r, angle) {
+  return [cx + r * Math.sin(angle), cy - r * Math.cos(angle)];
+}
+function Chart({
+  type,
+  labels,
+  series,
+  ariaLabel,
+  formatValue = defaultFormat,
+  hideLegend = false,
+  emptyLabel = "No data",
+  className,
+  testId
+}) {
+  const max = useMemo(() => Math.max(...series.flatMap((s) => s.values), 1), [series]);
+  if (!labels.length || !series.length) {
+    return /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: emptyLabel });
+  }
+  const legendItems = type === "pie" ? labels.map((label, i) => ({ label, color: color(i) })) : series.map((s, i) => ({ label: s.label ?? s.key, color: color(i) }));
+  let body;
+  if (type === "pie") {
+    const values = series[0].values;
+    const total = values.reduce((a, b) => a + Math.max(b, 0), 0);
+    const cx = 80;
+    const cy = 80;
+    const r = 72;
+    let angle = 0;
+    body = /* @__PURE__ */ jsx("svg", { viewBox: "0 0 160 160", className: "mx-auto h-40 w-40", role: "img", "aria-label": ariaLabel, children: total > 0 && values.map((v, i) => {
+      const sweep = Math.max(v, 0) / total * Math.PI * 2;
+      if (sweep === 0) return null;
+      const title = `${labels[i]}: ${formatValue(v)}`;
+      if (sweep >= Math.PI * 2 - 1e-6) {
+        return /* @__PURE__ */ jsx("circle", { cx, cy, r, fill: color(i), children: /* @__PURE__ */ jsx("title", { children: title }) }, i);
+      }
+      const [x1, y1] = polar(cx, cy, r, angle);
+      const [x2, y2] = polar(cx, cy, r, angle + sweep);
+      const d = `M${cx},${cy} L${x1},${y1} A${r},${r} 0 ${sweep > Math.PI ? 1 : 0} 1 ${x2},${y2} Z`;
+      angle += sweep;
+      return /* @__PURE__ */ jsx("path", { d, fill: color(i), children: /* @__PURE__ */ jsx("title", { children: title }) }, i);
+    }) });
+  } else {
+    const plotW = W - PAD.left - PAD.right;
+    const plotH = H - PAD.top - PAD.bottom;
+    const y = (v) => PAD.top + plotH - v / max * plotH;
+    const band = plotW / labels.length;
+    const xCenter = (i) => PAD.left + band * i + band / 2;
+    body = /* @__PURE__ */ jsxs("svg", { viewBox: `0 0 ${W} ${H}`, className: "h-auto w-full", role: "img", "aria-label": ariaLabel, children: [
+      [0, max / 2, max].map((v) => /* @__PURE__ */ jsxs("g", { children: [
+        /* @__PURE__ */ jsx(
+          "line",
+          {
+            x1: PAD.left,
+            x2: W - PAD.right,
+            y1: y(v),
+            y2: y(v),
+            className: "stroke-border",
+            strokeDasharray: "2,2"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "text",
+          {
+            x: PAD.left - 4,
+            y: y(v) + 3,
+            textAnchor: "end",
+            className: "fill-muted-foreground text-[9px]",
+            children: formatValue(v)
+          }
+        )
+      ] }, v)),
+      labels.map((label, i) => /* @__PURE__ */ jsx(
+        "text",
+        {
+          x: xCenter(i),
+          y: H - 6,
+          textAnchor: "middle",
+          className: "fill-muted-foreground text-[9px]",
+          children: label
+        },
+        i
+      )),
+      type === "bar" && series.map((s, si) => {
+        const barW = band * 0.7 / series.length;
+        return s.values.map((v, i) => /* @__PURE__ */ jsx(
+          "rect",
+          {
+            x: xCenter(i) - band * 0.7 / 2 + si * barW,
+            y: y(v),
+            width: barW,
+            height: PAD.top + plotH - y(v),
+            fill: color(si),
+            rx: 1.5,
+            children: /* @__PURE__ */ jsx("title", { children: `${labels[i]} ${s.label ?? s.key}: ${formatValue(v)}` })
+          },
+          `${s.key}-${i}`
+        ));
+      }),
+      type === "line" && series.map((s, si) => /* @__PURE__ */ jsxs("g", { children: [
+        /* @__PURE__ */ jsx(
+          "polyline",
+          {
+            fill: "none",
+            stroke: color(si),
+            strokeWidth: 2,
+            points: s.values.map((v, i) => `${xCenter(i)},${y(v)}`).join(" ")
+          }
+        ),
+        s.values.map((v, i) => /* @__PURE__ */ jsx("circle", { cx: xCenter(i), cy: y(v), r: 2.5, fill: color(si), children: /* @__PURE__ */ jsx("title", { children: `${labels[i]} ${s.label ?? s.key}: ${formatValue(v)}` }) }, i))
+      ] }, s.key))
+    ] });
+  }
+  return /* @__PURE__ */ jsxs(
+    "figure",
+    {
+      className: cn("flex flex-col gap-2", className),
+      "data-slot": "chart",
+      "data-type": type,
+      "data-testid": testId,
+      children: [
+        body,
+        !hideLegend && /* @__PURE__ */ jsx("figcaption", { className: "flex flex-wrap justify-center gap-x-4 gap-y-1 text-xs text-muted-foreground", children: legendItems.map((item) => /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              "aria-hidden": "true",
+              className: "inline-block size-2 rounded-full",
+              style: { background: item.color }
+            }
+          ),
+          item.label
+        ] }, item.label)) })
+      ]
+    }
+  );
+}
+
+export { Chart, CollectionDetail };
+//# sourceMappingURL=chunk-UTWX2X2A.js.map
+//# sourceMappingURL=chunk-UTWX2X2A.js.map

package/dist/chunk-UTWX2X2A.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/CollectionDetail.tsx","../src/components/Chart.tsx"],"names":["jsx"],"mappings":"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","file":"chunk-UTWX2X2A.js","sourcesContent":["import type { ReactNode } from 'react'\n\nexport interface CollectionDetailContext<T> {\n  previous?: T\n  next?: T\n}\n\nexport interface CollectionDetailProps<T> {\n  /** The collection, supplied by the host (CMS, files, API...). */\n  items: T[]\n  /** The slug from the host's route. Absent: the list is rendered. */\n  slug?: string\n  getSlug: (item: T) => string\n  renderList: (items: T[]) => ReactNode\n  /** One item's page. `previous` / `next` are the neighbours in `items` order. */\n  renderDetail: (item: T, context: CollectionDetailContext<T>) => ReactNode\n  /** Shown when `slug` matches nothing. */\n  renderNotFound?: (slug: string) => ReactNode\n}\n\n/**\n * The list-and-detail page contract for a collection (people, articles, services...). It owns\n * only the slug lookup; the host owns the route, the data and every pixel of both views, so one\n * route (`/things/:slug?`) serves the list and each detail page.\n */\nexport function CollectionDetail<T>({\n  items,\n  slug,\n  getSlug,\n  renderList,\n  renderDetail,\n  renderNotFound,\n}: CollectionDetailProps<T>) {\n  if (!slug) return <>{renderList(items)}</>\n  const index = items.findIndex((item) => getSlug(item) === slug)\n  if (index === -1) {\n    return (\n      <>\n        {renderNotFound ? (\n          renderNotFound(slug)\n        ) : (\n          <p role=\"status\" data-slot=\"collection-not-found\">\n            Not found\n          </p>\n        )}\n      </>\n    )\n  }\n  return <>{renderDetail(items[index], { previous: items[index - 1], next: items[index + 1] })}</>\n}\n","import { useMemo } from 'react'\nimport { cn } from '@arbidocs/react/ui'\n\nexport interface ChartSeries {\n  key: string\n  /** Legend text (defaults to `key`). */\n  label?: string\n  /** One value per entry of `labels`. */\n  values: number[]\n}\n\nexport interface ChartProps {\n  type: 'bar' | 'line' | 'pie'\n  /** Category (x) labels. For `pie` they name the slices of the first series. */\n  labels: string[]\n  series: ChartSeries[]\n  /** Accessible description of the whole chart. */\n  ariaLabel: string\n  /** Formats values in axis ticks and slice titles. */\n  formatValue?: (value: number) => string\n  /** Hide the legend. */\n  hideLegend?: boolean\n  emptyLabel?: string\n  className?: string\n  testId?: string\n}\n\nconst W = 440\nconst H = 160\nconst PAD = { top: 8, right: 8, bottom: 22, left: 40 }\n\n/** Series colours come from the `--chart-1..5` theme tokens, so charts follow the host theme. */\nconst color = (i: number) => `hsl(var(--chart-${(i % 5) + 1}))`\n\nconst defaultFormat = (v: number) => (v >= 1000 ? `${Math.round(v / 100) / 10}k` : String(v))\n\nfunction polar(cx: number, cy: number, r: number, angle: number): [number, number] {\n  return [cx + r * Math.sin(angle), cy - r * Math.cos(angle)]\n}\n\n/**\n * Data-bound bar, line or pie chart in plain SVG. No chart library: it renders from props,\n * is themed by tokens and carries a text alternative (`ariaLabel`, slice and bar `<title>`s).\n */\nexport function Chart({\n  type,\n  labels,\n  series,\n  ariaLabel,\n  formatValue = defaultFormat,\n  hideLegend = false,\n  emptyLabel = 'No data',\n  className,\n  testId,\n}: ChartProps) {\n  const max = useMemo(() => Math.max(...series.flatMap((s) => s.values), 1), [series])\n  if (!labels.length || !series.length) {\n    return <p className=\"text-sm text-muted-foreground\">{emptyLabel}</p>\n  }\n\n  const legendItems =\n    type === 'pie'\n      ? labels.map((label, i) => ({ label, color: color(i) }))\n      : series.map((s, i) => ({ label: s.label ?? s.key, color: color(i) }))\n\n  let body\n  if (type === 'pie') {\n    const values = series[0].values\n    const total = values.reduce((a, b) => a + Math.max(b, 0), 0)\n    const cx = 80\n    const cy = 80\n    const r = 72\n    let angle = 0\n    body = (\n      <svg viewBox=\"0 0 160 160\" className=\"mx-auto h-40 w-40\" role=\"img\" aria-label={ariaLabel}>\n        {total > 0 &&\n          values.map((v, i) => {\n            const sweep = (Math.max(v, 0) / total) * Math.PI * 2\n            if (sweep === 0) return null\n            const title = `${labels[i]}: ${formatValue(v)}`\n            if (sweep >= Math.PI * 2 - 1e-6) {\n              return (\n                <circle key={i} cx={cx} cy={cy} r={r} fill={color(i)}>\n                  <title>{title}</title>\n                </circle>\n              )\n            }\n            const [x1, y1] = polar(cx, cy, r, angle)\n            const [x2, y2] = polar(cx, cy, r, angle + sweep)\n            const d = `M${cx},${cy} L${x1},${y1} A${r},${r} 0 ${sweep > Math.PI ? 1 : 0} 1 ${x2},${y2} Z`\n            angle += sweep\n            return (\n              <path key={i} d={d} fill={color(i)}>\n                <title>{title}</title>\n              </path>\n            )\n          })}\n      </svg>\n    )\n  } else {\n    const plotW = W - PAD.left - PAD.right\n    const plotH = H - PAD.top - PAD.bottom\n    const y = (v: number) => PAD.top + plotH - (v / max) * plotH\n    const band = plotW / labels.length\n    const xCenter = (i: number) => PAD.left + band * i + band / 2\n    body = (\n      <svg viewBox={`0 0 ${W} ${H}`} className=\"h-auto w-full\" role=\"img\" aria-label={ariaLabel}>\n        {[0, max / 2, max].map((v) => (\n          <g key={v}>\n            <line\n              x1={PAD.left}\n              x2={W - PAD.right}\n              y1={y(v)}\n              y2={y(v)}\n              className=\"stroke-border\"\n              strokeDasharray=\"2,2\"\n            />\n            <text\n              x={PAD.left - 4}\n              y={y(v) + 3}\n              textAnchor=\"end\"\n              className=\"fill-muted-foreground text-[9px]\"\n            >\n              {formatValue(v)}\n            </text>\n          </g>\n        ))}\n        {labels.map((label, i) => (\n          <text\n            key={i}\n            x={xCenter(i)}\n            y={H - 6}\n            textAnchor=\"middle\"\n            className=\"fill-muted-foreground text-[9px]\"\n          >\n            {label}\n          </text>\n        ))}\n        {type === 'bar' &&\n          series.map((s, si) => {\n            const barW = (band * 0.7) / series.length\n            return s.values.map((v, i) => (\n              <rect\n                key={`${s.key}-${i}`}\n                x={xCenter(i) - (band * 0.7) / 2 + si * barW}\n                y={y(v)}\n                width={barW}\n                height={PAD.top + plotH - y(v)}\n                fill={color(si)}\n                rx={1.5}\n              >\n                <title>{`${labels[i]} ${s.label ?? s.key}: ${formatValue(v)}`}</title>\n              </rect>\n            ))\n          })}\n        {type === 'line' &&\n          series.map((s, si) => (\n            <g key={s.key}>\n              <polyline\n                fill=\"none\"\n                stroke={color(si)}\n                strokeWidth={2}\n                points={s.values.map((v, i) => `${xCenter(i)},${y(v)}`).join(' ')}\n              />\n              {s.values.map((v, i) => (\n                <circle key={i} cx={xCenter(i)} cy={y(v)} r={2.5} fill={color(si)}>\n                  <title>{`${labels[i]} ${s.label ?? s.key}: ${formatValue(v)}`}</title>\n                </circle>\n              ))}\n            </g>\n          ))}\n      </svg>\n    )\n  }\n\n  return (\n    <figure\n      className={cn('flex flex-col gap-2', className)}\n      data-slot=\"chart\"\n      data-type={type}\n      data-testid={testId}\n    >\n      {body}\n      {!hideLegend && (\n        <figcaption className=\"flex flex-wrap justify-center gap-x-4 gap-y-1 text-xs text-muted-foreground\">\n          {legendItems.map((item) => (\n            <span key={item.label} className=\"inline-flex items-center gap-1.5\">\n              <span\n                aria-hidden=\"true\"\n                className=\"inline-block size-2 rounded-full\"\n                style={{ background: item.color }}\n              />\n              {item.label}\n            </span>\n          ))}\n        </figcaption>\n      )}\n    </figure>\n  )\n}\n"]}

package/dist/chunk-UWGIB3VQ.js

@@ -0,0 +1,64 @@
+"use client";
+import { initials } from './chunk-WW6EOVZA.js';
+import { ChevronDown } from 'lucide-react';
+import { Avatar, AvatarImage, AvatarFallback, cn } from '@arbidocs/react/ui';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+
+var MAX_DEFAULT = 3;
+function MemberAvatarStack({
+  members,
+  total,
+  max = MAX_DEFAULT,
+  hidden = false,
+  onClick,
+  expanded = false,
+  ringClassName = "border-card",
+  className,
+  testId
+}) {
+  const count = total ?? members.length;
+  const shown = hidden ? [] : members.slice(0, max);
+  const extra = count - shown.length;
+  const faces = /* @__PURE__ */ jsxs(Fragment, { children: [
+    hidden ? /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: "\u2014" }) : shown.map((m, i) => /* @__PURE__ */ jsxs(Avatar, { className: cn("size-6 border-2", ringClassName), title: m.name, children: [
+      m.picture && /* @__PURE__ */ jsx(AvatarImage, { src: m.picture, alt: m.name }),
+      /* @__PURE__ */ jsx(AvatarFallback, { className: "bg-foreground text-xs font-medium text-background", children: initials(m.name || "?") })
+    ] }, i)),
+    !hidden && extra > 0 && /* @__PURE__ */ jsx(Avatar, { className: cn("size-6 border-2", ringClassName), children: /* @__PURE__ */ jsxs(AvatarFallback, { className: "bg-accent text-xs font-medium text-muted-foreground", children: [
+      "+",
+      extra
+    ] }) })
+  ] });
+  if (!onClick) {
+    return /* @__PURE__ */ jsx("div", { className: cn("flex shrink-0 -space-x-2", className), "data-testid": testId, children: faces });
+  }
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      onClick,
+      "aria-expanded": expanded,
+      className: cn(
+        "flex shrink-0 cursor-pointer items-center gap-1.5 rounded-full py-0.5 pl-0.5 pr-1.5 transition-colors hover:bg-accent/60 pointer-coarse:min-h-11 pointer-coarse:pr-3",
+        className
+      ),
+      "data-testid": testId,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "flex -space-x-2", children: faces }),
+        /* @__PURE__ */ jsx(
+          ChevronDown,
+          {
+            className: cn(
+              "size-3.5 text-muted-foreground transition-transform",
+              expanded && "rotate-180"
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+
+export { MemberAvatarStack };
+//# sourceMappingURL=chunk-UWGIB3VQ.js.map
+//# sourceMappingURL=chunk-UWGIB3VQ.js.map

package/dist/chunk-UWGIB3VQ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/MemberAvatarStack.tsx"],"names":[],"mappings":";;;;;AAgCA,IAAM,WAAA,GAAc,CAAA;AAWb,SAAS,iBAAA,CAAkB;AAAA,EAChC,OAAA;AAAA,EACA,KAAA;AAAA,EACA,GAAA,GAAM,WAAA;AAAA,EACN,MAAA,GAAS,KAAA;AAAA,EACT,OAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,aAAA,GAAgB,aAAA;AAAA,EAChB,SAAA;AAAA,EACA;AACF,CAAA,EAA2B;AACzB,EAAA,MAAM,KAAA,GAAQ,SAAS,OAAA,CAAQ,MAAA;AAC/B,EAAA,MAAM,QAAQ,MAAA,GAAS,KAAK,OAAA,CAAQ,KAAA,CAAM,GAAG,GAAG,CAAA;AAChD,EAAA,MAAM,KAAA,GAAQ,QAAQ,KAAA,CAAM,MAAA;AAE5B,EAAA,MAAM,wBACJ,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,IAAA,MAAA,mBACC,GAAA,CAAC,UAAK,SAAA,EAAU,+BAAA,EAAgC,oBAAC,CAAA,GAEjD,KAAA,CAAM,IAAI,CAAC,CAAA,EAAG,sBACZ,IAAA,CAAC,MAAA,EAAA,EAAe,WAAW,EAAA,CAAG,iBAAA,EAAmB,aAAa,CAAA,EAAG,KAAA,EAAO,EAAE,IAAA,EACvE,QAAA,EAAA;AAAA,MAAA,CAAA,CAAE,OAAA,wBAAY,WAAA,EAAA,EAAY,GAAA,EAAK,EAAE,OAAA,EAAS,GAAA,EAAK,EAAE,IAAA,EAAM,CAAA;AAAA,sBACxD,GAAA,CAAC,kBAAe,SAAA,EAAU,mDAAA,EACvB,mBAAS,CAAA,CAAE,IAAA,IAAQ,GAAG,CAAA,EACzB;AAAA,KAAA,EAAA,EAJW,CAKb,CACD,CAAA;AAAA,IAEF,CAAC,MAAA,IAAU,KAAA,GAAQ,CAAA,wBACjB,MAAA,EAAA,EAAO,SAAA,EAAW,EAAA,CAAG,iBAAA,EAAmB,aAAa,CAAA,EACpD,QAAA,kBAAA,IAAA,CAAC,cAAA,EAAA,EAAe,WAAU,qDAAA,EAAsD,QAAA,EAAA;AAAA,MAAA,GAAA;AAAA,MAC5E;AAAA,KAAA,EACJ,CAAA,EACF;AAAA,GAAA,EAEJ,CAAA;AAGF,EAAA,IAAI,CAAC,OAAA,EAAS;AACZ,IAAA,uBACE,GAAA,CAAC,SAAI,SAAA,EAAW,EAAA,CAAG,4BAA4B,SAAS,CAAA,EAAG,aAAA,EAAa,MAAA,EACrE,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,EAEJ;AAEA,EAAA,uBACE,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,QAAA;AAAA,MACL,OAAA;AAAA,MACA,eAAA,EAAe,QAAA;AAAA,MACf,SAAA,EAAW,EAAA;AAAA,QACT,sKAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,aAAA,EAAa,MAAA;AAAA,MAEb,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,iBAAA,EAAmB,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,wBACzC,GAAA;AAAA,UAAC,WAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,EAAA;AAAA,cACT,qDAAA;AAAA,cACA,QAAA,IAAY;AAAA;AACd;AAAA;AACF;AAAA;AAAA,GACF;AAEJ","file":"chunk-UWGIB3VQ.js","sourcesContent":["import { ChevronDown } from 'lucide-react'\nimport { Avatar, AvatarFallback, AvatarImage, cn } from '@arbidocs/react/ui'\nimport { initials } from '../lib/format'\n\n/** One face in the stack — source-agnostic, not a raw SDK user. */\nexport interface StackedMember {\n  name: string\n  picture?: string | null\n}\n\nexport interface MemberAvatarStackProps {\n  members: StackedMember[]\n  /** Total, when it exceeds what's shown. Defaults to `members.length`. */\n  total?: number\n  /** Faces before the rest collapse into a `+N`. */\n  max?: number\n  /**\n   * The viewer isn't allowed to see who is here (e.g. row-level security hides\n   * the members of a public workspace you haven't joined). Renders an em dash\n   * rather than lying with an empty stack.\n   */\n  hidden?: boolean\n  /** Makes the stack a button — e.g. to expand the member list below it. */\n  onClick?: () => void\n  /** Rotates the chevron and drives `aria-expanded` when it is a toggle. */\n  expanded?: boolean\n  /** Ring colour behind each face; match the surface it sits on. */\n  ringClassName?: string\n  className?: string\n  testId?: string\n}\n\nconst MAX_DEFAULT = 3\n\n/**\n * An overlapping stack of member faces, with the overflow collapsed to `+N`.\n *\n * Lives here rather than inside a card because \"who is in this thing\" is shown\n * in more than one place — a workspace card, a workspace's own header — and\n * those had drawn it twice. Given `onClick` it becomes the control that expands\n * the full list, which is a better affordance than a button labelled \"Members\"\n * beside the very faces it would reveal.\n */\nexport function MemberAvatarStack({\n  members,\n  total,\n  max = MAX_DEFAULT,\n  hidden = false,\n  onClick,\n  expanded = false,\n  ringClassName = 'border-card',\n  className,\n  testId,\n}: MemberAvatarStackProps) {\n  const count = total ?? members.length\n  const shown = hidden ? [] : members.slice(0, max)\n  const extra = count - shown.length\n\n  const faces = (\n    <>\n      {hidden ? (\n        <span className=\"text-sm text-muted-foreground\">—</span>\n      ) : (\n        shown.map((m, i) => (\n          <Avatar key={i} className={cn('size-6 border-2', ringClassName)} title={m.name}>\n            {m.picture && <AvatarImage src={m.picture} alt={m.name} />}\n            <AvatarFallback className=\"bg-foreground text-xs font-medium text-background\">\n              {initials(m.name || '?')}\n            </AvatarFallback>\n          </Avatar>\n        ))\n      )}\n      {!hidden && extra > 0 && (\n        <Avatar className={cn('size-6 border-2', ringClassName)}>\n          <AvatarFallback className=\"bg-accent text-xs font-medium text-muted-foreground\">\n            +{extra}\n          </AvatarFallback>\n        </Avatar>\n      )}\n    </>\n  )\n\n  if (!onClick) {\n    return (\n      <div className={cn('flex shrink-0 -space-x-2', className)} data-testid={testId}>\n        {faces}\n      </div>\n    )\n  }\n\n  return (\n    <button\n      type=\"button\"\n      onClick={onClick}\n      aria-expanded={expanded}\n      className={cn(\n        'flex shrink-0 cursor-pointer items-center gap-1.5 rounded-full py-0.5 pl-0.5 pr-1.5 transition-colors hover:bg-accent/60 pointer-coarse:min-h-11 pointer-coarse:pr-3',\n        className\n      )}\n      data-testid={testId}\n    >\n      <span className=\"flex -space-x-2\">{faces}</span>\n      <ChevronDown\n        className={cn(\n          'size-3.5 text-muted-foreground transition-transform',\n          expanded && 'rotate-180'\n        )}\n      />\n    </button>\n  )\n}\n"]}