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

package/dist/components/option-card/option-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"option-card.js","sources":["../../../src/components/option-card/option-card.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\"\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  respectDefaultPrevented,\n  type ToggleChangeDetails,\n} from \"../toggle/toggle\"\nimport {\n  ToggleGroupItemRoot,\n  ToggleGroupRoot,\n  type ToggleGroupMultipleProps,\n  type ToggleGroupSingleProps,\n} from \"../toggle/toggle-group\"\n\nconst DEFAULT_LAYOUT = \"grid\" as const\n\nconst MISSING_VALUE_WARNING =\n  \"OptionCard: a card inside an OptionCardGroup is missing a `value`. \" +\n  \"Give each card a unique `value` so it can be selected and controlled.\"\n\n/** The trailing control glyph an {@link OptionCard} shows for its selected state. */\nexport type OptionCardControlType = \"radio\" | \"checkbox\" | \"switch\" | \"none\"\n\nexport type OptionCardLayout = \"grid\" | \"row\" | \"column\"\n\n// ── Group context ──────────────────────────────────────────────────────────\ntype OptionCardGroupContextValue = {\n  type?: \"single\" | \"multiple\"\n  layout: OptionCardLayout\n}\nconst OptionCardGroupContext =\n  React.createContext<OptionCardGroupContextValue | null>(null)\n\n// ── Card context ───────────────────────────────────────────────────────────\ntype OptionCardContextValue = {\n  controlType: OptionCardControlType\n  registerType: (type: OptionCardControlType) => void\n}\nconst OptionCardContext = React.createContext<OptionCardContextValue | null>(\n  null\n)\n\n// ── Styles ─────────────────────────────────────────────────────────────────\n\nconst useStyles = makeZenithStyles({\n  // Group layouts\n  group: {\n    ...boxModel,\n    // The GROUP only lays out. v1's group base class is literally \"\" -- every border, padding and\n    // interaction style below used to live here, copied from v1's CARD class onto the wrong element,\n    // while `styles.card` and `styles[layout]` were read but never declared. See make-styles.ts for\n    // why tsc accepted that for as long as it did.\n    display: \"grid\",\n    ...shorthands.gap(tokens.spacingGroup1),\n  },\n\n  // v1: grid-cols-[repeat(auto-fit,minmax(200px,1fr))]\n  grid: {\n    gridTemplateColumns: \"repeat(auto-fit, minmax(200px, 1fr))\",\n  },\n  // v1: grid-flow-col auto-cols-fr -- equal-width columns in one non-wrapping row, so options read\n  // as equal-weight peers regardless of their content.\n  row: {\n    gridAutoFlow: \"column\",\n    gridAutoColumns: \"minmax(0, 1fr)\",\n  },\n  // v1: plain `grid` with no template. One column, stacked.\n  column: {},\n\n  card: {\n    ...nativeControl,\n    position: \"relative\",\n    display: \"flex\",\n    alignItems: \"center\",\n    // v1 gap-3 = 0.75rem. No token: the semantic scale has no 0.75rem step.\n    ...shorthands.gap(tokens.spacingElement3),\n    overflow: \"hidden\",\n    ...shorthands.borderRadius(tokens.radiusLg),\n    // Not currentColor: that picked up this rule's `color: grayA12` and painted a near-black\n    // edge. The predecessor's bare `border` resolved to a subtle grey; grayA6 is its match.\n    ...shorthands.border(\"1px\", \"solid\", tokens.grayA6),\n    ...shorthands.paddingInline(tokens.spacingElement3),\n    ...shorthands.paddingBlock(\"0.375rem\"),\n    textAlign: \"left\",\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n    fontWeight: tokens.fontWeightNormal,\n    color: tokens.grayA12,\n    backgroundColor: \"transparent\",\n    transitionProperty: \"color, background-color, border-color, box-shadow\",\n    transitionDuration: \"150ms\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    cursor: \"pointer\",\n    userSelect: \"none\",\n    height: \"auto\",\n    minWidth: \"0\",\n    \":focus-visible\": {\n      outlineWidth: \"2px\",\n      outlineStyle: \"solid\",\n      outlineOffset: \"2px\",\n      outlineColor: tokens.accentA8,\n    },\n    \":disabled, &[data-disabled]\": {\n      pointerEvents: \"none\",\n      opacity: 0.5,\n    },\n    \"&[data-pressed]\": {\n      backgroundColor: tokens.accentSoft,\n      ...shorthands.borderColor(tokens.accentA8),\n    },\n    [`&[data-pressed] [${SLOT_ATTR}=\"option-card-radio-outer\"]`]: {\n      ...shorthands.borderColor(tokens.accentSolid),\n    },\n    [`&[data-pressed] [${SLOT_ATTR}=\"option-card-radio-dot\"]`]: {\n      opacity: 1,\n    },\n    [`&[data-pressed] [${SLOT_ATTR}=\"option-card-checkbox-outer\"]`]: {\n      ...shorthands.borderColor(\"transparent\"),\n      backgroundColor: tokens.accentSolid,\n    },\n    [`&[data-pressed] [${SLOT_ATTR}=\"option-card-checkbox-check\"]`]: {\n      opacity: 1,\n    },\n    [`&[data-pressed] [${SLOT_ATTR}=\"option-card-switch-track\"]`]: {\n      backgroundColor: tokens.accentSolid,\n    },\n    [`&[data-pressed] [${SLOT_ATTR}=\"option-card-switch-thumb\"]`]: {\n      transform: \"translateX(calc(100% - 1px))\",\n    },\n  },\n\n  // Media\n  mediaRoot: {\n    flexShrink: 0,\n  },\n  mediaIcon: {\n    ...boxModel,\n    display: \"grid\",\n    width: \"2.5rem\",\n    height: \"2.5rem\",\n    placeContent: \"center\",\n    alignSelf: \"start\",\n    ...shorthands.borderRadius(tokens.radiusLg),\n    backgroundColor: tokens.accentSoft,\n    color: tokens.accentLight,\n    \"& svg\": {\n      width: \"1.25rem\",\n      height: \"1.25rem\",\n    },\n  },\n  mediaIllustration: {\n    position: \"relative\",\n    aspectRatio: \"1 / 1\",\n    alignSelf: \"stretch\",\n    overflow: \"hidden\",\n    \"& svg\": {\n      position: \"absolute\",\n      ...shorthands.inset(0),\n      width: \"100%\",\n      height: \"100%\",\n    },\n    \"& img\": {\n      position: \"absolute\",\n      ...shorthands.inset(0),\n      width: \"100%\",\n      height: \"100%\",\n      objectFit: \"contain\",\n    },\n  },\n\n  // Content\n  content: {\n    ...boxModel,\n    display: \"grid\",\n    minWidth: 0,\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n    gridAutoRows: \"min-content\",\n    alignItems: \"center\",\n    columnGap: tokens.spacingElement2,\n    paddingTop: tokens.spacingElement1,\n    paddingBottom: tokens.spacingElement1,\n    [`&:has([${SLOT_ATTR}=\"option-card-control\"])`]: {\n      gridTemplateColumns: \"1fr auto\",\n    },\n  },\n\n  // Title\n  title: {\n    ...boxModel,\n    gridColumnStart: 1,\n    gridRowStart: 1,\n    minWidth: 0,\n    alignSelf: \"center\",\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n    fontWeight: tokens.fontWeightSemibold,\n  },\n\n  // Description\n  description: {\n    ...boxModel,\n    gridColumnStart: 1,\n    gridRowStart: 2,\n    minWidth: 0,\n    overflowWrap: \"break-word\",\n    fontSize: tokens.textXs,\n    lineHeight: tokens.leadingXs,\n    fontWeight: tokens.fontWeightNormal,\n    color: tokens.grayA11,\n  },\n\n  // Control\n  control: {\n    gridColumnStart: 2,\n    gridRowStart: 1,\n    alignSelf: \"center\",\n    justifySelf: \"end\",\n  },\n\n  // Radio glyph\n  radioOuter: {\n    ...boxModel,\n    display: \"grid\",\n    width: \"1rem\",\n    height: \"1rem\",\n    flexShrink: 0,\n    placeContent: \"center\",\n    borderRadius: \"9999px\",\n    ...shorthands.border(\"1px\", \"solid\", tokens.accentA7),\n    backgroundColor: tokens.accentSoft,\n    transitionProperty: \"border-color\",\n    transitionDuration: \"150ms\",\n  },\n  radioDot: {\n    ...boxModel,\n    width: \"0.5rem\",\n    height: \"0.5rem\",\n    borderRadius: \"9999px\",\n    backgroundColor: tokens.accentSolid,\n    opacity: 0,\n    transitionProperty: \"opacity\",\n    transitionDuration: \"150ms\",\n  },\n\n  // Checkbox glyph\n  checkboxOuter: {\n    ...boxModel,\n    display: \"grid\",\n    width: \"1rem\",\n    height: \"1rem\",\n    flexShrink: 0,\n    placeContent: \"center\",\n    ...shorthands.borderRadius(\"4px\"),\n    ...shorthands.border(\"1px\", \"solid\", tokens.accentA7),\n    backgroundColor: tokens.accentSoft,\n    color: tokens.accentContrast,\n    transitionProperty: \"background-color, border-color\",\n    transitionDuration: \"150ms\",\n  },\n  checkboxCheck: {\n    ...boxModel,\n    width: \"0.75rem\",\n    height: \"0.75rem\",\n    opacity: 0,\n    transitionProperty: \"opacity\",\n    transitionDuration: \"150ms\",\n  },\n\n  // Switch glyph\n  switchTrack: {\n    ...boxModel,\n    display: \"inline-flex\",\n    height: \"1.25rem\",\n    width: \"2.125rem\",\n    flexShrink: 0,\n    alignItems: \"center\",\n    borderRadius: \"9999px\",\n    ...shorthands.border(\"1px\", \"solid\", \"transparent\"),\n    backgroundColor: tokens.grayA3,\n    transitionProperty: \"background-color\",\n    transitionDuration: \"150ms\",\n  },\n  switchThumb: {\n    ...boxModel,\n    display: \"block\",\n    width: \"1rem\",\n    height: \"1rem\",\n    transform: \"translateX(1px)\",\n    borderRadius: \"9999px\",\n    backgroundColor: tokens.grayContrast,\n    // v1 shadow-xs; no shadow tokens in this package.\n    boxShadow: \"0 1px 2px 0 #0000000d\",\n    transitionProperty: \"transform\",\n    transitionDuration: \"150ms\",\n  },\n})\n\n// ── Control Glyphs ─────────────────────────────────────────────────────────\n\nconst CheckIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 -960 960 960\"\n    fill=\"currentColor\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <path d=\"m382-354 339-339q12-12 28-12t28 12q12 12 12 28.5T777-636L410-268q-12 12-28 12t-28-12L182-440q-12-12-11.5-28.5T183-497q12-12 28.5-12t28.5 12l142 143Z\" />\n  </svg>\n)\n\nconst RadioGlyph = () => {\n  const styles = useStyles()\n  return (\n    <span\n      className={styles.radioOuter}\n      {...{ [SLOT_ATTR]: \"option-card-radio-outer\" }}\n    >\n      <span\n        className={styles.radioDot}\n        {...{ [SLOT_ATTR]: \"option-card-radio-dot\" }}\n      />\n    </span>\n  )\n}\n\nconst CheckboxGlyph = () => {\n  const styles = useStyles()\n  return (\n    <span\n      className={styles.checkboxOuter}\n      {...{ [SLOT_ATTR]: \"option-card-checkbox-outer\" }}\n    >\n      <CheckIcon\n        className={styles.checkboxCheck}\n        {...{ [SLOT_ATTR]: \"option-card-checkbox-check\" }}\n      />\n    </span>\n  )\n}\n\nconst SwitchGlyph = () => {\n  const styles = useStyles()\n  return (\n    <span\n      className={styles.switchTrack}\n      {...{ [SLOT_ATTR]: \"option-card-switch-track\" }}\n    >\n      <span\n        className={styles.switchThumb}\n        {...{ [SLOT_ATTR]: \"option-card-switch-thumb\" }}\n      />\n    </span>\n  )\n}\n\n// ── OptionCardGroup ────────────────────────────────────────────────────────\n\ntype OptionCardGroupOwnProps = { layout?: OptionCardLayout }\n\nexport type OptionCardGroupProps =\n  | (ToggleGroupSingleProps & OptionCardGroupOwnProps)\n  | (ToggleGroupMultipleProps & OptionCardGroupOwnProps)\n\nexport const OptionCardGroup = React.forwardRef<\n  HTMLDivElement,\n  OptionCardGroupProps\n>(function OptionCardGroup(\n  { className, layout = DEFAULT_LAYOUT, ...props },\n  ref\n) {\n  const styles = useStyles()\n\n  return (\n    <OptionCardGroupContext.Provider value={{ type: props.type, layout }}>\n      <ToggleGroupRoot\n        ref={ref}\n        data-slot=\"option-card-group\"\n        {...{ [SLOT_ATTR]: \"option-card-group\" }}\n        data-layout={layout}\n        {...(props.type === \"single\" ? { role: \"radiogroup\" } : {})}\n        className={mergeClasses(styles.group, styles[layout], className)}\n        {...props}\n      />\n    </OptionCardGroupContext.Provider>\n  )\n})\n\n// ── OptionCardControl ──────────────────────────────────────────────────────\n\nexport type OptionCardControlProps = React.ComponentProps<\"span\"> & {\n  type?: OptionCardControlType\n}\n\nexport const OptionCardControl = React.forwardRef<\n  HTMLSpanElement,\n  OptionCardControlProps\n>(function OptionCardControl({ className, type, ...props }, ref) {\n  const styles = useStyles()\n  const card = React.useContext(OptionCardContext)\n  const register = card?.registerType\n\n  React.useEffect(() => {\n    if (type && register) register(type)\n  }, [type, register])\n\n  const resolved = type ?? card?.controlType ?? \"checkbox\"\n  if (resolved === \"none\") return null\n\n  return (\n    <span\n      ref={ref}\n      aria-hidden=\"true\"\n      data-slot=\"option-card-control\"\n      {...{ [SLOT_ATTR]: \"option-card-control\" }}\n      className={mergeClasses(styles.control, className)}\n      {...props}\n    >\n      {resolved === \"radio\" ? (\n        <RadioGlyph />\n      ) : resolved === \"switch\" ? (\n        <SwitchGlyph />\n      ) : (\n        <CheckboxGlyph />\n      )}\n    </span>\n  )\n})\n\n// ── OptionCardMedia ────────────────────────────────────────────────────────\n\nexport type OptionCardMediaVariant = \"icon\" | \"illustration\"\n\nexport type OptionCardMediaProps = React.ComponentProps<\"span\"> & {\n  variant?: OptionCardMediaVariant\n}\n\nexport const OptionCardMedia = React.forwardRef<\n  HTMLSpanElement,\n  OptionCardMediaProps\n>(function OptionCardMedia({ className, variant = \"icon\", ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <span\n      ref={ref}\n      aria-hidden=\"true\"\n      data-slot=\"option-card-media\"\n      {...{ [SLOT_ATTR]: \"option-card-media\" }}\n      data-variant={variant}\n      className={mergeClasses(\n        styles.mediaRoot,\n        variant === \"illustration\"\n          ? styles.mediaIllustration\n          : styles.mediaIcon,\n        className\n      )}\n      {...props}\n    />\n  )\n})\n\n// ── OptionCardTitle ────────────────────────────────────────────────────────\n\nexport type OptionCardTitleProps = React.ComponentProps<\"span\">\n\nexport const OptionCardTitle = React.forwardRef<\n  HTMLSpanElement,\n  OptionCardTitleProps\n>(function OptionCardTitle({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"option-card-title\"\n      {...{ [SLOT_ATTR]: \"option-card-title\" }}\n      className={mergeClasses(styles.title, className)}\n      {...props}\n    />\n  )\n})\n\n// ── OptionCardDescription ──────────────────────────────────────────────────\n\nexport type OptionCardDescriptionProps = React.ComponentProps<\"span\">\n\nexport const OptionCardDescription = React.forwardRef<\n  HTMLSpanElement,\n  OptionCardDescriptionProps\n>(function OptionCardDescription({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"option-card-description\"\n      {...{ [SLOT_ATTR]: \"option-card-description\" }}\n      className={mergeClasses(styles.description, className)}\n      {...props}\n    />\n  )\n})\n\n// ── OptionCardContent ──────────────────────────────────────────────────────\n\nexport type OptionCardContentProps = React.ComponentProps<\"span\">\n\nconst hasControl = (children: React.ReactNode) =>\n  React.Children.toArray(children).some(\n    (c) => React.isValidElement(c) && c.type === OptionCardControl\n  )\n\nexport const OptionCardContent = React.forwardRef<\n  HTMLSpanElement,\n  OptionCardContentProps\n>(function OptionCardContent({ className, children, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"option-card-content\"\n      {...{ [SLOT_ATTR]: \"option-card-content\" }}\n      className={mergeClasses(styles.content, className)}\n      {...props}\n    >\n      {children}\n      {!hasControl(children) && <OptionCardControl />}\n    </span>\n  )\n})\n\n// ── OptionCard ─────────────────────────────────────────────────────────────\n\nexport type OptionCardProps = Omit<\n  React.ComponentProps<\"button\">,\n  \"onChange\" | \"title\"\n> & {\n  /** Value of this option. Required inside an {@link OptionCardGroup}. */\n  value?: string\n  /** Controlled selected state for a standalone (group-less) card. */\n  pressed?: boolean\n  /** Uncontrolled default selected state for a standalone card. */\n  defaultPressed?: boolean\n  /**\n   * Fired when a standalone card is toggled, with Base UI's change details second.\n   * `eventDetails.cancel()` keeps the current state.\n   */\n  onPressedChange?: (\n    pressed: boolean,\n    eventDetails: ToggleChangeDetails\n  ) => void\n}\n\nconst isPart = (node: React.ReactNode, ...parts: React.ElementType[]) =>\n  React.isValidElement(node) && parts.includes(node.type as React.ElementType)\n\nexport const OptionCard = React.forwardRef<HTMLButtonElement, OptionCardProps>(\n  function OptionCard(\n    {\n      className,\n      children,\n      value,\n      pressed,\n      defaultPressed,\n      onPressedChange,\n      onClick,\n      ...props\n    },\n    ref\n  ) {\n    const styles = useStyles()\n    const group = React.useContext(OptionCardGroupContext)\n    const inGroup = group !== null\n\n    const fallbackId = React.useId()\n    if (\n      process.env.NODE_ENV !== \"production\" &&\n      inGroup &&\n      value === undefined\n    ) {\n      console.warn(MISSING_VALUE_WARNING)\n    }\n\n    const [internalPressed, setInternalPressed] = React.useState(\n      defaultPressed ?? false\n    )\n    const isControlled = pressed !== undefined\n    const currentPressed = isControlled ? pressed : internalPressed\n    const handlePressedChange = (\n      next: boolean,\n      eventDetails: ToggleChangeDetails\n    ) => {\n      onPressedChange?.(next, eventDetails)\n      if (!isControlled && !eventDetails.isCanceled) setInternalPressed(next)\n    }\n\n    const groupControlType: OptionCardControlType = inGroup\n      ? group.type === \"multiple\"\n        ? \"checkbox\"\n        : \"radio\"\n      : \"checkbox\"\n    const [controlType, setControlType] =\n      React.useState<OptionCardControlType>(groupControlType)\n    const ctx = React.useMemo<OptionCardContextValue>(\n      () => ({ controlType, registerType: setControlType }),\n      [controlType]\n    )\n\n    const childArray = React.Children.toArray(children)\n    const hasContentChild = childArray.some((c) => isPart(c, OptionCardContent))\n    const media = childArray.filter((c) => isPart(c, OptionCardMedia))\n    const rest = childArray.filter((c) => !isPart(c, OptionCardMedia))\n    const content = hasContentChild ? (\n      rest\n    ) : (\n      <OptionCardContent>\n        <OptionCardTitle>{rest}</OptionCardTitle>\n      </OptionCardContent>\n    )\n\n    const body = (\n      <>\n        {media}\n        {content}\n      </>\n    )\n\n    if (inGroup) {\n      return (\n        <OptionCardContext.Provider value={ctx}>\n          <ToggleGroupItemRoot\n            ref={ref}\n            data-slot=\"option-card\"\n            {...{ [SLOT_ATTR]: \"option-card\" }}\n            value={value ?? fallbackId}\n            className={mergeClasses(styles.card, className)}\n            onClick={onClick}\n            {...props}\n          >\n            {body}\n          </ToggleGroupItemRoot>\n        </OptionCardContext.Provider>\n      )\n    }\n\n    const standaloneRole = controlType === \"switch\" ? \"switch\" : \"checkbox\"\n\n    return (\n      <OptionCardContext.Provider value={ctx}>\n        <TogglePrimitive\n          ref={ref}\n          data-slot=\"option-card\"\n          {...{ [SLOT_ATTR]: \"option-card\" }}\n          pressed={currentPressed}\n          onPressedChange={handlePressedChange}\n          role={standaloneRole}\n          aria-checked={currentPressed}\n          aria-pressed={undefined}\n          className={mergeClasses(styles.card, className)}\n          // Base UI types the handlers with its own event wrapper; the element is the same\n          // <button>, so the caller's button-typed handlers receive the events they declare.\n          {...(props as TogglePrimitive.Props)}\n          onClick={respectDefaultPrevented(onClick)}\n        >\n          {body}\n        </TogglePrimitive>\n      </OptionCardContext.Provider>\n    )\n  }\n)\n"],"names":["DEFAULT_LAYOUT","MISSING_VALUE_WARNING","OptionCardGroupContext","React","OptionCardContext","useStyles","makeZenithStyles","boxModel","shorthands","tokens.spacingGroup1","nativeControl","tokens.spacingElement3","tokens.radiusLg","tokens.grayA6","tokens.textSm","tokens.leadingSm","tokens.fontWeightNormal","tokens.grayA12","tokens.accentA8","tokens.accentSoft","SLOT_ATTR","tokens.accentSolid","tokens.accentLight","tokens.spacingElement2","tokens.spacingElement1","tokens.fontWeightSemibold","tokens.textXs","tokens.leadingXs","tokens.grayA11","tokens.accentA7","tokens.accentContrast","tokens.grayA3","tokens.grayContrast","CheckIcon","props","jsx","RadioGlyph","styles","CheckboxGlyph","SwitchGlyph","OptionCardGroup","className","layout","ref","ToggleGroupRoot","mergeClasses","OptionCardControl","type","card","register","resolved","OptionCardMedia","variant","OptionCardTitle","OptionCardDescription","hasControl","children","c","OptionCardContent","jsxs","isPart","node","parts","OptionCard","value","pressed","defaultPressed","onPressedChange","onClick","group","inGroup","fallbackId","internalPressed","setInternalPressed","isControlled","currentPressed","handlePressedChange","next","eventDetails","groupControlType","controlType","setControlType","ctx","childArray","hasContentChild","media","rest","body","Fragment","ToggleGroupItemRoot","standaloneRole","TogglePrimitive","respectDefaultPrevented"],"mappings":"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"}
+{"version":3,"file":"option-card.js","sources":["../../../src/components/option-card/option-card.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\"\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  respectDefaultPrevented,\n  type ToggleChangeDetails,\n} from \"../toggle/toggle\"\nimport {\n  ToggleGroupItemRoot,\n  ToggleGroupRoot,\n  type ToggleGroupMultipleProps,\n  type ToggleGroupSingleProps,\n} from \"../toggle/toggle-group\"\n\nconst DEFAULT_LAYOUT = \"grid\" as const\n\nconst MISSING_VALUE_WARNING =\n  \"OptionCard: a card inside an OptionCardGroup is missing a `value`. \" +\n  \"Give each card a unique `value` so it can be selected and controlled.\"\n\n/** The trailing control glyph an {@link OptionCard} shows for its selected state. */\nexport type OptionCardControlType = \"radio\" | \"checkbox\" | \"switch\" | \"none\"\n\nexport type OptionCardLayout = \"grid\" | \"row\" | \"column\"\n\n// ── Group context ──────────────────────────────────────────────────────────\ntype OptionCardGroupContextValue = {\n  type?: \"single\" | \"multiple\"\n  layout: OptionCardLayout\n}\nconst OptionCardGroupContext =\n  React.createContext<OptionCardGroupContextValue | null>(null)\n\n// ── Card context ───────────────────────────────────────────────────────────\ntype OptionCardContextValue = {\n  controlType: OptionCardControlType\n  registerType: (type: OptionCardControlType) => void\n}\nconst OptionCardContext = React.createContext<OptionCardContextValue | null>(\n  null\n)\n\n// ── Styles ─────────────────────────────────────────────────────────────────\n\nconst useStyles = makeZenithStyles({\n  // Group layouts\n  group: {\n    ...boxModel,\n    // The GROUP only lays out. v1's group base class is literally \"\" -- every border, padding and\n    // interaction style below used to live here, copied from v1's CARD class onto the wrong element,\n    // while `styles.card` and `styles[layout]` were read but never declared. See make-styles.ts for\n    // why tsc accepted that for as long as it did.\n    display: \"grid\",\n    ...shorthands.gap(tokens.spacingGroup1),\n  },\n\n  // v1: grid-cols-[repeat(auto-fit,minmax(200px,1fr))]\n  grid: {\n    gridTemplateColumns: \"repeat(auto-fit, minmax(200px, 1fr))\",\n  },\n  // v1: grid-flow-col auto-cols-fr -- equal-width columns in one non-wrapping row, so options read\n  // as equal-weight peers regardless of their content.\n  row: {\n    gridAutoFlow: \"column\",\n    gridAutoColumns: \"minmax(0, 1fr)\",\n  },\n  // v1: plain `grid` with no template. One column, stacked.\n  column: {},\n\n  card: {\n    ...nativeControl,\n    position: \"relative\",\n    display: \"flex\",\n    alignItems: \"center\",\n    // v1 gap-3 = 0.75rem. No token: the semantic scale has no 0.75rem step.\n    ...shorthands.gap(tokens.spacingElement3),\n    overflow: \"hidden\",\n    ...shorthands.borderRadius(tokens.radiusLg),\n    // Not currentColor: that picked up this rule's `color: grayA12` and painted a near-black\n    // edge. The predecessor's bare `border` resolved to a subtle grey; grayA6 is its match.\n    ...shorthands.border(\"1px\", \"solid\", tokens.grayA6),\n    ...shorthands.paddingInline(tokens.spacingElement3),\n    ...shorthands.paddingBlock(\"0.375rem\"),\n    textAlign: \"left\",\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n    fontWeight: tokens.fontWeightNormal,\n    color: tokens.grayA12,\n    backgroundColor: \"transparent\",\n    transitionProperty: \"color, background-color, border-color, box-shadow\",\n    transitionDuration: \"150ms\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    cursor: \"pointer\",\n    userSelect: \"none\",\n    height: \"auto\",\n    minWidth: \"0\",\n    \":focus-visible\": {\n      outlineWidth: \"2px\",\n      outlineStyle: \"solid\",\n      outlineOffset: \"2px\",\n      outlineColor: tokens.accentA8,\n    },\n    \":disabled, &[data-disabled]\": {\n      pointerEvents: \"none\",\n      opacity: 0.5,\n    },\n    \"&[data-pressed]\": {\n      backgroundColor: tokens.accentSoft,\n      ...shorthands.borderColor(tokens.accentA8),\n    },\n    [`&[data-pressed] [${SLOT_ATTR}=\"option-card-radio-outer\"]`]: {\n      ...shorthands.borderColor(tokens.accentSolid),\n    },\n    [`&[data-pressed] [${SLOT_ATTR}=\"option-card-radio-dot\"]`]: {\n      opacity: 1,\n    },\n    [`&[data-pressed] [${SLOT_ATTR}=\"option-card-checkbox-outer\"]`]: {\n      ...shorthands.borderColor(\"transparent\"),\n      backgroundColor: tokens.accentSolid,\n    },\n    [`&[data-pressed] [${SLOT_ATTR}=\"option-card-checkbox-check\"]`]: {\n      opacity: 1,\n    },\n    [`&[data-pressed] [${SLOT_ATTR}=\"option-card-switch-track\"]`]: {\n      backgroundColor: tokens.accentSolid,\n    },\n    [`&[data-pressed] [${SLOT_ATTR}=\"option-card-switch-thumb\"]`]: {\n      transform: \"translateX(calc(100% - 1px))\",\n    },\n  },\n\n  // Media\n  mediaRoot: {\n    flexShrink: 0,\n  },\n  mediaIcon: {\n    ...boxModel,\n    display: \"grid\",\n    width: \"2.5rem\",\n    height: \"2.5rem\",\n    placeContent: \"center\",\n    alignSelf: \"start\",\n    ...shorthands.borderRadius(tokens.radiusLg),\n    backgroundColor: tokens.accentSoft,\n    color: tokens.accentLight,\n    \"& svg\": {\n      width: \"1.25rem\",\n      height: \"1.25rem\",\n    },\n  },\n  mediaIllustration: {\n    position: \"relative\",\n    aspectRatio: \"1 / 1\",\n    alignSelf: \"stretch\",\n    overflow: \"hidden\",\n    \"& svg\": {\n      position: \"absolute\",\n      ...shorthands.inset(0),\n      width: \"100%\",\n      height: \"100%\",\n    },\n    \"& img\": {\n      position: \"absolute\",\n      ...shorthands.inset(0),\n      width: \"100%\",\n      height: \"100%\",\n      objectFit: \"contain\",\n    },\n  },\n\n  // Content\n  content: {\n    ...boxModel,\n    display: \"grid\",\n    minWidth: 0,\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n    gridAutoRows: \"min-content\",\n    alignItems: \"center\",\n    columnGap: tokens.spacingElement2,\n    paddingTop: tokens.spacingElement1,\n    paddingBottom: tokens.spacingElement1,\n    [`&:has([${SLOT_ATTR}=\"option-card-control\"])`]: {\n      gridTemplateColumns: \"1fr auto\",\n    },\n  },\n\n  // Title\n  title: {\n    ...boxModel,\n    gridColumnStart: 1,\n    gridRowStart: 1,\n    minWidth: 0,\n    alignSelf: \"center\",\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n    fontWeight: tokens.fontWeightSemibold,\n  },\n\n  // Description\n  description: {\n    ...boxModel,\n    gridColumnStart: 1,\n    gridRowStart: 2,\n    minWidth: 0,\n    overflowWrap: \"break-word\",\n    fontSize: tokens.textXs,\n    lineHeight: tokens.leadingXs,\n    fontWeight: tokens.fontWeightNormal,\n    color: tokens.grayA11,\n  },\n\n  // Control\n  control: {\n    gridColumnStart: 2,\n    gridRowStart: 1,\n    alignSelf: \"center\",\n    justifySelf: \"end\",\n  },\n\n  // Radio glyph\n  radioOuter: {\n    ...boxModel,\n    display: \"grid\",\n    width: \"1rem\",\n    height: \"1rem\",\n    flexShrink: 0,\n    placeContent: \"center\",\n    borderRadius: \"9999px\",\n    ...shorthands.border(\"1px\", \"solid\", tokens.accentA7),\n    backgroundColor: tokens.accentSoft,\n    transitionProperty: \"border-color\",\n    transitionDuration: \"150ms\",\n  },\n  radioDot: {\n    ...boxModel,\n    width: \"0.5rem\",\n    height: \"0.5rem\",\n    borderRadius: \"9999px\",\n    backgroundColor: tokens.accentSolid,\n    opacity: 0,\n    transitionProperty: \"opacity\",\n    transitionDuration: \"150ms\",\n  },\n\n  // Checkbox glyph\n  checkboxOuter: {\n    ...boxModel,\n    display: \"grid\",\n    width: \"1rem\",\n    height: \"1rem\",\n    flexShrink: 0,\n    placeContent: \"center\",\n    ...shorthands.borderRadius(\"4px\"),\n    ...shorthands.border(\"1px\", \"solid\", tokens.accentA7),\n    backgroundColor: tokens.accentSoft,\n    color: tokens.accentContrast,\n    transitionProperty: \"background-color, border-color\",\n    transitionDuration: \"150ms\",\n  },\n  checkboxCheck: {\n    ...boxModel,\n    width: \"0.75rem\",\n    height: \"0.75rem\",\n    opacity: 0,\n    transitionProperty: \"opacity\",\n    transitionDuration: \"150ms\",\n  },\n\n  // Switch glyph\n  switchTrack: {\n    ...boxModel,\n    display: \"inline-flex\",\n    height: \"1.25rem\",\n    width: \"2.125rem\",\n    flexShrink: 0,\n    alignItems: \"center\",\n    borderRadius: \"9999px\",\n    ...shorthands.border(\"1px\", \"solid\", \"transparent\"),\n    backgroundColor: tokens.grayA3,\n    transitionProperty: \"background-color\",\n    transitionDuration: \"150ms\",\n  },\n  switchThumb: {\n    ...boxModel,\n    display: \"block\",\n    width: \"1rem\",\n    height: \"1rem\",\n    transform: \"translateX(1px)\",\n    borderRadius: \"9999px\",\n    backgroundColor: tokens.grayContrast,\n    // v1 shadow-xs; no shadow tokens in this package.\n    boxShadow: \"0 1px 2px 0 #0000000d\",\n    transitionProperty: \"transform\",\n    transitionDuration: \"150ms\",\n  },\n})\n\n// ── Control Glyphs ─────────────────────────────────────────────────────────\n\nconst CheckIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 -960 960 960\"\n    fill=\"currentColor\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <path d=\"m382-354 339-339q12-12 28-12t28 12q12 12 12 28.5T777-636L410-268q-12 12-28 12t-28-12L182-440q-12-12-11.5-28.5T183-497q12-12 28.5-12t28.5 12l142 143Z\" />\n  </svg>\n)\n\nconst RadioGlyph = () => {\n  const styles = useStyles()\n  return (\n    <span\n      className={styles.radioOuter}\n      {...{ [SLOT_ATTR]: \"option-card-radio-outer\" }}\n    >\n      <span\n        className={styles.radioDot}\n        {...{ [SLOT_ATTR]: \"option-card-radio-dot\" }}\n      />\n    </span>\n  )\n}\n\nconst CheckboxGlyph = () => {\n  const styles = useStyles()\n  return (\n    <span\n      className={styles.checkboxOuter}\n      {...{ [SLOT_ATTR]: \"option-card-checkbox-outer\" }}\n    >\n      <CheckIcon\n        className={styles.checkboxCheck}\n        {...{ [SLOT_ATTR]: \"option-card-checkbox-check\" }}\n      />\n    </span>\n  )\n}\n\nconst SwitchGlyph = () => {\n  const styles = useStyles()\n  return (\n    <span\n      className={styles.switchTrack}\n      {...{ [SLOT_ATTR]: \"option-card-switch-track\" }}\n    >\n      <span\n        className={styles.switchThumb}\n        {...{ [SLOT_ATTR]: \"option-card-switch-thumb\" }}\n      />\n    </span>\n  )\n}\n\n// ── OptionCardGroup ────────────────────────────────────────────────────────\n\ntype OptionCardGroupOwnProps = { layout?: OptionCardLayout }\n\nexport type OptionCardGroupProps =\n  | (ToggleGroupSingleProps & OptionCardGroupOwnProps)\n  | (ToggleGroupMultipleProps & OptionCardGroupOwnProps)\n\nexport const OptionCardGroup = React.forwardRef<\n  HTMLDivElement,\n  OptionCardGroupProps\n>(function OptionCardGroup(\n  { className, layout = DEFAULT_LAYOUT, ...props },\n  ref\n) {\n  const styles = useStyles()\n\n  return (\n    <OptionCardGroupContext.Provider value={{ type: props.type, layout }}>\n      <ToggleGroupRoot\n        ref={ref}\n        data-slot=\"option-card-group\"\n        {...{ [SLOT_ATTR]: \"option-card-group\" }}\n        data-layout={layout}\n        {...(props.type === \"single\" ? { role: \"radiogroup\" } : {})}\n        className={mergeClasses(styles.group, styles[layout], className)}\n        {...props}\n      />\n    </OptionCardGroupContext.Provider>\n  )\n})\n\n// ── OptionCardControl ──────────────────────────────────────────────────────\n\nexport type OptionCardControlProps = React.ComponentProps<\"span\"> & {\n  type?: OptionCardControlType\n}\n\nexport const OptionCardControl = React.forwardRef<\n  HTMLSpanElement,\n  OptionCardControlProps\n>(function OptionCardControl({ className, type, ...props }, ref) {\n  const styles = useStyles()\n  const card = React.useContext(OptionCardContext)\n  const register = card?.registerType\n\n  React.useEffect(() => {\n    if (type && register) register(type)\n  }, [type, register])\n\n  const resolved = type ?? card?.controlType ?? \"checkbox\"\n  if (resolved === \"none\") return null\n\n  return (\n    <span\n      ref={ref}\n      aria-hidden=\"true\"\n      data-slot=\"option-card-control\"\n      {...{ [SLOT_ATTR]: \"option-card-control\" }}\n      className={mergeClasses(styles.control, className)}\n      {...props}\n    >\n      {resolved === \"radio\" ? (\n        <RadioGlyph />\n      ) : resolved === \"switch\" ? (\n        <SwitchGlyph />\n      ) : (\n        <CheckboxGlyph />\n      )}\n    </span>\n  )\n})\n\n// ── OptionCardMedia ────────────────────────────────────────────────────────\n\nexport type OptionCardMediaVariant = \"icon\" | \"illustration\"\n\nexport type OptionCardMediaProps = React.ComponentProps<\"span\"> & {\n  variant?: OptionCardMediaVariant\n}\n\nexport const OptionCardMedia = React.forwardRef<\n  HTMLSpanElement,\n  OptionCardMediaProps\n>(function OptionCardMedia({ className, variant = \"icon\", ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <span\n      ref={ref}\n      aria-hidden=\"true\"\n      data-slot=\"option-card-media\"\n      {...{ [SLOT_ATTR]: \"option-card-media\" }}\n      data-variant={variant}\n      className={mergeClasses(\n        styles.mediaRoot,\n        variant === \"illustration\"\n          ? styles.mediaIllustration\n          : styles.mediaIcon,\n        className\n      )}\n      {...props}\n    />\n  )\n})\n\n// ── OptionCardTitle ────────────────────────────────────────────────────────\n\nexport type OptionCardTitleProps = React.ComponentProps<\"span\">\n\nexport const OptionCardTitle = React.forwardRef<\n  HTMLSpanElement,\n  OptionCardTitleProps\n>(function OptionCardTitle({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"option-card-title\"\n      {...{ [SLOT_ATTR]: \"option-card-title\" }}\n      className={mergeClasses(styles.title, className)}\n      {...props}\n    />\n  )\n})\n\n// ── OptionCardDescription ──────────────────────────────────────────────────\n\nexport type OptionCardDescriptionProps = React.ComponentProps<\"span\">\n\nexport const OptionCardDescription = React.forwardRef<\n  HTMLSpanElement,\n  OptionCardDescriptionProps\n>(function OptionCardDescription({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"option-card-description\"\n      {...{ [SLOT_ATTR]: \"option-card-description\" }}\n      className={mergeClasses(styles.description, className)}\n      {...props}\n    />\n  )\n})\n\n// ── OptionCardContent ──────────────────────────────────────────────────────\n\nexport type OptionCardContentProps = React.ComponentProps<\"span\">\n\nconst hasControl = (children: React.ReactNode) =>\n  React.Children.toArray(children).some(\n    (c) => React.isValidElement(c) && c.type === OptionCardControl\n  )\n\nexport const OptionCardContent = React.forwardRef<\n  HTMLSpanElement,\n  OptionCardContentProps\n>(function OptionCardContent({ className, children, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"option-card-content\"\n      {...{ [SLOT_ATTR]: \"option-card-content\" }}\n      className={mergeClasses(styles.content, className)}\n      {...props}\n    >\n      {children}\n      {!hasControl(children) && <OptionCardControl />}\n    </span>\n  )\n})\n\n// ── OptionCard ─────────────────────────────────────────────────────────────\n\nexport type OptionCardProps = Omit<\n  React.ComponentProps<\"button\">,\n  \"onChange\" | \"title\"\n> & {\n  /** Value of this option. Required inside an {@link OptionCardGroup}. */\n  value?: string\n  /** Controlled selected state for a standalone (group-less) card. */\n  pressed?: boolean\n  /** Uncontrolled default selected state for a standalone card. */\n  defaultPressed?: boolean\n  /**\n   * Fired when a standalone card is toggled, with Base UI's change details second.\n   * `eventDetails.cancel()` keeps the current state.\n   */\n  onPressedChange?: (\n    pressed: boolean,\n    eventDetails: ToggleChangeDetails\n  ) => void\n}\n\nconst isPart = (node: React.ReactNode, ...parts: React.ElementType[]) =>\n  React.isValidElement(node) && parts.includes(node.type as React.ElementType)\n\nexport const OptionCard = React.forwardRef<HTMLButtonElement, OptionCardProps>(\n  function OptionCard(\n    {\n      className,\n      children,\n      value,\n      pressed,\n      defaultPressed,\n      onPressedChange,\n      onClick,\n      ...props\n    },\n    ref\n  ) {\n    const styles = useStyles()\n    const group = React.useContext(OptionCardGroupContext)\n    const inGroup = group !== null\n\n    const fallbackId = React.useId()\n    if (\n      process.env.NODE_ENV !== \"production\" &&\n      inGroup &&\n      value === undefined\n    ) {\n      console.warn(MISSING_VALUE_WARNING)\n    }\n\n    const [internalPressed, setInternalPressed] = React.useState(\n      defaultPressed ?? false\n    )\n    const isControlled = pressed !== undefined\n    const currentPressed = isControlled ? pressed : internalPressed\n    const handlePressedChange = (\n      next: boolean,\n      eventDetails: ToggleChangeDetails\n    ) => {\n      onPressedChange?.(next, eventDetails)\n      if (!isControlled && !eventDetails.isCanceled) setInternalPressed(next)\n    }\n\n    const groupControlType: OptionCardControlType = inGroup\n      ? group.type === \"multiple\"\n        ? \"checkbox\"\n        : \"radio\"\n      : \"checkbox\"\n    const [controlType, setControlType] =\n      React.useState<OptionCardControlType>(groupControlType)\n    const ctx = React.useMemo<OptionCardContextValue>(\n      () => ({ controlType, registerType: setControlType }),\n      [controlType]\n    )\n\n    const childArray = React.Children.toArray(children)\n    const hasContentChild = childArray.some((c) => isPart(c, OptionCardContent))\n    const media = childArray.filter((c) => isPart(c, OptionCardMedia))\n    const rest = childArray.filter((c) => !isPart(c, OptionCardMedia))\n    const content = hasContentChild ? (\n      rest\n    ) : (\n      <OptionCardContent>\n        <OptionCardTitle>{rest}</OptionCardTitle>\n      </OptionCardContent>\n    )\n\n    const body = (\n      <>\n        {media}\n        {content}\n      </>\n    )\n\n    if (inGroup) {\n      return (\n        <OptionCardContext.Provider value={ctx}>\n          <ToggleGroupItemRoot\n            ref={ref}\n            data-slot=\"option-card\"\n            {...{ [SLOT_ATTR]: \"option-card\" }}\n            value={value ?? fallbackId}\n            className={mergeClasses(styles.card, className)}\n            onClick={onClick}\n            {...props}\n          >\n            {body}\n          </ToggleGroupItemRoot>\n        </OptionCardContext.Provider>\n      )\n    }\n\n    const standaloneRole = controlType === \"switch\" ? \"switch\" : \"checkbox\"\n\n    return (\n      <OptionCardContext.Provider value={ctx}>\n        <TogglePrimitive\n          ref={ref}\n          data-slot=\"option-card\"\n          {...{ [SLOT_ATTR]: \"option-card\" }}\n          pressed={currentPressed}\n          onPressedChange={handlePressedChange}\n          role={standaloneRole}\n          aria-checked={currentPressed}\n          aria-pressed={undefined}\n          className={mergeClasses(styles.card, className)}\n          // Base UI types the handlers with its own event wrapper; the element is the same\n          // <button>, so the caller's button-typed handlers receive the events they declare.\n          {...(props as TogglePrimitive.Props)}\n          onClick={respectDefaultPrevented(onClick)}\n        >\n          {body}\n        </TogglePrimitive>\n      </OptionCardContext.Provider>\n    )\n  }\n)\n"],"names":["DEFAULT_LAYOUT","MISSING_VALUE_WARNING","OptionCardGroupContext","React","OptionCardContext","useStyles","makeZenithStyles","boxModel","shorthands","tokens.spacingGroup1","nativeControl","tokens.spacingElement3","tokens.radiusLg","tokens.grayA6","tokens.textSm","tokens.leadingSm","tokens.fontWeightNormal","tokens.grayA12","tokens.accentA8","tokens.accentSoft","SLOT_ATTR","tokens.accentSolid","tokens.accentLight","tokens.spacingElement2","tokens.spacingElement1","tokens.fontWeightSemibold","tokens.textXs","tokens.leadingXs","tokens.grayA11","tokens.accentA7","tokens.accentContrast","tokens.grayA3","tokens.grayContrast","CheckIcon","props","jsx","RadioGlyph","styles","CheckboxGlyph","SwitchGlyph","OptionCardGroup","className","layout","ref","ToggleGroupRoot","mergeClasses","OptionCardControl","type","card","register","resolved","OptionCardMedia","variant","OptionCardTitle","OptionCardDescription","hasControl","children","c","OptionCardContent","jsxs","isPart","node","parts","OptionCard","value","pressed","defaultPressed","onPressedChange","onClick","group","inGroup","fallbackId","internalPressed","setInternalPressed","isControlled","currentPressed","handlePressedChange","next","eventDetails","groupControlType","controlType","setControlType","ctx","childArray","hasContentChild","media","rest","body","Fragment","ToggleGroupItemRoot","standaloneRole","TogglePrimitive","respectDefaultPrevented"],"mappings":"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"}

