@marktiderman/genesis-ui 1.3.0 → 2.1.0

package/dist/chunk-SRIT4NFQ.js

@@ -0,0 +1,67 @@
+"use client";
+import { cn } from './chunk-NZ5WBA4R.js';
+import * as React from 'react';
+import { unstable_PasswordToggleField } from 'radix-ui';
+import { jsx } from 'react/jsx-runtime';
+
+function PasswordToggleField({
+  className,
+  testID,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(unstable_PasswordToggleField.Root, { ...props, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "password-toggle-field",
+      "data-testid": testID,
+      className: cn("relative w-full", className),
+      children
+    }
+  ) });
+}
+PasswordToggleField.displayName = "PasswordToggleField";
+var PasswordToggleFieldInput = React.forwardRef(({ className, testID, ...props }, ref) => /* @__PURE__ */ jsx(
+  unstable_PasswordToggleField.Input,
+  {
+    ref,
+    "data-slot": "input",
+    "data-testid": testID,
+    className: cn(
+      "flex h-10 w-full min-w-0 rounded-md border border-input bg-background py-2 pl-3 pr-10 text-base ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm aria-invalid:border-destructive aria-invalid:ring-destructive/20",
+      className
+    ),
+    ...props
+  }
+));
+PasswordToggleFieldInput.displayName = "PasswordToggleFieldInput";
+var PasswordToggleFieldToggle = React.forwardRef(({ className, testID, ...props }, ref) => /* @__PURE__ */ jsx(
+  unstable_PasswordToggleField.Toggle,
+  {
+    ref,
+    "data-testid": testID,
+    className: cn(
+      "absolute right-1 top-1/2 inline-flex size-8 -translate-y-1/2 items-center justify-center rounded-md text-muted-foreground ring-offset-background transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+      className
+    ),
+    ...props
+  }
+));
+PasswordToggleFieldToggle.displayName = "PasswordToggleFieldToggle";
+function PasswordToggleFieldSlot(props) {
+  return /* @__PURE__ */ jsx(unstable_PasswordToggleField.Slot, { ...props });
+}
+PasswordToggleFieldSlot.displayName = "PasswordToggleFieldSlot";
+var PasswordToggleFieldIcon = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  unstable_PasswordToggleField.Icon,
+  {
+    ref,
+    className: cn("size-4 shrink-0", className),
+    ...props
+  }
+));
+PasswordToggleFieldIcon.displayName = "PasswordToggleFieldIcon";
+
+export { PasswordToggleField, PasswordToggleFieldIcon, PasswordToggleFieldInput, PasswordToggleFieldSlot, PasswordToggleFieldToggle };
+//# sourceMappingURL=chunk-SRIT4NFQ.js.map
+//# sourceMappingURL=chunk-SRIT4NFQ.js.map

