@devalok/shilp-sutra 0.56.0 → 0.59.0

package/dist/ui/split-button.js

@@ -5,107 +5,60 @@ import * as i from "react";
 import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
 //#region src/ui/split-button.tsx
 var c = {
-	solid: {
-		accent: "bg-accent-11/20",
-		error: "bg-error-11/20",
-		success: "bg-success-11/20",
-		warning: "bg-warning-11/20",
-		info: "bg-info-11/20",
-		neutral: "bg-neutral-8/30"
-	},
-	soft: {
-		accent: "bg-accent-6",
-		error: "bg-error-6",
-		success: "bg-success-6",
-		warning: "bg-warning-6",
-		info: "bg-info-6",
-		neutral: "bg-surface-border"
-	},
-	outline: {
-		accent: "bg-accent-7",
-		error: "bg-error-7",
-		success: "bg-success-7",
-		warning: "bg-warning-7",
-		info: "bg-info-7",
-		neutral: "bg-surface-border-strong"
-	}
+	solid: "bg-palette-solid-active/20",
+	soft: "bg-palette-border-subtle",
+	outline: "bg-palette-border"
 }, l = {
+	solid: "bg-neutral-8/30",
+	soft: "bg-surface-border"
+}, u = {
 	xs: "h-ds-xs-plus",
 	sm: "h-ds-sm",
 	md: "h-ds-md",
 	"icon-xs": "h-ds-xs-plus",
 	"icon-sm": "h-ds-sm",
 	"icon-md": "h-ds-md"
-}, u = {
+}, d = {
 	xs: "text-body-sm",
 	sm: "text-body-sm",
 	md: "text-body-md",
 	"icon-xs": "text-body-sm",
 	"icon-sm": "text-body-sm",
 	"icon-md": "text-body-md"
-}, d = {
+}, f = {
 	xs: "px-ds-03 gap-1",
 	sm: "px-ds-04 gap-1.5",
 	md: "px-ds-05 gap-2",
 	"icon-xs": "px-ds-02",
 	"icon-sm": "px-ds-03",
 	"icon-md": "px-ds-04"
-}, f = {
+}, p = {
 	xs: "px-ds-02",
 	sm: "px-ds-02",
 	md: "px-ds-03",
 	"icon-xs": "px-ds-01",
 	"icon-sm": "px-ds-02",
 	"icon-md": "px-ds-02"
-}, p = {
+}, m = {
 	xs: "rounded-control",
 	sm: "rounded-control",
 	md: "rounded-control",
 	"icon-xs": "rounded-control",
 	"icon-sm": "rounded-control",
 	"icon-md": "rounded-control"
+}, h = {
+	solid: "bg-palette-solid text-palette-fg hover:bg-palette-solid-hover active:bg-palette-solid-active",
+	soft: "bg-palette-soft text-palette-text hover:bg-palette-soft-hover active:bg-palette-soft-active",
+	outline: "bg-transparent text-palette-text hover:bg-palette-soft active:bg-palette-soft-hover"
 };