package/dist/components/pill/pill.js

@@ -1,6 +1,6 @@
 import { jsxs as z, jsx as O } from "react/jsx-runtime";
 import * as R from "react";
-import { mergeClasses as T, SLOT_ATTR as k, shorthands as L } from "@epilot/zenith-runtime/v1/core.js";
+import { mergeClasses as T, SLOT_ATTR as k, shorthands as L } from "@epilot/zenith-runtime/v1";
 import { makeZenithStyles as N } from "../../styles/make-styles.js";
 import { boxModel as c } from "../../styles/host-reset.js";
 import { spacingGroup2 as v, spacingElement1 as u, accentA8 as E, radiusMd as I, spacingElement2 as P, fontWeightBold as A, leadingXs as B, textXs as C } from "../../tokens/index.js";

package/dist/components/pill/pill.js.map

@@ -1 +1 @@
-{"version":3,"file":"pill.js","sources":["../../../src/components/pill/pill.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1/core\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel } from \"../../styles/host-reset\"\nimport { NS, PALETTE_NS } from \"../../tokens\"\nimport { isCoreFamily } from \"../../tokens/install\"\nimport { useZenithPaletteTokensFor } from \"../../tokens/use-palette-tokens\"\nimport * as tokens from \"../../tokens\"\nimport { ClearButton } from \"../../lib/clear-button\"\n\n/** Pill — same colour-matrix collapse as Badge, plus a hover background. */\n\nconst COLORS = [\n  \"blue\",\n  \"sky\",\n  \"mint\",\n  \"lime\",\n  \"green\",\n  \"teal\",\n  \"cyan\",\n  \"indigo\",\n  \"purple\",\n  \"pink\",\n  \"red\",\n  \"orange\",\n  \"yellow\",\n  \"bronze\",\n  \"gray\",\n  \"accent\",\n  \"warning\",\n  \"success\",\n  \"error\",\n] as const\n\nexport type PillColor = (typeof COLORS)[number]\nexport type PillVariant = \"soft\" | \"solid\" | \"surface\"\n\n/** The four slots a variant can paint. Set inline; read by the atoms below. */\nconst BG = \"--zenith-pill-bg\"\nconst FG = \"--zenith-pill-fg\"\nconst BD = \"--zenith-pill-bd\"\nconst HOV = \"--zenith-pill-hov\"\n\n/**\n * The namespace fix — same shape as Badge's. Pill has no `neutral` alias of its own (its\n * gray-when-disabled resolution already happens in the component body, before `VARIANT_SLOTS` is\n * called — `color` here is always the already-resolved family), so no extra resolve step is needed\n * before classifying it.\n */\nconst namespaceFor = (family: string): string =>\n  isCoreFamily(family) ? NS : PALETTE_NS\n\nconst semantic = (color: PillColor, slot: string): string =>\n  `var(--zenith-${namespaceFor(color)}-${color}-${slot})`\nconst primitive = (color: PillColor, step: string): string =>\n  `var(--zenith-${namespaceFor(color)}-${color}-${step})`\n\n/**\n * Which token each variant pulls into each slot. This replaces the 57-entry compound matrix: it is\n * data about three variants, not about 57 combinations. Text uses the `light` semantic slot, which\n * is Pill's one departure from Badge (Badge uses `default`).\n */\nconst VARIANT_SLOTS: Record<\n  PillVariant,\n  (color: PillColor) => Record<string, string>\n> = {\n  soft: (c) => ({\n    [BG]: semantic(c, \"soft\"),\n    [FG]: semantic(c, \"light\"),\n    [BD]: \"transparent\",\n    [HOV]: semantic(c, \"soft-hover\"),\n  }),\n  solid: (c) => ({\n    [BG]: semantic(c, \"solid\"),\n    [FG]: semantic(c, \"contrast\"),\n    [BD]: \"transparent\",\n    [HOV]: semantic(c, \"solid-hover\"),\n  }),\n  surface: (c) => ({\n    [BG]: semantic(c, \"surface\"),\n    [FG]: semantic(c, \"light\"),\n    [BD]: primitive(c, \"a6\"),\n    [HOV]: semantic(c, \"surface-hover\"),\n  }),\n}\n\nconst useStyles = makeZenithStyles({\n  root: {\n    ...boxModel,\n    display: \"inline-flex\",\n    alignItems: \"center\",\n    // v1 `h-6` — a fixed height, not a minimum.\n    height: \"1.5rem\",\n    gap: tokens.spacingElement1,\n    whiteSpace: \"nowrap\",\n    flexShrink: 0,\n    overflow: \"hidden\",\n    fontSize: tokens.textXs,\n    lineHeight: tokens.leadingXs,\n    fontWeight: tokens.fontWeightBold,\n    paddingInline: tokens.spacingElement2,\n    borderRadius: tokens.radiusMd,\n    transitionProperty: \"color, box-shadow, background-color\",\n    // NEVER write a CSS shorthand in a Griffel style object — see Badge. One atom reads one\n    // custom property; `border` and a later `borderColor` would both survive.\n    ...shorthands.border(\"1px\", \"solid\", `var(${BD})`),\n    // The whole point: one rule each, colour supplied per instance.\n    backgroundColor: `var(${BG})`,\n    color: `var(${FG})`,\n    \":focus-visible\": {\n      outlineWidth: \"2px\",\n      outlineStyle: \"solid\",\n      outlineOffset: \"2px\",\n      outlineColor: tokens.accentA8,\n    },\n    // v1 `[&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:pointer-events-none`.\n    \"& > svg\": {\n      // Literals, not tokens.spacingGroup2: that happens to be 1rem, but a spacing token has no\n      // business describing a dimension. The scale has no size family — noted rather than faked.\n      width: \"1rem\",\n      height: \"1rem\",\n      flexShrink: 0,\n      pointerEvents: \"none\",\n    },\n  },\n  interactive: {\n    cursor: \"pointer\",\n    // The one hover rule. It reads the fourth custom property, line-picked per colour and variant\n    // by VARIANT_SLOTS — never per-colour hover rules.\n    \":hover\": { backgroundColor: `var(${HOV})` },\n  },\n  hasRemove: {\n    ...boxModel,\n    // v1's `pr-1` when a clear button is present.\n    paddingRight: tokens.spacingElement1,\n  },\n  disabled: {\n    pointerEvents: \"none\",\n  },\n  removeSize: {\n    ...boxModel,\n    // v1's `size-4` on the composed ClearButton.\n    width: tokens.spacingGroup2,\n    height: tokens.spacingGroup2,\n  },\n})\n\nexport type PillProps = Omit<React.ComponentProps<\"span\">, \"color\"> & {\n  color?: PillColor\n  /**\n   * Named `variant`, not `style`. v1 called this `style`, which shadows the HTML `style` attribute.\n   * Retrocompat is not a requirement here, so the collision is fixed rather than inherited.\n   */\n  variant?: PillVariant\n  disabled?: boolean\n  onRemove?: (e: React.MouseEvent<HTMLButtonElement>) => void\n}\n\nexport const Pill = React.forwardRef<HTMLSpanElement, PillProps>(function Pill(\n  {\n    className,\n    color = \"accent\",\n    variant = \"soft\",\n    disabled,\n    onRemove,\n    onClick,\n    children,\n    ...props\n  },\n  ref\n) {\n  const styles = useStyles()\n\n  // v1 resolves to gray when disabled and only makes the pill interactive when it has an onClick.\n  const resolvedColor: PillColor = disabled ? \"gray\" : color\n\n  // A decorative family can still arrive from an expression the build cannot see, so this has to\n  // be re-evaluated every commit (WP2B2 — the hook closes over this render's resolved value) — but\n  // it is the RESOLVED family that decides, and the five core families Pill offers (accent, gray,\n  // warning, success, error) need no palette sheet at all.\n  useZenithPaletteTokensFor(resolvedColor)\n  const interactive = !!onClick && !disabled\n\n  // The hover slot is only meaningful while interactive — v1 attaches its hover background class\n  // (`interactive && hoverStyleClasses[...]`) only then, so drop it from the inline properties\n  // otherwise. Setting it unconditionally would be harmless but would claim a hover state that\n  // cannot be reached.\n  const slot = VARIANT_SLOTS[variant](resolvedColor)\n  if (!interactive) delete slot[HOV]\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"pill\"\n      {...{ [SLOT_ATTR]: \"pill\" }}\n      data-disabled={disabled || undefined}\n      role={interactive ? \"button\" : undefined}\n      tabIndex={interactive ? 0 : undefined}\n      onClick={onClick}\n      onKeyDown={\n        interactive\n          ? (e) => {\n              if (e.key === \"Enter\" || e.key === \" \") {\n                e.preventDefault()\n                onClick?.(e as unknown as React.MouseEvent<HTMLSpanElement>)\n              }\n            }\n          : undefined\n      }\n      className={mergeClasses(\n        styles.root,\n        interactive && styles.interactive,\n        onRemove && styles.hasRemove,\n        disabled && styles.disabled,\n        className\n      )}\n      style={{ ...slot } as React.CSSProperties}\n      {...props}\n    >\n      {children}\n      {onRemove && (\n        // v1 composes the shared ClearButton here — hover, focus ring and the size-3 CloseIcon\n        // fallback all live in the lib, not inline.\n        <ClearButton\n          className={styles.removeSize}\n          onClick={onRemove}\n          disabled={disabled}\n        />\n      )}\n    </span>\n  )\n})\n\nexport { COLORS as PILL_COLORS }\n"],"names":["COLORS","BG","FG","BD","HOV","namespaceFor","family","isCoreFamily","NS","PALETTE_NS","semantic","color","slot","primitive","step","VARIANT_SLOTS","c","useStyles","makeZenithStyles","boxModel","tokens.spacingElement1","tokens.textXs","tokens.leadingXs","tokens.fontWeightBold","tokens.spacingElement2","tokens.radiusMd","shorthands","tokens.accentA8","tokens.spacingGroup2","Pill","React","className","variant","disabled","onRemove","onClick","children","props","ref","styles","resolvedColor","useZenithPaletteTokensFor","interactive","jsxs","SLOT_ATTR","e","mergeClasses","jsx","ClearButton"],"mappings":"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"}
+{"version":3,"file":"pill.js","sources":["../../../src/components/pill/pill.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel } from \"../../styles/host-reset\"\nimport { NS, PALETTE_NS } from \"../../tokens\"\nimport { isCoreFamily } from \"../../tokens/install\"\nimport { useZenithPaletteTokensFor } from \"../../tokens/use-palette-tokens\"\nimport * as tokens from \"../../tokens\"\nimport { ClearButton } from \"../../lib/clear-button\"\n\n/** Pill — same colour-matrix collapse as Badge, plus a hover background. */\n\nconst COLORS = [\n  \"blue\",\n  \"sky\",\n  \"mint\",\n  \"lime\",\n  \"green\",\n  \"teal\",\n  \"cyan\",\n  \"indigo\",\n  \"purple\",\n  \"pink\",\n  \"red\",\n  \"orange\",\n  \"yellow\",\n  \"bronze\",\n  \"gray\",\n  \"accent\",\n  \"warning\",\n  \"success\",\n  \"error\",\n] as const\n\nexport type PillColor = (typeof COLORS)[number]\nexport type PillVariant = \"soft\" | \"solid\" | \"surface\"\n\n/** The four slots a variant can paint. Set inline; read by the atoms below. */\nconst BG = \"--zenith-pill-bg\"\nconst FG = \"--zenith-pill-fg\"\nconst BD = \"--zenith-pill-bd\"\nconst HOV = \"--zenith-pill-hov\"\n\n/**\n * The namespace fix — same shape as Badge's. Pill has no `neutral` alias of its own (its\n * gray-when-disabled resolution already happens in the component body, before `VARIANT_SLOTS` is\n * called — `color` here is always the already-resolved family), so no extra resolve step is needed\n * before classifying it.\n */\nconst namespaceFor = (family: string): string =>\n  isCoreFamily(family) ? NS : PALETTE_NS\n\nconst semantic = (color: PillColor, slot: string): string =>\n  `var(--zenith-${namespaceFor(color)}-${color}-${slot})`\nconst primitive = (color: PillColor, step: string): string =>\n  `var(--zenith-${namespaceFor(color)}-${color}-${step})`\n\n/**\n * Which token each variant pulls into each slot. This replaces the 57-entry compound matrix: it is\n * data about three variants, not about 57 combinations. Text uses the `light` semantic slot, which\n * is Pill's one departure from Badge (Badge uses `default`).\n */\nconst VARIANT_SLOTS: Record<\n  PillVariant,\n  (color: PillColor) => Record<string, string>\n> = {\n  soft: (c) => ({\n    [BG]: semantic(c, \"soft\"),\n    [FG]: semantic(c, \"light\"),\n    [BD]: \"transparent\",\n    [HOV]: semantic(c, \"soft-hover\"),\n  }),\n  solid: (c) => ({\n    [BG]: semantic(c, \"solid\"),\n    [FG]: semantic(c, \"contrast\"),\n    [BD]: \"transparent\",\n    [HOV]: semantic(c, \"solid-hover\"),\n  }),\n  surface: (c) => ({\n    [BG]: semantic(c, \"surface\"),\n    [FG]: semantic(c, \"light\"),\n    [BD]: primitive(c, \"a6\"),\n    [HOV]: semantic(c, \"surface-hover\"),\n  }),\n}\n\nconst useStyles = makeZenithStyles({\n  root: {\n    ...boxModel,\n    display: \"inline-flex\",\n    alignItems: \"center\",\n    // v1 `h-6` — a fixed height, not a minimum.\n    height: \"1.5rem\",\n    gap: tokens.spacingElement1,\n    whiteSpace: \"nowrap\",\n    flexShrink: 0,\n    overflow: \"hidden\",\n    fontSize: tokens.textXs,\n    lineHeight: tokens.leadingXs,\n    fontWeight: tokens.fontWeightBold,\n    paddingInline: tokens.spacingElement2,\n    borderRadius: tokens.radiusMd,\n    transitionProperty: \"color, box-shadow, background-color\",\n    // NEVER write a CSS shorthand in a Griffel style object — see Badge. One atom reads one\n    // custom property; `border` and a later `borderColor` would both survive.\n    ...shorthands.border(\"1px\", \"solid\", `var(${BD})`),\n    // The whole point: one rule each, colour supplied per instance.\n    backgroundColor: `var(${BG})`,\n    color: `var(${FG})`,\n    \":focus-visible\": {\n      outlineWidth: \"2px\",\n      outlineStyle: \"solid\",\n      outlineOffset: \"2px\",\n      outlineColor: tokens.accentA8,\n    },\n    // v1 `[&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:pointer-events-none`.\n    \"& > svg\": {\n      // Literals, not tokens.spacingGroup2: that happens to be 1rem, but a spacing token has no\n      // business describing a dimension. The scale has no size family — noted rather than faked.\n      width: \"1rem\",\n      height: \"1rem\",\n      flexShrink: 0,\n      pointerEvents: \"none\",\n    },\n  },\n  interactive: {\n    cursor: \"pointer\",\n    // The one hover rule. It reads the fourth custom property, line-picked per colour and variant\n    // by VARIANT_SLOTS — never per-colour hover rules.\n    \":hover\": { backgroundColor: `var(${HOV})` },\n  },\n  hasRemove: {\n    ...boxModel,\n    // v1's `pr-1` when a clear button is present.\n    paddingRight: tokens.spacingElement1,\n  },\n  disabled: {\n    pointerEvents: \"none\",\n  },\n  removeSize: {\n    ...boxModel,\n    // v1's `size-4` on the composed ClearButton.\n    width: tokens.spacingGroup2,\n    height: tokens.spacingGroup2,\n  },\n})\n\nexport type PillProps = Omit<React.ComponentProps<\"span\">, \"color\"> & {\n  color?: PillColor\n  /**\n   * Named `variant`, not `style`. v1 called this `style`, which shadows the HTML `style` attribute.\n   * Retrocompat is not a requirement here, so the collision is fixed rather than inherited.\n   */\n  variant?: PillVariant\n  disabled?: boolean\n  onRemove?: (e: React.MouseEvent<HTMLButtonElement>) => void\n}\n\nexport const Pill = React.forwardRef<HTMLSpanElement, PillProps>(function Pill(\n  {\n    className,\n    color = \"accent\",\n    variant = \"soft\",\n    disabled,\n    onRemove,\n    onClick,\n    children,\n    ...props\n  },\n  ref\n) {\n  const styles = useStyles()\n\n  // v1 resolves to gray when disabled and only makes the pill interactive when it has an onClick.\n  const resolvedColor: PillColor = disabled ? \"gray\" : color\n\n  // A decorative family can still arrive from an expression the build cannot see, so this has to\n  // be re-evaluated every commit (WP2B2 — the hook closes over this render's resolved value) — but\n  // it is the RESOLVED family that decides, and the five core families Pill offers (accent, gray,\n  // warning, success, error) need no palette sheet at all.\n  useZenithPaletteTokensFor(resolvedColor)\n  const interactive = !!onClick && !disabled\n\n  // The hover slot is only meaningful while interactive — v1 attaches its hover background class\n  // (`interactive && hoverStyleClasses[...]`) only then, so drop it from the inline properties\n  // otherwise. Setting it unconditionally would be harmless but would claim a hover state that\n  // cannot be reached.\n  const slot = VARIANT_SLOTS[variant](resolvedColor)\n  if (!interactive) delete slot[HOV]\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"pill\"\n      {...{ [SLOT_ATTR]: \"pill\" }}\n      data-disabled={disabled || undefined}\n      role={interactive ? \"button\" : undefined}\n      tabIndex={interactive ? 0 : undefined}\n      onClick={onClick}\n      onKeyDown={\n        interactive\n          ? (e) => {\n              if (e.key === \"Enter\" || e.key === \" \") {\n                e.preventDefault()\n                onClick?.(e as unknown as React.MouseEvent<HTMLSpanElement>)\n              }\n            }\n          : undefined\n      }\n      className={mergeClasses(\n        styles.root,\n        interactive && styles.interactive,\n        onRemove && styles.hasRemove,\n        disabled && styles.disabled,\n        className\n      )}\n      style={{ ...slot } as React.CSSProperties}\n      {...props}\n    >\n      {children}\n      {onRemove && (\n        // v1 composes the shared ClearButton here — hover, focus ring and the size-3 CloseIcon\n        // fallback all live in the lib, not inline.\n        <ClearButton\n          className={styles.removeSize}\n          onClick={onRemove}\n          disabled={disabled}\n        />\n      )}\n    </span>\n  )\n})\n\nexport { COLORS as PILL_COLORS }\n"],"names":["COLORS","BG","FG","BD","HOV","namespaceFor","family","isCoreFamily","NS","PALETTE_NS","semantic","color","slot","primitive","step","VARIANT_SLOTS","c","useStyles","makeZenithStyles","boxModel","tokens.spacingElement1","tokens.textXs","tokens.leadingXs","tokens.fontWeightBold","tokens.spacingElement2","tokens.radiusMd","shorthands","tokens.accentA8","tokens.spacingGroup2","Pill","React","className","variant","disabled","onRemove","onClick","children","props","ref","styles","resolvedColor","useZenithPaletteTokensFor","interactive","jsxs","SLOT_ATTR","e","mergeClasses","jsx","ClearButton"],"mappings":"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"}

