@nexub/react 1.3.0 → 1.5.0

package/dist/{chunk-K7CUCLLI.js → chunk-DYWJ7BIK.js}

@@ -1,10 +1,10 @@
 'use client';
 import {
   toggleVariants
-} from "./chunk-U3EGB3JL.js";
+} from "./chunk-3TMIZQPR.js";
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/ToggleGroup/ToggleGroup.tsx
 import * as React from "react";

package/dist/{chunk-6Y734SXN.js → chunk-E4JM3HUM.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/Container/Container.tsx
 import * as React from "react";

package/dist/{chunk-POFKKYHY.js → chunk-EQNETGTV.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/Flag/Flag.tsx
 import * as React from "react";

package/dist/{chunk-BBVOB4EC.js → chunk-EZ23IA3H.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/ScrollArea/ScrollArea.tsx
 import * as React from "react";

package/dist/{chunk-LOP63AVE.js → chunk-FD7YU53N.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/Section/Section.tsx
 import * as React from "react";

package/dist/{chunk-CPV367VS.js → chunk-FHFVBOF3.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/Avatar/Avatar.tsx
 import * as React from "react";

package/dist/chunk-GHCV6UXG.js

@@ -0,0 +1,57 @@
+'use client';
+import {
+  cn
+} from "./chunk-Q7G5WGYV.js";
+
+// src/components/Switch/Switch.tsx
+import * as React from "react";
+import * as RadixSwitch from "@radix-ui/react-switch";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+var switchVariants = cva(
+  // Off: tonal track with a 2px outline (>= 3:1, WCAG 1.4.11). On: primary.
+  // Focus = the global ring (it follows the capsule).
+  [
+    "peer inline-flex shrink-0 cursor-pointer items-center rounded-full border-2",
+    "transition-[background-color,border-color] duration-effects-fast ease-effects-fast",
+    "data-[state=unchecked]:bg-[var(--color-surface-container-highest)] data-[state=unchecked]:border-[var(--color-outline)]",
+    "data-[state=checked]:bg-[var(--color-primary)] data-[state=checked]:border-[var(--color-primary)]",
+    "disabled:cursor-not-allowed disabled:border-[var(--color-text-disabled)] disabled:bg-[color-mix(in_srgb,var(--color-on-surface)_12%,transparent)] disabled:data-[state=checked]:bg-[var(--color-text-disabled)] disabled:data-[state=checked]:border-transparent disabled:data-[state=unchecked]:border-[var(--color-outline-variant)]"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "h-5 w-9",
+        md: "h-7 w-12",
+        lg: "h-8 w-14"
+      }
+    },
+    defaultVariants: { size: "md" }
+  }
+);
+var thumbVariants = cva(
+  // The thumb slides on the expressive spring (a toggle is a key moment).
+  [
+    "pointer-events-none block rounded-full shadow-elevation-1",
+    "transition-[transform,background-color] duration-expressive-fast ease-expressive-fast",
+    "translate-x-0.5 data-[state=unchecked]:bg-[var(--color-outline)] data-[state=checked]:bg-[var(--color-on-primary)] data-[disabled]:data-[state=unchecked]:bg-[var(--color-outline-variant)]"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "h-3 w-3 data-[state=checked]:translate-x-[18px]",
+        md: "h-5 w-5 data-[state=checked]:translate-x-[22px]",
+        lg: "h-6 w-6 data-[state=checked]:translate-x-[26px]"
+      }
+    },
+    defaultVariants: { size: "md" }
+  }
+);
+var Switch = React.forwardRef(
+  ({ className, size, ...props }, ref) => /* @__PURE__ */ jsx(RadixSwitch.Root, { ref, className: cn(switchVariants({ size }), className), ...props, children: /* @__PURE__ */ jsx(RadixSwitch.Thumb, { className: cn(thumbVariants({ size })) }) })
+);
+Switch.displayName = "Switch";
+
+export {
+  Switch
+};

package/dist/{chunk-UALYS4XI.js → chunk-GIGOTRXX.js}

@@ -1,10 +1,14 @@
 'use client';
+import {
+  enterExit,
+  floatingSurface
+} from "./chunk-KQPLFVFR.js";
 import {
   glassSurfaceClass
-} from "./chunk-ROZVVWPV.js";
+} from "./chunk-DEIBF3P7.js";
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/Popover/Popover.tsx
 import * as React from "react";
