@verdify/ui 0.1.0

package/dist/components/input/input.js

@@ -0,0 +1,71 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../../lib/cn";
+import {
+  inputVariants,
+  inputMessageVariants
+} from "./input.variants";
+const Input = React.forwardRef(
+  function Input2({
+    id,
+    className,
+    size,
+    leading,
+    trailing,
+    help,
+    error,
+    "aria-describedby": describedBy,
+    ...props
+  }, ref) {
+    const invalid = error != null && error !== false;
+    const showMessage = help != null || invalid;
+    const messageId = showMessage ? `${id}-message` : void 0;
+    const describedByValue = [describedBy, messageId].filter(Boolean).join(" ") || void 0;
+    return /* @__PURE__ */ jsxs("div", { className: "w-full", children: [
+      /* @__PURE__ */ jsxs("div", { className: "relative flex items-center", children: [
+        leading ? /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: cn(
+              "pointer-events-none absolute start-0 flex items-center justify-center",
+              "ps-(--space-3) text-control-placeholder text-(length:--size-icon-sm)"
+            ),
+            children: leading
+          }
+        ) : null,
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            ref,
+            id,
+            "aria-invalid": invalid || void 0,
+            "aria-describedby": describedByValue,
+            className: cn(
+              inputVariants({
+                size,
+                leadingSlot: !!leading,
+                trailingSlot: !!trailing
+              }),
+              className
+            ),
+            ...props
+          }
+        ),
+        trailing ? /* @__PURE__ */ jsx("span", { className: "absolute end-0 flex items-center justify-center pe-(--space-2) text-(length:--size-icon-sm)", children: trailing }) : null
+      ] }),
+      showMessage ? /* @__PURE__ */ jsx(
+        "p",
+        {
+          id: messageId,
+          className: inputMessageVariants({ tone: invalid ? "error" : "help" }),
+          children: invalid ? error : help
+        }
+      ) : null
+    ] });
+  }
+);
+export {
+  Input
+};
+//# sourceMappingURL=input.js.map

package/dist/components/input/input.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/input/input.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport {\n  inputVariants,\n  inputMessageVariants,\n  type InputVariantProps,\n} from \"./input.variants\";\n\nexport interface InputProps\n  extends Omit<React.InputHTMLAttributes<HTMLInputElement>, \"size\">,\n    Pick<InputVariantProps, \"size\"> {\n  /** Required: the field is wired to a sibling <label for={id}> (or aria-label). */\n  id: string;\n  /** Icon/prefix inside the inline-start edge (search glyph, currency mark). */\n  leading?: React.ReactNode;\n  /** Icon/affordance inside the inline-end edge (clear, reveal, unit suffix). */\n  trailing?: React.ReactNode;\n  /** Neutral description below the field, wired by aria-describedby. */\n  help?: React.ReactNode;\n  /** Error message below the field: sets aria-invalid + critical border, wired\n   *  by aria-describedby so the reason is read with the field. */\n  error?: React.ReactNode;\n}\n\n// Render-only native control: error/disabled/readOnly are props, not internal\n// state, and there is no hook, effect, or stateful Radix primitive — so NO\n// 'use client' directive (input.md §7: the native <input> role, no composite widget).\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n  function Input(\n    {\n      id,\n      className,\n      size,\n      leading,\n      trailing,\n      help,\n      error,\n      \"aria-describedby\": describedBy,\n      ...props\n    },\n    ref,\n  ) {\n    const invalid = error != null && error !== false;\n    const showMessage = help != null || invalid;\n    const messageId = showMessage ? `${id}-message` : undefined;\n    // caller-provided aria-describedby first, then the generated message id —\n    // both are read with the field; collapse to undefined when neither is set.\n    const describedByValue =\n      [describedBy, messageId].filter(Boolean).join(\" \") || undefined;\n    return (\n      <div className=\"w-full\">\n        <div className=\"relative flex items-center\">\n          {leading ? (\n            <span\n              aria-hidden=\"true\"\n              className={cn(\n                \"pointer-events-none absolute start-0 flex items-center justify-center\",\n                \"ps-(--space-3) text-control-placeholder text-(length:--size-icon-sm)\",\n              )}\n            >\n              {leading}\n            </span>\n          ) : null}\n          <input\n            ref={ref}\n            id={id}\n            aria-invalid={invalid || undefined}\n            aria-describedby={describedByValue}\n            className={cn(\n              inputVariants({\n                size,\n                leadingSlot: !!leading,\n                trailingSlot: !!trailing,\n              }),\n              className,\n            )}\n            {...props}\n          />\n          {trailing ? (\n            <span className=\"absolute end-0 flex items-center justify-center pe-(--space-2) text-(length:--size-icon-sm)\">\n              {trailing}\n            </span>\n          ) : null}\n        </div>\n        {showMessage ? (\n          <p\n            id={messageId}\n            className={inputMessageVariants({ tone: invalid ? \"error\" : \"help\" })}\n          >\n            {invalid ? error : help}\n          </p>\n        ) : null}\n      </div>\n    );\n  },\n);\n"],"mappings":"AAmDQ,SAEI,KAFJ;AAnDR,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB;AAAA,EACE;AAAA,EACA;AAAA,OAEK;AAqBA,MAAM,QAAQ,MAAM;AAAA,EACzB,SAASA,OACP;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,oBAAoB;AAAA,IACpB,GAAG;AAAA,EACL,GACA,KACA;AACA,UAAM,UAAU,SAAS,QAAQ,UAAU;AAC3C,UAAM,cAAc,QAAQ,QAAQ;AACpC,UAAM,YAAY,cAAc,GAAG,EAAE,aAAa;AAGlD,UAAM,mBACJ,CAAC,aAAa,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,KAAK;AACxD,WACE,qBAAC,SAAI,WAAU,UACb;AAAA,2BAAC,SAAI,WAAU,8BACZ;AAAA,kBACC;AAAA,UAAC;AAAA;AAAA,YACC,eAAY;AAAA,YACZ,WAAW;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YAEC;AAAA;AAAA,QACH,IACE;AAAA,QACJ;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA,gBAAc,WAAW;AAAA,YACzB,oBAAkB;AAAA,YAClB,WAAW;AAAA,cACT,cAAc;AAAA,gBACZ;AAAA,gBACA,aAAa,CAAC,CAAC;AAAA,gBACf,cAAc,CAAC,CAAC;AAAA,cAClB,CAAC;AAAA,cACD;AAAA,YACF;AAAA,YACC,GAAG;AAAA;AAAA,QACN;AAAA,QACC,WACC,oBAAC,UAAK,WAAU,+FACb,oBACH,IACE;AAAA,SACN;AAAA,MACC,cACC;AAAA,QAAC;AAAA;AAAA,UACC,IAAI;AAAA,UACJ,WAAW,qBAAqB,EAAE,MAAM,UAAU,UAAU,OAAO,CAAC;AAAA,UAEnE,oBAAU,QAAQ;AAAA;AAAA,MACrB,IACE;AAAA,OACN;AAAA,EAEJ;AACF;","names":["Input"]}

