@epilot/zenith-react 0.2.0-next.4 → 0.2.0-next.6

package/dist/components/popover/popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover.js","sources":["../../../src/components/popover/popover.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { createPortal } from \"react-dom\"\n\nimport { Popover as PopoverPrimitive } from \"@base-ui/react/popover\"\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { useAppearanceAttributes } from \"../appearance-boundary/appearance-boundary\"\nimport { useDensity } from \"../density-provider/density-provider\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel, nativeControl } from \"../../styles/host-reset\"\nimport { OVERLAY_Z_INDEX } from \"../../styles/overlay-layer\"\nimport * as tokens from \"../../tokens\"\n\nconst easeOut = \"cubic-bezier(0.4, 0, 0.2, 1)\"\nconst easeIn = \"cubic-bezier(0.4, 0, 1, 1)\"\n\nconst useStyles = makeZenithStyles({\n  // For the bare native `<button>` a Trigger/Close renders. Not applied under `asChild`, where the\n  // child owns its own element and two atom sets would race for the same properties.\n  nativeTrigger: {\n    ...nativeControl,\n  },\n  // The positioner is what stacks against other layers, as Radix's popper wrapper did; it also\n  // keeps that wrapper's `max-content` floor so the content wraps the same way.\n  positioner: {\n    zIndex: OVERLAY_Z_INDEX,\n    minWidth: \"max-content\",\n  },\n  hideWhenDetached: {\n    \"&[data-anchor-hidden]\": {\n      visibility: \"hidden\",\n      pointerEvents: \"none\",\n    },\n  },\n  popup: {\n    ...boxModel,\n    backgroundColor: tokens.body,\n    color: tokens.grayA12,\n    transformOrigin: \"var(--transform-origin)\",\n    ...shorthands.borderRadius(tokens.radiusXl),\n    ...shorthands.border(\"1px\", \"solid\", tokens.grayA1),\n    // v1 shadow-md\n    boxShadow: \"0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a\",\n    outlineStyle: \"none\",\n    zIndex: OVERLAY_Z_INDEX,\n    transitionProperty: \"opacity, transform\",\n    transitionDuration: \"150ms\",\n    transitionTimingFunction: easeOut,\n    \"&[data-starting-style]\": {\n      opacity: 0,\n      transform: \"scale(0.95)\",\n    },\n    \"&[data-starting-style][data-side='bottom']\": {\n      transform: `translateY(-${tokens.spacingElement2}) scale(0.95)`,\n    },\n    \"&[data-starting-style][data-side='left']\": {\n      transform: `translateX(${tokens.spacingElement2}) scale(0.95)`,\n    },\n    \"&[data-starting-style][data-side='right']\": {\n      transform: `translateX(-${tokens.spacingElement2}) scale(0.95)`,\n    },\n    \"&[data-starting-style][data-side='top']\": {\n      transform: `translateY(${tokens.spacingElement2}) scale(0.95)`,\n    },\n    \"&[data-ending-style]\": {\n      opacity: 0,\n      transform: \"scale(0.95)\",\n      transitionDuration: \"100ms\",\n      transitionTimingFunction: easeIn,\n    },\n    \"@media (prefers-reduced-motion: reduce)\": {\n      transitionDuration: \"0.01ms\",\n      \"&[data-ending-style]\": {\n        transitionDuration: \"0.01ms\",\n      },\n    },\n  },\n  popupPadding: {\n    ...boxModel,\n    ...shorthands.padding(tokens.spacingGroup2),\n  },\n})\n\n// A single child can arrive wrapped in a one-element array depending on the JSX runtime (MDX call\n// sites do this). Radix's Slot normalised that, so the `asChild` shim has to as well.\nfunction onlySlotChild(children: React.ReactNode) {\n  const elements = React.Children.toArray(children).filter(React.isValidElement)\n  return elements.length === 1 ? elements[0] : undefined\n}\n\n/**\n * Radix's `asChild` over Base UI's `render`: the single child element becomes the part and keeps\n * its own children, since Base UI lets the rendered element's props win the merge. `extra` joins\n * the part's children, after the caller's.\n */\nfunction contentSlotProps(\n  asChild: boolean,\n  children: React.ReactNode,\n  extra: React.ReactNode\n) {\n  const child = asChild ? onlySlotChild(children) : undefined\n  if (!child)\n    return {\n      children: (\n        <>\n          {children}\n          {extra}\n        </>\n      ),\n    }\n  if (!extra) return { render: child }\n  const childProps = child.props as { children?: React.ReactNode }\n  return {\n    render: React.cloneElement(child, undefined, childProps.children, extra),\n  }\n}\n\n/**\n * A part's props as they were under Radix: its native element's own (DOM attributes, React's\n * handler types, a `CSSProperties` style, a string `className`, `ref`) plus `asChild`. Base UI's\n * prop types widen `style` and `className` to functions of the part's state, wrap every handler's\n * event in `BaseUIEvent` and add props of their own; none of that reaches the public surface.\n */\ntype NativePartProps<Tag extends \"button\" | \"div\"> =\n  React.ComponentProps<Tag> & {\n    /** Renders the single child element as this part, merging its props and behaviour onto it. */\n    asChild?: boolean\n  }\n\n/**\n * Radix-shaped focus interception over Base UI's `initialFocus`/`finalFocus`. `preventDefault()`\n * leaves focus where it is; otherwise the default move happens, because Base UI reads a callback\n * that returns `undefined` as \"move nothing\".\n */\nfunction radixFocusCallback(handler: ((event: Event) => void) | undefined) {\n  if (!handler) return undefined\n\n  return () => {\n    const event = new Event(\"focus\", { cancelable: true })\n    const before = document.activeElement\n    handler(event)\n    const moved = document.activeElement\n    // Base UI calls `finalFocus` inside React's commit, and React then restores the focus it saw\n    // before the commit. Radix ran this handler after the commit, so a handler that moves focus\n    // itself has its move applied again once the commit is done.\n    if (moved !== before && moved instanceof HTMLElement) {\n      queueMicrotask(() => moved.focus())\n    }\n    return !event.defaultPrevented\n  }\n}\n\n/**\n * What `onOpenChange` receives as its second argument: Base UI's change details, declared in\n * Zenith. Base UI's own type drags its popover store into the published declarations, and\n * TypeScript 4 cannot parse that store. `event` narrows with `reason`, as it does in Base UI.\n */\ntype PopoverOpenChangeDetails = (\n  | {\n      reason: \"trigger-press\"\n      event: MouseEvent | PointerEvent | TouchEvent | KeyboardEvent\n    }\n  | { reason: \"trigger-hover\"; event: MouseEvent }\n  | { reason: \"trigger-focus\"; event: FocusEvent }\n  | { reason: \"outside-press\"; event: MouseEvent | PointerEvent | TouchEvent }\n  | { reason: \"escape-key\"; event: KeyboardEvent }\n  | { reason: \"close-press\"; event: MouseEvent | KeyboardEvent | PointerEvent }\n  | { reason: \"focus-out\"; event: FocusEvent | KeyboardEvent }\n  | { reason: \"imperative-action\"; event: Event }\n  | { reason: \"none\"; event: Event }\n) & {\n  /** Keeps the popover in its current state. */\n  cancel: () => void\n  /** Lets the event propagate where the popover would otherwise stop it. */\n  allowPropagation: () => void\n  isCanceled: boolean\n  isPropagationAllowed: boolean\n  /** The element that caused the change, if any. */\n  trigger: Element | undefined\n  /** Keeps the popover's elements mounted after it closes. */\n  preventUnmountOnClose: () => void\n}\n\n// Whether the root is modal, for PopoverContent's close part.\nconst PopoverModalContext = React.createContext(false)\n\n/** Anything with a client rect, which is all positioning reads from an anchor. */\ntype Measurable = { getBoundingClientRect(): DOMRect }\n\n// Radix modelled a custom anchor as a part; Base UI takes the element as the Positioner's\n// `anchor`. PopoverAnchor registers its element here and PopoverContent reads it back.\nconst PopoverAnchorContext = React.createContext<{\n  anchor: Element | Measurable | null\n  setAnchor: (anchor: Element | Measurable | null) => void\n} | null>(null)\n\nexport type PopoverProps = {\n  children?: React.ReactNode\n  open?: boolean\n  defaultOpen?: boolean\n  /**\n   * While open, keeps Tab inside the popover, hides the rest of the page from assistive tech,\n   * locks page scroll and blocks pointer interaction outside it.\n   */\n  modal?: boolean\n  /**\n   * Called when the popover opens or closes. `eventDetails.reason` says why (`trigger-press`,\n   * `escape-key`, `outside-press`, `focus-out`) and `eventDetails.cancel()` keeps the popover in\n   * its current state.\n   */\n  onOpenChange?: (open: boolean, eventDetails: PopoverOpenChangeDetails) => void\n}\n\nexport const Popover = React.forwardRef<HTMLElement, PopoverProps>(\n  function Popover({ onOpenChange, ...props }, _ref) {\n    const [anchor, setAnchor] = React.useState<Element | Measurable | null>(\n      null\n    )\n    const anchorContext = React.useMemo(() => ({ anchor, setAnchor }), [anchor])\n\n    return (\n      <PopoverAnchorContext.Provider value={anchorContext}>\n        <PopoverModalContext.Provider value={props.modal === true}>\n          <PopoverPrimitive.Root\n            data-slot=\"popover\"\n            onOpenChange={(open, eventDetails) => {\n              // A layer inside (a Volt select or menu, which run on Radix, or a control\n              // handling the key itself) prevents the Escape it consumes, but Base UI\n              // dismisses regardless, so one Escape would close both. Honour the handled\n              // event. Consumers still mix Zenith with Volt on one page, so this stays\n              // after the Radix teardown (D12).\n              if (\n                eventDetails.reason === \"escape-key\" &&\n                eventDetails.event.defaultPrevented\n              ) {\n                eventDetails.cancel()\n                return\n              }\n              onOpenChange?.(open, eventDetails)\n            }}\n            {...props}\n          />\n        </PopoverModalContext.Provider>\n      </PopoverAnchorContext.Provider>\n    )\n  }\n)\n\nexport type PopoverTriggerProps = NativePartProps<\"button\">\n\nexport const PopoverTrigger = React.forwardRef<\n  HTMLButtonElement,\n  PopoverTriggerProps\n>(function PopoverTrigger(\n  { asChild = false, children, className, ...props },\n  ref\n) {\n  const styles = useStyles()\n  const child = asChild ? onlySlotChild(children) : undefined\n  // Base UI drives a native <button> unless told otherwise; a child that is another intrinsic\n  // element gets the ARIA button behaviour instead. A component child counts as a button: Base UI\n  // checks the rendered tag on first mount, before a component's element can be known.\n  const nativeButton =\n    !child || typeof child.type !== \"string\" || child.type === \"button\"\n\n  return (\n    <PopoverPrimitive.Trigger\n      ref={ref}\n      data-slot=\"popover-trigger\"\n      {...{ [SLOT_ATTR]: \"popover-trigger\" }}\n      nativeButton={nativeButton}\n      // Radix stamped type=\"button\" on any child, so an input child stays a button input; Base UI\n      // only stamps it on a native button. The child's own type still wins.\n      {...(child?.type === \"input\" ? { type: \"button\" } : {})}\n      className={mergeClasses(!asChild && styles.nativeTrigger, className)}\n      {...props}\n      {...(child ? { render: child } : { children })}\n    />\n  )\n})\n\n// Lets PopoverContent supply Base UI's required Portal itself when no PopoverPortal wraps it.\nconst PopoverPortalPresenceContext = React.createContext(false)\n\nexport type PopoverPortalProps = {\n  children?: React.ReactNode\n  /** The element the content portals into; `document.body` when omitted or null. */\n  container?: Element | DocumentFragment | null\n  /** Keeps the content mounted while the popover is closed. */\n  forceMount?: true\n}\n\nexport const PopoverPortal = React.forwardRef<HTMLElement, PopoverPortalProps>(\n  function PopoverPortal({ container, forceMount, ...props }, ref) {\n    return (\n      <PopoverPortalPresenceContext.Provider value={true}>\n        <PopoverPrimitive.Portal\n          // Base UI types the ref as its portal div, which any HTMLElement ref can hold.\n          ref={ref as React.Ref<HTMLDivElement>}\n          data-slot=\"popover-portal\"\n          {...{ [SLOT_ATTR]: \"popover-portal\" }}\n          // Radix took any Element or DocumentFragment, null meaning the body. Base UI hands a\n          // node straight to createPortal, which takes either, but reads null as \"wait for one\".\n          container={(container ?? undefined) as HTMLElement | undefined}\n          keepMounted={forceMount}\n          {...props}\n        />\n      </PopoverPortalPresenceContext.Provider>\n    )\n  }\n)\n\nexport type PopoverAnchorProps = NativePartProps<\"div\"> & {\n  /** Anchors the popover to something other than an element, such as a text selection; renders nothing. */\n  virtualRef?: React.RefObject<{ getBoundingClientRect(): DOMRect }>\n}\n\nexport const PopoverAnchor = React.forwardRef<\n  HTMLDivElement,\n  PopoverAnchorProps\n>(function PopoverAnchor(\n  { asChild = false, children, virtualRef, ...props },\n  ref\n) {\n  const setAnchor = React.useContext(PopoverAnchorContext)?.setAnchor\n  const child = asChild ? onlySlotChild(children) : undefined\n\n  // Read after every commit, as Radix did: the ref's target can change without a render.\n  React.useEffect(() => {\n    if (virtualRef) setAnchor?.(virtualRef.current)\n  })\n  React.useEffect(() => {\n    if (virtualRef) return () => setAnchor?.(null)\n  }, [setAnchor, virtualRef])\n\n  return useRender({\n    render: child,\n    ref: setAnchor ? [ref, setAnchor] : ref,\n    enabled: !virtualRef,\n    props: {\n      \"data-slot\": \"popover-anchor\",\n      [SLOT_ATTR]: \"popover-anchor\",\n      ...props,\n      ...(child ? {} : { children }),\n    },\n  })\n})\n\ntype Side = \"top\" | \"right\" | \"bottom\" | \"left\"\ntype Boundary = Element | null\n\n// Radix let only `avoidCollisions={false}` switch both flip and shift off.\nconst NO_COLLISION_AVOIDANCE = {\n  side: \"none\",\n  align: \"none\",\n  fallbackAxisSide: \"none\",\n} as const\n// Radix flipped to the opposite side and swapped start/end, never to the perpendicular axis.\nconst RADIX_COLLISION_AVOIDANCE = {\n  side: \"flip\",\n  align: \"flip\",\n  fallbackAxisSide: \"none\",\n} as const\n\nexport type PopoverContentProps = NativePartProps<\"div\"> & {\n  /**\n   * Keeps the content mounted while the popover is closed. Inside PopoverPortal, the portal's\n   * `forceMount` decides.\n   */\n  forceMount?: true\n  side?: \"top\" | \"right\" | \"bottom\" | \"left\"\n  sideOffset?: number\n  align?: \"start\" | \"center\" | \"end\"\n  alignOffset?: number\n  arrowPadding?: number\n  /** Flips and shifts the content to keep it in view. */\n  avoidCollisions?: boolean\n  /** The elements the content stays within; the viewport when omitted. */\n  collisionBoundary?: Boundary | Boundary[]\n  collisionPadding?: number | Partial<Record<Side, number>>\n  /**\n   * `\"partial\"` keeps the content attached to the trigger while any of it is in view; `\"always\"`\n   * keeps the content in view even when that detaches it.\n   */\n  sticky?: \"partial\" | \"always\"\n  /** Hides the content while the trigger is fully out of view. */\n  hideWhenDetached?: boolean\n  /**\n   * Kept for compatibility. The position follows the trigger's resizes, layout shifts and scrolls\n   * either way; `\"always\"` no longer re-measures on every animation frame.\n   */\n  updatePositionStrategy?: \"optimized\" | \"always\"\n  /** Called before focus moves into the popover; `preventDefault()` leaves focus where it is. */\n  onOpenAutoFocus?: (event: Event) => void\n  /** Called before focus returns on close; `preventDefault()` skips the return. */\n  onCloseAutoFocus?: (event: Event) => void\n  flush?: boolean\n}\n\nexport const PopoverContent = React.forwardRef<\n  HTMLDivElement,\n  PopoverContentProps\n>(function PopoverContent(\n  {\n    asChild = false,\n    className,\n    children,\n    forceMount,\n    side = \"bottom\",\n    sideOffset = 4,\n    align = \"center\",\n    alignOffset = 0,\n    arrowPadding = 0,\n    avoidCollisions = true,\n    collisionBoundary = [],\n    collisionPadding = 0,\n    sticky = \"partial\",\n    hideWhenDetached = false,\n    updatePositionStrategy: _updatePositionStrategy,\n    onOpenAutoFocus,\n    onCloseAutoFocus,\n    flush = false,\n    ...props\n  },\n  ref\n) {\n  const styles = useStyles()\n  const hasPortal = React.useContext(PopoverPortalPresenceContext)\n  const anchor = React.useContext(PopoverAnchorContext)?.anchor\n  const modal = React.useContext(PopoverModalContext)\n  // Base UI counts a Close part through React context, not DOM containment, so the part renders\n  // into a node that is never attached: it takes no place among the caller's children.\n  const [closePartHost] = React.useState(() =>\n    typeof document === \"undefined\" ? null : document.createElement(\"div\")\n  )\n  // DENSITY-SPEC.md §4.4 — portal content boundary; see dialog.tsx's identical comment.\n  const override = useDensity()\n  // SPEC.md §2 rule 3 — the same portal asymmetry, for the appearance pair: re-stamp the\n  // nearest explicit AppearanceBoundary's mode+surface, or neither attribute when there is\n  // none, leaving live shell inheritance in place.\n  const appearance = useAppearanceAttributes()\n\n  const positioner = (\n    <PopoverPrimitive.Positioner\n      className={mergeClasses(\n        styles.positioner,\n        hideWhenDetached && styles.hideWhenDetached\n      )}\n      anchor={anchor ?? undefined}\n      side={side}\n      sideOffset={sideOffset}\n      align={align}\n      alignOffset={alignOffset}\n      arrowPadding={arrowPadding}\n      // Radix's default boundary is the viewport alone, not every clipping ancestor.\n      collisionBoundary={(Array.isArray(collisionBoundary)\n        ? collisionBoundary\n        : [collisionBoundary]\n      ).filter((element): element is Element => element !== null)}\n      collisionPadding={collisionPadding}\n      collisionAvoidance={\n        avoidCollisions ? RADIX_COLLISION_AVOIDANCE : NO_COLLISION_AVOIDANCE\n      }\n      sticky={sticky === \"always\"}\n    >\n      <PopoverPrimitive.Popup\n        ref={ref}\n        data-slot=\"popover-content\"\n        {...{ [SLOT_ATTR]: \"popover-content\" }}\n        {...(override !== undefined ? { \"data-density\": override } : {})}\n        {...appearance}\n        initialFocus={radixFocusCallback(onOpenAutoFocus)}\n        finalFocus={radixFocusCallback(onCloseAutoFocus)}\n        className={mergeClasses(\n          styles.popup,\n          !flush && styles.popupPadding,\n          className\n        )}\n        {...props}\n        {...contentSlotProps(\n          asChild,\n          children,\n          // Base UI traps Tab in a modal popup and hides the rest of the page from assistive\n          // tech only while a Close part is inside it; Radix did both for any modal popover. This\n          // one is never seen, focused or announced.\n          modal &&\n            closePartHost &&\n            createPortal(<PopoverPrimitive.Close hidden />, closePartHost)\n        )}\n      />\n    </PopoverPrimitive.Positioner>\n  )\n\n  // Base UI's Positioner requires a Portal ancestor; Radix rendered inline without one.\n  return hasPortal ? (\n    positioner\n  ) : (\n    <PopoverPrimitive.Portal keepMounted={forceMount}>\n      {positioner}\n    </PopoverPrimitive.Portal>\n  )\n})\n"],"names":["easeOut","easeIn","useStyles","makeZenithStyles","nativeControl","OVERLAY_Z_INDEX","boxModel","tokens.body","tokens.grayA12","shorthands","tokens.radiusXl","tokens.grayA1","tokens.spacingElement2","tokens.spacingGroup2","onlySlotChild","children","elements","React","contentSlotProps","asChild","extra","child","jsxs","Fragment","childProps","radixFocusCallback","handler","event","before","moved","PopoverModalContext","PopoverAnchorContext","Popover","onOpenChange","props","_ref","anchor","setAnchor","anchorContext","jsx","PopoverPrimitive","open","eventDetails","PopoverTrigger","className","ref","styles","nativeButton","SLOT_ATTR","mergeClasses","PopoverPortalPresenceContext","PopoverPortal","container","forceMount","PopoverAnchor","virtualRef","_a","useRender","NO_COLLISION_AVOIDANCE","RADIX_COLLISION_AVOIDANCE","PopoverContent","side","sideOffset","align","alignOffset","arrowPadding","avoidCollisions","collisionBoundary","collisionPadding","sticky","hideWhenDetached","_updatePositionStrategy","onOpenAutoFocus","onCloseAutoFocus","flush","hasPortal","modal","closePartHost","override","useDensity","appearance","useAppearanceAttributes","positioner","element","createPortal"],"mappings":"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"}
+{"version":3,"file":"popover.js","sources":["../../../src/components/popover/popover.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { createPortal } from \"react-dom\"\n\nimport { Popover as PopoverPrimitive } from \"@base-ui/react/popover\"\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1/core\"\n\nimport { useAppearanceAttributes } from \"../appearance-boundary/appearance-boundary\"\nimport { useDensity } from \"../density-provider/density-provider\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel, nativeControl } from \"../../styles/host-reset\"\nimport { OVERLAY_Z_INDEX } from \"../../styles/overlay-layer\"\nimport * as tokens from \"../../tokens\"\n\nconst easeOut = \"cubic-bezier(0.4, 0, 0.2, 1)\"\nconst easeIn = \"cubic-bezier(0.4, 0, 1, 1)\"\n\nconst useStyles = makeZenithStyles({\n  // For the bare native `<button>` a Trigger/Close renders. Not applied under `asChild`, where the\n  // child owns its own element and two atom sets would race for the same properties.\n  nativeTrigger: {\n    ...nativeControl,\n  },\n  // The positioner is what stacks against other layers, as Radix's popper wrapper did; it also\n  // keeps that wrapper's `max-content` floor so the content wraps the same way.\n  positioner: {\n    zIndex: OVERLAY_Z_INDEX,\n    minWidth: \"max-content\",\n  },\n  hideWhenDetached: {\n    \"&[data-anchor-hidden]\": {\n      visibility: \"hidden\",\n      pointerEvents: \"none\",\n    },\n  },\n  popup: {\n    ...boxModel,\n    backgroundColor: tokens.body,\n    color: tokens.grayA12,\n    transformOrigin: \"var(--transform-origin)\",\n    ...shorthands.borderRadius(tokens.radiusXl),\n    ...shorthands.border(\"1px\", \"solid\", tokens.grayA1),\n    // v1 shadow-md\n    boxShadow: \"0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a\",\n    outlineStyle: \"none\",\n    zIndex: OVERLAY_Z_INDEX,\n    transitionProperty: \"opacity, transform\",\n    transitionDuration: \"150ms\",\n    transitionTimingFunction: easeOut,\n    \"&[data-starting-style]\": {\n      opacity: 0,\n      transform: \"scale(0.95)\",\n    },\n    \"&[data-starting-style][data-side='bottom']\": {\n      transform: `translateY(-${tokens.spacingElement2}) scale(0.95)`,\n    },\n    \"&[data-starting-style][data-side='left']\": {\n      transform: `translateX(${tokens.spacingElement2}) scale(0.95)`,\n    },\n    \"&[data-starting-style][data-side='right']\": {\n      transform: `translateX(-${tokens.spacingElement2}) scale(0.95)`,\n    },\n    \"&[data-starting-style][data-side='top']\": {\n      transform: `translateY(${tokens.spacingElement2}) scale(0.95)`,\n    },\n    \"&[data-ending-style]\": {\n      opacity: 0,\n      transform: \"scale(0.95)\",\n      transitionDuration: \"100ms\",\n      transitionTimingFunction: easeIn,\n    },\n    \"@media (prefers-reduced-motion: reduce)\": {\n      transitionDuration: \"0.01ms\",\n      \"&[data-ending-style]\": {\n        transitionDuration: \"0.01ms\",\n      },\n    },\n  },\n  popupPadding: {\n    ...boxModel,\n    ...shorthands.padding(tokens.spacingGroup2),\n  },\n})\n\n// A single child can arrive wrapped in a one-element array depending on the JSX runtime (MDX call\n// sites do this). Radix's Slot normalised that, so the `asChild` shim has to as well.\nfunction onlySlotChild(children: React.ReactNode) {\n  const elements = React.Children.toArray(children).filter(React.isValidElement)\n  return elements.length === 1 ? elements[0] : undefined\n}\n\n/**\n * Radix's `asChild` over Base UI's `render`: the single child element becomes the part and keeps\n * its own children, since Base UI lets the rendered element's props win the merge. `extra` joins\n * the part's children, after the caller's.\n */\nfunction contentSlotProps(\n  asChild: boolean,\n  children: React.ReactNode,\n  extra: React.ReactNode\n) {\n  const child = asChild ? onlySlotChild(children) : undefined\n  if (!child)\n    return {\n      children: (\n        <>\n          {children}\n          {extra}\n        </>\n      ),\n    }\n  if (!extra) return { render: child }\n  const childProps = child.props as { children?: React.ReactNode }\n  return {\n    render: React.cloneElement(child, undefined, childProps.children, extra),\n  }\n}\n\n/**\n * A part's props as they were under Radix: its native element's own (DOM attributes, React's\n * handler types, a `CSSProperties` style, a string `className`, `ref`) plus `asChild`. Base UI's\n * prop types widen `style` and `className` to functions of the part's state, wrap every handler's\n * event in `BaseUIEvent` and add props of their own; none of that reaches the public surface.\n */\ntype NativePartProps<Tag extends \"button\" | \"div\"> =\n  React.ComponentProps<Tag> & {\n    /** Renders the single child element as this part, merging its props and behaviour onto it. */\n    asChild?: boolean\n  }\n\n/**\n * Radix-shaped focus interception over Base UI's `initialFocus`/`finalFocus`. `preventDefault()`\n * leaves focus where it is; otherwise the default move happens, because Base UI reads a callback\n * that returns `undefined` as \"move nothing\".\n */\nfunction radixFocusCallback(handler: ((event: Event) => void) | undefined) {\n  if (!handler) return undefined\n\n  return () => {\n    const event = new Event(\"focus\", { cancelable: true })\n    const before = document.activeElement\n    handler(event)\n    const moved = document.activeElement\n    // Base UI calls `finalFocus` inside React's commit, and React then restores the focus it saw\n    // before the commit. Radix ran this handler after the commit, so a handler that moves focus\n    // itself has its move applied again once the commit is done.\n    if (moved !== before && moved instanceof HTMLElement) {\n      queueMicrotask(() => moved.focus())\n    }\n    return !event.defaultPrevented\n  }\n}\n\n/**\n * What `onOpenChange` receives as its second argument: Base UI's change details, declared in\n * Zenith. Base UI's own type drags its popover store into the published declarations, and\n * TypeScript 4 cannot parse that store. `event` narrows with `reason`, as it does in Base UI.\n */\ntype PopoverOpenChangeDetails = (\n  | {\n      reason: \"trigger-press\"\n      event: MouseEvent | PointerEvent | TouchEvent | KeyboardEvent\n    }\n  | { reason: \"trigger-hover\"; event: MouseEvent }\n  | { reason: \"trigger-focus\"; event: FocusEvent }\n  | { reason: \"outside-press\"; event: MouseEvent | PointerEvent | TouchEvent }\n  | { reason: \"escape-key\"; event: KeyboardEvent }\n  | { reason: \"close-press\"; event: MouseEvent | KeyboardEvent | PointerEvent }\n  | { reason: \"focus-out\"; event: FocusEvent | KeyboardEvent }\n  | { reason: \"imperative-action\"; event: Event }\n  | { reason: \"none\"; event: Event }\n) & {\n  /** Keeps the popover in its current state. */\n  cancel: () => void\n  /** Lets the event propagate where the popover would otherwise stop it. */\n  allowPropagation: () => void\n  isCanceled: boolean\n  isPropagationAllowed: boolean\n  /** The element that caused the change, if any. */\n  trigger: Element | undefined\n  /** Keeps the popover's elements mounted after it closes. */\n  preventUnmountOnClose: () => void\n}\n\n// Whether the root is modal, for PopoverContent's close part.\nconst PopoverModalContext = React.createContext(false)\n\n/** Anything with a client rect, which is all positioning reads from an anchor. */\ntype Measurable = { getBoundingClientRect(): DOMRect }\n\n// Radix modelled a custom anchor as a part; Base UI takes the element as the Positioner's\n// `anchor`. PopoverAnchor registers its element here and PopoverContent reads it back.\nconst PopoverAnchorContext = React.createContext<{\n  anchor: Element | Measurable | null\n  setAnchor: (anchor: Element | Measurable | null) => void\n} | null>(null)\n\nexport type PopoverProps = {\n  children?: React.ReactNode\n  open?: boolean\n  defaultOpen?: boolean\n  /**\n   * While open, keeps Tab inside the popover, hides the rest of the page from assistive tech,\n   * locks page scroll and blocks pointer interaction outside it.\n   */\n  modal?: boolean\n  /**\n   * Called when the popover opens or closes. `eventDetails.reason` says why (`trigger-press`,\n   * `escape-key`, `outside-press`, `focus-out`) and `eventDetails.cancel()` keeps the popover in\n   * its current state.\n   */\n  onOpenChange?: (open: boolean, eventDetails: PopoverOpenChangeDetails) => void\n}\n\nexport const Popover = React.forwardRef<HTMLElement, PopoverProps>(\n  function Popover({ onOpenChange, ...props }, _ref) {\n    const [anchor, setAnchor] = React.useState<Element | Measurable | null>(\n      null\n    )\n    const anchorContext = React.useMemo(() => ({ anchor, setAnchor }), [anchor])\n\n    return (\n      <PopoverAnchorContext.Provider value={anchorContext}>\n        <PopoverModalContext.Provider value={props.modal === true}>\n          <PopoverPrimitive.Root\n            data-slot=\"popover\"\n            onOpenChange={(open, eventDetails) => {\n              // A layer inside (a Volt select or menu, which run on Radix, or a control\n              // handling the key itself) prevents the Escape it consumes, but Base UI\n              // dismisses regardless, so one Escape would close both. Honour the handled\n              // event. Consumers still mix Zenith with Volt on one page, so this stays\n              // after the Radix teardown (D12).\n              if (\n                eventDetails.reason === \"escape-key\" &&\n                eventDetails.event.defaultPrevented\n              ) {\n                eventDetails.cancel()\n                return\n              }\n              onOpenChange?.(open, eventDetails)\n            }}\n            {...props}\n          />\n        </PopoverModalContext.Provider>\n      </PopoverAnchorContext.Provider>\n    )\n  }\n)\n\nexport type PopoverTriggerProps = NativePartProps<\"button\">\n\nexport const PopoverTrigger = React.forwardRef<\n  HTMLButtonElement,\n  PopoverTriggerProps\n>(function PopoverTrigger(\n  { asChild = false, children, className, ...props },\n  ref\n) {\n  const styles = useStyles()\n  const child = asChild ? onlySlotChild(children) : undefined\n  // Base UI drives a native <button> unless told otherwise; a child that is another intrinsic\n  // element gets the ARIA button behaviour instead. A component child counts as a button: Base UI\n  // checks the rendered tag on first mount, before a component's element can be known.\n  const nativeButton =\n    !child || typeof child.type !== \"string\" || child.type === \"button\"\n\n  return (\n    <PopoverPrimitive.Trigger\n      ref={ref}\n      data-slot=\"popover-trigger\"\n      {...{ [SLOT_ATTR]: \"popover-trigger\" }}\n      nativeButton={nativeButton}\n      // Radix stamped type=\"button\" on any child, so an input child stays a button input; Base UI\n      // only stamps it on a native button. The child's own type still wins.\n      {...(child?.type === \"input\" ? { type: \"button\" } : {})}\n      className={mergeClasses(!asChild && styles.nativeTrigger, className)}\n      {...props}\n      {...(child ? { render: child } : { children })}\n    />\n  )\n})\n\n// Lets PopoverContent supply Base UI's required Portal itself when no PopoverPortal wraps it.\nconst PopoverPortalPresenceContext = React.createContext(false)\n\nexport type PopoverPortalProps = {\n  children?: React.ReactNode\n  /** The element the content portals into; `document.body` when omitted or null. */\n  container?: Element | DocumentFragment | null\n  /** Keeps the content mounted while the popover is closed. */\n  forceMount?: true\n}\n\nexport const PopoverPortal = React.forwardRef<HTMLElement, PopoverPortalProps>(\n  function PopoverPortal({ container, forceMount, ...props }, ref) {\n    return (\n      <PopoverPortalPresenceContext.Provider value={true}>\n        <PopoverPrimitive.Portal\n          // Base UI types the ref as its portal div, which any HTMLElement ref can hold.\n          ref={ref as React.Ref<HTMLDivElement>}\n          data-slot=\"popover-portal\"\n          {...{ [SLOT_ATTR]: \"popover-portal\" }}\n          // Radix took any Element or DocumentFragment, null meaning the body. Base UI hands a\n          // node straight to createPortal, which takes either, but reads null as \"wait for one\".\n          container={(container ?? undefined) as HTMLElement | undefined}\n          keepMounted={forceMount}\n          {...props}\n        />\n      </PopoverPortalPresenceContext.Provider>\n    )\n  }\n)\n\nexport type PopoverAnchorProps = NativePartProps<\"div\"> & {\n  /** Anchors the popover to something other than an element, such as a text selection; renders nothing. */\n  virtualRef?: React.RefObject<{ getBoundingClientRect(): DOMRect }>\n}\n\nexport const PopoverAnchor = React.forwardRef<\n  HTMLDivElement,\n  PopoverAnchorProps\n>(function PopoverAnchor(\n  { asChild = false, children, virtualRef, ...props },\n  ref\n) {\n  const setAnchor = React.useContext(PopoverAnchorContext)?.setAnchor\n  const child = asChild ? onlySlotChild(children) : undefined\n\n  // Read after every commit, as Radix did: the ref's target can change without a render.\n  React.useEffect(() => {\n    if (virtualRef) setAnchor?.(virtualRef.current)\n  })\n  React.useEffect(() => {\n    if (virtualRef) return () => setAnchor?.(null)\n  }, [setAnchor, virtualRef])\n\n  return useRender({\n    render: child,\n    ref: setAnchor ? [ref, setAnchor] : ref,\n    enabled: !virtualRef,\n    props: {\n      \"data-slot\": \"popover-anchor\",\n      [SLOT_ATTR]: \"popover-anchor\",\n      ...props,\n      ...(child ? {} : { children }),\n    },\n  })\n})\n\ntype Side = \"top\" | \"right\" | \"bottom\" | \"left\"\ntype Boundary = Element | null\n\n// Radix let only `avoidCollisions={false}` switch both flip and shift off.\nconst NO_COLLISION_AVOIDANCE = {\n  side: \"none\",\n  align: \"none\",\n  fallbackAxisSide: \"none\",\n} as const\n// Radix flipped to the opposite side and swapped start/end, never to the perpendicular axis.\nconst RADIX_COLLISION_AVOIDANCE = {\n  side: \"flip\",\n  align: \"flip\",\n  fallbackAxisSide: \"none\",\n} as const\n\nexport type PopoverContentProps = NativePartProps<\"div\"> & {\n  /**\n   * Keeps the content mounted while the popover is closed. Inside PopoverPortal, the portal's\n   * `forceMount` decides.\n   */\n  forceMount?: true\n  side?: \"top\" | \"right\" | \"bottom\" | \"left\"\n  sideOffset?: number\n  align?: \"start\" | \"center\" | \"end\"\n  alignOffset?: number\n  arrowPadding?: number\n  /** Flips and shifts the content to keep it in view. */\n  avoidCollisions?: boolean\n  /** The elements the content stays within; the viewport when omitted. */\n  collisionBoundary?: Boundary | Boundary[]\n  collisionPadding?: number | Partial<Record<Side, number>>\n  /**\n   * `\"partial\"` keeps the content attached to the trigger while any of it is in view; `\"always\"`\n   * keeps the content in view even when that detaches it.\n   */\n  sticky?: \"partial\" | \"always\"\n  /** Hides the content while the trigger is fully out of view. */\n  hideWhenDetached?: boolean\n  /**\n   * Kept for compatibility. The position follows the trigger's resizes, layout shifts and scrolls\n   * either way; `\"always\"` no longer re-measures on every animation frame.\n   */\n  updatePositionStrategy?: \"optimized\" | \"always\"\n  /** Called before focus moves into the popover; `preventDefault()` leaves focus where it is. */\n  onOpenAutoFocus?: (event: Event) => void\n  /** Called before focus returns on close; `preventDefault()` skips the return. */\n  onCloseAutoFocus?: (event: Event) => void\n  flush?: boolean\n}\n\nexport const PopoverContent = React.forwardRef<\n  HTMLDivElement,\n  PopoverContentProps\n>(function PopoverContent(\n  {\n    asChild = false,\n    className,\n    children,\n    forceMount,\n    side = \"bottom\",\n    sideOffset = 4,\n    align = \"center\",\n    alignOffset = 0,\n    arrowPadding = 0,\n    avoidCollisions = true,\n    collisionBoundary = [],\n    collisionPadding = 0,\n    sticky = \"partial\",\n    hideWhenDetached = false,\n    updatePositionStrategy: _updatePositionStrategy,\n    onOpenAutoFocus,\n    onCloseAutoFocus,\n    flush = false,\n    ...props\n  },\n  ref\n) {\n  const styles = useStyles()\n  const hasPortal = React.useContext(PopoverPortalPresenceContext)\n  const anchor = React.useContext(PopoverAnchorContext)?.anchor\n  const modal = React.useContext(PopoverModalContext)\n  // Base UI counts a Close part through React context, not DOM containment, so the part renders\n  // into a node that is never attached: it takes no place among the caller's children.\n  const [closePartHost] = React.useState(() =>\n    typeof document === \"undefined\" ? null : document.createElement(\"div\")\n  )\n  // DENSITY-SPEC.md §4.4 — portal content boundary; see dialog.tsx's identical comment.\n  const override = useDensity()\n  // SPEC.md §2 rule 3 — the same portal asymmetry, for the appearance pair: re-stamp the\n  // nearest explicit AppearanceBoundary's mode+surface, or neither attribute when there is\n  // none, leaving live shell inheritance in place.\n  const appearance = useAppearanceAttributes()\n\n  const positioner = (\n    <PopoverPrimitive.Positioner\n      className={mergeClasses(\n        styles.positioner,\n        hideWhenDetached && styles.hideWhenDetached\n      )}\n      anchor={anchor ?? undefined}\n      side={side}\n      sideOffset={sideOffset}\n      align={align}\n      alignOffset={alignOffset}\n      arrowPadding={arrowPadding}\n      // Radix's default boundary is the viewport alone, not every clipping ancestor.\n      collisionBoundary={(Array.isArray(collisionBoundary)\n        ? collisionBoundary\n        : [collisionBoundary]\n      ).filter((element): element is Element => element !== null)}\n      collisionPadding={collisionPadding}\n      collisionAvoidance={\n        avoidCollisions ? RADIX_COLLISION_AVOIDANCE : NO_COLLISION_AVOIDANCE\n      }\n      sticky={sticky === \"always\"}\n    >\n      <PopoverPrimitive.Popup\n        ref={ref}\n        data-slot=\"popover-content\"\n        {...{ [SLOT_ATTR]: \"popover-content\" }}\n        {...(override !== undefined ? { \"data-density\": override } : {})}\n        {...appearance}\n        initialFocus={radixFocusCallback(onOpenAutoFocus)}\n        finalFocus={radixFocusCallback(onCloseAutoFocus)}\n        className={mergeClasses(\n          styles.popup,\n          !flush && styles.popupPadding,\n          className\n        )}\n        {...props}\n        {...contentSlotProps(\n          asChild,\n          children,\n          // Base UI traps Tab in a modal popup and hides the rest of the page from assistive\n          // tech only while a Close part is inside it; Radix did both for any modal popover. This\n          // one is never seen, focused or announced.\n          modal &&\n            closePartHost &&\n            createPortal(<PopoverPrimitive.Close hidden />, closePartHost)\n        )}\n      />\n    </PopoverPrimitive.Positioner>\n  )\n\n  // Base UI's Positioner requires a Portal ancestor; Radix rendered inline without one.\n  return hasPortal ? (\n    positioner\n  ) : (\n    <PopoverPrimitive.Portal keepMounted={forceMount}>\n      {positioner}\n    </PopoverPrimitive.Portal>\n  )\n})\n"],"names":["easeOut","easeIn","useStyles","makeZenithStyles","nativeControl","OVERLAY_Z_INDEX","boxModel","tokens.body","tokens.grayA12","shorthands","tokens.radiusXl","tokens.grayA1","tokens.spacingElement2","tokens.spacingGroup2","onlySlotChild","children","elements","React","contentSlotProps","asChild","extra","child","jsxs","Fragment","childProps","radixFocusCallback","handler","event","before","moved","PopoverModalContext","PopoverAnchorContext","Popover","onOpenChange","props","_ref","anchor","setAnchor","anchorContext","jsx","PopoverPrimitive","open","eventDetails","PopoverTrigger","className","ref","styles","nativeButton","SLOT_ATTR","mergeClasses","PopoverPortalPresenceContext","PopoverPortal","container","forceMount","PopoverAnchor","virtualRef","_a","useRender","NO_COLLISION_AVOIDANCE","RADIX_COLLISION_AVOIDANCE","PopoverContent","side","sideOffset","align","alignOffset","arrowPadding","avoidCollisions","collisionBoundary","collisionPadding","sticky","hideWhenDetached","_updatePositionStrategy","onOpenAutoFocus","onCloseAutoFocus","flush","hasPortal","modal","closePartHost","override","useDensity","appearance","useAppearanceAttributes","positioner","element","createPortal"],"mappings":"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"}

