@astryxdesign/core 0.6.2 → 0.6.3-canary.039a67e

package/dist/Icon/Icon.js

@@ -29,11 +29,13 @@ import { useThemeName } from "../theme/useTheme.js";
 import { getIcon } from "./globalIconRegistry.js";
 import { mergeProps } from "../utils/index.js";
 import { themeProps } from "../utils/themeProps.js";
-
+import { useIconSize } from "./IconDefaultSizeContext.js";
+import { iconBoxSizeStyles, iconSizeStyles } from "./IconSize.stylex.js";
+import { jsx as _jsx } from "react/jsx-runtime";
 // =============================================================================
 // Styles
 // =============================================================================
-import { jsx as _jsx } from "react/jsx-runtime";
+
 const styles = {
   root: {
     kmuXW: "x2lah0s",
@@ -126,72 +128,6 @@ const colorStyles = {
   }
 };
 
-/**
- * Size styles for direct SVG icon components.
- * Uses width/height only — SVG components handle their own viewBox scaling.
- *
- * Sizes are expressed in `rem` (relative to the root font-size) so icons scale
- * in step with text when the document font-size changes, matching the rest of
- * the design system's rem-based type scale. Values are the px-equivalents at a
- * 16px root: 12px → 0.75rem, 16px → 1rem, 20px → 1.25rem, 24px → 1.5rem.
- */
-const sizeStyles = {
-  xsm: {
-    kzqmXN: "x1jw3ynk",
-    kZKoxP: "xvle69y",
-    $$css: true
-  },
-  sm: {
-    kzqmXN: "xcdlrvm",
-    kZKoxP: "x1l36t39",
-    $$css: true
-  },
-  md: {
-    kzqmXN: "xwqq7k2",
-    kZKoxP: "xmll18r",
-    $$css: true
-  },
-  lg: {
-    kzqmXN: "xp8d6y2",
-    kZKoxP: "xam5rvr",
-    $$css: true
-  }
-};
-
-/**
- * Size styles for string-based (registry) icons.
- * Includes fontSize so that 1em-based icons from the registry scale correctly.
- *
- * Expressed in `rem` for the same reason as {@link sizeStyles} — icons track the
- * root font-size instead of being locked to absolute pixels.
- */
-const spanSizeStyles = {
-  xsm: {
-    kzqmXN: "x1jw3ynk",
-    kZKoxP: "xvle69y",
-    kGuDYH: "xboafo0",
-    $$css: true
-  },
-  sm: {
-    kzqmXN: "xcdlrvm",
-    kZKoxP: "x1l36t39",
-    kGuDYH: "x1jchvi3",
-    $$css: true
-  },
-  md: {
-    kzqmXN: "xwqq7k2",
-    kZKoxP: "xmll18r",
-    kGuDYH: "x1603h9y",
-    $$css: true
-  },
-  lg: {
-    kzqmXN: "xp8d6y2",
-    kZKoxP: "xam5rvr",
-    kGuDYH: "xngnso2",
-    $$css: true
-  }
-};
-
 // =============================================================================
 // Types
 // =============================================================================
@@ -241,7 +177,7 @@ function getIconA11yProps(label) {
 export function Icon({
   icon,
   color = 'inherit',
-  size = 'md',
+  size: sizeProp,
   label,
   ref,
   className,
@@ -249,6 +185,7 @@ export function Icon({
   xstyle,
   ...props
 }) {
+  const size = useIconSize(sizeProp);
   // Derive ARIA from `label`: decorative (aria-hidden) by default, or a
   // meaningful image (role="img" + aria-label) when `label` is non-empty.
   const a11yProps = getIconA11yProps(label);
@@ -279,7 +216,7 @@ export function Icon({
     ...mergeProps(themeProps('icon', {
       size,
       color
-    }), stylex.props(styles.root, colorStyles[color], sizeStyles[size], xstyle), className ?? undefined, style),
+    }), stylex.props(styles.root, colorStyles[color], iconSizeStyles[size], xstyle), className ?? undefined, style),
     ...props
   });
 }
@@ -324,7 +261,7 @@ function IconFromRegistry({
     ...mergeProps(themeProps('icon', {
       size,
       color
-    }), stylex.props(styles.span, colorStyles[color], spanSizeStyles[size], xstyle), className ?? undefined, style),
+    }), stylex.props(styles.span, colorStyles[color], iconBoxSizeStyles[size], xstyle), className ?? undefined, style),
     children: resolvedIcon
   });
 }