package/dist/components/input/input.variants.d.ts

@@ -0,0 +1,11 @@
+import { type VariantProps } from "class-variance-authority";
+export declare const inputVariants: (props?: ({
+    size?: "md" | "sm" | null | undefined;
+    leadingSlot?: boolean | null | undefined;
+    trailingSlot?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type InputVariantProps = VariantProps<typeof inputVariants>;
+export declare const inputMessageVariants: (props?: ({
+    tone?: "error" | "help" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+//# sourceMappingURL=input.variants.d.ts.map

package/dist/components/input/input.variants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.variants.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.variants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAKlE,eAAO,MAAM,aAAa;;;;8EAmDzB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC;AAInE,eAAO,MAAM,oBAAoB;;8EAK/B,CAAC"}

package/dist/components/input/input.variants.js

@@ -0,0 +1,64 @@
+import { cva } from "class-variance-authority";
+const inputVariants = cva(
+  [
+    // shape + resting field: control-* carries the field, neutrals not brand
+    "block w-full rounded-md border bg-control-bg text-control-fg",
+    "border-control-border placeholder:text-control-placeholder",
+    // DEC-A — the value SIZE is text-base (16px) so iOS never zooms on focus; the
+    // brand BODY line-height + letter-spacing ride along via the role-suffix vars.
+    // text-body itself (0.9375rem / 15px) is NEVER bound on a form field: under the
+    // role-aware cn it would collapse against text-base, and 15px would reintroduce
+    // the iOS focus-zoom that the 16px reset exists to prevent.
+    "text-base leading-(--text-body--line-height) tracking-(--text-body--letter-spacing)",
+    // hover shows a text caret; the border does NOT change color (restraint)
+    "cursor-text",
+    // focus: visible 2px signal-blue ring at 2px offset + focused border, never
+    // removed (2.4.7); border+ring meet 3:1 non-text contrast (1.4.11)
+    "outline-none",
+    "focus-visible:ring-2 focus-visible:ring-border-focus focus-visible:ring-offset-2",
+    "focus-visible:border-border-focus",
+    // colors transition functionally (no theatre); border + ring only
+    "transition-colors duration-(--motion-duration-fast) ease-(--motion-easing-verdify)",
+    // disabled: muted value, non-interactive (native disabled drives tab skip)
+    "disabled:cursor-not-allowed disabled:text-text-disabled",
+    // read-only: editable-looking, selectable, stays in the tab order
+    "read-only:cursor-default",
+    // ERROR is the only colored field state — it borrows the STATUS color, never
+    // the brand (§3, §8). Driven by the native aria-invalid attribute.
+    "aria-invalid:border-status-critical-border",
+    "aria-invalid:focus-visible:ring-status-critical-border",
+    // 44px mobile / 40px desktop target floor, logical block-size. DEC-B: tokens
+    // expose only target-size FLOORS, no height scale — every size anchors this
+    // floor and never sets a fixed height below it (a11y). Resting height emerges
+    // from the size variant's vertical padding above this floor.
+    "min-h-(--size-target-mobile) sm:min-h-(--size-target-desktop)"
+  ],
+  {
+    variants: {
+      // DEC-B — the 16px no-zoom reset is a hard floor on every form-field size, so
+      // (unlike a non-field control) the type role is held constant and the sizes
+      // differ ONLY by vertical padding (density) ABOVE the shared target floor:
+      // --space-1 (0.25rem) <= --space-2 (0.5rem) gives a coherent sm <= md height
+      // progression, both >= the floor.
+      size: {
+        md: "py-(--space-2)",
+        sm: "py-(--space-1)"
+      },
+      // logical inline padding; widened on the slot side to reserve room
+      leadingSlot: { true: "ps-(--space-9)", false: "ps-(--space-3)" },
+      trailingSlot: { true: "pe-(--space-9)", false: "pe-(--space-3)" }
+    },
+    defaultVariants: { size: "md", leadingSlot: false, trailingSlot: false }
+  }
+);
+const inputMessageVariants = cva("mt-(--space-1) text-caption", {
+  variants: {
+    tone: { help: "text-text-secondary", error: "text-status-critical-fg" }
+  },
+  defaultVariants: { tone: "help" }
+});
+export {
+  inputMessageVariants,
+  inputVariants
+};
+//# sourceMappingURL=input.variants.js.map

package/dist/components/input/input.variants.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/input/input.variants.ts"],"sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\";\n\n// The text field. Token binding lives ONLY here. Native <input>, no Radix.\n// The closed state set for a text field is default·hover·focus·disabled·read-only·error\n// (input.md §4) — loading and pressed do NOT apply and are dropped.\nexport const inputVariants = cva(\n  [\n    // shape + resting field: control-* carries the field, neutrals not brand\n    \"block w-full rounded-md border bg-control-bg text-control-fg\",\n    \"border-control-border placeholder:text-control-placeholder\",\n    // DEC-A — the value SIZE is text-base (16px) so iOS never zooms on focus; the\n    // brand BODY line-height + letter-spacing ride along via the role-suffix vars.\n    // text-body itself (0.9375rem / 15px) is NEVER bound on a form field: under the\n    // role-aware cn it would collapse against text-base, and 15px would reintroduce\n    // the iOS focus-zoom that the 16px reset exists to prevent.\n    \"text-base leading-(--text-body--line-height) tracking-(--text-body--letter-spacing)\",\n    // hover shows a text caret; the border does NOT change color (restraint)\n    \"cursor-text\",\n    // focus: visible 2px signal-blue ring at 2px offset + focused border, never\n    // removed (2.4.7); border+ring meet 3:1 non-text contrast (1.4.11)\n    \"outline-none\",\n    \"focus-visible:ring-2 focus-visible:ring-border-focus focus-visible:ring-offset-2\",\n    \"focus-visible:border-border-focus\",\n    // colors transition functionally (no theatre); border + ring only\n    \"transition-colors duration-(--motion-duration-fast) ease-(--motion-easing-verdify)\",\n    // disabled: muted value, non-interactive (native disabled drives tab skip)\n    \"disabled:cursor-not-allowed disabled:text-text-disabled\",\n    // read-only: editable-looking, selectable, stays in the tab order\n    \"read-only:cursor-default\",\n    // ERROR is the only colored field state — it borrows the STATUS color, never\n    // the brand (§3, §8). Driven by the native aria-invalid attribute.\n    \"aria-invalid:border-status-critical-border\",\n    \"aria-invalid:focus-visible:ring-status-critical-border\",\n    // 44px mobile / 40px desktop target floor, logical block-size. DEC-B: tokens\n    // expose only target-size FLOORS, no height scale — every size anchors this\n    // floor and never sets a fixed height below it (a11y). Resting height emerges\n    // from the size variant's vertical padding above this floor.\n    \"min-h-(--size-target-mobile) sm:min-h-(--size-target-desktop)\",\n  ],\n  {\n    variants: {\n      // DEC-B — the 16px no-zoom reset is a hard floor on every form-field size, so\n      // (unlike a non-field control) the type role is held constant and the sizes\n      // differ ONLY by vertical padding (density) ABOVE the shared target floor:\n      // --space-1 (0.25rem) <= --space-2 (0.5rem) gives a coherent sm <= md height\n      // progression, both >= the floor.\n      size: {\n        md: \"py-(--space-2)\",\n        sm: \"py-(--space-1)\",\n      },\n      // logical inline padding; widened on the slot side to reserve room\n      leadingSlot: { true: \"ps-(--space-9)\", false: \"ps-(--space-3)\" },\n      trailingSlot: { true: \"pe-(--space-9)\", false: \"pe-(--space-3)\" },\n    },\n    defaultVariants: { size: \"md\", leadingSlot: false, trailingSlot: false },\n  },\n);\n\nexport type InputVariantProps = VariantProps<typeof inputVariants>;\n\n// The message below the field. The error help text borrows the field's STATUS\n// color (the only colored field state); neutral help text is muted secondary.\nexport const inputMessageVariants = cva(\"mt-(--space-1) text-caption\", {\n  variants: {\n    tone: { help: \"text-text-secondary\", error: \"text-status-critical-fg\" },\n  },\n  defaultVariants: { tone: \"help\" },\n});\n"],"mappings":"AAAA,SAAS,WAA8B;AAKhC,MAAM,gBAAgB;AAAA,EAC3B;AAAA;AAAA,IAEE;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA;AAAA;AAAA,IAEA;AAAA;AAAA;AAAA,IAGA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,IAEA;AAAA;AAAA,IAEA;AAAA;AAAA,IAEA;AAAA;AAAA;AAAA,IAGA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA;AAAA,EACF;AAAA,EACA;AAAA,IACE,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAMR,MAAM;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MACN;AAAA;AAAA,MAEA,aAAa,EAAE,MAAM,kBAAkB,OAAO,iBAAiB;AAAA,MAC/D,cAAc,EAAE,MAAM,kBAAkB,OAAO,iBAAiB;AAAA,IAClE;AAAA,IACA,iBAAiB,EAAE,MAAM,MAAM,aAAa,OAAO,cAAc,MAAM;AAAA,EACzE;AACF;AAMO,MAAM,uBAAuB,IAAI,+BAA+B;AAAA,EACrE,UAAU;AAAA,IACR,MAAM,EAAE,MAAM,uBAAuB,OAAO,0BAA0B;AAAA,EACxE;AAAA,EACA,iBAAiB,EAAE,MAAM,OAAO;AAClC,CAAC;","names":[]}

package/dist/components/label/index.d.ts

@@ -0,0 +1,3 @@
+export { Label, type LabelProps } from "./label";
+export { labelVariants, requiredMarkVariants, optionalHintVariants, type LabelVariantProps, } from "./label.variants";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/label/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/label/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AACjD,OAAO,EACL,aAAa,EACb,oBAAoB,EACpB,oBAAoB,EACpB,KAAK,iBAAiB,GACvB,MAAM,kBAAkB,CAAC"}

package/dist/components/label/index.js

@@ -0,0 +1,13 @@
+import { Label } from "./label";
+import {
+  labelVariants,
+  requiredMarkVariants,
+  optionalHintVariants
+} from "./label.variants";
+export {
+  Label,
+  labelVariants,
+  optionalHintVariants,
+  requiredMarkVariants
+};
+//# sourceMappingURL=index.js.map

package/dist/components/label/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/label/index.ts"],"sourcesContent":["export { Label, type LabelProps } from \"./label\";\nexport {\n  labelVariants,\n  requiredMarkVariants,\n  optionalHintVariants,\n  type LabelVariantProps,\n} from \"./label.variants\";\n"],"mappings":"AAAA,SAAS,aAA8B;AACvC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OAEK;","names":[]}

package/dist/components/label/label.d.ts

@@ -0,0 +1,16 @@
+import * as React from "react";
+import { type LabelVariantProps } from "./label.variants";
+export interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement>, Omit<LabelVariantProps, "disabled"> {
+    /**
+     * Show the required mark. Presentation only — the field's required state is
+     * carried by the control's `required` / `aria-required`, not by this mark.
+     * Mutually exclusive with `optional`; `required` wins.
+     */
+    required?: boolean;
+    /** Show the optional hint instead of a mark. Ignored when `required` is set. */
+    optional?: boolean;
+    /** Reflect the associated control's disabled state (renders disabled text). */
+    disabled?: boolean;
+}
+export declare const Label: React.ForwardRefExoticComponent<LabelProps & React.RefAttributes<HTMLLabelElement>>;
+//# sourceMappingURL=label.d.ts.map

package/dist/components/label/label.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"label.d.ts","sourceRoot":"","sources":["../../../src/components/label/label.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAIL,KAAK,iBAAiB,EACvB,MAAM,kBAAkB,CAAC;AAE1B,MAAM,WAAW,UACf,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EACjD,IAAI,CAAC,iBAAiB,EAAE,UAAU,CAAC;IACrC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gFAAgF;IAChF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+EAA+E;IAC/E,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,KAAK,qFA2BjB,CAAC"}

package/dist/components/label/label.js

@@ -0,0 +1,27 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../../lib/cn";
+import {
+  labelVariants,
+  requiredMarkVariants,
+  optionalHintVariants
+} from "./label.variants";
+const Label = React.forwardRef(
+  function Label2({ className, required = false, optional = false, disabled = false, children, ...props }, ref) {
+    return (
+      // native <label>; associate with its control via the `htmlFor`/`id` props.
+      // No role override, no tabIndex, no focus ring — not an interactive control.
+      /* @__PURE__ */ jsxs("label", { ref, className: cn(labelVariants({ disabled }), className), ...props, children: [
+        children,
+        required ? /* @__PURE__ */ jsxs("span", { "data-testid": "label-required-mark", className: cn(requiredMarkVariants()), children: [
+          /* @__PURE__ */ jsx("span", { "data-testid": "label-required-glyph", "aria-hidden": "true", children: "*" }),
+          /* @__PURE__ */ jsx("span", { className: "sr-only", children: "required" })
+        ] }) : optional ? /* @__PURE__ */ jsx("span", { "data-testid": "label-optional-hint", className: cn(optionalHintVariants()), children: "optional" }) : null
+      ] })
+    );
+  }
+);
+export {
+  Label
+};
+//# sourceMappingURL=label.js.map

package/dist/components/label/label.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/label/label.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport {\n  labelVariants,\n  requiredMarkVariants,\n  optionalHintVariants,\n  type LabelVariantProps,\n} from \"./label.variants\";\n\nexport interface LabelProps\n  extends React.LabelHTMLAttributes<HTMLLabelElement>,\n    Omit<LabelVariantProps, \"disabled\"> {\n  /**\n   * Show the required mark. Presentation only — the field's required state is\n   * carried by the control's `required` / `aria-required`, not by this mark.\n   * Mutually exclusive with `optional`; `required` wins.\n   */\n  required?: boolean;\n  /** Show the optional hint instead of a mark. Ignored when `required` is set. */\n  optional?: boolean;\n  /** Reflect the associated control's disabled state (renders disabled text). */\n  disabled?: boolean;\n}\n\nexport const Label = React.forwardRef<HTMLLabelElement, LabelProps>(\n  function Label(\n    { className, required = false, optional = false, disabled = false, children, ...props },\n    ref,\n  ) {\n    return (\n      // native <label>; associate with its control via the `htmlFor`/`id` props.\n      // No role override, no tabIndex, no focus ring — not an interactive control.\n      <label ref={ref} className={cn(labelVariants({ disabled }), className)} {...props}>\n        {children}\n        {required ? (\n          <span data-testid=\"label-required-mark\" className={cn(requiredMarkVariants())}>\n            {/* decorative glyph — the meaning is the word, not the color */}\n            <span data-testid=\"label-required-glyph\" aria-hidden=\"true\">\n              *\n            </span>\n            {/* visually hidden so the mark reads \"required\" to assistive tech */}\n            <span className=\"sr-only\">required</span>\n          </span>\n        ) : optional ? (\n          <span data-testid=\"label-optional-hint\" className={cn(optionalHintVariants())}>\n            optional\n          </span>\n        ) : null}\n      </label>\n    );\n  },\n);\n"],"mappings":"AAmCU,SAEE,KAFF;AAnCV,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AAiBA,MAAM,QAAQ,MAAM;AAAA,EACzB,SAASA,OACP,EAAE,WAAW,WAAW,OAAO,WAAW,OAAO,WAAW,OAAO,UAAU,GAAG,MAAM,GACtF,KACA;AACA;AAAA;AAAA;AAAA,MAGE,qBAAC,WAAM,KAAU,WAAW,GAAG,cAAc,EAAE,SAAS,CAAC,GAAG,SAAS,GAAI,GAAG,OACzE;AAAA;AAAA,QACA,WACC,qBAAC,UAAK,eAAY,uBAAsB,WAAW,GAAG,qBAAqB,CAAC,GAE1E;AAAA,8BAAC,UAAK,eAAY,wBAAuB,eAAY,QAAO,eAE5D;AAAA,UAEA,oBAAC,UAAK,WAAU,WAAU,sBAAQ;AAAA,WACpC,IACE,WACF,oBAAC,UAAK,eAAY,uBAAsB,WAAW,GAAG,qBAAqB,CAAC,GAAG,sBAE/E,IACE;AAAA,SACN;AAAA;AAAA,EAEJ;AACF;","names":["Label"]}