-function m(e, t) {
-	let n = {
-		solid: {
-			accent: "bg-accent-9 text-accent-fg hover:bg-accent-10 active:bg-accent-11",
-			error: "bg-error-9 text-error-fg hover:bg-error-10 active:bg-error-11",
-			success: "bg-success-9 text-success-fg hover:bg-success-10 active:bg-success-11",
-			warning: "bg-warning-9 text-warning-fg hover:bg-warning-10 active:bg-warning-11",
-			info: "bg-info-9 text-info-fg hover:bg-info-10 active:bg-info-11",
-			neutral: "bg-neutral-5 text-surface-fg hover:bg-neutral-7 active:bg-neutral-8"
-		},
-		soft: {
-			accent: "bg-accent-3 text-accent-11 hover:bg-accent-4 active:bg-accent-5",
-			error: "bg-error-3 text-error-11 hover:bg-error-4 active:bg-error-5",
-			success: "bg-success-3 text-success-11 hover:bg-success-4 active:bg-success-5",
-			warning: "bg-warning-3 text-warning-11 hover:bg-warning-4 active:bg-warning-5",
-			info: "bg-info-3 text-info-11 hover:bg-info-4 active:bg-info-5",
-			neutral: "bg-surface-raised-hover text-surface-fg-muted hover:bg-surface-raised-active active:bg-neutral-5"
-		},
-		outline: {
-			accent: "bg-transparent text-accent-11 hover:bg-accent-3 active:bg-accent-4",
-			error: "bg-transparent text-error-11 hover:bg-error-3 active:bg-error-4",
-			success: "bg-transparent text-success-11 hover:bg-success-3 active:bg-success-4",
-			warning: "bg-transparent text-warning-11 hover:bg-warning-3 active:bg-warning-4",
-			info: "bg-transparent text-info-11 hover:bg-info-3 active:bg-info-4",
-			neutral: "bg-transparent text-surface-fg hover:bg-surface-raised-hover active:bg-surface-raised-active"
-		}
-	};
-	return n[e][t] ?? n[e].accent;
+function g(e, t) {
+	let n = e === "outline" && t === "neutral" ? " text-surface-fg" : "";
+	return h[e] + n;
 }
-function h(e) {
-	let t = {
-		accent: "border-accent-7",
-		error: "border-error-7",
-		success: "border-success-7",
-		warning: "border-warning-7",
-		info: "border-info-7",
-		neutral: "border-surface-border-strong"
-	};
-	return t[e] ?? t.accent;
+function _(e) {
+	return e === "neutral" ? "border-surface-border-interactive" : "border-palette-border";
 }
-function g({ className: e }) {
+function v({ className: e }) {
 	return /* @__PURE__ */ o("svg", {
 		width: "12",
 		height: "12",
@@ -122,53 +75,54 @@ function g({ className: e }) {
 		})
 	});
 }
-var _ = i.forwardRef(function({ children: _, onClick: v, dropdownContent: y, open: b, onOpenChange: x, variant: S = "solid", color: C = "accent", size: w = "md", disabled: T = !1, "aria-label": E, dropdownLabel: D = "More options", dropdownIcon: O, triggerSide: k = "right", placement: A = "top-end", triggerWidth: j, className: M }, N) {
-	let [P, F] = i.useMemo(() => {
-		let [e, t] = A.split("-");
+var y = i.forwardRef(function({ children: h, onClick: y, dropdownContent: b, open: x, onOpenChange: S, variant: C = "solid", color: w = "accent", size: T = "md", disabled: E = !1, "aria-label": D, dropdownLabel: O = "More options", dropdownIcon: k, triggerSide: A = "right", placement: j = "top-end", triggerWidth: M, className: N }, P) {
+	let [F, I] = i.useMemo(() => {
+		let [e, t] = j.split("-");
 		return [e, t === "start" ? "start" : t === "end" ? "end" : "center"];
-	}, [A]), I = m(S, C), L = c[S][C] ?? c[S].accent, R = j == null ? void 0 : { width: typeof j == "number" ? `${j}px` : j }, z = /* @__PURE__ */ o(r, {
+	}, [j]), L = g(C, w), R = (w === "neutral" ? l[C] : void 0) ?? c[C], z = M == null ? void 0 : { width: typeof M == "number" ? `${M}px` : M }, B = /* @__PURE__ */ o(r, {
 		asChild: !0,
 		children: /* @__PURE__ */ o("button", {
 			type: "button",
-			disabled: T,
-			"aria-label": D,
-			className: e("inline-flex items-center justify-center select-none", "transition-colors duration-fast-01 ease-productive-standard", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset", "disabled:pointer-events-none disabled:opacity-action-disabled", I, l[w], f[w]),
-			style: R,
-			children: O ?? /* @__PURE__ */ o(g, {})
+			disabled: E,
+			"aria-label": O,
+			className: e("inline-flex items-center justify-center select-none", "transition-colors duration-fast-01 ease-productive-standard", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset", "disabled:pointer-events-none disabled:opacity-action-disabled", L, u[T], p[T]),
+			style: z,
+			children: k ?? /* @__PURE__ */ o(v, {})
 		})
 	});
 	return /* @__PURE__ */ s(t, {
-		open: b,
-		onOpenChange: x,
+		open: x,
+		onOpenChange: S,
 		children: [/* @__PURE__ */ o("div", {
-			ref: N,
+			ref: P,
 			role: "group",
-			"aria-label": E ?? void 0,
-			className: e("relative inline-flex", M),
+			"aria-label": D ?? void 0,
+			"data-palette": w,
+			className: e("relative inline-flex", N),
 			children: /* @__PURE__ */ s("div", {
-				className: e("inline-flex items-stretch overflow-hidden", p[w], S === "solid" && "shadow-raised", S === "outline" && `border ${h(C)}`),
+				className: e("inline-flex items-stretch overflow-hidden", m[T], C === "solid" && "shadow-raised", C === "outline" && `border ${_(w)}`),
 				children: [
-					k === "left" && /* @__PURE__ */ s(a, { children: [z, /* @__PURE__ */ o("div", { className: e("w-px self-stretch", L) })] }),
+					A === "left" && /* @__PURE__ */ s(a, { children: [B, /* @__PURE__ */ o("div", { className: e("w-px self-stretch", R) })] }),
 					/* @__PURE__ */ o("button", {
 						type: "button",
-						onClick: v,
-						disabled: T,
-						"aria-label": E,
-						className: e("inline-flex items-center justify-center font-semibold select-none whitespace-nowrap", "transition-[colors,transform] duration-fast-01 ease-productive-standard", "active:scale-[0.97]", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset", "disabled:pointer-events-none disabled:opacity-action-disabled", I, l[w], u[w], d[w]),
-						children: _
+						onClick: y,
+						disabled: E,
+						"aria-label": D,
+						className: e("inline-flex items-center justify-center font-semibold select-none whitespace-nowrap", "transition-[colors,transform] duration-fast-01 ease-productive-standard", "active:scale-[0.97]", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset", "disabled:pointer-events-none disabled:opacity-action-disabled", L, u[T], d[T], f[T]),
+						children: h
 					}),
-					k === "right" && /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o("div", { className: e("w-px self-stretch", L) }), z] })
+					A === "right" && /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o("div", { className: e("w-px self-stretch", R) }), B] })
 				]
 			})
-		}), y && /* @__PURE__ */ o(n, {
-			side: P,
-			align: F,
+		}), b && /* @__PURE__ */ o(n, {
+			side: F,
+			align: I,
 			sideOffset: 8,
 			className: "w-auto min-w-[10rem] p-ds-01",
-			children: y
+			children: b
 		})]
 	});
 });
-_.displayName = "SplitButton";
+y.displayName = "SplitButton";
 //#endregion
-export { _ as SplitButton };
+export { y as SplitButton };

package/dist/ui/split-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"split-button.js","names":[],"sources":["../../src/ui/split-button.tsx"],"sourcesContent":["'use client'\n\nimport { type VariantProps } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { buttonVariants } from './button'\nimport { cn } from './lib/utils'\nimport { Popover, PopoverContent, PopoverTrigger } from './popover'\n\n// ── Types ───────────────────────────────────────────────────────\n\n/**\n * Placement of the dropdown panel, in floating-ui's vocabulary.\n *\n * Declared here rather than imported from `@floating-ui/dom`: that package is\n * bundled into dist at runtime but is NOT a consumer dependency, so a type\n * import leaks an unresolvable specifier into the published .d.ts —\n * `error TS2307: Cannot find module '@floating-ui/dom'` for anyone type-checking\n * declarations. The union is stable and two lines; borrowing it is not worth an\n * install. (This component no longer calls floating-ui at all — see the Radix\n * Popover mapping below.)\n */\nexport type SplitButtonPlacement =\n  | 'top' | 'right' | 'bottom' | 'left'\n  | 'top-start' | 'top-end'\n  | 'right-start' | 'right-end'\n  | 'bottom-start' | 'bottom-end'\n  | 'left-start' | 'left-end'\n\ntype SplitButtonVariant = 'solid' | 'soft' | 'outline'\ntype SplitButtonColor = NonNullable<VariantProps<typeof buttonVariants>['color']>\ntype SplitButtonSize = 'xs' | 'sm' | 'md' | 'icon-xs' | 'icon-sm' | 'icon-md'\n\nexport interface SplitButtonProps {\n  /** Primary action content (left side). */\n  children: React.ReactNode\n  /** Primary click handler (left side). */\n  onClick: (e: React.MouseEvent<HTMLButtonElement>) => void\n  /** Content rendered inside the floating dropdown panel. */\n  dropdownContent?: React.ReactNode\n  /** Controlled open state. */\n  open?: boolean\n  /** Called when open state changes. Uncontrolled if omitted. */\n  onOpenChange?: (open: boolean) => void\n  /** @default 'solid' */\n  variant?: SplitButtonVariant\n  /** @default 'accent' */\n  color?: SplitButtonColor\n  /** @default 'md' */\n  size?: SplitButtonSize\n  /** Disable both halves. */\n  disabled?: boolean\n  /** aria-label for the primary button. */\n  'aria-label'?: string\n  /** aria-label for the dropdown trigger. @default 'More options' */\n  dropdownLabel?: string\n  /** Custom icon for the dropdown trigger. Defaults to chevron-down. */\n  dropdownIcon?: React.ReactNode\n  /** Which side the dropdown trigger sits on. @default 'right' */\n  triggerSide?: 'left' | 'right'\n  /** Preferred placement for the dropdown panel. @default 'top-end' */\n  placement?: SplitButtonPlacement\n  /** Width of the trigger (chevron) half. @default 'auto' */\n  triggerWidth?: number | string\n  className?: string\n}\n\n// ── Styling maps ────────────────────────────────────────────────\n\nconst dividerColor: Record<SplitButtonVariant, Record<string, string>> = {\n  solid: {\n    accent: 'bg-accent-11/20', error: 'bg-error-11/20', success: 'bg-success-11/20',\n    warning: 'bg-warning-11/20', info: 'bg-info-11/20', neutral: 'bg-neutral-8/30',\n  },\n  soft: {\n    accent: 'bg-accent-6', error: 'bg-error-6', success: 'bg-success-6',\n    warning: 'bg-warning-6', info: 'bg-info-6', neutral: 'bg-surface-border',\n  },\n  outline: {\n    accent: 'bg-accent-7', error: 'bg-error-7', success: 'bg-success-7',\n    warning: 'bg-warning-7', info: 'bg-info-7', neutral: 'bg-surface-border-strong',\n  },\n}\n\nconst heightClass: Record<SplitButtonSize, string> = {\n  xs: 'h-ds-xs-plus', sm: 'h-ds-sm', md: 'h-ds-md',\n  'icon-xs': 'h-ds-xs-plus', 'icon-sm': 'h-ds-sm', 'icon-md': 'h-ds-md',\n}\n\nconst textClass: Record<SplitButtonSize, string> = {\n  xs: 'text-body-sm', sm: 'text-body-sm', md: 'text-body-md',\n  'icon-xs': 'text-body-sm', 'icon-sm': 'text-body-sm', 'icon-md': 'text-body-md',\n}\n\nconst primaryPadding: Record<SplitButtonSize, string> = {\n  xs: 'px-ds-03 gap-1', sm: 'px-ds-04 gap-1.5', md: 'px-ds-05 gap-2',\n  'icon-xs': 'px-ds-02', 'icon-sm': 'px-ds-03', 'icon-md': 'px-ds-04',\n}\n\nconst triggerPadding: Record<SplitButtonSize, string> = {\n  xs: 'px-ds-02', sm: 'px-ds-02', md: 'px-ds-03',\n  'icon-xs': 'px-ds-01', 'icon-sm': 'px-ds-02', 'icon-md': 'px-ds-02',\n}\n\nconst radiusClass: Record<SplitButtonSize, string> = {\n  xs: 'rounded-control', sm: 'rounded-control', md: 'rounded-control',\n  'icon-xs': 'rounded-control', 'icon-sm': 'rounded-control', 'icon-md': 'rounded-control',\n}\n\nfunction getHalfClasses(variant: SplitButtonVariant, color: string): string {\n  const map: Record<SplitButtonVariant, Record<string, string>> = {\n    solid: {\n      accent: 'bg-accent-9 text-accent-fg hover:bg-accent-10 active:bg-accent-11',\n      error: 'bg-error-9 text-error-fg hover:bg-error-10 active:bg-error-11',\n      success: 'bg-success-9 text-success-fg hover:bg-success-10 active:bg-success-11',\n      warning: 'bg-warning-9 text-warning-fg hover:bg-warning-10 active:bg-warning-11',\n      info: 'bg-info-9 text-info-fg hover:bg-info-10 active:bg-info-11',\n      neutral: 'bg-neutral-5 text-surface-fg hover:bg-neutral-7 active:bg-neutral-8',\n    },\n    soft: {\n      accent: 'bg-accent-3 text-accent-11 hover:bg-accent-4 active:bg-accent-5',\n      error: 'bg-error-3 text-error-11 hover:bg-error-4 active:bg-error-5',\n      success: 'bg-success-3 text-success-11 hover:bg-success-4 active:bg-success-5',\n      warning: 'bg-warning-3 text-warning-11 hover:bg-warning-4 active:bg-warning-5',\n      info: 'bg-info-3 text-info-11 hover:bg-info-4 active:bg-info-5',\n      neutral: 'bg-surface-raised-hover text-surface-fg-muted hover:bg-surface-raised-active active:bg-neutral-5',\n    },\n    outline: {\n      accent: 'bg-transparent text-accent-11 hover:bg-accent-3 active:bg-accent-4',\n      error: 'bg-transparent text-error-11 hover:bg-error-3 active:bg-error-4',\n      success: 'bg-transparent text-success-11 hover:bg-success-3 active:bg-success-4',\n      warning: 'bg-transparent text-warning-11 hover:bg-warning-3 active:bg-warning-4',\n      info: 'bg-transparent text-info-11 hover:bg-info-3 active:bg-info-4',\n      neutral: 'bg-transparent text-surface-fg hover:bg-surface-raised-hover active:bg-surface-raised-active',\n    },\n  }\n  return map[variant][color] ?? map[variant].accent\n}\n\nfunction getOutlineBorderColor(color: string): string {\n  const map: Record<string, string> = {\n    accent: 'border-accent-7', error: 'border-error-7', success: 'border-success-7',\n    warning: 'border-warning-7', info: 'border-info-7', neutral: 'border-surface-border-strong',\n  }\n  return map[color] ?? map.accent\n}\n\n// ── Chevron SVG ─────────────────────────────────────────────────\n\nfunction ChevronDown({ className }: { className?: string }) {\n  return (\n    <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" className={className} aria-hidden=\"true\">\n      <path d=\"M3 4.5L6 7.5L9 4.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n    </svg>\n  )\n}\n\n// ── Component ───────────────────────────────────────────────────\n\nconst SplitButton = React.forwardRef<HTMLDivElement, SplitButtonProps>(\n  function SplitButton(\n    {\n      children,\n      onClick,\n      dropdownContent,\n      open: openProp,\n      onOpenChange,\n      variant = 'solid',\n      color = 'accent',\n      size = 'md',\n      disabled = false,\n      'aria-label': ariaLabel,\n      dropdownLabel = 'More options',\n      dropdownIcon,\n      triggerSide = 'right',\n      placement: placementProp = 'top-end',\n      triggerWidth,\n      className,\n    },\n    ref,\n  ) {\n    // Map the floating-ui `placement` (e.g. 'top-end') to Radix side + align.\n    // Positioning, focus-in/return, outside-click, and Escape all come from the\n    // Popover primitive now — no hand-rolled floating-ui / listeners.\n    const [side, align] = React.useMemo(() => {\n      const [s, a] = placementProp.split('-')\n      return [\n        s as 'top' | 'right' | 'bottom' | 'left',\n        (a === 'start' ? 'start' : a === 'end' ? 'end' : 'center') as\n          | 'start'\n          | 'center'\n          | 'end',\n      ]\n    }, [placementProp])\n\n    const halfClasses = getHalfClasses(variant, color)\n    const divider = dividerColor[variant][color] ?? dividerColor[variant].accent\n\n    const triggerStyle = triggerWidth != null\n      ? { width: typeof triggerWidth === 'number' ? `${triggerWidth}px` : triggerWidth }\n      : undefined\n\n    // Dropdown trigger (the chevron half). PopoverTrigger wires aria-haspopup /\n    // aria-expanded / focus-return for us.\n    const dropdownTrigger = (\n      <PopoverTrigger asChild>\n        <button\n          type=\"button\"\n          disabled={disabled}\n          aria-label={dropdownLabel}\n          className={cn(\n            'inline-flex items-center justify-center select-none',\n            'transition-colors duration-fast-01 ease-productive-standard',\n            'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset',\n            'disabled:pointer-events-none disabled:opacity-action-disabled',\n            halfClasses,\n            heightClass[size],\n            triggerPadding[size],\n          )}\n          style={triggerStyle}\n        >\n          {dropdownIcon ?? <ChevronDown />}\n        </button>\n      </PopoverTrigger>\n    )\n\n    return (\n      <Popover open={openProp} onOpenChange={onOpenChange}>\n        {/* Button group */}\n        <div\n          ref={ref}\n          role=\"group\"\n          aria-label={ariaLabel ?? undefined}\n          className={cn('relative inline-flex', className)}\n        >\n          <div\n            className={cn(\n              'inline-flex items-stretch overflow-hidden',\n              radiusClass[size],\n              variant === 'solid' && 'shadow-raised',\n              variant === 'outline' && `border ${getOutlineBorderColor(color)}`,\n            )}\n          >\n            {triggerSide === 'left' && (\n              <>\n                {dropdownTrigger}\n                <div className={cn('w-px self-stretch', divider)} />\n              </>\n            )}\n\n            {/* Primary action */}\n            <button\n              type=\"button\"\n              onClick={onClick}\n              disabled={disabled}\n              aria-label={ariaLabel}\n              className={cn(\n                'inline-flex items-center justify-center font-semibold select-none whitespace-nowrap',\n                'transition-[colors,transform] duration-fast-01 ease-productive-standard',\n                'active:scale-[0.97]',\n                'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset',\n                'disabled:pointer-events-none disabled:opacity-action-disabled',\n                halfClasses,\n                heightClass[size],\n                textClass[size],\n                primaryPadding[size],\n              )}\n            >\n              {children}\n            </button>\n\n            {triggerSide === 'right' && (\n              <>\n                <div className={cn('w-px self-stretch', divider)} />\n                {dropdownTrigger}\n              </>\n            )}\n          </div>\n        </div>\n\n        {/* Dropdown panel — Popover handles focus, Escape, outside-click, return */}\n        {dropdownContent && (\n          <PopoverContent\n            side={side}\n            align={align}\n            sideOffset={8}\n            className=\"w-auto min-w-[10rem] p-ds-01\"\n          >\n            {dropdownContent}\n          </PopoverContent>\n        )}\n      </Popover>\n    )\n  },\n)\n\nSplitButton.displayName = 'SplitButton'\n\nexport { SplitButton }\nexport type { SplitButtonColor, SplitButtonSize,SplitButtonVariant }\n"],"mappings":"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"}
+{"version":3,"file":"split-button.js","names":[],"sources":["../../src/ui/split-button.tsx"],"sourcesContent":["'use client'\n\nimport { type VariantProps } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { buttonVariants } from './button'\nimport { cn } from './lib/utils'\nimport { Popover, PopoverContent, PopoverTrigger } from './popover'\n\n// ── Types ───────────────────────────────────────────────────────\n\n/**\n * Placement of the dropdown panel, in floating-ui's vocabulary.\n *\n * Declared here rather than imported from `@floating-ui/dom`: that package is\n * bundled into dist at runtime but is NOT a consumer dependency, so a type\n * import leaks an unresolvable specifier into the published .d.ts —\n * `error TS2307: Cannot find module '@floating-ui/dom'` for anyone type-checking\n * declarations. The union is stable and two lines; borrowing it is not worth an\n * install. (This component no longer calls floating-ui at all — see the Radix\n * Popover mapping below.)\n */\nexport type SplitButtonPlacement =\n  | 'top' | 'right' | 'bottom' | 'left'\n  | 'top-start' | 'top-end'\n  | 'right-start' | 'right-end'\n  | 'bottom-start' | 'bottom-end'\n  | 'left-start' | 'left-end'\n\ntype SplitButtonVariant = 'solid' | 'soft' | 'outline'\ntype SplitButtonColor = NonNullable<VariantProps<typeof buttonVariants>['color']>\ntype SplitButtonSize = 'xs' | 'sm' | 'md' | 'icon-xs' | 'icon-sm' | 'icon-md'\n\nexport interface SplitButtonProps {\n  /** Primary action content (left side). */\n  children: React.ReactNode\n  /** Primary click handler (left side). */\n  onClick: (e: React.MouseEvent<HTMLButtonElement>) => void\n  /** Content rendered inside the floating dropdown panel. */\n  dropdownContent?: React.ReactNode\n  /** Controlled open state. */\n  open?: boolean\n  /** Called when open state changes. Uncontrolled if omitted. */\n  onOpenChange?: (open: boolean) => void\n  /** @default 'solid' */\n  variant?: SplitButtonVariant\n  /**\n   * Palette name. The six built-ins are unchanged; any palette registered in\n   * CSS (`[data-palette='…']`) now works too. Widened from a closed union, so\n   * every existing value still type-checks.\n   *\n   * @default 'accent'\n   */\n  color?: SplitButtonColor | (string & {})\n  /** @default 'md' */\n  size?: SplitButtonSize\n  /** Disable both halves. */\n  disabled?: boolean\n  /** aria-label for the primary button. */\n  'aria-label'?: string\n  /** aria-label for the dropdown trigger. @default 'More options' */\n  dropdownLabel?: string\n  /** Custom icon for the dropdown trigger. Defaults to chevron-down. */\n  dropdownIcon?: React.ReactNode\n  /** Which side the dropdown trigger sits on. @default 'right' */\n  triggerSide?: 'left' | 'right'\n  /** Preferred placement for the dropdown panel. @default 'top-end' */\n  placement?: SplitButtonPlacement\n  /** Width of the trigger (chevron) half. @default 'auto' */\n  triggerWidth?: number | string\n  className?: string\n}\n\n// ── Styling maps ────────────────────────────────────────────────\n\n// The hairline between the two halves. One line per variant instead of one\n// per variant × colour — the hue arrives via `data-palette` on the group.\nconst dividerColor: Record<SplitButtonVariant, string> = {\n  solid: 'bg-palette-solid-active/20',\n  soft: 'bg-palette-border-subtle',\n  outline: 'bg-palette-border',\n}\n\n// `neutral` diverges from the roles here, and both cases predate this work:\n// its solid divider is 30% rather than 20% (a flat grey needs more presence\n// than a saturated one to read at 1px), and its soft divider sits on\n// `surface-border` rather than the subtle tier the role resolves to.\nconst neutralDivider: Partial<Record<SplitButtonVariant, string>> = {\n  solid: 'bg-neutral-8/30',\n  soft: 'bg-surface-border',\n}\n\nconst heightClass: Record<SplitButtonSize, string> = {\n  xs: 'h-ds-xs-plus', sm: 'h-ds-sm', md: 'h-ds-md',\n  'icon-xs': 'h-ds-xs-plus', 'icon-sm': 'h-ds-sm', 'icon-md': 'h-ds-md',\n}\n\nconst textClass: Record<SplitButtonSize, string> = {\n  xs: 'text-body-sm', sm: 'text-body-sm', md: 'text-body-md',\n  'icon-xs': 'text-body-sm', 'icon-sm': 'text-body-sm', 'icon-md': 'text-body-md',\n}\n\nconst primaryPadding: Record<SplitButtonSize, string> = {\n  xs: 'px-ds-03 gap-1', sm: 'px-ds-04 gap-1.5', md: 'px-ds-05 gap-2',\n  'icon-xs': 'px-ds-02', 'icon-sm': 'px-ds-03', 'icon-md': 'px-ds-04',\n}\n\nconst triggerPadding: Record<SplitButtonSize, string> = {\n  xs: 'px-ds-02', sm: 'px-ds-02', md: 'px-ds-03',\n  'icon-xs': 'px-ds-01', 'icon-sm': 'px-ds-02', 'icon-md': 'px-ds-02',\n}\n\nconst radiusClass: Record<SplitButtonSize, string> = {\n  xs: 'rounded-control', sm: 'rounded-control', md: 'rounded-control',\n  'icon-xs': 'rounded-control', 'icon-sm': 'rounded-control', 'icon-md': 'rounded-control',\n}\n\n// Three lines, not eighteen. Colour comes from `data-palette`.\nconst halfClasses: Record<SplitButtonVariant, string> = {\n  solid:\n    'bg-palette-solid text-palette-fg hover:bg-palette-solid-hover active:bg-palette-solid-active',\n  soft: 'bg-palette-soft text-palette-text hover:bg-palette-soft-hover active:bg-palette-soft-active',\n  outline:\n    'bg-transparent text-palette-text hover:bg-palette-soft active:bg-palette-soft-hover',\n}\n\nfunction getHalfClasses(variant: SplitButtonVariant, color: string): string {\n  // Same exception Button carries: on neutral, an outlined control's label\n  // wants full contrast rather than the muted text role.\n  const neutralOutline = variant === 'outline' && color === 'neutral' ? ' text-surface-fg' : ''\n  return halfClasses[variant] + neutralOutline\n}\n\nfunction getOutlineBorderColor(color: string): string {\n  // An outlined control's edge owes WCAG 1.4.11, so neutral takes the\n  // interactive border tier rather than the decorative one the role resolves\n  // to. The chromatic palettes already satisfy it from their own ramp.\n  return color === 'neutral' ? 'border-surface-border-interactive' : 'border-palette-border'\n}\n\n// ── Chevron SVG ─────────────────────────────────────────────────\n\nfunction ChevronDown({ className }: { className?: string }) {\n  return (\n    <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" className={className} aria-hidden=\"true\">\n      <path d=\"M3 4.5L6 7.5L9 4.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n    </svg>\n  )\n}\n\n// ── Component ───────────────────────────────────────────────────\n\nconst SplitButton = React.forwardRef<HTMLDivElement, SplitButtonProps>(\n  function SplitButton(\n    {\n      children,\n      onClick,\n      dropdownContent,\n      open: openProp,\n      onOpenChange,\n      variant = 'solid',\n      color = 'accent',\n      size = 'md',\n      disabled = false,\n      'aria-label': ariaLabel,\n      dropdownLabel = 'More options',\n      dropdownIcon,\n      triggerSide = 'right',\n      placement: placementProp = 'top-end',\n      triggerWidth,\n      className,\n    },\n    ref,\n  ) {\n    // Map the floating-ui `placement` (e.g. 'top-end') to Radix side + align.\n    // Positioning, focus-in/return, outside-click, and Escape all come from the\n    // Popover primitive now — no hand-rolled floating-ui / listeners.\n    const [side, align] = React.useMemo(() => {\n      const [s, a] = placementProp.split('-')\n      return [\n        s as 'top' | 'right' | 'bottom' | 'left',\n        (a === 'start' ? 'start' : a === 'end' ? 'end' : 'center') as\n          | 'start'\n          | 'center'\n          | 'end',\n      ]\n    }, [placementProp])\n\n    const halfClassNames = getHalfClasses(variant, color)\n    const divider =\n      (color === 'neutral' ? neutralDivider[variant] : undefined) ?? dividerColor[variant]\n\n    const triggerStyle = triggerWidth != null\n      ? { width: typeof triggerWidth === 'number' ? `${triggerWidth}px` : triggerWidth }\n      : undefined\n\n    // Dropdown trigger (the chevron half). PopoverTrigger wires aria-haspopup /\n    // aria-expanded / focus-return for us.\n    const dropdownTrigger = (\n      <PopoverTrigger asChild>\n        <button\n          type=\"button\"\n          disabled={disabled}\n          aria-label={dropdownLabel}\n          className={cn(\n            'inline-flex items-center justify-center select-none',\n            'transition-colors duration-fast-01 ease-productive-standard',\n            'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset',\n            'disabled:pointer-events-none disabled:opacity-action-disabled',\n            halfClassNames,\n            heightClass[size],\n            triggerPadding[size],\n          )}\n          style={triggerStyle}\n        >\n          {dropdownIcon ?? <ChevronDown />}\n        </button>\n      </PopoverTrigger>\n    )\n\n    return (\n      <Popover open={openProp} onOpenChange={onOpenChange}>\n        {/* Button group */}\n        <div\n          ref={ref}\n          role=\"group\"\n          aria-label={ariaLabel ?? undefined}\n          // One palette for the whole group: both halves and the hairline\n          // between them inherit it, so they can never disagree.\n          data-palette={color}\n          className={cn('relative inline-flex', className)}\n        >\n          <div\n            className={cn(\n              'inline-flex items-stretch overflow-hidden',\n              radiusClass[size],\n              variant === 'solid' && 'shadow-raised',\n              variant === 'outline' && `border ${getOutlineBorderColor(color)}`,\n            )}\n          >\n            {triggerSide === 'left' && (\n              <>\n                {dropdownTrigger}\n                <div className={cn('w-px self-stretch', divider)} />\n              </>\n            )}\n\n            {/* Primary action */}\n            <button\n              type=\"button\"\n              onClick={onClick}\n              disabled={disabled}\n              aria-label={ariaLabel}\n              className={cn(\n                'inline-flex items-center justify-center font-semibold select-none whitespace-nowrap',\n                'transition-[colors,transform] duration-fast-01 ease-productive-standard',\n                'active:scale-[0.97]',\n                'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-inset',\n                'disabled:pointer-events-none disabled:opacity-action-disabled',\n                halfClassNames,\n                heightClass[size],\n                textClass[size],\n                primaryPadding[size],\n              )}\n            >\n              {children}\n            </button>\n\n            {triggerSide === 'right' && (\n              <>\n                <div className={cn('w-px self-stretch', divider)} />\n                {dropdownTrigger}\n              </>\n            )}\n          </div>\n        </div>\n\n        {/* Dropdown panel — Popover handles focus, Escape, outside-click, return */}\n        {dropdownContent && (\n          <PopoverContent\n            side={side}\n            align={align}\n            sideOffset={8}\n            className=\"w-auto min-w-[10rem] p-ds-01\"\n          >\n            {dropdownContent}\n          </PopoverContent>\n        )}\n      </Popover>\n    )\n  },\n)\n\nSplitButton.displayName = 'SplitButton'\n\nexport { SplitButton }\nexport type { SplitButtonColor, SplitButtonSize,SplitButtonVariant }\n"],"mappings":"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"}

package/dist/ui/stat-card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stat-card.d.ts","sourceRoot":"","sources":["../../src/ui/stat-card.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAiC,KAAK,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAGrE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAA;AAOjD,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,SAAS,EAAE,KAAK,UAAU,EAAY,MAAM,cAAc,CAAA;AAE1F;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AACH,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACxF,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,uDAAuD;IACvD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE;QACN,KAAK,EAAE,MAAM,CAAA;QACb,SAAS,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAAA;KACrC,CAAA;IACD,kJAAkJ;IAClJ,cAAc,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IACnC,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,sEAAsE;IACtE,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,kEAAkE;IAClE,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,qFAAqF;IACrF,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,0KAA0K;IAC1K,OAAO,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,SAAS,GAAG,MAAM,CAAA;IACrD;;;;OAIG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,yJAAyJ;IACzJ,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,CAAA;IACtC,6HAA6H;IAC7H,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,uGAAuG;IACvG,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC3B;;;;OAIG;IACH,KAAK,CAAC,EAAE,WAAW,GAAG,SAAS,CAAA;IAC/B,iFAAiF;IACjF,UAAU,CAAC,EAAE,UAAU,CAAA;IACvB,wEAAwE;IACxE,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;IACpB,+CAA+C;IAC/C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,yEAAyE;IACzE,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yEAAyE;IACzE,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACzB;AAgGD,QAAA,MAAM,QAAQ,sFAoQb,CAAA;AAID,OAAO,EAAE,QAAQ,EAAE,CAAA"}
+{"version":3,"file":"stat-card.d.ts","sourceRoot":"","sources":["../../src/ui/stat-card.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAiC,KAAK,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAGrE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAA;AAOjD,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,SAAS,EAAE,KAAK,UAAU,EAAY,MAAM,cAAc,CAAA;AAE1F;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AACH,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACxF,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,uDAAuD;IACvD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE;QACN,KAAK,EAAE,MAAM,CAAA;QACb,SAAS,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAAA;KACrC,CAAA;IACD,kJAAkJ;IAClJ,cAAc,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IACnC,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,sEAAsE;IACtE,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,kEAAkE;IAClE,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,qFAAqF;IACrF,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,0KAA0K;IAC1K,OAAO,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,SAAS,GAAG,MAAM,CAAA;IACrD;;;;OAIG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,yJAAyJ;IACzJ,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,CAAA;IACtC,6HAA6H;IAC7H,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,uGAAuG;IACvG,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC3B;;;;OAIG;IACH,KAAK,CAAC,EAAE,WAAW,GAAG,SAAS,CAAA;IAC/B,iFAAiF;IACjF,UAAU,CAAC,EAAE,UAAU,CAAA;IACvB,wEAAwE;IACxE,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;IACpB,+CAA+C;IAC/C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,yEAAyE;IACzE,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yEAAyE;IACzE,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACzB;AAgGD,QAAA,MAAM,QAAQ,sFA0Qb,CAAA;AAID,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/ui/stat-card.js

@@ -1,20 +1,21 @@
 "use client";
-import { IconProvider as e } from "./icon-context.js";
-import { springs as t, tweens as n } from "./lib/motion.js";
-import { cn as r } from "./lib/utils.js";
-import { Icon as i } from "./icon.js";
-import { Skeleton as a } from "./skeleton.js";
-import { normalizeIcon as o } from "../_chunks/normalize-icon.js";
-import { Card as s, CardContent as c, CardFooter as l } from "./card.js";
+import { springs as e, tweens as t } from "./lib/motion.js";
+import { MotionPreference as n } from "../_chunks/motion-preference.js";
+import { IconProvider as r } from "./icon-context.js";
+import { cn as i } from "./lib/utils.js";
+import { Icon as a } from "./icon.js";
+import { Skeleton as o } from "./skeleton.js";
+import { normalizeIcon as s } from "../_chunks/normalize-icon.js";
+import { Card as c, CardContent as l, CardFooter as ee } from "./card.js";
 import { Progress as u } from "./progress.js";
 import { useLink as d } from "../_chunks/link-context.js";
 import { StatFlash as f } from "./stat-flash.js";
 import * as p from "react";
 import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
-import { IconMinus as ee, IconTrendingDown as te, IconTrendingUp as _ } from "@tabler/icons-react";
-import { motion as v } from "framer-motion";
+import { IconMinus as te, IconTrendingDown as _, IconTrendingUp as v } from "@tabler/icons-react";
+import { motion as y } from "framer-motion";
 //#region src/ui/stat-card.tsx
-function y(e, t, n) {
+function b(e, t, n) {
 	let r = e.filter((e) => Number.isFinite(e));
 	if (r.length < 2) return "";
 	let i = Math.min(...r), a = Math.max(...r) - i || 1, o = t / (r.length - 1);
@@ -23,14 +24,14 @@ function y(e, t, n) {
 		return `${t === 0 ? "M" : "L"}${r.toFixed(1)},${s.toFixed(1)}`;
 	}).join(" ");
 }
-function b({ data: e, colorClass: t }) {
-	let n = p.useId(), i = p.useRef(null), [a, o] = p.useState(0), s = y(e, 80, 32);
+function x({ data: e, colorClass: t }) {
+	let n = p.useId(), r = p.useRef(null), [a, o] = p.useState(0), s = b(e, 80, 32);
 	if (p.useEffect(() => {
-		i.current && o(i.current.getTotalLength());
+		r.current && o(r.current.getTotalLength());
 	}, [s]), !s) return null;
 	let c = `${s} L${80 .toFixed(1)},${32 .toFixed(1)} L0,${32 .toFixed(1)} Z`;
 	return /* @__PURE__ */ g("div", {
-		className: r("w-20 h-8", t),
+		className: i("w-20 h-8", t),
 		"aria-hidden": "true",
 		children: [/* @__PURE__ */ g("svg", {
 			viewBox: "0 0 80 32",
@@ -58,7 +59,7 @@ function b({ data: e, colorClass: t }) {
 					fill: `url(#sparkline-fill-${n})`
 				}),
 				/* @__PURE__ */ h("path", {
-					ref: i,
+					ref: r,
 					d: s,
 					fill: "none",
 					stroke: "currentColor",
@@ -76,7 +77,7 @@ function b({ data: e, colorClass: t }) {
 		}), a > 0 && /* @__PURE__ */ h("style", { children: `@keyframes sparkline-draw-${n.replace(/:/g, "")} { to { stroke-dashoffset: 0; } }` })]
 	});
 }
-function x({ progress: e, label: t }) {
+function S({ progress: e, label: t }) {
 	let n = Math.max(0, Math.min(100, e)), r = n >= 90 ? "success" : n >= 70 ? "warning" : "accent";
 	return /* @__PURE__ */ h(u.Root, {
 		value: n,
@@ -87,26 +88,26 @@ function x({ progress: e, label: t }) {
 		})
 	});
 }
-var S = p.forwardRef(({ className: u, label: p, title: y, value: S, prefix: C, suffix: w, delta: T, deltaPlacement: E = "block", icon: D, loading: ne, comparisonLabel: O, secondaryLabel: k, progress: A, variant: j = "default", size: M = "md", accentStyle: N = "none", reveal: P = !1, iconFill: F = "soft", flash: I, flashSpeed: L, sparkline: R, onClick: z, href: B, footer: V, ...H }, U) => {
-	let W = d(), G = y ?? p ?? "", K = (z || B) && !H["aria-label"] ? `View ${G}` : H["aria-label"];
-	if (ne) return /* @__PURE__ */ h(s, {
+var C = p.forwardRef(({ className: u, label: p, title: b, value: C, prefix: w, suffix: T, delta: E, deltaPlacement: D = "block", icon: O, loading: k, comparisonLabel: A, secondaryLabel: j, progress: M, variant: N = "default", size: P = "md", accentStyle: F = "none", reveal: ne = !1, iconFill: I = "soft", flash: L, flashSpeed: re, sparkline: R, onClick: z, href: B, footer: V, ...H }, U) => {
+	let W = d(), G = b ?? p ?? "", K = (z || B) && !H["aria-label"] ? `View ${G}` : H["aria-label"];
+	if (k) return /* @__PURE__ */ h(c, {
 		ref: U,
-		variant: j,
-		size: M,
+		variant: N,
+		size: P,
 		className: u,
 		"aria-busy": "true",
 		...H,
-		children: /* @__PURE__ */ g(c, {
+		children: /* @__PURE__ */ g(l, {
 			className: "flex flex-col gap-ds-03",
 			children: [
-				/* @__PURE__ */ h(a, { className: "h-ds-04 w-24 rounded-control-inner" }),
-				/* @__PURE__ */ h(a, { className: "h-ds-sm w-32" }),
-				/* @__PURE__ */ h(a, { className: "h-3 w-16 rounded-control-inner" })
+				/* @__PURE__ */ h(o, { className: "h-ds-04 w-24 rounded-control-inner" }),
+				/* @__PURE__ */ h(o, { className: "h-ds-sm w-32" }),
+				/* @__PURE__ */ h(o, { className: "h-3 w-16 rounded-control-inner" })
 			]
 		})
 	});
-	let q = T?.direction === "up" ? _ : T?.direction === "down" ? te : ee, J = T?.direction === "up" ? "text-success-11" : T?.direction === "down" ? "text-error-11" : "text-surface-fg-muted", Y = T?.direction === "up" ? "text-success-11" : T?.direction === "down" ? "text-error-11" : "text-accent-11", X = T ? /* @__PURE__ */ g(v.div, {
-		className: r("flex items-center gap-ds-02 text-body-sm font-medium", J),
+	let q = E?.direction === "up" ? v : E?.direction === "down" ? _ : te, J = E?.direction === "up" ? "text-success-11" : E?.direction === "down" ? "text-error-11" : "text-surface-fg-muted", Y = E?.direction === "up" ? "text-success-11" : E?.direction === "down" ? "text-error-11" : "text-accent-11", X = E ? /* @__PURE__ */ g(y.div, {
+		className: i("flex items-center gap-ds-02 text-body-sm font-medium", J),
 		initial: {
 			opacity: 0,
 			y: 8
@@ -116,11 +117,11 @@ var S = p.forwardRef(({ className: u, label: p, title: y, value: S, prefix: C, s
 			y: 0
 		},
 		transition: {
-			...t.smooth,
+			...e.smooth,
 			delay: .2
 		},
 		children: [
-			/* @__PURE__ */ h(v.span, {
+			/* @__PURE__ */ h(y.span, {
 				className: "inline-flex",
 				initial: {
 					opacity: .5,
@@ -130,54 +131,54 @@ var S = p.forwardRef(({ className: u, label: p, title: y, value: S, prefix: C, s
 					opacity: 1,
 					scale: 1
 				},
-				transition: t.smooth,
-				children: /* @__PURE__ */ h(i, {
+				transition: e.smooth,
+				children: /* @__PURE__ */ h(a, {
 					icon: q,
 					size: "sm"
 				})
 			}),
-			/* @__PURE__ */ h("span", { children: T.value }),
-			O && /* @__PURE__ */ h("span", {
+			/* @__PURE__ */ h("span", { children: E.value }),
+			A && /* @__PURE__ */ h("span", {
 				className: "text-surface-fg-subtle font-normal",
-				children: O
+				children: A
 			})
 		]
-	}) : null, Z = P ? {
+	}) : null, Z = ne ? {
 		initial: { y: 8 },
 		animate: { y: 0 },
-		transition: t.smooth
-	} : { initial: !1 }, re = /* @__PURE__ */ g(m, { children: [
+		transition: e.smooth
+	} : { initial: !1 }, ie = /* @__PURE__ */ g(m, { children: [
 		/* @__PURE__ */ g("div", {
 			className: "flex items-center justify-between",
-			children: [/* @__PURE__ */ h(v.p, {
+			children: [/* @__PURE__ */ h(y.p, {
 				className: "text-body-md font-medium text-surface-fg-muted",
 				...Z,
 				children: G
 			}), /* @__PURE__ */ g("div", {
 				className: "flex items-center gap-ds-03",
-				children: [R && R.length >= 2 && /* @__PURE__ */ h(b, {
+				children: [R && R.length >= 2 && /* @__PURE__ */ h(x, {
 					data: R,
 					colorClass: Y
-				}), D && I ? /* @__PURE__ */ h(f, {
-					icon: D,
-					flash: I,
-					fill: F,
-					speed: L
-				}) : D ? N === "icon" ? /* @__PURE__ */ h(v.span, {
-					className: r("inline-flex items-center justify-center rounded-control p-ds-02", F === "solid" ? "bg-accent-9 text-accent-fg" : "bg-accent-3 text-accent-11"),
+				}), O && L ? /* @__PURE__ */ h(f, {
+					icon: O,
+					flash: L,
+					fill: I,
+					speed: re
+				}) : O ? F === "icon" ? /* @__PURE__ */ h(y.span, {
+					className: i("inline-flex items-center justify-center rounded-control p-ds-02", I === "solid" ? "bg-accent-9 text-accent-fg" : "bg-accent-3 text-accent-11"),
 					...Z,
 					"aria-hidden": "true",
-					children: /* @__PURE__ */ h(e, {
+					children: /* @__PURE__ */ h(r, {
 						size: "md",
-						children: o(D, "md")
+						children: s(O, "md")
 					})
-				}) : /* @__PURE__ */ h(v.span, {
+				}) : /* @__PURE__ */ h(y.span, {
 					className: "text-surface-fg-muted",
 					...Z,
 					"aria-hidden": "true",
-					children: /* @__PURE__ */ h(e, {
+					children: /* @__PURE__ */ h(r, {
 						size: "lg",
-						children: o(D, "lg")
+						children: s(O, "lg")
 					})
 				}) : null]
 			})]
@@ -185,81 +186,81 @@ var S = p.forwardRef(({ className: u, label: p, title: y, value: S, prefix: C, s
 		/* @__PURE__ */ g("div", {
 			className: "flex flex-col gap-ds-01",
 			children: [/* @__PURE__ */ g("div", {
-				className: r(E === "inline" && T && "flex items-baseline gap-ds-03"),
+				className: i(D === "inline" && E && "flex items-baseline gap-ds-03"),
 				children: [/* @__PURE__ */ h("div", {
 					className: "overflow-hidden",
-					children: /* @__PURE__ */ g(v.p, {
-						className: r("inline-block font-semibold", M === "sm" ? "text-heading-md" : "text-heading-lg", N === "tint" ? "text-accent-11" : "text-surface-fg"),
+					children: /* @__PURE__ */ g(y.p, {
+						className: i("inline-block font-semibold", P === "sm" ? "text-heading-md" : "text-heading-lg", F === "tint" ? "text-accent-11" : "text-surface-fg"),
 						...Z,
 						children: [
-							C && /* @__PURE__ */ h("span", {
-								className: r("text-surface-fg-muted", M === "sm" ? "text-body-md" : "text-heading-xs"),
-								children: C
+							w && /* @__PURE__ */ h("span", {
+								className: i("text-surface-fg-muted", P === "sm" ? "text-body-md" : "text-heading-xs"),
+								children: w
 							}),
 							/* @__PURE__ */ h("span", {
 								className: "tabular-nums",
-								children: S
+								children: C
 							}),
-							w && /* @__PURE__ */ h("span", {
-								className: r("text-surface-fg-muted", M === "sm" ? "text-body-md" : "text-heading-xs"),
-								children: w
+							T && /* @__PURE__ */ h("span", {
+								className: i("text-surface-fg-muted", P === "sm" ? "text-body-md" : "text-heading-xs"),
+								children: T
 							})
 						]
 					})
-				}), E === "inline" && X]
-			}), k && /* @__PURE__ */ h(v.p, {
+				}), D === "inline" && X]
+			}), j && /* @__PURE__ */ h(y.p, {
 				className: "text-body-sm text-surface-fg-subtle",
 				...Z,
-				children: k
+				children: j
 			})]
 		}),
-		A != null && /* @__PURE__ */ h(v.div, {
+		M != null && /* @__PURE__ */ h(y.div, {
 			...Z,
-			children: /* @__PURE__ */ h(x, {
-				progress: A,
+			children: /* @__PURE__ */ h(S, {
+				progress: M,
 				label: G
 			})
 		}),
-		E === "block" && X
-	] }), Q = N === "tint" ? "bg-linear-to-t from-accent-2 to-surface-raised" : void 0, $ = /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h(c, {
+		D === "block" && X
+	] }), Q = F === "tint" ? "bg-linear-to-t from-accent-2 to-surface-panel" : void 0, $ = /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h(l, {
 		className: "flex flex-col gap-ds-03",
-		children: re
+		children: ie
 	}), V && /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h("div", {
 		"aria-hidden": "true",
 		className: "h-px w-full bg-surface-border-subtle"
-	}), /* @__PURE__ */ h(l, {
+	}), /* @__PURE__ */ h(ee, {
 		className: "text-body-sm",
-		children: /* @__PURE__ */ h(v.div, {
+		children: /* @__PURE__ */ h(y.div, {
 			className: "w-full",
 			initial: !1,
 			animate: { opacity: 1 },
 			transition: {
-				...n.fade,
+				...t.fade,
 				delay: .25
 			},
 			children: V
 		})
 	})] })] });
-	return B ? /* @__PURE__ */ h(W, {
+	return B ? /* @__PURE__ */ h(n, { children: /* @__PURE__ */ h(W, {
 		ref: U,
 		href: B,
 		onClick: z,
 		className: "block no-underline",
 		"aria-label": K,
 		...H,
-		children: /* @__PURE__ */ h(s, {
-			variant: j,
-			size: M,
+		children: /* @__PURE__ */ h(c, {
+			variant: N,
+			size: P,
 			interactive: !0,
 			className: Q,
 			children: $
 		})
-	}) : z ? /* @__PURE__ */ h(s, {
+	}) }) : z ? /* @__PURE__ */ h(n, { children: /* @__PURE__ */ h(c, {
 		ref: U,
-		variant: j,
-		size: M,
+		variant: N,
+		size: P,
 		interactive: !0,
-		className: r(Q, u),
+		className: i(Q, u),
 		role: "button",
 		tabIndex: 0,
 		"aria-label": K,
@@ -269,15 +270,15 @@ var S = p.forwardRef(({ className: u, label: p, title: y, value: S, prefix: C, s
 		},
 		...H,
 		children: $
-	}) : /* @__PURE__ */ h(s, {
+	}) }) : /* @__PURE__ */ h(n, { children: /* @__PURE__ */ h(c, {
 		ref: U,
-		variant: j,
-		size: M,
-		className: r(Q, u),
+		variant: N,
+		size: P,
+		className: i(Q, u),
 		...H,
 		children: $
-	});
+	}) });
 });
-S.displayName = "StatCard";
+C.displayName = "StatCard";
 //#endregion
-export { S as StatCard };
+export { C as StatCard };