@epilot/volt-ui-experimental-griffel 0.2.3 → 0.3.1

package/dist/components/list/list.js.map

@@ -1 +1 @@
-{"version":3,"file":"list.js","sources":["../../../src/components/list/list.tsx"],"sourcesContent":["import * as React from \"react\"\nimport {\n  DndContext,\n  DragOverlay,\n  closestCenter,\n  KeyboardSensor,\n  PointerSensor,\n  useSensor,\n  useSensors,\n  type DragEndEvent,\n  type DragStartEvent,\n  type DraggableAttributes,\n  type DraggableSyntheticListeners,\n} from \"@dnd-kit/core\"\nimport {\n  SortableContext,\n  verticalListSortingStrategy,\n  arrayMove,\n  useSortable,\n} from \"@dnd-kit/sortable\"\nimport { mergeClasses, shorthands } from \"@epilot/volt-ui-runtime\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\n\nexport type ListDensity = \"compact\" | \"relaxed\"\nexport type ListItemStatus = \"default\" | \"error\" | \"warning\" | \"success\"\n\n// ── Icons ──────────────────────────────────────────────────────────────────\n\nconst GripVerticalIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"16\"\n    height=\"16\"\n    viewBox=\"0 0 24 24\"\n    fill=\"currentColor\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <circle cx=\"9\" cy=\"5\" r=\"1.5\" />\n    <circle cx=\"15\" cy=\"5\" r=\"1.5\" />\n    <circle cx=\"9\" cy=\"12\" r=\"1.5\" />\n    <circle cx=\"15\" cy=\"12\" r=\"1.5\" />\n    <circle cx=\"9\" cy=\"19\" r=\"1.5\" />\n    <circle cx=\"15\" cy=\"19\" r=\"1.5\" />\n  </svg>\n)\n\nconst WarningIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <path d=\"M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0Z\" />\n    <line x1=\"12\" y1=\"9\" x2=\"12\" y2=\"13\" />\n    <line x1=\"12\" y1=\"17\" x2=\"12.01\" y2=\"17\" />\n  </svg>\n)\n\nconst CheckCircleIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <path d=\"M22 11.08V12a10 10 0 1 1-5.93-9.14\" />\n    <polyline points=\"22 4 12 14.01 9 11.01\" />\n  </svg>\n)\n\nconst ChevronRightIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <polyline points=\"9 18 15 12 9 6\" />\n  </svg>\n)\n\n// ── Styles ─────────────────────────────────────────────────────────────────\n\nconst useStyles = makeVoltStyles({\n  list: {\n    display: \"flex\",\n    width: \"100%\",\n    listStyleType: \"none\",\n    flexDirection: \"column\",\n    ...shorthands.gap(0),\n    ...shorthands.padding(0),\n    ...shorthands.margin(0),\n  },\n\n  // ListItem base\n  item: {\n    position: \"relative\",\n    display: \"flex\",\n    width: \"100%\",\n    alignItems: \"center\",\n    ...shorthands.borderRadius(tokens.radiusMd),\n    color: tokens.grayA12,\n    transitionProperty:\n      \"color, background-color, border-color, text-decoration-color, fill, stroke\",\n    transitionDuration: \"150ms\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    \"& > svg\": {\n      flexShrink: 0,\n    },\n  },\n\n  // Density variants\n  itemCompact: {\n    minHeight: \"2rem\",\n    ...shorthands.gap(tokens.spacingElement2),\n    ...shorthands.padding(tokens.spacingElement1, tokens.spacingElement2),\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n    \"& > svg\": {\n      width: \"1rem\",\n      height: \"1rem\",\n    },\n  },\n  itemRelaxed: {\n    minHeight: \"2.5rem\",\n    // v1 gap-3 is 0.75rem.\n    ...shorthands.gap(tokens.spacingElement3),\n    ...shorthands.padding(tokens.spacingElement2, tokens.spacingElement3),\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n    \"& > svg\": {\n      width: \"1rem\",\n      height: \"1rem\",\n    },\n  },\n\n  // Status variants\n  statusDefault: {},\n  statusError: {\n    backgroundColor: tokens.semErrorSoft,\n    color: tokens.semErrorDefault,\n  },\n  statusWarning: {\n    backgroundColor: tokens.semWarningSoft,\n    color: tokens.semWarningDefault,\n  },\n  statusSuccess: {\n    backgroundColor: tokens.semSuccessSoft,\n    color: tokens.semSuccessDefault,\n  },\n\n  // Striped variant (only neutral rows)\n  stripedEven: {\n    \"&:nth-child(even)\": {\n      backgroundColor: tokens.grayA2,\n    },\n  },\n\n  // Interactive hovers\n  interactiveDefault: {\n    \":hover\": {\n      backgroundColor: tokens.semAccentSoft,\n    },\n  },\n  interactiveError: {\n    \":hover\": {\n      backgroundColor: tokens.semErrorSoftHover,\n    },\n  },\n  interactiveWarning: {\n    \":hover\": {\n      backgroundColor: tokens.semWarningSoftHover,\n    },\n  },\n  interactiveSuccess: {\n    \":hover\": {\n      backgroundColor: tokens.semSuccessSoftHover,\n    },\n  },\n\n  // Sortable modifiers\n  sortableItem: {\n    cursor: \"grab\",\n    touchAction: \"none\",\n    \":active\": {\n      cursor: \"grabbing\",\n    },\n  },\n  itemDragging: {\n    opacity: 0.4,\n  },\n\n  // Index gutter\n  indexBase: {\n    display: \"flex\",\n    flexShrink: 0,\n    userSelect: \"none\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    alignSelf: \"stretch\",\n    borderTopLeftRadius: tokens.radiusMd,\n    borderBottomLeftRadius: tokens.radiusMd,\n    backgroundColor: tokens.grayA2,\n    textAlign: \"center\",\n    color: tokens.grayA11,\n    fontVariantNumeric: \"tabular-nums\",\n  },\n  indexCompact: {\n    marginTop: `-${tokens.spacingElement1}`,\n    marginBottom: `-${tokens.spacingElement1}`,\n    marginLeft: `-${tokens.spacingElement2}`,\n    minWidth: \"1.5rem\",\n    paddingLeft: \"0.375rem\",\n    paddingRight: \"0.375rem\",\n  },\n  indexRelaxed: {\n    marginTop: `-${tokens.spacingElement2}`,\n    marginBottom: `-${tokens.spacingElement2}`,\n    marginLeft: \"-0.75rem\",\n    minWidth: \"1.75rem\",\n    paddingLeft: tokens.spacingElement2,\n    paddingRight: tokens.spacingElement2,\n  },\n\n  // Content\n  content: {\n    display: \"flex\",\n    minWidth: 0,\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n    alignItems: \"center\",\n    ...shorthands.gap(tokens.spacingElement2),\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n    \"& > svg\": {\n      width: \"1rem\",\n      height: \"1rem\",\n      flexShrink: 0,\n    },\n  },\n\n  // Actions\n  actions: {\n    position: \"relative\",\n    zIndex: 10,\n    display: \"flex\",\n    flexShrink: 0,\n    alignItems: \"center\",\n    ...shorthands.gap(tokens.spacingElement1),\n  },\n\n  // Text\n  text: {\n    display: \"flex\",\n    minWidth: 0,\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n    flexDirection: \"column\",\n    ...shorthands.gap(\"0.125rem\"),\n  },\n\n  // Description\n  description: {\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n    fontSize: tokens.textXs,\n    lineHeight: tokens.leadingXs,\n    color: tokens.grayA11,\n  },\n\n  // Drag handle button\n  dragHandle: {\n    position: \"relative\",\n    zIndex: 10,\n    display: \"inline-flex\",\n    flexShrink: 0,\n    cursor: \"grab\",\n    alignItems: \"center\",\n    color: tokens.grayA8,\n    backgroundColor: \"transparent\",\n    ...shorthands.border(\"0\"),\n    ...shorthands.padding(0),\n    \":hover\": {\n      color: tokens.grayA11,\n    },\n    \":active\": {\n      cursor: \"grabbing\",\n    },\n    \":focus-visible\": {\n      outlineWidth: \"2px\",\n      outlineStyle: \"solid\",\n      outlineOffset: \"2px\",\n      outlineColor: tokens.accentA8,\n    },\n    \"& svg\": {\n      width: \"1rem\",\n      height: \"1rem\",\n    },\n  },\n\n  // Drop indicator line\n  dropIndicator: {\n    pointerEvents: \"none\",\n    position: \"absolute\",\n    left: 0,\n    right: 0,\n    zIndex: 10,\n    height: \"0.125rem\",\n    transformOrigin: \"center\",\n    ...shorthands.borderRadius(\"9999px\"),\n    backgroundColor: tokens.semAccentSolid,\n    animationName: {\n      from: {\n        transform: \"scaleX(0)\",\n        opacity: 0,\n      },\n      to: {\n        transform: \"scaleX(1)\",\n        opacity: 1,\n      },\n    },\n    animationDuration: \"160ms\",\n    animationTimingFunction: \"ease-out\",\n  },\n  dropIndicatorTop: {\n    top: \"-0.125rem\",\n  },\n  dropIndicatorBottom: {\n    bottom: \"-0.125rem\",\n  },\n\n  // DragOverlay ghost\n  dragOverlayItem: {\n    transformOrigin: \"center\",\n    transform: \"scale(0.95)\",\n    cursor: \"grabbing\",\n    ...shorthands.border(\"1px\", \"solid\", tokens.grayA5),\n    backgroundColor: \"rgb(255 255 255 / 55%)\",\n    boxShadow: \"0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a\",\n    backdropFilter: \"blur(12px)\",\n    animationName: {\n      from: { transform: \"scale(1)\" },\n      to: { transform: \"scale(0.95)\" },\n    },\n    animationDuration: \"160ms\",\n    animationTimingFunction: \"ease-out\",\n    \":hover\": {\n      backgroundColor: \"rgb(255 255 255 / 55%)\",\n    },\n  },\n\n  // Group\n  group: {\n    listStyleType: \"none\",\n  },\n  groupTrigger: {\n    cursor: \"pointer\",\n    textAlign: \"left\",\n    fontWeight: tokens.fontWeightMedium,\n    backgroundColor: \"transparent\",\n    ...shorthands.border(\"0\"),\n  },\n  groupChevron: {\n    width: \"1rem\",\n    height: \"1rem\",\n    flexShrink: 0,\n    color: tokens.grayA10,\n    transitionProperty: \"transform\",\n    transitionDuration: \"150ms\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n  },\n  groupChevronOpen: {\n    transform: \"rotate(90deg)\",\n  },\n  groupTriggerText: {\n    minWidth: 0,\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n  },\n  standaloneGroupLabel: {\n    marginTop: tokens.spacingGroup2,\n    display: \"block\",\n    listStyleType: \"none\",\n    ...shorthands.padding(\"0.375rem\", tokens.spacingElement3),\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n    fontWeight: tokens.fontWeightSemibold,\n    color: tokens.grayA12,\n    \"&:first-child\": {\n      marginTop: 0,\n    },\n  },\n  groupContentList: {\n    paddingLeft: tokens.spacingGroup2,\n  },\n  collapseWrapper: {\n    display: \"grid\",\n    gridTemplateRows: \"0fr\",\n    transitionProperty: \"grid-template-rows\",\n    transitionDuration: \"200ms\",\n    transitionTimingFunction: \"cubic-bezier(0, 0, 0.2, 1)\",\n    \"&[data-state='open']\": {\n      gridTemplateRows: \"1fr\",\n    },\n  },\n  collapseWrapperOpen: {\n    gridTemplateRows: \"1fr\",\n  },\n  collapseInner: {\n    minHeight: 0,\n    overflow: \"hidden\",\n  },\n\n  // Status icons\n  statusIconError: {\n    width: \"1rem\",\n    height: \"1rem\",\n    flexShrink: 0,\n    color: tokens.semErrorLight,\n  },\n  statusIconWarning: {\n    width: \"1rem\",\n    height: \"1rem\",\n    flexShrink: 0,\n    color: tokens.semWarningLight,\n  },\n  statusIconSuccess: {\n    width: \"1rem\",\n    height: \"1rem\",\n    flexShrink: 0,\n    color: tokens.semSuccessLight,\n  },\n})\n\n// ── Status Icons Helper ────────────────────────────────────────────────────\n\nconst StatusIcon = ({ status }: { status: ListItemStatus }) => {\n  const styles = useStyles()\n  if (status === \"error\") {\n    return <WarningIcon className={styles.statusIconError} />\n  }\n  if (status === \"warning\") {\n    return <WarningIcon className={styles.statusIconWarning} />\n  }\n  if (status === \"success\") {\n    return <CheckCircleIcon className={styles.statusIconSuccess} />\n  }\n  return null\n}\n\n// ── Context ────────────────────────────────────────────────────────────────\n\ntype ListContextValue = {\n  density: ListDensity\n  striped: boolean\n  showIndex: boolean\n  sortable: boolean\n}\n\nconst ListContext = React.createContext<ListContextValue>({\n  density: \"relaxed\",\n  striped: false,\n  showIndex: false,\n  sortable: false,\n})\n\nconst useListContext = () => React.useContext(ListContext)\n\n// ── List ───────────────────────────────────────────────────────────────────\n\nexport type ListProps = Omit<React.ComponentProps<\"ol\">, \"onReorder\"> & {\n  /** Row density. Default: \"relaxed\" */\n  density?: ListDensity\n  /** Alternating background on neutral rows. Default: false */\n  striped?: boolean\n  /** Show a 1-based position number on each item. Default: false */\n  showIndex?: boolean\n  /** Enable drag-and-drop reordering. Each `ListItem` must have a `value`. */\n  sortable?: boolean\n  /** Called with the new order of `ListItem` values after a drag. */\n  onReorder?: (values: string[]) => void\n}\n\nexport const List = React.forwardRef<HTMLOListElement, ListProps>(function List(\n  {\n    className,\n    density = \"relaxed\",\n    striped = false,\n    showIndex = false,\n    sortable = false,\n    onReorder,\n    children,\n    ...props\n  },\n  ref\n) {\n  const styles = useStyles()\n\n  const items = React.Children.toArray(children).filter(\n    React.isValidElement\n  ) as React.ReactElement<ListItemProps>[]\n\n  const indexedItems = items.map((child, index) =>\n    child.type === ListItem ? React.cloneElement(child, { index }) : child\n  )\n\n  const sortableItems = items.filter((child) => child.type === ListItem)\n  const values = sortableItems\n    .map((child) => child.props.value)\n    .filter((v): v is string => typeof v === \"string\")\n\n  const [activeId, setActiveId] = React.useState<string | null>(null)\n  const activeIndex = activeId ? values.indexOf(activeId) : -1\n  const activeItem =\n    activeId != null\n      ? sortableItems.find((child) => child.props.value === activeId)\n      : undefined\n\n  const sensors = useSensors(\n    useSensor(PointerSensor, { activationConstraint: { distance: 3 } }),\n    useSensor(KeyboardSensor)\n  )\n\n  const handleDragStart = (event: DragStartEvent) => {\n    setActiveId(event.active.id as string)\n  }\n\n  const handleDragEnd = (event: DragEndEvent) => {\n    setActiveId(null)\n    const { active, over } = event\n    if (!over || active.id === over.id) return\n\n    const oldIndex = values.indexOf(active.id as string)\n    const newIndex = values.indexOf(over.id as string)\n    if (oldIndex === -1 || newIndex === -1) return\n\n    onReorder?.(arrayMove(values, oldIndex, newIndex))\n  }\n\n  const listElement = (\n    <ol\n      ref={ref}\n      data-slot=\"list\"\n      {...{ [SLOT_ATTR]: \"list\" }}\n      data-density={density}\n      className={mergeClasses(styles.list, className)}\n      {...props}\n    >\n      {indexedItems}\n    </ol>\n  )\n\n  return (\n    <ListContext.Provider value={{ density, striped, showIndex, sortable }}>\n      {sortable ? (\n        <DndContext\n          sensors={sensors}\n          collisionDetection={closestCenter}\n          onDragStart={handleDragStart}\n          onDragEnd={handleDragEnd}\n          onDragCancel={() => setActiveId(null)}\n        >\n          <SortableContext\n            items={values}\n            strategy={verticalListSortingStrategy}\n          >\n            {listElement}\n          </SortableContext>\n          <DragOverlay>\n            {activeItem ? (\n              <ListItemBody\n                value={activeItem.props.value}\n                status={activeItem.props.status}\n                index={activeIndex}\n                className={styles.dragOverlayItem}\n              >\n                {activeItem.props.children}\n              </ListItemBody>\n            ) : null}\n          </DragOverlay>\n        </DndContext>\n      ) : (\n        listElement\n      )}\n    </ListContext.Provider>\n  )\n})\n\n// ── ListItemActions ────────────────────────────────────────────────────────\n\nexport type ListItemActionsProps = React.ComponentProps<\"span\">\n\nexport const ListItemActions = React.forwardRef<\n  HTMLSpanElement,\n  ListItemActionsProps\n>(function ListItemActions({ className, children, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"list-item-actions\"\n      {...{ [SLOT_ATTR]: \"list-item-actions\" }}\n      onPointerDown={(e) => e.stopPropagation()}\n      className={mergeClasses(styles.actions, className)}\n      {...props}\n    >\n      {children}\n    </span>\n  )\n})\n\n// ── ListItemText ───────────────────────────────────────────────────────────\n\nexport type ListItemTextProps = React.ComponentProps<\"span\">\n\nexport const ListItemText = React.forwardRef<\n  HTMLSpanElement,\n  ListItemTextProps\n>(function ListItemText({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"list-item-text\"\n      {...{ [SLOT_ATTR]: \"list-item-text\" }}\n      className={mergeClasses(styles.text, className)}\n      {...props}\n    />\n  )\n})\n\n// ── ListItemDescription ────────────────────────────────────────────────────\n\nexport type ListItemDescriptionProps = React.ComponentProps<\"span\">\n\nexport const ListItemDescription = React.forwardRef<\n  HTMLSpanElement,\n  ListItemDescriptionProps\n>(function ListItemDescription({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"list-item-description\"\n      {...{ [SLOT_ATTR]: \"list-item-description\" }}\n      className={mergeClasses(styles.description, className)}\n      {...props}\n    />\n  )\n})\n\n// ── ListItemBody ───────────────────────────────────────────────────────────\n\nexport type ListItemProps = React.ComponentProps<\"li\"> & {\n  /** Stable id used for drag-and-drop. Required when the `List` is `sortable`. */\n  value?: string\n  /** System status. Tints the row and shows a trailing status icon. */\n  status?: ListItemStatus\n  /** Injected by `List` — the 0-based position. */\n  index?: number\n}\n\ntype ListItemBodyProps = ListItemProps & {\n  setNodeRef?: (node: HTMLElement | null) => void\n  setActivatorNodeRef?: (node: HTMLElement | null) => void\n  style?: React.CSSProperties\n  isDragging?: boolean\n  /** Insertion indicator edge while another item is dragged over this one. */\n  dropEdge?: \"top\" | \"bottom\" | null\n  /** dnd-kit listeners — pointer activation goes on the row, keyboard on the handle. */\n  listeners?: DraggableSyntheticListeners\n  /** dnd-kit a11y attributes for the keyboard drag handle. */\n  attributes?: DraggableAttributes\n}\n\nconst ListItemBody = React.forwardRef<HTMLLIElement, ListItemBodyProps>(\n  function ListItemBody(\n    {\n      className,\n      value,\n      status = \"default\",\n      index,\n      children,\n      setNodeRef,\n      setActivatorNodeRef,\n      style,\n      isDragging,\n      dropEdge,\n      listeners,\n      attributes,\n      ...props\n    },\n    forwardedRef\n  ) {\n    const styles = useStyles()\n    const { density, striped, showIndex, sortable } = useListContext()\n    const interactive = sortable && !isDragging\n\n    const childArray = React.Children.toArray(children)\n    const actionsSlot = childArray.find(\n      (child): child is React.ReactElement =>\n        React.isValidElement(child) && child.type === ListItemActions\n    )\n    const contentChildren = childArray.filter((child) => child !== actionsSlot)\n\n    // Combined ref for dnd-kit setNodeRef + caller's forwardedRef\n    const handleRef = React.useCallback(\n      (node: HTMLLIElement | null) => {\n        setNodeRef?.(node)\n        if (typeof forwardedRef === \"function\") {\n          forwardedRef(node)\n        } else if (forwardedRef) {\n          ;(\n            forwardedRef as React.MutableRefObject<HTMLLIElement | null>\n          ).current = node\n        }\n      },\n      [setNodeRef, forwardedRef]\n    )\n\n    const statusStyle =\n      status === \"error\"\n        ? styles.statusError\n        : status === \"warning\"\n          ? styles.statusWarning\n          : status === \"success\"\n            ? styles.statusSuccess\n            : styles.statusDefault\n\n    const interactiveStyle = interactive\n      ? status === \"error\"\n        ? styles.interactiveError\n        : status === \"warning\"\n          ? styles.interactiveWarning\n          : status === \"success\"\n            ? styles.interactiveSuccess\n            : styles.interactiveDefault\n      : undefined\n\n    const densityStyle =\n      density === \"compact\" ? styles.itemCompact : styles.itemRelaxed\n\n    return (\n      <li\n        ref={handleRef}\n        style={style}\n        data-slot=\"list-item\"\n        {...{ [SLOT_ATTR]: \"list-item\" }}\n        data-status={status}\n        data-value={value}\n        onPointerDown={\n          sortable\n            ? (listeners?.onPointerDown as\n                | React.PointerEventHandler<HTMLLIElement>\n                | undefined)\n            : undefined\n        }\n        className={mergeClasses(\n          styles.item,\n          densityStyle,\n          statusStyle,\n          striped && status === \"default\" && styles.stripedEven,\n          interactiveStyle,\n          sortable && styles.sortableItem,\n          isDragging && styles.itemDragging,\n          className\n        )}\n        {...props}\n      >\n        {dropEdge && (\n          <span\n            data-slot=\"list-drop-indicator\"\n            {...{ [SLOT_ATTR]: \"list-drop-indicator\" }}\n            aria-hidden=\"true\"\n            className={mergeClasses(\n              styles.dropIndicator,\n              dropEdge === \"top\"\n                ? styles.dropIndicatorTop\n                : styles.dropIndicatorBottom\n            )}\n          />\n        )}\n\n        {showIndex && (\n          <span\n            data-slot=\"list-item-index\"\n            {...{ [SLOT_ATTR]: \"list-item-index\" }}\n            aria-hidden=\"true\"\n            className={mergeClasses(\n              styles.indexBase,\n              density === \"compact\" ? styles.indexCompact : styles.indexRelaxed\n            )}\n          >\n            {(index ?? 0) + 1}\n          </span>\n        )}\n\n        <span\n          data-slot=\"list-item-content\"\n          {...{ [SLOT_ATTR]: \"list-item-content\" }}\n          className={styles.content}\n        >\n          {contentChildren}\n        </span>\n\n        <StatusIcon status={status} />\n\n        {actionsSlot}\n\n        {sortable && (\n          <button\n            ref={setActivatorNodeRef}\n            type=\"button\"\n            aria-label={`Drag to reorder ${value ?? \"item\"}`}\n            className={styles.dragHandle}\n            {...attributes}\n            onKeyDown={\n              listeners?.onKeyDown as\n                | React.KeyboardEventHandler<HTMLButtonElement>\n                | undefined\n            }\n          >\n            <GripVerticalIcon />\n          </button>\n        )}\n      </li>\n    )\n  }\n)\n\n// ── SortableListItem ───────────────────────────────────────────────────────\n\nconst SortableListItem = React.forwardRef<HTMLLIElement, ListItemProps>(\n  function SortableListItem(props, ref) {\n    const fallbackId = React.useId()\n\n    if (process.env.NODE_ENV !== \"production\" && props.value === undefined) {\n      console.warn(\n        \"List: a sortable `ListItem` is missing a `value`. \" +\n          \"Give each sortable item a unique `value` so it can be reordered — \" +\n          \"items without one are excluded from `onReorder`.\"\n      )\n    }\n\n    const {\n      attributes,\n      listeners,\n      setNodeRef,\n      setActivatorNodeRef,\n      isDragging,\n      isOver,\n      activeIndex,\n      overIndex,\n    } = useSortable({\n      id: props.value ?? fallbackId,\n      animateLayoutChanges: () => false,\n    })\n\n    const dropEdge: \"top\" | \"bottom\" | null =\n      isOver && !isDragging && activeIndex !== -1\n        ? activeIndex < overIndex\n          ? \"bottom\"\n          : \"top\"\n        : null\n\n    return (\n      <ListItemBody\n        ref={ref}\n        {...props}\n        setNodeRef={setNodeRef}\n        setActivatorNodeRef={setActivatorNodeRef}\n        isDragging={isDragging}\n        dropEdge={dropEdge}\n        listeners={listeners}\n        attributes={attributes}\n      />\n    )\n  }\n)\n\n// ── ListItem ───────────────────────────────────────────────────────────────\n\nexport const ListItem = React.forwardRef<HTMLLIElement, ListItemProps>(\n  function ListItem(props, ref) {\n    const { sortable } = useListContext()\n\n    if (sortable) {\n      return <SortableListItem ref={ref} {...props} />\n    }\n\n    return <ListItemBody ref={ref} {...props} />\n  }\n)\n\n// ── ListGroup ──────────────────────────────────────────────────────────────\n\ntype ListGroupContextValue = {\n  open: boolean\n  setOpen: (open: boolean) => void\n  contentId: string\n}\n\nconst ListGroupContext = React.createContext<ListGroupContextValue | null>(null)\n\nexport type ListGroupProps = Omit<React.ComponentProps<\"li\">, \"onChange\"> & {\n  /** Controlled open state of the collapsible group. */\n  open?: boolean\n  /** Initial open state when uncontrolled. Default: false */\n  defaultOpen?: boolean\n  /** Called when the group is expanded or collapsed. */\n  onOpenChange?: (open: boolean) => void\n}\n\nexport const ListGroup = React.forwardRef<HTMLLIElement, ListGroupProps>(\n  function ListGroup(\n    {\n      open: openProp,\n      defaultOpen = false,\n      onOpenChange,\n      className,\n      children,\n      ...props\n    },\n    ref\n  ) {\n    const styles = useStyles()\n    const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen)\n    const open = openProp ?? uncontrolledOpen\n    const contentId = React.useId()\n\n    const setOpen = (next: boolean) => {\n      if (openProp === undefined) setUncontrolledOpen(next)\n      onOpenChange?.(next)\n    }\n\n    return (\n      <ListGroupContext.Provider value={{ open, setOpen, contentId }}>\n        <li\n          ref={ref}\n          data-slot=\"list-group\"\n          {...{ [SLOT_ATTR]: \"list-group\" }}\n          data-state={open ? \"open\" : \"closed\"}\n          className={mergeClasses(styles.group, className)}\n          {...props}\n        >\n          {children}\n        </li>\n      </ListGroupContext.Provider>\n    )\n  }\n)\n\n// ── ListGroupLabel ─────────────────────────────────────────────────────────\n\nexport type ListGroupLabelProps = React.ComponentProps<\"button\"> & {\n  asListItem?: boolean\n}\n\nexport const ListGroupLabel = React.forwardRef<\n  HTMLElement,\n  ListGroupLabelProps\n>(function ListGroupLabel({ className, children, ...props }, ref) {\n  const styles = useStyles()\n  const group = React.useContext(ListGroupContext)\n  const { density } = useListContext()\n\n  if (group) {\n    const densityStyle =\n      density === \"compact\" ? styles.itemCompact : styles.itemRelaxed\n\n    return (\n      <button\n        ref={ref as React.Ref<HTMLButtonElement>}\n        type=\"button\"\n        data-slot=\"list-group-trigger\"\n        {...{ [SLOT_ATTR]: \"list-group-trigger\" }}\n        aria-expanded={group.open}\n        aria-controls={group.contentId}\n        onClick={() => group.setOpen(!group.open)}\n        className={mergeClasses(\n          styles.item,\n          densityStyle,\n          styles.interactiveDefault,\n          styles.groupTrigger,\n          className\n        )}\n        {...props}\n      >\n        <ChevronRightIcon\n          className={mergeClasses(\n            styles.groupChevron,\n            group.open && styles.groupChevronOpen\n          )}\n        />\n        <span className={styles.groupTriggerText}>{children}</span>\n      </button>\n    )\n  }\n\n  return (\n    <li\n      ref={ref as React.Ref<HTMLLIElement>}\n      data-slot=\"list-group-label\"\n      {...{ [SLOT_ATTR]: \"list-group-label\" }}\n      className={mergeClasses(styles.standaloneGroupLabel, className)}\n    >\n      {children}\n    </li>\n  )\n})\n\n// ── ListGroupContent ───────────────────────────────────────────────────────\n\nexport type ListGroupContentProps = React.ComponentProps<\"ul\">\n\nexport const ListGroupContent = React.forwardRef<\n  HTMLUListElement,\n  ListGroupContentProps\n>(function ListGroupContent({ className, children, ...props }, ref) {\n  const styles = useStyles()\n  const group = React.useContext(ListGroupContext)\n\n  const items = (\n    <ul\n      ref={ref}\n      data-slot=\"list-group-content\"\n      {...{ [SLOT_ATTR]: \"list-group-content\" }}\n      className={mergeClasses(styles.list, styles.groupContentList, className)}\n      {...props}\n    >\n      {children}\n    </ul>\n  )\n\n  if (!group) return items\n\n  return (\n    <div\n      id={group.contentId}\n      data-state={group.open ? \"open\" : \"closed\"}\n      className={mergeClasses(\n        styles.collapseWrapper,\n        group.open && styles.collapseWrapperOpen\n      )}\n    >\n      <div className={styles.collapseInner}>{items}</div>\n    </div>\n  )\n})\n"],"names":["GripVerticalIcon","props","jsxs","jsx","WarningIcon","CheckCircleIcon","ChevronRightIcon","useStyles","makeVoltStyles","shorthands","tokens.radiusMd","tokens.grayA12","tokens.spacingElement2","tokens.spacingElement1","tokens.textSm","tokens.leadingSm","tokens.spacingElement3","tokens.semErrorSoft","tokens.semErrorDefault","tokens.semWarningSoft","tokens.semWarningDefault","tokens.semSuccessSoft","tokens.semSuccessDefault","tokens.grayA2","tokens.semAccentSoft","tokens.semErrorSoftHover","tokens.semWarningSoftHover","tokens.semSuccessSoftHover","tokens.grayA11","tokens.textXs","tokens.leadingXs","tokens.grayA8","tokens.accentA8","tokens.semAccentSolid","tokens.grayA5","tokens.fontWeightMedium","tokens.grayA10","tokens.spacingGroup2","tokens.fontWeightSemibold","tokens.semErrorLight","tokens.semWarningLight","tokens.semSuccessLight","StatusIcon","status","styles","ListContext","React","useListContext","List","className","density","striped","showIndex","sortable","onReorder","children","ref","items","indexedItems","child","index","ListItem","sortableItems","values","v","activeId","setActiveId","activeIndex","activeItem","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","handleDragStart","event","handleDragEnd","active","over","oldIndex","newIndex","arrayMove","listElement","SLOT_ATTR","mergeClasses","DndContext","closestCenter","SortableContext","verticalListSortingStrategy","DragOverlay","ListItemBody","ListItemActions","e","ListItemText","ListItemDescription","value","setNodeRef","setActivatorNodeRef","style","isDragging","dropEdge","listeners","attributes","forwardedRef","interactive","childArray","actionsSlot","contentChildren","handleRef","node","statusStyle","interactiveStyle","densityStyle","SortableListItem","fallbackId","isOver","overIndex","useSortable","ListGroupContext","ListGroup","openProp","defaultOpen","onOpenChange","uncontrolledOpen","setUncontrolledOpen","open","contentId","setOpen","next","ListGroupLabel","group","ListGroupContent"],"mappings":"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"}
+{"version":3,"file":"list.js","sources":["../../../src/components/list/list.tsx"],"sourcesContent":["import * as React from \"react\"\nimport {\n  DndContext,\n  DragOverlay,\n  closestCenter,\n  KeyboardSensor,\n  PointerSensor,\n  useSensor,\n  useSensors,\n  type DragEndEvent,\n  type DragStartEvent,\n  type DraggableAttributes,\n  type DraggableSyntheticListeners,\n} from \"@dnd-kit/core\"\nimport {\n  SortableContext,\n  verticalListSortingStrategy,\n  arrayMove,\n  useSortable,\n} from \"@dnd-kit/sortable\"\nimport { mergeClasses, shorthands } from \"@epilot/volt-ui-runtime\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\n\n/**\n * `relaxed` is a permanent compatibility alias for `normal` (DENSITY-SPEC.md §4.2,\n * WP9B2A-ACCEPTANCE-LIST) — identical geometry, forever, not deprecated. `compact`/`normal`/\n * `comfortable` are the three canonical CSS density tiers (`[data-density]`); `relaxed` never\n * appears as a DOM attribute value — an explicit `density=\"relaxed\"` normalizes to the DOM's\n * canonical `data-density=\"normal\"` (§ List, below), since the generator's three selector blocks\n * only ever match those three literal strings.\n */\nexport type ListDensity = \"compact\" | \"normal\" | \"comfortable\" | \"relaxed\"\nexport type ListItemStatus = \"default\" | \"error\" | \"warning\" | \"success\"\n\n// ── Icons ──────────────────────────────────────────────────────────────────\n\nconst GripVerticalIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"16\"\n    height=\"16\"\n    viewBox=\"0 0 24 24\"\n    fill=\"currentColor\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <circle cx=\"9\" cy=\"5\" r=\"1.5\" />\n    <circle cx=\"15\" cy=\"5\" r=\"1.5\" />\n    <circle cx=\"9\" cy=\"12\" r=\"1.5\" />\n    <circle cx=\"15\" cy=\"12\" r=\"1.5\" />\n    <circle cx=\"9\" cy=\"19\" r=\"1.5\" />\n    <circle cx=\"15\" cy=\"19\" r=\"1.5\" />\n  </svg>\n)\n\nconst WarningIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <path d=\"M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0Z\" />\n    <line x1=\"12\" y1=\"9\" x2=\"12\" y2=\"13\" />\n    <line x1=\"12\" y1=\"17\" x2=\"12.01\" y2=\"17\" />\n  </svg>\n)\n\nconst CheckCircleIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <path d=\"M22 11.08V12a10 10 0 1 1-5.93-9.14\" />\n    <polyline points=\"22 4 12 14.01 9 11.01\" />\n  </svg>\n)\n\nconst ChevronRightIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <polyline points=\"9 18 15 12 9 6\" />\n  </svg>\n)\n\n// ── Styles ─────────────────────────────────────────────────────────────────\n\nconst useStyles = makeVoltStyles({\n  list: {\n    display: \"flex\",\n    width: \"100%\",\n    listStyleType: \"none\",\n    flexDirection: \"column\",\n    ...shorthands.gap(0),\n    ...shorthands.padding(0),\n    ...shorthands.margin(0),\n  },\n\n  // ListItem base — density-bound (DENSITY-SPEC.md §2.2, WP9B2A-ACCEPTANCE-LIST). One style, not\n  // a compact/relaxed pair: the three CSS tiers are resolved by [data-density] inheritance, so\n  // there is no longer a JS branch to pick between \"compact\" and \"everything else\" — normal\n  // resolves to the same values `itemRelaxed` used to hardcode, and an explicit `relaxed` is\n  // normalized to the DOM's canonical `data-density=\"normal\"` before it ever reaches this class,\n  // so it resolves through the identical selector. Typography is unchanged across every tier.\n  item: {\n    position: \"relative\",\n    display: \"flex\",\n    width: \"100%\",\n    alignItems: \"center\",\n    ...shorthands.borderRadius(tokens.radiusMd),\n    color: tokens.grayA12,\n    transitionProperty:\n      \"color, background-color, border-color, text-decoration-color, fill, stroke\",\n    transitionDuration: \"150ms\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    minHeight: tokens.listItemMinHeight,\n    ...shorthands.gap(tokens.listItemGap),\n    ...shorthands.padding(tokens.listItemPaddingY, tokens.listItemPaddingX),\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n    \"& > svg\": {\n      flexShrink: 0,\n      width: \"1rem\",\n      height: \"1rem\",\n    },\n  },\n\n  // Status variants\n  statusDefault: {},\n  statusError: {\n    backgroundColor: tokens.semErrorSoft,\n    color: tokens.semErrorDefault,\n  },\n  statusWarning: {\n    backgroundColor: tokens.semWarningSoft,\n    color: tokens.semWarningDefault,\n  },\n  statusSuccess: {\n    backgroundColor: tokens.semSuccessSoft,\n    color: tokens.semSuccessDefault,\n  },\n\n  // Striped variant (only neutral rows)\n  stripedEven: {\n    \"&:nth-child(even)\": {\n      backgroundColor: tokens.grayA2,\n    },\n  },\n\n  // Interactive hovers\n  interactiveDefault: {\n    \":hover\": {\n      backgroundColor: tokens.semAccentSoft,\n    },\n  },\n  interactiveError: {\n    \":hover\": {\n      backgroundColor: tokens.semErrorSoftHover,\n    },\n  },\n  interactiveWarning: {\n    \":hover\": {\n      backgroundColor: tokens.semWarningSoftHover,\n    },\n  },\n  interactiveSuccess: {\n    \":hover\": {\n      backgroundColor: tokens.semSuccessSoftHover,\n    },\n  },\n\n  // Sortable modifiers\n  sortableItem: {\n    cursor: \"grab\",\n    touchAction: \"none\",\n    \":active\": {\n      cursor: \"grabbing\",\n    },\n  },\n  itemDragging: {\n    opacity: 0.4,\n  },\n\n  // Index gutter — density-bound. The negative margins cancel the ITEM's own (now density-bound)\n  // padding to keep the index flush to the row edge at every tier; `calc(-1 * var(...))`\n  // (WP9B2A-ACCEPTANCE-LIST: \"negative token expressions for that existing cancellation are\n  // authorized\") tracks whichever tier is active without a separate JS branch, same reasoning as\n  // `item` above. `index-padding-x` is the one matrix completion this slice adds (DENSITY-SPEC.md\n  // §2.2): 6/8/8px — comfortable reuses the normal inset, no separate source value exists for it.\n  indexBase: {\n    display: \"flex\",\n    flexShrink: 0,\n    userSelect: \"none\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    alignSelf: \"stretch\",\n    borderTopLeftRadius: tokens.radiusMd,\n    borderBottomLeftRadius: tokens.radiusMd,\n    backgroundColor: tokens.grayA2,\n    textAlign: \"center\",\n    color: tokens.grayA11,\n    fontVariantNumeric: \"tabular-nums\",\n    minWidth: tokens.listIndexMinWidth,\n    marginTop: `calc(-1 * ${tokens.listItemPaddingY})`,\n    marginBottom: `calc(-1 * ${tokens.listItemPaddingY})`,\n    marginLeft: `calc(-1 * ${tokens.listItemPaddingX})`,\n    paddingLeft: tokens.listIndexPaddingX,\n    paddingRight: tokens.listIndexPaddingX,\n  },\n\n  // Content\n  content: {\n    display: \"flex\",\n    minWidth: 0,\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n    alignItems: \"center\",\n    ...shorthands.gap(tokens.spacingElement2),\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n    \"& > svg\": {\n      width: \"1rem\",\n      height: \"1rem\",\n      flexShrink: 0,\n    },\n  },\n\n  // Actions\n  actions: {\n    position: \"relative\",\n    zIndex: 10,\n    display: \"flex\",\n    flexShrink: 0,\n    alignItems: \"center\",\n    ...shorthands.gap(tokens.spacingElement1),\n  },\n\n  // Text\n  text: {\n    display: \"flex\",\n    minWidth: 0,\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n    flexDirection: \"column\",\n    ...shorthands.gap(\"0.125rem\"),\n  },\n\n  // Description\n  description: {\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n    fontSize: tokens.textXs,\n    lineHeight: tokens.leadingXs,\n    color: tokens.grayA11,\n  },\n\n  // Drag handle button\n  dragHandle: {\n    position: \"relative\",\n    zIndex: 10,\n    display: \"inline-flex\",\n    flexShrink: 0,\n    cursor: \"grab\",\n    alignItems: \"center\",\n    color: tokens.grayA8,\n    backgroundColor: \"transparent\",\n    ...shorthands.border(\"0\"),\n    ...shorthands.padding(0),\n    \":hover\": {\n      color: tokens.grayA11,\n    },\n    \":active\": {\n      cursor: \"grabbing\",\n    },\n    \":focus-visible\": {\n      outlineWidth: \"2px\",\n      outlineStyle: \"solid\",\n      outlineOffset: \"2px\",\n      outlineColor: tokens.accentA8,\n    },\n    \"& svg\": {\n      width: \"1rem\",\n      height: \"1rem\",\n    },\n  },\n\n  // Drop indicator line\n  dropIndicator: {\n    pointerEvents: \"none\",\n    position: \"absolute\",\n    left: 0,\n    right: 0,\n    zIndex: 10,\n    height: \"0.125rem\",\n    transformOrigin: \"center\",\n    ...shorthands.borderRadius(\"9999px\"),\n    backgroundColor: tokens.semAccentSolid,\n    animationName: {\n      from: {\n        transform: \"scaleX(0)\",\n        opacity: 0,\n      },\n      to: {\n        transform: \"scaleX(1)\",\n        opacity: 1,\n      },\n    },\n    animationDuration: \"160ms\",\n    animationTimingFunction: \"ease-out\",\n  },\n  dropIndicatorTop: {\n    top: \"-0.125rem\",\n  },\n  dropIndicatorBottom: {\n    bottom: \"-0.125rem\",\n  },\n\n  // DragOverlay ghost\n  dragOverlayItem: {\n    transformOrigin: \"center\",\n    transform: \"scale(0.95)\",\n    cursor: \"grabbing\",\n    ...shorthands.border(\"1px\", \"solid\", tokens.grayA5),\n    backgroundColor: \"rgb(255 255 255 / 55%)\",\n    boxShadow: \"0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a\",\n    backdropFilter: \"blur(12px)\",\n    animationName: {\n      from: { transform: \"scale(1)\" },\n      to: { transform: \"scale(0.95)\" },\n    },\n    animationDuration: \"160ms\",\n    animationTimingFunction: \"ease-out\",\n    \":hover\": {\n      backgroundColor: \"rgb(255 255 255 / 55%)\",\n    },\n  },\n\n  // Group\n  group: {\n    listStyleType: \"none\",\n  },\n  groupTrigger: {\n    cursor: \"pointer\",\n    textAlign: \"left\",\n    fontWeight: tokens.fontWeightMedium,\n    backgroundColor: \"transparent\",\n    ...shorthands.border(\"0\"),\n  },\n  groupChevron: {\n    width: \"1rem\",\n    height: \"1rem\",\n    flexShrink: 0,\n    color: tokens.grayA10,\n    transitionProperty: \"transform\",\n    transitionDuration: \"150ms\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n  },\n  groupChevronOpen: {\n    transform: \"rotate(90deg)\",\n  },\n  groupTriggerText: {\n    minWidth: 0,\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n  },\n  standaloneGroupLabel: {\n    marginTop: tokens.spacingGroup2,\n    display: \"block\",\n    listStyleType: \"none\",\n    ...shorthands.padding(\"0.375rem\", tokens.spacingElement3),\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n    fontWeight: tokens.fontWeightSemibold,\n    color: tokens.grayA12,\n    \"&:first-child\": {\n      marginTop: 0,\n    },\n  },\n  groupContentList: {\n    paddingLeft: tokens.spacingGroup2,\n  },\n  collapseWrapper: {\n    display: \"grid\",\n    gridTemplateRows: \"0fr\",\n    transitionProperty: \"grid-template-rows\",\n    transitionDuration: \"200ms\",\n    transitionTimingFunction: \"cubic-bezier(0, 0, 0.2, 1)\",\n    \"&[data-state='open']\": {\n      gridTemplateRows: \"1fr\",\n    },\n  },\n  collapseWrapperOpen: {\n    gridTemplateRows: \"1fr\",\n  },\n  collapseInner: {\n    minHeight: 0,\n    overflow: \"hidden\",\n  },\n\n  // Status icons\n  statusIconError: {\n    width: \"1rem\",\n    height: \"1rem\",\n    flexShrink: 0,\n    color: tokens.semErrorLight,\n  },\n  statusIconWarning: {\n    width: \"1rem\",\n    height: \"1rem\",\n    flexShrink: 0,\n    color: tokens.semWarningLight,\n  },\n  statusIconSuccess: {\n    width: \"1rem\",\n    height: \"1rem\",\n    flexShrink: 0,\n    color: tokens.semSuccessLight,\n  },\n})\n\n// ── Status Icons Helper ────────────────────────────────────────────────────\n\nconst StatusIcon = ({ status }: { status: ListItemStatus }) => {\n  const styles = useStyles()\n  if (status === \"error\") {\n    return <WarningIcon className={styles.statusIconError} />\n  }\n  if (status === \"warning\") {\n    return <WarningIcon className={styles.statusIconWarning} />\n  }\n  if (status === \"success\") {\n    return <CheckCircleIcon className={styles.statusIconSuccess} />\n  }\n  return null\n}\n\n// ── Context ────────────────────────────────────────────────────────────────\n\n/**\n * `density` is deliberately NOT here — every downstream consumer (`ListItemBody`,\n * `ListGroupLabel`'s collapsible-trigger branch) now reads geometry from CSS custom properties via\n * `[data-density]` inheritance, not from this context. `ListContext` is private/unexported (unlike\n * `TableDensityContext`), so it never had the public-`Provider`-compatibility problem\n * `TABLE-LIST-DENSITY-COMPATIBILITY-NOTE.md` describes for Table — there is no external raw\n * Provider to reconcile with, so no marker/comparison mechanism is needed here.\n */\ntype ListContextValue = {\n  striped: boolean\n  showIndex: boolean\n  sortable: boolean\n}\n\nconst ListContext = React.createContext<ListContextValue>({\n  striped: false,\n  showIndex: false,\n  sortable: false,\n})\n\nconst useListContext = () => React.useContext(ListContext)\n\n/**\n * `undefined` (density omitted) stays `undefined` — no implicit normal stamp, so the `<ol>`\n * inherits ambient CSS density through ordinary DOM inheritance. Explicit `relaxed` normalizes to\n * the canonical DOM value `\"normal\"`: the generator's three selector blocks\n * (`packages/tokens/scripts/lib/model.ts`, `densitySelector`) only ever match the literal strings\n * `\"compact\"`/`\"normal\"`/`\"comfortable\"`, so a raw `data-density=\"relaxed\"` attribute would match\n * none of them and silently fall through to whatever ancestor happens to be there — not the\n * pixel-identical-to-normal geometry `relaxed` promises. Every other explicit value passes through\n * unchanged.\n */\nconst canonicalDomDensity = (\n  density: ListDensity | undefined\n): \"compact\" | \"normal\" | \"comfortable\" | undefined =>\n  density === undefined\n    ? undefined\n    : density === \"relaxed\"\n      ? \"normal\"\n      : density\n\n// ── List ───────────────────────────────────────────────────────────────────\n\nexport type ListProps = Omit<React.ComponentProps<\"ol\">, \"onReorder\"> & {\n  /**\n   * Row density. Omitted inherits the ambient shell `[data-density]` (no stamp is written).\n   * `\"relaxed\"` is a permanent alias for `\"normal\"` — identical geometry, normalized to\n   * `data-density=\"normal\"` in the DOM. An explicit value (including `\"relaxed\"`) creates a\n   * canonical density boundary for this list's subtree and its `DragOverlay`.\n   */\n  density?: ListDensity\n  /** Alternating background on neutral rows. Default: false */\n  striped?: boolean\n  /** Show a 1-based position number on each item. Default: false */\n  showIndex?: boolean\n  /** Enable drag-and-drop reordering. Each `ListItem` must have a `value`. */\n  sortable?: boolean\n  /** Called with the new order of `ListItem` values after a drag. */\n  onReorder?: (values: string[]) => void\n}\n\nexport const List = React.forwardRef<HTMLOListElement, ListProps>(function List(\n  {\n    className,\n    density,\n    striped = false,\n    showIndex = false,\n    sortable = false,\n    onReorder,\n    children,\n    ...props\n  },\n  ref\n) {\n  const styles = useStyles()\n  const domDensity = canonicalDomDensity(density)\n\n  const items = React.Children.toArray(children).filter(\n    React.isValidElement\n  ) as React.ReactElement<ListItemProps>[]\n\n  const indexedItems = items.map((child, index) =>\n    child.type === ListItem ? React.cloneElement(child, { index }) : child\n  )\n\n  const sortableItems = items.filter((child) => child.type === ListItem)\n  const values = sortableItems\n    .map((child) => child.props.value)\n    .filter((v): v is string => typeof v === \"string\")\n\n  const [activeId, setActiveId] = React.useState<string | null>(null)\n  const activeIndex = activeId ? values.indexOf(activeId) : -1\n  const activeItem =\n    activeId != null\n      ? sortableItems.find((child) => child.props.value === activeId)\n      : undefined\n\n  const sensors = useSensors(\n    useSensor(PointerSensor, { activationConstraint: { distance: 3 } }),\n    useSensor(KeyboardSensor)\n  )\n\n  const handleDragStart = (event: DragStartEvent) => {\n    setActiveId(event.active.id as string)\n  }\n\n  const handleDragEnd = (event: DragEndEvent) => {\n    setActiveId(null)\n    const { active, over } = event\n    if (!over || active.id === over.id) return\n\n    const oldIndex = values.indexOf(active.id as string)\n    const newIndex = values.indexOf(over.id as string)\n    if (oldIndex === -1 || newIndex === -1) return\n\n    onReorder?.(arrayMove(values, oldIndex, newIndex))\n  }\n\n  const listElement = (\n    <ol\n      ref={ref}\n      data-slot=\"list\"\n      {...{ [SLOT_ATTR]: \"list\" }}\n      {...(domDensity !== undefined ? { \"data-density\": domDensity } : {})}\n      className={mergeClasses(styles.list, className)}\n      {...props}\n    >\n      {indexedItems}\n    </ol>\n  )\n\n  return (\n    <ListContext.Provider value={{ striped, showIndex, sortable }}>\n      {sortable ? (\n        <DndContext\n          sensors={sensors}\n          collisionDetection={closestCenter}\n          onDragStart={handleDragStart}\n          onDragEnd={handleDragEnd}\n          onDragCancel={() => setActiveId(null)}\n        >\n          <SortableContext\n            items={values}\n            strategy={verticalListSortingStrategy}\n          >\n            {listElement}\n          </SortableContext>\n          <DragOverlay>\n            {activeItem ? (\n              <ListItemBody\n                value={activeItem.props.value}\n                status={activeItem.props.status}\n                index={activeIndex}\n                className={styles.dragOverlayItem}\n                // Reasserted only for an EXPLICIT density (TABLE-LIST-DENSITY-COMPATIBILITY-NOTE.md\n                // §2.5): DragOverlay is an ordinary DOM sibling of `listElement`, not a portal\n                // (dnd-kit's `PositionedOverlay` renders in place — confirmed from the installed\n                // source), so an omitted/ambient density already reaches it correctly through the\n                // real DOM tree with no stamp at all. Stamping the resolved value unconditionally\n                // would mask a correct ambient value with a stale JS default. The boundary lands\n                // directly on this existing `ListItemBody` root, not a new wrapper.\n                {...(domDensity !== undefined\n                  ? { \"data-density\": domDensity }\n                  : {})}\n              >\n                {activeItem.props.children}\n              </ListItemBody>\n            ) : null}\n          </DragOverlay>\n        </DndContext>\n      ) : (\n        listElement\n      )}\n    </ListContext.Provider>\n  )\n})\n\n// ── ListItemActions ────────────────────────────────────────────────────────\n\nexport type ListItemActionsProps = React.ComponentProps<\"span\">\n\nexport const ListItemActions = React.forwardRef<\n  HTMLSpanElement,\n  ListItemActionsProps\n>(function ListItemActions({ className, children, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"list-item-actions\"\n      {...{ [SLOT_ATTR]: \"list-item-actions\" }}\n      onPointerDown={(e) => e.stopPropagation()}\n      className={mergeClasses(styles.actions, className)}\n      {...props}\n    >\n      {children}\n    </span>\n  )\n})\n\n// ── ListItemText ───────────────────────────────────────────────────────────\n\nexport type ListItemTextProps = React.ComponentProps<\"span\">\n\nexport const ListItemText = React.forwardRef<\n  HTMLSpanElement,\n  ListItemTextProps\n>(function ListItemText({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"list-item-text\"\n      {...{ [SLOT_ATTR]: \"list-item-text\" }}\n      className={mergeClasses(styles.text, className)}\n      {...props}\n    />\n  )\n})\n\n// ── ListItemDescription ────────────────────────────────────────────────────\n\nexport type ListItemDescriptionProps = React.ComponentProps<\"span\">\n\nexport const ListItemDescription = React.forwardRef<\n  HTMLSpanElement,\n  ListItemDescriptionProps\n>(function ListItemDescription({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <span\n      ref={ref}\n      data-slot=\"list-item-description\"\n      {...{ [SLOT_ATTR]: \"list-item-description\" }}\n      className={mergeClasses(styles.description, className)}\n      {...props}\n    />\n  )\n})\n\n// ── ListItemBody ───────────────────────────────────────────────────────────\n\nexport type ListItemProps = React.ComponentProps<\"li\"> & {\n  /** Stable id used for drag-and-drop. Required when the `List` is `sortable`. */\n  value?: string\n  /** System status. Tints the row and shows a trailing status icon. */\n  status?: ListItemStatus\n  /** Injected by `List` — the 0-based position. */\n  index?: number\n}\n\ntype ListItemBodyProps = ListItemProps & {\n  setNodeRef?: (node: HTMLElement | null) => void\n  setActivatorNodeRef?: (node: HTMLElement | null) => void\n  style?: React.CSSProperties\n  isDragging?: boolean\n  /** Insertion indicator edge while another item is dragged over this one. */\n  dropEdge?: \"top\" | \"bottom\" | null\n  /** dnd-kit listeners — pointer activation goes on the row, keyboard on the handle. */\n  listeners?: DraggableSyntheticListeners\n  /** dnd-kit a11y attributes for the keyboard drag handle. */\n  attributes?: DraggableAttributes\n}\n\nconst ListItemBody = React.forwardRef<HTMLLIElement, ListItemBodyProps>(\n  function ListItemBody(\n    {\n      className,\n      value,\n      status = \"default\",\n      index,\n      children,\n      setNodeRef,\n      setActivatorNodeRef,\n      style,\n      isDragging,\n      dropEdge,\n      listeners,\n      attributes,\n      ...props\n    },\n    forwardedRef\n  ) {\n    const styles = useStyles()\n    const { striped, showIndex, sortable } = useListContext()\n    const interactive = sortable && !isDragging\n\n    const childArray = React.Children.toArray(children)\n    const actionsSlot = childArray.find(\n      (child): child is React.ReactElement =>\n        React.isValidElement(child) && child.type === ListItemActions\n    )\n    const contentChildren = childArray.filter((child) => child !== actionsSlot)\n\n    // Combined ref for dnd-kit setNodeRef + caller's forwardedRef\n    const handleRef = React.useCallback(\n      (node: HTMLLIElement | null) => {\n        setNodeRef?.(node)\n        if (typeof forwardedRef === \"function\") {\n          forwardedRef(node)\n        } else if (forwardedRef) {\n          ;(\n            forwardedRef as React.MutableRefObject<HTMLLIElement | null>\n          ).current = node\n        }\n      },\n      [setNodeRef, forwardedRef]\n    )\n\n    const statusStyle =\n      status === \"error\"\n        ? styles.statusError\n        : status === \"warning\"\n          ? styles.statusWarning\n          : status === \"success\"\n            ? styles.statusSuccess\n            : styles.statusDefault\n\n    const interactiveStyle = interactive\n      ? status === \"error\"\n        ? styles.interactiveError\n        : status === \"warning\"\n          ? styles.interactiveWarning\n          : status === \"success\"\n            ? styles.interactiveSuccess\n            : styles.interactiveDefault\n      : undefined\n\n    return (\n      <li\n        ref={handleRef}\n        style={style}\n        data-slot=\"list-item\"\n        {...{ [SLOT_ATTR]: \"list-item\" }}\n        data-status={status}\n        data-value={value}\n        onPointerDown={\n          sortable\n            ? (listeners?.onPointerDown as\n                | React.PointerEventHandler<HTMLLIElement>\n                | undefined)\n            : undefined\n        }\n        className={mergeClasses(\n          styles.item,\n          statusStyle,\n          striped && status === \"default\" && styles.stripedEven,\n          interactiveStyle,\n          sortable && styles.sortableItem,\n          isDragging && styles.itemDragging,\n          className\n        )}\n        {...props}\n      >\n        {dropEdge && (\n          <span\n            data-slot=\"list-drop-indicator\"\n            {...{ [SLOT_ATTR]: \"list-drop-indicator\" }}\n            aria-hidden=\"true\"\n            className={mergeClasses(\n              styles.dropIndicator,\n              dropEdge === \"top\"\n                ? styles.dropIndicatorTop\n                : styles.dropIndicatorBottom\n            )}\n          />\n        )}\n\n        {showIndex && (\n          <span\n            data-slot=\"list-item-index\"\n            {...{ [SLOT_ATTR]: \"list-item-index\" }}\n            aria-hidden=\"true\"\n            className={styles.indexBase}\n          >\n            {(index ?? 0) + 1}\n          </span>\n        )}\n\n        <span\n          data-slot=\"list-item-content\"\n          {...{ [SLOT_ATTR]: \"list-item-content\" }}\n          className={styles.content}\n        >\n          {contentChildren}\n        </span>\n\n        <StatusIcon status={status} />\n\n        {actionsSlot}\n\n        {sortable && (\n          <button\n            ref={setActivatorNodeRef}\n            type=\"button\"\n            aria-label={`Drag to reorder ${value ?? \"item\"}`}\n            className={styles.dragHandle}\n            {...attributes}\n            onKeyDown={\n              listeners?.onKeyDown as\n                | React.KeyboardEventHandler<HTMLButtonElement>\n                | undefined\n            }\n          >\n            <GripVerticalIcon />\n          </button>\n        )}\n      </li>\n    )\n  }\n)\n\n// ── SortableListItem ───────────────────────────────────────────────────────\n\nconst SortableListItem = React.forwardRef<HTMLLIElement, ListItemProps>(\n  function SortableListItem(props, ref) {\n    const fallbackId = React.useId()\n\n    if (process.env.NODE_ENV !== \"production\" && props.value === undefined) {\n      console.warn(\n        \"List: a sortable `ListItem` is missing a `value`. \" +\n          \"Give each sortable item a unique `value` so it can be reordered — \" +\n          \"items without one are excluded from `onReorder`.\"\n      )\n    }\n\n    const {\n      attributes,\n      listeners,\n      setNodeRef,\n      setActivatorNodeRef,\n      isDragging,\n      isOver,\n      activeIndex,\n      overIndex,\n    } = useSortable({\n      id: props.value ?? fallbackId,\n      animateLayoutChanges: () => false,\n    })\n\n    const dropEdge: \"top\" | \"bottom\" | null =\n      isOver && !isDragging && activeIndex !== -1\n        ? activeIndex < overIndex\n          ? \"bottom\"\n          : \"top\"\n        : null\n\n    return (\n      <ListItemBody\n        ref={ref}\n        {...props}\n        setNodeRef={setNodeRef}\n        setActivatorNodeRef={setActivatorNodeRef}\n        isDragging={isDragging}\n        dropEdge={dropEdge}\n        listeners={listeners}\n        attributes={attributes}\n      />\n    )\n  }\n)\n\n// ── ListItem ───────────────────────────────────────────────────────────────\n\nexport const ListItem = React.forwardRef<HTMLLIElement, ListItemProps>(\n  function ListItem(props, ref) {\n    const { sortable } = useListContext()\n\n    if (sortable) {\n      return <SortableListItem ref={ref} {...props} />\n    }\n\n    return <ListItemBody ref={ref} {...props} />\n  }\n)\n\n// ── ListGroup ──────────────────────────────────────────────────────────────\n\ntype ListGroupContextValue = {\n  open: boolean\n  setOpen: (open: boolean) => void\n  contentId: string\n}\n\nconst ListGroupContext = React.createContext<ListGroupContextValue | null>(null)\n\nexport type ListGroupProps = Omit<React.ComponentProps<\"li\">, \"onChange\"> & {\n  /** Controlled open state of the collapsible group. */\n  open?: boolean\n  /** Initial open state when uncontrolled. Default: false */\n  defaultOpen?: boolean\n  /** Called when the group is expanded or collapsed. */\n  onOpenChange?: (open: boolean) => void\n}\n\nexport const ListGroup = React.forwardRef<HTMLLIElement, ListGroupProps>(\n  function ListGroup(\n    {\n      open: openProp,\n      defaultOpen = false,\n      onOpenChange,\n      className,\n      children,\n      ...props\n    },\n    ref\n  ) {\n    const styles = useStyles()\n    const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen)\n    const open = openProp ?? uncontrolledOpen\n    const contentId = React.useId()\n\n    const setOpen = (next: boolean) => {\n      if (openProp === undefined) setUncontrolledOpen(next)\n      onOpenChange?.(next)\n    }\n\n    return (\n      <ListGroupContext.Provider value={{ open, setOpen, contentId }}>\n        <li\n          ref={ref}\n          data-slot=\"list-group\"\n          {...{ [SLOT_ATTR]: \"list-group\" }}\n          data-state={open ? \"open\" : \"closed\"}\n          className={mergeClasses(styles.group, className)}\n          {...props}\n        >\n          {children}\n        </li>\n      </ListGroupContext.Provider>\n    )\n  }\n)\n\n// ── ListGroupLabel ─────────────────────────────────────────────────────────\n\nexport type ListGroupLabelProps = React.ComponentProps<\"button\"> & {\n  asListItem?: boolean\n}\n\nexport const ListGroupLabel = React.forwardRef<\n  HTMLElement,\n  ListGroupLabelProps\n>(function ListGroupLabel({ className, children, ...props }, ref) {\n  const styles = useStyles()\n  const group = React.useContext(ListGroupContext)\n\n  if (group) {\n    return (\n      <button\n        ref={ref as React.Ref<HTMLButtonElement>}\n        type=\"button\"\n        data-slot=\"list-group-trigger\"\n        {...{ [SLOT_ATTR]: \"list-group-trigger\" }}\n        aria-expanded={group.open}\n        aria-controls={group.contentId}\n        onClick={() => group.setOpen(!group.open)}\n        className={mergeClasses(\n          styles.item,\n          styles.interactiveDefault,\n          styles.groupTrigger,\n          className\n        )}\n        {...props}\n      >\n        <ChevronRightIcon\n          className={mergeClasses(\n            styles.groupChevron,\n            group.open && styles.groupChevronOpen\n          )}\n        />\n        <span className={styles.groupTriggerText}>{children}</span>\n      </button>\n    )\n  }\n\n  return (\n    <li\n      ref={ref as React.Ref<HTMLLIElement>}\n      data-slot=\"list-group-label\"\n      {...{ [SLOT_ATTR]: \"list-group-label\" }}\n      className={mergeClasses(styles.standaloneGroupLabel, className)}\n    >\n      {children}\n    </li>\n  )\n})\n\n// ── ListGroupContent ───────────────────────────────────────────────────────\n\nexport type ListGroupContentProps = React.ComponentProps<\"ul\">\n\nexport const ListGroupContent = React.forwardRef<\n  HTMLUListElement,\n  ListGroupContentProps\n>(function ListGroupContent({ className, children, ...props }, ref) {\n  const styles = useStyles()\n  const group = React.useContext(ListGroupContext)\n\n  const items = (\n    <ul\n      ref={ref}\n      data-slot=\"list-group-content\"\n      {...{ [SLOT_ATTR]: \"list-group-content\" }}\n      className={mergeClasses(styles.list, styles.groupContentList, className)}\n      {...props}\n    >\n      {children}\n    </ul>\n  )\n\n  if (!group) return items\n\n  return (\n    <div\n      id={group.contentId}\n      data-state={group.open ? \"open\" : \"closed\"}\n      className={mergeClasses(\n        styles.collapseWrapper,\n        group.open && styles.collapseWrapperOpen\n      )}\n    >\n      <div className={styles.collapseInner}>{items}</div>\n    </div>\n  )\n})\n"],"names":["GripVerticalIcon","props","jsxs","jsx","WarningIcon","CheckCircleIcon","ChevronRightIcon","useStyles","makeVoltStyles","shorthands","tokens.radiusMd","tokens.grayA12","tokens.listItemMinHeight","tokens.listItemGap","tokens.listItemPaddingY","tokens.listItemPaddingX","tokens.textSm","tokens.leadingSm","tokens.semErrorSoft","tokens.semErrorDefault","tokens.semWarningSoft","tokens.semWarningDefault","tokens.semSuccessSoft","tokens.semSuccessDefault","tokens.grayA2","tokens.semAccentSoft","tokens.semErrorSoftHover","tokens.semWarningSoftHover","tokens.semSuccessSoftHover","tokens.grayA11","tokens.listIndexMinWidth","tokens.listIndexPaddingX","tokens.spacingElement2","tokens.spacingElement1","tokens.textXs","tokens.leadingXs","tokens.grayA8","tokens.accentA8","tokens.semAccentSolid","tokens.grayA5","tokens.fontWeightMedium","tokens.grayA10","tokens.spacingGroup2","tokens.spacingElement3","tokens.fontWeightSemibold","tokens.semErrorLight","tokens.semWarningLight","tokens.semSuccessLight","StatusIcon","status","styles","ListContext","React","useListContext","canonicalDomDensity","density","List","className","striped","showIndex","sortable","onReorder","children","ref","domDensity","items","indexedItems","child","index","ListItem","sortableItems","values","v","activeId","setActiveId","activeIndex","activeItem","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","handleDragStart","event","handleDragEnd","active","over","oldIndex","newIndex","arrayMove","listElement","SLOT_ATTR","mergeClasses","DndContext","closestCenter","SortableContext","verticalListSortingStrategy","DragOverlay","ListItemBody","ListItemActions","e","ListItemText","ListItemDescription","value","setNodeRef","setActivatorNodeRef","style","isDragging","dropEdge","listeners","attributes","forwardedRef","interactive","childArray","actionsSlot","contentChildren","handleRef","node","statusStyle","interactiveStyle","SortableListItem","fallbackId","isOver","overIndex","useSortable","ListGroupContext","ListGroup","openProp","defaultOpen","onOpenChange","uncontrolledOpen","setUncontrolledOpen","open","contentId","setOpen","next","ListGroupLabel","group","ListGroupContent"],"mappings":"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"}