package/dist/chunk-SRIT4NFQ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/password-toggle-field.tsx"],"names":["PasswordToggleFieldPrimitive"],"mappings":";;;;;AA6DO,SAAS,mBAAA,CAAoB;AAAA,EAClC,SAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAG;AACL,CAAA,EAA6B;AAC3B,EAAA,uBACE,GAAA,CAACA,4BAAA,CAA6B,IAAA,EAA7B,EAAmC,GAAG,KAAA,EACrC,QAAA,kBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,uBAAA;AAAA,MACV,aAAA,EAAa,MAAA;AAAA,MACb,SAAA,EAAW,EAAA,CAAG,iBAAA,EAAmB,SAAS,CAAA;AAAA,MAEzC;AAAA;AAAA,GACH,EACF,CAAA;AAEJ;AACA,mBAAA,CAAoB,WAAA,GAAc,qBAAA;AAoB3B,IAAM,wBAAA,GAAiC,iBAG5C,CAAC,EAAE,WAAW,MAAA,EAAQ,GAAG,KAAA,EAAM,EAAG,GAAA,qBAClC,GAAA;AAAA,EAACA,4BAAA,CAA6B,KAAA;AAAA,EAA7B;AAAA,IACC,GAAA;AAAA,IACA,WAAA,EAAU,OAAA;AAAA,IACV,aAAA,EAAa,MAAA;AAAA,IACb,SAAA,EAAW,EAAA;AAAA,MACT,0XAAA;AAAA,MACA;AAAA,KACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AACD,wBAAA,CAAyB,WAAA,GAAc,0BAAA;AAwBhC,IAAM,yBAAA,GAAkC,iBAG7C,CAAC,EAAE,WAAW,MAAA,EAAQ,GAAG,KAAA,EAAM,EAAG,GAAA,qBAClC,GAAA;AAAA,EAACA,4BAAA,CAA6B,MAAA;AAAA,EAA7B;AAAA,IACC,GAAA;AAAA,IACA,aAAA,EAAa,MAAA;AAAA,IACb,SAAA,EAAW,EAAA;AAAA,MACT,kaAAA;AAAA,MACA;AAAA,KACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AACD,yBAAA,CAA0B,WAAA,GAAc,2BAAA;AAgBjC,SAAS,wBAAwB,KAAA,EAAqC;AAC3E,EAAA,uBAAO,GAAA,CAACA,4BAAA,CAA6B,IAAA,EAA7B,EAAmC,GAAG,KAAA,EAAO,CAAA;AACvD;AACA,uBAAA,CAAwB,WAAA,GAAc,yBAAA;AAgB/B,IAAM,uBAAA,GAAgC,iBAG3C,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,qBAC1B,GAAA;AAAA,EAACA,4BAAA,CAA6B,IAAA;AAAA,EAA7B;AAAA,IACC,GAAA;AAAA,IACA,SAAA,EAAW,EAAA,CAAG,iBAAA,EAAmB,SAAS,CAAA;AAAA,IACzC,GAAG;AAAA;AACN,CACD;AACD,uBAAA,CAAwB,WAAA,GAAc,yBAAA","file":"chunk-SRIT4NFQ.js","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { unstable_PasswordToggleField as PasswordToggleFieldPrimitive } from \"radix-ui\";\n\nimport { cn } from \"../../utils\";\n\nexport interface PasswordToggleFieldProps\n  extends React.ComponentPropsWithoutRef<\n    typeof PasswordToggleFieldPrimitive.Root\n  > {\n  /** Class names for the field wrapper (the positioned box, see below). */\n  className?: string;\n  /** Stable test/automation selector for the wrapper (emitted as `data-testid`). */\n  testID?: string;\n}\n\n/**\n * PasswordToggleField — a password input with a show/hide control that keeps\n * focus and caret position across the toggle.\n *\n * Composition:\n *\n * ```tsx\n * <PasswordToggleField>\n *   <PasswordToggleFieldInput placeholder=\"Password\" />\n *   <PasswordToggleFieldToggle>\n *     <PasswordToggleFieldSlot visible={<EyeOff />} hidden={<Eye />} />\n *   </PasswordToggleFieldToggle>\n * </PasswordToggleField>\n * ```\n *\n * Why Radix and not five lines of `useState` plus `type={shown ? \"text\" :\n * \"password\"}`: the naive version loses the caret on every toggle, leaves the\n * button unlabelled (or labelled with a state that never updates), and — the\n * part nobody writes — leaves the password visible in the DOM after the form is\n * submitted or reset. Radix resets visibility on both `submit` and `reset`,\n * restores `selectionStart`/`selectionEnd` after the type swap, and derives the\n * toggle's `aria-label` (\"Show password\" / \"Hide password\") from the current\n * state unless the caller supplies text or a label of their own.\n *\n * Radix's own root is a **context provider with no DOM node of its own**, so\n * this wrapper renders a `relative` box around the children. That box is\n * load-bearing, not decoration: `PasswordToggleFieldToggle` is positioned\n * `absolute`, and absolute positioning resolves against the nearest positioned\n * ancestor. Without a wrapper the toggle would escape the field and land\n * against whatever positioned ancestor the consumer's page happened to have —\n * or the initial containing block, i.e. the page corner. The composition\n * documented above would put the show/hide button nowhere near the input.\n *\n * ---\n *\n * **Stability.** Radix ships this primitive as `unstable_PasswordToggleField`\n * and documents its API as subject to change; the underlying\n * `@radix-ui/react-password-toggle-field` package is still on `0.1.x`. It is\n * exported here under its stable-looking name for ergonomics, but it is the one\n * component in this package whose props may change in a minor release. Pin the\n * package if that is unacceptable, or compose `Input` + `Button` yourself.\n *\n * @stability Experimental\n */\nexport function PasswordToggleField({\n  className,\n  testID,\n  children,\n  ...props\n}: PasswordToggleFieldProps) {\n  return (\n    <PasswordToggleFieldPrimitive.Root {...props}>\n      <div\n        data-slot=\"password-toggle-field\"\n        data-testid={testID}\n        className={cn(\"relative w-full\", className)}\n      >\n        {children}\n      </div>\n    </PasswordToggleFieldPrimitive.Root>\n  );\n}\nPasswordToggleField.displayName = \"PasswordToggleField\";\n\nexport interface PasswordToggleFieldInputProps\n  extends React.ComponentPropsWithoutRef<\n    typeof PasswordToggleFieldPrimitive.Input\n  > {\n  /** Stable test/automation selector (emitted as `data-testid`). */\n  testID?: string;\n}\n\n/**\n * PasswordToggleFieldInput — the field itself.\n *\n * Styling matches `Input`, with right padding reserved for the toggle so the\n * button never sits on top of the text. Radix owns `type`, which is why it is\n * absent from the props: it is derived from the field's visibility state and\n * a caller-supplied value would fight it.\n *\n * @stability Experimental\n */\nexport const PasswordToggleFieldInput = React.forwardRef<\n  React.ComponentRef<typeof PasswordToggleFieldPrimitive.Input>,\n  PasswordToggleFieldInputProps\n>(({ className, testID, ...props }, ref) => (\n  <PasswordToggleFieldPrimitive.Input\n    ref={ref}\n    data-slot=\"input\"\n    data-testid={testID}\n    className={cn(\n      \"flex h-10 w-full min-w-0 rounded-md border border-input bg-background py-2 pl-3 pr-10 text-base ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm aria-invalid:border-destructive aria-invalid:ring-destructive/20\",\n      className\n    )}\n    {...props}\n  />\n));\nPasswordToggleFieldInput.displayName = \"PasswordToggleFieldInput\";\n\nexport interface PasswordToggleFieldToggleProps\n  extends React.ComponentPropsWithoutRef<\n    typeof PasswordToggleFieldPrimitive.Toggle\n  > {\n  /** Stable test/automation selector (emitted as `data-testid`). */\n  testID?: string;\n}\n\n/**\n * PasswordToggleFieldToggle — the show/hide button.\n *\n * Positioned `absolute` against the `relative` box that `PasswordToggleField`\n * renders — which is why that box exists; see the root's docs. Keep this\n * component inside a `PasswordToggleField`: positioning it against an\n * arbitrary ancestor is not a supported arrangement.\n *\n * Its accessible name comes from Radix (\"Show password\" / \"Hide password\",\n * following the current state) unless you provide inner text or an\n * `aria-label`.\n *\n * @stability Experimental\n */\nexport const PasswordToggleFieldToggle = React.forwardRef<\n  React.ComponentRef<typeof PasswordToggleFieldPrimitive.Toggle>,\n  PasswordToggleFieldToggleProps\n>(({ className, testID, ...props }, ref) => (\n  <PasswordToggleFieldPrimitive.Toggle\n    ref={ref}\n    data-testid={testID}\n    className={cn(\n      \"absolute right-1 top-1/2 inline-flex size-8 -translate-y-1/2 items-center justify-center rounded-md text-muted-foreground ring-offset-background transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0\",\n      className\n    )}\n    {...props}\n  />\n));\nPasswordToggleFieldToggle.displayName = \"PasswordToggleFieldToggle\";\n\nexport type PasswordToggleFieldSlotProps = React.ComponentPropsWithoutRef<\n  typeof PasswordToggleFieldPrimitive.Slot\n>;\n\n/**\n * PasswordToggleFieldSlot — renders one of two nodes depending on visibility.\n *\n * Takes either the declarative pair (`visible` / `hidden`) or a `render`\n * callback receiving `{ visible }`. Unstyled by design: it is a switch, not a\n * box, and wrapping it in an element would break the toggle's `[&_svg]` icon\n * sizing.\n *\n * @stability Experimental\n */\nexport function PasswordToggleFieldSlot(props: PasswordToggleFieldSlotProps) {\n  return <PasswordToggleFieldPrimitive.Slot {...props} />;\n}\nPasswordToggleFieldSlot.displayName = \"PasswordToggleFieldSlot\";\n\nexport interface PasswordToggleFieldIconProps\n  extends React.ComponentPropsWithoutRef<\n    typeof PasswordToggleFieldPrimitive.Icon\n  > {}\n\n/**\n * PasswordToggleFieldIcon — the SVG-level variant of `PasswordToggleFieldSlot`.\n *\n * Swaps the icon's inner content while keeping ONE `<svg>` element mounted, so\n * a CSS transition on the glyph survives the toggle instead of being restarted\n * by a remount.\n *\n * @stability Experimental\n */\nexport const PasswordToggleFieldIcon = React.forwardRef<\n  React.ComponentRef<typeof PasswordToggleFieldPrimitive.Icon>,\n  PasswordToggleFieldIconProps\n>(({ className, ...props }, ref) => (\n  <PasswordToggleFieldPrimitive.Icon\n    ref={ref}\n    className={cn(\"size-4 shrink-0\", className)}\n    {...props}\n  />\n));\nPasswordToggleFieldIcon.displayName = \"PasswordToggleFieldIcon\";\n"]}

package/dist/chunk-SY62XJFA.js

@@ -0,0 +1,19 @@
+import { cn } from './chunk-NZ5WBA4R.js';
+import * as React from 'react';
+import { VisuallyHidden as VisuallyHidden$1 } from 'radix-ui';
+import { jsx } from 'react/jsx-runtime';
+
+var VisuallyHidden = React.forwardRef(({ className, testID, ...props }, ref) => /* @__PURE__ */ jsx(
+  VisuallyHidden$1.Root,
+  {
+    ref,
+    "data-testid": testID,
+    className: cn(className),
+    ...props
+  }
+));
+VisuallyHidden.displayName = VisuallyHidden$1.Root.displayName;
+
+export { VisuallyHidden };
+//# sourceMappingURL=chunk-SY62XJFA.js.map
+//# sourceMappingURL=chunk-SY62XJFA.js.map