package/dist/components/label/label.variants.d.ts

@@ -0,0 +1,8 @@
+import { type VariantProps } from "class-variance-authority";
+export declare const labelVariants: (props?: ({
+    disabled?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const requiredMarkVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const optionalHintVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export type LabelVariantProps = VariantProps<typeof labelVariants>;
+//# sourceMappingURL=label.variants.d.ts.map

package/dist/components/label/label.variants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"label.variants.d.ts","sourceRoot":"","sources":["../../../src/components/label/label.variants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAKlE,eAAO,MAAM,aAAa;;8EAezB,CAAC;AAKF,eAAO,MAAM,oBAAoB,oFAE/B,CAAC;AAGH,eAAO,MAAM,oBAAoB,oFAA4C,CAAC;AAE9E,MAAM,MAAM,iBAAiB,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC"}

package/dist/components/label/label.variants.js

@@ -0,0 +1,27 @@
+import { cva } from "class-variance-authority";
+const labelVariants = cva(
+  [
+    "inline-flex items-center gap-(--space-2)",
+    "text-label font-medium text-text-primary select-none"
+  ],
+  {
+    variants: {
+      disabled: {
+        // reflects the associated control's disabled state; stays in the DOM
+        true: "text-text-disabled",
+        false: ""
+      }
+    },
+    defaultVariants: { disabled: false }
+  }
+);
+const requiredMarkVariants = cva([
+  "inline-flex items-center gap-(--space-1) text-status-critical-fg"
+]);
+const optionalHintVariants = cva(["text-caption text-text-secondary"]);
+export {
+  labelVariants,
+  optionalHintVariants,
+  requiredMarkVariants
+};
+//# sourceMappingURL=label.variants.js.map

package/dist/components/label/label.variants.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/label/label.variants.ts"],"sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\";\n\n// Resting label text: the label type role + primary text color, laid out inline\n// with its mark/hint at the --space-2 gap. No focus ring, no target-size floor —\n// a Label is not interactive. `disabled` reflects the control's state visually.\nexport const labelVariants = cva(\n  [\n    \"inline-flex items-center gap-(--space-2)\",\n    \"text-label font-medium text-text-primary select-none\",\n  ],\n  {\n    variants: {\n      disabled: {\n        // reflects the associated control's disabled state; stays in the DOM\n        true: \"text-text-disabled\",\n        false: \"\",\n      },\n    },\n    defaultVariants: { disabled: false },\n  },\n);\n\n// The required mark — meaning carried by shape + text, never color alone. The\n// critical color is permitted ONLY here (paired with the asterisk glyph and the\n// visually-hidden \"required\" word), never on resting label text.\nexport const requiredMarkVariants = cva([\n  \"inline-flex items-center gap-(--space-1) text-status-critical-fg\",\n]);\n\n// The optional hint — a short secondary note in the caption role + secondary color.\nexport const optionalHintVariants = cva([\"text-caption text-text-secondary\"]);\n\nexport type LabelVariantProps = VariantProps<typeof labelVariants>;\n"],"mappings":"AAAA,SAAS,WAA8B;AAKhC,MAAM,gBAAgB;AAAA,EAC3B;AAAA,IACE;AAAA,IACA;AAAA,EACF;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,UAAU;AAAA;AAAA,QAER,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,IACF;AAAA,IACA,iBAAiB,EAAE,UAAU,MAAM;AAAA,EACrC;AACF;AAKO,MAAM,uBAAuB,IAAI;AAAA,EACtC;AACF,CAAC;AAGM,MAAM,uBAAuB,IAAI,CAAC,kCAAkC,CAAC;","names":[]}

package/dist/components/menu/index.d.ts

@@ -0,0 +1,3 @@
+export { Menu, MenuTrigger, MenuContent, MenuItem, MenuGroup, MenuLabel, MenuSeparator, MenuSub, MenuSubTrigger, MenuSubContent, type MenuProps, type MenuTriggerProps, type MenuContentProps, type MenuItemProps, type MenuGroupProps, type MenuLabelProps, type MenuSeparatorProps, type MenuSubProps, type MenuSubTriggerProps, type MenuSubContentProps, } from "./menu";
+export { menuTriggerClass, menuPopupClass, menuItemVariants, menuItemIconClass, menuItemShortcutClass, menuSubChevronClass, menuLabelClass, menuSeparatorClass, type MenuItemVariantProps, } from "./menu.variants";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/menu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/menu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,IAAI,EACJ,WAAW,EACX,WAAW,EACX,QAAQ,EACR,SAAS,EACT,SAAS,EACT,aAAa,EACb,OAAO,EACP,cAAc,EACd,cAAc,EACd,KAAK,SAAS,EACd,KAAK,gBAAgB,EACrB,KAAK,gBAAgB,EACrB,KAAK,aAAa,EAClB,KAAK,cAAc,EACnB,KAAK,cAAc,EACnB,KAAK,kBAAkB,EACvB,KAAK,YAAY,EACjB,KAAK,mBAAmB,EACxB,KAAK,mBAAmB,GACzB,MAAM,QAAQ,CAAC;AAChB,OAAO,EACL,gBAAgB,EAChB,cAAc,EACd,gBAAgB,EAChB,iBAAiB,EACjB,qBAAqB,EACrB,mBAAmB,EACnB,cAAc,EACd,kBAAkB,EAClB,KAAK,oBAAoB,GAC1B,MAAM,iBAAiB,CAAC"}

package/dist/components/menu/index.js

@@ -0,0 +1,43 @@
+import {
+  Menu,
+  MenuTrigger,
+  MenuContent,
+  MenuItem,
+  MenuGroup,
+  MenuLabel,
+  MenuSeparator,
+  MenuSub,
+  MenuSubTrigger,
+  MenuSubContent
+} from "./menu";
+import {
+  menuTriggerClass,
+  menuPopupClass,
+  menuItemVariants,
+  menuItemIconClass,
+  menuItemShortcutClass,
+  menuSubChevronClass,
+  menuLabelClass,
+  menuSeparatorClass
+} from "./menu.variants";
+export {
+  Menu,
+  MenuContent,
+  MenuGroup,
+  MenuItem,
+  MenuLabel,
+  MenuSeparator,
+  MenuSub,
+  MenuSubContent,
+  MenuSubTrigger,
+  MenuTrigger,
+  menuItemIconClass,
+  menuItemShortcutClass,
+  menuItemVariants,
+  menuLabelClass,
+  menuPopupClass,
+  menuSeparatorClass,
+  menuSubChevronClass,
+  menuTriggerClass
+};
+//# sourceMappingURL=index.js.map

package/dist/components/menu/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/menu/index.ts"],"sourcesContent":["export {\n  Menu,\n  MenuTrigger,\n  MenuContent,\n  MenuItem,\n  MenuGroup,\n  MenuLabel,\n  MenuSeparator,\n  MenuSub,\n  MenuSubTrigger,\n  MenuSubContent,\n  type MenuProps,\n  type MenuTriggerProps,\n  type MenuContentProps,\n  type MenuItemProps,\n  type MenuGroupProps,\n  type MenuLabelProps,\n  type MenuSeparatorProps,\n  type MenuSubProps,\n  type MenuSubTriggerProps,\n  type MenuSubContentProps,\n} from \"./menu\";\nexport {\n  menuTriggerClass,\n  menuPopupClass,\n  menuItemVariants,\n  menuItemIconClass,\n  menuItemShortcutClass,\n  menuSubChevronClass,\n  menuLabelClass,\n  menuSeparatorClass,\n  type MenuItemVariantProps,\n} from \"./menu.variants\";\n"],"mappings":"AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAWK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAEK;","names":[]}

