@mindlogic-ai/logician-ui 4.0.0-alpha.9 → 4.0.0

package/dist/components/Button/Button.styles.mjs

@@ -1,4 +1,56 @@
 "use client";
+/**
+ * The press is timed apart from everything else.
+ *
+ * This used to be `transitionProperty="all"` at a flat `0.25s`, which put the
+ * press on the same 250ms clock as a colour change. A press has to read as
+ * *contact* — the finger is already gone by 250ms and the button is still
+ * sinking — so it takes `motion.press` (120ms) while colour, border and shadow
+ * keep the slower step, since those are feedback rather than touch.
+ *
+ * ## Why the press uses `scale`, not `transform: scale()`
+ *
+ * `transform` is a single property, so a `_active` of `transform: scale(0.97)`
+ * *replaced* whatever transform the call site had set — and call sites use it
+ * for layout. `CopyableCode` centres its button with `translateY(-50%)`, so
+ * pressing it dropped the button half its own height, and once `transform` was
+ * being transitioned that drop became a visible slide.
+ *
+ * The individual `scale` property composes with `transform` instead of
+ * overwriting it, so a consumer can position with `transform` and still get the
+ * press. Anything that presses should use `scale`, never `transform: scale()`.
+ *
+ * Naming the properties also stops `all` from animating things nobody asked it
+ * to (width, padding) when a consumer changes them on hover.
+ */
+const PRESS = 'var(--chakra-durations-motion-press)';
+const FEEDBACK = 'var(--chakra-durations-fast)';
+const STANDARD = 'var(--chakra-easings-standard)';
+// The press is contact, so it eases out: `standard` starts slowly and the
+// first frames lag behind the finger.
+const EMPHASIZED = 'var(--chakra-easings-emphasized)';
+const buttonTransition = [
+    `scale ${PRESS} ${EMPHASIZED}`,
+    ...[
+        'background-color',
+        'border-color',
+        'color',
+        // No `box-shadow`: no variant sets one, so the only box-shadow that ever
+        // changes here is the keyboard focus ring, and that should appear at once.
+        'opacity',
+        // Both moved by `lift`, listed unconditionally because a property nobody
+        // changes costs nothing, and leaving them out would make the opt-in jump.
+        'translate',
+        // Nothing here sets `transform` — the press deliberately uses `scale` so it
+        // cannot clobber a call site. But call sites do set it (a 2px press ledge,
+        // an icon nudge), and under the old `transitionProperty: all` those moved
+        // smoothly. Naming the properties took that away and left them snapping,
+        // which is a regression the call site cannot see in this file. Listing it
+        // costs nothing while we set it nowhere.
+        'transform',
+        'filter',
+    ].map((property) => `${property} ${FEEDBACK} ${STANDARD}`),
+].join(', ');
 /**
  * Two-dimensional Button styles using the Golden Ratio color system.
  *
@@ -34,20 +86,24 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'blue.700',
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         soft: {
-            borderColor: 'transparent',
+            // Same-hue hairline so soft reads as a defined control on white, not a
+            // floating fill. `lighter` sits well below `outline`'s `.main` border, so
+            // soft stays the quieter of the two bordered variants; it also equals the
+            // hover/active fill, so the border melts into the fill on interaction.
+            borderColor: 'primary.lighter',
             bgColor: 'primary.extralight', // #E8EEFB
             color: 'primary.dark', // #0D317D
             _hover: {
-                borderColor: 'transparent',
+                borderColor: 'primary.lighter',
                 bgColor: 'primary.lighter', // #B9CBF3
             },
             _active: {
                 bgColor: 'primary.lighter', // #B9CBF3 — same as hover, scale provides pressed feedback
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         outline: {
@@ -59,7 +115,7 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'primary.lighter', // #B9CBF3
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         ghost: {
@@ -71,7 +127,7 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'primary.lighter', // #B9CBF3
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
     },
@@ -89,20 +145,20 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'violet.700',
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         soft: {
-            borderColor: 'transparent',
+            borderColor: 'secondary.lighter',
             bgColor: 'secondary.extralight', // #F4E8FB
             color: 'secondary.dark', // #570D7D
             _hover: {
-                borderColor: 'transparent',
+                borderColor: 'secondary.lighter',
                 bgColor: 'secondary.lighter', // #DEB9F3
             },
             _active: {
                 bgColor: 'secondary.lighter', // #DEB9F3 — same as hover, scale provides pressed feedback
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         outline: {
@@ -114,7 +170,7 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'secondary.lighter', // #DEB9F3
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         ghost: {
@@ -126,7 +182,7 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'secondary.lighter', // #DEB9F3
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
     },
@@ -144,20 +200,20 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'rose.700',
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         soft: {
-            borderColor: 'transparent',
+            borderColor: 'danger.lighter',
             bgColor: 'danger.extralight', // #FBE8E9
             color: 'danger.dark', // #7D0D14
             _hover: {
-                borderColor: 'transparent',
+                borderColor: 'danger.lighter',
                 bgColor: 'danger.lighter', // #F3B9BD
             },
             _active: {
                 bgColor: 'danger.lighter', // #F3B9BD — same as hover, scale provides pressed feedback
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         outline: {
@@ -169,7 +225,7 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'danger.lighter', // #F3B9BD
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         ghost: {
@@ -181,7 +237,7 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'danger.lighter', // #F3B9BD
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
     },
@@ -199,20 +255,20 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'green.800',
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         soft: {
-            borderColor: 'transparent',
+            borderColor: 'success.lighter',
             bgColor: 'success.extralight', // #E9FBE8
             color: 'success.dark', // #147D0D
             _hover: {
-                borderColor: 'transparent',
+                borderColor: 'success.lighter',
                 bgColor: 'success.lighter', // #BDF3B9
             },
             _active: {
                 bgColor: 'success.lighter', // #BDF3B9 — same as hover, scale provides pressed feedback
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         outline: {
@@ -224,7 +280,7 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'success.lighter', // #BDF3B9
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         ghost: {
@@ -236,7 +292,7 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'success.lighter', // #BDF3B9
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
     },
@@ -257,20 +313,20 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'gold.600',
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         soft: {
-            borderColor: 'transparent',
+            borderColor: 'warning.lighter',
             bgColor: 'warning.extralight', // #FBF6E8
             color: 'warning.dark', // #7D610D
             _hover: {
-                borderColor: 'transparent',
+                borderColor: 'warning.lighter',
                 bgColor: 'warning.lighter', // #F3E4B9
             },
             _active: {
                 bgColor: 'warning.lighter', // #F3E4B9 — same as hover, scale provides pressed feedback
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         outline: {
@@ -282,7 +338,7 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'warning.lighter', // #F3E4B9
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         ghost: {
@@ -294,7 +350,7 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'warning.lighter', // #F3E4B9
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
     },
@@ -302,33 +358,57 @@ const buttonColorPaletteStyles = {
      * Neutral (Gray) color scheme
      */
     neutral: {
+        /**
+         * The INK action — the one high-emphasis fill in the system with no hue.
+         *
+         * Was `gray.700` under a white label, which failed AA in **both** modes and
+         * failed worse in the one nobody screenshots: white on `#737D96` measures
+         * **4.12:1** in light, and the semantic gray scale inverts, so in dark the
+         * same token resolves to `grayDark.fg700` `#8D919D` and the label lands at
+         * **3.15:1**. This was the only palette x variant combination in the system
+         * below the 4.5:1 text gate.
+         *
+         * "One step darker" does not fix it — `gray.800` is 5.32:1 light but
+         * **3.08:1** dark, i.e. worse, because darkening the light arm lightens the
+         * dark one. A neutral fill has to INVERT, not shift, which is exactly what
+         * `bg.inverse` / `fg.inverse` already do: ink under a near-white label on a
+         * light page, brand paper under an ink label on a dark one. Measured
+         * **15.11:1** and **15.88:1**, with the fill itself 15.49:1 / 16.36:1 clear
+         * of its canvas so it still reads as a control.
+         *
+         * `gray.1200` / `gray.1100` for hover and active for the same reason: both
+         * step AWAY from the resting fill toward the page in whichever mode is
+         * live, because they invert too. Labels stay 10.8:1 or better throughout.
+         */
         solid: {
-            borderColor: 'gray.700',
-            bgColor: 'gray.700', // #737D96
-            color: 'white',
+            borderColor: 'bg.inverse',
+            bgColor: 'bg.inverse',
+            color: 'fg.inverse',
             _hover: {
-                borderColor: 'gray.800',
-                bgColor: 'gray.800', // #616B85
+                borderColor: 'gray.1200',
+                bgColor: 'gray.1200',
             },
             _active: {
-                bgColor: 'gray.900', // #505A74
-                transform: 'scale(0.97)',
+                bgColor: 'gray.1100',
+                scale: '0.97',
             },
         },
         soft: {
-            borderColor: 'transparent',
+            // `border.default` (not a gray tint) so the neutral hairline stays visible
+            // in dark mode, where `border.subtle` collapses into the fill.
+            borderColor: 'border.default', // gray.300 / gray.1100 (_dark)
             // Neutral fills flip with the mode (light values preserved: bg.subtle →
             // gray.50, bg.muted → gray.100). Without this the surface stayed light in
             // dark mode while the fg.default text flipped to light = invisible.
             bgColor: 'bg.subtle', // gray.50 / gray.1300 (_dark)
             color: 'fg.default',
             _hover: {
-                borderColor: 'transparent',
+                borderColor: 'border.default',
                 bgColor: 'bg.muted', // gray.100 / gray.1200 (_dark)
             },
             _active: {
                 bgColor: 'bg.muted', // matches hover; scale provides pressed feedback
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         outline: {
@@ -340,7 +420,7 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'bg.muted', // gray.100 / gray.1200 (_dark)
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
         ghost: {
@@ -352,7 +432,7 @@ const buttonColorPaletteStyles = {
             },
             _active: {
                 bgColor: 'bg.muted', // gray.100 / gray.1200 (_dark)
-                transform: 'scale(0.97)',
+                scale: '0.97',
             },
         },
     },
@@ -384,5 +464,5 @@ const buttonVariants = [
     'ghost',
 ];
 
-export { buttonColorPaletteStyles, buttonColorPalettes, buttonVariants, getButtonStyles };
+export { buttonColorPaletteStyles, buttonColorPalettes, buttonTransition, buttonVariants, getButtonStyles };
 //# sourceMappingURL=Button.styles.mjs.map

package/dist/components/Button/Button.styles.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Button.styles.mjs","sources":["../../../src/components/Button/Button.styles.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}
+{"version":3,"file":"Button.styles.mjs","sources":["../../../src/components/Button/Button.styles.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}

package/dist/components/Button/Button.types.d.ts

@@ -1,4 +1,6 @@
+import type { ElementType } from 'react';
 import { ButtonProps as ChakraButtonProps } from '@chakra-ui/react';
+import type { PolymorphicProps } from '../../types/polymorphic';
 /**
  * Button color palette - defines the semantic color family.
  *
@@ -42,7 +44,7 @@ export type ButtonVariant = 'solid' | 'soft' | 'outline' | 'ghost';
  * <Button colorPalette="secondary" variant="outline">Cancel</Button>
  * ```
  */
-export type ButtonProps = Omit<ChakraButtonProps, 'variant' | 'colorScheme' | 'colorPalette' | 'leftIcon' | 'rightIcon'> & {
+export type ButtonOwnProps = Omit<ChakraButtonProps, 'variant' | 'colorScheme' | 'colorPalette' | 'leftIcon' | 'rightIcon' | 'as'> & {
     /**
      * The color palette of the button (semantic color family).
      * Overrides Chakra UI's colorPalette prop (Chakra v3).
@@ -55,5 +57,40 @@ export type ButtonProps = Omit<ChakraButtonProps, 'variant' | 'colorScheme' | 'c
      * @default 'solid'
      */
     variant?: ButtonVariant;
+    /**
+     * Raises the button 1px on hover and puts a shadow under it, so it reads as
+     * lifting toward the pointer. Pressing sets it back down, under the existing
+     * `scale` press.
+     *
+     * Off by default and deliberately opt-in: a lift is emphasis, and a form of
+     * six buttons all lifting is noise. Use it where one button is the point of
+     * the screen — a primary call to action, a card that is itself a button — not
+     * as a house style.
+     *
+     * The shadow yields to the keyboard focus ring, which is also a `box-shadow`;
+     * a focused button that is also hovered keeps its ring and still lifts.
+     *
+     * @default false
+     */
+    lift?: boolean;
 };
+/**
+ * Props for `Button`, typed for whatever element `as` renders.
+ *
+ * Defaults to `'button'`, so `ButtonProps` on its own means exactly what it
+ * meant before this became polymorphic — every existing call site and every
+ * `ComponentProps<typeof Button>` keeps its type.
+ *
+ * `as` now carries the element's own props with it:
+ *
+ * ```tsx
+ * <Button as="a" href="/docs" target="_blank" rel="noreferrer">문서</Button>
+ * <Button as={Link} href="/admin" prefetch={false}>관리자</Button>
+ * ```
+ *
+ * Before, `as` swapped the rendered element but not the type — `href` was not a
+ * `<button>` prop, so consumers reached for `@ts-expect-error`. See
+ * `src/types/polymorphic.ts` for why `asChild` does not cover this case.
+ */
+export type ButtonProps<TElement extends ElementType = 'button'> = PolymorphicProps<TElement, ButtonOwnProps>;
 //# sourceMappingURL=Button.types.d.ts.map

package/dist/components/Button/Button.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.types.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,IAAI,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAEpE;;;;;;;;;;;;GAYG;AACH,MAAM,MAAM,kBAAkB,GAC1B,SAAS,GACT,WAAW,GACX,QAAQ,GACR,SAAS,GACT,SAAS,GACT,SAAS,CAAC;AAEd;;;;;;;;;;;GAWG;AACH,MAAM,MAAM,aAAa,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AAEnE;;;;;;;;;;;;;;;GAeG;AACH,MAAM,MAAM,WAAW,GAAG,IAAI,CAC5B,iBAAiB,EACjB,SAAS,GAAG,aAAa,GAAG,cAAc,GAAG,UAAU,GAAG,WAAW,CACtE,GAAG;IACF;;;;OAIG;IACH,YAAY,CAAC,EAAE,kBAAkB,CAAC;IAClC;;;;OAIG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;CACzB,CAAC"}
+{"version":3,"file":"Button.types.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,WAAW,IAAI,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAOpE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAEhE;;;;;;;;;;;;GAYG;AACH,MAAM,MAAM,kBAAkB,GAC1B,SAAS,GACT,WAAW,GACX,QAAQ,GACR,SAAS,GACT,SAAS,GACT,SAAS,CAAC;AAEd;;;;;;;;;;;GAWG;AACH,MAAM,MAAM,aAAa,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AAEnE;;;;;;;;;;;;;;;GAeG;AACH,MAAM,MAAM,cAAc,GAAG,IAAI,CAC/B,iBAAiB,EACjB,SAAS,GAAG,aAAa,GAAG,cAAc,GAAG,UAAU,GAAG,WAAW,GAAG,IAAI,CAC7E,GAAG;IACF;;;;OAIG;IACH,YAAY,CAAC,EAAE,kBAAkB,CAAC;IAClC;;;;OAIG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB;;;;;;;;;;;;;;OAcG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,MAAM,WAAW,CAAC,QAAQ,SAAS,WAAW,GAAG,QAAQ,IAC7D,gBAAgB,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAC"}

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

@@ -1,4 +1,4 @@
 export { Button } from './Button';
 export { buttonColorPalettes, buttonColorPaletteStyles, buttonVariants, getButtonStyles, } from './Button.styles';
-export type { ButtonColorPalette, ButtonProps, ButtonVariant, } from './Button.types';
+export type { ButtonColorPalette, ButtonOwnProps, ButtonProps, ButtonVariant, } from './Button.types';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EACL,mBAAmB,EACnB,wBAAwB,EACxB,cAAc,EACd,eAAe,GAChB,MAAM,iBAAiB,CAAC;AACzB,YAAY,EACV,kBAAkB,EAClB,WAAW,EACX,aAAa,GACd,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EACL,mBAAmB,EACnB,wBAAwB,EACxB,cAAc,EACd,eAAe,GAChB,MAAM,iBAAiB,CAAC;AACzB,YAAY,EACV,kBAAkB,EAClB,cAAc,EACd,WAAW,EACX,aAAa,GACd,MAAM,gBAAgB,CAAC"}

package/dist/components/Card/Card.d.ts

@@ -1,6 +1,3 @@
-import { Card as ChakraCard } from '@chakra-ui/react';
-export declare const Card: import("react").ForwardRefExoticComponent<ChakraCard.RootProps & {
-    clickable?: boolean;
-    variant?: import("./Card.types").CardVariant;
-} & import("react").RefAttributes<HTMLDivElement>>;
+import { CardOwnProps } from './Card.types';
+export declare const Card: import("../..").PolymorphicComponent<CardOwnProps, "div">;
 //# sourceMappingURL=Card.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/components/Card/Card.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAKtD,eAAO,MAAM,IAAI;;;kDA+BhB,CAAC"}
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/components/Card/Card.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAyC5C,eAAO,MAAM,IAAI,2DAA6C,CAAC"}

package/dist/components/Card/Card.js

@@ -4,9 +4,10 @@
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var react = require('@chakra-ui/react');
+var polymorphic = require('../../types/polymorphic.js');
 var Card_styles = require('./Card.styles.js');
 
-const Card = React.forwardRef(({ clickable, variant = 'default', _hover, ...rest }, ref) => {
+const CardImpl = React.forwardRef(({ clickable, variant = 'default', _hover, ...rest }, ref) => {
     const mergedHover = clickable
         ? { ...Card_styles.clickableStyles._hover, ..._hover }
         : _hover;
@@ -14,10 +15,17 @@ const Card = React.forwardRef(({ clickable, variant = 'default', _hover, ...rest
         // border.default (gray.300 / gray.1100 _dark) instead of border.subtle:
         // subtle's _dark (gray.1300 #1E2433) is ~invisible on bg.surface in dark,
         // so cards blended into the canvas. default gives the card a discernible
-        // edge in both modes. The `gradient` variant keeps its primary.light border.
-        borderColor: "border.default", borderRadius: "lg", transitionProperty: "common", transitionDuration: "normal", transitionTimingFunction: "ease", p: 8, ...(clickable ? { cursor: Card_styles.clickableStyles.cursor } : {}), ...Card_styles.variantStyles[variant], ...rest, _hover: mergedHover }));
+        // edge in both modes. The `wash` variant softens it back to
+        // border.subtle because its `bg.subtle` fill already separates it.
+        borderColor: "border.default", borderRadius: "lg", 
+        // Was `transitionDuration="normal"` — a Chakra v2 token absent from v3.
+        // It fell through as a literal, `transition-duration: normal` is invalid
+        // CSS, and the whole declaration was dropped, so hover never transitioned.
+        animationStyle: "feedback", transitionProperty: "common", p: 8, ...(clickable ? { cursor: Card_styles.clickableStyles.cursor } : {}), ...Card_styles.variantStyles[variant], ...rest, _hover: mergedHover }));
 });
-Card.displayName = 'Card';
+/** Type-level polymorphism over the same runtime — see the note on `Button`. */
+CardImpl.displayName = 'Card';
+const Card = polymorphic.polymorphic(CardImpl);
 
 exports.Card = Card;
 //# sourceMappingURL=Card.js.map

package/dist/components/Card/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sources":["../../../src/components/Card/Card.tsx"],"sourcesContent":[null],"names":["forwardRef","clickableStyles","_jsx","ChakraCard","variantStyles"],"mappings":";;;;;;;;MAMa,IAAI,GAAGA,gBAAU,CAC5B,CAAC,EAAE,SAAS,EAAE,OAAO,GAAG,SAAS,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,KAAI;IAC3D,MAAM,WAAW,GAAG;UAChB,EAAE,GAAGC,2BAAe,CAAC,MAAM,EAAE,GAAG,MAAM;UACtC,MAAM;AAEV,IAAA,QACEC,cAAA,CAACC,UAAU,CAAC,IAAI,EAAA,EACd,GAAG,EAAE,GAAG,EACR,QAAQ,EAAC,UAAU,EACnB,EAAE,EAAC,YAAY,EACf,KAAK,EAAC,YAAY,EAClB,SAAS,EAAC,MAAM,EAChB,MAAM,EAAC,WAAW;;;;;QAKlB,WAAW,EAAC,gBAAgB,EAC5B,YAAY,EAAC,IAAI,EACjB,kBAAkB,EAAC,QAAQ,EAC3B,kBAAkB,EAAC,QAAQ,EAC3B,wBAAwB,EAAC,MAAM,EAC/B,CAAC,EAAE,CAAC,EAAA,IACC,SAAS,GAAG,EAAE,MAAM,EAAEF,2BAAe,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,KACrDG,yBAAa,CAAC,OAAO,CAAC,EAAA,GACtB,IAAI,EACR,MAAM,EAAE,WAAW,EAAA,CACnB;AAEN,CAAC;AAGH,IAAI,CAAC,WAAW,GAAG,MAAM;;;;"}
+{"version":3,"file":"Card.js","sources":["../../../src/components/Card/Card.tsx"],"sourcesContent":[null],"names":["forwardRef","clickableStyles","_jsx","ChakraCard","variantStyles","polymorphic"],"mappings":";;;;;;;;;AAOA,MAAM,QAAQ,GAAGA,gBAAU,CACzB,CAAC,EAAE,SAAS,EAAE,OAAO,GAAG,SAAS,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,KAAI;IAC3D,MAAM,WAAW,GAAG;UAChB,EAAE,GAAGC,2BAAe,CAAC,MAAM,EAAE,GAAG,MAAM;UACtC,MAAM;AAEV,IAAA,QACEC,cAAA,CAACC,UAAU,CAAC,IAAI,EAAA,EACd,GAAG,EAAE,GAAG,EACR,QAAQ,EAAC,UAAU,EACnB,EAAE,EAAC,YAAY,EACf,KAAK,EAAC,YAAY,EAClB,SAAS,EAAC,MAAM,EAChB,MAAM,EAAC,WAAW;;;;;;AAMlB,QAAA,WAAW,EAAC,gBAAgB,EAC5B,YAAY,EAAC,IAAI;;;;AAIjB,QAAA,cAAc,EAAC,UAAU,EACzB,kBAAkB,EAAC,QAAQ,EAC3B,CAAC,EAAE,CAAC,EAAA,IACC,SAAS,GAAG,EAAE,MAAM,EAAEF,2BAAe,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,KACrDG,yBAAa,CAAC,OAAO,CAAC,EAAA,GACtB,IAAI,EACR,MAAM,EAAE,WAAW,EAAA,CACnB;AAEN,CAAC,CACF;AAED;AACA,QAAQ,CAAC,WAAW,GAAG,MAAM;MAEhB,IAAI,GAAGC,uBAAW,CAAsB,QAAQ;;;;"}

package/dist/components/Card/Card.mjs

@@ -2,9 +2,10 @@
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { Card as Card$1 } from '@chakra-ui/react';
+import { polymorphic } from '../../types/polymorphic.mjs';
 import { clickableStyles, variantStyles } from './Card.styles.mjs';
 
-const Card = forwardRef(({ clickable, variant = 'default', _hover, ...rest }, ref) => {
+const CardImpl = forwardRef(({ clickable, variant = 'default', _hover, ...rest }, ref) => {
     const mergedHover = clickable
         ? { ...clickableStyles._hover, ..._hover }
         : _hover;
@@ -12,10 +13,17 @@ const Card = forwardRef(({ clickable, variant = 'default', _hover, ...rest }, re
         // border.default (gray.300 / gray.1100 _dark) instead of border.subtle:
         // subtle's _dark (gray.1300 #1E2433) is ~invisible on bg.surface in dark,
         // so cards blended into the canvas. default gives the card a discernible
-        // edge in both modes. The `gradient` variant keeps its primary.light border.
-        borderColor: "border.default", borderRadius: "lg", transitionProperty: "common", transitionDuration: "normal", transitionTimingFunction: "ease", p: 8, ...(clickable ? { cursor: clickableStyles.cursor } : {}), ...variantStyles[variant], ...rest, _hover: mergedHover }));
+        // edge in both modes. The `wash` variant softens it back to
+        // border.subtle because its `bg.subtle` fill already separates it.
+        borderColor: "border.default", borderRadius: "lg", 
+        // Was `transitionDuration="normal"` — a Chakra v2 token absent from v3.
+        // It fell through as a literal, `transition-duration: normal` is invalid
+        // CSS, and the whole declaration was dropped, so hover never transitioned.
+        animationStyle: "feedback", transitionProperty: "common", p: 8, ...(clickable ? { cursor: clickableStyles.cursor } : {}), ...variantStyles[variant], ...rest, _hover: mergedHover }));
 });
-Card.displayName = 'Card';
+/** Type-level polymorphism over the same runtime — see the note on `Button`. */
+CardImpl.displayName = 'Card';
+const Card = polymorphic(CardImpl);
 
 export { Card };
 //# sourceMappingURL=Card.mjs.map

package/dist/components/Card/Card.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Card.mjs","sources":["../../../src/components/Card/Card.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraCard"],"mappings":";;;;;;MAMa,IAAI,GAAG,UAAU,CAC5B,CAAC,EAAE,SAAS,EAAE,OAAO,GAAG,SAAS,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,KAAI;IAC3D,MAAM,WAAW,GAAG;UAChB,EAAE,GAAG,eAAe,CAAC,MAAM,EAAE,GAAG,MAAM;UACtC,MAAM;AAEV,IAAA,QACEA,GAAA,CAACC,MAAU,CAAC,IAAI,EAAA,EACd,GAAG,EAAE,GAAG,EACR,QAAQ,EAAC,UAAU,EACnB,EAAE,EAAC,YAAY,EACf,KAAK,EAAC,YAAY,EAClB,SAAS,EAAC,MAAM,EAChB,MAAM,EAAC,WAAW;;;;;QAKlB,WAAW,EAAC,gBAAgB,EAC5B,YAAY,EAAC,IAAI,EACjB,kBAAkB,EAAC,QAAQ,EAC3B,kBAAkB,EAAC,QAAQ,EAC3B,wBAAwB,EAAC,MAAM,EAC/B,CAAC,EAAE,CAAC,EAAA,IACC,SAAS,GAAG,EAAE,MAAM,EAAE,eAAe,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,KACrD,aAAa,CAAC,OAAO,CAAC,EAAA,GACtB,IAAI,EACR,MAAM,EAAE,WAAW,EAAA,CACnB;AAEN,CAAC;AAGH,IAAI,CAAC,WAAW,GAAG,MAAM;;;;"}
+{"version":3,"file":"Card.mjs","sources":["../../../src/components/Card/Card.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraCard"],"mappings":";;;;;;;AAOA,MAAM,QAAQ,GAAG,UAAU,CACzB,CAAC,EAAE,SAAS,EAAE,OAAO,GAAG,SAAS,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,KAAI;IAC3D,MAAM,WAAW,GAAG;UAChB,EAAE,GAAG,eAAe,CAAC,MAAM,EAAE,GAAG,MAAM;UACtC,MAAM;AAEV,IAAA,QACEA,GAAA,CAACC,MAAU,CAAC,IAAI,EAAA,EACd,GAAG,EAAE,GAAG,EACR,QAAQ,EAAC,UAAU,EACnB,EAAE,EAAC,YAAY,EACf,KAAK,EAAC,YAAY,EAClB,SAAS,EAAC,MAAM,EAChB,MAAM,EAAC,WAAW;;;;;;AAMlB,QAAA,WAAW,EAAC,gBAAgB,EAC5B,YAAY,EAAC,IAAI;;;;AAIjB,QAAA,cAAc,EAAC,UAAU,EACzB,kBAAkB,EAAC,QAAQ,EAC3B,CAAC,EAAE,CAAC,EAAA,IACC,SAAS,GAAG,EAAE,MAAM,EAAE,eAAe,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,KACrD,aAAa,CAAC,OAAO,CAAC,EAAA,GACtB,IAAI,EACR,MAAM,EAAE,WAAW,EAAA,CACnB;AAEN,CAAC,CACF;AAED;AACA,QAAQ,CAAC,WAAW,GAAG,MAAM;MAEhB,IAAI,GAAG,WAAW,CAAsB,QAAQ;;;;"}

package/dist/components/Card/Card.styles.d.ts

@@ -1,17 +1,40 @@
 /**
  * Card styles using the Golden Ratio color system.
  */
+/**
+ * The clickable hover is flat: the ground steps one tier to `bg.subtle` and
+ * the border darkens to `border.strong`. Nothing lifts and nothing grows a
+ * shadow. A raised hover said "this floats", and a card in a list does not;
+ * the tier step and the border say "this is the one under the pointer" with
+ * no elevation, and both tokens invert, so the state reads in dark mode where
+ * a neutral tint would vanish.
+ */
 export declare const clickableStyles: {
     cursor: string;
     _hover: {
-        boxShadow: string;
+        bg: string;
+        borderColor: string;
     };
 };
 export declare const variantStyles: {
     default: {};
+    wash: {
+        bg: {
+            base: string;
+            _dark: string;
+        };
+        borderColor: string;
+    };
+    /** @deprecated Renders as `wash`; use `variant="wash"`. */
     gradient: {
-        bg: string;
-        border: string;
+        bg: {
+            base: string;
+            _dark: string;
+        };
+        borderColor: string;
+    };
+    elevated: {
+        boxShadow: string;
         borderColor: string;
     };
 };

package/dist/components/Card/Card.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Card/Card.styles.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,eAAO,MAAM,eAAe;;;;;CAK3B,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;;CAOzB,CAAC"}
+{"version":3,"file":"Card.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Card/Card.styles.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe;;;;;;CAM3B,CAAC;AAmBF,eAAO,MAAM,aAAa;;;;;;;;;IAGxB,2DAA2D;;;;;;;;;;;;CAU5D,CAAC"}