package/dist/chunk-SY62XJFA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/visually-hidden.tsx"],"names":["VisuallyHiddenPrimitive"],"mappings":";;;;;AAsDO,IAAM,cAAA,GAAuB,iBAGlC,CAAC,EAAE,WAAW,MAAA,EAAQ,GAAG,KAAA,EAAM,EAAG,GAAA,qBAClC,GAAA;AAAA,EAACA,gBAAA,CAAwB,IAAA;AAAA,EAAxB;AAAA,IACC,GAAA;AAAA,IACA,aAAA,EAAa,MAAA;AAAA,IACb,SAAA,EAAW,GAAG,SAAS,CAAA;AAAA,IACtB,GAAG;AAAA;AACN,CACD;AACD,cAAA,CAAe,WAAA,GAAcA,iBAAwB,IAAA,CAAK,WAAA","file":"chunk-SY62XJFA.js","sourcesContent":["// No \"use client\": this renders a span with inline styles and no hooks, and\n// neither `radix-ui` nor `@radix-ui/react-visually-hidden` carries the\n// directive itself. Leaving it off keeps the primitive importable from an RSC\n// server component — which matters, because the label an icon-only control\n// needs is very often rendered on the server.\nimport * as React from \"react\";\nimport { VisuallyHidden as VisuallyHiddenPrimitive } from \"radix-ui\";\n\nimport { cn } from \"../../utils\";\n\nexport interface VisuallyHiddenProps\n  extends React.ComponentPropsWithoutRef<typeof VisuallyHiddenPrimitive.Root> {\n  /** Stable test/automation selector (emitted as `data-testid`). */\n  testID?: string;\n}\n\n/**\n * VisuallyHidden — content removed from the visual layout but kept in the\n * accessibility tree.\n *\n * This is the correct tool for the label an icon-only control needs, for the\n * `DialogTitle` a dialog must have even when the design shows none, and for\n * live-region status text. It is NOT `display: none` and it is NOT\n * `visibility: hidden` — both of those remove the node from the a11y tree too,\n * which is the exact opposite of the intent.\n *\n * Why Radix rather than Tailwind's `sr-only`: the two produce the same result,\n * but `sr-only` is a class a consumer's `@apply`, a purge misconfiguration, or\n * a competing utility can quietly defeat, and the failure is silent — the text\n * simply becomes visible, or the layout shifts, and nothing in a build catches\n * it. Radix applies the clip rectangle as inline styles on the element itself,\n * so there is no stylesheet for the consumer's build to lose.\n *\n * **That robustness cuts both ways, and it is the one thing to know before\n * reaching for this.** An inline style beats any ordinary class declaration, so\n * a `className` cannot override the clipping either — not accidentally, and\n * not on purpose. `className` is merged for non-visual concerns (a test hook, a\n * data attribute target); it is NOT a way to reveal the content.\n *\n * The escape hatch is the `style` prop, which Radix spreads *after* its own\n * (`{...VISUALLY_HIDDEN_STYLES, ...props.style}`) and which therefore wins.\n * Both behaviours are pinned in this component's tests, because the docs above\n * depend on them.\n *\n * **This is therefore the wrong primitive for a skip link.** A skip link is\n * hidden until focused, and \"until focused\" is state, not a class — a static\n * `style` prop cannot express it and `focus-within:` utilities cannot win\n * against the inline rule. Give a skip link its own element with real CSS, or\n * drive the `style` prop from `onFocus`/`onBlur`. Use `VisuallyHidden` for text\n * that stays hidden: control labels, dialog titles a design omits, live-region\n * status text.\n *\n * @stability Beta\n */\nexport const VisuallyHidden = React.forwardRef<\n  React.ComponentRef<typeof VisuallyHiddenPrimitive.Root>,\n  VisuallyHiddenProps\n>(({ className, testID, ...props }, ref) => (\n  <VisuallyHiddenPrimitive.Root\n    ref={ref}\n    data-testid={testID}\n    className={cn(className)}\n    {...props}\n  />\n));\nVisuallyHidden.displayName = VisuallyHiddenPrimitive.Root.displayName;\n"]}

package/dist/{chunk-SVXDWPLO.js → chunk-THD3YOOZ.js}

@@ -1,13 +1,13 @@
 "use client";
 import { cn } from './chunk-NZ5WBA4R.js';
 import * as React from 'react';
-import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
+import { NavigationMenu as NavigationMenu$1 } from 'radix-ui';
 import { ChevronDown } from 'lucide-react';
 import { cva } from 'class-variance-authority';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 var NavigationMenu = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
-  NavigationMenuPrimitive.Root,
+  NavigationMenu$1.Root,
   {
     ref,
     className: cn(
@@ -21,9 +21,9 @@ var NavigationMenu = React.forwardRef(({ className, children, ...props }, ref) =
     ]
   }
 ));
-NavigationMenu.displayName = NavigationMenuPrimitive.Root.displayName;
+NavigationMenu.displayName = NavigationMenu$1.Root.displayName;
 var NavigationMenuList = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  NavigationMenuPrimitive.List,
+  NavigationMenu$1.List,
   {
     ref,
     className: cn(
@@ -33,13 +33,13 @@ var NavigationMenuList = React.forwardRef(({ className, ...props }, ref) => /* @
     ...props
   }
 ));
-NavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName;
-var NavigationMenuItem = NavigationMenuPrimitive.Item;
+NavigationMenuList.displayName = NavigationMenu$1.List.displayName;
+var NavigationMenuItem = NavigationMenu$1.Item;
 var navigationMenuTriggerStyle = cva(
   "group inline-flex h-10 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[active]:bg-accent/50 data-[state=open]:bg-accent/50"
 );
 var NavigationMenuTrigger = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
-  NavigationMenuPrimitive.Trigger,
+  NavigationMenu$1.Trigger,
   {
     ref,
     className: cn(navigationMenuTriggerStyle(), "group", className),
@@ -57,9 +57,9 @@ var NavigationMenuTrigger = React.forwardRef(({ className, children, ...props },
     ]
   }
 ));
-NavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName;
+NavigationMenuTrigger.displayName = NavigationMenu$1.Trigger.displayName;
 var NavigationMenuContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  NavigationMenuPrimitive.Content,
+  NavigationMenu$1.Content,
   {
     ref,
     className: cn(
@@ -69,10 +69,10 @@ var NavigationMenuContent = React.forwardRef(({ className, ...props }, ref) => /
     ...props
   }
 ));
-NavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName;
-var NavigationMenuLink = NavigationMenuPrimitive.Link;
+NavigationMenuContent.displayName = NavigationMenu$1.Content.displayName;
+var NavigationMenuLink = NavigationMenu$1.Link;
 var NavigationMenuViewport = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { className: cn("absolute left-0 top-full flex justify-center"), children: /* @__PURE__ */ jsx(
-  NavigationMenuPrimitive.Viewport,
+  NavigationMenu$1.Viewport,
   {
     className: cn(
       "origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]",
@@ -82,9 +82,9 @@ var NavigationMenuViewport = React.forwardRef(({ className, ...props }, ref) =>
     ...props
   }
 ) }));
-NavigationMenuViewport.displayName = NavigationMenuPrimitive.Viewport.displayName;
+NavigationMenuViewport.displayName = NavigationMenu$1.Viewport.displayName;
 var NavigationMenuIndicator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  NavigationMenuPrimitive.Indicator,
+  NavigationMenu$1.Indicator,
   {
     ref,
     className: cn(
@@ -95,8 +95,8 @@ var NavigationMenuIndicator = React.forwardRef(({ className, ...props }, ref) =>
     children: /* @__PURE__ */ jsx("div", { className: "relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md" })
   }
 ));
-NavigationMenuIndicator.displayName = NavigationMenuPrimitive.Indicator.displayName;
+NavigationMenuIndicator.displayName = NavigationMenu$1.Indicator.displayName;
 
 export { NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, navigationMenuTriggerStyle };
-//# sourceMappingURL=chunk-SVXDWPLO.js.map
-//# sourceMappingURL=chunk-SVXDWPLO.js.map
+//# sourceMappingURL=chunk-THD3YOOZ.js.map
+//# sourceMappingURL=chunk-THD3YOOZ.js.map

package/dist/chunk-THD3YOOZ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/navigation-menu.tsx"],"names":["NavigationMenuPrimitive"],"mappings":"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","file":"chunk-THD3YOOZ.js","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { NavigationMenu as NavigationMenuPrimitive } from \"radix-ui\";\nimport { ChevronDown } from \"lucide-react\";\nimport { cva } from \"class-variance-authority\";\n\nimport { cn } from \"../../utils\";\n\nconst NavigationMenu = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Root>\n>(({ className, children, ...props }, ref) => (\n  <NavigationMenuPrimitive.Root\n    ref={ref}\n    className={cn(\n      \"relative z-10 flex max-w-max flex-1 items-center justify-center\",\n      className\n    )}\n    {...props}\n  >\n    {children}\n    <NavigationMenuViewport />\n  </NavigationMenuPrimitive.Root>\n));\nNavigationMenu.displayName = NavigationMenuPrimitive.Root.displayName;\n\nconst NavigationMenuList = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.List>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.List>\n>(({ className, ...props }, ref) => (\n  <NavigationMenuPrimitive.List\n    ref={ref}\n    className={cn(\n      \"group flex flex-1 list-none items-center justify-center space-x-1\",\n      className\n    )}\n    {...props}\n  />\n));\nNavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName;\n\nconst NavigationMenuItem = NavigationMenuPrimitive.Item;\n\nconst navigationMenuTriggerStyle = cva(\n  \"group inline-flex h-10 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[active]:bg-accent/50 data-[state=open]:bg-accent/50\"\n);\n\nconst NavigationMenuTrigger = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Trigger>\n>(({ className, children, ...props }, ref) => (\n  <NavigationMenuPrimitive.Trigger\n    ref={ref}\n    className={cn(navigationMenuTriggerStyle(), \"group\", className)}\n    {...props}\n  >\n    {children}{\" \"}\n    <ChevronDown\n      className=\"relative top-[1px] ml-1 h-3 w-3 transition duration-200 group-data-[state=open]:rotate-180\"\n      aria-hidden=\"true\"\n    />\n  </NavigationMenuPrimitive.Trigger>\n));\nNavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName;\n\nconst NavigationMenuContent = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Content>\n>(({ className, ...props }, ref) => (\n  <NavigationMenuPrimitive.Content\n    ref={ref}\n    className={cn(\n      \"left-0 top-0 w-full data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 md:absolute md:w-auto\",\n      className\n    )}\n    {...props}\n  />\n));\nNavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName;\n\nconst NavigationMenuLink = NavigationMenuPrimitive.Link;\n\nconst NavigationMenuViewport = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Viewport>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Viewport>\n>(({ className, ...props }, ref) => (\n  <div className={cn(\"absolute left-0 top-full flex justify-center\")}>\n    <NavigationMenuPrimitive.Viewport\n      className={cn(\n        \"origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]\",\n        className\n      )}\n      ref={ref}\n      {...props}\n    />\n  </div>\n));\nNavigationMenuViewport.displayName =\n  NavigationMenuPrimitive.Viewport.displayName;\n\nconst NavigationMenuIndicator = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Indicator>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Indicator>\n>(({ className, ...props }, ref) => (\n  <NavigationMenuPrimitive.Indicator\n    ref={ref}\n    className={cn(\n      \"top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in\",\n      className\n    )}\n    {...props}\n  >\n    <div className=\"relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md\" />\n  </NavigationMenuPrimitive.Indicator>\n));\nNavigationMenuIndicator.displayName =\n  NavigationMenuPrimitive.Indicator.displayName;\n\nexport {\n  navigationMenuTriggerStyle,\n  NavigationMenu,\n  NavigationMenuList,\n  NavigationMenuItem,\n  NavigationMenuContent,\n  NavigationMenuTrigger,\n  NavigationMenuLink,\n  NavigationMenuIndicator,\n  NavigationMenuViewport,\n};\n"]}