package/dist/Icon/IconDefaultSizeContext.d.ts

@@ -0,0 +1,4 @@
+import type { IconSize } from './IconSize.stylex';
+export declare const IconDefaultSizeProvider: import("react").Provider<"xsm" | "sm" | "lg" | "md" | null>;
+export declare function useIconSize(size: IconSize | undefined): IconSize;
+//# sourceMappingURL=IconDefaultSizeContext.d.ts.map

package/dist/Icon/IconDefaultSizeContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconDefaultSizeContext.d.ts","sourceRoot":"","sources":["../../src/Icon/IconDefaultSizeContext.ts"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAKhD,eAAO,MAAM,uBAAuB,6DAAkC,CAAC;AAEvE,wBAAgB,WAAW,CAAC,IAAI,EAAE,QAAQ,GAAG,SAAS,GAAG,QAAQ,CAGhE"}

package/dist/Icon/IconDefaultSizeContext.js

@@ -0,0 +1,18 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+'use client';
+
+/**
+ * @file IconDefaultSizeContext.ts
+ * @input Uses React context and an optional Icon size prop
+ * @output Supplies a component-owned default size to descendant Icon instances
+ * @position Internal Icon sizing context; consumed by Icon and icon-slot owners
+ */
+import { createContext, use } from 'react';
+const IconDefaultSizeContext = /*#__PURE__*/createContext(null);
+IconDefaultSizeContext.displayName = 'IconDefaultSizeContext';
+export const IconDefaultSizeProvider = IconDefaultSizeContext.Provider;
+export function useIconSize(size) {
+  const contextualSize = use(IconDefaultSizeContext);
+  return size ?? contextualSize ?? 'md';
+}

package/dist/Icon/IconSize.stylex.d.ts

@@ -0,0 +1,65 @@
+/**
+ * @file IconSize.stylex.ts
+ * @input Defines the Icon size scale
+ * @output Exports shared Icon size types and StyleX styles
+ * @position Internal Icon sizing source; consumed by Icon and icon-slot owners
+ */
+import * as stylex from '@stylexjs/stylex';
+/**
+ * Icon sizes are expressed in `rem` so they scale with the root font-size.
+ * Values are the px-equivalents at a 16px root: 12, 16, 20, and 24px.
+ */
+declare const iconSizeValues: {
+    readonly xsm: "0.75rem";
+    readonly sm: "1rem";
+    readonly md: "1.25rem";
+    readonly lg: "1.5rem";
+};
+export type IconSize = keyof typeof iconSizeValues;
+/** Size styles for direct SVG icon components. */
+export declare const iconSizeStyles: Readonly<{
+    readonly xsm: Readonly<{
+        readonly width: stylex.StyleXClassNameFor<"width", "0.75rem">;
+        readonly height: stylex.StyleXClassNameFor<"height", "0.75rem">;
+    }>;
+    readonly sm: Readonly<{
+        readonly width: stylex.StyleXClassNameFor<"width", "1rem">;
+        readonly height: stylex.StyleXClassNameFor<"height", "1rem">;
+    }>;
+    readonly md: Readonly<{
+        readonly width: stylex.StyleXClassNameFor<"width", "1.25rem">;
+        readonly height: stylex.StyleXClassNameFor<"height", "1.25rem">;
+    }>;
+    readonly lg: Readonly<{
+        readonly width: stylex.StyleXClassNameFor<"width", "1.5rem">;
+        readonly height: stylex.StyleXClassNameFor<"height", "1.5rem">;
+    }>;
+}>;
+/**
+ * Size styles for icon boxes and string-based registry icons. `fontSize`
+ * keeps 1em-based icons in step with the box.
+ */
+export declare const iconBoxSizeStyles: Readonly<{
+    readonly xsm: Readonly<{
+        readonly width: stylex.StyleXClassNameFor<"width", "0.75rem">;
+        readonly height: stylex.StyleXClassNameFor<"height", "0.75rem">;
+        readonly fontSize: stylex.StyleXClassNameFor<"fontSize", "0.75rem">;
+    }>;
+    readonly sm: Readonly<{
+        readonly width: stylex.StyleXClassNameFor<"width", "1rem">;
+        readonly height: stylex.StyleXClassNameFor<"height", "1rem">;
+        readonly fontSize: stylex.StyleXClassNameFor<"fontSize", "1rem">;
+    }>;
+    readonly md: Readonly<{
+        readonly width: stylex.StyleXClassNameFor<"width", "1.25rem">;
+        readonly height: stylex.StyleXClassNameFor<"height", "1.25rem">;
+        readonly fontSize: stylex.StyleXClassNameFor<"fontSize", "1.25rem">;
+    }>;
+    readonly lg: Readonly<{
+        readonly width: stylex.StyleXClassNameFor<"width", "1.5rem">;
+        readonly height: stylex.StyleXClassNameFor<"height", "1.5rem">;
+        readonly fontSize: stylex.StyleXClassNameFor<"fontSize", "1.5rem">;
+    }>;
+}>;
+export {};
+//# sourceMappingURL=IconSize.stylex.d.ts.map