package/dist/components/menu/menu.d.ts

@@ -0,0 +1,115 @@
+import * as React from "react";
+import { DropdownMenu as DropdownMenuPrimitive } from "radix-ui";
+import { type MenuItemVariantProps } from "./menu.variants";
+export interface MenuProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Root> {
+}
+/**
+ * Menu is a popup list of ACTIONS that a trigger opens — the row of commands behind a button, an
+ * avatar, or a row's overflow control (spec §1). Reach for it when you want to fire an action (open,
+ * rename, sign out, revoke a key), not pick a value: use Select to choose one option from a list, and
+ * use the Sidebar for page-level navigation. Each item runs a command and then the menu closes.
+ *
+ * It is a NEUTRAL surface (spec §3): the popup, items, and separators are neutral, and the brand
+ * violet never marks an item as "the special one." The one colored item is the destructive item,
+ * which takes the destructive ACTION treatment because the command it runs is irreversible — a risk
+ * signal, not a status result; a verified result is never reported by a menu item (brand != state).
+ *
+ * Wraps the Radix DropdownMenu primitive (WAI-ARIA APG menu-button + menu pattern), which provides
+ * the portal, roving tabindex, type-ahead, submenu, and Escape/arrow keyboard model — a stateful
+ * primitive, so this file is `'use client'`.
+ */
+export declare function Menu(props: MenuProps): import("react/jsx-runtime").JSX.Element;
+export interface MenuTriggerProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Trigger> {
+}
+/**
+ * The control that opens the menu (spec §2 trigger): the one stop in the page tab order for this
+ * control, carrying the focus ring. Radix sets `aria-haspopup="menu"`, `aria-expanded`, and
+ * `aria-controls` (pointing at the popup) for you. Pass `asChild` to wrap your own Button so the
+ * trigger inherits its role, keyboard, and focus ring rather than nesting a second button; the bare
+ * (non-`asChild`) form renders the default neutral-ghost trigger.
+ */
+export declare const MenuTrigger: React.ForwardRefExoticComponent<MenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+export interface MenuContentProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> {
+}
+/**
+ * Renders the portal and the popup (spec §2 popup): the floating `role="menu"` surface that opens on
+ * activation, raised above the page and anchored to the trigger. On open, focus moves into the popup
+ * (first item, or last on Up) and roving tabindex tracks the active item; on close — by Escape,
+ * activation, or click-away — focus returns to the trigger (Radix, spec §6/§7). The menu is NOT a
+ * modal dialog: focus is not trapped, and Tab leaves the menu rather than stepping through items.
+ * A neutral raised surface; brand violet and Verified Green never appear here (spec §3/§5/§8).
+ */
+export declare const MenuContent: React.ForwardRefExoticComponent<MenuContentProps & React.RefAttributes<HTMLDivElement>>;
+export interface MenuItemProps extends Omit<React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item>, "color">, MenuItemVariantProps {
+    /** The leading icon (spec §2): decorative, sized by `--size-icon-md`; the item names itself by its label text. */
+    icon?: React.ReactNode;
+    /** A trailing shortcut hint (spec §2): text such as "⌘K", in the muted label role; never a focus stop. */
+    shortcut?: React.ReactNode;
+}
+/**
+ * One command row (spec §2 item, §4 states): a `role="menuitem"` whose activation runs its command
+ * and closes the menu, returning focus to the trigger (Radix). It holds an optional leading icon, a
+ * label, and an optional trailing shortcut hint. Pointer hover and keyboard arrow movement share ONE
+ * highlight (Radix `data-highlighted`), so the active item is the same for both (spec §4 Hover).
+ *
+ * `destructive` (spec §3 `item=destructive`) marks the ONE colored item — a command that is
+ * irreversible (revoke a key, delete a profile). It takes the destructive ACTION treatment and must
+ * name the consequence in its TEXT, never by color alone (spec §7/§8). A `disabled` item stays in the
+ * menu and readable to assistive technology (`aria-disabled`), is skipped by arrow movement, and does
+ * not fire on activation (spec §4 Disabled / §7).
+ */
+export declare const MenuItem: React.ForwardRefExoticComponent<MenuItemProps & React.RefAttributes<HTMLDivElement>>;
+export interface MenuGroupProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Group> {
+    /**
+     * The non-interactive heading that partitions the popup (spec §2 group / group-label). It names the
+     * group for assistive technology via `aria-labelledby` (Radix `Label`) and is NEVER a focus stop.
+     */
+    label?: React.ReactNode;
+}
+/**
+ * A set of related items under a non-interactive `group-label` that partitions the popup (spec §2
+ * group). The items read as a related set (`role="group"` named by the label); the label is never a
+ * menuitem and never a focus stop.
+ */
+export declare const MenuGroup: React.ForwardRefExoticComponent<MenuGroupProps & React.RefAttributes<HTMLDivElement>>;
+export interface MenuLabelProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> {
+}
+/**
+ * A standalone non-interactive section label (spec §2 group-label) for a label that is not wrapped in
+ * a `MenuGroup`. Like the group label it is the muted label-role heading and is never a focus stop.
+ */
+export declare const MenuLabel: React.ForwardRefExoticComponent<MenuLabelProps & React.RefAttributes<HTMLDivElement>>;
+export interface MenuSeparatorProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator> {
+}
+/**
+ * A thin neutral divider between groups (spec §2 separator): decorative (`role="separator"`), never a
+ * focus stop.
+ */
+export declare const MenuSeparator: React.ForwardRefExoticComponent<MenuSeparatorProps & React.RefAttributes<HTMLDivElement>>;
+export interface MenuSubProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Sub> {
+}
+/**
+ * A submenu: an item that opens a nested popup of its own items (spec §2 submenu). Keep nesting
+ * shallow — deep trees are hard to operate by keyboard (spec §2). Wraps `MenuSubTrigger` +
+ * `MenuSubContent`.
+ */
+export declare function MenuSub(props: MenuSubProps): import("react/jsx-runtime").JSX.Element;
+export interface MenuSubTriggerProps extends Omit<React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger>, "color">, MenuItemVariantProps {
+    /** The leading icon (spec §2): decorative, sized by `--size-icon-md`. */
+    icon?: React.ReactNode;
+}
+/**
+ * The item that opens a submenu (spec §2/§6): a `role="menuitem"` with `aria-haspopup="menu"` and its
+ * own `aria-expanded` (Radix). Right opens the submenu and focuses its first item; Left closes it and
+ * returns focus here. It carries the same row treatment as a `MenuItem`, plus a trailing chevron
+ * pointing to the inline-end.
+ */
+export declare const MenuSubTrigger: React.ForwardRefExoticComponent<MenuSubTriggerProps & React.RefAttributes<HTMLDivElement>>;
+export interface MenuSubContentProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent> {
+}
+/**
+ * The nested popup of a submenu (spec §2 submenu): the same neutral raised `role="menu"` surface as
+ * `MenuContent`, anchored to its `MenuSubTrigger`.
+ */
+export declare const MenuSubContent: React.ForwardRefExoticComponent<MenuSubContentProps & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=menu.d.ts.map