package/dist/chunk-VXFYETRK.js

@@ -0,0 +1,58 @@
+"use client";
+import { cn } from './chunk-NZ5WBA4R.js';
+import * as React from 'react';
+import { Tabs as Tabs$1 } from 'radix-ui';
+import { jsx } from 'react/jsx-runtime';
+
+var Tabs = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  Tabs$1.Root,
+  {
+    ref,
+    className: cn("w-full", className),
+    ...props
+  }
+));
+Tabs.displayName = Tabs$1.Root.displayName;
+var TabsList = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  Tabs$1.List,
+  {
+    ref,
+    className: cn(
+      "inline-flex h-10 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground",
+      className
+    ),
+    ...props
+  }
+));
+TabsList.displayName = Tabs$1.List.displayName;
+var TabsTrigger = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  Tabs$1.Trigger,
+  {
+    ref,
+    className: cn(
+      "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
+      // Same active styling as before, now keyed off the `data-state` Radix
+      // maintains rather than an `isActive` boolean read from local context.
+      "data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",
+      className
+    ),
+    ...props
+  }
+));
+TabsTrigger.displayName = Tabs$1.Trigger.displayName;
+var TabsContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  Tabs$1.Content,
+  {
+    ref,
+    className: cn(
+      "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+      className
+    ),
+    ...props
+  }
+));
+TabsContent.displayName = Tabs$1.Content.displayName;
+
+export { Tabs, TabsContent, TabsList, TabsTrigger };
+//# sourceMappingURL=chunk-VXFYETRK.js.map
+//# sourceMappingURL=chunk-VXFYETRK.js.map

package/dist/chunk-VXFYETRK.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/tabs.tsx"],"names":["TabsPrimitive"],"mappings":";;;;;AAkCA,IAAM,IAAA,GAAa,iBAGjB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,qBAC1B,GAAA;AAAA,EAACA,MAAA,CAAc,IAAA;AAAA,EAAd;AAAA,IACC,GAAA;AAAA,IACA,SAAA,EAAW,EAAA,CAAG,QAAA,EAAU,SAAS,CAAA;AAAA,IAChC,GAAG;AAAA;AACN,CACD;AACD,IAAA,CAAK,WAAA,GAAcA,OAAc,IAAA,CAAK,WAAA;AAEtC,IAAM,QAAA,GAAiB,iBAGrB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,qBAC1B,GAAA;AAAA,EAACA,MAAA,CAAc,IAAA;AAAA,EAAd;AAAA,IACC,GAAA;AAAA,IACA,SAAA,EAAW,EAAA;AAAA,MACT,4FAAA;AAAA,MACA;AAAA,KACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AACD,QAAA,CAAS,WAAA,GAAcA,OAAc,IAAA,CAAK,WAAA;AAE1C,IAAM,WAAA,GAAoB,iBAGxB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,qBAC1B,GAAA;AAAA,EAACA,MAAA,CAAc,OAAA;AAAA,EAAd;AAAA,IACC,GAAA;AAAA,IACA,SAAA,EAAW,EAAA;AAAA,MACT,iSAAA;AAAA;AAAA;AAAA,MAGA,qGAAA;AAAA,MACA;AAAA,KACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AACD,WAAA,CAAY,WAAA,GAAcA,OAAc,OAAA,CAAQ,WAAA;AAEhD,IAAM,WAAA,GAAoB,iBAGxB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,qBAC1B,GAAA;AAAA,EAACA,MAAA,CAAc,OAAA;AAAA,EAAd;AAAA,IACC,GAAA;AAAA,IACA,SAAA,EAAW,EAAA;AAAA,MACT,iIAAA;AAAA,MACA;AAAA,KACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AACD,WAAA,CAAY,WAAA,GAAcA,OAAc,OAAA,CAAQ,WAAA","file":"chunk-VXFYETRK.js","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Tabs as TabsPrimitive } from \"radix-ui\";\nimport { cn } from \"../../utils\";\n\ninterface TabsProps\n  extends React.ComponentPropsWithoutRef<typeof TabsPrimitive.Root> {\n  /**\n   * Required here even though Radix's own `defaultValue` is optional — that is\n   * the existing contract, and loosening it is a separate decision.\n   */\n  defaultValue: string;\n}\n\n/**\n * Tabs — a tablist and its panels.\n *\n * Backed by Radix `Tabs`. The hand-rolled version was a React context plus a\n * row of plain `<button>`s: it tracked the selected value correctly and\n * nothing else. Every keyboard and screen-reader affordance the WAI-ARIA tabs\n * pattern asks for was missing — `role=\"tablist\"`/`\"tab\"`/`\"tabpanel\"`, the\n * `aria-selected` state, the `aria-controls`/`aria-labelledby` link between a\n * tab and its panel, the roving `tabindex` that makes the whole tablist ONE\n * tab stop instead of N, and Arrow/Home/End navigation between tabs. Radix\n * supplies all of it, plus the selection state the old version already\n * handled.\n *\n * One behavioural note worth knowing: Radix selects on `mousedown` rather than\n * `click`. Pointer users see no difference, but a synthetic `fireEvent.click`\n * on a trigger no longer changes tabs.\n *\n * @stability Stable\n */\nconst Tabs = React.forwardRef<\n  React.ElementRef<typeof TabsPrimitive.Root>,\n  TabsProps\n>(({ className, ...props }, ref) => (\n  <TabsPrimitive.Root\n    ref={ref}\n    className={cn(\"w-full\", className)}\n    {...props}\n  />\n));\nTabs.displayName = TabsPrimitive.Root.displayName;\n\nconst TabsList = React.forwardRef<\n  React.ElementRef<typeof TabsPrimitive.List>,\n  React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>\n>(({ className, ...props }, ref) => (\n  <TabsPrimitive.List\n    ref={ref}\n    className={cn(\n      \"inline-flex h-10 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground\",\n      className\n    )}\n    {...props}\n  />\n));\nTabsList.displayName = TabsPrimitive.List.displayName;\n\nconst TabsTrigger = React.forwardRef<\n  React.ElementRef<typeof TabsPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>\n>(({ className, ...props }, ref) => (\n  <TabsPrimitive.Trigger\n    ref={ref}\n    className={cn(\n      \"inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50\",\n      // Same active styling as before, now keyed off the `data-state` Radix\n      // maintains rather than an `isActive` boolean read from local context.\n      \"data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm\",\n      className\n    )}\n    {...props}\n  />\n));\nTabsTrigger.displayName = TabsPrimitive.Trigger.displayName;\n\nconst TabsContent = React.forwardRef<\n  React.ElementRef<typeof TabsPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>\n>(({ className, ...props }, ref) => (\n  <TabsPrimitive.Content\n    ref={ref}\n    className={cn(\n      \"mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\n      className\n    )}\n    {...props}\n  />\n));\nTabsContent.displayName = TabsPrimitive.Content.displayName;\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent };\n"]}