package/dist/components/radio/radio.js

@@ -1,7 +1,7 @@
 import { jsx as t, jsxs as x } from "react/jsx-runtime";
 import * as n from "react";
 import { Radio as p } from "../../_virtual/_zenith-runtime-family_radio.js";
-import { mergeClasses as b, SLOT_ATTR as l, shorthands as i } from "@epilot/zenith-runtime/v1";
+import { mergeClasses as b, SLOT_ATTR as l, shorthands as i } from "@epilot/zenith-runtime/v1/core.js";
 import { makeZenithStyles as k } from "../../styles/make-styles.js";
 import { boxModel as m, nativeControl as y } from "../../styles/host-reset.js";
 import { accentContrast as f, errorA10 as v, focusRing as h, errorSoft as R, grayA3 as g, accentSolid as w, accentOnSoft as S, accentSoft as I, errorA8 as E, accentA7 as A, spacingElement3 as T } from "../../tokens/index.js";

package/dist/components/radio/radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio.js","sources":["../../../src/components/radio/radio.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { Radio } from \"@base-ui/react/radio\"\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel, nativeControl } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\nimport {\n  RadioGroupBase,\n  type RadioGroupBaseProps,\n  type RadioGroupOrientation,\n} from \"./radio-group-base\"\n\nconst CircleIcon = React.forwardRef<SVGSVGElement, React.ComponentProps<\"svg\">>(\n  function CircleIcon(props, ref) {\n    return (\n      <svg\n        ref={ref}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"currentColor\"\n        stroke=\"currentColor\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        {...props}\n      >\n        <circle cx=\"12\" cy=\"12\" r=\"10\" />\n      </svg>\n    )\n  }\n)\n\nconst useStyles = makeZenithStyles({\n  group: {\n    display: \"grid\",\n    ...shorthands.gap(tokens.spacingElement3),\n  },\n  item: {\n    ...nativeControl,\n    boxSizing: \"border-box\",\n    display: \"inline-flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    position: \"relative\",\n    aspectRatio: \"1 / 1\",\n    width: \"1rem\",\n    height: \"1rem\",\n    flexShrink: 0,\n    borderRadius: \"9999px\",\n    ...shorthands.border(\"1px\", \"solid\", tokens.accentA7),\n    backgroundColor: tokens.accentSoft,\n    color: tokens.accentOnSoft,\n    // Tailwind `shadow-xs` — literal per CONVENTIONS B7\n    boxShadow: \"0 1px 2px 0 #0000000d\",\n    transitionProperty: \"color, box-shadow\",\n    transitionDuration: \"150ms\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    \"@media (prefers-reduced-motion: reduce)\": {\n      transitionDuration: \"0.01ms\",\n    },\n    \":focus-visible\": {\n      outlineOffset: \"2px\",\n      outlineWidth: \"2px\",\n      outlineStyle: \"solid\",\n      outlineColor: tokens.focusRing,\n    },\n    \"&[data-disabled]\": {\n      cursor: \"not-allowed\",\n      backgroundColor: tokens.grayA3,\n      ...shorthands.borderColor(\"transparent\"),\n    },\n    \"&[data-checked]\": {\n      backgroundColor: tokens.accentSolid,\n      color: tokens.accentContrast,\n    },\n    \"&[data-checked][data-disabled]\": {\n      backgroundColor: tokens.grayA3,\n    },\n    \"&[aria-invalid='true'], &[data-invalid]\": {\n      backgroundColor: tokens.errorSoft,\n      ...shorthands.borderColor(tokens.errorA8),\n      outlineColor: tokens.focusRing,\n    },\n    \"&[data-checked][aria-invalid='true'], &[data-checked][data-invalid]\": {\n      backgroundColor: tokens.errorA10,\n      ...shorthands.borderColor(\"transparent\"),\n    },\n  },\n  indicator: {\n    ...boxModel,\n    position: \"relative\",\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    width: \"100%\",\n    height: \"100%\",\n  },\n  icon: {\n    ...boxModel,\n    color: tokens.accentContrast,\n    position: \"absolute\",\n    top: \"50%\",\n    left: \"50%\",\n    width: \"0.5rem\",\n    height: \"0.5rem\",\n    transform: \"translate(-50%, -50%)\",\n    pointerEvents: \"none\",\n  },\n})\n\n/**\n * What `onValueChange` receives as its second argument: Base UI's change details, declared in\n * Zenith so that none of Base UI's internals reach the published declarations, where TypeScript 4\n * cannot parse them.\n */\nexport type RadioGroupChangeDetails = {\n  /** Why the value changed. Base UI reports every radio group change as `none`. */\n  reason: \"none\"\n  /** The native event behind the change. */\n  event: Event\n  /** Keeps the group's current value. */\n  cancel: () => void\n  /** Lets the event propagate where the group would otherwise stop it. */\n  allowPropagation: () => void\n  isCanceled: boolean\n  isPropagationAllowed: boolean\n  /** The element that caused the change, if any. */\n  trigger: Element | undefined\n}\n\ntype RadioGroupRootProps = {\n  /**\n   * The controlled value of the radio item that should be currently selected.\n   *\n   * To render an uncontrolled radio group, use the `defaultValue` prop instead.\n   */\n  value?: string | null | undefined\n  /** The value of the radio item that should be initially selected. */\n  defaultValue?: string | undefined\n  /** Event handler called when the value changes. */\n  onValueChange?:\n    ((value: string, eventDetails: RadioGroupChangeDetails) => void) | undefined\n  /** Whether the component should ignore user interaction. */\n  disabled?: boolean | undefined\n  /** Whether the user must choose a value before submitting a form. */\n  required?: boolean | undefined\n  /** Identifies the field when a form is submitted. */\n  name?: string | undefined\n  /**\n   * The axis the arrow keys move along. When set, only that axis' keys move between the options\n   * (Up and Down for `vertical`) and it is restated as `aria-orientation`. Unset, all four work.\n   */\n  orientation?: RadioGroupOrientation | undefined\n  /** The reading direction, which decides what Left and Right mean. */\n  dir?: \"ltr\" | \"rtl\" | undefined\n  /** Whether the arrow keys wrap from the last option to the first and back. Defaults to `true`. */\n  loop?: boolean | undefined\n  /** Renders the single child element as the group, merging the group's props and behaviour onto it. */\n  asChild?: boolean | undefined\n}\n\nexport type RadioGroupProps = Omit<\n  React.ComponentPropsWithRef<\"div\">,\n  keyof RadioGroupRootProps\n> &\n  RadioGroupRootProps\n\n// A single child can arrive wrapped in a one-element array depending on the JSX runtime, which\n// Radix's Slot normalised.\nfunction onlySlotChild(children: React.ReactNode) {\n  const elements = React.Children.toArray(children).filter(React.isValidElement)\n  return elements.length === 1 ? elements[0] : undefined\n}\n\nexport const RadioGroup = React.forwardRef<HTMLDivElement, RadioGroupProps>(\n  function RadioGroup({ className, asChild, children, ...props }, ref) {\n    const styles = useStyles()\n    const child = asChild ? onlySlotChild(children) : undefined\n\n    return (\n      <RadioGroupBase\n        ref={ref}\n        data-slot=\"radio-group\"\n        {...{ [SLOT_ATTR]: \"radio-group\" }}\n        className={mergeClasses(styles.group, className)}\n        // Base UI types the group's handlers for its <div>, which is the element rendered; the\n        // caller's div-typed handlers receive exactly the events they declare.\n        {...(props as RadioGroupBaseProps)}\n        {...(child ? { render: child } : { children })}\n      />\n    )\n  }\n)\n\ntype RadioGroupItemOwnProps = {\n  /** The value this item submits and selects the group with. */\n  value: string\n  /** Whether the item should ignore user interaction. */\n  disabled?: boolean | undefined\n  /** Whether the user must choose this item before submitting a form. */\n  required?: boolean | undefined\n  /**\n   * @deprecated Has no effect. The group decides which item is checked, as it did on Radix, which\n   * ignored this prop.\n   */\n  checked?: boolean | undefined\n  /**\n   * @deprecated Has no effect. The indicator is the item's only child, so on Radix this rendered\n   * the indicator as the item rather than an element of yours. Remove it.\n   */\n  asChild?: boolean | undefined\n}\n\n// `name` belongs to the group, which submits it, so it is not an item prop, as on Radix.\nexport type RadioGroupItemProps = Omit<\n  React.ComponentPropsWithRef<\"button\">,\n  keyof RadioGroupItemOwnProps | \"name\"\n> &\n  RadioGroupItemOwnProps\n\n// Base UI renders a <span> by default and moves the caller's id onto its hidden input. A native\n// button keeps the id, the HTMLButtonElement ref, native disabled and <label for> as Radix had them.\nconst ITEM_ELEMENT = <button type=\"button\" />\n\nexport const RadioGroupItem = React.forwardRef<\n  HTMLButtonElement,\n  RadioGroupItemProps\n>(function RadioGroupItem(\n  { className, children, asChild: _asChild, checked: _checked, ...props },\n  ref\n) {\n  const styles = useStyles()\n\n  return (\n    <Radio.Root\n      ref={ref}\n      nativeButton\n      render={ITEM_ELEMENT}\n      data-slot=\"radio-group-item\"\n      {...{ [SLOT_ATTR]: \"radio-group-item\" }}\n      className={mergeClasses(styles.item, className)}\n      // Base UI types the item's handlers for its default <span>; the element is the button above.\n      {...(props as Radio.Root.Props<string>)}\n    >\n      <Radio.Indicator\n        data-slot=\"radio-group-indicator\"\n        {...{ [SLOT_ATTR]: \"radio-group-indicator\" }}\n        className={styles.indicator}\n      >\n        <CircleIcon className={styles.icon} />\n      </Radio.Indicator>\n      {children}\n    </Radio.Root>\n  )\n})\n"],"names":["CircleIcon","React","props","ref","jsx","useStyles","makeZenithStyles","shorthands","tokens.spacingElement3","nativeControl","tokens.accentA7","tokens.accentSoft","tokens.accentOnSoft","tokens.focusRing","tokens.grayA3","tokens.accentSolid","tokens.accentContrast","tokens.errorSoft","tokens.errorA8","tokens.errorA10","boxModel","onlySlotChild","children","elements","RadioGroup","className","asChild","styles","child","RadioGroupBase","SLOT_ATTR","mergeClasses","ITEM_ELEMENT","RadioGroupItem","_asChild","_checked","jsxs","Radio"],"mappings":"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"}
+{"version":3,"file":"radio.js","sources":["../../../src/components/radio/radio.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { Radio } from \"@base-ui/react/radio\"\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1/core\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel, nativeControl } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\nimport {\n  RadioGroupBase,\n  type RadioGroupBaseProps,\n  type RadioGroupOrientation,\n} from \"./radio-group-base\"\n\nconst CircleIcon = React.forwardRef<SVGSVGElement, React.ComponentProps<\"svg\">>(\n  function CircleIcon(props, ref) {\n    return (\n      <svg\n        ref={ref}\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"currentColor\"\n        stroke=\"currentColor\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        {...props}\n      >\n        <circle cx=\"12\" cy=\"12\" r=\"10\" />\n      </svg>\n    )\n  }\n)\n\nconst useStyles = makeZenithStyles({\n  group: {\n    display: \"grid\",\n    ...shorthands.gap(tokens.spacingElement3),\n  },\n  item: {\n    ...nativeControl,\n    boxSizing: \"border-box\",\n    display: \"inline-flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    position: \"relative\",\n    aspectRatio: \"1 / 1\",\n    width: \"1rem\",\n    height: \"1rem\",\n    flexShrink: 0,\n    borderRadius: \"9999px\",\n    ...shorthands.border(\"1px\", \"solid\", tokens.accentA7),\n    backgroundColor: tokens.accentSoft,\n    color: tokens.accentOnSoft,\n    // Tailwind `shadow-xs` — literal per CONVENTIONS B7\n    boxShadow: \"0 1px 2px 0 #0000000d\",\n    transitionProperty: \"color, box-shadow\",\n    transitionDuration: \"150ms\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    \"@media (prefers-reduced-motion: reduce)\": {\n      transitionDuration: \"0.01ms\",\n    },\n    \":focus-visible\": {\n      outlineOffset: \"2px\",\n      outlineWidth: \"2px\",\n      outlineStyle: \"solid\",\n      outlineColor: tokens.focusRing,\n    },\n    \"&[data-disabled]\": {\n      cursor: \"not-allowed\",\n      backgroundColor: tokens.grayA3,\n      ...shorthands.borderColor(\"transparent\"),\n    },\n    \"&[data-checked]\": {\n      backgroundColor: tokens.accentSolid,\n      color: tokens.accentContrast,\n    },\n    \"&[data-checked][data-disabled]\": {\n      backgroundColor: tokens.grayA3,\n    },\n    \"&[aria-invalid='true'], &[data-invalid]\": {\n      backgroundColor: tokens.errorSoft,\n      ...shorthands.borderColor(tokens.errorA8),\n      outlineColor: tokens.focusRing,\n    },\n    \"&[data-checked][aria-invalid='true'], &[data-checked][data-invalid]\": {\n      backgroundColor: tokens.errorA10,\n      ...shorthands.borderColor(\"transparent\"),\n    },\n  },\n  indicator: {\n    ...boxModel,\n    position: \"relative\",\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    width: \"100%\",\n    height: \"100%\",\n  },\n  icon: {\n    ...boxModel,\n    color: tokens.accentContrast,\n    position: \"absolute\",\n    top: \"50%\",\n    left: \"50%\",\n    width: \"0.5rem\",\n    height: \"0.5rem\",\n    transform: \"translate(-50%, -50%)\",\n    pointerEvents: \"none\",\n  },\n})\n\n/**\n * What `onValueChange` receives as its second argument: Base UI's change details, declared in\n * Zenith so that none of Base UI's internals reach the published declarations, where TypeScript 4\n * cannot parse them.\n */\nexport type RadioGroupChangeDetails = {\n  /** Why the value changed. Base UI reports every radio group change as `none`. */\n  reason: \"none\"\n  /** The native event behind the change. */\n  event: Event\n  /** Keeps the group's current value. */\n  cancel: () => void\n  /** Lets the event propagate where the group would otherwise stop it. */\n  allowPropagation: () => void\n  isCanceled: boolean\n  isPropagationAllowed: boolean\n  /** The element that caused the change, if any. */\n  trigger: Element | undefined\n}\n\ntype RadioGroupRootProps = {\n  /**\n   * The controlled value of the radio item that should be currently selected.\n   *\n   * To render an uncontrolled radio group, use the `defaultValue` prop instead.\n   */\n  value?: string | null | undefined\n  /** The value of the radio item that should be initially selected. */\n  defaultValue?: string | undefined\n  /** Event handler called when the value changes. */\n  onValueChange?:\n    ((value: string, eventDetails: RadioGroupChangeDetails) => void) | undefined\n  /** Whether the component should ignore user interaction. */\n  disabled?: boolean | undefined\n  /** Whether the user must choose a value before submitting a form. */\n  required?: boolean | undefined\n  /** Identifies the field when a form is submitted. */\n  name?: string | undefined\n  /**\n   * The axis the arrow keys move along. When set, only that axis' keys move between the options\n   * (Up and Down for `vertical`) and it is restated as `aria-orientation`. Unset, all four work.\n   */\n  orientation?: RadioGroupOrientation | undefined\n  /** The reading direction, which decides what Left and Right mean. */\n  dir?: \"ltr\" | \"rtl\" | undefined\n  /** Whether the arrow keys wrap from the last option to the first and back. Defaults to `true`. */\n  loop?: boolean | undefined\n  /** Renders the single child element as the group, merging the group's props and behaviour onto it. */\n  asChild?: boolean | undefined\n}\n\nexport type RadioGroupProps = Omit<\n  React.ComponentPropsWithRef<\"div\">,\n  keyof RadioGroupRootProps\n> &\n  RadioGroupRootProps\n\n// A single child can arrive wrapped in a one-element array depending on the JSX runtime, which\n// Radix's Slot normalised.\nfunction onlySlotChild(children: React.ReactNode) {\n  const elements = React.Children.toArray(children).filter(React.isValidElement)\n  return elements.length === 1 ? elements[0] : undefined\n}\n\nexport const RadioGroup = React.forwardRef<HTMLDivElement, RadioGroupProps>(\n  function RadioGroup({ className, asChild, children, ...props }, ref) {\n    const styles = useStyles()\n    const child = asChild ? onlySlotChild(children) : undefined\n\n    return (\n      <RadioGroupBase\n        ref={ref}\n        data-slot=\"radio-group\"\n        {...{ [SLOT_ATTR]: \"radio-group\" }}\n        className={mergeClasses(styles.group, className)}\n        // Base UI types the group's handlers for its <div>, which is the element rendered; the\n        // caller's div-typed handlers receive exactly the events they declare.\n        {...(props as RadioGroupBaseProps)}\n        {...(child ? { render: child } : { children })}\n      />\n    )\n  }\n)\n\ntype RadioGroupItemOwnProps = {\n  /** The value this item submits and selects the group with. */\n  value: string\n  /** Whether the item should ignore user interaction. */\n  disabled?: boolean | undefined\n  /** Whether the user must choose this item before submitting a form. */\n  required?: boolean | undefined\n  /**\n   * @deprecated Has no effect. The group decides which item is checked, as it did on Radix, which\n   * ignored this prop.\n   */\n  checked?: boolean | undefined\n  /**\n   * @deprecated Has no effect. The indicator is the item's only child, so on Radix this rendered\n   * the indicator as the item rather than an element of yours. Remove it.\n   */\n  asChild?: boolean | undefined\n}\n\n// `name` belongs to the group, which submits it, so it is not an item prop, as on Radix.\nexport type RadioGroupItemProps = Omit<\n  React.ComponentPropsWithRef<\"button\">,\n  keyof RadioGroupItemOwnProps | \"name\"\n> &\n  RadioGroupItemOwnProps\n\n// Base UI renders a <span> by default and moves the caller's id onto its hidden input. A native\n// button keeps the id, the HTMLButtonElement ref, native disabled and <label for> as Radix had them.\nconst ITEM_ELEMENT = <button type=\"button\" />\n\nexport const RadioGroupItem = React.forwardRef<\n  HTMLButtonElement,\n  RadioGroupItemProps\n>(function RadioGroupItem(\n  { className, children, asChild: _asChild, checked: _checked, ...props },\n  ref\n) {\n  const styles = useStyles()\n\n  return (\n    <Radio.Root\n      ref={ref}\n      nativeButton\n      render={ITEM_ELEMENT}\n      data-slot=\"radio-group-item\"\n      {...{ [SLOT_ATTR]: \"radio-group-item\" }}\n      className={mergeClasses(styles.item, className)}\n      // Base UI types the item's handlers for its default <span>; the element is the button above.\n      {...(props as Radio.Root.Props<string>)}\n    >\n      <Radio.Indicator\n        data-slot=\"radio-group-indicator\"\n        {...{ [SLOT_ATTR]: \"radio-group-indicator\" }}\n        className={styles.indicator}\n      >\n        <CircleIcon className={styles.icon} />\n      </Radio.Indicator>\n      {children}\n    </Radio.Root>\n  )\n})\n"],"names":["CircleIcon","React","props","ref","jsx","useStyles","makeZenithStyles","shorthands","tokens.spacingElement3","nativeControl","tokens.accentA7","tokens.accentSoft","tokens.accentOnSoft","tokens.focusRing","tokens.grayA3","tokens.accentSolid","tokens.accentContrast","tokens.errorSoft","tokens.errorA8","tokens.errorA10","boxModel","onlySlotChild","children","elements","RadioGroup","className","asChild","styles","child","RadioGroupBase","SLOT_ATTR","mergeClasses","ITEM_ELEMENT","RadioGroupItem","_asChild","_checked","jsxs","Radio"],"mappings":"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"}