package/dist/Icon/IconSize.stylex.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconSize.stylex.d.ts","sourceRoot":"","sources":["../../src/Icon/IconSize.stylex.ts"],"names":[],"mappings":"AAEA;;;;;GAKG;AAEH,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAE3C;;;GAGG;AACH,QAAA,MAAM,cAAc;;;;;CAKV,CAAC;AAEX,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,cAAc,CAAC;AAEnD,kDAAkD;AAClD,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;EAiBzB,CAAC;AAEH;;;GAGG;AACH,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;EAqB5B,CAAC"}

package/dist/Icon/IconSize.stylex.js

@@ -0,0 +1,75 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/**
+ * @file IconSize.stylex.ts
+ * @input Defines the Icon size scale
+ * @output Exports shared Icon size types and StyleX styles
+ * @position Internal Icon sizing source; consumed by Icon and icon-slot owners
+ */
+
+import * as stylex from '@stylexjs/stylex';
+
+/**
+ * Icon sizes are expressed in `rem` so they scale with the root font-size.
+ * Values are the px-equivalents at a 16px root: 12, 16, 20, and 24px.
+ */
+const iconSizeValues = {
+  xsm: '0.75rem',
+  sm: '1rem',
+  md: '1.25rem',
+  lg: '1.5rem'
+};
+/** Size styles for direct SVG icon components. */
+export const iconSizeStyles = {
+  xsm: {
+    kzqmXN: "x1jw3ynk",
+    kZKoxP: "xvle69y",
+    $$css: true
+  },
+  sm: {
+    kzqmXN: "xcdlrvm",
+    kZKoxP: "x1l36t39",
+    $$css: true
+  },
+  md: {
+    kzqmXN: "xwqq7k2",
+    kZKoxP: "xmll18r",
+    $$css: true
+  },
+  lg: {
+    kzqmXN: "xp8d6y2",
+    kZKoxP: "xam5rvr",
+    $$css: true
+  }
+};
+
+/**
+ * Size styles for icon boxes and string-based registry icons. `fontSize`
+ * keeps 1em-based icons in step with the box.
+ */
+export const iconBoxSizeStyles = {
+  xsm: {
+    kzqmXN: "x1jw3ynk",
+    kZKoxP: "xvle69y",
+    kGuDYH: "xboafo0",
+    $$css: true
+  },
+  sm: {
+    kzqmXN: "xcdlrvm",
+    kZKoxP: "x1l36t39",
+    kGuDYH: "x1jchvi3",
+    $$css: true
+  },
+  md: {
+    kzqmXN: "xwqq7k2",
+    kZKoxP: "xmll18r",
+    kGuDYH: "x1603h9y",
+    $$css: true
+  },
+  lg: {
+    kzqmXN: "xp8d6y2",
+    kZKoxP: "xam5rvr",
+    kGuDYH: "xngnso2",
+    $$css: true
+  }
+};