package/dist/chunk-XBX6QMR5.js

@@ -0,0 +1,58 @@
+import { Avatar, AvatarImage, AvatarFallback } from './chunk-LNFF2RBD.js';
+import { cn } from './chunk-NZ5WBA4R.js';
+import { cva } from 'class-variance-authority';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var userAvatarVariants = cva("shrink-0", {
+  variants: {
+    size: {
+      sm: "h-8 w-8 text-xs",
+      default: "h-10 w-10 text-sm",
+      lg: "h-12 w-12 text-base"
+    }
+  },
+  defaultVariants: {
+    size: "default"
+  }
+});
+var graphemeSegmenter;
+function getGraphemeSegmenter() {
+  if (graphemeSegmenter === void 0) {
+    graphemeSegmenter = typeof Intl !== "undefined" && typeof Intl.Segmenter === "function" ? new Intl.Segmenter(void 0, { granularity: "grapheme" }) : null;
+  }
+  return graphemeSegmenter;
+}
+function firstGrapheme(word) {
+  const segmenter = getGraphemeSegmenter();
+  if (segmenter) {
+    for (const { segment } of segmenter.segment(word)) return segment;
+    return "";
+  }
+  return Array.from(word)[0] ?? "";
+}
+function getInitials(name) {
+  const words = name.trim().split(/\s+/).filter(Boolean);
+  if (words.length === 0) return "?";
+  const first = firstGrapheme(words[0]);
+  const last = firstGrapheme(words[words.length - 1]);
+  return (words.length === 1 ? first : first + last).toUpperCase();
+}
+function UserAvatar({ name, src, size, className, testID }) {
+  return /* @__PURE__ */ jsxs(
+    Avatar,
+    {
+      role: "img",
+      "aria-label": name,
+      "data-testid": testID,
+      className: cn(userAvatarVariants({ size }), className),
+      children: [
+        src ? /* @__PURE__ */ jsx(AvatarImage, { src, alt: "" }) : null,
+        /* @__PURE__ */ jsx(AvatarFallback, { children: getInitials(name) })
+      ]
+    }
+  );
+}
+
+export { UserAvatar, userAvatarVariants };
+//# sourceMappingURL=chunk-XBX6QMR5.js.map
+//# sourceMappingURL=chunk-XBX6QMR5.js.map

