@seekalfred/primitives 0.5.1 → 0.7.1

package/dist/card-stack/card-stack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card-stack.js","names":[],"sources":["../../src/card-stack/card-stack.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  useCallback,\n  useId,\n  useRef,\n  useState,\n  type CSSProperties,\n  type KeyboardEvent,\n  type PointerEvent as ReactPointerEvent,\n  type ReactNode,\n  type RefObject,\n  type SVGProps,\n} from \"react\";\n\nimport { Button, type ButtonProps } from \"../button/button.js\";\nimport { cn } from \"../lib/cn.js\";\nimport { prefersReducedMotion, useExitBackstop, useIsomorphicLayoutEffect } from \"../lib/motion.js\";\n\nexport type CardDecision = \"left\" | \"right\";\n\n/**\n * CardStack: a deck of cards reviewed one at a time. Drag or flick the top card\n * left or right, or use the buttons and the arrow keys. The cards behind peek\n * out below it and rise as it leaves; a card in the hand tips the way it is\n * moving and shows a stamp (the action it will take); let go early and it springs\n * home, let go far enough, or fast enough, and it is thrown. Undo brings the\n * last card back from where it left, and Start over deals the deck again.\n *\n * Use it for quick triage where each item deserves a moment of attention:\n * shortlisting destinations, candidates or design options. Use a list or a\n * table when people need to compare items side by side.\n *\n * Keyboard: the stack takes one tab stop; Left and Right decide the top card,\n * Backspace (or Ctrl or Cmd with Z) undoes. Every decision is announced politely\n * and the buttons do the same, so nothing needs a drag. Reduced motion fades the\n * card out and back instead of throwing it.\n */\nexport interface CardStackProps<T> {\n  items: T[];\n  /** A stable key for an item. */\n  getKey: (item: T) => string;\n  /** A short name for the card, used in its accessible label and announcements, such as \"Lisbon\". */\n  getLabel: (item: T) => string;\n  /** The card's content. It fills the card, whose size the stack sets. */\n  renderCard: (item: T) => ReactNode;\n  /** Called when a card is decided. */\n  onDecide?: (item: T, decision: CardDecision) => void;\n  /** Called when a decision is undone. */\n  onUndo?: (item: T, decision: CardDecision) => void;\n  /** Called when the deck is dealt again. */\n  onReset?: () => void;\n  /** Action names for each side, used on the buttons and the stamps that appear while dragging. @default { left: \"Pass\", right: \"Keep\" } */\n  labels?: { left: string; right: string };\n  /** Past tense of each action for announcements, such as \"skipped\" and \"shortlisted\". Without it a decision reads \"Lisbon: Keep\". */\n  outcomes?: { left: string; right: string };\n  /** Accessible name for the stack. @default \"Cards\" */\n  label?: string;\n  /** Shown once every card has been decided. Receives a function that brings all cards back. */\n  renderEmpty?: (reset: () => void) => ReactNode;\n  /** Extra classes for the stack. Merged last. */\n  className?: string;\n}\n\ninterface Point {\n  x: number;\n  y: number;\n}\ntype Exit = Point & { tilt: number };\ntype Return = Exit & { delay: number };\n\n/** Cards rendered in the stack. The last one waits invisibly one step behind and fades in as it rises. */\nconst VISIBLE = 4;\n/** Degrees of rotation per pixel of horizontal travel. */\nconst ROTATE = 0.065;\n/** A release faster than this (px/s) throws the card even when it has only moved a little. */\nconst FLICK = 500;\n/** Drag distance at which the cards behind have fully risen. */\nconst LIFT_DISTANCE = 160;\n/** Vertical travel is not a decision, so past a small free zone it resists like a rubber band. */\nconst FREE_Y = 48;\nconst STRETCH_Y = 140;\n/** The stamp is fully shown at 96px of travel and starts at 16px. */\nconst STAMP_FROM = 16;\nconst STAMP_TO = 96;\n/** A thrown card is gone this long after it starts (the fade finishes well before); the backstop for a transition that never ends. */\nconst FLIGHT_BACKSTOP_MS = 1500;\n\nconst resistY = (raw: number) => {\n  const distance = Math.abs(raw);\n  return distance <= FREE_Y\n    ? raw\n    : Math.sign(raw) *\n        (FREE_Y + (1 - 1 / (((distance - FREE_Y) * 0.55) / STRETCH_Y + 1)) * STRETCH_Y);\n};\nconst unresistY = (shown: number) => {\n  const distance = Math.abs(shown);\n  if (distance <= FREE_Y) return shown;\n  const stretch = Math.min(distance - FREE_Y, STRETCH_Y - 1);\n  return Math.sign(shown) * (FREE_Y + ((1 / (1 - stretch / STRETCH_Y) - 1) * STRETCH_Y) / 0.55);\n};\nconst clampUnit = (value: number) => Math.min(1, Math.max(0, value));\n\n/** Where the card is now, mid-flight included: the computed translate, in px. */\nfunction readOffset(el: HTMLElement): Point {\n  const value = getComputedStyle(el).translate;\n  if (!value || value === \"none\") return { x: 0, y: 0 };\n  const [x, y] = value.split(\" \").map(parseFloat);\n  return { x: x || 0, y: y || 0 };\n}\n\nfunction velocityOf(samples: { t: number; x: number; y: number }[], now: number): Point {\n  const recent = samples.filter((sample) => now - sample.t <= 80);\n  const first = recent[0];\n  const last = recent[recent.length - 1];\n  if (!first || !last || first === last || now - last.t > 60) return { x: 0, y: 0 };\n  const seconds = (last.t - first.t) / 1000;\n  return { x: (last.x - first.x) / seconds, y: (last.y - first.y) / seconds };\n}\n\nconst iconProps: SVGProps<SVGSVGElement> = {\n  width: 16,\n  height: 16,\n  viewBox: \"0 0 24 24\",\n  fill: \"none\",\n  stroke: \"currentColor\",\n  strokeWidth: 1.75,\n  strokeLinecap: \"round\",\n  strokeLinejoin: \"round\",\n  \"aria-hidden\": true,\n};\nconst CheckIcon = () => (\n  <svg {...iconProps}>\n    <path d=\"M5 12.5 10 17.5 19 7\" />\n  </svg>\n);\nconst CloseIcon = () => (\n  <svg {...iconProps}>\n    <path d=\"M6 6l12 12M18 6 6 18\" />\n  </svg>\n);\nconst UndoIcon = () => (\n  <svg {...iconProps}>\n    <path d=\"M4 12a8 8 0 1 0 2.5-5.8M4 4v4.5h4.5\" />\n  </svg>\n);\n\n/**\n * A control that stays focusable when it has nothing to do: React Aria drops `aria-disabled` and a disabled button would\n * drop focus to the page when the stack runs out, so the attribute is set by hand and the press is guarded.\n */\nfunction Control({\n  disabled,\n  onPress,\n  ...rest\n}: { disabled: boolean; onPress: () => void } & Omit<ButtonProps, \"onPress\" | \"isDisabled\">) {\n  const ref = useRef<HTMLButtonElement>(null);\n  useIsomorphicLayoutEffect(() => {\n    if (disabled) ref.current?.setAttribute(\"aria-disabled\", \"true\");\n    else ref.current?.removeAttribute(\"aria-disabled\");\n  }, [disabled]);\n  return (\n    <Button\n      {...rest}\n      ref={ref}\n      className=\"aria-disabled:cursor-default aria-disabled:opacity-40\"\n      onPress={() => {\n        if (!disabled) onPress();\n      }}\n    />\n  );\n}\n\n/** Renders a custom empty state; the reset handler travels as a prop so render never touches the stack's refs. */\nfunction EmptySlot({\n  render,\n  onReset,\n}: {\n  render: (reset: () => void) => ReactNode;\n  onReset: () => void;\n}) {\n  return <>{render(onReset)}</>;\n}\n\nconst HOME_TRANSITION = (delay: number) =>\n  `translate var(--duration-smooth) var(--ease-smooth) ${delay}ms, rotate var(--duration-smooth) var(--ease-smooth) ${delay}ms, opacity var(--duration-quick) var(--ease-enter) ${delay}ms`;\nconst SPRING_BACK =\n  \"translate var(--duration-morph) var(--ease-morph), rotate var(--duration-morph) var(--ease-morph)\";\nconst THROW =\n  \"translate var(--duration-calm) var(--ease-calm), rotate var(--duration-calm) var(--ease-calm), opacity 220ms var(--ease-settle) 120ms\";\nconst REDUCED_FADE = \"opacity 150ms linear\";\n\ninterface CardProps {\n  id: string;\n  depth: number;\n  decision: CardDecision | null;\n  returnFrom?: Return;\n  interactive: boolean;\n  zIndex: number;\n  label: string;\n  labels: { left: string; right: string };\n  stage: RefObject<HTMLDivElement | null>;\n  fling: (id: string) => Point | undefined;\n  onRelease: (id: string, offset: Point, velocity: Point, width: number) => boolean;\n  onThrown: (id: string, exit: Exit) => void;\n  onGone: (id: string) => void;\n  children: ReactNode;\n}\n\nfunction StackCard({\n  id,\n  depth,\n  decision,\n  returnFrom,\n  interactive,\n  zIndex,\n  label,\n  labels,\n  stage,\n  fling,\n  onRelease,\n  onThrown,\n  onGone,\n  children,\n}: CardProps) {\n  const card = useRef<HTMLDivElement>(null);\n  // Grabbing the top half tips the card the way the hand moves; grabbing the bottom half tips it the other way.\n  const tilt = useRef(returnFrom?.tilt ?? 1);\n  const drag = useRef<{\n    ox: number;\n    oy: number;\n    samples: { t: number; x: number; y: number }[];\n  } | null>(null);\n  const settled = useRef(!returnFrom);\n  const wasDecided = useRef(false);\n\n  const lift = (value: number) => stage.current?.style.setProperty(\"--lift\", String(value));\n  /** Writes the card's place and what follows from it (its tilt and its stamps) straight to the DOM: a drag never re-renders. */\n  const place = (el: HTMLElement, x: number, y: number) => {\n    el.style.translate = `${x}px ${y}px`;\n    el.style.rotate = `${x * ROTATE * tilt.current}deg`;\n    el.style.setProperty(\"--keep\", String(clampUnit((x - STAMP_FROM) / (STAMP_TO - STAMP_FROM))));\n    el.style.setProperty(\"--pass\", String(clampUnit((-STAMP_FROM - x) / (STAMP_TO - STAMP_FROM))));\n  };\n\n  // Leaving the stack (a decision) and coming back (undo, or start over) are the only things that move a card by themselves.\n  useIsomorphicLayoutEffect(() => {\n    const el = card.current;\n    if (!el) return;\n    const reduced = prefersReducedMotion();\n    if (decision) {\n      // A key or button can decide the card mid-drag; the throw takes over from the finger.\n      drag.current = null;\n      el.removeAttribute(\"data-dragging\");\n      wasDecided.current = true;\n      const direction = decision === \"right\" ? 1 : -1;\n      const { x: cx, y: cy } = readOffset(el);\n      // Buttons and keys throw with a default flick; a drag keeps the finger's velocity.\n      const velocity = fling(id) ?? { x: direction * 900, y: -120 };\n      const speed = Math.hypot(velocity.x, velocity.y);\n      // Leave along the flick when it heads the chosen way, otherwise along the drag, otherwise straight out.\n      let ux = velocity.x;\n      let uy = velocity.y;\n      if (speed < 200 || Math.sign(ux) !== direction) {\n        ux = Math.abs(cx) > 8 ? cx : direction;\n        uy = Math.abs(cx) > 8 ? cy * 0.5 : -0.12;\n      }\n      const length = Math.hypot(ux, uy) || 1;\n      ux /= length;\n      uy /= length;\n      if (Math.abs(ux) < 0.45) {\n        ux = direction * 0.45;\n        uy = Math.sign(uy || -1) * Math.sqrt(1 - 0.45 * 0.45);\n      }\n      // Far enough to clear a typical preview or card column; the fade finishes before the spring does.\n      const reach = el.offsetWidth * 1.6;\n      const exit = { x: cx + ux * reach, y: cy + uy * reach, tilt: tilt.current };\n      onThrown(id, exit);\n      el.style.setProperty(direction > 0 ? \"--keep\" : \"--pass\", \"1\");\n      if (reduced) {\n        el.style.transition = REDUCED_FADE;\n      } else {\n        el.style.transition = THROW;\n        place(el, exit.x, exit.y);\n      }\n      el.style.opacity = \"0\";\n      return;\n    }\n    // Undo, or a first mount from where the card left: come back from there, catching any flight in progress.\n    if (!wasDecided.current && settled.current) return;\n    wasDecided.current = false;\n    const delay = returnFrom?.delay ?? 0;\n    if (!settled.current && !reduced && returnFrom) {\n      el.style.transition = \"none\";\n      place(el, returnFrom.x, returnFrom.y);\n      el.style.opacity = \"0\";\n      void el.offsetWidth;\n    }\n    settled.current = true;\n    if (reduced) {\n      el.style.transition = `${REDUCED_FADE} ${delay}ms`;\n      place(el, 0, 0);\n    } else {\n      el.style.transition = HOME_TRANSITION(delay);\n      place(el, 0, 0);\n    }\n    el.style.opacity = \"1\";\n    // Only the decision drives this effect; the return position is read once at that moment.\n  }, [decision]);\n\n  const gone = useCallback(() => onGone(id), [onGone, id]);\n  useExitBackstop(decision !== null, gone, FLIGHT_BACKSTOP_MS);\n\n  function down(event: ReactPointerEvent<HTMLDivElement>) {\n    if (!interactive || event.button !== 0 || !event.isPrimary) return;\n    if (\n      event.target instanceof Element &&\n      event.target.closest(\"button, a, input, select, textarea, [role='button']\")\n    )\n      return;\n    const el = event.currentTarget;\n    // Freeze wherever the card is (it may be mid-way home), then follow the finger.\n    const now = readOffset(el);\n    el.style.transition = \"none\";\n    if (Math.abs(now.x) < 2) {\n      const rect = el.getBoundingClientRect();\n      tilt.current = event.clientY < rect.top + rect.height / 2 ? 1 : -1;\n    }\n    place(el, now.x, now.y);\n    drag.current = {\n      ox: event.clientX - now.x,\n      oy: event.clientY - unresistY(now.y),\n      samples: [{ t: event.timeStamp, x: event.clientX, y: event.clientY }],\n    };\n    try {\n      el.setPointerCapture(event.pointerId);\n    } catch {\n      // A pointer that is no longer active cannot be captured; the drag then follows the card only while the pointer is over it.\n    }\n    el.setAttribute(\"data-dragging\", \"\");\n  }\n  function move(event: ReactPointerEvent<HTMLDivElement>) {\n    const state = drag.current;\n    if (!state || !interactive) return;\n    const x = event.clientX - state.ox;\n    const y = resistY(event.clientY - state.oy);\n    place(event.currentTarget, x, y);\n    // The cards behind rise as this one is dragged away.\n    lift(clampUnit(Math.hypot(x, y * 0.5) / LIFT_DISTANCE));\n    state.samples.push({ t: event.timeStamp, x: event.clientX, y: event.clientY });\n    if (state.samples.length > 12) state.samples.shift();\n  }\n  function up(event: ReactPointerEvent<HTMLDivElement>) {\n    const state = drag.current;\n    drag.current = null;\n    const el = event.currentTarget;\n    el.removeAttribute(\"data-dragging\");\n    if (el.hasPointerCapture(event.pointerId)) el.releasePointerCapture(event.pointerId);\n    if (!state || !interactive) return;\n    const velocity =\n      event.type === \"pointercancel\" ? { x: 0, y: 0 } : velocityOf(state.samples, event.timeStamp);\n    const offset = readOffset(el);\n    if (onRelease(id, offset, velocity, el.offsetWidth)) return;\n    // Below the threshold the card springs home.\n    el.style.transition = prefersReducedMotion() ? \"none\" : SPRING_BACK;\n    place(el, 0, 0);\n    lift(0);\n  }\n\n  return (\n    <div\n      className=\"card-stack-slot\"\n      style={{ \"--depth\": depth, zIndex } as CSSProperties}\n      aria-hidden={interactive ? undefined : true}\n      ref={(node) => {\n        if (!node) return;\n        if (interactive) node.removeAttribute(\"inert\");\n        else node.setAttribute(\"inert\", \"\");\n      }}\n    >\n      <div\n        ref={card}\n        className=\"card-stack-card\"\n        data-top={interactive ? \"\" : undefined}\n        data-flying={decision ? \"\" : undefined}\n        role={interactive ? \"group\" : undefined}\n        aria-label={interactive ? label : undefined}\n        onPointerDown={down}\n        onPointerMove={move}\n        onPointerUp={up}\n        onPointerCancel={up}\n        onTransitionEnd={(event) => {\n          if (decision && event.target === event.currentTarget && event.propertyName === \"opacity\")\n            gone();\n        }}\n      >\n        <div className=\"card-stack-face\">\n          {children}\n          <span className=\"card-stack-shade\" aria-hidden=\"true\" />\n        </div>\n        <span className=\"card-stack-stamp\" data-side=\"right\" aria-hidden=\"true\">\n          <CheckIcon />\n          {labels.right}\n        </span>\n        <span className=\"card-stack-stamp\" data-side=\"left\" aria-hidden=\"true\">\n          <CloseIcon />\n          {labels.left}\n        </span>\n      </div>\n    </div>\n  );\n}\n\nexport function CardStack<T>({\n  items,\n  getKey,\n  getLabel,\n  renderCard,\n  onDecide,\n  onUndo,\n  onReset,\n  labels = { left: \"Pass\", right: \"Keep\" },\n  outcomes,\n  label = \"Cards\",\n  renderEmpty,\n  className,\n}: CardStackProps<T>) {\n  const hintId = useId();\n  const stage = useRef<HTMLDivElement>(null);\n  const [position, setPosition] = useState(0);\n  const [history, setHistory] = useState<{ key: string; decision: CardDecision }[]>([]);\n  const [flying, setFlying] = useState<string[]>([]);\n  const [returning, setReturning] = useState<Record<string, Return>>({});\n  const [message, setMessage] = useState(\"\");\n  // Where each thrown card left the screen, so undo and start over can bring it back from there. Only those handlers read it,\n  // so it lives in a ref: recording an exit must not re-render the stack in the very frame the throw starts.\n  const exits = useRef<Record<string, Exit>>({});\n  const flings = useRef(new Map<string, Point>());\n  const top = items[position];\n  const remaining = Math.max(0, items.length - position);\n\n  function decide(decision: CardDecision) {\n    if (!top) return;\n    const key = getKey(top);\n    stage.current?.style.setProperty(\"--lift\", \"0\");\n    setPosition(position + 1);\n    setHistory([...history, { key, decision }]);\n    setFlying((current) => [...current, key]);\n    setReturning({});\n    const left = remaining - 1;\n    setMessage(\n      `${getLabel(top)}${outcomes ? ` ${outcomes[decision]}` : `: ${labels[decision]}`}. ${left ? `${left} left.` : \"All cards reviewed.\"}`,\n    );\n    onDecide?.(top, decision);\n  }\n\n  function undo() {\n    const last = history[history.length - 1];\n    const item = last && items.find((entry) => getKey(entry) === last.key);\n    if (!last || !item) return;\n    const exit = exits.current[last.key];\n    setPosition(position - 1);\n    setHistory(history.slice(0, -1));\n    setFlying((current) => current.filter((key) => key !== last.key));\n    setReturning(exit ? { [last.key]: { ...exit, delay: 0 } } : {});\n    setMessage(`${getLabel(item)} restored.`);\n    onUndo?.(item, last.decision);\n  }\n\n  function reset() {\n    if (!history.length) return;\n    // The deck deals itself back: the card that will sit deepest returns first, the top card last.\n    const count = Math.min(VISIBLE, items.length);\n    const back: Record<string, Return> = {};\n    items.slice(0, count).forEach((item, index) => {\n      const key = getKey(item);\n      const exit = exits.current[key];\n      if (exit && index < position) back[key] = { ...exit, delay: (count - 1 - index) * 60 };\n    });\n    setPosition(0);\n    setHistory([]);\n    setFlying([]);\n    setReturning(back);\n    setMessage(\"All cards are back in the stack.\");\n    onReset?.();\n  }\n\n  function release(key: string, offset: Point, velocity: Point, width: number) {\n    const direction = Math.sign(offset.x);\n    if (!direction || !top || getKey(top) !== key) return false;\n    const flick =\n      Math.abs(velocity.x) > FLICK &&\n      Math.sign(velocity.x) === direction &&\n      Math.abs(offset.x) > 12;\n    const far =\n      Math.abs(offset.x) > Math.min(width * 0.35, 140) &&\n      !(Math.sign(velocity.x) === -direction && Math.abs(velocity.x) > 300);\n    if (!flick && !far) return false;\n    flings.current.set(key, velocity);\n    decide(direction > 0 ? \"right\" : \"left\");\n    return true;\n  }\n\n  function onKeyDown(event: KeyboardEvent<HTMLDivElement>) {\n    if (event.target !== event.currentTarget) return;\n    if (event.key === \"ArrowLeft\" || event.key === \"ArrowRight\") {\n      event.preventDefault();\n      decide(event.key === \"ArrowRight\" ? \"right\" : \"left\");\n    } else if (\n      event.key === \"Backspace\" ||\n      ((event.metaKey || event.ctrlKey) && event.key.toLowerCase() === \"z\")\n    ) {\n      event.preventDefault();\n      undo();\n    }\n  }\n\n  const decided = new Map(history.map((entry) => [entry.key, entry.decision]));\n  const windowKeys = new Set(items.slice(position, position + VISIBLE).map(getKey));\n  const rendered = items.filter(\n    (item) => windowKeys.has(getKey(item)) || flying.includes(getKey(item)),\n  );\n  const empty = position >= items.length && flying.length === 0;\n  const takeFling = useCallback((key: string) => {\n    const velocity = flings.current.get(key);\n    flings.current.delete(key);\n    return velocity;\n  }, []);\n  const recordExit = useCallback((key: string, exit: Exit) => {\n    exits.current[key] = exit;\n  }, []);\n  const finish = useCallback(\n    (key: string) => setFlying((current) => current.filter((entry) => entry !== key)),\n    [],\n  );\n\n  return (\n    <div data-slot=\"card-stack\" className={cn(\"card-stack\", className)}>\n      <div\n        ref={stage}\n        className=\"card-stack-stage\"\n        // A keyboard widget: a focusable group is not allowed, an application is.\n        role=\"application\"\n        aria-roledescription=\"card stack\"\n        aria-label={label}\n        aria-describedby={hintId}\n        tabIndex={0}\n        onKeyDown={onKeyDown}\n      >\n        {rendered.map((item) => {\n          const id = getKey(item);\n          const index = items.indexOf(item);\n          const decision = decided.get(id) ?? null;\n          const depth = decision ? 0 : index - position;\n          return (\n            <StackCard\n              key={id}\n              id={id}\n              depth={depth}\n              decision={decision}\n              returnFrom={returning[id]}\n              interactive={!decision && depth === 0}\n              zIndex={decision ? 20 + flying.indexOf(id) : VISIBLE - depth}\n              label={`${getLabel(item)}, ${index + 1} of ${items.length}`}\n              labels={labels}\n              stage={stage}\n              fling={takeFling}\n              onRelease={release}\n              onThrown={recordExit}\n              onGone={finish}\n            >\n              {renderCard(item)}\n            </StackCard>\n          );\n        })}\n        {empty ? (\n          <div className=\"card-stack-empty\">\n            {renderEmpty ? (\n              <EmptySlot render={renderEmpty} onReset={reset} />\n            ) : (\n              <>\n                <p className=\"m-0 text-base font-medium\">All cards reviewed</p>\n                <Button variant=\"outline\" onPress={reset} startIcon={<UndoIcon />}>\n                  Start over\n                </Button>\n              </>\n            )}\n          </div>\n        ) : null}\n      </div>\n      <div className=\"flex flex-wrap justify-center gap-2\">\n        {/* aria-disabled keeps focus on the button when the stack runs out, instead of dropping it to the page. */}\n        <Control\n          variant=\"outline\"\n          disabled={!top}\n          onPress={() => decide(\"left\")}\n          startIcon={<CloseIcon />}\n        >\n          {labels.left}\n        </Control>\n        <Control variant=\"ghost\" disabled={!history.length} onPress={undo} startIcon={<UndoIcon />}>\n          Undo\n        </Control>\n        <Control\n          variant=\"primary\"\n          disabled={!top}\n          onPress={() => decide(\"right\")}\n          startIcon={<CheckIcon />}\n        >\n          {labels.right}\n        </Control>\n      </div>\n      <p id={hintId} className=\"sr-only\">\n        Drag the top card, or use the left and right arrow keys to {labels.left.toLowerCase()} or{\" \"}\n        {labels.right.toLowerCase()} it. Backspace undoes the last decision.\n      </p>\n      <p className=\"sr-only\" role=\"status\" aria-live=\"polite\">\n        {message}\n      </p>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/card-stack/index.d.ts