package/dist/components/scroll-area/scroll-area.js

@@ -3,7 +3,7 @@ import * as e from "react";
 import { CSPProvider as D } from "../../_virtual/_zenith-runtime-family_csp-provider.js";
 import { DirectionProvider as L } from "../../_virtual/_zenith-runtime-family_direction-provider.js";
 import { ScrollArea as m } from "../../_virtual/_zenith-runtime-family_scroll-area.js";
-import { mergeClasses as x, SLOT_ATTR as a, shorthands as g } from "@epilot/zenith-runtime/v1";
+import { mergeClasses as x, SLOT_ATTR as a, shorthands as g } from "@epilot/zenith-runtime/v1/core.js";
 import { makeZenithStyles as M } from "../../styles/make-styles.js";
 import { boxModel as _ } from "../../styles/host-reset.js";
 import { grayA9 as q, grayA11 as I, grayA10 as X, focusRing as Y } from "../../tokens/index.js";

package/dist/components/scroll-area/scroll-area.js.map

@@ -1 +1 @@
-{"version":3,"file":"scroll-area.js","sources":["../../../src/components/scroll-area/scroll-area.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { CSPProvider } from \"@base-ui/react/csp-provider\"\nimport { DirectionProvider } from \"@base-ui/react/direction-provider\"\nimport { ScrollArea as Primitive } from \"@base-ui/react/scroll-area\"\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\nimport { useScrollbarStyles } from \"./scrollbar-styles\"\n\nexport type ScrollAreaOrientation = \"vertical\" | \"horizontal\" | \"both\"\nexport type ScrollAreaVisibility = \"interaction\" | \"always\"\ntype Direction = \"ltr\" | \"rtl\"\n// Declared in Zenith in their Radix-era shape, a div's props, not derived from Base UI's, whose\n// types would carry its internals into the published declarations.\nexport type ScrollAreaProps = Omit<\n  React.ComponentPropsWithoutRef<\"div\">,\n  \"dir\"\n> & {\n  /** Text direction of the region and of its thumb positions. Defaults to `ltr`. */\n  dir?: Direction\n  orientation?: ScrollAreaOrientation\n  visibility?: ScrollAreaVisibility\n}\nexport type ScrollAreaViewportProps = React.ComponentPropsWithoutRef<\"div\">\n\nconst Context = React.createContext<{\n  orientation: ScrollAreaOrientation\n  onScroll: () => void\n} | null>(null)\n\nconst useStyles = makeZenithStyles({\n  root: {\n    ...boxModel,\n    position: \"relative\",\n    minWidth: 0,\n    minHeight: 0,\n    ...shorthands.overflow(\"hidden\"),\n    [`&[data-revealed='true'] > [${SLOT_ATTR}='scroll-area-scrollbar']`]: {\n      opacity: 1,\n      pointerEvents: \"auto\",\n    },\n    \"@media (forced-colors: active)\": {\n      [`& > [${SLOT_ATTR}='scroll-area-scrollbar']`]: {\n        opacity: 1,\n        pointerEvents: \"auto\",\n        backgroundColor: \"Canvas\",\n      },\n    },\n  },\n  viewport: {\n    width: \"100%\",\n    height: \"100%\",\n    minWidth: 0,\n    minHeight: 0,\n    boxSizing: \"border-box\",\n    borderRadius: \"inherit\",\n    // The tracks replace the native scrollbars. Zenith's stylesheet hides them, so no inline\n    // <style> needs a nonce (Radix's took the viewport's).\n    scrollbarWidth: \"none\",\n    \"::-webkit-scrollbar\": { display: \"none\" },\n    \":focus-visible\": {\n      outlineWidth: \"3px\",\n      outlineStyle: \"solid\",\n      outlineColor: tokens.focusRing,\n      outlineOffset: \"-3px\",\n    },\n  },\n  // The content wrapper keeps Radix's display:table, which grows to the content's width...\n  content: { display: \"table\" },\n  // ...except in a vertical area, where that would expand long lines past the viewport.\n  verticalContent: { display: \"block\" },\n  reserveVertical: { paddingInlineEnd: \"12px\" },\n  reserveHorizontal: { paddingBottom: \"12px\" },\n  track: {\n    boxSizing: \"border-box\",\n    backgroundColor: \"transparent\",\n    opacity: 0,\n    pointerEvents: \"none\",\n    transitionProperty: \"opacity\",\n    transitionDuration: \"120ms\",\n    \"@media (prefers-reduced-motion: reduce)\": { transitionDuration: \"0s\" },\n    [`&:hover > [${SLOT_ATTR}='scroll-area-thumb']`]: {\n      backgroundColor: tokens.grayA10,\n    },\n    [`&:active > [${SLOT_ATTR}='scroll-area-thumb']`]: {\n      backgroundColor: tokens.grayA11,\n    },\n    \"@media (forced-colors: active)\": {\n      [`& > [${SLOT_ATTR}='scroll-area-thumb']`]: {\n        backgroundColor: \"ButtonText\",\n        forcedColorAdjust: \"none\",\n      },\n    },\n  },\n  // The 3px inset along the scroll axis is margin, not padding. With both tracks shown, Base UI\n  // 1.7.0 sizes the thumb from the track's offsetHeight/offsetWidth without subtracting its padding,\n  // which lengthened the thumb by the padding's share; a margin shrinks the track box instead, so\n  // the thumb keeps Radix's length on every orientation.\n  vertical: {\n    width: \"12px\",\n    ...shorthands.padding(\"0\", \"3px\"),\n    ...shorthands.margin(\"3px\", \"0\"),\n  },\n  horizontal: {\n    height: \"12px\",\n    flexDirection: \"column\",\n    ...shorthands.padding(\"3px\", \"0\"),\n    ...shorthands.margin(\"0\", \"3px\"),\n  },\n  thumb: { backgroundColor: tokens.grayA9 },\n  // Base UI owns thumb length (including its 16px minimum) and uses it in drag math.\n  // A CSS-only minimum overrides the paint but not that math, overshooting the track.\n  corner: { backgroundColor: \"transparent\", pointerEvents: \"none\" },\n})\n\n/** Native scrolling with Base UI tracks. Dimensions belong here; scroll refs belong to the viewport. */\nexport const ScrollArea = React.forwardRef<HTMLDivElement, ScrollAreaProps>(\n  function ScrollArea(\n    {\n      dir = \"ltr\",\n      orientation = \"vertical\",\n      visibility = \"interaction\",\n      className,\n      children,\n      onPointerEnter,\n      onPointerLeave,\n      onFocusCapture,\n      onBlurCapture,\n      ...props\n    },\n    ref\n  ) {\n    const styles = useStyles()\n    const scrollbar = useScrollbarStyles()\n    const root = React.useRef<HTMLDivElement | null>(null)\n    const timer = React.useRef<ReturnType<typeof setTimeout> | undefined>(\n      undefined\n    )\n    const interaction = React.useRef({\n      hover: false,\n      focus: false,\n      drag: false,\n    })\n    const [revealed, setRevealed] = React.useState(false)\n    const clear = React.useCallback(() => {\n      clearTimeout(timer.current)\n    }, [])\n    const reveal = React.useCallback(() => {\n      clear()\n      setRevealed(true)\n    }, [clear])\n    const settle = React.useCallback(() => {\n      clear()\n      if (!Object.values(interaction.current).some(Boolean)) {\n        timer.current = setTimeout(() => setRevealed(false), 600)\n      }\n    }, [clear])\n    const pulse = React.useCallback(() => {\n      reveal()\n      settle()\n    }, [reveal, settle])\n    React.useEffect(() => {\n      const doc = root.current?.ownerDocument\n      const endDrag = () => {\n        if (interaction.current.drag) {\n          interaction.current.drag = false\n          settle()\n        }\n      }\n      doc?.addEventListener(\"pointerup\", endDrag, true)\n      doc?.addEventListener(\"pointercancel\", endDrag, true)\n      return () => {\n        clear()\n        doc?.removeEventListener(\"pointerup\", endDrag, true)\n        doc?.removeEventListener(\"pointercancel\", endDrag, true)\n      }\n    }, [clear, settle])\n    const context = React.useMemo(\n      () => ({ orientation, onScroll: pulse }),\n      [orientation, pulse]\n    )\n    const tracks =\n      orientation === \"both\"\n        ? ([\"vertical\", \"horizontal\"] as const)\n        : [orientation]\n    return (\n      <Context.Provider value={context}>\n        {/* Radix stamped and computed with ltr unless told otherwise; Base UI reads context. */}\n        <DirectionProvider direction={dir}>\n          {/* The viewport's styles hide the native scrollbars, so Base UI's <style> is not rendered. */}\n          <CSPProvider disableStyleElements>\n            <Primitive.Root\n              {...props}\n              dir={dir}\n              ref={(node) => {\n                root.current = node\n                if (typeof ref === \"function\") ref(node)\n                else if (ref) ref.current = node\n              }}\n              data-slot=\"scroll-area\"\n              {...{ [SLOT_ATTR]: \"scroll-area\" }}\n              data-orientation={orientation}\n              data-revealed={visibility === \"always\" || revealed}\n              className={mergeClasses(styles.root, className)}\n              onPointerEnter={(event) => {\n                if (event.pointerType !== \"touch\") {\n                  interaction.current.hover = true\n                  reveal()\n                }\n                onPointerEnter?.(event)\n              }}\n              onPointerLeave={(event) => {\n                interaction.current.hover = false\n                settle()\n                onPointerLeave?.(event)\n              }}\n              onFocusCapture={(event) => {\n                interaction.current.focus = true\n                reveal()\n                onFocusCapture?.(event)\n              }}\n              onBlurCapture={(event) => {\n                if (!event.currentTarget.contains(event.relatedTarget)) {\n                  interaction.current.focus = false\n                  settle()\n                }\n                onBlurCapture?.(event)\n              }}\n            >\n              {/* Base UI parts the caller renders inside keep their own style elements. */}\n              <CSPProvider>\n                {children}\n                {tracks.map((axis) => (\n                  <Primitive.Scrollbar\n                    key={axis}\n                    orientation={axis}\n                    data-slot=\"scroll-area-scrollbar\"\n                    {...{ [SLOT_ATTR]: \"scroll-area-scrollbar\" }}\n                    className={mergeClasses(\n                      scrollbar.track,\n                      styles.track,\n                      styles[axis]\n                    )}\n                    onPointerDown={() => {\n                      interaction.current.drag = true\n                      reveal()\n                    }}\n                  >\n                    <Primitive.Thumb\n                      data-slot=\"scroll-area-thumb\"\n                      {...{ [SLOT_ATTR]: \"scroll-area-thumb\" }}\n                      className={mergeClasses(scrollbar.thumb, styles.thumb)}\n                    />\n                  </Primitive.Scrollbar>\n                ))}\n                {orientation === \"both\" && (\n                  <Primitive.Corner className={styles.corner} />\n                )}\n              </CSPProvider>\n            </Primitive.Root>\n          </CSPProvider>\n        </DirectionProvider>\n      </Context.Provider>\n    )\n  }\n)\n\n/** Put keyboard focus, accessible naming and onScroll on this actual scroll element. */\nexport const ScrollAreaViewport = React.forwardRef<\n  HTMLDivElement,\n  ScrollAreaViewportProps\n>(function ScrollAreaViewport(\n  // No inline <style> is rendered, so Radix's nonce has nothing left to unlock.\n  { className, style, onScroll, children, nonce: _nonce, ...props },\n  ref\n) {\n  const context = React.useContext(Context)\n  const styles = useStyles()\n  if (!context)\n    throw new Error(\"ScrollAreaViewport requires a ScrollArea parent\")\n  const { orientation } = context\n  return (\n    <Primitive.Viewport\n      {...props}\n      ref={ref}\n      data-slot=\"scroll-area-viewport\"\n      {...{ [SLOT_ATTR]: \"scroll-area-viewport\" }}\n      className={mergeClasses(\n        styles.viewport,\n        orientation !== \"horizontal\" && styles.reserveVertical,\n        orientation !== \"vertical\" && styles.reserveHorizontal,\n        className\n      )}\n      // Only axes with a track scroll, as Radix enabled overflow per mounted scrollbar.\n      style={{\n        overflowX: orientation === \"vertical\" ? \"hidden\" : \"scroll\",\n        overflowY: orientation === \"horizontal\" ? \"hidden\" : \"scroll\",\n        ...style,\n      }}\n      onScroll={(event) => {\n        if (event.target === event.currentTarget) {\n          context.onScroll()\n          onScroll?.(event)\n        }\n      }}\n    >\n      <Primitive.Content\n        className={mergeClasses(\n          styles.content,\n          orientation === \"vertical\" && styles.verticalContent\n        )}\n        // Over Base UI's fit-content, which would widen a vertical area to its widest line.\n        style={{ minWidth: \"100%\" }}\n      >\n        {children}\n      </Primitive.Content>\n    </Primitive.Viewport>\n  )\n})\n"],"names":["Context","React","useStyles","makeZenithStyles","boxModel","shorthands","SLOT_ATTR","tokens.focusRing","tokens.grayA10","tokens.grayA11","tokens.grayA9","ScrollArea","dir","orientation","visibility","className","children","onPointerEnter","onPointerLeave","onFocusCapture","onBlurCapture","props","ref","styles","scrollbar","useScrollbarStyles","root","timer","interaction","revealed","setRevealed","clear","reveal","settle","pulse","doc","_a","endDrag","context","tracks","jsx","DirectionProvider","CSPProvider","Primitive","node","mergeClasses","event","axis","ScrollAreaViewport","style","onScroll","_nonce"],"mappings":"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"}
+{"version":3,"file":"scroll-area.js","sources":["../../../src/components/scroll-area/scroll-area.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { CSPProvider } from \"@base-ui/react/csp-provider\"\nimport { DirectionProvider } from \"@base-ui/react/direction-provider\"\nimport { ScrollArea as Primitive } from \"@base-ui/react/scroll-area\"\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1/core\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\nimport { useScrollbarStyles } from \"./scrollbar-styles\"\n\nexport type ScrollAreaOrientation = \"vertical\" | \"horizontal\" | \"both\"\nexport type ScrollAreaVisibility = \"interaction\" | \"always\"\ntype Direction = \"ltr\" | \"rtl\"\n// Declared in Zenith in their Radix-era shape, a div's props, not derived from Base UI's, whose\n// types would carry its internals into the published declarations.\nexport type ScrollAreaProps = Omit<\n  React.ComponentPropsWithoutRef<\"div\">,\n  \"dir\"\n> & {\n  /** Text direction of the region and of its thumb positions. Defaults to `ltr`. */\n  dir?: Direction\n  orientation?: ScrollAreaOrientation\n  visibility?: ScrollAreaVisibility\n}\nexport type ScrollAreaViewportProps = React.ComponentPropsWithoutRef<\"div\">\n\nconst Context = React.createContext<{\n  orientation: ScrollAreaOrientation\n  onScroll: () => void\n} | null>(null)\n\nconst useStyles = makeZenithStyles({\n  root: {\n    ...boxModel,\n    position: \"relative\",\n    minWidth: 0,\n    minHeight: 0,\n    ...shorthands.overflow(\"hidden\"),\n    [`&[data-revealed='true'] > [${SLOT_ATTR}='scroll-area-scrollbar']`]: {\n      opacity: 1,\n      pointerEvents: \"auto\",\n    },\n    \"@media (forced-colors: active)\": {\n      [`& > [${SLOT_ATTR}='scroll-area-scrollbar']`]: {\n        opacity: 1,\n        pointerEvents: \"auto\",\n        backgroundColor: \"Canvas\",\n      },\n    },\n  },\n  viewport: {\n    width: \"100%\",\n    height: \"100%\",\n    minWidth: 0,\n    minHeight: 0,\n    boxSizing: \"border-box\",\n    borderRadius: \"inherit\",\n    // The tracks replace the native scrollbars. Zenith's stylesheet hides them, so no inline\n    // <style> needs a nonce (Radix's took the viewport's).\n    scrollbarWidth: \"none\",\n    \"::-webkit-scrollbar\": { display: \"none\" },\n    \":focus-visible\": {\n      outlineWidth: \"3px\",\n      outlineStyle: \"solid\",\n      outlineColor: tokens.focusRing,\n      outlineOffset: \"-3px\",\n    },\n  },\n  // The content wrapper keeps Radix's display:table, which grows to the content's width...\n  content: { display: \"table\" },\n  // ...except in a vertical area, where that would expand long lines past the viewport.\n  verticalContent: { display: \"block\" },\n  reserveVertical: { paddingInlineEnd: \"12px\" },\n  reserveHorizontal: { paddingBottom: \"12px\" },\n  track: {\n    boxSizing: \"border-box\",\n    backgroundColor: \"transparent\",\n    opacity: 0,\n    pointerEvents: \"none\",\n    transitionProperty: \"opacity\",\n    transitionDuration: \"120ms\",\n    \"@media (prefers-reduced-motion: reduce)\": { transitionDuration: \"0s\" },\n    [`&:hover > [${SLOT_ATTR}='scroll-area-thumb']`]: {\n      backgroundColor: tokens.grayA10,\n    },\n    [`&:active > [${SLOT_ATTR}='scroll-area-thumb']`]: {\n      backgroundColor: tokens.grayA11,\n    },\n    \"@media (forced-colors: active)\": {\n      [`& > [${SLOT_ATTR}='scroll-area-thumb']`]: {\n        backgroundColor: \"ButtonText\",\n        forcedColorAdjust: \"none\",\n      },\n    },\n  },\n  // The 3px inset along the scroll axis is margin, not padding. With both tracks shown, Base UI\n  // 1.7.0 sizes the thumb from the track's offsetHeight/offsetWidth without subtracting its padding,\n  // which lengthened the thumb by the padding's share; a margin shrinks the track box instead, so\n  // the thumb keeps Radix's length on every orientation.\n  vertical: {\n    width: \"12px\",\n    ...shorthands.padding(\"0\", \"3px\"),\n    ...shorthands.margin(\"3px\", \"0\"),\n  },\n  horizontal: {\n    height: \"12px\",\n    flexDirection: \"column\",\n    ...shorthands.padding(\"3px\", \"0\"),\n    ...shorthands.margin(\"0\", \"3px\"),\n  },\n  thumb: { backgroundColor: tokens.grayA9 },\n  // Base UI owns thumb length (including its 16px minimum) and uses it in drag math.\n  // A CSS-only minimum overrides the paint but not that math, overshooting the track.\n  corner: { backgroundColor: \"transparent\", pointerEvents: \"none\" },\n})\n\n/** Native scrolling with Base UI tracks. Dimensions belong here; scroll refs belong to the viewport. */\nexport const ScrollArea = React.forwardRef<HTMLDivElement, ScrollAreaProps>(\n  function ScrollArea(\n    {\n      dir = \"ltr\",\n      orientation = \"vertical\",\n      visibility = \"interaction\",\n      className,\n      children,\n      onPointerEnter,\n      onPointerLeave,\n      onFocusCapture,\n      onBlurCapture,\n      ...props\n    },\n    ref\n  ) {\n    const styles = useStyles()\n    const scrollbar = useScrollbarStyles()\n    const root = React.useRef<HTMLDivElement | null>(null)\n    const timer = React.useRef<ReturnType<typeof setTimeout> | undefined>(\n      undefined\n    )\n    const interaction = React.useRef({\n      hover: false,\n      focus: false,\n      drag: false,\n    })\n    const [revealed, setRevealed] = React.useState(false)\n    const clear = React.useCallback(() => {\n      clearTimeout(timer.current)\n    }, [])\n    const reveal = React.useCallback(() => {\n      clear()\n      setRevealed(true)\n    }, [clear])\n    const settle = React.useCallback(() => {\n      clear()\n      if (!Object.values(interaction.current).some(Boolean)) {\n        timer.current = setTimeout(() => setRevealed(false), 600)\n      }\n    }, [clear])\n    const pulse = React.useCallback(() => {\n      reveal()\n      settle()\n    }, [reveal, settle])\n    React.useEffect(() => {\n      const doc = root.current?.ownerDocument\n      const endDrag = () => {\n        if (interaction.current.drag) {\n          interaction.current.drag = false\n          settle()\n        }\n      }\n      doc?.addEventListener(\"pointerup\", endDrag, true)\n      doc?.addEventListener(\"pointercancel\", endDrag, true)\n      return () => {\n        clear()\n        doc?.removeEventListener(\"pointerup\", endDrag, true)\n        doc?.removeEventListener(\"pointercancel\", endDrag, true)\n      }\n    }, [clear, settle])\n    const context = React.useMemo(\n      () => ({ orientation, onScroll: pulse }),\n      [orientation, pulse]\n    )\n    const tracks =\n      orientation === \"both\"\n        ? ([\"vertical\", \"horizontal\"] as const)\n        : [orientation]\n    return (\n      <Context.Provider value={context}>\n        {/* Radix stamped and computed with ltr unless told otherwise; Base UI reads context. */}\n        <DirectionProvider direction={dir}>\n          {/* The viewport's styles hide the native scrollbars, so Base UI's <style> is not rendered. */}\n          <CSPProvider disableStyleElements>\n            <Primitive.Root\n              {...props}\n              dir={dir}\n              ref={(node) => {\n                root.current = node\n                if (typeof ref === \"function\") ref(node)\n                else if (ref) ref.current = node\n              }}\n              data-slot=\"scroll-area\"\n              {...{ [SLOT_ATTR]: \"scroll-area\" }}\n              data-orientation={orientation}\n              data-revealed={visibility === \"always\" || revealed}\n              className={mergeClasses(styles.root, className)}\n              onPointerEnter={(event) => {\n                if (event.pointerType !== \"touch\") {\n                  interaction.current.hover = true\n                  reveal()\n                }\n                onPointerEnter?.(event)\n              }}\n              onPointerLeave={(event) => {\n                interaction.current.hover = false\n                settle()\n                onPointerLeave?.(event)\n              }}\n              onFocusCapture={(event) => {\n                interaction.current.focus = true\n                reveal()\n                onFocusCapture?.(event)\n              }}\n              onBlurCapture={(event) => {\n                if (!event.currentTarget.contains(event.relatedTarget)) {\n                  interaction.current.focus = false\n                  settle()\n                }\n                onBlurCapture?.(event)\n              }}\n            >\n              {/* Base UI parts the caller renders inside keep their own style elements. */}\n              <CSPProvider>\n                {children}\n                {tracks.map((axis) => (\n                  <Primitive.Scrollbar\n                    key={axis}\n                    orientation={axis}\n                    data-slot=\"scroll-area-scrollbar\"\n                    {...{ [SLOT_ATTR]: \"scroll-area-scrollbar\" }}\n                    className={mergeClasses(\n                      scrollbar.track,\n                      styles.track,\n                      styles[axis]\n                    )}\n                    onPointerDown={() => {\n                      interaction.current.drag = true\n                      reveal()\n                    }}\n                  >\n                    <Primitive.Thumb\n                      data-slot=\"scroll-area-thumb\"\n                      {...{ [SLOT_ATTR]: \"scroll-area-thumb\" }}\n                      className={mergeClasses(scrollbar.thumb, styles.thumb)}\n                    />\n                  </Primitive.Scrollbar>\n                ))}\n                {orientation === \"both\" && (\n                  <Primitive.Corner className={styles.corner} />\n                )}\n              </CSPProvider>\n            </Primitive.Root>\n          </CSPProvider>\n        </DirectionProvider>\n      </Context.Provider>\n    )\n  }\n)\n\n/** Put keyboard focus, accessible naming and onScroll on this actual scroll element. */\nexport const ScrollAreaViewport = React.forwardRef<\n  HTMLDivElement,\n  ScrollAreaViewportProps\n>(function ScrollAreaViewport(\n  // No inline <style> is rendered, so Radix's nonce has nothing left to unlock.\n  { className, style, onScroll, children, nonce: _nonce, ...props },\n  ref\n) {\n  const context = React.useContext(Context)\n  const styles = useStyles()\n  if (!context)\n    throw new Error(\"ScrollAreaViewport requires a ScrollArea parent\")\n  const { orientation } = context\n  return (\n    <Primitive.Viewport\n      {...props}\n      ref={ref}\n      data-slot=\"scroll-area-viewport\"\n      {...{ [SLOT_ATTR]: \"scroll-area-viewport\" }}\n      className={mergeClasses(\n        styles.viewport,\n        orientation !== \"horizontal\" && styles.reserveVertical,\n        orientation !== \"vertical\" && styles.reserveHorizontal,\n        className\n      )}\n      // Only axes with a track scroll, as Radix enabled overflow per mounted scrollbar.\n      style={{\n        overflowX: orientation === \"vertical\" ? \"hidden\" : \"scroll\",\n        overflowY: orientation === \"horizontal\" ? \"hidden\" : \"scroll\",\n        ...style,\n      }}\n      onScroll={(event) => {\n        if (event.target === event.currentTarget) {\n          context.onScroll()\n          onScroll?.(event)\n        }\n      }}\n    >\n      <Primitive.Content\n        className={mergeClasses(\n          styles.content,\n          orientation === \"vertical\" && styles.verticalContent\n        )}\n        // Over Base UI's fit-content, which would widen a vertical area to its widest line.\n        style={{ minWidth: \"100%\" }}\n      >\n        {children}\n      </Primitive.Content>\n    </Primitive.Viewport>\n  )\n})\n"],"names":["Context","React","useStyles","makeZenithStyles","boxModel","shorthands","SLOT_ATTR","tokens.focusRing","tokens.grayA10","tokens.grayA11","tokens.grayA9","ScrollArea","dir","orientation","visibility","className","children","onPointerEnter","onPointerLeave","onFocusCapture","onBlurCapture","props","ref","styles","scrollbar","useScrollbarStyles","root","timer","interaction","revealed","setRevealed","clear","reveal","settle","pulse","doc","_a","endDrag","context","tracks","jsx","DirectionProvider","CSPProvider","Primitive","node","mergeClasses","event","axis","ScrollAreaViewport","style","onScroll","_nonce"],"mappings":"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"}