package/dist/components/popover/popover.js

@@ -3,7 +3,7 @@ import * as o from "react";
 import { createPortal as q } from "react-dom";
 import { Popover as p } from "../../_virtual/_zenith-runtime-family_popover.js";
 import { useRender as G } from "../../_virtual/_zenith-runtime-family_use-render.js";
-import { SLOT_ATTR as m, mergeClasses as P, shorthands as g } from "@epilot/zenith-runtime/v1/core.js";
+import { SLOT_ATTR as m, mergeClasses as P, shorthands as g } from "@epilot/zenith-runtime/v1";
 import { useAppearanceAttributes as B } from "../appearance-boundary/appearance-boundary.js";
 import { useDensity as J } from "../density-provider/density-provider.js";
 import { makeZenithStyles as K } from "../../styles/make-styles.js";

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/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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"}
+{"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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"}

package/dist/components/radio/radio.js

@@ -1,10 +1,10 @@
 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/core.js";
+import { mergeClasses as b, SLOT_ATTR as l, shorthands as i } from "@epilot/zenith-runtime/v1";
 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";
+import { boxModel as m, nativeControl as v } from "../../styles/host-reset.js";
+import { accentContrast as f, errorA10 as y, 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";
 import { RadioGroupBase as j } from "./radio-group-base.js";
 const G = n.forwardRef(
   function(o, e) {
@@ -26,11 +26,14 @@ const G = n.forwardRef(
   }
 ), C = k({
   group: {
+    // A named group's radios each render a hidden input beside them, absolutely positioned with no
+    // offsets: the group is their containing block, so they cannot escape an app's scroll box (#132).
+    position: "relative",
     display: "grid",
     ...i.gap(T)
   },
   item: {
-    ...y,
+    ...v,
     boxSizing: "border-box",
     display: "inline-flex",
     alignItems: "center",
@@ -76,7 +79,7 @@ const G = n.forwardRef(
       outlineColor: h
     },
     "&[data-checked][aria-invalid='true'], &[data-checked][data-invalid]": {
-      backgroundColor: v,
+      backgroundColor: y,
       ...i.borderColor("transparent")
     }
   },
@@ -106,32 +109,32 @@ function N(a) {
   return o.length === 1 ? o[0] : void 0;
 }
 const F = n.forwardRef(
-  function({ className: o, asChild: e, children: d, ...u }, c) {
-    const s = C(), r = e ? N(d) : void 0;
+  function({ className: o, asChild: e, children: d, ...u }, s) {
+    const c = C(), r = e ? N(d) : void 0;
     return /* @__PURE__ */ t(
       j,
       {
-        ref: c,
+        ref: s,
         "data-slot": "radio-group",
         [l]: "radio-group",
-        className: b(s.group, o),
+        className: b(c.group, o),
         ...u,
         ...r ? { render: r } : { children: d }
       }
     );
   }
-), L = /* @__PURE__ */ t("button", { type: "button" }), P = n.forwardRef(function({ className: o, children: e, asChild: d, checked: u, ...c }, s) {
+), L = /* @__PURE__ */ t("button", { type: "button" }), P = n.forwardRef(function({ className: o, children: e, asChild: d, checked: u, ...s }, c) {
   const r = C();
   return /* @__PURE__ */ x(
     p.Root,
     {
-      ref: s,
+      ref: c,
       nativeButton: !0,
       render: L,
       "data-slot": "radio-group-item",
       [l]: "radio-group-item",
       className: b(r.item, o),
-      ...c,
+      ...s,
       children: [
         /* @__PURE__ */ t(
           p.Indicator,

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/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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"}
+{"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    // A named group's radios each render a hidden input beside them, absolutely positioned with no\n    // offsets: the group is their containing block, so they cannot escape an app's scroll box (#132).\n    position: \"relative\",\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":";;;;;;;;AAcA,MAAMA,IAAaC,EAAM;AAAA,EACvB,SAAoBC,GAAOC,GAAK;AAC9B,WACE,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAD;AAAA,QACA,OAAM;AAAA,QACN,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,QAAO;AAAA,QACP,aAAY;AAAA,QACZ,eAAc;AAAA,QACd,gBAAe;AAAA,QACd,GAAGD;AAAA,QAEJ,4BAAC,UAAA,EAAO,IAAG,MAAK,IAAG,MAAK,GAAE,KAAA,CAAK;AAAA,MAAA;AAAA,IAAA;AAAA,EAGrC;AACF,GAEMG,IAAYC,EAAiB;AAAA,EACjC,OAAO;AAAA;AAAA;AAAA,IAGL,UAAU;AAAA,IACV,SAAS;AAAA,IACT,GAAGC,EAAW,IAAIC,CAAsB;AAAA,EAAA;AAAA,EAE1C,MAAM;AAAA,IACJ,GAAGC;AAAA,IACH,WAAW;AAAA,IACX,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,UAAU;AAAA,IACV,aAAa;AAAA,IACb,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,GAAGF,EAAW,OAAO,OAAO,SAASG,CAAe;AAAA,IACpD,iBAAiBC;AAAAA,IACjB,OAAOC;AAAAA;AAAAA,IAEP,WAAW;AAAA,IACX,oBAAoB;AAAA,IACpB,oBAAoB;AAAA,IACpB,0BAA0B;AAAA,IAC1B,2CAA2C;AAAA,MACzC,oBAAoB;AAAA,IAAA;AAAA,IAEtB,kBAAkB;AAAA,MAChB,eAAe;AAAA,MACf,cAAc;AAAA,MACd,cAAc;AAAA,MACd,cAAcC;AAAAA,IAAO;AAAA,IAEvB,oBAAoB;AAAA,MAClB,QAAQ;AAAA,MACR,iBAAiBC;AAAAA,MACjB,GAAGP,EAAW,YAAY,aAAa;AAAA,IAAA;AAAA,IAEzC,mBAAmB;AAAA,MACjB,iBAAiBQ;AAAAA,MACjB,OAAOC;AAAAA,IAAO;AAAA,IAEhB,kCAAkC;AAAA,MAChC,iBAAiBF;AAAAA,IAAO;AAAA,IAE1B,2CAA2C;AAAA,MACzC,iBAAiBG;AAAAA,MACjB,GAAGV,EAAW,YAAYW,CAAc;AAAA,MACxC,cAAcL;AAAAA,IAAO;AAAA,IAEvB,uEAAuE;AAAA,MACrE,iBAAiBM;AAAAA,MACjB,GAAGZ,EAAW,YAAY,aAAa;AAAA,IAAA;AAAA,EACzC;AAAA,EAEF,WAAW;AAAA,IACT,GAAGa;AAAA,IACH,UAAU;AAAA,IACV,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,OAAO;AAAA,IACP,QAAQ;AAAA,EAAA;AAAA,EAEV,MAAM;AAAA,IACJ,GAAGA;AAAA,IACH,OAAOJ;AAAAA,IACP,UAAU;AAAA,IACV,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,eAAe;AAAA,EAAA;AAEnB,CAAC;AA6DD,SAASK,EAAcC,GAA2B;AAChD,QAAMC,IAAWtB,EAAM,SAAS,QAAQqB,CAAQ,EAAE,OAAOrB,EAAM,cAAc;AAC7E,SAAOsB,EAAS,WAAW,IAAIA,EAAS,CAAC,IAAI;AAC/C;AAEO,MAAMC,IAAavB,EAAM;AAAA,EAC9B,SAAoB,EAAE,WAAAwB,GAAW,SAAAC,GAAS,UAAAJ,GAAU,GAAGpB,EAAA,GAASC,GAAK;AACnE,UAAMwB,IAAStB,EAAA,GACTuB,IAAQF,IAAUL,EAAcC,CAAQ,IAAI;AAElD,WACE,gBAAAlB;AAAA,MAACyB;AAAA,MAAA;AAAA,QACC,KAAA1B;AAAA,QACA,aAAU;AAAA,QACJ,CAAC2B,CAAS,GAAG;AAAA,QACnB,WAAWC,EAAaJ,EAAO,OAAOF,CAAS;AAAA,QAG9C,GAAIvB;AAAA,QACJ,GAAI0B,IAAQ,EAAE,QAAQA,EAAA,IAAU,EAAE,UAAAN,EAAA;AAAA,MAAS;AAAA,IAAA;AAAA,EAGlD;AACF,GA8BMU,IAAe,gBAAA5B,EAAC,UAAA,EAAO,MAAK,SAAA,CAAS,GAE9B6B,IAAiBhC,EAAM,WAGlC,SACA,EAAE,WAAAwB,GAAW,UAAAH,GAAU,SAASY,GAAU,SAASC,GAAU,GAAGjC,EAAA,GAChEC,GACA;AACA,QAAMwB,IAAStB,EAAA;AAEf,SACE,gBAAA+B;AAAA,IAACC,EAAM;AAAA,IAAN;AAAA,MACC,KAAAlC;AAAA,MACA,cAAY;AAAA,MACZ,QAAQ6B;AAAA,MACR,aAAU;AAAA,MACJ,CAACF,CAAS,GAAG;AAAA,MACnB,WAAWC,EAAaJ,EAAO,MAAMF,CAAS;AAAA,MAE7C,GAAIvB;AAAA,MAEL,UAAA;AAAA,QAAA,gBAAAE;AAAA,UAACiC,EAAM;AAAA,UAAN;AAAA,YACC,aAAU;AAAA,YACJ,CAACP,CAAS,GAAG;AAAA,YACnB,WAAWH,EAAO;AAAA,YAElB,UAAA,gBAAAvB,EAACJ,GAAA,EAAW,WAAW2B,EAAO,KAAA,CAAM;AAAA,UAAA;AAAA,QAAA;AAAA,QAErCL;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}

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/core.js";
+import { mergeClasses as x, SLOT_ATTR as a, shorthands as g } from "@epilot/zenith-runtime/v1";
 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";