@@ -0,0 +1,2 @@
+import { CardDecision, CardStack, CardStackProps } from "./card-stack.js";
+export { type CardDecision, CardStack, type CardStackProps };

package/dist/card-stack/index.js

@@ -0,0 +1,2 @@
+import { CardStack } from "./card-stack.js";
+export { CardStack };

package/dist/carousel/carousel.d.ts

@@ -0,0 +1,56 @@
+import { ReactNode } from "react";
+//#region src/carousel/carousel.d.ts
+/**
+ * Carousel: a row of slides people browse by swiping, a trackpad, dragging
+ * with a mouse, the arrow keys, or the controls below it. Use it for a short,
+ * ordered set of peers such as products or case studies, where the neighbours
+ * stay in view as a hint that there is more.
+ *
+ * The slides sit on a native scroll-snap track, so touch and trackpad swipes
+ * are the browser's own. The active slide is centred; its neighbours shrink and
+ * dim with their distance, and each page indicator stretches into a pill as the
+ * track nears its slide, all written straight from the scroll position without a
+ * re-render. A mouse can drag the track, and a flick carries on to the next
+ * slide. Arrow keys, Home and End move between slides from the track or the
+ * indicators. `interval` adds a play control that rotates through the slides;
+ * rotation pauses on hover, keyboard focus and touch, while the carousel is off
+ * screen or the tab is hidden, and is unavailable under reduced motion (where
+ * scrolling also jumps instead of gliding).
+ */
+export interface CarouselProps {
+  /** Names the carousel for assistive technology, such as "From the Harbour suites". */
+  label: string;
+  /** One child per slide. */
+  children: ReactNode;
+  /** Controlled active slide. Pair with `onIndexChange`. */
+  index?: number;
+  /** @default 0 */
+  defaultIndex?: number;
+  onIndexChange?: (index: number) => void;
+  /** Width of one slide as a CSS length; `cqw` is a share of the carousel's width. @default "min(80cqw, 340px)" */
+  slideSize?: string;
+  /** Names each slide and its indicator. @default (index, count) => `${index + 1} of ${count}` */
+  slideLabel?: (index: number, count: number) => string;
+  /** Milliseconds per slide. Adds a play control that rotates through the slides. */
+  interval?: number;
+  /** Starts rotating on mount. Off by default, so motion begins with the viewer. @default false */
+  autoplay?: boolean;
+  /** Names of the controls, for translation. */
+  labels?: {
+    /** @default "Previous slide" */
+    previous?: string;
+    /** @default "Next slide" */
+    next?: string;
+    /** @default "Start slide rotation" */
+    play?: string;
+    /** @default "Pause slide rotation" */
+    pause?: string;
+    /** Names the group of indicators. @default "Choose a slide" */
+    slides?: string;
+  };
+  /** Extra classes for the carousel. Merged last. */
+  className?: string;
+}
+export declare const Carousel: import("react").ForwardRefExoticComponent<CarouselProps & import("react").RefAttributes<HTMLElement>>;
+//#endregion
+//# sourceMappingURL=carousel.d.ts.map

