@ansh-ui/vue 0.2.0 → 0.3.1

package/dist/overlay.js

@@ -1,7 +1,7 @@
-export { AlertDialog, ContextMenu, Dialog, DialogFooter, Drawer, DropdownMenu, HoverCard, Popover, PopoverContent, PopoverTrigger, Tooltip, TooltipProvider } from './chunk-2VSROZ2N.js';
+export { AlertDialog, ContextMenu, Dialog, DialogFooter, Drawer, DropdownMenu, HoverCard, Popover, PopoverContent, PopoverTrigger, Tooltip, TooltipProvider } from './chunk-D3HH726R.js';
 import './chunk-6XJOB6LE.js';
 import './chunk-XZ5ZFLZM.js';
-import './chunk-TMG3M6TK.js';
+import './chunk-G2OX2NH2.js';
 import './chunk-OAQ7MDYX.js';
 import './chunk-NJDDNO4C.js';
 //# sourceMappingURL=overlay.js.map

package/dist/{position-Cn7qP1pn.d.cts → position-CiY171HP.d.cts}

@@ -47,4 +47,5 @@ interface PositionResult {
 }
 declare function computePosition(anchor: Rect, floating: Rect, viewport: Rect, options?: PositionOptions): PositionResult;
 
-export { type Align as A, type Placement as P, type Rect as R, type Side as S, type PositionOptions as a, type PositionResult as b, computePosition as c };
+export { computePosition as c };
+export type { Align as A, Placement as P, Rect as R, Side as S, PositionOptions as a, PositionResult as b };

package/dist/{position-Cn7qP1pn.d.ts → position-CiY171HP.d.ts}

@@ -47,4 +47,5 @@ interface PositionResult {
 }
 declare function computePosition(anchor: Rect, floating: Rect, viewport: Rect, options?: PositionOptions): PositionResult;
 
-export { type Align as A, type Placement as P, type Rect as R, type Side as S, type PositionOptions as a, type PositionResult as b, computePosition as c };
+export { computePosition as c };
+export type { Align as A, Placement as P, Rect as R, Side as S, PositionOptions as a, PositionResult as b };

package/dist/primitives.cjs

@@ -2,7 +2,7 @@
 
 var chunkDMPNT3MY_cjs = require('./chunk-DMPNT3MY.cjs');
 var chunkXLLSS464_cjs = require('./chunk-XLLSS464.cjs');
-var chunkEISHOEB6_cjs = require('./chunk-EISHOEB6.cjs');
+var chunkMWGVDY6K_cjs = require('./chunk-MWGVDY6K.cjs');
 var chunk774WBLDR_cjs = require('./chunk-774WBLDR.cjs');
 var chunkPP6OYURM_cjs = require('./chunk-PP6OYURM.cjs');
 var chunk6732H4BQ_cjs = require('./chunk-6732H4BQ.cjs');