package/dist/Item/Item.d.ts

@@ -1,7 +1,7 @@
 /**
  * @file Item.tsx
  * @input Uses React, ReactNode, StyleXStyles, theme tokens, useClickableContainer
- * @output Exports Item component, ItemProps type
+ * @output Exports Item component, ItemProps type; publishes the shared inline inset
  * @position Core layout primitive; consumed by index.ts, tested by Item.test.tsx
  *
  * SYNC: When modified, update these files to stay in sync:

package/dist/Item/Item.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Item.d.ts","sourceRoot":"","sources":["../../src/Item/Item.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAgB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAUpD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgB5C,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAC;AAC3C,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,CAAC;AAE9D,MAAM,WAAW,SAAU,SAAQ,SAAS,CAAC,WAAW,CAAC;IACvD,yCAAyC;IACzC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAE7B;;;OAGG;IACH,EAAE,CAAC,EAAE,KAAK,GAAG,IAAI,GAAG,MAAM,CAAC;IAE3B;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;;OAGG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB;;;OAGG;IACH,KAAK,EAAE,SAAS,CAAC;IAEjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAE9B;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAE5C;;;;;;;;;;;OAWG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAErD;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,MAAM,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAE5B;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;;;;;;OAQG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAwLD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,IAAI,CAAC,EACnB,EAAE,EAAE,SAAiB,EACrB,MAAM,EACN,YAAY,EACZ,KAAK,EACL,WAAW,EACX,UAAU,EACV,KAAgB,EAChB,OAAoB,EACpB,UAAU,EACV,gBAAgB,EAChB,MAAkB,EAClB,OAAO,EACP,cAAc,EACd,IAAI,EACJ,MAAM,EAAE,eAAe,EACvB,GAAG,EAAE,YAAY,EACjB,aAAqB,EACrB,UAAkB,EAClB,UAAkB,EAClB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,IAAI,EACJ,GAAG,SAAS,EACb,EAAE,SAAS,+BAmOX;yBA7Pe,IAAI"}
+{"version":3,"file":"Item.d.ts","sourceRoot":"","sources":["../../src/Item/Item.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAgB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAUpD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgB5C,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAC;AAC3C,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,CAAC;AAE9D,MAAM,WAAW,SAAU,SAAQ,SAAS,CAAC,WAAW,CAAC;IACvD,yCAAyC;IACzC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAE7B;;;OAGG;IACH,EAAE,CAAC,EAAE,KAAK,GAAG,IAAI,GAAG,MAAM,CAAC;IAE3B;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;;OAGG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB;;;OAGG;IACH,KAAK,EAAE,SAAS,CAAC;IAEjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAE9B;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAE5C;;;;;;;;;;;OAWG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAErD;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,MAAM,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAE5B;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;;;;;;OAQG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AA8LD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,IAAI,CAAC,EACnB,EAAE,EAAE,SAAiB,EACrB,MAAM,EACN,YAAY,EACZ,KAAK,EACL,WAAW,EACX,UAAU,EACV,KAAgB,EAChB,OAAoB,EACpB,UAAU,EACV,gBAAgB,EAChB,MAAkB,EAClB,OAAO,EACP,cAAc,EACd,IAAI,EACJ,MAAM,EAAE,eAAe,EACvB,GAAG,EAAE,YAAY,EACjB,aAAqB,EACrB,UAAkB,EAClB,UAAkB,EAClB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,IAAI,EACJ,GAAG,SAAS,EACb,EAAE,SAAS,+BAmOX;yBA7Pe,IAAI"}

package/dist/Item/Item.js

@@ -5,7 +5,7 @@
 /**
  * @file Item.tsx
  * @input Uses React, ReactNode, StyleXStyles, theme tokens, useClickableContainer
- * @output Exports Item component, ItemProps type
+ * @output Exports Item component, ItemProps type; publishes the shared inline inset
  * @position Core layout primitive; consumed by index.ts, tested by Item.test.tsx
  *
  * SYNC: When modified, update these files to stay in sync:
@@ -53,7 +53,8 @@ const styles = {
     k1xSpc: "x78zum5",
     kGNEyG: "x6s0dn4",
     kOIVth: "x1txdalj",
-    kg3NbH: "xf314gf",
+    "--_item-inset-inline": "xw1s368",
+    kg3NbH: "xaip428",
     kVAEAm: "x1n2onr6",
     kB7OPa: "x9f619",
     k9WMMc: "x1yc453h",
@@ -149,7 +150,7 @@ const densityStyles = {
   },
   spacious: {
     k8WAf4: "x8o8v82",
-    kg3NbH: "xrrkdod",
+    "--_item-inset-inline": "x1ytau7y",
     $$css: true
   }
 };

package/dist/Kbd/Kbd.d.ts

@@ -1,7 +1,7 @@
 /**
  * @file Kbd.tsx
- * @input Uses React, StyleX, theme tokens
- * @output Exports Kbd component and KbdProps
+ * @input Uses React, StyleX, theme tokens, shortcut key names and aliases
+ * @output Exports Kbd component and KbdProps with canonical shortcut labels
  * @position Core implementation; renders styled keyboard shortcut indicators
  *
  * SYNC: When modified, update:
@@ -14,7 +14,9 @@ export interface KbdProps extends BaseProps<HTMLSpanElement> {
     ref?: React.Ref<HTMLSpanElement>;
     /**
      * Keyboard shortcut string. Use "+" to separate keys.
-     * Special keys: mod (Cmd on Mac), ctrl, alt, shift, enter, backspace, escape.
+     * Special keys: mod (Cmd on Mac), ctrl, alt, shift, enter, backspace, escape,
+     * tab, up, down, left, and right.
+     * Aliases: "esc" for "escape" and "return" for "enter".
      * Use "plus" to render a literal "+" key (e.g. "shift+plus").
      *
      * @example

package/dist/Kbd/Kbd.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Kbd.d.ts","sourceRoot":"","sources":["../../src/Kbd/Kbd.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;GASG;AAEH,OAAO,KAA6B,MAAM,OAAO,CAAC;AAIlD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA0G5C,MAAM,WAAW,QAAS,SAAQ,SAAS,CAAC,eAAe,CAAC;IAC1D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC;;;;;;;;;;;;OAYG;IACH,IAAI,EAAE,MAAM,CAAC;CACd;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,GAAG,CAAC,EAAC,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,IAAI,EAAC,EAAE,QAAQ,qBAgC3E;yBAhCe,GAAG"}
+{"version":3,"file":"Kbd.d.ts","sourceRoot":"","sources":["../../src/Kbd/Kbd.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;GASG;AAEH,OAAO,KAA6B,MAAM,OAAO,CAAC;AAIlD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA+G5C,MAAM,WAAW,QAAS,SAAQ,SAAS,CAAC,eAAe,CAAC;IAC1D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC;;;;;;;;;;;;;;OAcG;IACH,IAAI,EAAE,MAAM,CAAC;CACd;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,GAAG,CAAC,EAAC,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,IAAI,EAAC,EAAE,QAAQ,qBA6C3E;yBA7Ce,GAAG"}

package/dist/Kbd/Kbd.js

@@ -4,8 +4,8 @@
 
 /**
  * @file Kbd.tsx
- * @input Uses React, StyleX, theme tokens
- * @output Exports Kbd component and KbdProps
+ * @input Uses React, StyleX, theme tokens, shortcut key names and aliases
+ * @output Exports Kbd component and KbdProps with canonical shortcut labels
  * @position Core implementation; renders styled keyboard shortcut indicators
  *
  * SYNC: When modified, update:
@@ -35,26 +35,20 @@ const styles = {
  * Note: `mod` is not in this map — it resolves dynamically via platform
  * detection inside the component.
  */