package/dist/components/menu/menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/components/menu/menu.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,YAAY,IAAI,qBAAqB,EAAE,MAAM,UAAU,CAAC;AAEjE,OAAO,EASL,KAAK,oBAAoB,EAC1B,MAAM,iBAAiB,CAAC;AAEzB,MAAM,WAAW,SACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,qBAAqB,CAAC,IAAI,CAAC;CAAG;AAE9E;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,IAAI,CAAC,KAAK,EAAE,SAAS,2CAEpC;AAED,MAAM,WAAW,gBACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,qBAAqB,CAAC,OAAO,CAAC;CAAG;AAEjF;;;;;;GAMG;AACH,eAAO,MAAM,WAAW,4FAYtB,CAAC;AAEH,MAAM,WAAW,gBACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,qBAAqB,CAAC,OAAO,CAAC;CAAG;AAEjF;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW,yFAkBtB,CAAC;AAEH,MAAM,WAAW,aACf,SAAQ,IAAI,CACR,KAAK,CAAC,wBAAwB,CAAC,OAAO,qBAAqB,CAAC,IAAI,CAAC,EACjE,OAAO,CACR,EACD,oBAAoB;IACtB,kHAAkH;IAClH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,0GAA0G;IAC1G,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,QAAQ,sFAmBnB,CAAC;AAEH,MAAM,WAAW,cACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,qBAAqB,CAAC,KAAK,CAAC;IAC1E;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACzB;AAED;;;;GAIG;AACH,eAAO,MAAM,SAAS,uFAyBpB,CAAC;AAEH,MAAM,WAAW,cACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,qBAAqB,CAAC,KAAK,CAAC;CAAG;AAE/E;;;GAGG;AACH,eAAO,MAAM,SAAS,uFAOpB,CAAC;AAEH,MAAM,WAAW,kBACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,qBAAqB,CAAC,SAAS,CAAC;CAAG;AAEnF;;;GAGG;AACH,eAAO,MAAM,aAAa,2FAWxB,CAAC;AAEH,MAAM,WAAW,YACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,qBAAqB,CAAC,GAAG,CAAC;CAAG;AAE7E;;;;GAIG;AACH,wBAAgB,OAAO,CAAC,KAAK,EAAE,YAAY,2CAE1C;AAED,MAAM,WAAW,mBACf,SAAQ,IAAI,CACR,KAAK,CAAC,wBAAwB,CAAC,OAAO,qBAAqB,CAAC,UAAU,CAAC,EACvE,OAAO,CACR,EACD,oBAAoB;IACtB,yEAAyE;IACzE,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACxB;AAED;;;;;GAKG;AACH,eAAO,MAAM,cAAc,4FAmBzB,CAAC;AAEH,MAAM,WAAW,mBACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,qBAAqB,CAAC,UAAU,CAAC;CAAG;AAEpF;;;GAGG;AACH,eAAO,MAAM,cAAc,4FAiBzB,CAAC"}