package/dist/chunk-XBX6QMR5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/patterns/user-avatar.tsx"],"names":[],"mappings":";;;;;AAKA,IAAM,kBAAA,GAAqB,IAAI,UAAA,EAAY;AAAA,EACzC,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,iBAAA;AAAA,MACJ,OAAA,EAAS,mBAAA;AAAA,MACT,EAAA,EAAI;AAAA;AACN,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM;AAAA;AAEV,CAAC;AAID,IAAI,iBAAA;AAEJ,SAAS,oBAAA,GAA8C;AACrD,EAAA,IAAI,sBAAsB,MAAA,EAAW;AACnC,IAAA,iBAAA,GACE,OAAO,IAAA,KAAS,WAAA,IAAe,OAAO,KAAK,SAAA,KAAc,UAAA,GACrD,IAAI,IAAA,CAAK,UAAU,MAAA,EAAW,EAAE,WAAA,EAAa,UAAA,EAAY,CAAA,GACzD,IAAA;AAAA,EACR;AACA,EAAA,OAAO,iBAAA;AACT;AAWA,SAAS,cAAc,IAAA,EAAsB;AAC3C,EAAA,MAAM,YAAY,oBAAA,EAAqB;AACvC,EAAA,IAAI,SAAA,EAAW;AACb,IAAA,KAAA,MAAW,EAAE,OAAA,EAAQ,IAAK,UAAU,OAAA,CAAQ,IAAI,GAAG,OAAO,OAAA;AAC1D,IAAA,OAAO,EAAA;AAAA,EACT;AACA,EAAA,OAAO,KAAA,CAAM,IAAA,CAAK,IAAI,CAAA,CAAE,CAAC,CAAA,IAAK,EAAA;AAChC;AAGA,SAAS,YAAY,IAAA,EAAsB;AACzC,EAAA,MAAM,KAAA,GAAQ,KAAK,IAAA,EAAK,CAAE,MAAM,KAAK,CAAA,CAAE,OAAO,OAAO,CAAA;AACrD,EAAA,IAAI,KAAA,CAAM,MAAA,KAAW,CAAA,EAAG,OAAO,GAAA;AAC/B,EAAA,MAAM,KAAA,GAAQ,aAAA,CAAc,KAAA,CAAM,CAAC,CAAE,CAAA;AACrC,EAAA,MAAM,OAAO,aAAA,CAAc,KAAA,CAAM,KAAA,CAAM,MAAA,GAAS,CAAC,CAAE,CAAA;AACnD,EAAA,OAAA,CAAQ,MAAM,MAAA,KAAW,CAAA,GAAI,KAAA,GAAQ,KAAA,GAAQ,MAAM,WAAA,EAAY;AACjE;AA2BO,SAAS,WAAW,EAAE,IAAA,EAAM,KAAK,IAAA,EAAM,SAAA,EAAW,QAAO,EAAoB;AAClF,EAAA,uBACE,IAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,KAAA;AAAA,MACL,YAAA,EAAY,IAAA;AAAA,MACZ,aAAA,EAAa,MAAA;AAAA,MACb,WAAW,EAAA,CAAG,kBAAA,CAAmB,EAAE,IAAA,EAAM,GAAG,SAAS,CAAA;AAAA,MAOpD,QAAA,EAAA;AAAA,QAAA,GAAA,mBAAM,GAAA,CAAC,WAAA,EAAA,EAAY,GAAA,EAAU,GAAA,EAAI,IAAG,CAAA,GAAK,IAAA;AAAA,wBAC1C,GAAA,CAAC,cAAA,EAAA,EAAgB,QAAA,EAAA,WAAA,CAAY,IAAI,CAAA,EAAE;AAAA;AAAA;AAAA,GACrC;AAEJ","file":"chunk-XBX6QMR5.js","sourcesContent":["import * as React from \"react\";\nimport { type VariantProps, cva } from \"class-variance-authority\";\nimport { Avatar, AvatarFallback, AvatarImage } from \"../ui/avatar\";\nimport { cn } from \"../../utils\";\n\nconst userAvatarVariants = cva(\"shrink-0\", {\n  variants: {\n    size: {\n      sm: \"h-8 w-8 text-xs\",\n      default: \"h-10 w-10 text-sm\",\n      lg: \"h-12 w-12 text-base\",\n    },\n  },\n  defaultVariants: {\n    size: \"default\",\n  },\n});\n\n// Built lazily once — constructing a Segmenter per call is wasteful, and a\n// runtime either has Intl.Segmenter or never will.\nlet graphemeSegmenter: Intl.Segmenter | null | undefined;\n\nfunction getGraphemeSegmenter(): Intl.Segmenter | null {\n  if (graphemeSegmenter === undefined) {\n    graphemeSegmenter =\n      typeof Intl !== \"undefined\" && typeof Intl.Segmenter === \"function\"\n        ? new Intl.Segmenter(undefined, { granularity: \"grapheme\" })\n        : null;\n  }\n  return graphemeSegmenter;\n}\n\n/**\n * First user-perceived character of `word`.\n *\n * `charAt(0)` / `[0]` index UTF-16 code units, so a name starting outside the\n * BMP (\"𐐀 Smith\", \"😊 Jones\") yields a lone surrogate that renders as a\n * replacement glyph. Grapheme segmentation additionally keeps combining marks\n * attached (\"é\" as e + U+0301); the `Array.from` fallback is code-point based,\n * which still fixes the surrogate case on runtimes without `Intl.Segmenter`.\n */\nfunction firstGrapheme(word: string): string {\n  const segmenter = getGraphemeSegmenter();\n  if (segmenter) {\n    for (const { segment } of segmenter.segment(word)) return segment;\n    return \"\";\n  }\n  return Array.from(word)[0] ?? \"\";\n}\n\n/** First + last initial from a display name (\"Ada Lovelace\" -> \"AL\", \"Cher\" -> \"C\"). */\nfunction getInitials(name: string): string {\n  const words = name.trim().split(/\\s+/).filter(Boolean);\n  if (words.length === 0) return \"?\";\n  const first = firstGrapheme(words[0]!);\n  const last = firstGrapheme(words[words.length - 1]!);\n  return (words.length === 1 ? first : first + last).toUpperCase();\n}\n\nexport interface UserAvatarProps extends VariantProps<typeof userAvatarVariants> {\n  /** Full display name. Source for the computed initials fallback and the accessible name. */\n  name: string;\n  /** Image URL. Omit — or let it fail to load — to show the initials fallback. */\n  src?: string | null;\n  className?: string;\n  /** Stable test/automation selector (emitted as `data-testid`). */\n  testID?: string;\n}\n\n/**\n * UserAvatar — canonical user-identity avatar. Shows the person's photo when\n * `src` is set and loads successfully; otherwise (including a failed image\n * load — Radix's Avatar swaps to the fallback automatically) it falls back\n * to initials computed from `name`. Wraps the lower-level\n * `Avatar`/`AvatarImage`/`AvatarFallback` primitives so call sites stop\n * hand-rolling initials logic per-usage.\n *\n * The root carries `role=\"img\"` + `aria-label={name}` so the person's full name\n * is the accessible name on BOTH paths — without it the fallback route renders\n * a bare `span`, a generic element whose author-supplied label AT may ignore,\n * announcing only the visible initials (\"AL\").\n *\n * @stability Beta\n */\nexport function UserAvatar({ name, src, size, className, testID }: UserAvatarProps) {\n  return (\n    <Avatar\n      role=\"img\"\n      aria-label={name}\n      data-testid={testID}\n      className={cn(userAvatarVariants({ size }), className)}\n    >\n      {/*\n        alt=\"\" is deliberate: the root already exposes `name` as the accessible\n        name, so labelling the nested <img> too would announce the person twice\n        once the image loads.\n      */}\n      {src ? <AvatarImage src={src} alt=\"\" /> : null}\n      <AvatarFallback>{getInitials(name)}</AvatarFallback>\n    </Avatar>\n  );\n}\n\nexport { userAvatarVariants };\n"]}

package/dist/{chunk-SCUT2ZCD.js → chunk-XCGZPFT7.js}

@@ -1,17 +1,17 @@
 "use client";
 import { cn } from './chunk-NZ5WBA4R.js';
 import * as React from 'react';
-import * as SheetPrimitive from '@radix-ui/react-dialog';
+import { Dialog } from 'radix-ui';
 import { cva } from 'class-variance-authority';
 import { X } from 'lucide-react';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
-var Sheet = SheetPrimitive.Root;
-var SheetTrigger = SheetPrimitive.Trigger;
-var SheetClose = SheetPrimitive.Close;
-var SheetPortal = SheetPrimitive.Portal;
+var Sheet = Dialog.Root;
+var SheetTrigger = Dialog.Trigger;
+var SheetClose = Dialog.Close;
+var SheetPortal = Dialog.Portal;
 var SheetOverlay = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  SheetPrimitive.Overlay,