@@ -35,23 +35,23 @@ Object.defineProperty(exports, "useScrollLock", {
 });
 Object.defineProperty(exports, "getTabbable", {
   enumerable: true,
-  get: function () { return chunkEISHOEB6_cjs.getTabbable; }
+  get: function () { return chunkMWGVDY6K_cjs.getTabbable; }
 });
 Object.defineProperty(exports, "useAutoFocus", {
   enumerable: true,
-  get: function () { return chunkEISHOEB6_cjs.useAutoFocus; }
+  get: function () { return chunkMWGVDY6K_cjs.useAutoFocus; }
 });
 Object.defineProperty(exports, "useFocusRestore", {
   enumerable: true,
-  get: function () { return chunkEISHOEB6_cjs.useFocusRestore; }
+  get: function () { return chunkMWGVDY6K_cjs.useFocusRestore; }
 });
 Object.defineProperty(exports, "useFocusTrap", {
   enumerable: true,
-  get: function () { return chunkEISHOEB6_cjs.useFocusTrap; }
+  get: function () { return chunkMWGVDY6K_cjs.useFocusTrap; }
 });
 Object.defineProperty(exports, "useRovingFocus", {
   enumerable: true,
-  get: function () { return chunkEISHOEB6_cjs.useRovingFocus; }
+  get: function () { return chunkMWGVDY6K_cjs.useRovingFocus; }
 });
 Object.defineProperty(exports, "useControllableState", {
   enumerable: true,

package/dist/primitives.d.cts

@@ -1,7 +1,7 @@
-import { R as ReadonlyRef } from './utils-IKPG3zcC.cjs';
-export { S as SlotContent, c as cx, r as resolveSlotContent, u as useId } from './utils-IKPG3zcC.cjs';
-import { b as PositionResult, a as PositionOptions } from './position-Cn7qP1pn.cjs';
-export { A as Align, P as Placement, R as Rect, S as Side, c as computePosition } from './position-Cn7qP1pn.cjs';
+import { R as ReadonlyRef } from './utils-D4XwXDeX.cjs';
+export { S as SlotContent, c as cx, r as resolveSlotContent, u as useId } from './utils-D4XwXDeX.cjs';
+import { b as PositionResult, a as PositionOptions } from './position-CiY171HP.cjs';
+export { A as Align, P as Placement, R as Rect, S as Side, c as computePosition } from './position-CiY171HP.cjs';
 import { ComputedRef, Ref, ShallowRef } from 'vue';
 import * as _ansh_ui_core from '@ansh-ui/core';
 import { BudgetReport, PointerState, ScrollTrackOptions, ScrollProgress, FrameState, MotionValue, AnimationOptions, SpringOptions } from '@ansh-ui/core';
@@ -297,4 +297,5 @@ declare function useAnimate(): <T>(from: T | MotionValue<T>, to: T | readonly T[
  */
 declare function useAnimatedFrom<Source, T>(source: Ref<Source>, target: MotionValue<T>, map: (value: Source) => T, options?: AnimationOptions<T>): void;
 
-export { type AnchoredPosition, type AnchoredPositionOptions, type DismissOptions, PositionOptions, PositionResult, ReadonlyRef, type UseInViewOptions, getLayerStack, getTabbable, useAnchoredPosition, useAnimate, useAnimatedFrom, useAutoFocus, useControllableState, useDismiss, useElementSize, useFocusRestore, useFocusTrap, useFrameBudget, useInView, useMotionRef, useMotionStyle, useMotionValue, usePointer, usePresence, useReducedMotion, useRovingFocus, useScrollLock, useScrollProgress, useSpringValue, useTicker, useWindowScroll };
+export { PositionOptions, PositionResult, ReadonlyRef, getLayerStack, getTabbable, useAnchoredPosition, useAnimate, useAnimatedFrom, useAutoFocus, useControllableState, useDismiss, useElementSize, useFocusRestore, useFocusTrap, useFrameBudget, useInView, useMotionRef, useMotionStyle, useMotionValue, usePointer, usePresence, useReducedMotion, useRovingFocus, useScrollLock, useScrollProgress, useSpringValue, useTicker, useWindowScroll };
+export type { AnchoredPosition, AnchoredPositionOptions, DismissOptions, UseInViewOptions };

package/dist/primitives.d.ts

@@ -1,7 +1,7 @@
-import { R as ReadonlyRef } from './utils-IKPG3zcC.js';
-export { S as SlotContent, c as cx, r as resolveSlotContent, u as useId } from './utils-IKPG3zcC.js';
-import { b as PositionResult, a as PositionOptions } from './position-Cn7qP1pn.js';
-export { A as Align, P as Placement, R as Rect, S as Side, c as computePosition } from './position-Cn7qP1pn.js';
+import { R as ReadonlyRef } from './utils-D4XwXDeX.js';
+export { S as SlotContent, c as cx, r as resolveSlotContent, u as useId } from './utils-D4XwXDeX.js';
+import { b as PositionResult, a as PositionOptions } from './position-CiY171HP.js';
+export { A as Align, P as Placement, R as Rect, S as Side, c as computePosition } from './position-CiY171HP.js';
 import { ComputedRef, Ref, ShallowRef } from 'vue';
 import * as _ansh_ui_core from '@ansh-ui/core';
 import { BudgetReport, PointerState, ScrollTrackOptions, ScrollProgress, FrameState, MotionValue, AnimationOptions, SpringOptions } from '@ansh-ui/core';
@@ -297,4 +297,5 @@ declare function useAnimate(): <T>(from: T | MotionValue<T>, to: T | readonly T[
  */
 declare function useAnimatedFrom<Source, T>(source: Ref<Source>, target: MotionValue<T>, map: (value: Source) => T, options?: AnimationOptions<T>): void;
 
-export { type AnchoredPosition, type AnchoredPositionOptions, type DismissOptions, PositionOptions, PositionResult, ReadonlyRef, type UseInViewOptions, getLayerStack, getTabbable, useAnchoredPosition, useAnimate, useAnimatedFrom, useAutoFocus, useControllableState, useDismiss, useElementSize, useFocusRestore, useFocusTrap, useFrameBudget, useInView, useMotionRef, useMotionStyle, useMotionValue, usePointer, usePresence, useReducedMotion, useRovingFocus, useScrollLock, useScrollProgress, useSpringValue, useTicker, useWindowScroll };
+export { PositionOptions, PositionResult, ReadonlyRef, getLayerStack, getTabbable, useAnchoredPosition, useAnimate, useAnimatedFrom, useAutoFocus, useControllableState, useDismiss, useElementSize, useFocusRestore, useFocusTrap, useFrameBudget, useInView, useMotionRef, useMotionStyle, useMotionValue, usePointer, usePresence, useReducedMotion, useRovingFocus, useScrollLock, useScrollProgress, useSpringValue, useTicker, useWindowScroll };
+export type { AnchoredPosition, AnchoredPositionOptions, DismissOptions, UseInViewOptions };

package/dist/primitives.js

@@ -1,6 +1,6 @@
 export { usePresence } from './chunk-6XJOB6LE.js';
 export { computePosition, getLayerStack, useAnchoredPosition, useDismiss, useScrollLock } from './chunk-XZ5ZFLZM.js';
-export { getTabbable, useAutoFocus, useFocusRestore, useFocusTrap, useRovingFocus } from './chunk-TMG3M6TK.js';
+export { getTabbable, useAutoFocus, useFocusRestore, useFocusTrap, useRovingFocus } from './chunk-G2OX2NH2.js';
 export { useControllableState } from './chunk-OAQ7MDYX.js';
 export { useAnimate, useAnimatedFrom, useElementSize, useFrameBudget, useInView, useMotionRef, useMotionStyle, useMotionValue, usePointer, useReducedMotion, useScrollProgress, useSpringValue, useTicker, useWindowScroll } from './chunk-EVO23GUS.js';
 export { cx, resolveSlotContent, useId } from './chunk-NJDDNO4C.js';

package/dist/{sidebar-CTZ-Ckko.d.ts → sidebar-B9zDHMbn.d.cts}

@@ -1,6 +1,6 @@
 import * as vue from 'vue';
 import { VNode, PropType } from 'vue';
-import { S as SlotContent } from './utils-IKPG3zcC.js';
+import { S as SlotContent } from './utils-D4XwXDeX.cjs';
 
 interface NavItem {
     id: string;
@@ -65,7 +65,7 @@ declare const Sidebar: vue.DefineComponent<vue.ExtractPropTypes<{
     };
 }>, () => VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
-}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("navigate" | "update:collapsed")[], "navigate" | "update:collapsed", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("update:collapsed" | "navigate")[], "update:collapsed" | "navigate", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     sections: {
         type: PropType<readonly NavSection[]>;
         required: true;
@@ -94,8 +94,8 @@ declare const Sidebar: vue.DefineComponent<vue.ExtractPropTypes<{
         default: string;
     };
 }>> & Readonly<{
-    onNavigate?: ((...args: any[]) => any) | undefined;
     "onUpdate:collapsed"?: ((...args: any[]) => any) | undefined;
+    onNavigate?: ((...args: any[]) => any) | undefined;
 }>, {
     label: string;
     activeId: string;
@@ -121,4 +121,5 @@ declare const AppShell: vue.DefineComponent<{}, () => VNode<vue.RendererNode, vu
     [key: string]: any;
 }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 
-export { AppShell as A, type NavItem as N, Sidebar as S, type NavSection as a };
+export { AppShell as A, Sidebar as S };
+export type { NavItem as N, NavSection as a };

package/dist/{sidebar-CQqEmpid.d.cts → sidebar-DMrKHqZ5.d.ts}

@@ -1,6 +1,6 @@
 import * as vue from 'vue';
 import { VNode, PropType } from 'vue';
-import { S as SlotContent } from './utils-IKPG3zcC.cjs';
+import { S as SlotContent } from './utils-D4XwXDeX.js';
 
 interface NavItem {
     id: string;
@@ -65,7 +65,7 @@ declare const Sidebar: vue.DefineComponent<vue.ExtractPropTypes<{
     };
 }>, () => VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
-}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("navigate" | "update:collapsed")[], "navigate" | "update:collapsed", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("update:collapsed" | "navigate")[], "update:collapsed" | "navigate", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     sections: {
         type: PropType<readonly NavSection[]>;
         required: true;
@@ -94,8 +94,8 @@ declare const Sidebar: vue.DefineComponent<vue.ExtractPropTypes<{
         default: string;
     };
 }>> & Readonly<{
-    onNavigate?: ((...args: any[]) => any) | undefined;
     "onUpdate:collapsed"?: ((...args: any[]) => any) | undefined;
+    onNavigate?: ((...args: any[]) => any) | undefined;
 }>, {
     label: string;
     activeId: string;
@@ -121,4 +121,5 @@ declare const AppShell: vue.DefineComponent<{}, () => VNode<vue.RendererNode, vu
     [key: string]: any;
 }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 
-export { AppShell as A, type NavItem as N, Sidebar as S, type NavSection as a };
+export { AppShell as A, Sidebar as S };
+export type { NavItem as N, NavSection as a };

package/dist/styles.css

@@ -1312,6 +1312,353 @@
   }
 }
 
+/* ==========================================================================
+   Motion UI — presentation components with motion of their own.
+
+   Split out of `components.css`, which is already ~830 lines. Everything here targets a plain
+   `ansh-*` class or a `data-*` attribute and contains nothing React-specific, so it is shared
+   verbatim with `@ansh-ui/vue`'s build the same way every other stylesheet in this directory is.
+   ========================================================================== */
+
+/* --- Rotating headline word ---------------------------------------------- */
+
+/*
+ * Deliberately NOT `overflow: hidden` on this element. An inline-level box with clipped overflow
+ * is baseline-aligned by its bottom margin edge rather than by its text, which drops the rotating
+ * word below the line of the sentence containing it. The clipping happens on `__clip` instead,
+ * which is absolutely positioned and so takes no part in baseline alignment.
+ */
+.ansh-rotate {
+  position: relative;
+  display: inline-block;
+}
+
+/*
+ * The width and baseline holder, in normal flow. `visibility: hidden` rather than `display: none`
+ * — a display-none element contributes no size, which would defeat the point of measuring the
+ * longest word.
+ */
+.ansh-rotate__sizer {
+  display: grid;
+  grid-template-areas: 'word';
+  visibility: hidden;
+  pointer-events: none;
+}
+
+.ansh-rotate__ghost {
+  grid-area: word;
+  white-space: nowrap;
+}
+
+.ansh-rotate__clip {
+  position: absolute;
+  inset: 0;
+  overflow: hidden;
+}
+
+.ansh-rotate__word {
+  display: inline-block;
+  white-space: nowrap;
+  will-change: transform, opacity;
+}
+
+.ansh-rotate[data-animation='slide'] .ansh-rotate__word {
+  animation: ansh-rotate-slide var(--ansh-duration-slow, 420ms) var(--ansh-ease-emphasized) both;
+}
+
+.ansh-rotate[data-animation='fade'] .ansh-rotate__word {
+  animation: ansh-rotate-fade var(--ansh-duration-slow, 420ms) var(--ansh-ease-standard) both;
+}
+
+.ansh-rotate[data-animation='flip'] .ansh-rotate__word {
+  animation: ansh-rotate-flip var(--ansh-duration-slow, 420ms) var(--ansh-ease-emphasized) both;
+  transform-origin: 50% 0;
+}
+
+@keyframes ansh-rotate-slide {
+  from {
+    transform: translateY(100%);
+    opacity: 0;
+  }
+  to {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+
+@keyframes ansh-rotate-fade {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes ansh-rotate-flip {
+  from {
+    transform: rotateX(-90deg);
+    opacity: 0;
+  }
+  to {
+    transform: rotateX(0);
+    opacity: 1;
+  }
+}
+
+/* --- Before/after comparison --------------------------------------------- */
+
+.ansh-compare {
+  position: relative;
+  overflow: hidden;
+  border-radius: var(--ansh-radius-lg);
+  /* Without this a drag that starts on the surface scrolls the page on touch instead of moving
+     the divider — the single most common defect in comparison sliders on mobile. */
+  touch-action: none;
+  user-select: none;
+}
+
+.ansh-compare__layer {
+  position: absolute;
+  inset: 0;
+}
+
+.ansh-compare__layer > * {
+  width: 100%;
+  height: 100%;
+}
+
+/*
+ * The revealed layer sits above and is clipped. Clipping rather than resizing is what keeps its
+ * contents from reflowing as the handle moves.
+ */
+.ansh-compare__layer--before {
+  z-index: 1;
+}
+
+.ansh-compare__handle {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  z-index: 2;
+  width: 2px;
+  margin-left: -1px;
+  background: var(--ansh-content-primary);
+  cursor: ew-resize;
+  touch-action: none;
+}
+
+.ansh-compare__handle:focus-visible {
+  outline: 2px solid var(--ansh-border-focus);
+  outline-offset: 2px;
+}
+
+.ansh-compare__grip {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 2.25rem;
+  height: 2.25rem;
+  transform: translate(-50%, -50%);
+  border-radius: var(--ansh-radius-full);
+  background: var(--ansh-content-primary);
+  box-shadow: var(--ansh-shadow-lg);
+}
+
+/* The double chevron, drawn with borders so no icon asset or SVG is needed. */
+.ansh-compare__grip::before,
+.ansh-compare__grip::after {
+  content: '';
+  position: absolute;
+  top: 50%;
+  width: 0.4rem;
+  height: 0.4rem;
+  border-top: 2px solid var(--ansh-surface-canvas);
+  border-right: 2px solid var(--ansh-surface-canvas);
+}
+
+.ansh-compare__grip::before {
+  left: 30%;
+  transform: translate(0, -50%) rotate(-135deg);
+}
+
+.ansh-compare__grip::after {
+  right: 30%;
+  transform: translate(0, -50%) rotate(45deg);
+}
+
+.ansh-compare[data-dragging] {
+  cursor: ew-resize;
+}
+
+/* --- Device / browser mockup --------------------------------------------- */
+
+.ansh-mock {
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  background: var(--ansh-surface-raised);
+  border: 1px solid var(--ansh-border-default);
+  box-shadow: var(--ansh-shadow-lg);
+}
+
+.ansh-mock--browser,
+.ansh-mock--window {
+  border-radius: var(--ansh-radius-lg);
+}
+
+.ansh-mock__chrome {
+  display: flex;
+  align-items: center;
+  gap: var(--ansh-space-3);
+  padding: var(--ansh-space-3) var(--ansh-space-4);
+  background: var(--ansh-surface-sunken);
+  border-bottom: 1px solid var(--ansh-border-subtle);
+}
+
+.ansh-mock__dots {
+  display: flex;
+  gap: var(--ansh-space-2);
+  flex-shrink: 0;
+}
+
+.ansh-mock__dots i {
+  width: 0.7rem;
+  height: 0.7rem;
+  border-radius: var(--ansh-radius-full);
+  background: var(--ansh-border-strong);
+}
+
+.ansh-mock__url,
+.ansh-mock__title {
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-size: var(--ansh-text-xs);
+  color: var(--ansh-content-tertiary);
+}
+
+.ansh-mock__url {
+  padding: var(--ansh-space-1) var(--ansh-space-3);
+  border-radius: var(--ansh-radius-full);
+  background: var(--ansh-surface-raised);
+  font-family: var(--ansh-font-mono);
+}
+
+.ansh-mock__title {
+  text-align: center;
+}
+
+.ansh-mock__screen {
+  flex: 1;
+  min-height: 0;
+  overflow: hidden;
+  background: var(--ansh-surface-canvas);
+}
+
+/* The phone frame: a thick bezel and a notch, no chrome bar. */
+.ansh-mock--phone {
+  border-radius: 2.25rem;
+  border-width: 0.6rem;
+  border-color: var(--ansh-content-primary);
+  padding: 0;
+  position: relative;
+}
+
+.ansh-mock--phone .ansh-mock__screen {
+  border-radius: 1.7rem;
+}
+
+.ansh-mock__notch {
+  position: absolute;
+  top: 0;
+  left: 50%;
+  transform: translateX(-50%);
+  z-index: 2;
+  width: 38%;
+  height: 1.1rem;
+  border-radius: 0 0 var(--ansh-radius-lg) var(--ansh-radius-lg);
+  background: var(--ansh-content-primary);
+}
+
+/* --- Card stack ----------------------------------------------------------- */
+
+.ansh-stack {
+  display: flex;
+  flex-direction: column;
+  gap: var(--ansh-space-4);
+}
+
+.ansh-stack__deck {
+  position: relative;
+  display: grid;
+  /* One cell: every card stacks in it, and the tallest card sets the height so the deck does not
+     resize as cards advance. */
+  grid-template-areas: 'card';
+  isolation: isolate;
+}
+
+.ansh-stack__card {
+  grid-area: card;
+  transition:
+    transform var(--ansh-duration-slow, 420ms) var(--ansh-ease-emphasized),
+    opacity var(--ansh-duration-slow, 420ms) var(--ansh-ease-standard);
+  will-change: transform, opacity;
+}
+
+.ansh-stack__controls {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--ansh-space-3);
+}
+
+.ansh-stack__button {
+  display: grid;
+  place-items: center;
+  width: 2rem;
+  height: 2rem;
+  border-radius: var(--ansh-radius-full);
+  border: 1px solid var(--ansh-border-default);
+  background: var(--ansh-surface-raised);
+  color: var(--ansh-content-secondary);
+  font: inherit;
+  font-size: var(--ansh-text-lg);
+  line-height: 1;
+  cursor: pointer;
+}
+
+.ansh-stack__button:hover {
+  border-color: var(--ansh-border-strong);
+  color: var(--ansh-content-primary);
+}
+
+.ansh-stack__count {
+  font-family: var(--ansh-font-mono);
+  font-size: var(--ansh-text-xs);
+  color: var(--ansh-content-tertiary);
+  min-width: 3.5rem;
+  text-align: center;
+}
+
+/*
+ * Reduced motion. The library's kernel handles JS-driven motion, but these components animate in
+ * CSS, so they need their own guard — `@ansh-ui/tokens` neutralises durations globally, and this
+ * additionally removes the transform travel so cards and words change in place rather than
+ * snapping across a distance in 0.01ms.
+ */
+@media (prefers-reduced-motion: reduce) {
+  .ansh-rotate__word {
+    animation: none !important;
+  }
+
+  .ansh-stack__card {
+    transition: none !important;
+  }
+}
+
 /* ==========================================================================
    Forms
    ========================================================================== */
@@ -5381,6 +5728,123 @@ button.ansh-stepper__button:hover {
   text-underline-offset: 2px;
 }
 
+/* --- Carousel ------------------------------------------------------------- */
+
+.ansh-carousel {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  gap: var(--ansh-space-3);
+}
+
+.ansh-carousel__viewport {
+  position: relative;
+  overflow: hidden;
+  border-radius: var(--ansh-radius-lg);
+  /* Without this a horizontal drag scrolls the page on touch instead of moving the track — the
+     same defect the comparison slider guards against. */
+  touch-action: pan-y;
+}
+
+.ansh-carousel__track {
+  display: flex;
+  transition: transform var(--ansh-duration-slow, 420ms) var(--ansh-ease-emphasized);
+  will-change: transform;
+}
+
+.ansh-carousel__slide {
+  /* `flex: 0 0 100%` rather than `width: 100%`: flex items shrink by default, so eight slides in a
+     row would each collapse to an eighth of the viewport instead of queueing beside it. */
+  flex: 0 0 100%;
+  min-width: 0;
+}
+
+.ansh-carousel__viewport[data-dragging] {
+  cursor: grabbing;
+}
+
+.ansh-carousel__arrow {
+  position: absolute;
+  top: calc(50% - 1.25rem);
+  display: grid;
+  place-items: center;
+  width: 2.5rem;
+  height: 2.5rem;
+  border-radius: var(--ansh-radius-full);
+  border: 1px solid var(--ansh-border-default);
+  background: var(--ansh-surface-overlay);
+  color: var(--ansh-content-primary);
+  font: inherit;
+  font-size: var(--ansh-text-xl);
+  line-height: 1;
+  cursor: pointer;
+}
+
+.ansh-carousel__arrow:hover:not(:disabled) {
+  border-color: var(--ansh-border-strong);
+}
+
+.ansh-carousel__arrow:disabled {
+  opacity: 0.4;
+  cursor: default;
+}
+
+.ansh-carousel__arrow--prev {
+  left: var(--ansh-space-3);
+}
+
+.ansh-carousel__arrow--next {
+  right: var(--ansh-space-3);
+}
+
+.ansh-carousel__controls {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--ansh-space-3);
+}
+
+.ansh-carousel__dots {
+  display: flex;
+  gap: var(--ansh-space-2);
+}
+
+.ansh-carousel__dot {
+  width: 0.5rem;
+  height: 0.5rem;
+  padding: 0;
+  border: 0;
+  border-radius: var(--ansh-radius-full);
+  background: var(--ansh-border-strong);
+  cursor: pointer;
+  transition: background-color var(--ansh-duration-fast) var(--ansh-ease-standard);
+}
+
+.ansh-carousel__dot[aria-current] {
+  background: var(--ansh-accent-default);
+}
+
+.ansh-carousel__pause {
+  display: grid;
+  place-items: center;
+  min-width: 1.75rem;
+  height: 1.75rem;
+  padding: 0 var(--ansh-space-2);
+  border-radius: var(--ansh-radius-full);
+  border: 1px solid var(--ansh-border-default);
+  background: transparent;
+  color: var(--ansh-content-secondary);
+  font: inherit;
+  font-size: var(--ansh-text-xs);
+  cursor: pointer;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .ansh-carousel__track {
+    transition: none !important;
+  }
+}
+
 /* ==========================================================================
    Feedback — alerts, banners, callouts
    ========================================================================== */

package/dist/{utils-IKPG3zcC.d.cts → utils-D4XwXDeX.d.cts}

@@ -43,4 +43,5 @@ declare function cx(...parts: Array<string | false | null | undefined>): string;
  */
 declare function useId(prefix?: string): string;
 
-export { type ReadonlyRef as R, type SlotContent as S, cx as c, resolveSlotContent as r, useId as u };
+export { cx as c, resolveSlotContent as r, useId as u };
+export type { ReadonlyRef as R, SlotContent as S };

package/dist/{utils-IKPG3zcC.d.ts → utils-D4XwXDeX.d.ts}

@@ -43,4 +43,5 @@ declare function cx(...parts: Array<string | false | null | undefined>): string;
  */
 declare function useId(prefix?: string): string;
 
-export { type ReadonlyRef as R, type SlotContent as S, cx as c, resolveSlotContent as r, useId as u };
+export { cx as c, resolveSlotContent as r, useId as u };
+export type { ReadonlyRef as R, SlotContent as S };