package/dist/components/scroll-area/scrollbar-styles.js

@@ -1,5 +1,5 @@
 import { makeZenithStyles as e } from "../../styles/make-styles.js";
-import { shorthands as o } from "@epilot/zenith-runtime/v1";
+import { shorthands as o } from "@epilot/zenith-runtime/v1/core.js";
 const i = e({
   track: {
     position: "relative",

package/dist/components/scroll-area/scrollbar-styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"scrollbar-styles.js","sources":["../../../src/components/scroll-area/scrollbar-styles.ts"],"sourcesContent":["import { makeZenithStyles } from \"../../styles/make-styles\"\nimport { shorthands } from \"@epilot/zenith-runtime/v1\"\n\n/** Shared mechanics only. Each consumer owns its size, colour and visibility policy. */\nexport const useScrollbarStyles = makeZenithStyles({\n  track: {\n    position: \"relative\",\n    display: \"flex\",\n    touchAction: \"none\",\n    userSelect: \"none\",\n  },\n  thumb: {\n    position: \"relative\",\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n    ...shorthands.borderRadius(\"9999px\"),\n  },\n})\n"],"names":["useScrollbarStyles","makeZenithStyles","shorthands"],"mappings":";;AAIO,MAAMA,IAAqBC,EAAiB;AAAA,EACjD,OAAO;AAAA,IACL,UAAU;AAAA,IACV,SAAS;AAAA,IACT,aAAa;AAAA,IACb,YAAY;AAAA,EAAA;AAAA,EAEd,OAAO;AAAA,IACL,UAAU;AAAA,IACV,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,GAAGC,EAAW,aAAa,QAAQ;AAAA,EAAA;AAEvC,CAAC;"}
+{"version":3,"file":"scrollbar-styles.js","sources":["../../../src/components/scroll-area/scrollbar-styles.ts"],"sourcesContent":["import { makeZenithStyles } from \"../../styles/make-styles\"\nimport { shorthands } from \"@epilot/zenith-runtime/v1/core\"\n\n/** Shared mechanics only. Each consumer owns its size, colour and visibility policy. */\nexport const useScrollbarStyles = makeZenithStyles({\n  track: {\n    position: \"relative\",\n    display: \"flex\",\n    touchAction: \"none\",\n    userSelect: \"none\",\n  },\n  thumb: {\n    position: \"relative\",\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n    ...shorthands.borderRadius(\"9999px\"),\n  },\n})\n"],"names":["useScrollbarStyles","makeZenithStyles","shorthands"],"mappings":";;AAIO,MAAMA,IAAqBC,EAAiB;AAAA,EACjD,OAAO;AAAA,IACL,UAAU;AAAA,IACV,SAAS;AAAA,IACT,aAAa;AAAA,IACb,YAAY;AAAA,EAAA;AAAA,EAEd,OAAO;AAAA,IACL,UAAU;AAAA,IACV,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,GAAGC,EAAW,aAAa,QAAQ;AAAA,EAAA;AAEvC,CAAC;"}

package/dist/components/scroll-overflow/scroll-overflow.js

@@ -3,15 +3,15 @@ import * as w from "react";
 import { CSPProvider as K } from "../../_virtual/_zenith-runtime-family_csp-provider.js";
 import { DirectionProvider as P } from "../../_virtual/_zenith-runtime-family_direction-provider.js";
 import { ScrollArea as g } from "../../_virtual/_zenith-runtime-family_scroll-area.js";
-import { mergeClasses as f, SLOT_ATTR as s, shorthands as i } from "@epilot/zenith-runtime/v1";
+import { mergeClasses as f, SLOT_ATTR as s, shorthands as i } from "@epilot/zenith-runtime/v1/core.js";
 import { makeZenithStyles as $ } from "../../styles/make-styles.js";
 import { boxModel as a, nativeControl as G } from "../../styles/host-reset.js";
-import { grayA8 as O, accentA8 as _, grayA12 as U, gray1 as X, radiusMd as Y, radiusSm as q } from "../../tokens/index.js";
-import { useScrollbarStyles as J } from "../scroll-area/scrollbar-styles.js";
+import { body as _, grayA8 as O, accentA8 as U, grayA12 as X, gray1 as Y, radiusMd as q, radiusSm as J } from "../../tokens/index.js";
+import { useScrollbarStyles as Q } from "../scroll-area/scrollbar-styles.js";
 function W() {
   return typeof window > "u" || !window.matchMedia || window.matchMedia("(prefers-reduced-motion: reduce)").matches ? "auto" : "smooth";
 }
-function Q(c = {}) {
+function oo(c = {}) {
   const { scrollStep: m = 200, orientation: z = "horizontal" } = c, h = w.useRef(null), [S, u] = w.useState(!1), [b, C] = w.useState(!1), [y, H] = w.useState(!1), n = z === "horizontal", p = w.useCallback(() => {
     const l = h.current;
     if (l)
@@ -61,7 +61,7 @@ function Q(c = {}) {
     scrollToEnd: A
   };
 }
-const oo = (c) => /* @__PURE__ */ t(
+const ro = (c) => /* @__PURE__ */ t(
   "svg",
   {
     viewBox: "0 0 16 16",
@@ -70,7 +70,7 @@ const oo = (c) => /* @__PURE__ */ t(
     ...c,
     children: /* @__PURE__ */ t("path", { d: "M 8.86 10.51 C 8.94 10.51 9.02 10.49 9.08 10.43 C 9.14 10.38 9.17 10.3 9.17 10.21 V 5.79 C 9.17 5.7 9.14 5.62 9.08 5.57 C 9.01 5.51 8.94 5.49 8.86 5.49 C 8.84 5.49 8.77 5.52 8.65 5.58 L 6.55 7.68 C 6.5 7.73 6.47 7.78 6.44 7.83 C 6.42 7.88 6.41 7.94 6.41 8 C 6.41 8.06 6.42 8.12 6.44 8.17 C 6.47 8.22 6.5 8.27 6.55 8.32 L 8.65 10.42 C 8.68 10.45 8.71 10.47 8.75 10.49 C 8.78 10.51 8.82 10.51 8.86 10.51 Z" })
   }
-), ro = (c) => /* @__PURE__ */ t(
+), to = (c) => /* @__PURE__ */ t(
   "svg",
   {
     viewBox: "0 0 16 16",
@@ -79,7 +79,7 @@ const oo = (c) => /* @__PURE__ */ t(
     ...c,
     children: /* @__PURE__ */ t("path", { d: "M7.14 10.51C7.06 10.51 6.98 10.49 6.92 10.43C6.86 10.38 6.83 10.3 6.83 10.21V5.79C6.83 5.7 6.86 5.62 6.92 5.57C6.99 5.51 7.06 5.49 7.14 5.49C7.16 5.49 7.23 5.52 7.35 5.58L9.45 7.68C9.5 7.73 9.53 7.78 9.56 7.83C9.58 7.88 9.59 7.94 9.59 8C9.59 8.06 9.58 8.12 9.56 8.17C9.53 8.22 9.5 8.27 9.45 8.32L7.35 10.42C7.32 10.45 7.29 10.47 7.25 10.49C7.22 10.51 7.18 10.51 7.14 10.51Z" })
   }
-), to = (c) => /* @__PURE__ */ t(
+), lo = (c) => /* @__PURE__ */ t(
   "svg",
   {
     viewBox: "0 0 16 16",
@@ -88,7 +88,7 @@ const oo = (c) => /* @__PURE__ */ t(
     ...c,
     children: /* @__PURE__ */ t("path", { d: "M5.49 7.14C5.49 7.06 5.51 6.98 5.57 6.92C5.62 6.86 5.7 6.83 5.79 6.83H10.21C10.3 6.83 10.38 6.86 10.43 6.92C10.49 6.99 10.51 7.06 10.51 7.14C10.51 7.16 10.48 7.23 10.42 7.35L8.32 9.45C8.27 9.5 8.22 9.53 8.17 9.56C8.12 9.58 8.06 9.59 8 9.59C7.94 9.59 7.88 9.58 7.83 9.56C7.78 9.53 7.73 9.5 7.68 9.45L5.58 7.35C5.55 7.32 5.53 7.29 5.51 7.25C5.49 7.22 5.49 7.18 5.49 7.14Z" })
   }
-), lo = (c) => /* @__PURE__ */ t(
+), eo = (c) => /* @__PURE__ */ t(
   "svg",
   {
     viewBox: "0 0 16 16",
@@ -97,7 +97,7 @@ const oo = (c) => /* @__PURE__ */ t(
     ...c,
     children: /* @__PURE__ */ t("path", { d: "M10.51 8.86C10.51 8.94 10.49 9.02 10.43 9.08C10.38 9.14 10.3 9.17 10.21 9.17H5.79C5.7 9.17 5.62 9.14 5.57 9.08C5.51 9.01 5.49 8.94 5.49 8.86C5.49 8.84 5.52 8.77 5.58 8.65L7.68 6.55C7.73 6.5 7.78 6.47 7.83 6.44C7.88 6.42 7.94 6.41 8 6.41C8.06 6.41 8.12 6.42 8.17 6.44C8.22 6.47 8.27 6.5 8.32 6.55L10.42 8.65C10.45 8.68 10.47 8.71 10.49 8.75C10.51 8.78 10.51 8.82 10.51 8.86Z" })
   }
-), eo = $({
+), ao = $({
   container: {
     position: "relative",
     display: "flex"
@@ -192,11 +192,11 @@ const oo = (c) => /* @__PURE__ */ t(
     alignItems: "center",
     justifyContent: "center",
     backgroundColor: O,
-    ...i.borderRadius(q),
+    ...i.borderRadius(J),
     backdropFilter: "blur(4px)",
-    color: X,
+    color: Y,
     ":hover": {
-      backgroundColor: U
+      backgroundColor: X
     }
   },
   arrowIcon: {
@@ -230,7 +230,7 @@ const oo = (c) => /* @__PURE__ */ t(
   },
   viewport: {
     ...a,
-    ...i.borderRadius(Y),
+    ...i.borderRadius(q),
     // The tracks replace the native scrollbars. Zenith's stylesheet hides them, so no inline
     // <style> needs a nonce (Radix's took the viewport's).
     scrollbarWidth: "none",
@@ -239,7 +239,7 @@ const oo = (c) => /* @__PURE__ */ t(
       outlineWidth: "2px",
       outlineOffset: "2px",
       outlineStyle: "solid",
-      outlineColor: _
+      outlineColor: U
     }
   },
   // The content wrapper keeps Radix's display:table, which grows to the content's width.
@@ -289,13 +289,13 @@ const oo = (c) => /* @__PURE__ */ t(
   thumb: {
     backgroundColor: O
   }
-}), uo = w.forwardRef(function({
+}), vo = w.forwardRef(function({
   className: m,
   children: z,
   arrows: h = !1,
   gradients: S = !0,
   gradientWidth: u = 40,
-  gradientColor: b = "var(--volt-body)",
+  gradientColor: b = _,
   shadow: C = !0,
   scrollbar: y = !1,
   scrollStep: H,
@@ -307,14 +307,14 @@ const oo = (c) => /* @__PURE__ */ t(
   asChild: l,
   ...e
 }, d) {
-  const o = eo(), D = J(), {
+  const o = ao(), D = Q(), {
     scrollRef: x,
     hasOverflow: V,
     canScrollStart: E,
     canScrollEnd: R,
     scrollToStart: I,
     scrollToEnd: B
-  } = Q({ scrollStep: H, orientation: n }), r = n === "horizontal", N = y && !(k === "hover" && !V), F = (v) => {
+  } = oo({ scrollStep: H, orientation: n }), r = n === "horizontal", N = y && !(k === "hover" && !V), F = (v) => {
     var T, L;
     if (v.target !== v.currentTarget) return;
     const Z = r ? "ArrowLeft" : "ArrowUp", j = r ? "ArrowRight" : "ArrowDown";
@@ -394,7 +394,7 @@ const oo = (c) => /* @__PURE__ */ t(
                 "data-slot": "scroll-overflow-arrow-icon",
                 [s]: "scroll-overflow-arrow-icon",
                 className: o.arrowBadge,
-                children: r ? /* @__PURE__ */ t(oo, { className: o.arrowIcon }) : /* @__PURE__ */ t(to, { className: o.arrowIcon })
+                children: r ? /* @__PURE__ */ t(ro, { className: o.arrowIcon }) : /* @__PURE__ */ t(lo, { className: o.arrowIcon })
               }
             )
           }
@@ -504,7 +504,7 @@ const oo = (c) => /* @__PURE__ */ t(
                 "data-slot": "scroll-overflow-arrow-icon",
                 [s]: "scroll-overflow-arrow-icon",
                 className: o.arrowBadge,
-                children: r ? /* @__PURE__ */ t(ro, { className: o.arrowIcon }) : /* @__PURE__ */ t(lo, { className: o.arrowIcon })
+                children: r ? /* @__PURE__ */ t(to, { className: o.arrowIcon }) : /* @__PURE__ */ t(eo, { className: o.arrowIcon })
               }
             )
           }
@@ -514,7 +514,7 @@ const oo = (c) => /* @__PURE__ */ t(
   );
 });
 export {
-  uo as ScrollOverflow,
-  Q as useScrollOverflow
+  vo as ScrollOverflow,
+  oo as useScrollOverflow
 };
 //# sourceMappingURL=scroll-overflow.js.map