+  Dialog.Overlay,
   {
     className: cn(
       "fixed inset-0 z-50 bg-black/50 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
@@ -21,7 +21,7 @@ var SheetOverlay = React.forwardRef(({ className, ...props }, ref) => /* @__PURE
     ref
   }
 ));
-SheetOverlay.displayName = SheetPrimitive.Overlay.displayName;
+SheetOverlay.displayName = Dialog.Overlay.displayName;
 var sheetVariants = cva(
   "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
   {
@@ -38,17 +38,17 @@ var sheetVariants = cva(
     }
   }
 );
-var SheetContent = React.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs(SheetPortal, { children: [
+var SheetContent = React.forwardRef(({ side = "right", className, children, showCloseButton = true, ...props }, ref) => /* @__PURE__ */ jsxs(SheetPortal, { children: [
   /* @__PURE__ */ jsx(SheetOverlay, {}),
   /* @__PURE__ */ jsxs(
-    SheetPrimitive.Content,
+    Dialog.Content,
     {
       ref,
       className: cn(sheetVariants({ side }), className),
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsxs(SheetPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
+        showCloseButton && /* @__PURE__ */ jsxs(Dialog.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
           /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }),
           /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
         ] })
@@ -56,7 +56,7 @@ var SheetContent = React.forwardRef(({ side = "right", className, children, ...p
     }
   )
 ] }));
-SheetContent.displayName = SheetPrimitive.Content.displayName;
+SheetContent.displayName = Dialog.Content.displayName;
 var SheetHeader = ({
   className,
   ...props
@@ -86,24 +86,24 @@ var SheetFooter = ({
 );
 SheetFooter.displayName = "SheetFooter";
 var SheetTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  SheetPrimitive.Title,
+  Dialog.Title,
   {
     ref,
     className: cn("text-lg font-semibold text-foreground", className),
     ...props
   }
 ));
-SheetTitle.displayName = SheetPrimitive.Title.displayName;
+SheetTitle.displayName = Dialog.Title.displayName;
 var SheetDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  SheetPrimitive.Description,
+  Dialog.Description,
   {
     ref,
     className: cn("text-sm text-muted-foreground", className),
     ...props
   }
 ));
-SheetDescription.displayName = SheetPrimitive.Description.displayName;
+SheetDescription.displayName = Dialog.Description.displayName;
 
 export { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger };
-//# sourceMappingURL=chunk-SCUT2ZCD.js.map
-//# sourceMappingURL=chunk-SCUT2ZCD.js.map
+//# sourceMappingURL=chunk-XCGZPFT7.js.map
+//# sourceMappingURL=chunk-XCGZPFT7.js.map

package/dist/chunk-XCGZPFT7.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/sheet.tsx"],"names":["SheetPrimitive"],"mappings":"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","file":"chunk-XCGZPFT7.js","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Dialog as SheetPrimitive } from \"radix-ui\";\nimport { type VariantProps, cva } from \"class-variance-authority\";\nimport { X } from \"lucide-react\";\nimport { cn } from \"../../utils\";\n\nconst Sheet = SheetPrimitive.Root;\nconst SheetTrigger = SheetPrimitive.Trigger;\nconst SheetClose = SheetPrimitive.Close;\nconst SheetPortal = SheetPrimitive.Portal;\n\nconst SheetOverlay = React.forwardRef<\n  React.ComponentRef<typeof SheetPrimitive.Overlay>,\n  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Overlay\n    className={cn(\n      \"fixed inset-0 z-50 bg-black/50 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n      className,\n    )}\n    {...props}\n    ref={ref}\n  />\n));\nSheetOverlay.displayName = SheetPrimitive.Overlay.displayName;\n\nconst sheetVariants = cva(\n  \"fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500\",\n  {\n    variants: {\n      side: {\n        top: \"inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top\",\n        bottom:\n          \"inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom\",\n        left: \"inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm\",\n        right:\n          \"inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm\",\n      },\n    },\n    defaultVariants: {\n      side: \"right\",\n    },\n  }\n);\n\ninterface SheetContentProps\n  extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,\n    VariantProps<typeof sheetVariants> {\n  /** Show the built-in top-right close affordance. Default true. Mirrors `DialogContent`'s `showCloseButton` — set false when a composing consumer (e.g. `DetailPanel`) renders its own close control. */\n  showCloseButton?: boolean;\n}\n\nconst SheetContent = React.forwardRef<\n  React.ComponentRef<typeof SheetPrimitive.Content>,\n  SheetContentProps\n>(({ side = \"right\", className, children, showCloseButton = true, ...props }, ref) => (\n  <SheetPortal>\n    <SheetOverlay />\n    <SheetPrimitive.Content\n      ref={ref}\n      className={cn(sheetVariants({ side }), className)}\n      {...props}\n    >\n      {children}\n      {showCloseButton && (\n        <SheetPrimitive.Close className=\"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary\">\n          <X className=\"h-4 w-4\" />\n          <span className=\"sr-only\">Close</span>\n        </SheetPrimitive.Close>\n      )}\n    </SheetPrimitive.Content>\n  </SheetPortal>\n));\nSheetContent.displayName = SheetPrimitive.Content.displayName;\n\nconst SheetHeader = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\n      \"flex flex-col space-y-2 text-center sm:text-left\",\n      className,\n    )}\n    {...props}\n  />\n);\nSheetHeader.displayName = \"SheetHeader\";\n\nconst SheetFooter = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\n      \"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2\",\n      className,\n    )}\n    {...props}\n  />\n);\nSheetFooter.displayName = \"SheetFooter\";\n\nconst SheetTitle = React.forwardRef<\n  React.ComponentRef<typeof SheetPrimitive.Title>,\n  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Title>\n>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Title\n    ref={ref}\n    className={cn(\"text-lg font-semibold text-foreground\", className)}\n    {...props}\n  />\n));\nSheetTitle.displayName = SheetPrimitive.Title.displayName;\n\nconst SheetDescription = React.forwardRef<\n  React.ComponentRef<typeof SheetPrimitive.Description>,\n  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Description>\n>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Description\n    ref={ref}\n    className={cn(\"text-sm text-muted-foreground\", className)}\n    {...props}\n  />\n));\nSheetDescription.displayName = SheetPrimitive.Description.displayName;\n\nexport {\n  Sheet,\n  SheetPortal,\n  SheetOverlay,\n  SheetTrigger,\n  SheetClose,\n  SheetContent,\n  SheetHeader,\n  SheetFooter,\n  SheetTitle,\n  SheetDescription,\n};\n"]}

package/dist/chunk-XMK3T4TA.js

@@ -0,0 +1,73 @@
+import { cn } from './chunk-NZ5WBA4R.js';
+import { cva } from 'class-variance-authority';
+import { jsx } from 'react/jsx-runtime';
+
+var statusBadgeVariants = cva(
+  "inline-flex w-fit items-center whitespace-nowrap rounded-full border px-2.5 py-0.5 text-xs font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+  {
+    variants: {
+      // AA-safe status text on the tinted chip, same technique as `Badge`'s
+      // success/warning/info variants (see badge.tsx): same-hue text on the
+      // raw tint fails WCAG AA, so text uses the semantic Tailwind ramp
+      // (same hues as the Genesis status tokens). All four hues clear 4.5:1
+      // at the 700(light)/300(dark) stops over the /15(light) and /20(dark)
+      // tints (emerald-700 4.76:1, blue-700 5.64:1, red-700 ~5.3:1);
+      // warning needs the 800/200 bump (amber-700 was 4.48:1 — under the
+      // 4.5:1 floor).
+      //
+      // NOTE on `destructive` vs `error`: the offTrack/blocked tint is
+      // `bg-destructive`, NOT `bg-error`, even though these two map to the
+      // `semantic.error` token upstream. The token layer names this
+      // semantic `error`; the CSS theme layer (apps' `@theme` blocks,
+      // design-system's generated genesis.css) names the very same color
+      // `destructive` and registers no `--color-error` at all — so
+      // `bg-error` would silently emit no utility and render an untinted
+      // chip. In light mode the two are literally the same value
+      // (`--destructive` = 0 84.2% 60.2% = #EF4444 = semantic.error.DEFAULT).
+      // Dark mode is the one asymmetry: the theme darkens `--destructive`
+      // (0 62.8% 30.6%) while keeping success/warning/info bright, so these
+      // two chips read as a more subdued tint there. Left as-is rather than
+      // hand-tuning a red-only opacity — that is a theme-layer
+      // characteristic, not this component's to paper over.
+      //
+      // TOKEN GAP — do NOT "fix" the text colours below to `text-*-foreground`
+      // (CMT-365-001 proposed exactly that). Those tokens pair with a SOLID
+      // fill: `--success-foreground` is `0 0% 100%` (pure white) and
+      // `--destructive-foreground` is `0 0% 98%`. These chips use a 15%/20%
+      // TINT, so white text on them measures roughly 1.2:1 — unreadable. That
+      // review was right about the defect and wrong about the remedy.
+      //
+      // The correct fix needs a token that does not exist yet: an "on-tint"
+      // foreground per status. The scales already carry the right value —
+      // `success.dark` is #065F46, which is what `emerald-700` approximates —
+      // but no `--color-success-dark` utility is emitted, so it cannot be
+      // referenced from here today. Adding one is a design-system API
+      // decision, so it is recorded rather than smuggled in.
+      //
+      // Until then this is a KNOWN brand-theming gap, stated plainly: a
+      // consumer brand that redefines `success` gets the new background and
+      // the old text colour.
+      status: {
+        onTrack: "border-transparent bg-success/15 text-emerald-700 dark:bg-success/20 dark:text-emerald-300",
+        done: "border-transparent bg-success/15 text-emerald-700 dark:bg-success/20 dark:text-emerald-300",
+        atRisk: "border-transparent bg-warning/15 text-amber-800 dark:bg-warning/20 dark:text-amber-200",
+        inProgress: "border-transparent bg-info/15 text-blue-700 dark:bg-info/20 dark:text-blue-300",
+        offTrack: "border-transparent bg-destructive/15 text-red-700 dark:bg-destructive/20 dark:text-red-300",
+        blocked: "border-transparent bg-destructive/15 text-red-700 dark:bg-destructive/20 dark:text-red-300"
+      }
+    }
+  }
+);
+function StatusBadge({ className, status, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn(statusBadgeVariants({ status }), className),
+      ...props
+    }
+  );
+}
+
+export { StatusBadge, statusBadgeVariants };
+//# sourceMappingURL=chunk-XMK3T4TA.js.map
+//# sourceMappingURL=chunk-XMK3T4TA.js.map