@@ -22,8 +26,9 @@ var Content2 = React.forwardRef(
         ref,
         sideOffset,
         className: cn(
-          "z-[var(--z-popover)] rounded-lg border border-[var(--color-border-default)]",
-          "bg-[var(--color-bg-default)] p-4 shadow-md",
+          "z-[var(--z-popover)] p-4 outline-none",
+          floatingSurface,
+          enterExit,
           "outline-none",
           "data-[state=open]:animate-in data-[state=closed]:animate-out",
           "data-[state=open]:fade-in-0 data-[state=closed]:fade-out-0",

package/dist/{chunk-BTZW34TX.js → chunk-GRB6T2TT.js}

@@ -1,26 +1,27 @@
 'use client';
 import {
   glassSurfaceClass
-} from "./chunk-ROZVVWPV.js";
+} from "./chunk-DEIBF3P7.js";
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/TopNav/TopNav.tsx
 import * as React from "react";
 import { Slot } from "@radix-ui/react-slot";
 import { jsx } from "react/jsx-runtime";
 var Root = React.forwardRef(
-  ({ className, children, surface = "solid", ...props }, ref) => /* @__PURE__ */ jsx(
+  ({ className, children, surface = "solid", scrollEdge, ...props }, ref) => /* @__PURE__ */ jsx(
     "header",
     {
       ref,
       className: cn(
-        "sticky top-0 z-[var(--z-sticky,100)] flex h-[var(--size-nav-header,64px)] items-center border-b border-[var(--color-border-default)] bg-[var(--color-bg-default)] px-4",
+        "sticky top-0 z-[var(--z-sticky,100)] flex h-[var(--size-nav-header,64px)] items-center border-b border-[var(--color-outline-variant)] bg-[var(--color-surface)] px-4",
         surface === "glass" && glassSurfaceClass,
         className
       ),
       "data-material": surface === "glass" ? "glass" : void 0,
+      "data-scroll-edge": scrollEdge,
       ...props,
       children: /* @__PURE__ */ jsx("div", { className: "flex w-full items-center gap-4", children })
     }
@@ -55,8 +56,8 @@ var Item = React.forwardRef(
         ref,
         "aria-current": active ? "page" : void 0,
         className: cn(
-          "inline-flex h-9 shrink-0 items-center rounded-md px-4 text-sm font-medium transition-colors",
-          active ? "bg-[var(--color-bg-subtle)] text-[var(--color-text-primary)]" : "text-[var(--color-text-muted)] hover:bg-[var(--color-bg-subtle)] hover:text-[var(--color-text-primary)]",
+          "nx-state-layer relative inline-flex h-control-sm shrink-0 items-center rounded-shape-control px-3.5 text-label-lg",
+          active ? "bg-[var(--color-secondary-container)] text-[var(--color-on-secondary-container)]" : "text-[var(--color-on-surface-variant)]",
           className
         ),
         ...props

package/dist/chunk-GUB7YKG2.js

@@ -0,0 +1,35 @@
+'use client';
+import {
+  cn
+} from "./chunk-Q7G5WGYV.js";
+
+// src/components/Checkbox/Checkbox.tsx
+import * as React from "react";
+import * as RadixCheckbox from "@radix-ui/react-checkbox";
+import { Check, Minus } from "@nexub/icons";
+import { jsx } from "react/jsx-runtime";
+var Checkbox = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    RadixCheckbox.Root,
+    {
+      ref,
+      className: cn(
+        // 18px, 2px outline border (>= 3:1), primary when on. Focus = the global ring.
+        "peer h-[18px] w-[18px] shrink-0 rounded-[5px] border-2 border-[var(--color-outline)]",
+        "transition-[background-color,border-color] duration-effects-fast ease-effects-fast",
+        "hover:border-[var(--color-on-surface)]",
+        "data-[state=checked]:bg-[var(--color-primary)] data-[state=checked]:border-[var(--color-primary)] data-[state=checked]:text-[var(--color-on-primary)]",
+        "data-[state=indeterminate]:bg-[var(--color-primary)] data-[state=indeterminate]:border-[var(--color-primary)] data-[state=indeterminate]:text-[var(--color-on-primary)]",
+        "disabled:cursor-not-allowed disabled:border-[var(--color-text-disabled)] disabled:data-[state=checked]:bg-[var(--color-text-disabled)] disabled:data-[state=indeterminate]:bg-[var(--color-text-disabled)] disabled:text-[var(--color-surface)]",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(RadixCheckbox.Indicator, { className: "flex items-center justify-center", children: props.checked === "indeterminate" ? /* @__PURE__ */ jsx(Minus, { size: "xs" }) : /* @__PURE__ */ jsx(Check, { size: "xs" }) })
+    }
+  )
+);
+Checkbox.displayName = "Checkbox";
+
+export {
+  Checkbox
+};

package/dist/{chunk-POBSY7EZ.js → chunk-H2W7IYVY.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/FileUpload/FileUpload.tsx
 import * as React from "react";

package/dist/{chunk-I5Z3A7N3.js → chunk-HG6HTUWU.js}

@@ -1,10 +1,10 @@
 'use client';
 import {
   Kbd
-} from "./chunk-PER3O4FD.js";
+} from "./chunk-A4IMFAZX.js";
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/KeyboardShortcut/KeyboardShortcut.tsx
 import * as React from "react";

package/dist/chunk-HI7GBSW2.js

@@ -0,0 +1 @@
+'use client';

package/dist/{chunk-DEH2Z27F.js → chunk-HJERFB7J.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/Code/Code.tsx
 import * as React from "react";

package/dist/{chunk-UTBUIBEP.js → chunk-I4BHRVRL.js}

@@ -1,40 +1,14 @@
 'use client';
 import {
-  useIsomorphicLayoutEffect
-} from "./chunk-NHUQLIHL.js";
+  useControllableState
+} from "./chunk-JLUCMNVS.js";
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/Rating/Rating.tsx
 import * as React from "react";
 import { cva } from "class-variance-authority";
-
-// src/hooks/useControllableState.ts
-import { useState, useCallback, useRef } from "react";
-function useControllableState({
-  value: controlledValue,
-  defaultValue,
-  onChange
-}) {
-  const [uncontrolled, setUncontrolled] = useState(defaultValue);
-  const isControlled = controlledValue !== void 0;
-  const value = isControlled ? controlledValue : uncontrolled;
-  const onChangeRef = useRef(onChange);
-  useIsomorphicLayoutEffect(() => {
-    onChangeRef.current = onChange;
-  });
-  const setValue = useCallback(
-    (next) => {
-      if (!isControlled) setUncontrolled(next);
-      onChangeRef.current?.(next);
-    },
-    [isControlled]
-  );
-  return [value, setValue];
-}
-
-// src/components/Rating/Rating.tsx
 import { jsx } from "react/jsx-runtime";
 var ratingVariants = cva("inline-flex items-center gap-0.5", {
   variants: {
@@ -147,7 +121,6 @@ function StarIcon({ filled, ...props }) {
 }
 
 export {
-  useControllableState,
   ratingVariants,
   Rating
 };

package/dist/{chunk-FUJOSPNQ.js → chunk-I4URNMI7.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/GradientDivider/GradientDivider.tsx
 import * as React from "react";

package/dist/{chunk-24CZFBTG.js → chunk-IIPYF6ZQ.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/Alert/Alert.tsx
 import * as React from "react";

package/dist/{chunk-CVBAWKNG.js → chunk-IK23Q2OF.js}

@@ -1,7 +1,13 @@
 'use client';
+import {
+  field,
+  fieldDisabledWithin,
+  fieldFocusWithin,
+  fieldInvalid
+} from "./chunk-7SXR4PGO.js";
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/Input/Input.tsx
 import * as React from "react";
@@ -16,15 +22,16 @@ var inputVariants = cva(
     "outline-none focus:outline-none focus-visible:outline-none",
     "ring-0 focus:ring-0 focus-visible:ring-0",
     "placeholder:text-[var(--color-text-placeholder)]",
-    "text-[var(--color-text-primary)]",
-    "disabled:opacity-50 disabled:cursor-not-allowed"
+    "text-[var(--color-on-surface)]",
+    "disabled:cursor-not-allowed disabled:text-[var(--color-text-disabled)]"
   ],
   {
     variants: {
+      // 16px from md up: readable, and iOS doesn't zoom on focus.
       size: {
-        sm: "text-sm",
-        md: "text-sm",
-        lg: "text-base"
+        sm: "text-body-sm",
+        md: "text-body-md",
+        lg: "text-body-md"
       }
     },
     defaultVariants: {
@@ -34,23 +41,21 @@ var inputVariants = cva(
 );
 var inputWrapperVariants = cva(
   [
-    "flex items-center w-full rounded-md border bg-[var(--color-bg-default)] transition-colors",
-    "border-[var(--color-border-input)]",
-    // On focus: the border shifts to the ring color and the ring is a
-    // semi-transparent halo. One hard 1 px border + one soft 2 px glow =
-    // a single clean focus indicator. No double ring.
-    "focus-within:outline-none focus-within:border-[var(--color-ring-default)] focus-within:ring-2 focus-within:ring-[color-mix(in_srgb,var(--color-ring-default)_25%,transparent)]",
-    "has-[:disabled]:opacity-50 has-[:disabled]:cursor-not-allowed"
+    // The wrapper is the field: one border that thickens to 2px primary on focus.
+    "flex items-center w-full",
+    field,
+    fieldFocusWithin,
+    fieldDisabledWithin
   ],
   {
     variants: {
       size: {
-        sm: "h-8 px-3 gap-1.5",
-        md: "h-9 px-3 gap-2",
-        lg: "h-10 px-4 gap-2"
+        sm: "h-control-sm px-3 gap-1.5",
+        md: "h-control-md px-3.5 gap-2",
+        lg: "h-control-lg px-4 gap-2"
       },
       invalid: {
-        true: "border-[var(--color-danger-500)] focus-within:border-[var(--color-danger-500)] focus-within:ring-[color-mix(in_srgb,var(--color-danger-500)_25%,transparent)]"
+        true: fieldInvalid
       }
     },
     defaultVariants: {
@@ -60,14 +65,14 @@ var inputWrapperVariants = cva(
 );
 var addonVariants = cva(
   [
-    "flex items-center self-stretch px-3 text-[var(--color-text-muted)] bg-[var(--color-bg-subtle)]",
-    "border-[var(--color-border-default)] shrink-0"
+    "flex items-center self-stretch px-3 text-[var(--color-on-surface-variant)] bg-[var(--color-surface-container-high)]",
+    "border-[var(--color-outline-variant)] shrink-0"
   ],
   {
     variants: {
       side: {
-        leading: "border-r rounded-l-md",
-        trailing: "border-l rounded-r-md"
+        leading: "border-r",
+        trailing: "border-l"
       }
     }
   }
@@ -97,20 +102,20 @@ var Input = React.forwardRef(
       }
     );
     if (hasAddon) {
-      return /* @__PURE__ */ jsxs("div", { className: cn("flex w-full rounded-md overflow-hidden border border-[var(--color-border-input)]", invalid && "border-[var(--color-danger-500)]"), children: [
+      return /* @__PURE__ */ jsxs("div", { className: cn("flex w-full overflow-hidden", field, fieldFocusWithin, invalid && fieldInvalid), children: [
         leadingAddon && /* @__PURE__ */ jsx("span", { className: cn(addonVariants({ side: "leading" })), children: leadingAddon }),
-        /* @__PURE__ */ jsxs("div", { className: cn(inputWrapperVariants({ size, invalid }), "rounded-none border-0 ring-offset-0", wrapperClassName), children: [
-          leadingIcon && /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[var(--color-text-muted)]", children: leadingIcon }),
+        /* @__PURE__ */ jsxs("div", { className: cn(inputWrapperVariants({ size, invalid }), "rounded-none border-0 shadow-none focus-within:shadow-none", wrapperClassName), children: [
+          leadingIcon && /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[var(--color-on-surface-variant)]", children: leadingIcon }),
           inputEl,
-          trailingIcon && /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[var(--color-text-muted)]", children: trailingIcon })
+          trailingIcon && /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[var(--color-on-surface-variant)]", children: trailingIcon })
         ] }),
         trailingAddon && /* @__PURE__ */ jsx("span", { className: cn(addonVariants({ side: "trailing" })), children: trailingAddon })
       ] });
     }
     return /* @__PURE__ */ jsxs("div", { className: cn(inputWrapperVariants({ size, invalid }), wrapperClassName), children: [
-      leadingIcon && /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[var(--color-text-muted)]", children: leadingIcon }),
+      leadingIcon && /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[var(--color-on-surface-variant)]", children: leadingIcon }),
       inputEl,
-      trailingIcon && /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[var(--color-text-muted)]", children: trailingIcon })
+      trailingIcon && /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[var(--color-on-surface-variant)]", children: trailingIcon })
     ] });
   }
 );

package/dist/{chunk-4OCXGNP3.js → chunk-J2T4GFFS.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/StatusPill/StatusPill.tsx
 import * as React from "react";

package/dist/{chunk-BJKW3G2L.js → chunk-J6TU45KP.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/Pagination/Pagination.tsx
 import * as React from "react";

package/dist/chunk-JLUCMNVS.js

@@ -0,0 +1,32 @@
+'use client';
+import {
+  useIsomorphicLayoutEffect
+} from "./chunk-NHUQLIHL.js";
+
+// src/hooks/useControllableState.ts
+import { useState, useCallback, useRef } from "react";
+function useControllableState({
+  value: controlledValue,
+  defaultValue,
+  onChange
+}) {
+  const [uncontrolled, setUncontrolled] = useState(defaultValue);
+  const isControlled = controlledValue !== void 0;
+  const value = isControlled ? controlledValue : uncontrolled;
+  const onChangeRef = useRef(onChange);
+  useIsomorphicLayoutEffect(() => {
+    onChangeRef.current = onChange;
+  });
+  const setValue = useCallback(
+    (next) => {
+      if (!isControlled) setUncontrolled(next);
+      onChangeRef.current?.(next);
+    },
+    [isControlled]
+  );
+  return [value, setValue];
+}
+
+export {
+  useControllableState
+};

package/dist/{chunk-ELC2NBGH.js → chunk-JSD3H7WV.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/Table/Table.tsx
 import * as React from "react";

package/dist/{chunk-46CFSBEO.js → chunk-KA2J5OBA.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/Tooltip/Tooltip.tsx
 import * as React from "react";
@@ -18,7 +18,8 @@ var Content2 = React.forwardRef(
         ref,
         sideOffset,
         className: cn(
-          "z-[1500] rounded bg-[var(--color-neutral-900)] px-2 py-1 text-xs text-white",
+          "z-[var(--z-tooltip,1800)] rounded-shape-tooltip bg-[var(--color-inverse-surface)] px-2.5 py-1.5 text-label-md text-[var(--color-inverse-on-surface)] shadow-elevation-1",
+          "duration-effects-fast ease-effects-fast",
           "data-[state=delayed-open]:animate-in data-[state=closed]:animate-out",
           "data-[state=delayed-open]:fade-in-0 data-[state=closed]:fade-out-0",
           "data-[state=delayed-open]:zoom-in-95 data-[state=closed]:zoom-out-95",

package/dist/{chunk-OUBBOOZE.js → chunk-KM6Z3VTI.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/FormError/FormError.tsx
 import * as React from "react";

package/dist/chunk-KQPLFVFR.js

@@ -0,0 +1,27 @@
+'use client';
+
+// src/utils/surface.ts
+var overlaySurface = "rounded-shape-overlay bg-[var(--color-surface-elevated)] text-[var(--color-on-surface)] shadow-elevation-3";
+var floatingSurface = "rounded-shape-container bg-[var(--color-surface-elevated)] text-[var(--color-on-surface)] shadow-elevation-2";
+var menuContent = "p-1.5";
+var menuItem = [
+  "relative flex cursor-default select-none items-center gap-2 rounded-[10px] px-2.5 py-2 text-body-sm text-[var(--color-on-surface)] outline-none",
+  // Highlight = the on-surface state layer at hover opacity.
+  "focus:bg-[color-mix(in_srgb,var(--color-on-surface)_8%,transparent)] data-[highlighted]:bg-[color-mix(in_srgb,var(--color-on-surface)_8%,transparent)]",
+  "data-[disabled]:pointer-events-none data-[disabled]:text-[var(--color-text-disabled)]"
+].join(" ");
+var menuSeparator = "-mx-1.5 my-1.5 h-px bg-[var(--color-outline-variant)]";
+var menuLabel = "px-2.5 py-1.5 text-label-sm text-[var(--color-on-surface-muted)]";
+var enterExit = "duration-spatial-default ease-spatial-default data-[state=closed]:duration-effects-fast data-[state=closed]:ease-effects-fast";
+var scrim = "bg-[color-mix(in_srgb,var(--color-scrim,#000)_40%,transparent)]";
+
+export {
+  overlaySurface,
+  floatingSurface,
+  menuContent,
+  menuItem,
+  menuSeparator,
+  menuLabel,
+  enterExit,
+  scrim
+};

package/dist/{chunk-MV7WMQI4.js → chunk-LDYD7WL3.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/Logo/Logo.tsx
 import * as React from "react";

package/dist/{chunk-QURKXXNS.js → chunk-LGQ737BP.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/ButtonGroup/ButtonGroup.tsx
 import * as React from "react";
@@ -18,18 +18,12 @@ var ButtonGroup = React.forwardRef(
         className: cn(
           "flex",
           orientation === "vertical" ? "flex-col" : "flex-row",
+          // Connected (M3 Expressive): capsule outer ends, small inner corners, a 2px
+          // seam between segments so each keeps its own state layer and focus ring.
           attached ? [
-            "gap-0",
-            "[&>*:not(:first-child):not(:last-child)]:rounded-none",
-            orientation === "horizontal" ? [
-              "[&>*:first-child]:rounded-r-none",
-              "[&>*:last-child]:rounded-l-none",
-              "[&>*:not(:first-child)]:border-l-0"
-            ] : [
-              "[&>*:first-child]:rounded-b-none",
-              "[&>*:last-child]:rounded-t-none",
-              "[&>*:not(:first-child)]:border-t-0"
-            ]
+            "gap-0.5",
+            "[&>*:not(:first-child):not(:last-child)]:rounded-[6px]",
+            orientation === "horizontal" ? ["[&>*:first-child]:rounded-r-[6px]", "[&>*:last-child]:rounded-l-[6px]"] : ["[&>*:first-child]:rounded-b-[6px]", "[&>*:last-child]:rounded-t-[6px]"]
           ] : "gap-2",
           className
         ),

package/dist/{chunk-DOHXBNOP.js → chunk-LH3BSAIS.js}

@@ -1,7 +1,7 @@
 'use client';
 import {
   cn
-} from "./chunk-AT6RPKU3.js";
+} from "./chunk-Q7G5WGYV.js";
 
 // src/components/DatePicker/DatePicker.tsx
 import * as React from "react";