-const KEY_DISPLAY = {
-  ctrl: '\u2303',
-  // ⌃
-  alt: '\u2325',
-  // ⌥
-  shift: '\u21E7',
-  // ⇧
-  enter: '\u21B5',
-  // ↵
-  backspace: '\u232B',
-  // ⌫
-  escape: 'Esc',
-  tab: '\u21E5',
-  // ⇥
-  up: '\u2191',
-  down: '\u2193',
-  left: '\u2190',
-  right: '\u2192',
-  plus: '+'
-};
+const KEY_DISPLAY = new Map([['ctrl', '\u2303'],
+// ⌃
+['alt', '\u2325'],
+// ⌥
+['shift', '\u21E7'],
+// ⇧
+['enter', '\u21B5'],
+// ↵
+['backspace', '\u232B'],
+// ⌫
+['escape', 'Esc'], ['tab', '\u21E5'],
+// ⇥
+['up', '\u2191'], ['down', '\u2193'], ['left', '\u2190'], ['right', '\u2192'], ['plus', '+']]);
+const KBD_KEY_ALIASES = new Map([['esc', 'escape'], ['return', 'enter']]);
 
 /**
  * Resolves a key name to its display string. Handles the platform-aware
@@ -65,7 +59,7 @@ function getKeyDisplay(key, isMac) {
   if (key === 'mod') {
     return isMac ? '\u2318' : 'Ctrl';
   }
-  return KEY_DISPLAY[key] ?? key.toUpperCase();
+  return KEY_DISPLAY.get(key) ?? key.toUpperCase();
 }
 
 /**
@@ -73,25 +67,12 @@ function getKeyDisplay(key, isMac) {
  * (⌘, ⇧, ↵, …) that assistive tech cannot announce meaningfully, so the
  * accessible name for the shortcut is built from these words instead.
  */