package/dist/chunk-XMK3T4TA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/patterns/status-badge.tsx"],"names":[],"mappings":";;;;AAgBO,IAAM,mBAAA,GAAsB,GAAA;AAAA,EACjC,8LAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MA0CR,MAAA,EAAQ;AAAA,QACN,OAAA,EACE,4FAAA;AAAA,QACF,IAAA,EAAM,4FAAA;AAAA,QACN,MAAA,EACE,wFAAA;AAAA,QACF,UAAA,EACE,gFAAA;AAAA,QACF,QAAA,EACE,4FAAA;AAAA,QACF,OAAA,EACE;AAAA;AACJ;AACF;AAEJ;AAwBO,SAAS,YAAY,EAAE,SAAA,EAAW,MAAA,EAAQ,GAAG,OAAM,EAAqB;AAC7E,EAAA,uBACE,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,WAAW,EAAA,CAAG,mBAAA,CAAoB,EAAE,MAAA,EAAQ,GAAG,SAAS,CAAA;AAAA,MACvD,GAAG;AAAA;AAAA,GACN;AAEJ","file":"chunk-XMK3T4TA.js","sourcesContent":["import * as React from \"react\";\nimport { type VariantProps, cva } from \"class-variance-authority\";\nimport type { status } from \"@marktiderman/genesis-design-system/tokens\";\nimport { cn } from \"../../utils\";\n\n/**\n * The domain status vocabulary `StatusBadge` understands. A `Pick` (not a\n * hand-copied literal union) of `@marktiderman/genesis-design-system`'s\n * `status` tokens, so removing/renaming one of these keys upstream breaks\n * this file's typecheck instead of silently drifting.\n */\ntype StatusBadgeStatus = keyof Pick<\n  typeof status,\n  \"onTrack\" | \"atRisk\" | \"offTrack\" | \"done\" | \"blocked\" | \"inProgress\"\n>;\n\nexport const statusBadgeVariants = cva(\n  \"inline-flex w-fit items-center whitespace-nowrap rounded-full border px-2.5 py-0.5 text-xs font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2\",\n  {\n    variants: {\n      // AA-safe status text on the tinted chip, same technique as `Badge`'s\n      // success/warning/info variants (see badge.tsx): same-hue text on the\n      // raw tint fails WCAG AA, so text uses the semantic Tailwind ramp\n      // (same hues as the Genesis status tokens). All four hues clear 4.5:1\n      // at the 700(light)/300(dark) stops over the /15(light) and /20(dark)\n      // tints (emerald-700 4.76:1, blue-700 5.64:1, red-700 ~5.3:1);\n      // warning needs the 800/200 bump (amber-700 was 4.48:1 — under the\n      // 4.5:1 floor).\n      //\n      // NOTE on `destructive` vs `error`: the offTrack/blocked tint is\n      // `bg-destructive`, NOT `bg-error`, even though these two map to the\n      // `semantic.error` token upstream. The token layer names this\n      // semantic `error`; the CSS theme layer (apps' `@theme` blocks,\n      // design-system's generated genesis.css) names the very same color\n      // `destructive` and registers no `--color-error` at all — so\n      // `bg-error` would silently emit no utility and render an untinted\n      // chip. In light mode the two are literally the same value\n      // (`--destructive` = 0 84.2% 60.2% = #EF4444 = semantic.error.DEFAULT).\n      // Dark mode is the one asymmetry: the theme darkens `--destructive`\n      // (0 62.8% 30.6%) while keeping success/warning/info bright, so these\n      // two chips read as a more subdued tint there. Left as-is rather than\n      // hand-tuning a red-only opacity — that is a theme-layer\n      // characteristic, not this component's to paper over.\n      //\n      // TOKEN GAP — do NOT \"fix\" the text colours below to `text-*-foreground`\n      // (CMT-365-001 proposed exactly that). Those tokens pair with a SOLID\n      // fill: `--success-foreground` is `0 0% 100%` (pure white) and\n      // `--destructive-foreground` is `0 0% 98%`. These chips use a 15%/20%\n      // TINT, so white text on them measures roughly 1.2:1 — unreadable. That\n      // review was right about the defect and wrong about the remedy.\n      //\n      // The correct fix needs a token that does not exist yet: an \"on-tint\"\n      // foreground per status. The scales already carry the right value —\n      // `success.dark` is #065F46, which is what `emerald-700` approximates —\n      // but no `--color-success-dark` utility is emitted, so it cannot be\n      // referenced from here today. Adding one is a design-system API\n      // decision, so it is recorded rather than smuggled in.\n      //\n      // Until then this is a KNOWN brand-theming gap, stated plainly: a\n      // consumer brand that redefines `success` gets the new background and\n      // the old text colour.\n      status: {\n        onTrack:\n          \"border-transparent bg-success/15 text-emerald-700 dark:bg-success/20 dark:text-emerald-300\",\n        done: \"border-transparent bg-success/15 text-emerald-700 dark:bg-success/20 dark:text-emerald-300\",\n        atRisk:\n          \"border-transparent bg-warning/15 text-amber-800 dark:bg-warning/20 dark:text-amber-200\",\n        inProgress:\n          \"border-transparent bg-info/15 text-blue-700 dark:bg-info/20 dark:text-blue-300\",\n        offTrack:\n          \"border-transparent bg-destructive/15 text-red-700 dark:bg-destructive/20 dark:text-red-300\",\n        blocked:\n          \"border-transparent bg-destructive/15 text-red-700 dark:bg-destructive/20 dark:text-red-300\",\n      } satisfies Record<StatusBadgeStatus, string>,\n    },\n  }\n);\n\nexport interface StatusBadgeProps\n  extends Omit<React.HTMLAttributes<HTMLSpanElement>, \"color\"> {\n  /** Which status to render. Drives the tint via `statusBadgeVariants`. */\n  status: StatusBadgeStatus;\n}\n\n/**\n * Status-specific badge for progress/health states — the EOS/OKR-style\n * \"on track / at risk / off track\" goal vocabulary plus common\n * task-lifecycle states (\"done\", \"blocked\", \"in progress\").\n *\n * `Badge` answers \"what color is this badge\"; `StatusBadge` answers \"what\n * does this business status look like as a badge\" — it owns the\n * status → semantic-token mapping so consumers pass a status name instead\n * of hand-rolling their own `status-to-color` lookup (the pattern this\n * component exists to retire). Colors are token-driven — the same\n * `bg-success` / `bg-warning` / `bg-destructive` / `bg-info` semantic\n * Tailwind families `Badge` already uses, backed by\n * `@marktiderman/genesis-design-system`'s `status` tokens — no raw hex here.\n *\n * @stability Beta\n */\nexport function StatusBadge({ className, status, ...props }: StatusBadgeProps) {\n  return (\n    <span\n      className={cn(statusBadgeVariants({ status }), className)}\n      {...props}\n    />\n  );\n}\n\nexport type { StatusBadgeStatus };\n"]}