package/dist/components/pill/pill.js

@@ -1,14 +1,16 @@
-import { jsxs as $, jsx as O } from "react/jsx-runtime";
+import { jsxs as w, jsx as O } from "react/jsx-runtime";
 import * as R from "react";
 import { shorthands as k } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/index.js";
 import { SLOT_ATTR as L } from "../../packages/volt-runtime/dist/renderer/contract.js";
-import { mergeClasses as T } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/mergeClasses.js";
-import { makeVoltStyles as E } from "../../styles/make-styles.js";
-import { spacingGroup2 as g, spacingElement1 as h, accentA8 as I, radiusMd as P, spacingElement2 as z, fontWeightBold as A, leadingXs as B, textXs as N } from "../../tokens/index.js";
-import { ensurePaletteTokensFor as C } from "../../tokens/install.js";
-import { ClearButton as D } from "../../lib/clear-button.js";
-import { NS as u } from "../../tokens/core.generated.js";
-const J = [
+import { mergeClasses as N } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/mergeClasses.js";
+import { makeVoltStyles as T } from "../../styles/make-styles.js";
+import { spacingGroup2 as g, spacingElement1 as h, accentA8 as E, radiusMd as I, spacingElement2 as P, fontWeightBold as z, leadingXs as A, textXs as B } from "../../tokens/index.js";
+import { isCoreFamily as C } from "../../tokens/install.js";
+import { useVoltPaletteTokensFor as F } from "../../tokens/use-palette-tokens.js";
+import { ClearButton as V } from "../../lib/clear-button.js";
+import { NS as D } from "../../tokens/core.generated.js";
+import { NS as G } from "../../tokens/palette.generated.js";
+const to = [
   "blue",
   "sky",
   "mint",
@@ -28,26 +30,26 @@ const J = [
   "warning",
   "success",
   "error"
-], p = "--volt2-pill-bg", d = "--volt2-pill-fg", c = "--volt2-pill-bd", l = "--volt2-pill-hov", e = (o, t) => `var(--volt2-${u}-sem-${o}-${t})`, G = (o, t) => `var(--volt2-${u}-${o}-${t})`, V = {
+], p = "--volt2-pill-bg", m = "--volt2-pill-fg", d = "--volt2-pill-bd", a = "--volt2-pill-hov", u = (o) => C(o) ? D : G, t = (o, e) => `var(--volt2-${u(o)}-sem-${o}-${e})`, W = (o, e) => `var(--volt2-${u(o)}-${o}-${e})`, _ = {
   soft: (o) => ({
-    [p]: e(o, "soft"),
-    [d]: e(o, "light"),
-    [c]: "transparent",
-    [l]: e(o, "soft-hover")
+    [p]: t(o, "soft"),
+    [m]: t(o, "light"),
+    [d]: "transparent",
+    [a]: t(o, "soft-hover")
   }),
   solid: (o) => ({
-    [p]: e(o, "solid"),
-    [d]: e(o, "contrast"),
-    [c]: "transparent",
-    [l]: e(o, "solid-hover")
+    [p]: t(o, "solid"),
+    [m]: t(o, "contrast"),
+    [d]: "transparent",
+    [a]: t(o, "solid-hover")
   }),
   surface: (o) => ({
-    [p]: e(o, "surface"),
-    [d]: e(o, "light"),
-    [c]: G(o, "a6"),
-    [l]: e(o, "surface-hover")
+    [p]: t(o, "surface"),
+    [m]: t(o, "light"),
+    [d]: W(o, "a6"),
+    [a]: t(o, "surface-hover")
   })
-}, W = E({
+}, j = T({
   root: {
     display: "inline-flex",
     alignItems: "center",
@@ -57,23 +59,23 @@ const J = [
     whiteSpace: "nowrap",
     flexShrink: 0,
     overflow: "hidden",
-    fontSize: N,
-    lineHeight: B,
-    fontWeight: A,
-    paddingInline: z,
-    borderRadius: P,
+    fontSize: B,
+    lineHeight: A,
+    fontWeight: z,
+    paddingInline: P,
+    borderRadius: I,
     transitionProperty: "color, box-shadow, background-color",
     // NEVER write a CSS shorthand in a Griffel style object — see Badge. One atom reads one
     // custom property; `border` and a later `borderColor` would both survive.
-    ...k.border("1px", "solid", `var(${c})`),
+    ...k.border("1px", "solid", `var(${d})`),
     // The whole point: one rule each, colour supplied per instance.
     backgroundColor: `var(${p})`,
-    color: `var(${d})`,
+    color: `var(${m})`,
     ":focus-visible": {
       outlineWidth: "2px",
       outlineStyle: "solid",
       outlineOffset: "2px",
-      outlineColor: I
+      outlineColor: E
     },
     // v1 `[&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:pointer-events-none`.
     "& > svg": {
@@ -89,7 +91,7 @@ const J = [
     cursor: "pointer",
     // The one hover rule. It reads the fourth custom property, line-picked per colour and variant
     // by VARIANT_SLOTS — never per-colour hover rules.
-    ":hover": { backgroundColor: `var(${l})` }
+    ":hover": { backgroundColor: `var(${a})` }
   },
   hasRemove: {
     // v1's `pr-1` when a clear button is present.
@@ -103,50 +105,50 @@ const J = [
     width: g,
     height: g
   }
-}), U = R.forwardRef(function({
-  className: t,
+}), eo = R.forwardRef(function({
+  className: e,
   color: y = "accent",
   variant: S = "soft",
   disabled: r,
-  onRemove: m,
+  onRemove: c,
   onClick: i,
   children: b,
   ...x
-}, w) {
-  const n = W(), f = r ? "gray" : y;
-  C(f);
-  const s = !!i && !r, v = V[S](f);
-  return s || delete v[l], /* @__PURE__ */ $(
+}, $) {
+  const s = j(), f = r ? "gray" : y;
+  F(f);
+  const n = !!i && !r, v = _[S](f);
+  return n || delete v[a], /* @__PURE__ */ w(
     "span",
     {
-      ref: w,
+      ref: $,
       "data-slot": "pill",
       [L]: "pill",
       "data-disabled": r || void 0,
-      role: s ? "button" : void 0,
-      tabIndex: s ? 0 : void 0,
+      role: n ? "button" : void 0,
+      tabIndex: n ? 0 : void 0,
       onClick: i,
-      onKeyDown: s ? (a) => {
-        (a.key === "Enter" || a.key === " ") && (a.preventDefault(), i == null || i(a));
+      onKeyDown: n ? (l) => {
+        (l.key === "Enter" || l.key === " ") && (l.preventDefault(), i == null || i(l));
       } : void 0,
-      className: T(
-        n.root,
-        s && n.interactive,
-        m && n.hasRemove,
-        r && n.disabled,
-        t
+      className: N(
+        s.root,
+        n && s.interactive,
+        c && s.hasRemove,
+        r && s.disabled,
+        e
       ),
       style: { ...v },
       ...x,
       children: [
         b,
-        m && // v1 composes the shared ClearButton here — hover, focus ring and the size-3 CloseIcon
+        c && // v1 composes the shared ClearButton here — hover, focus ring and the size-3 CloseIcon
         // fallback all live in the lib, not inline.
         /* @__PURE__ */ O(
-          D,
+          V,
           {
-            className: n.removeSize,
-            onClick: m,
+            className: s.removeSize,
+            onClick: c,
             disabled: r
           }
         )
@@ -155,7 +157,7 @@ const J = [
   );
 });
 export {
-  J as PILL_COLORS,
-  U as Pill
+  to as PILL_COLORS,
+  eo as Pill
 };
 //# sourceMappingURL=pill.js.map

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/volt-ui-runtime\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\nimport { NS } from \"../../tokens\"\nimport { ensurePaletteTokensFor } from \"../../tokens/install\"\nimport * as tokens from \"../../tokens\"\nimport { ClearButton } from \"../../lib/clear-button\"\n\n/**\n * Pill — same colour-matrix collapse as Badge, plus a hover background.\n *\n * v1 enumerates 19 colours x 3 styles as 57 `compoundVariants`, each a distinct class string\n * built by interpolation (`volt-bg-${color}-soft`), which Tailwind's scanner cannot see and\n * `safelist.css` exists to force into existence. The hover state made that 57 more per-colour\n * rules. Here the colour is a VALUE, not part of a class name: the four atoms below read four\n * custom properties, the component sets those inline from the `color` prop, and a single `:hover`\n * atom reads the hover background. Total rules: one small set per style variant — 9 colours' worth\n * of rules cover all 19 x 3 combinations.\n */\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 = \"--volt2-pill-bg\"\nconst FG = \"--volt2-pill-fg\"\nconst BD = \"--volt2-pill-bd\"\nconst HOV = \"--volt2-pill-hov\"\n\nconst semantic = (color: PillColor, slot: string): string =>\n  `var(--volt2-${NS}-sem-${color}-${slot})`\nconst primitive = (color: PillColor, step: string): string =>\n  `var(--volt2-${NS}-${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 = makeVoltStyles({\n  root: {\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    // v1's `pr-1` when a clear button is present.\n    paddingRight: tokens.spacingElement1,\n  },\n  disabled: {\n    pointerEvents: \"none\",\n  },\n  removeSize: {\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  // run on every render — but it is the RESOLVED family that decides, and the five core families\n  // Pill offers (accent, gray, warning, success, error) need no palette sheet at all.\n  ensurePaletteTokensFor(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","semantic","color","slot","NS","primitive","step","VARIANT_SLOTS","c","useStyles","makeVoltStyles","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","ensurePaletteTokensFor","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/volt-ui-runtime\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\nimport { NS, PALETTE_NS } from \"../../tokens\"\nimport { isCoreFamily } from \"../../tokens/install\"\nimport { useVoltPaletteTokensFor } from \"../../tokens/use-palette-tokens\"\nimport * as tokens from \"../../tokens\"\nimport { ClearButton } from \"../../lib/clear-button\"\n\n/**\n * Pill — same colour-matrix collapse as Badge, plus a hover background.\n *\n * v1 enumerates 19 colours x 3 styles as 57 `compoundVariants`, each a distinct class string\n * built by interpolation (`volt-bg-${color}-soft`), which Tailwind's scanner cannot see and\n * `safelist.css` exists to force into existence. The hover state made that 57 more per-colour\n * rules. Here the colour is a VALUE, not part of a class name: the four atoms below read four\n * custom properties, the component sets those inline from the `color` prop, and a single `:hover`\n * atom reads the hover background. Total rules: one small set per style variant — 9 colours' worth\n * of rules cover all 19 x 3 combinations.\n */\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 = \"--volt2-pill-bg\"\nconst FG = \"--volt2-pill-fg\"\nconst BD = \"--volt2-pill-bd\"\nconst HOV = \"--volt2-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. See BADGE-PILL-NAMESPACE-FIX.md.\n */\nconst namespaceFor = (family: string): string =>\n  isCoreFamily(family) ? NS : PALETTE_NS\n\nconst semantic = (color: PillColor, slot: string): string =>\n  `var(--volt2-${namespaceFor(color)}-sem-${color}-${slot})`\nconst primitive = (color: PillColor, step: string): string =>\n  `var(--volt2-${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 = makeVoltStyles({\n  root: {\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    // v1's `pr-1` when a clear button is present.\n    paddingRight: tokens.spacingElement1,\n  },\n  disabled: {\n    pointerEvents: \"none\",\n  },\n  removeSize: {\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  useVoltPaletteTokensFor(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","makeVoltStyles","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","useVoltPaletteTokensFor","interactive","jsxs","SLOT_ATTR","e","mergeClasses","jsx","ClearButton"],"mappings":";;;;;;;;;;;;AAwBA,MAAMA,KAAS;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAMMC,IAAK,mBACLC,IAAK,mBACLC,IAAK,mBACLC,IAAM,oBAQNC,IAAe,CAACC,MACpBC,EAAaD,CAAM,IAAIE,IAAKC,GAExBC,IAAW,CAACC,GAAkBC,MAClC,eAAeP,EAAaM,CAAK,CAAC,QAAQA,CAAK,IAAIC,CAAI,KACnDC,IAAY,CAACF,GAAkBG,MACnC,eAAeT,EAAaM,CAAK,CAAC,IAAIA,CAAK,IAAIG,CAAI,KAO/CC,IAGF;AAAA,EACF,MAAM,CAACC,OAAO;AAAA,IACZ,CAACf,CAAE,GAAGS,EAASM,GAAG,MAAM;AAAA,IACxB,CAACd,CAAE,GAAGQ,EAASM,GAAG,OAAO;AAAA,IACzB,CAACb,CAAE,GAAG;AAAA,IACN,CAACC,CAAG,GAAGM,EAASM,GAAG,YAAY;AAAA,EAAA;AAAA,EAEjC,OAAO,CAACA,OAAO;AAAA,IACb,CAACf,CAAE,GAAGS,EAASM,GAAG,OAAO;AAAA,IACzB,CAACd,CAAE,GAAGQ,EAASM,GAAG,UAAU;AAAA,IAC5B,CAACb,CAAE,GAAG;AAAA,IACN,CAACC,CAAG,GAAGM,EAASM,GAAG,aAAa;AAAA,EAAA;AAAA,EAElC,SAAS,CAACA,OAAO;AAAA,IACf,CAACf,CAAE,GAAGS,EAASM,GAAG,SAAS;AAAA,IAC3B,CAACd,CAAE,GAAGQ,EAASM,GAAG,OAAO;AAAA,IACzB,CAACb,CAAE,GAAGU,EAAUG,GAAG,IAAI;AAAA,IACvB,CAACZ,CAAG,GAAGM,EAASM,GAAG,eAAe;AAAA,EAAA;AAEtC,GAEMC,IAAYC,EAAe;AAAA,EAC/B,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,YAAY;AAAA;AAAA,IAEZ,QAAQ;AAAA,IACR,KAAKC;AAAAA,IACL,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,UAAUC;AAAAA,IACV,YAAYC;AAAAA,IACZ,YAAYC;AAAAA,IACZ,eAAeC;AAAAA,IACf,cAAcC;AAAAA,IACd,oBAAoB;AAAA;AAAA;AAAA,IAGpB,GAAGC,EAAW,OAAO,OAAO,SAAS,OAAOtB,CAAE,GAAG;AAAA;AAAA,IAEjD,iBAAiB,OAAOF,CAAE;AAAA,IAC1B,OAAO,OAAOC,CAAE;AAAA,IAChB,kBAAkB;AAAA,MAChB,cAAc;AAAA,MACd,cAAc;AAAA,MACd,eAAe;AAAA,MACf,cAAcwB;AAAAA,IAAO;AAAA;AAAA,IAGvB,WAAW;AAAA;AAAA;AAAA,MAGT,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,YAAY;AAAA,MACZ,eAAe;AAAA,IAAA;AAAA,EACjB;AAAA,EAEF,aAAa;AAAA,IACX,QAAQ;AAAA;AAAA;AAAA,IAGR,UAAU,EAAE,iBAAiB,OAAOtB,CAAG,IAAA;AAAA,EAAI;AAAA,EAE7C,WAAW;AAAA;AAAA,IAET,cAAce;AAAAA,EAAO;AAAA,EAEvB,UAAU;AAAA,IACR,eAAe;AAAA,EAAA;AAAA,EAEjB,YAAY;AAAA;AAAA,IAEV,OAAOQ;AAAAA,IACP,QAAQA;AAAAA,EAAO;AAEnB,CAAC,GAaYC,KAAOC,EAAM,WAAuC,SAC/D;AAAA,EACE,WAAAC;AAAA,EACA,OAAAnB,IAAQ;AAAA,EACR,SAAAoB,IAAU;AAAA,EACV,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAASrB,EAAA,GAGTsB,IAA2BP,IAAW,SAASrB;AAMrD,EAAA6B,EAAwBD,CAAa;AACrC,QAAME,IAAc,CAAC,CAACP,KAAW,CAACF,GAM5BpB,IAAOG,EAAcgB,CAAO,EAAEQ,CAAa;AACjD,SAAKE,KAAa,OAAO7B,EAAKR,CAAG,GAG/B,gBAAAsC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAL;AAAA,MACA,aAAU;AAAA,MACJ,CAACM,CAAS,GAAG;AAAA,MACnB,iBAAeX,KAAY;AAAA,MAC3B,MAAMS,IAAc,WAAW;AAAA,MAC/B,UAAUA,IAAc,IAAI;AAAA,MAC5B,SAAAP;AAAA,MACA,WACEO,IACI,CAACG,MAAM;AACL,SAAIA,EAAE,QAAQ,WAAWA,EAAE,QAAQ,SACjCA,EAAE,eAAA,GACFV,KAAA,QAAAA,EAAUU;AAAA,MAEd,IACA;AAAA,MAEN,WAAWC;AAAAA,QACTP,EAAO;AAAA,QACPG,KAAeH,EAAO;AAAA,QACtBL,KAAYK,EAAO;AAAA,QACnBN,KAAYM,EAAO;AAAA,QACnBR;AAAA,MAAA;AAAA,MAEF,OAAO,EAAE,GAAGlB,EAAA;AAAA,MACX,GAAGwB;AAAA,MAEH,UAAA;AAAA,QAAAD;AAAA,QACAF;AAAA;AAAA,QAGC,gBAAAa;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,WAAWT,EAAO;AAAA,YAClB,SAASL;AAAA,YACT,UAAAD;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAIR,CAAC;"}