-const KEY_LABEL = {
-  ctrl: 'Control',
-  alt: 'Alt',
-  shift: 'Shift',
-  enter: 'Enter',
-  backspace: 'Backspace',
-  escape: 'Escape',
-  tab: 'Tab',
-  up: 'Up arrow',
-  down: 'Down arrow',
-  left: 'Left arrow',
-  right: 'Right arrow',
-  plus: 'Plus'
-};
+const KEY_LABEL = new Map([['ctrl', 'Control'], ['alt', 'Alt'], ['shift', 'Shift'], ['enter', 'Enter'], ['backspace', 'Backspace'], ['escape', 'Escape'], ['tab', 'Tab'], ['up', 'Up arrow'], ['down', 'Down arrow'], ['left', 'Left arrow'], ['right', 'Right arrow'], ['plus', 'Plus']]);
 function getKeyLabel(key, isMac) {
   if (key === 'mod') {
     return isMac ? 'Command' : 'Control';
   }
-  return KEY_LABEL[key] ?? key.toUpperCase();
+  return KEY_LABEL.get(key) ?? key.toUpperCase();
 }
 function subscribeToPlatformChanges() {
   return () => {};
@@ -123,24 +104,37 @@ export function Kbd({
   ...rest
 }) {
   const isMac = useSyncExternalStore(subscribeToPlatformChanges, isApplePlatform, getServerPlatformSnapshot);
-  const parts = keys.split('+').map(key => key.trim().toLowerCase());
+  const keyOccurrences = new Map();
+  const parts = keys.split('+').map(key => key.trim().toLowerCase()).map(sourceKey => {
+    const occurrence = keyOccurrences.get(sourceKey) ?? 0;
+    keyOccurrences.set(sourceKey, occurrence + 1);
+    return {
+      key: KBD_KEY_ALIASES.get(sourceKey) ?? sourceKey,
+      reactKey: `${sourceKey}:${occurrence}`
+    };
+  });
 
   // Screen-reader name: the joined spoken labels (e.g. "Command + K"), since
   // the visual glyphs below are announced meaninglessly by assistive tech.
-  const accessibleName = parts.map(key => getKeyLabel(key, isMac)).join(' + ');
+  const accessibleName = parts.map(({
+    key
+  }) => getKeyLabel(key, isMac)).join(' + ');
   return /*#__PURE__*/_jsx("span", {
     ...rest,
     ref: ref,
     role: "img",
     "aria-label": accessibleName,
     ...mergeProps(themeProps('kbd'), stylex.props(styles.wrapper, xstyle), className, style),
-    children: parts.map(key => /*#__PURE__*/_jsx("kbd", {
+    children: parts.map(({
+      key,
+      reactKey
+    }) => /*#__PURE__*/_jsx("kbd", {
       "aria-hidden": "true",
       ...{
         className: "x3nfvp2 x6s0dn4 xl56j7k x16asifk x1grt7ep x7a5moj xx3sua9 x17x4s8c xlxy82 x1q0q8m5 xib2hle xv1l7n4 x9ynric x141an7d x1e4wzip x1ltkj2j x87ps6o"
       },
       children: getKeyDisplay(key, isMac)
-    }, key))
+    }, reactKey))
   });
 }
 Kbd.displayName = 'Kbd';

package/dist/Link/Link.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../src/Link/Link.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAc5C,OAAO,KAAK,EACV,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,UAAU,EACV,WAAW,EACZ,MAAM,gBAAgB,CAAC;AAExB,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,SAAS,CAAC;AAmG/C,MAAM,WAAW,SAAU,SAAQ,SAAS,CAC1C,iBAAiB,GAAG,iBAAiB,CACtC;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;IACvD;;;;;OAKG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;IACvB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC5B;;OAEG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,2BAA2B,CAAC;IACnD;;;OAGG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;IACzE;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAWD;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,IAAI,CAAC,EACnB,EAAE,EACF,KAAK,EACL,IAAI,EACJ,YAAoB,EACpB,UAAkB,EAClB,cAAsB,EACtB,WAAW,EAAE,oBAAoB,EACjC,MAAM,EAAE,eAAe,EACvB,OAAO,EACP,OAAO,EACP,YAAoB,EACpB,IAAa,EACb,IAAI,EACJ,MAAM,EACN,KAAgB,EAChB,OAAkB,EAClB,QAAY,EACZ,QAAQ,EACR,GAAG,EAAE,YAAY,EACjB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,SAAS,+BAyIX;yBAlKe,IAAI"}
+{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../src/Link/Link.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAc5C,OAAO,KAAK,EACV,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,UAAU,EACV,WAAW,EACZ,MAAM,gBAAgB,CAAC;AAExB,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,SAAS,CAAC;AAoG/C,MAAM,WAAW,SAAU,SAAQ,SAAS,CAC1C,iBAAiB,GAAG,iBAAiB,CACtC;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;IACvD;;;;;OAKG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;IACvB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC5B;;OAEG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,2BAA2B,CAAC;IACnD;;;OAGG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;IACzE;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAWD;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,IAAI,CAAC,EACnB,EAAE,EACF,KAAK,EACL,IAAI,EACJ,YAAoB,EACpB,UAAkB,EAClB,cAAsB,EACtB,WAAW,EAAE,oBAAoB,EACjC,MAAM,EAAE,eAAe,EACvB,OAAO,EACP,OAAO,EACP,YAAoB,EACpB,IAAa,EACb,IAAI,EACJ,MAAM,EACN,KAAgB,EAChB,OAAkB,EAClB,QAAY,EACZ,QAAQ,EACR,GAAG,EAAE,YAAY,EACjB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,SAAS,+BA6IX;yBAtKe,IAAI"}

package/dist/Link/Link.js

@@ -28,6 +28,7 @@ import { computeTargetAndRel } from "./computeTargetAndRel.js";
 import { useInteractiveRole } from "../hooks/useInteractiveRole.js";
 import { themeProps } from "../utils/themeProps.js";
 import { focusOutlineProps } from "../utils/focusOutline.stylex.js";
+import { interactionOverlayStyles } from "../utils/interactionOverlay.stylex.js";
 import { useTranslator } from "../i18n/index.js";
 
 /**
@@ -206,7 +207,10 @@ export function Link({
       disabled: isDisabled,
       ...mergeProps(themeProps('link', {
         color
-      }), focusOutlineProps.focusVisible(styles.base, styles.buttonReset, linkColorStyles[color], hasUnderline && styles.hasUnderline, isStandalone && styles.standalone, isDisabled && styles.disabled, xstyle), className, style),
+      }), focusOutlineProps.focusVisible(styles.base, styles.buttonReset, linkColorStyles[color],
+      // The system's pressed overlay behind the text; the hover stays the
+      // colour change above, so a press is the one background it paints.
+      !isDisabled && interactionOverlayStyles.pressedBackgroundColor, hasUnderline && styles.hasUnderline, isStandalone && styles.standalone, isDisabled && styles.disabled, xstyle), className, style),
       ...props,
       children: sharedContent
     });
@@ -241,7 +245,7 @@ export function Link({
       tabIndex: isDisabled ? -1 : undefined,
       ...mergeProps(themeProps('link', {
         color
-      }), focusOutlineProps.focusVisible(styles.base, linkColorStyles[color], hasUnderline && styles.hasUnderline, isStandalone && styles.standalone, isDisabled && styles.disabled, xstyle), className, style),
+      }), focusOutlineProps.focusVisible(styles.base, linkColorStyles[color], !isDisabled && interactionOverlayStyles.pressedBackgroundColor, hasUnderline && styles.hasUnderline, isStandalone && styles.standalone, isDisabled && styles.disabled, xstyle), className, style),
       ...props,
       children: sharedContent
     });

package/dist/Link/useLinkComponent.d.ts

@@ -1,23 +1,13 @@
 import type { LinkComponentType } from './types';
 /**
- * Resolves the link component to use.
- *
- * Priority: `as` prop > `LinkProvider` context > native `<a>`.
- *
- * When the resolved component is a custom component (not the native `<a>`),
- * it is wrapped to receive both `href` and `to` props set to the same value.
- * This allows `to`-based routers (React Router, TanStack Router) to work
- * out of the box without a manual adapter.
- *
- * @param as - Per-component override. If provided, takes highest priority.
- * @returns The resolved link component (with `to` injection for custom components).
+ * Resolve `as`, then LinkProvider, then a native anchor. Both destination props
+ * are checked before rendering; accepted structured values retain identity.
+ * Custom components receive `to={href}` unless an explicit `to` is supplied.
  *
  * @example
  * ```
- * function MyComponent({ as }: { as?: LinkComponentType }) {
- *   const LinkComponent = useLinkComponent(as);
- *   return <LinkComponent href="/foo">Click me</LinkComponent>;
- * }
+ * const LinkComponent = useLinkComponent(as);
+ * return <LinkComponent href="/docs">Documentation</LinkComponent>;
  * ```
  */
 export declare function useLinkComponent(as?: LinkComponentType): LinkComponentType;

package/dist/Link/useLinkComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useLinkComponent.d.ts","sourceRoot":"","sources":["../../src/Link/useLinkComponent.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,SAAS,CAAC;AAgC/C;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,gBAAgB,CAC9B,EAAE,CAAC,EAAE,iBAAiB,GACrB,iBAAiB,CAYnB"}
+{"version":3,"file":"useLinkComponent.d.ts","sourceRoot":"","sources":["../../src/Link/useLinkComponent.ts"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,SAAS,CAAC;AA+B/C;;;;;;;;;;GAUG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,CAAC,EAAE,iBAAiB,GAAG,iBAAiB,CAI1E"}