package/dist/carousel/carousel.js

@@ -0,0 +1,389 @@
+"use client";
+import { cn } from "../lib/cn.js";
+import { mergeRefs } from "../lib/merge-refs.js";
+import { useIsomorphicLayoutEffect, useReducedMotion } from "../lib/motion.js";
+import { Children, forwardRef, isValidElement, useCallback, useEffect, useId, useMemo, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/carousel/carousel.tsx
+/** Movement before a mouse press is read as a drag. */
+const SLOP = 6;
+/** Release speed in px/s that always moves at least one slide. */
+const FLICK = 360;
+/** Where a flick would come to rest: velocity (px/s) projected with a paging deceleration rate. */
+const project = (velocity, rate = .995) => velocity / 1e3 * rate / (1 - rate);
+const clamp = (value, min, max) => Math.min(max, Math.max(min, value));
+const defaultSlideLabel = (index, count) => `${index + 1} of ${count}`;
+const PlayGlyph = () => /* @__PURE__ */ jsx("svg", {
+	width: 15,
+	height: 15,
+	viewBox: "0 0 16 16",
+	fill: "currentColor",
+	"aria-hidden": "true",
+	children: /* @__PURE__ */ jsx("path", { d: "M4.5 2.8v10.4a.6.6 0 0 0 .9.5l8.2-5.2a.6.6 0 0 0 0-1L5.4 2.3a.6.6 0 0 0-.9.5Z" })
+});
+const PauseGlyph = () => /* @__PURE__ */ jsxs("svg", {
+	width: 15,
+	height: 15,
+	viewBox: "0 0 16 16",
+	fill: "currentColor",
+	"aria-hidden": "true",
+	children: [/* @__PURE__ */ jsx("rect", {
+		x: "3.5",
+		y: "2.5",
+		width: "3.2",
+		height: "11",
+		rx: "1"
+	}), /* @__PURE__ */ jsx("rect", {
+		x: "9.3",
+		y: "2.5",
+		width: "3.2",
+		height: "11",
+		rx: "1"
+	})]
+});
+const Chevron = ({ back }) => /* @__PURE__ */ jsx("svg", {
+	width: 18,
+	height: 18,
+	viewBox: "0 0 16 16",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: 1.75,
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	"aria-hidden": "true",
+	children: /* @__PURE__ */ jsx("path", { d: back ? "M10 3.5 5.5 8l4.5 4.5" : "M6 3.5 10.5 8 6 12.5" })
+});
+const Carousel = forwardRef(function Carousel({ label, children, index: controlledIndex, defaultIndex = 0, onIndexChange, slideSize, slideLabel = defaultSlideLabel, interval, autoplay = false, labels, className }, ref) {
+	const slides = Children.toArray(children);
+	const count = slides.length;
+	const last = Math.max(0, count - 1);
+	const id = useId();
+	const reduced = useReducedMotion();
+	const [ownIndex, setOwnIndex] = useState(() => clamp(defaultIndex, 0, last));
+	const index = clamp(controlledIndex ?? ownIndex, 0, last);
+	const [playing, setPlaying] = useState(autoplay);
+	const [hovered, setHovered] = useState(false);
+	const [touching, setTouching] = useState(false);
+	const [focusPaused, setFocusPaused] = useState(false);
+	const [inView, setInView] = useState(true);
+	const [pageVisible, setPageVisible] = useState(true);
+	const [announcement, setAnnouncement] = useState("");
+	const root = useRef(null);
+	const rootRef = useMemo(() => mergeRefs(ref, root), [ref]);
+	const viewport = useRef(null);
+	const track = useRef(null);
+	const play = useRef(null);
+	const tabs = useRef([]);
+	const target = useRef(index);
+	const travelling = useRef(null);
+	const backstop = useRef(void 0);
+	const drag = useRef(null);
+	const swallowClick = useRef(false);
+	const canRotate = Boolean(interval) && count > 1 && !reduced;
+	const running = canRotate && playing && !hovered && !touching && !focusPaused && inView && pageVisible;
+	const step = () => {
+		const [first, second] = Array.from(track.current?.children ?? []);
+		return first && second ? second.offsetLeft - first.offsetLeft : first?.offsetWidth ?? 0;
+	};
+	/** The scroll position that centres slide `i`. */
+	const leftOf = (i) => {
+		const node = track.current?.children[i];
+		const box = viewport.current;
+		return node && box ? node.offsetLeft - (box.clientWidth - node.offsetWidth) / 2 : 0;
+	};
+	/** Writes how far each slide and indicator is from the centre, straight from the scroll position. Returns the position in slides. */
+	const paint = useCallback(() => {
+		const box = viewport.current;
+		const size = step();
+		if (!box || !size) return target.current;
+		const position = box.scrollLeft / size;
+		Array.from(track.current?.children ?? []).forEach((slide, i) => {
+			slide.style.setProperty("--d", String(Math.min(1, Math.abs(position - i))));
+		});
+		tabs.current.forEach((tab, i) => {
+			const dot = tab?.firstElementChild;
+			if (dot instanceof HTMLElement) dot.style.setProperty("--e", String(Math.max(0, 1 - Math.abs(clamp(position, 0, last) - i))));
+		});
+		return position;
+	}, [last]);
+	function scrollToIndex(i, smooth) {
+		const box = viewport.current;
+		if (!box) return;
+		const left = leftOf(i);
+		if (!smooth || reduced || Math.abs(box.scrollLeft - left) < 1) {
+			travelling.current = null;
+			box.scrollTo({
+				left,
+				behavior: "auto"
+			});
+			paint();
+			return;
+		}
+		travelling.current = i;
+		clearTimeout(backstop.current);
+		backstop.current = setTimeout(() => travelling.current = null, 1e3);
+		box.scrollTo({
+			left,
+			behavior: "smooth"
+		});
+	}
+	function commit(next, announce) {
+		target.current = next;
+		if (controlledIndex === void 0) setOwnIndex(next);
+		onIndexChange?.(next);
+		if (announce) setAnnouncement(slideLabel(next, count));
+	}
+	function select(to, announce = true) {
+		const next = clamp(to, 0, last);
+		if (next !== target.current) commit(next, announce);
+		scrollToIndex(next, true);
+	}
+	useIsomorphicLayoutEffect(() => {
+		scrollToIndex(target.current, false);
+		const box = viewport.current;
+		if (!box || typeof ResizeObserver === "undefined") return;
+		const observer = new ResizeObserver(() => {
+			if (!drag.current && travelling.current === null) scrollToIndex(target.current, false);
+		});
+		observer.observe(box);
+		return () => observer.disconnect();
+	}, []);
+	useIsomorphicLayoutEffect(() => {
+		Array.from(track.current?.children ?? []).forEach((slide, i) => slide.toggleAttribute("inert", i !== index));
+	}, [index, count]);
+	useEffect(() => {
+		if (target.current !== index) {
+			target.current = index;
+			scrollToIndex(index, true);
+		}
+	}, [index]);
+	useEffect(() => () => clearTimeout(backstop.current), []);
+	function onScroll() {
+		const position = paint();
+		const box = viewport.current;
+		if (!box || drag.current?.locked) return;
+		if (travelling.current !== null) {
+			if (Math.abs(box.scrollLeft - leftOf(travelling.current)) < 2) travelling.current = null;
+			return;
+		}
+		const next = clamp(Math.round(position), 0, last);
+		if (next !== target.current) commit(next, true);
+	}
+	const advance = () => select(index >= last ? 0 : index + 1, false);
+	useEffect(() => {
+		const node = root.current;
+		if (!interval || !node) return;
+		const observer = typeof IntersectionObserver === "undefined" ? null : new IntersectionObserver(([entry]) => entry && setInView(entry.isIntersecting));
+		observer?.observe(node);
+		const onVisibility = () => setPageVisible(document.visibilityState !== "hidden");
+		document.addEventListener("visibilitychange", onVisibility);
+		return () => {
+			observer?.disconnect();
+			document.removeEventListener("visibilitychange", onVisibility);
+		};
+	}, [interval]);
+	function onPointerDown(event) {
+		if (count < 2 || drag.current || event.pointerType !== "mouse" || event.button !== 0) return;
+		swallowClick.current = false;
+		drag.current = {
+			pointer: event.pointerId,
+			startX: event.clientX,
+			startLeft: event.currentTarget.scrollLeft,
+			from: target.current,
+			locked: false,
+			samples: []
+		};
+	}
+	function onPointerMove(event) {
+		const current = drag.current;
+		if (!current || current.pointer !== event.pointerId) return;
+		const box = event.currentTarget;
+		if (!current.locked) {
+			if (Math.abs(event.clientX - current.startX) < SLOP) return;
+			current.locked = true;
+			current.startX = event.clientX;
+			travelling.current = null;
+			try {
+				box.setPointerCapture(event.pointerId);
+			} catch {}
+			box.dataset.dragging = "";
+		}
+		box.scrollLeft = current.startLeft - (event.clientX - current.startX);
+		current.samples.push([event.timeStamp, box.scrollLeft]);
+		if (current.samples.length > 16) current.samples.shift();
+	}
+	function finish(event, cancelled) {
+		const current = drag.current;
+		if (!current || current.pointer !== event.pointerId) return;
+		drag.current = null;
+		if (!current.locked) return;
+		const box = event.currentTarget;
+		delete box.dataset.dragging;
+		swallowClick.current = true;
+		const recent = current.samples.filter(([time]) => event.timeStamp - time <= 90);
+		const first = recent[0];
+		const lastSample = recent[recent.length - 1];
+		const velocity = !cancelled && first && lastSample && recent.length > 1 && event.timeStamp - lastSample[0] <= 50 && lastSample[0] > first[0] ? (lastSample[1] - first[1]) / (lastSample[0] - first[0]) * 1e3 : 0;
+		const size = step() || 1;
+		let to = Math.round((box.scrollLeft + project(velocity)) / size);
+		if (Math.abs(velocity) > FLICK) {
+			const direction = velocity > 0 ? 1 : -1;
+			if ((to - current.from) * direction < 1) to = current.from + direction;
+		}
+		select(to);
+	}
+	/** A tap on a neighbour brings it to the centre; a click that ends a drag is not a tap. */
+	function onClick(event) {
+		if (swallowClick.current) {
+			swallowClick.current = false;
+			event.preventDefault();
+			event.stopPropagation();
+			return;
+		}
+		const hit = Array.from(track.current?.children ?? []).findIndex((slide) => {
+			const rect = slide.getBoundingClientRect();
+			return event.clientX >= rect.left && event.clientX <= rect.right;
+		});
+		if (hit >= 0 && hit !== target.current) select(hit);
+	}
+	function onKeyDown(event) {
+		if (event.altKey || event.ctrlKey || event.metaKey || count < 2) return;
+		const node = event.target;
+		if (node.closest("input, textarea, select, [contenteditable]")) return;
+		const from = target.current;
+		const to = event.key === "ArrowLeft" ? from - 1 : event.key === "ArrowRight" ? from + 1 : event.key === "Home" ? 0 : event.key === "End" ? last : null;
+		if (to === null) return;
+		event.preventDefault();
+		const next = clamp(to, 0, last);
+		select(next);
+		if (node.getAttribute("role") === "tab") tabs.current[next]?.focus({ preventScroll: true });
+		else if (track.current?.contains(node)) viewport.current?.focus({ preventScroll: true });
+	}
+	const text = {
+		previous: "Previous slide",
+		next: "Next slide",
+		play: "Start slide rotation",
+		pause: "Pause slide rotation",
+		slides: "Choose a slide",
+		...labels
+	};
+	return /* @__PURE__ */ jsxs("section", {
+		ref: rootRef,
+		"data-slot": "carousel",
+		"aria-roledescription": "carousel",
+		"aria-label": label,
+		className: cn("carousel", className),
+		style: slideSize ? { "--carousel-slide-size": slideSize } : void 0,
+		onKeyDown,
+		onFocus: (event) => setFocusPaused(event.target !== play.current && event.target.matches(":focus-visible")),
+		onBlur: (event) => {
+			if (!event.currentTarget.contains(event.relatedTarget)) setFocusPaused(false);
+		},
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				ref: viewport,
+				role: "region",
+				"aria-label": "Slides",
+				tabIndex: 0,
+				"data-slot": "carousel-viewport",
+				className: "carousel-viewport",
+				onScroll,
+				onPointerDown,
+				onPointerMove,
+				onPointerUp: (event) => finish(event, false),
+				onPointerCancel: (event) => finish(event, true),
+				onPointerEnter: (event) => event.pointerType === "mouse" && setHovered(true),
+				onPointerLeave: () => setHovered(false),
+				onTouchStart: () => setTouching(true),
+				onTouchEnd: () => setTouching(false),
+				onTouchCancel: () => setTouching(false),
+				onClickCapture: onClick,
+				onDragStart: (event) => event.preventDefault(),
+				children: /* @__PURE__ */ jsx("div", {
+					ref: track,
+					className: "carousel-track",
+					children: slides.map((slide, i) => /* @__PURE__ */ jsx("div", {
+						id: `${id}-slide-${i}`,
+						role: "tabpanel",
+						"aria-roledescription": "slide",
+						"aria-label": slideLabel(i, count),
+						"data-active": i === index || void 0,
+						className: "carousel-slide",
+						children: slide
+					}, isValidElement(slide) && slide.key != null ? slide.key : i))
+				})
+			}),
+			count > 1 ? /* @__PURE__ */ jsxs("div", {
+				className: "carousel-controls",
+				children: [
+					canRotate ? /* @__PURE__ */ jsx("button", {
+						ref: play,
+						type: "button",
+						"aria-label": playing ? text.pause : text.play,
+						className: "carousel-control",
+						onClick: () => setPlaying(!playing),
+						children: playing ? /* @__PURE__ */ jsx(PauseGlyph, {}) : /* @__PURE__ */ jsx(PlayGlyph, {})
+					}) : null,
+					/* @__PURE__ */ jsx("div", {
+						role: "tablist",
+						"aria-label": text.slides,
+						className: "carousel-tabs",
+						children: slides.map((_, i) => /* @__PURE__ */ jsx("button", {
+							ref: (node) => {
+								tabs.current[i] = node;
+							},
+							type: "button",
+							role: "tab",
+							"aria-selected": i === index,
+							"aria-controls": `${id}-slide-${i}`,
+							"aria-label": slideLabel(i, count),
+							tabIndex: i === index ? 0 : -1,
+							className: "carousel-tab",
+							onClick: () => select(i),
+							children: /* @__PURE__ */ jsxs("span", {
+								"aria-hidden": "true",
+								className: "carousel-dot",
+								children: [/* @__PURE__ */ jsx("span", { className: "carousel-dot-fill" }), canRotate && playing && i === index ? /* @__PURE__ */ jsx("span", {
+									className: "carousel-drain",
+									style: {
+										animationDuration: `${interval}ms`,
+										animationPlayState: running ? "running" : "paused"
+									},
+									onAnimationEnd: advance
+								}, index) : null]
+							})
+						}, i))
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "carousel-arrows",
+						children: [/* @__PURE__ */ jsx("button", {
+							type: "button",
+							"aria-label": text.previous,
+							"aria-disabled": index === 0,
+							className: "carousel-control",
+							onClick: () => target.current > 0 && select(target.current - 1),
+							children: /* @__PURE__ */ jsx(Chevron, { back: true })
+						}), /* @__PURE__ */ jsx("button", {
+							type: "button",
+							"aria-label": text.next,
+							"aria-disabled": index === last,
+							className: "carousel-control",
+							onClick: () => target.current < last && select(target.current + 1),
+							children: /* @__PURE__ */ jsx(Chevron, {})
+						})]
+					})
+				]
+			}) : null,
+			/* @__PURE__ */ jsx("span", {
+				className: "sr-only",
+				"aria-live": "polite",
+				"aria-atomic": "true",
+				children: announcement
+			})
+		]
+	});
+});
+//#endregion
+export { Carousel };
+
+//# sourceMappingURL=carousel.js.map