package/dist/components/menu/menu.js

@@ -0,0 +1,130 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { DropdownMenu as DropdownMenuPrimitive } from "radix-ui";
+import { cn } from "../../lib/cn";
+import {
+  menuTriggerClass,
+  menuPopupClass,
+  menuItemVariants,
+  menuItemIconClass,
+  menuItemShortcutClass,
+  menuSubChevronClass,
+  menuLabelClass,
+  menuSeparatorClass
+} from "./menu.variants";
+function Menu(props) {
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Root, { ...props });
+}
+const MenuTrigger = React.forwardRef(function MenuTrigger2({ className, asChild, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    DropdownMenuPrimitive.Trigger,
+    {
+      ref,
+      asChild,
+      className: asChild ? className : cn(menuTriggerClass, className),
+      ...props
+    }
+  );
+});
+const MenuContent = React.forwardRef(function MenuContent2({ className, sideOffset = 4, loop = true, ...props }, ref) {
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+    DropdownMenuPrimitive.Content,
+    {
+      ref,
+      sideOffset,
+      loop,
+      className: cn(menuPopupClass, className),
+      ...props
+    }
+  ) });
+});
+const MenuItem = React.forwardRef(function MenuItem2({ className, destructive, icon, shortcut, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxs(
+    DropdownMenuPrimitive.Item,
+    {
+      ref,
+      className: cn(menuItemVariants({ destructive }), className),
+      ...props,
+      children: [
+        icon ? /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: menuItemIconClass, children: icon }) : null,
+        /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children }),
+        shortcut ? /* @__PURE__ */ jsx("span", { className: menuItemShortcutClass, children: shortcut }) : null
+      ]
+    }
+  );
+});
+const MenuGroup = React.forwardRef(function MenuGroup2({ label, children, ...props }, ref) {
+  const labelId = React.useId();
+  return /* @__PURE__ */ jsxs(
+    DropdownMenuPrimitive.Group,
+    {
+      ref,
+      "aria-labelledby": label ? labelId : void 0,
+      ...props,
+      children: [
+        label ? /* @__PURE__ */ jsx(DropdownMenuPrimitive.Label, { id: labelId, className: menuLabelClass, children: label }) : null,
+        children
+      ]
+    }
+  );
+});
+const MenuLabel = React.forwardRef(function MenuLabel2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Label, { ref, className: cn(menuLabelClass, className), ...props });
+});
+const MenuSeparator = React.forwardRef(function MenuSeparator2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    DropdownMenuPrimitive.Separator,
+    {
+      ref,
+      className: cn(menuSeparatorClass, className),
+      ...props
+    }
+  );
+});
+function MenuSub(props) {
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Sub, { ...props });
+}
+const MenuSubTrigger = React.forwardRef(function MenuSubTrigger2({ className, destructive, icon, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxs(
+    DropdownMenuPrimitive.SubTrigger,
+    {
+      ref,
+      className: cn(menuItemVariants({ destructive }), className),
+      ...props,
+      children: [
+        icon ? /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: menuItemIconClass, children: icon }) : null,
+        /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children }),
+        /* @__PURE__ */ jsx(ChevronGlyph, {})
+      ]
+    }
+  );
+});
+const MenuSubContent = React.forwardRef(function MenuSubContent2({ className, sideOffset = 2, loop = true, ...props }, ref) {
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+    DropdownMenuPrimitive.SubContent,
+    {
+      ref,
+      sideOffset,
+      loop,
+      className: cn(menuPopupClass, className),
+      ...props
+    }
+  ) });
+});
+function ChevronGlyph() {
+  return /* @__PURE__ */ jsx("span", { "data-testid": "menu-sub-chevron", "aria-hidden": "true", className: menuSubChevronClass, children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", focusable: "false", children: /* @__PURE__ */ jsx("path", { d: "M6 4l4 4-4 4", strokeLinecap: "round", strokeLinejoin: "round" }) }) });
+}
+export {
+  Menu,
+  MenuContent,
+  MenuGroup,
+  MenuItem,
+  MenuLabel,
+  MenuSeparator,
+  MenuSub,
+  MenuSubContent,
+  MenuSubTrigger,
+  MenuTrigger
+};
+//# sourceMappingURL=menu.js.map