package/dist/carousel/carousel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.js","names":[],"sources":["../../src/carousel/carousel.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  Children,\n  forwardRef,\n  isValidElement,\n  useCallback,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n  type CSSProperties,\n  type KeyboardEvent,\n  type MouseEvent,\n  type PointerEvent,\n  type ReactNode,\n} from \"react\";\n\nimport { cn } from \"../lib/cn.js\";\nimport { mergeRefs } from \"../lib/merge-refs.js\";\nimport { useIsomorphicLayoutEffect, useReducedMotion } from \"../lib/motion.js\";\n\n/**\n * Carousel: a row of slides people browse by swiping, a trackpad, dragging\n * with a mouse, the arrow keys, or the controls below it. Use it for a short,\n * ordered set of peers such as products or case studies, where the neighbours\n * stay in view as a hint that there is more.\n *\n * The slides sit on a native scroll-snap track, so touch and trackpad swipes\n * are the browser's own. The active slide is centred; its neighbours shrink and\n * dim with their distance, and each page indicator stretches into a pill as the\n * track nears its slide, all written straight from the scroll position without a\n * re-render. A mouse can drag the track, and a flick carries on to the next\n * slide. Arrow keys, Home and End move between slides from the track or the\n * indicators. `interval` adds a play control that rotates through the slides;\n * rotation pauses on hover, keyboard focus and touch, while the carousel is off\n * screen or the tab is hidden, and is unavailable under reduced motion (where\n * scrolling also jumps instead of gliding).\n */\nexport interface CarouselProps {\n  /** Names the carousel for assistive technology, such as \"From the Harbour suites\". */\n  label: string;\n  /** One child per slide. */\n  children: ReactNode;\n  /** Controlled active slide. Pair with `onIndexChange`. */\n  index?: number;\n  /** @default 0 */\n  defaultIndex?: number;\n  onIndexChange?: (index: number) => void;\n  /** Width of one slide as a CSS length; `cqw` is a share of the carousel's width. @default \"min(80cqw, 340px)\" */\n  slideSize?: string;\n  /** Names each slide and its indicator. @default (index, count) => `${index + 1} of ${count}` */\n  slideLabel?: (index: number, count: number) => string;\n  /** Milliseconds per slide. Adds a play control that rotates through the slides. */\n  interval?: number;\n  /** Starts rotating on mount. Off by default, so motion begins with the viewer. @default false */\n  autoplay?: boolean;\n  /** Names of the controls, for translation. */\n  labels?: {\n    /** @default \"Previous slide\" */\n    previous?: string;\n    /** @default \"Next slide\" */\n    next?: string;\n    /** @default \"Start slide rotation\" */\n    play?: string;\n    /** @default \"Pause slide rotation\" */\n    pause?: string;\n    /** Names the group of indicators. @default \"Choose a slide\" */\n    slides?: string;\n  };\n  /** Extra classes for the carousel. Merged last. */\n  className?: string;\n}\n\n/** Movement before a mouse press is read as a drag. */\nconst SLOP = 6;\n/** Release speed in px/s that always moves at least one slide. */\nconst FLICK = 360;\n/** Where a flick would come to rest: velocity (px/s) projected with a paging deceleration rate. */\nconst project = (velocity: number, rate = 0.995) => ((velocity / 1000) * rate) / (1 - rate);\nconst clamp = (value: number, min: number, max: number) => Math.min(max, Math.max(min, value));\nconst defaultSlideLabel = (index: number, count: number) => `${index + 1} of ${count}`;\n\nconst PlayGlyph = () => (\n  <svg width={15} height={15} viewBox=\"0 0 16 16\" fill=\"currentColor\" aria-hidden=\"true\">\n    <path d=\"M4.5 2.8v10.4a.6.6 0 0 0 .9.5l8.2-5.2a.6.6 0 0 0 0-1L5.4 2.3a.6.6 0 0 0-.9.5Z\" />\n  </svg>\n);\nconst PauseGlyph = () => (\n  <svg width={15} height={15} viewBox=\"0 0 16 16\" fill=\"currentColor\" aria-hidden=\"true\">\n    <rect x=\"3.5\" y=\"2.5\" width=\"3.2\" height=\"11\" rx=\"1\" />\n    <rect x=\"9.3\" y=\"2.5\" width=\"3.2\" height=\"11\" rx=\"1\" />\n  </svg>\n);\nconst Chevron = ({ back }: { back?: boolean }) => (\n  <svg width={18} height={18} viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" strokeWidth={1.75} strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n    <path d={back ? \"M10 3.5 5.5 8l4.5 4.5\" : \"M6 3.5 10.5 8 6 12.5\"} />\n  </svg>\n);\n\ntype Drag = { pointer: number; startX: number; startLeft: number; from: number; locked: boolean; samples: [number, number][] };\n\nexport const Carousel = forwardRef<HTMLElement, CarouselProps>(function Carousel(\n  {\n    label,\n    children,\n    index: controlledIndex,\n    defaultIndex = 0,\n    onIndexChange,\n    slideSize,\n    slideLabel = defaultSlideLabel,\n    interval,\n    autoplay = false,\n    labels,\n    className,\n  },\n  ref,\n) {\n  const slides = Children.toArray(children);\n  const count = slides.length;\n  const last = Math.max(0, count - 1);\n  const id = useId();\n  const reduced = useReducedMotion();\n  const [ownIndex, setOwnIndex] = useState(() => clamp(defaultIndex, 0, last));\n  const index = clamp(controlledIndex ?? ownIndex, 0, last);\n  const [playing, setPlaying] = useState(autoplay);\n  const [hovered, setHovered] = useState(false);\n  const [touching, setTouching] = useState(false);\n  const [focusPaused, setFocusPaused] = useState(false);\n  const [inView, setInView] = useState(true);\n  const [pageVisible, setPageVisible] = useState(true);\n  const [announcement, setAnnouncement] = useState(\"\");\n\n  const root = useRef<HTMLElement | null>(null);\n  const rootRef = useMemo(() => mergeRefs(ref, root), [ref]);\n  const viewport = useRef<HTMLDivElement>(null);\n  const track = useRef<HTMLDivElement>(null);\n  const play = useRef<HTMLButtonElement>(null);\n  const tabs = useRef<(HTMLButtonElement | null)[]>([]);\n  // The slide the carousel is on, as the component last decided it (state lags a render behind).\n  const target = useRef(index);\n  // Set while a scroll we started is in flight, so the in-between slides are not reported as the viewer's choice.\n  const travelling = useRef<number | null>(null);\n  const backstop = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n  const drag = useRef<Drag | null>(null);\n  const swallowClick = useRef(false);\n\n  const canRotate = Boolean(interval) && count > 1 && !reduced;\n  const running = canRotate && playing && !hovered && !touching && !focusPaused && inView && pageVisible;\n\n  const step = () => {\n    const [first, second] = Array.from(track.current?.children ?? []) as HTMLElement[];\n    return first && second ? second.offsetLeft - first.offsetLeft : (first?.offsetWidth ?? 0);\n  };\n  /** The scroll position that centres slide `i`. */\n  const leftOf = (i: number) => {\n    const node = track.current?.children[i] as HTMLElement | undefined;\n    const box = viewport.current;\n    return node && box ? node.offsetLeft - (box.clientWidth - node.offsetWidth) / 2 : 0;\n  };\n\n  /** Writes how far each slide and indicator is from the centre, straight from the scroll position. Returns the position in slides. */\n  const paint = useCallback(() => {\n    const box = viewport.current;\n    const size = step();\n    if (!box || !size) return target.current;\n    const position = box.scrollLeft / size;\n    Array.from(track.current?.children ?? []).forEach((slide, i) => {\n      (slide as HTMLElement).style.setProperty(\"--d\", String(Math.min(1, Math.abs(position - i))));\n    });\n    tabs.current.forEach((tab, i) => {\n      const dot = tab?.firstElementChild;\n      if (dot instanceof HTMLElement) dot.style.setProperty(\"--e\", String(Math.max(0, 1 - Math.abs(clamp(position, 0, last) - i))));\n    });\n    return position;\n  }, [last]);\n\n  function scrollToIndex(i: number, smooth: boolean) {\n    const box = viewport.current;\n    if (!box) return;\n    const left = leftOf(i);\n    if (!smooth || reduced || Math.abs(box.scrollLeft - left) < 1) {\n      travelling.current = null;\n      box.scrollTo({ left, behavior: \"auto\" });\n      paint();\n      return;\n    }\n    travelling.current = i;\n    clearTimeout(backstop.current);\n    // A scroll that never reports arriving (a resize mid-flight) must not hold the carousel deaf to the viewer's own swipes.\n    backstop.current = setTimeout(() => (travelling.current = null), 1000);\n    box.scrollTo({ left, behavior: \"smooth\" });\n  }\n\n  function commit(next: number, announce: boolean) {\n    target.current = next;\n    if (controlledIndex === undefined) setOwnIndex(next);\n    onIndexChange?.(next);\n    if (announce) setAnnouncement(slideLabel(next, count));\n  }\n\n  function select(to: number, announce = true) {\n    const next = clamp(to, 0, last);\n    if (next !== target.current) commit(next, announce);\n    scrollToIndex(next, true);\n  }\n\n  // The start slide is in place before first paint, so nothing glides on mount; later resizes keep the carousel on its slide.\n  useIsomorphicLayoutEffect(() => {\n    scrollToIndex(target.current, false);\n    const box = viewport.current;\n    if (!box || typeof ResizeObserver === \"undefined\") return;\n    const observer = new ResizeObserver(() => {\n      if (!drag.current && travelling.current === null) scrollToIndex(target.current, false);\n    });\n    observer.observe(box);\n    return () => observer.disconnect();\n  }, []);\n\n  // The viewer's own slides, inert unless active, are the only ones in the tab order or the accessibility tree's reach.\n  useIsomorphicLayoutEffect(() => {\n    Array.from(track.current?.children ?? []).forEach((slide, i) => slide.toggleAttribute(\"inert\", i !== index));\n  }, [index, count]);\n\n  // A controlled index that moves by itself brings the carousel along.\n  useEffect(() => {\n    if (target.current !== index) {\n      target.current = index;\n      scrollToIndex(index, true);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps -- only a changed index matters\n  }, [index]);\n\n  useEffect(() => () => clearTimeout(backstop.current), []);\n\n  function onScroll() {\n    const position = paint();\n    const box = viewport.current;\n    if (!box || drag.current?.locked) return;\n    if (travelling.current !== null) {\n      if (Math.abs(box.scrollLeft - leftOf(travelling.current)) < 2) travelling.current = null;\n      return;\n    }\n    const next = clamp(Math.round(position), 0, last);\n    if (next !== target.current) commit(next, true);\n  }\n\n  const advance = () => select(index >= last ? 0 : index + 1, false);\n\n  useEffect(() => {\n    const node = root.current;\n    if (!interval || !node) return;\n    const observer = typeof IntersectionObserver === \"undefined\" ? null : new IntersectionObserver(([entry]) => entry && setInView(entry.isIntersecting));\n    observer?.observe(node);\n    const onVisibility = () => setPageVisible(document.visibilityState !== \"hidden\");\n    document.addEventListener(\"visibilitychange\", onVisibility);\n    return () => {\n      observer?.disconnect();\n      document.removeEventListener(\"visibilitychange\", onVisibility);\n    };\n  }, [interval]);\n\n  function onPointerDown(event: PointerEvent<HTMLDivElement>) {\n    if (count < 2 || drag.current || event.pointerType !== \"mouse\" || event.button !== 0) return;\n    swallowClick.current = false;\n    drag.current = { pointer: event.pointerId, startX: event.clientX, startLeft: event.currentTarget.scrollLeft, from: target.current, locked: false, samples: [] };\n  }\n\n  function onPointerMove(event: PointerEvent<HTMLDivElement>) {\n    const current = drag.current;\n    if (!current || current.pointer !== event.pointerId) return;\n    const box = event.currentTarget;\n    if (!current.locked) {\n      if (Math.abs(event.clientX - current.startX) < SLOP) return;\n      // The slop is consumed, so the track starts moving from the pointer without a jump. Snapping is off while it is held.\n      current.locked = true;\n      current.startX = event.clientX;\n      travelling.current = null;\n      try {\n        box.setPointerCapture(event.pointerId);\n      } catch {\n        // The pointer already ended; the drag simply stops following it.\n      }\n      box.dataset.dragging = \"\";\n    }\n    box.scrollLeft = current.startLeft - (event.clientX - current.startX);\n    current.samples.push([event.timeStamp, box.scrollLeft]);\n    if (current.samples.length > 16) current.samples.shift();\n  }\n\n  function finish(event: PointerEvent<HTMLDivElement>, cancelled: boolean) {\n    const current = drag.current;\n    if (!current || current.pointer !== event.pointerId) return;\n    drag.current = null;\n    if (!current.locked) return;\n    const box = event.currentTarget;\n    delete box.dataset.dragging;\n    swallowClick.current = true;\n    const recent = current.samples.filter(([time]) => event.timeStamp - time <= 90);\n    const first = recent[0];\n    const lastSample = recent[recent.length - 1];\n    const velocity =\n      !cancelled && first && lastSample && recent.length > 1 && event.timeStamp - lastSample[0] <= 50 && lastSample[0] > first[0]\n        ? ((lastSample[1] - first[1]) / (lastSample[0] - first[0])) * 1000\n        : 0;\n    const size = step() || 1;\n    // The landing slide comes from where the flick would carry the track, not from where the pointer let go.\n    let to = Math.round((box.scrollLeft + project(velocity)) / size);\n    if (Math.abs(velocity) > FLICK) {\n      const direction = velocity > 0 ? 1 : -1;\n      if ((to - current.from) * direction < 1) to = current.from + direction;\n    }\n    select(to);\n  }\n\n  /** A tap on a neighbour brings it to the centre; a click that ends a drag is not a tap. */\n  function onClick(event: MouseEvent<HTMLDivElement>) {\n    if (swallowClick.current) {\n      swallowClick.current = false;\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n    const hit = Array.from(track.current?.children ?? []).findIndex((slide) => {\n      const rect = slide.getBoundingClientRect();\n      return event.clientX >= rect.left && event.clientX <= rect.right;\n    });\n    if (hit >= 0 && hit !== target.current) select(hit);\n  }\n\n  function onKeyDown(event: KeyboardEvent<HTMLElement>) {\n    if (event.altKey || event.ctrlKey || event.metaKey || count < 2) return;\n    const node = event.target as HTMLElement;\n    if (node.closest(\"input, textarea, select, [contenteditable]\")) return;\n    const from = target.current;\n    const to =\n      event.key === \"ArrowLeft\" ? from - 1 : event.key === \"ArrowRight\" ? from + 1 : event.key === \"Home\" ? 0 : event.key === \"End\" ? last : null;\n    if (to === null) return;\n    event.preventDefault();\n    const next = clamp(to, 0, last);\n    select(next);\n    if (node.getAttribute(\"role\") === \"tab\") tabs.current[next]?.focus({ preventScroll: true });\n    else if (track.current?.contains(node)) viewport.current?.focus({ preventScroll: true });\n  }\n\n  const text = { previous: \"Previous slide\", next: \"Next slide\", play: \"Start slide rotation\", pause: \"Pause slide rotation\", slides: \"Choose a slide\", ...labels };\n\n  return (\n    <section\n      ref={rootRef}\n      data-slot=\"carousel\"\n      aria-roledescription=\"carousel\"\n      aria-label={label}\n      className={cn(\"carousel\", className)}\n      style={slideSize ? ({ \"--carousel-slide-size\": slideSize } as CSSProperties) : undefined}\n      onKeyDown={onKeyDown}\n      onFocus={(event) => setFocusPaused(event.target !== play.current && event.target.matches(\":focus-visible\"))}\n      onBlur={(event) => {\n        if (!event.currentTarget.contains(event.relatedTarget)) setFocusPaused(false);\n      }}\n    >\n      <div\n        ref={viewport}\n        role=\"region\"\n        aria-label=\"Slides\"\n        tabIndex={0}\n        data-slot=\"carousel-viewport\"\n        className=\"carousel-viewport\"\n        onScroll={onScroll}\n        onPointerDown={onPointerDown}\n        onPointerMove={onPointerMove}\n        onPointerUp={(event) => finish(event, false)}\n        onPointerCancel={(event) => finish(event, true)}\n        onPointerEnter={(event) => event.pointerType === \"mouse\" && setHovered(true)}\n        onPointerLeave={() => setHovered(false)}\n        onTouchStart={() => setTouching(true)}\n        onTouchEnd={() => setTouching(false)}\n        onTouchCancel={() => setTouching(false)}\n        onClickCapture={onClick}\n        onDragStart={(event) => event.preventDefault()}\n      >\n        <div ref={track} className=\"carousel-track\">\n          {slides.map((slide, i) => (\n            <div\n              key={isValidElement(slide) && slide.key != null ? slide.key : i}\n              id={`${id}-slide-${i}`}\n              role=\"tabpanel\"\n              aria-roledescription=\"slide\"\n              aria-label={slideLabel(i, count)}\n              data-active={i === index || undefined}\n              className=\"carousel-slide\"\n            >\n              {slide}\n            </div>\n          ))}\n        </div>\n      </div>\n      {count > 1 ? (\n        <div className=\"carousel-controls\">\n          {canRotate ? (\n            <button\n              ref={play}\n              type=\"button\"\n              aria-label={playing ? text.pause : text.play}\n              className=\"carousel-control\"\n              onClick={() => setPlaying(!playing)}\n            >\n              {playing ? <PauseGlyph /> : <PlayGlyph />}\n            </button>\n          ) : null}\n          <div role=\"tablist\" aria-label={text.slides} className=\"carousel-tabs\">\n            {slides.map((_, i) => (\n              <button\n                key={i}\n                ref={(node) => {\n                  tabs.current[i] = node;\n                }}\n                type=\"button\"\n                role=\"tab\"\n                aria-selected={i === index}\n                aria-controls={`${id}-slide-${i}`}\n                aria-label={slideLabel(i, count)}\n                tabIndex={i === index ? 0 : -1}\n                className=\"carousel-tab\"\n                onClick={() => select(i)}\n              >\n                <span aria-hidden=\"true\" className=\"carousel-dot\">\n                  <span className=\"carousel-dot-fill\" />\n                  {canRotate && playing && i === index ? (\n                    <span\n                      key={index}\n                      className=\"carousel-drain\"\n                      style={{ animationDuration: `${interval}ms`, animationPlayState: running ? \"running\" : \"paused\" }}\n                      onAnimationEnd={advance}\n                    />\n                  ) : null}\n                </span>\n              </button>\n            ))}\n          </div>\n          <div className=\"carousel-arrows\">\n            <button\n              type=\"button\"\n              aria-label={text.previous}\n              aria-disabled={index === 0}\n              className=\"carousel-control\"\n              onClick={() => target.current > 0 && select(target.current - 1)}\n            >\n              <Chevron back />\n            </button>\n            <button\n              type=\"button\"\n              aria-label={text.next}\n              aria-disabled={index === last}\n              className=\"carousel-control\"\n              onClick={() => target.current < last && select(target.current + 1)}\n            >\n              <Chevron />\n            </button>\n          </div>\n        </div>\n      ) : null}\n      <span className=\"sr-only\" aria-live=\"polite\" aria-atomic=\"true\">\n        {announcement}\n      </span>\n    </section>\n  );\n});\n"],"mappings":";;;;;;;;AA4EA,MAAM,OAAO;;AAEb,MAAM,QAAQ;;AAEd,MAAM,WAAW,UAAkB,OAAO,SAAY,WAAW,MAAQ,QAAS,IAAI;AACtF,MAAM,SAAS,OAAe,KAAa,QAAgB,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK,KAAK,CAAC;AAC7F,MAAM,qBAAqB,OAAe,UAAkB,GAAG,QAAQ,EAAE,MAAM;AAE/E,MAAM,kBACJ,oBAAC,OAAD;CAAK,OAAO;CAAI,QAAQ;CAAI,SAAQ;CAAY,MAAK;CAAe,eAAY;CAC9E,UAAA,oBAAC,QAAD,EAAM,GAAE,gFAAiF,CAAA;AACtF,CAAA;AAEP,MAAM,mBACJ,qBAAC,OAAD;CAAK,OAAO;CAAI,QAAQ;CAAI,SAAQ;CAAY,MAAK;CAAe,eAAY;CAAhF,UAAA,CACE,oBAAC,QAAD;EAAM,GAAE;EAAM,GAAE;EAAM,OAAM;EAAM,QAAO;EAAK,IAAG;CAAK,CAAA,GACtD,oBAAC,QAAD;EAAM,GAAE;EAAM,GAAE;EAAM,OAAM;EAAM,QAAO;EAAK,IAAG;CAAK,CAAA,CACnD;;AAEP,MAAM,WAAW,EAAE,WACjB,oBAAC,OAAD;CAAK,OAAO;CAAI,QAAQ;CAAI,SAAQ;CAAY,MAAK;CAAO,QAAO;CAAe,aAAa;CAAM,eAAc;CAAQ,gBAAe;CAAQ,eAAY;CAC5J,UAAA,oBAAC,QAAD,EAAM,GAAG,OAAO,0BAA0B,uBAAyB,CAAA;AAChE,CAAA;AAKP,MAAa,WAAW,WAAuC,SAAS,SACtE,EACE,OACA,UACA,OAAO,iBACP,eAAe,GACf,eACA,WACA,aAAa,mBACb,UACA,WAAW,OACX,QACA,aAEF,KACA;CACA,MAAM,SAAS,SAAS,QAAQ,QAAQ;CACxC,MAAM,QAAQ,OAAO;CACrB,MAAM,OAAO,KAAK,IAAI,GAAG,QAAQ,CAAC;CAClC,MAAM,KAAK,MAAM;CACjB,MAAM,UAAU,iBAAiB;CACjC,MAAM,CAAC,UAAU,eAAe,eAAe,MAAM,cAAc,GAAG,IAAI,CAAC;CAC3E,MAAM,QAAQ,MAAM,mBAAmB,UAAU,GAAG,IAAI;CACxD,MAAM,CAAC,SAAS,cAAc,SAAS,QAAQ;CAC/C,MAAM,CAAC,SAAS,cAAc,SAAS,KAAK;CAC5C,MAAM,CAAC,UAAU,eAAe,SAAS,KAAK;CAC9C,MAAM,CAAC,aAAa,kBAAkB,SAAS,KAAK;CACpD,MAAM,CAAC,QAAQ,aAAa,SAAS,IAAI;CACzC,MAAM,CAAC,aAAa,kBAAkB,SAAS,IAAI;CACnD,MAAM,CAAC,cAAc,mBAAmB,SAAS,EAAE;CAEnD,MAAM,OAAO,OAA2B,IAAI;CAC5C,MAAM,UAAU,cAAc,UAAU,KAAK,IAAI,GAAG,CAAC,GAAG,CAAC;CACzD,MAAM,WAAW,OAAuB,IAAI;CAC5C,MAAM,QAAQ,OAAuB,IAAI;CACzC,MAAM,OAAO,OAA0B,IAAI;CAC3C,MAAM,OAAO,OAAqC,CAAC,CAAC;CAEpD,MAAM,SAAS,OAAO,KAAK;CAE3B,MAAM,aAAa,OAAsB,IAAI;CAC7C,MAAM,WAAW,OAAkD,KAAA,CAAS;CAC5E,MAAM,OAAO,OAAoB,IAAI;CACrC,MAAM,eAAe,OAAO,KAAK;CAEjC,MAAM,YAAY,QAAQ,QAAQ,KAAK,QAAQ,KAAK,CAAC;CACrD,MAAM,UAAU,aAAa,WAAW,CAAC,WAAW,CAAC,YAAY,CAAC,eAAe,UAAU;CAE3F,MAAM,aAAa;EACjB,MAAM,CAAC,OAAO,UAAU,MAAM,KAAK,MAAM,SAAS,YAAY,CAAC,CAAC;EAChE,OAAO,SAAS,SAAS,OAAO,aAAa,MAAM,aAAc,OAAO,eAAe;CACzF;;CAEA,MAAM,UAAU,MAAc;EAC5B,MAAM,OAAO,MAAM,SAAS,SAAS;EACrC,MAAM,MAAM,SAAS;EACrB,OAAO,QAAQ,MAAM,KAAK,cAAc,IAAI,cAAc,KAAK,eAAe,IAAI;CACpF;;CAGA,MAAM,QAAQ,kBAAkB;EAC9B,MAAM,MAAM,SAAS;EACrB,MAAM,OAAO,KAAK;EAClB,IAAI,CAAC,OAAO,CAAC,MAAM,OAAO,OAAO;EACjC,MAAM,WAAW,IAAI,aAAa;EAClC,MAAM,KAAK,MAAM,SAAS,YAAY,CAAC,CAAC,CAAC,CAAC,SAAS,OAAO,MAAM;GAC9D,MAAuB,MAAM,YAAY,OAAO,OAAO,KAAK,IAAI,GAAG,KAAK,IAAI,WAAW,CAAC,CAAC,CAAC,CAAC;EAC7F,CAAC;EACD,KAAK,QAAQ,SAAS,KAAK,MAAM;GAC/B,MAAM,MAAM,KAAK;GACjB,IAAI,eAAe,aAAa,IAAI,MAAM,YAAY,OAAO,OAAO,KAAK,IAAI,GAAG,IAAI,KAAK,IAAI,MAAM,UAAU,GAAG,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC;EAC9H,CAAC;EACD,OAAO;CACT,GAAG,CAAC,IAAI,CAAC;CAET,SAAS,cAAc,GAAW,QAAiB;EACjD,MAAM,MAAM,SAAS;EACrB,IAAI,CAAC,KAAK;EACV,MAAM,OAAO,OAAO,CAAC;EACrB,IAAI,CAAC,UAAU,WAAW,KAAK,IAAI,IAAI,aAAa,IAAI,IAAI,GAAG;GAC7D,WAAW,UAAU;GACrB,IAAI,SAAS;IAAE;IAAM,UAAU;GAAO,CAAC;GACvC,MAAM;GACN;EACF;EACA,WAAW,UAAU;EACrB,aAAa,SAAS,OAAO;EAE7B,SAAS,UAAU,iBAAkB,WAAW,UAAU,MAAO,GAAI;EACrE,IAAI,SAAS;GAAE;GAAM,UAAU;EAAS,CAAC;CAC3C;CAEA,SAAS,OAAO,MAAc,UAAmB;EAC/C,OAAO,UAAU;EACjB,IAAI,oBAAoB,KAAA,GAAW,YAAY,IAAI;EACnD,gBAAgB,IAAI;EACpB,IAAI,UAAU,gBAAgB,WAAW,MAAM,KAAK,CAAC;CACvD;CAEA,SAAS,OAAO,IAAY,WAAW,MAAM;EAC3C,MAAM,OAAO,MAAM,IAAI,GAAG,IAAI;EAC9B,IAAI,SAAS,OAAO,SAAS,OAAO,MAAM,QAAQ;EAClD,cAAc,MAAM,IAAI;CAC1B;CAGA,gCAAgC;EAC9B,cAAc,OAAO,SAAS,KAAK;EACnC,MAAM,MAAM,SAAS;EACrB,IAAI,CAAC,OAAO,OAAO,mBAAmB,aAAa;EACnD,MAAM,WAAW,IAAI,qBAAqB;GACxC,IAAI,CAAC,KAAK,WAAW,WAAW,YAAY,MAAM,cAAc,OAAO,SAAS,KAAK;EACvF,CAAC;EACD,SAAS,QAAQ,GAAG;EACpB,aAAa,SAAS,WAAW;CACnC,GAAG,CAAC,CAAC;CAGL,gCAAgC;EAC9B,MAAM,KAAK,MAAM,SAAS,YAAY,CAAC,CAAC,CAAC,CAAC,SAAS,OAAO,MAAM,MAAM,gBAAgB,SAAS,MAAM,KAAK,CAAC;CAC7G,GAAG,CAAC,OAAO,KAAK,CAAC;CAGjB,gBAAgB;EACd,IAAI,OAAO,YAAY,OAAO;GAC5B,OAAO,UAAU;GACjB,cAAc,OAAO,IAAI;EAC3B;CAEF,GAAG,CAAC,KAAK,CAAC;CAEV,sBAAsB,aAAa,SAAS,OAAO,GAAG,CAAC,CAAC;CAExD,SAAS,WAAW;EAClB,MAAM,WAAW,MAAM;EACvB,MAAM,MAAM,SAAS;EACrB,IAAI,CAAC,OAAO,KAAK,SAAS,QAAQ;EAClC,IAAI,WAAW,YAAY,MAAM;GAC/B,IAAI,KAAK,IAAI,IAAI,aAAa,OAAO,WAAW,OAAO,CAAC,IAAI,GAAG,WAAW,UAAU;GACpF;EACF;EACA,MAAM,OAAO,MAAM,KAAK,MAAM,QAAQ,GAAG,GAAG,IAAI;EAChD,IAAI,SAAS,OAAO,SAAS,OAAO,MAAM,IAAI;CAChD;CAEA,MAAM,gBAAgB,OAAO,SAAS,OAAO,IAAI,QAAQ,GAAG,KAAK;CAEjE,gBAAgB;EACd,MAAM,OAAO,KAAK;EAClB,IAAI,CAAC,YAAY,CAAC,MAAM;EACxB,MAAM,WAAW,OAAO,yBAAyB,cAAc,OAAO,IAAI,sBAAsB,CAAC,WAAW,SAAS,UAAU,MAAM,cAAc,CAAC;EACpJ,UAAU,QAAQ,IAAI;EACtB,MAAM,qBAAqB,eAAe,SAAS,oBAAoB,QAAQ;EAC/E,SAAS,iBAAiB,oBAAoB,YAAY;EAC1D,aAAa;GACX,UAAU,WAAW;GACrB,SAAS,oBAAoB,oBAAoB,YAAY;EAC/D;CACF,GAAG,CAAC,QAAQ,CAAC;CAEb,SAAS,cAAc,OAAqC;EAC1D,IAAI,QAAQ,KAAK,KAAK,WAAW,MAAM,gBAAgB,WAAW,MAAM,WAAW,GAAG;EACtF,aAAa,UAAU;EACvB,KAAK,UAAU;GAAE,SAAS,MAAM;GAAW,QAAQ,MAAM;GAAS,WAAW,MAAM,cAAc;GAAY,MAAM,OAAO;GAAS,QAAQ;GAAO,SAAS,CAAC;EAAE;CAChK;CAEA,SAAS,cAAc,OAAqC;EAC1D,MAAM,UAAU,KAAK;EACrB,IAAI,CAAC,WAAW,QAAQ,YAAY,MAAM,WAAW;EACrD,MAAM,MAAM,MAAM;EAClB,IAAI,CAAC,QAAQ,QAAQ;GACnB,IAAI,KAAK,IAAI,MAAM,UAAU,QAAQ,MAAM,IAAI,MAAM;GAErD,QAAQ,SAAS;GACjB,QAAQ,SAAS,MAAM;GACvB,WAAW,UAAU;GACrB,IAAI;IACF,IAAI,kBAAkB,MAAM,SAAS;GACvC,QAAQ,CAER;GACA,IAAI,QAAQ,WAAW;EACzB;EACA,IAAI,aAAa,QAAQ,aAAa,MAAM,UAAU,QAAQ;EAC9D,QAAQ,QAAQ,KAAK,CAAC,MAAM,WAAW,IAAI,UAAU,CAAC;EACtD,IAAI,QAAQ,QAAQ,SAAS,IAAI,QAAQ,QAAQ,MAAM;CACzD;CAEA,SAAS,OAAO,OAAqC,WAAoB;EACvE,MAAM,UAAU,KAAK;EACrB,IAAI,CAAC,WAAW,QAAQ,YAAY,MAAM,WAAW;EACrD,KAAK,UAAU;EACf,IAAI,CAAC,QAAQ,QAAQ;EACrB,MAAM,MAAM,MAAM;EAClB,OAAO,IAAI,QAAQ;EACnB,aAAa,UAAU;EACvB,MAAM,SAAS,QAAQ,QAAQ,QAAQ,CAAC,UAAU,MAAM,YAAY,QAAQ,EAAE;EAC9E,MAAM,QAAQ,OAAO;EACrB,MAAM,aAAa,OAAO,OAAO,SAAS;EAC1C,MAAM,WACJ,CAAC,aAAa,SAAS,cAAc,OAAO,SAAS,KAAK,MAAM,YAAY,WAAW,MAAM,MAAM,WAAW,KAAK,MAAM,MACnH,WAAW,KAAK,MAAM,OAAO,WAAW,KAAK,MAAM,MAAO,MAC5D;EACN,MAAM,OAAO,KAAK,KAAK;EAEvB,IAAI,KAAK,KAAK,OAAO,IAAI,aAAa,QAAQ,QAAQ,KAAK,IAAI;EAC/D,IAAI,KAAK,IAAI,QAAQ,IAAI,OAAO;GAC9B,MAAM,YAAY,WAAW,IAAI,IAAI;GACrC,KAAK,KAAK,QAAQ,QAAQ,YAAY,GAAG,KAAK,QAAQ,OAAO;EAC/D;EACA,OAAO,EAAE;CACX;;CAGA,SAAS,QAAQ,OAAmC;EAClD,IAAI,aAAa,SAAS;GACxB,aAAa,UAAU;GACvB,MAAM,eAAe;GACrB,MAAM,gBAAgB;GACtB;EACF;EACA,MAAM,MAAM,MAAM,KAAK,MAAM,SAAS,YAAY,CAAC,CAAC,CAAC,CAAC,WAAW,UAAU;GACzE,MAAM,OAAO,MAAM,sBAAsB;GACzC,OAAO,MAAM,WAAW,KAAK,QAAQ,MAAM,WAAW,KAAK;EAC7D,CAAC;EACD,IAAI,OAAO,KAAK,QAAQ,OAAO,SAAS,OAAO,GAAG;CACpD;CAEA,SAAS,UAAU,OAAmC;EACpD,IAAI,MAAM,UAAU,MAAM,WAAW,MAAM,WAAW,QAAQ,GAAG;EACjE,MAAM,OAAO,MAAM;EACnB,IAAI,KAAK,QAAQ,4CAA4C,GAAG;EAChE,MAAM,OAAO,OAAO;EACpB,MAAM,KACJ,MAAM,QAAQ,cAAc,OAAO,IAAI,MAAM,QAAQ,eAAe,OAAO,IAAI,MAAM,QAAQ,SAAS,IAAI,MAAM,QAAQ,QAAQ,OAAO;EACzI,IAAI,OAAO,MAAM;EACjB,MAAM,eAAe;EACrB,MAAM,OAAO,MAAM,IAAI,GAAG,IAAI;EAC9B,OAAO,IAAI;EACX,IAAI,KAAK,aAAa,MAAM,MAAM,OAAO,KAAK,QAAQ,KAAK,EAAE,MAAM,EAAE,eAAe,KAAK,CAAC;OACrF,IAAI,MAAM,SAAS,SAAS,IAAI,GAAG,SAAS,SAAS,MAAM,EAAE,eAAe,KAAK,CAAC;CACzF;CAEA,MAAM,OAAO;EAAE,UAAU;EAAkB,MAAM;EAAc,MAAM;EAAwB,OAAO;EAAwB,QAAQ;EAAkB,GAAG;CAAO;CAEhK,OACE,qBAAC,WAAD;EACE,KAAK;EACL,aAAU;EACV,wBAAqB;EACrB,cAAY;EACZ,WAAW,GAAG,YAAY,SAAS;EACnC,OAAO,YAAa,EAAE,yBAAyB,UAAU,IAAsB,KAAA;EACpE;EACX,UAAU,UAAU,eAAe,MAAM,WAAW,KAAK,WAAW,MAAM,OAAO,QAAQ,gBAAgB,CAAC;EAC1G,SAAS,UAAU;GACjB,IAAI,CAAC,MAAM,cAAc,SAAS,MAAM,aAAa,GAAG,eAAe,KAAK;EAC9E;EAXF,UAAA;GAaE,oBAAC,OAAD;IACE,KAAK;IACL,MAAK;IACL,cAAW;IACX,UAAU;IACV,aAAU;IACV,WAAU;IACA;IACK;IACA;IACf,cAAc,UAAU,OAAO,OAAO,KAAK;IAC3C,kBAAkB,UAAU,OAAO,OAAO,IAAI;IAC9C,iBAAiB,UAAU,MAAM,gBAAgB,WAAW,WAAW,IAAI;IAC3E,sBAAsB,WAAW,KAAK;IACtC,oBAAoB,YAAY,IAAI;IACpC,kBAAkB,YAAY,KAAK;IACnC,qBAAqB,YAAY,KAAK;IACtC,gBAAgB;IAChB,cAAc,UAAU,MAAM,eAAe;IAE7C,UAAA,oBAAC,OAAD;KAAK,KAAK;KAAO,WAAU;KACxB,UAAA,OAAO,KAAK,OAAO,MAClB,oBAAC,OAAD;MAEE,IAAI,GAAG,GAAG,SAAS;MACnB,MAAK;MACL,wBAAqB;MACrB,cAAY,WAAW,GAAG,KAAK;MAC/B,eAAa,MAAM,SAAS,KAAA;MAC5B,WAAU;MAET,UAAA;KACE,GATE,eAAe,KAAK,KAAK,MAAM,OAAO,OAAO,MAAM,MAAM,CAS3D,CACN;IACE,CAAA;GACF,CAAA;GACJ,QAAQ,IACP,qBAAC,OAAD;IAAK,WAAU;IAAf,UAAA;KACG,YACC,oBAAC,UAAD;MACE,KAAK;MACL,MAAK;MACL,cAAY,UAAU,KAAK,QAAQ,KAAK;MACxC,WAAU;MACV,eAAe,WAAW,CAAC,OAAO;MAEjC,UAAA,UAAU,oBAAC,YAAD,CAAa,CAAA,IAAI,oBAAC,WAAD,CAAY,CAAA;KAClC,CAAA,IACN;KACJ,oBAAC,OAAD;MAAK,MAAK;MAAU,cAAY,KAAK;MAAQ,WAAU;MACpD,UAAA,OAAO,KAAK,GAAG,MACd,oBAAC,UAAD;OAEE,MAAM,SAAS;QACb,KAAK,QAAQ,KAAK;OACpB;OACA,MAAK;OACL,MAAK;OACL,iBAAe,MAAM;OACrB,iBAAe,GAAG,GAAG,SAAS;OAC9B,cAAY,WAAW,GAAG,KAAK;OAC/B,UAAU,MAAM,QAAQ,IAAI;OAC5B,WAAU;OACV,eAAe,OAAO,CAAC;OAEvB,UAAA,qBAAC,QAAD;QAAM,eAAY;QAAO,WAAU;QAAnC,UAAA,CACE,oBAAC,QAAD,EAAM,WAAU,oBAAqB,CAAA,GACpC,aAAa,WAAW,MAAM,QAC7B,oBAAC,QAAD;SAEE,WAAU;SACV,OAAO;UAAE,mBAAmB,GAAG,SAAS;UAAK,oBAAoB,UAAU,YAAY;SAAS;SAChG,gBAAgB;QACjB,GAJM,KAIN,IACC,IACA;;MACA,GAxBD,CAwBC,CACT;KACE,CAAA;KACL,qBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACE,oBAAC,UAAD;OACE,MAAK;OACL,cAAY,KAAK;OACjB,iBAAe,UAAU;OACzB,WAAU;OACV,eAAe,OAAO,UAAU,KAAK,OAAO,OAAO,UAAU,CAAC;OAE9D,UAAA,oBAAC,SAAD,EAAS,MAAA,KAAM,CAAA;MACT,CAAA,GACR,oBAAC,UAAD;OACE,MAAK;OACL,cAAY,KAAK;OACjB,iBAAe,UAAU;OACzB,WAAU;OACV,eAAe,OAAO,UAAU,QAAQ,OAAO,OAAO,UAAU,CAAC;OAEjE,UAAA,oBAAC,SAAD,CAAU,CAAA;MACJ,CAAA,CACL;;IACF;GACH,CAAA,IAAA;GACJ,oBAAC,QAAD;IAAM,WAAU;IAAU,aAAU;IAAS,eAAY;IACtD,UAAA;GACG,CAAA;EACC;;AAEb,CAAC"}

package/dist/carousel/index.d.ts

@@ -0,0 +1,2 @@
+import { Carousel, CarouselProps } from "./carousel.js";
+export { Carousel, type CarouselProps };

package/dist/carousel/index.js

@@ -0,0 +1,2 @@
+import { Carousel } from "./carousel.js";
+export { Carousel };

package/dist/checkbox/checkbox.d.ts

@@ -38,13 +38,6 @@ import { CheckboxProps } from "react-aria-components";
  */
 export declare const checkboxVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 export declare const checkboxBoxVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
-/**
- * A checkbox.
- *
- * @example
- * <Checkbox defaultSelected>Email me about new courses</Checkbox>
- * <Checkbox aria-label="Select row" />
- */
 interface CheckboxProps$1 extends Omit<CheckboxProps, "className" | "style" | "children"> {
   /**
    * The label, and the control's accessible name.