@cube-dev/ui-kit 0.199.2 → 0.200.1

package/dist/components/fields/ListBoxPopover/ListBoxPopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListBoxPopover.js","names":["getEventTarget","isFocusWithin","Key","Styles","tasty","React","CSSProperties","ReactNode","RefObject","useCallback","useEffect","useRef","useInteractOutside","useOverlay","useOverlayPosition","useEvent","useI18n","mergeProps","mergeRefs","DisplayTransition","useModalLayerRef","Portal","ListBox","ListBoxPopoverProps","isOpen","triggerRef","HTMLElement","popoverRef","HTMLDivElement","listBoxRef","direction","shouldFlip","overlayOffset","containerPadding","comboBoxWidth","listBoxId","overlayStyles","listBoxStyles","optionStyles","optionHighlight","sectionStyles","headingStyles","listGap","selectedKey","selectionMode","selectedKeys","isCheckable","shouldCloseOnTriggerInteraction","isDisabled","disabledKeys","Iterable","items","children","listStateRef","onSelectionChange","selection","onClose","label","ariaLabel","ariaLabelledby","compositeFocusProps","onFocus","e","FocusEvent","onBlur","filter","nodes","size","emptyLabel","positionTargetRef","Element","positionApiRef","updatePosition","CONTROL_SELECTOR","LAYER_SELECTOR","DISABLED_SELECTOR","isOutsideControl","el","trigger","control","closest","contains","matches","layer","ListBoxPopoverWrapper","qa","styles","position","zIndex","ListBoxPopoverElement","display","gridRows","gridColumns","width","height","overflow","fill","radius","shadow","padding","border","hide","hidden","boxSizing","transition","translate","transformOrigin","scale","opacity","ListBoxPopover","props","$","_c","t","t0","t1","t2","undefined","mergedPopoverRef","layerRef","overlayScrollRef","t3","t4","t5","t6","targetRef","overlayRef","scrollRef","placement","offset","overlayProps","overlayPositionProps","t7","style","t8","maxHeight","maxWidth","positionStyle","t10","t9","current","t11","menuTriggerEl","dismissEl","getOutsidePressBehavior","t12","el_0","behavior","setTimeout","t13","shouldCloseOnBlur","isDismissable","shouldCloseOnInteractOutside","overlayBehaviorProps","t14","event","preventDefault","preserveOutsidePressFocus","t15","t16","ref","onInteractOutsideStart","onInteractOutside","t17","split","placementDirection","transitionRefHolder","t18","Symbol","for","node","setScrollRef","t19","t20","phase","isShown","isExiting","transitionRef","open","overlayContent","_c","mergeProps","mergeRefs"],"sources":["../../../../src/components/fields/ListBoxPopover/ListBoxPopover.tsx"],"sourcesContent":["import { getEventTarget, isFocusWithin } from '@react-aria/utils';\nimport { Key } from '@react-types/shared';\nimport { Styles, tasty } from '@tenphi/tasty';\nimport React, {\n  CSSProperties,\n  ReactNode,\n  RefObject,\n  useCallback,\n  useEffect,\n  useRef,\n} from 'react';\nimport { useInteractOutside, useOverlay, useOverlayPosition } from 'react-aria';\n\nimport { useEvent } from '../../../_internal/hooks/use-event';\nimport { useI18n } from '../../../i18n';\nimport { mergeProps } from '../../../utils/react';\nimport { mergeRefs } from '../../../utils/react/useCombinedRefs';\nimport { DisplayTransition } from '../../helpers';\nimport { useModalLayerRef } from '../../overlays/Modal/modal-containment';\nimport { Portal } from '../../portal';\nimport { ListBox } from '../ListBox/ListBox';\n\nexport interface ListBoxPopoverProps {\n  isOpen: boolean;\n  triggerRef: RefObject<HTMLElement>;\n  popoverRef: RefObject<HTMLDivElement>;\n  listBoxRef: RefObject<HTMLDivElement>;\n  direction: 'bottom' | 'top';\n  shouldFlip: boolean;\n  overlayOffset: number;\n  containerPadding: number;\n  /** Min width (px) for the overlay; usually the trigger's width. */\n  comboBoxWidth?: number;\n  /** Stable id used for the ListBox element and aria-controls wiring. */\n  listBoxId: string;\n  overlayStyles?: Styles;\n  listBoxStyles?: Styles;\n  optionStyles?: Styles;\n  /** Substring to highlight within each option's (text) children. */\n  optionHighlight?: string;\n  sectionStyles?: Styles;\n  headingStyles?: Styles;\n  /** Space between options, in pixels. Defaults to a hairline (`1bw`). */\n  listGap?: number;\n  selectedKey?: Key | null;\n  /**\n   * `'multiple'` lets the list hold several selected options. The list then\n   * reports the whole new selection on every toggle and never closes itself;\n   * the caller decides what a toggle means. Defaults to `'single'`.\n   */\n  selectionMode?: 'single' | 'multiple';\n  /** The selected keys in `'multiple'` mode. Ignored in `'single'` mode. */\n  selectedKeys?: Key[];\n  /** Whether options show a checkbox. Only applies in `'multiple'` mode. */\n  isCheckable?: boolean;\n  /**\n   * Whether a click inside the element `triggerRef` points at closes the\n   * popover, like any other outside click. Pass `false` when that element is\n   * where the user keeps working with the list open, such as an input that\n   * picks several options in a row. Only this popover is affected; others\n   * still close. Defaults to `true`.\n   */\n  shouldCloseOnTriggerInteraction?: boolean;\n  isDisabled?: boolean;\n  disabledKeys?: Iterable<Key>;\n  items?: Iterable<any>;\n  children: ReactNode;\n  /** Ref through which the ListBox exposes its internal list state. */\n  listStateRef: RefObject<any>;\n  onSelectionChange: (selection: Key | Key[] | null) => void;\n  onClose: () => void;\n  label?: ReactNode;\n  ariaLabel?: string;\n  /**\n   * Ids of the elements that name the field, read after `label` or\n   * `ariaLabel`. Without either, they alone name the list, in place of the\n   * generic \"Options\".\n   */\n  ariaLabelledby?: string;\n  compositeFocusProps: {\n    onFocus: (e: React.FocusEvent) => void;\n    onBlur: (e: React.FocusEvent) => void;\n  };\n  /** Collection node filter applied to the ListBox. */\n  filter?: (nodes: Iterable<any>) => Iterable<any>;\n  size?: 'small' | 'medium' | 'large' | (string & {});\n  /**\n   * Label shown when the list is empty (no items / no filter results).\n   * Forwarded to the inner ListBox.\n   */\n  emptyLabel?: ReactNode;\n  /**\n   * Element to anchor the overlay to geometrically. Defaults to `triggerRef`.\n   * Use this to anchor to something other than the trigger (e.g. the caret in\n   * a textarea) while keeping `triggerRef` for outside-click/dismiss logic.\n   */\n  positionTargetRef?: RefObject<Element | null>;\n  /**\n   * Receives an imperative handle exposing `updatePosition()` so the caller can\n   * force the overlay to re-anchor (e.g. when the caret moves).\n   */\n  positionApiRef?: RefObject<{ updatePosition: () => void } | null>;\n}\n\n// The controls an outside press reaches: a button, a link, a form control,\n// anything with `tabindex`, or something inside one.\nconst CONTROL_SELECTOR =\n  'button, a[href], input, select, textarea, [tabindex], [contenteditable]:not([contenteditable=\"false\"])';\n\n// The layer a field sits in: a dialog, popover or tray, otherwise the page.\nconst LAYER_SELECTOR =\n  '[role=\"dialog\"], [role=\"alertdialog\"], [data-overlay-layer]';\n\nconst DISABLED_SELECTOR = ':disabled, [aria-disabled=\"true\"]';\n\n// An enabled control apart from the field, in the field's own layer. A press\n// anywhere else counts as blank space and keeps the field's focus and draft:\n// on the field itself, on a dialog's surface, on a disabled control, or\n// outside the field's layer, which stays open.\nfunction isOutsideControl(el: Element, trigger: HTMLElement | null) {\n  const control = el.closest(CONTROL_SELECTOR);\n\n  if (\n    control == null ||\n    trigger == null ||\n    control.contains(trigger) ||\n    trigger.contains(control) ||\n    control.matches(`${LAYER_SELECTOR}, ${DISABLED_SELECTOR}`)\n  ) {\n    return false;\n  }\n\n  const layer = trigger.closest(LAYER_SELECTOR);\n\n  return layer == null || layer.contains(control);\n}\n\nconst ListBoxPopoverWrapper = tasty({\n  qa: 'ComboBoxOverlayWrapper',\n  styles: {\n    position: 'absolute',\n    zIndex: 1000,\n  },\n});\n\nconst ListBoxPopoverElement = tasty({\n  qa: 'ComboBoxOverlay',\n  styles: {\n    display: 'grid',\n    gridRows: '1sf',\n    gridColumns: '1sf',\n    width: '$overlay-min-width max-content 50vw',\n    height: 'initial max-content (50vh - 5x)',\n    overflow: 'auto',\n    fill: '#surface',\n    radius: '1cr',\n    shadow: true,\n    padding: '0',\n    border: '#border',\n    hide: {\n      '': false,\n      hidden: true,\n    },\n    boxSizing: 'border-box',\n    transition:\n      'translate $transition ease-out, scale $transition ease-out, theme $transition ease-out',\n    translate: {\n      '': '0 0',\n      'open & [data-placement=\"top\"]': '0 0',\n      '!open & [data-placement=\"top\"]': '0 1x',\n      'open & ([data-placement=\"bottom\"] | ![data-placement])': '0 0',\n      '!open & ([data-placement=\"bottom\"] | ![data-placement])': '0 -1x',\n    },\n    transformOrigin: {\n      '': 'top center',\n      '[data-placement=\"top\"]': 'bottom center',\n    },\n    scale: {\n      '': '1 1',\n      '!open': '1 .9',\n    },\n    opacity: {\n      '': 1,\n      '!open': 0.001,\n    },\n\n    '$overlay-min-width': 'min 30x',\n  },\n});\n\nexport const ListBoxPopover = function ListBoxPopover(\n  props: ListBoxPopoverProps,\n) {\n  const { t } = useI18n();\n  const {\n    isOpen,\n    triggerRef,\n    popoverRef,\n    listBoxRef,\n    direction,\n    shouldFlip,\n    overlayOffset,\n    containerPadding,\n    comboBoxWidth,\n    listBoxId,\n    overlayStyles,\n    listBoxStyles,\n    optionStyles,\n    optionHighlight,\n    sectionStyles,\n    headingStyles,\n    listGap,\n    selectedKey,\n    selectionMode = 'single',\n    selectedKeys,\n    isCheckable,\n    shouldCloseOnTriggerInteraction = true,\n    isDisabled,\n    disabledKeys,\n    items,\n    children,\n    listStateRef,\n    onSelectionChange,\n    onClose,\n    label,\n    ariaLabel,\n    ariaLabelledby,\n    compositeFocusProps,\n    filter,\n    size = 'medium',\n    emptyLabel,\n    positionTargetRef,\n    positionApiRef,\n  } = props;\n\n  const mergedPopoverRef = popoverRef;\n\n  // Opened inside a modal, the list stays readable while the modal hides the\n  // page.\n  const layerRef = useModalLayerRef();\n\n  // Ref to the inner scrollable element (the visible popover). react-aria\n  // measures this for its flip/shrink math and writes maxHeight onto the\n  // overlay (positioning wrapper); we forward that maxHeight to this element\n  // below so the scroll container actually shrinks instead of overflowing.\n  const overlayScrollRef = useRef<HTMLDivElement | null>(null);\n\n  // Overlay positioning — anchor to the explicit position target when given\n  // (e.g. a caret anchor), otherwise to the trigger. `triggerRef` is still\n  // used below for outside-click/dismiss behavior.\n  const {\n    overlayProps: overlayPositionProps,\n    placement,\n    updatePosition,\n  } = useOverlayPosition({\n    targetRef: (positionTargetRef ?? triggerRef) as any,\n    overlayRef: mergedPopoverRef as any,\n    scrollRef: overlayScrollRef as any,\n    placement: `${direction} start` as any,\n    shouldFlip,\n    isOpen,\n    offset: overlayOffset,\n    containerPadding: containerPadding,\n  });\n\n  // Keep positioning (top/left/zIndex) on the wrapper, but split out the\n  // available-space cap so it can be applied to the inner scroll element.\n  const { maxHeight, maxWidth, ...positionStyle } =\n    (overlayPositionProps.style ?? {}) as CSSProperties;\n\n  // Expose updatePosition so callers can re-anchor on demand (e.g. caret move).\n  useEffect(() => {\n    if (positionApiRef) {\n      positionApiRef.current = { updatePosition };\n    }\n    return () => {\n      if (positionApiRef) {\n        positionApiRef.current = null;\n      }\n    };\n  }, [positionApiRef, updatePosition]);\n\n  const getOutsidePressBehavior = (el: Element) => {\n    const menuTriggerEl = el.closest('[data-popover-trigger]');\n    if (menuTriggerEl) {\n      return menuTriggerEl === triggerRef.current ? 'consume' : 'ignore';\n    }\n    if (\n      (!shouldCloseOnTriggerInteraction && triggerRef.current?.contains(el)) ||\n      el.closest('[data-popover-keep]')\n    ) {\n      return 'ignore';\n    }\n    // The press reaches an outside control, so a checkbox toggles, a text\n    // field takes focus and a native Save button saves on the first click.\n    // A UI Kit Button passes from any layer, unless it is disabled.\n    const dismissEl = el.closest('[data-popover-dismiss]');\n\n    if (\n      isOutsideControl(el, triggerRef.current) ||\n      (dismissEl != null && !dismissEl.matches(DISABLED_SELECTOR))\n    ) {\n      return 'pass';\n    }\n    return 'consume';\n  };\n\n  // Overlay behavior (dismiss on outside click, escape)\n  const { overlayProps: overlayBehaviorProps } = useOverlay(\n    {\n      onClose,\n      shouldCloseOnBlur: true,\n      isOpen,\n      isDismissable: true,\n      shouldCloseOnInteractOutside: (el) => {\n        const behavior = getOutsidePressBehavior(el);\n        if (behavior === 'pass') {\n          // Leave the control's press intact and close after its action.\n          setTimeout(onClose, 0);\n        }\n        return behavior === 'consume';\n      },\n    },\n    mergedPopoverRef as any,\n  );\n\n  const preserveOutsidePressFocus = useEvent((event: PointerEvent) => {\n    if (\n      (isFocusWithin(triggerRef.current) ||\n        isFocusWithin(mergedPopoverRef.current)) &&\n      getOutsidePressBehavior(getEventTarget(event) as Element) === 'consume'\n    ) {\n      event.preventDefault();\n    }\n  });\n\n  // Aria now permits outside presses to move focus. A passed press moves it\n  // to its control, and the field settles its draft on blur, as on Tab. A\n  // consumed press, such as one on blank space or a dialog's backdrop, must\n  // only dismiss this list: the field keeps focus and its draft.\n  useInteractOutside({\n    ref: mergedPopoverRef,\n    isDisabled: !isOpen,\n    onInteractOutsideStart: preserveOutsidePressFocus,\n    onInteractOutside: preserveOutsidePressFocus,\n  });\n\n  // Extract primary placement direction for consistent styling\n  const placementDirection = placement?.split(' ')[0] || direction;\n\n  // Hold the DisplayTransition ref so we can bind the same node to both the\n  // transition listener and our scroll ref via a single stable callback.\n  const transitionRefHolder = useRef<\n    ((node: HTMLElement | null) => void) | null\n  >(null);\n  const setScrollRef = useCallback((node: HTMLElement | null) => {\n    overlayScrollRef.current = node as HTMLDivElement | null;\n    transitionRefHolder.current?.(node);\n  }, []);\n\n  const overlayContent = (\n    <DisplayTransition isShown={isOpen}>\n      {({ phase, isShown, isExiting, ref: transitionRef }) => {\n        transitionRefHolder.current = transitionRef;\n        return (\n          <ListBoxPopoverWrapper\n            {...mergeProps(\n              { ...overlayPositionProps, style: positionStyle },\n              overlayBehaviorProps,\n              compositeFocusProps,\n            )}\n            ref={mergeRefs(mergedPopoverRef, layerRef)}\n            // oxlint-disable-next-line react/forbid-component-props -- React Aria's overlay positioning computes these coordinates\n            style={positionStyle}\n            // A press on the list while it fades out must not close the\n            // overlay under it (CUB-5293) — see `Overlay`.\n            data-react-aria-top-layer={isExiting || undefined}\n          >\n            <ListBoxPopoverElement\n              ref={setScrollRef}\n              data-placement={placementDirection}\n              data-phase={phase}\n              mods={{\n                open: isShown,\n                hidden: phase === 'unmounted',\n              }}\n              styles={overlayStyles}\n              tokens={{\n                '$overlay-min-width': comboBoxWidth\n                  ? `${comboBoxWidth}px`\n                  : undefined,\n              }}\n              // oxlint-disable-next-line react/forbid-component-props -- React Aria's overlay positioning computes the space left\n              style={{ maxHeight, maxWidth }}\n            >\n              <ListBox\n                isBare\n                ref={listBoxRef}\n                disableSelectionToggle\n                id={listBoxId}\n                aria-label={\n                  ariaLabel ||\n                  (typeof label === 'string'\n                    ? label\n                    : ariaLabelledby\n                      ? undefined\n                      : t('listBoxPopover.options', 'Options'))\n                }\n                aria-labelledby={ariaLabelledby}\n                selectionMode={selectionMode}\n                selectedKey={\n                  selectionMode === 'single' ? selectedKey : undefined\n                }\n                selectedKeys={\n                  selectionMode === 'multiple' ? selectedKeys : undefined\n                }\n                isCheckable={\n                  selectionMode === 'multiple' ? isCheckable : undefined\n                }\n                isDisabled={isDisabled}\n                disabledKeys={disabledKeys}\n                // As in Select: a large field opens large options, a small\n                // one medium options, which stay easy to pick.\n                size={size === 'large' ? 'large' : 'medium'}\n                shouldUseVirtualFocus={true}\n                items={items as any}\n                filter={filter}\n                styles={listBoxStyles}\n                optionStyles={optionStyles}\n                optionHighlight={optionHighlight}\n                sectionStyles={sectionStyles}\n                headingStyles={headingStyles}\n                listGap={listGap}\n                stateRef={listStateRef}\n                shape=\"popover\"\n                emptyLabel={emptyLabel}\n                onSelectionChange={onSelectionChange}\n              >\n                {children as any}\n              </ListBox>\n            </ListBoxPopoverElement>\n          </ListBoxPopoverWrapper>\n        );\n      }}\n    </DisplayTransition>\n  );\n\n  return <Portal>{overlayContent}</Portal>;\n};\n"],"mappings":"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"}
+{"version":3,"file":"ListBoxPopover.js","names":["getEventTarget","isFocusWithin","Key","Styles","tasty","React","CSSProperties","ReactNode","RefObject","useCallback","useEffect","useRef","useInteractOutside","useOverlay","useOverlayPosition","useEvent","useI18n","mergeProps","mergeRefs","DisplayTransition","useModalLayerRef","Portal","ListBox","ListBoxPopoverProps","isOpen","triggerRef","HTMLElement","popoverRef","HTMLDivElement","listBoxRef","direction","shouldFlip","overlayOffset","containerPadding","comboBoxWidth","listBoxId","overlayStyles","listBoxStyles","optionStyles","optionHighlight","sectionStyles","headingStyles","listGap","selectedKey","selectionMode","selectedKeys","isCheckable","shouldCloseOnTriggerInteraction","isDisabled","disabledKeys","Iterable","items","children","listStateRef","onSelectionChange","selection","onClose","label","ariaLabel","ariaLabelledby","compositeFocusProps","onFocus","e","FocusEvent","onBlur","filter","nodes","size","emptyLabel","positionTargetRef","Element","positionApiRef","updatePosition","CONTROL_SELECTOR","LAYER_SELECTOR","DISABLED_SELECTOR","isOutsideControl","el","trigger","control","closest","contains","matches","layer","ListBoxPopoverWrapper","qa","styles","position","zIndex","ListBoxPopoverElement","display","gridRows","gridColumns","width","height","overflow","fill","radius","shadow","padding","border","hide","hidden","boxSizing","transition","translate","transformOrigin","scale","opacity","ListBoxPopover","props","$","_c","t","t0","t1","t2","undefined","mergedPopoverRef","layerRef","overlayScrollRef","t3","t4","t5","t6","targetRef","overlayRef","scrollRef","placement","offset","overlayProps","overlayPositionProps","t7","style","t8","maxHeight","maxWidth","positionStyle","t10","t9","current","t11","menuTriggerEl","dismissEl","getOutsidePressBehavior","t12","el_0","behavior","setTimeout","t13","shouldCloseOnBlur","isDismissable","shouldCloseOnInteractOutside","overlayBehaviorProps","t14","event","preventDefault","preserveOutsidePressFocus","t15","t16","ref","onInteractOutsideStart","onInteractOutside","t17","split","placementDirection","transitionRefHolder","t18","Symbol","for","node","setScrollRef","t19","t20","phase","isShown","isExiting","transitionRef","open","overlayContent","_c","mergeProps","mergeRefs"],"sources":["../../../../src/components/fields/ListBoxPopover/ListBoxPopover.tsx"],"sourcesContent":["import { getEventTarget, isFocusWithin } from '@react-aria/utils';\nimport { Key } from '@react-types/shared';\nimport { Styles, tasty } from '@tenphi/tasty';\nimport React, {\n  CSSProperties,\n  ReactNode,\n  RefObject,\n  useCallback,\n  useEffect,\n  useRef,\n} from 'react';\nimport { useInteractOutside, useOverlay, useOverlayPosition } from 'react-aria';\n\nimport { useEvent } from '../../../_internal/hooks/use-event';\nimport { useI18n } from '../../../i18n';\nimport { mergeProps } from '../../../utils/react';\nimport { mergeRefs } from '../../../utils/react/useCombinedRefs';\nimport { DisplayTransition } from '../../helpers';\nimport { useModalLayerRef } from '../../overlays/Modal/modal-containment';\nimport { Portal } from '../../portal';\nimport { ListBox } from '../ListBox/ListBox';\n\nexport interface ListBoxPopoverProps {\n  isOpen: boolean;\n  triggerRef: RefObject<HTMLElement>;\n  popoverRef: RefObject<HTMLDivElement>;\n  listBoxRef: RefObject<HTMLDivElement>;\n  direction: 'bottom' | 'top';\n  shouldFlip: boolean;\n  overlayOffset: number;\n  containerPadding: number;\n  /** Min width (px) for the overlay; usually the trigger's width. */\n  comboBoxWidth?: number;\n  /** Stable id used for the ListBox element and aria-controls wiring. */\n  listBoxId: string;\n  overlayStyles?: Styles;\n  listBoxStyles?: Styles;\n  optionStyles?: Styles;\n  /** Substring to highlight within each option's (text) children. */\n  optionHighlight?: string;\n  sectionStyles?: Styles;\n  headingStyles?: Styles;\n  /** Space between options, in pixels. Defaults to a hairline (`$item-gap`, `1px`). */\n  listGap?: number;\n  selectedKey?: Key | null;\n  /**\n   * `'multiple'` lets the list hold several selected options. The list then\n   * reports the whole new selection on every toggle and never closes itself;\n   * the caller decides what a toggle means. Defaults to `'single'`.\n   */\n  selectionMode?: 'single' | 'multiple';\n  /** The selected keys in `'multiple'` mode. Ignored in `'single'` mode. */\n  selectedKeys?: Key[];\n  /** Whether options show a checkbox. Only applies in `'multiple'` mode. */\n  isCheckable?: boolean;\n  /**\n   * Whether a click inside the element `triggerRef` points at closes the\n   * popover, like any other outside click. Pass `false` when that element is\n   * where the user keeps working with the list open, such as an input that\n   * picks several options in a row. Only this popover is affected; others\n   * still close. Defaults to `true`.\n   */\n  shouldCloseOnTriggerInteraction?: boolean;\n  isDisabled?: boolean;\n  disabledKeys?: Iterable<Key>;\n  items?: Iterable<any>;\n  children: ReactNode;\n  /** Ref through which the ListBox exposes its internal list state. */\n  listStateRef: RefObject<any>;\n  onSelectionChange: (selection: Key | Key[] | null) => void;\n  onClose: () => void;\n  label?: ReactNode;\n  ariaLabel?: string;\n  /**\n   * Ids of the elements that name the field, read after `label` or\n   * `ariaLabel`. Without either, they alone name the list, in place of the\n   * generic \"Options\".\n   */\n  ariaLabelledby?: string;\n  compositeFocusProps: {\n    onFocus: (e: React.FocusEvent) => void;\n    onBlur: (e: React.FocusEvent) => void;\n  };\n  /** Collection node filter applied to the ListBox. */\n  filter?: (nodes: Iterable<any>) => Iterable<any>;\n  size?: 'small' | 'medium' | 'large' | (string & {});\n  /**\n   * Label shown when the list is empty (no items / no filter results).\n   * Forwarded to the inner ListBox.\n   */\n  emptyLabel?: ReactNode;\n  /**\n   * Element to anchor the overlay to geometrically. Defaults to `triggerRef`.\n   * Use this to anchor to something other than the trigger (e.g. the caret in\n   * a textarea) while keeping `triggerRef` for outside-click/dismiss logic.\n   */\n  positionTargetRef?: RefObject<Element | null>;\n  /**\n   * Receives an imperative handle exposing `updatePosition()` so the caller can\n   * force the overlay to re-anchor (e.g. when the caret moves).\n   */\n  positionApiRef?: RefObject<{ updatePosition: () => void } | null>;\n}\n\n// The controls an outside press reaches: a button, a link, a form control,\n// anything with `tabindex`, or something inside one.\nconst CONTROL_SELECTOR =\n  'button, a[href], input, select, textarea, [tabindex], [contenteditable]:not([contenteditable=\"false\"])';\n\n// The layer a field sits in: a dialog, popover or tray, otherwise the page.\nconst LAYER_SELECTOR =\n  '[role=\"dialog\"], [role=\"alertdialog\"], [data-overlay-layer]';\n\nconst DISABLED_SELECTOR = ':disabled, [aria-disabled=\"true\"]';\n\n// An enabled control apart from the field, in the field's own layer. A press\n// anywhere else counts as blank space and keeps the field's focus and draft:\n// on the field itself, on a dialog's surface, on a disabled control, or\n// outside the field's layer, which stays open.\nfunction isOutsideControl(el: Element, trigger: HTMLElement | null) {\n  const control = el.closest(CONTROL_SELECTOR);\n\n  if (\n    control == null ||\n    trigger == null ||\n    control.contains(trigger) ||\n    trigger.contains(control) ||\n    control.matches(`${LAYER_SELECTOR}, ${DISABLED_SELECTOR}`)\n  ) {\n    return false;\n  }\n\n  const layer = trigger.closest(LAYER_SELECTOR);\n\n  return layer == null || layer.contains(control);\n}\n\nconst ListBoxPopoverWrapper = tasty({\n  qa: 'ComboBoxOverlayWrapper',\n  styles: {\n    position: 'absolute',\n    zIndex: 1000,\n  },\n});\n\nconst ListBoxPopoverElement = tasty({\n  qa: 'ComboBoxOverlay',\n  styles: {\n    display: 'grid',\n    gridRows: '1sf',\n    gridColumns: '1sf',\n    width: '$overlay-min-width max-content 50vw',\n    height: 'initial max-content (50vh - 5x)',\n    overflow: 'auto',\n    fill: '#surface',\n    radius: '1cr',\n    shadow: true,\n    padding: '0',\n    border: '#border',\n    hide: {\n      '': false,\n      hidden: true,\n    },\n    boxSizing: 'border-box',\n    transition:\n      'translate $transition ease-out, scale $transition ease-out, theme $transition ease-out',\n    translate: {\n      '': '0 0',\n      'open & [data-placement=\"top\"]': '0 0',\n      '!open & [data-placement=\"top\"]': '0 1x',\n      'open & ([data-placement=\"bottom\"] | ![data-placement])': '0 0',\n      '!open & ([data-placement=\"bottom\"] | ![data-placement])': '0 -1x',\n    },\n    transformOrigin: {\n      '': 'top center',\n      '[data-placement=\"top\"]': 'bottom center',\n    },\n    scale: {\n      '': '1 1',\n      '!open': '1 .9',\n    },\n    opacity: {\n      '': 1,\n      '!open': 0.001,\n    },\n\n    '$overlay-min-width': 'min 30x',\n  },\n});\n\nexport const ListBoxPopover = function ListBoxPopover(\n  props: ListBoxPopoverProps,\n) {\n  const { t } = useI18n();\n  const {\n    isOpen,\n    triggerRef,\n    popoverRef,\n    listBoxRef,\n    direction,\n    shouldFlip,\n    overlayOffset,\n    containerPadding,\n    comboBoxWidth,\n    listBoxId,\n    overlayStyles,\n    listBoxStyles,\n    optionStyles,\n    optionHighlight,\n    sectionStyles,\n    headingStyles,\n    listGap,\n    selectedKey,\n    selectionMode = 'single',\n    selectedKeys,\n    isCheckable,\n    shouldCloseOnTriggerInteraction = true,\n    isDisabled,\n    disabledKeys,\n    items,\n    children,\n    listStateRef,\n    onSelectionChange,\n    onClose,\n    label,\n    ariaLabel,\n    ariaLabelledby,\n    compositeFocusProps,\n    filter,\n    size = 'medium',\n    emptyLabel,\n    positionTargetRef,\n    positionApiRef,\n  } = props;\n\n  const mergedPopoverRef = popoverRef;\n\n  // Opened inside a modal, the list stays readable while the modal hides the\n  // page.\n  const layerRef = useModalLayerRef();\n\n  // Ref to the inner scrollable element (the visible popover). react-aria\n  // measures this for its flip/shrink math and writes maxHeight onto the\n  // overlay (positioning wrapper); we forward that maxHeight to this element\n  // below so the scroll container actually shrinks instead of overflowing.\n  const overlayScrollRef = useRef<HTMLDivElement | null>(null);\n\n  // Overlay positioning — anchor to the explicit position target when given\n  // (e.g. a caret anchor), otherwise to the trigger. `triggerRef` is still\n  // used below for outside-click/dismiss behavior.\n  const {\n    overlayProps: overlayPositionProps,\n    placement,\n    updatePosition,\n  } = useOverlayPosition({\n    targetRef: (positionTargetRef ?? triggerRef) as any,\n    overlayRef: mergedPopoverRef as any,\n    scrollRef: overlayScrollRef as any,\n    placement: `${direction} start` as any,\n    shouldFlip,\n    isOpen,\n    offset: overlayOffset,\n    containerPadding: containerPadding,\n  });\n\n  // Keep positioning (top/left/zIndex) on the wrapper, but split out the\n  // available-space cap so it can be applied to the inner scroll element.\n  const { maxHeight, maxWidth, ...positionStyle } =\n    (overlayPositionProps.style ?? {}) as CSSProperties;\n\n  // Expose updatePosition so callers can re-anchor on demand (e.g. caret move).\n  useEffect(() => {\n    if (positionApiRef) {\n      positionApiRef.current = { updatePosition };\n    }\n    return () => {\n      if (positionApiRef) {\n        positionApiRef.current = null;\n      }\n    };\n  }, [positionApiRef, updatePosition]);\n\n  const getOutsidePressBehavior = (el: Element) => {\n    const menuTriggerEl = el.closest('[data-popover-trigger]');\n    if (menuTriggerEl) {\n      return menuTriggerEl === triggerRef.current ? 'consume' : 'ignore';\n    }\n    if (\n      (!shouldCloseOnTriggerInteraction && triggerRef.current?.contains(el)) ||\n      el.closest('[data-popover-keep]')\n    ) {\n      return 'ignore';\n    }\n    // The press reaches an outside control, so a checkbox toggles, a text\n    // field takes focus and a native Save button saves on the first click.\n    // A UI Kit Button passes from any layer, unless it is disabled.\n    const dismissEl = el.closest('[data-popover-dismiss]');\n\n    if (\n      isOutsideControl(el, triggerRef.current) ||\n      (dismissEl != null && !dismissEl.matches(DISABLED_SELECTOR))\n    ) {\n      return 'pass';\n    }\n    return 'consume';\n  };\n\n  // Overlay behavior (dismiss on outside click, escape)\n  const { overlayProps: overlayBehaviorProps } = useOverlay(\n    {\n      onClose,\n      shouldCloseOnBlur: true,\n      isOpen,\n      isDismissable: true,\n      shouldCloseOnInteractOutside: (el) => {\n        const behavior = getOutsidePressBehavior(el);\n        if (behavior === 'pass') {\n          // Leave the control's press intact and close after its action.\n          setTimeout(onClose, 0);\n        }\n        return behavior === 'consume';\n      },\n    },\n    mergedPopoverRef as any,\n  );\n\n  const preserveOutsidePressFocus = useEvent((event: PointerEvent) => {\n    if (\n      (isFocusWithin(triggerRef.current) ||\n        isFocusWithin(mergedPopoverRef.current)) &&\n      getOutsidePressBehavior(getEventTarget(event) as Element) === 'consume'\n    ) {\n      event.preventDefault();\n    }\n  });\n\n  // Aria now permits outside presses to move focus. A passed press moves it\n  // to its control, and the field settles its draft on blur, as on Tab. A\n  // consumed press, such as one on blank space or a dialog's backdrop, must\n  // only dismiss this list: the field keeps focus and its draft.\n  useInteractOutside({\n    ref: mergedPopoverRef,\n    isDisabled: !isOpen,\n    onInteractOutsideStart: preserveOutsidePressFocus,\n    onInteractOutside: preserveOutsidePressFocus,\n  });\n\n  // Extract primary placement direction for consistent styling\n  const placementDirection = placement?.split(' ')[0] || direction;\n\n  // Hold the DisplayTransition ref so we can bind the same node to both the\n  // transition listener and our scroll ref via a single stable callback.\n  const transitionRefHolder = useRef<\n    ((node: HTMLElement | null) => void) | null\n  >(null);\n  const setScrollRef = useCallback((node: HTMLElement | null) => {\n    overlayScrollRef.current = node as HTMLDivElement | null;\n    transitionRefHolder.current?.(node);\n  }, []);\n\n  const overlayContent = (\n    <DisplayTransition isShown={isOpen}>\n      {({ phase, isShown, isExiting, ref: transitionRef }) => {\n        transitionRefHolder.current = transitionRef;\n        return (\n          <ListBoxPopoverWrapper\n            {...mergeProps(\n              { ...overlayPositionProps, style: positionStyle },\n              overlayBehaviorProps,\n              compositeFocusProps,\n            )}\n            ref={mergeRefs(mergedPopoverRef, layerRef)}\n            // oxlint-disable-next-line tasty/no-style-prop -- React Aria's overlay positioning computes these coordinates\n            style={positionStyle}\n            // A press on the list while it fades out must not close the\n            // overlay under it (CUB-5293) — see `Overlay`.\n            data-react-aria-top-layer={isExiting || undefined}\n          >\n            <ListBoxPopoverElement\n              ref={setScrollRef}\n              data-placement={placementDirection}\n              data-phase={phase}\n              mods={{\n                open: isShown,\n                hidden: phase === 'unmounted',\n              }}\n              styles={overlayStyles}\n              tokens={{\n                '$overlay-min-width': comboBoxWidth\n                  ? `${comboBoxWidth}px`\n                  : undefined,\n              }}\n              // oxlint-disable-next-line tasty/no-style-prop -- React Aria's overlay positioning computes the space left once it has measured; inline, it overrides whatever max size the merged styles give, without restating their defaults\n              style={{ maxHeight, maxWidth }}\n            >\n              <ListBox\n                isBare\n                ref={listBoxRef}\n                disableSelectionToggle\n                id={listBoxId}\n                aria-label={\n                  ariaLabel ||\n                  (typeof label === 'string'\n                    ? label\n                    : ariaLabelledby\n                      ? undefined\n                      : t('listBoxPopover.options', 'Options'))\n                }\n                aria-labelledby={ariaLabelledby}\n                selectionMode={selectionMode}\n                selectedKey={\n                  selectionMode === 'single' ? selectedKey : undefined\n                }\n                selectedKeys={\n                  selectionMode === 'multiple' ? selectedKeys : undefined\n                }\n                isCheckable={\n                  selectionMode === 'multiple' ? isCheckable : undefined\n                }\n                isDisabled={isDisabled}\n                disabledKeys={disabledKeys}\n                // As in Select: a large field opens large options, a small\n                // one medium options, which stay easy to pick.\n                size={size === 'large' ? 'large' : 'medium'}\n                shouldUseVirtualFocus={true}\n                items={items as any}\n                filter={filter}\n                styles={listBoxStyles}\n                optionStyles={optionStyles}\n                optionHighlight={optionHighlight}\n                sectionStyles={sectionStyles}\n                headingStyles={headingStyles}\n                listGap={listGap}\n                stateRef={listStateRef}\n                shape=\"popover\"\n                emptyLabel={emptyLabel}\n                onSelectionChange={onSelectionChange}\n              >\n                {children as any}\n              </ListBox>\n            </ListBoxPopoverElement>\n          </ListBoxPopoverWrapper>\n        );\n      }}\n    </DisplayTransition>\n  );\n\n  return <Portal>{overlayContent}</Portal>;\n};\n"],"mappings":"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"}

package/dist/components/fields/ListBoxPopover/listNavigation.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.1 | Cube Dev Team */
 //#region src/components/fields/ListBoxPopover/listNavigation.ts
 /**
 * Walks a collection (possibly nested under sections) and collects the keys of

package/dist/components/fields/ListBoxPopover/useCompositeFocus.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.1 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { c } from "react/compiler-runtime";
 import { useEffect, useRef } from "react";

package/dist/components/fields/NumberInput/NumberInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.1 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { castNullableNumberValue } from "../../../utils/react/nullableValue.js";

package/dist/components/fields/NumberInput/StepButton.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.1 | Cube Dev Team */
 import { Button } from "../../actions/Button/Button.js";
 import { DirectionIcon } from "../../../icons/DirectionIcon.js";
 import { c } from "react/compiler-runtime";

package/dist/components/fields/PasswordInput/PasswordInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.1 | Cube Dev Team */
 import { chain } from "../../../utils/react/chain.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useBufferedValue } from "../../../utils/react/useBufferedValue.js";

package/dist/components/fields/Picker/Picker.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.1 | Cube Dev Team */
 import { extractStyles, mergeStyleLayers } from "../../../utils/styles.js";
 import { Text as _Text } from "../../content/Text.js";
 import { isTextOnly } from "../../../utils/react/isTextOnly.js";

package/dist/components/fields/RadioGroup/Radio.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.2 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.1 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { getDisabledElementProps, omitActivationEventProps } from "../../../utils/react/disabledProps.js";
@@ -122,8 +122,8 @@ const RadioNormalElement = tasty({ styles: {
 	width: "2x",
 	height: "2x",
 	outline: {
-		"": "#primary-text.0 / 1bw",
-		focused: "1bw #primary-text / 1bw"
+		"": "#primary-text.0 / $outline-offset",
+		focused: "$ring-width #primary-text / $outline-offset"
 	},
 	transition: "theme",
 	whiteSpace: "nowrap",
@@ -227,9 +227,8 @@ function Radio(props, ref) {
 		$[0] = t0;
 	} else t0 = $[0];
 	props = useFieldProps(props, t0);
-	const { qa, isDisabled, isInvalid, isValid, children, label: t1, autoFocus, labelStyles: t2, labelProps, type, buttonType, size, "aria-label": ariaLabel, form, ...otherProps } = props;
+	const { qa, isDisabled, isInvalid, isValid, children, label: t1, autoFocus, labelStyles, labelProps, type, buttonType, size, "aria-label": ariaLabel, form, ...otherProps } = props;
 	let label = t1;
-	let labelStyles = t2;
 	label = label || children;
 	let itemProps;
 	if ($[1] !== props) {
@@ -238,10 +237,6 @@ function Radio(props, ref) {
 		$[1] = props;
 		$[2] = itemProps;
 	} else itemProps = $[2];
-	labelStyles = {
-		...INLINE_LABEL_STYLES,
-		...labelStyles
-	};
 	const radioGroupProps = useRadioProvider();
 	const state = radioGroupProps && radioGroupProps.state;
 	const name = radioGroupProps && radioGroupProps.name;
@@ -272,35 +267,35 @@ function Radio(props, ref) {
 	const isLoadingButton = isButton && props.isLoading === true;
 	const effectiveIsDisabled = baseIsDisabled === true || isLoadingButton && isDisabled !== false;
 	const { isFocused, focusProps } = useFocus$1(true);
-	let t3;
+	let t2;
 	if ($[3] !== effectiveIsDisabled) {
-		t3 = { isDisabled: effectiveIsDisabled };
+		t2 = { isDisabled: effectiveIsDisabled };
 		$[3] = effectiveIsDisabled;
-		$[4] = t3;
-	} else t3 = $[4];
-	const { hoverProps, isHovered } = useHover(t3);
-	const t4 = isButton ? void 0 : props.tooltip;
-	const t5 = isButton ? void 0 : props.labelRef;
-	let t6;
-	if ($[5] !== label || $[6] !== t4 || $[7] !== t5) {
-		t6 = {
-			tooltip: t4,
+		$[4] = t2;
+	} else t2 = $[4];
+	const { hoverProps, isHovered } = useHover(t2);
+	const t3 = isButton ? void 0 : props.tooltip;
+	const t4 = isButton ? void 0 : props.labelRef;
+	let t5;
+	if ($[5] !== label || $[6] !== t3 || $[7] !== t4) {
+		t5 = {
+			tooltip: t3,
 			children: label,
-			labelRef: t5,
+			labelRef: t4,
 			isDynamicLabel: true
 		};
 		$[5] = label;
-		$[6] = t4;
-		$[7] = t5;
-		$[8] = t6;
-	} else t6 = $[8];
-	const { labelRef: tooltipLabelRef, renderWithTooltip, isTooltipActive } = useAutoTooltip(t6);
+		$[6] = t3;
+		$[7] = t4;
+		$[8] = t5;
+	} else t5 = $[8];
+	const { labelRef: tooltipLabelRef, renderWithTooltip, isTooltipActive } = useAutoTooltip(t5);
 	const inputRef = useRef(null);
 	const domRef = useFocusableRef(ref, inputRef);
 	const value = props.value ?? "";
-	let t7;
+	let t6;
 	if ($[9] !== effectiveIsDisabled || $[10] !== name || $[11] !== props || $[12] !== value) {
-		t7 = {
+		t6 = {
 			name,
 			...props,
 			isDisabled: effectiveIsDisabled,
@@ -310,12 +305,12 @@ function Radio(props, ref) {
 		$[10] = name;
 		$[11] = props;
 		$[12] = value;
-		$[13] = t7;
-	} else t7 = $[13];
-	const { inputProps, isDisabled: isRadioDisabled, isSelected: isRadioSelected } = useRadio$1(t7, state, inputRef);
-	let t8;
+		$[13] = t6;
+	} else t6 = $[13];
+	const { inputProps, isDisabled: isRadioDisabled, isSelected: isRadioSelected } = useRadio$1(t6, state, inputRef);
+	let t7;
 	if ($[14] !== inputProps || $[15] !== isRadioDisabled || $[16] !== state || $[17] !== value) {
-		t8 = (hasActiveTooltip) => {
+		t7 = (hasActiveTooltip) => {
 			const { isInert, inertProps } = getDisabledElementProps({
 				isDisabled: isRadioDisabled,
 				keepEvents: hasActiveTooltip,
@@ -336,81 +331,81 @@ function Radio(props, ref) {
 		$[15] = isRadioDisabled;
 		$[16] = state;
 		$[17] = value;
-		$[18] = t8;
-	} else t8 = $[18];
-	const getInputProps = t8;
-	let t9;
+		$[18] = t7;
+	} else t7 = $[18];
+	const getInputProps = t7;
+	let t8;
 	if ($[19] !== isInvalid || $[20] !== isValid) {
-		t9 = getValidationMods({
+		t8 = getValidationMods({
 			isInvalid,
 			isValid
 		});
 		$[19] = isInvalid;
 		$[20] = isValid;
-		$[21] = t9;
-	} else t9 = $[21];
-	const t10 = effectiveType === "tabs";
-	let t11;
-	if ($[22] !== isButton || $[23] !== isFocused || $[24] !== isHovered || $[25] !== isRadioDisabled || $[26] !== isRadioSelected || $[27] !== t10 || $[28] !== t9) {
-		t11 = {
+		$[21] = t8;
+	} else t8 = $[21];
+	const t9 = effectiveType === "tabs";
+	let t10;
+	if ($[22] !== isButton || $[23] !== isFocused || $[24] !== isHovered || $[25] !== isRadioDisabled || $[26] !== isRadioSelected || $[27] !== t8 || $[28] !== t9) {
+		t10 = {
 			checked: isRadioSelected,
-			...t9,
+			...t8,
 			disabled: isRadioDisabled,
 			hovered: isHovered,
 			button: isButton,
 			focused: isFocused,
-			tabs: t10
+			tabs: t9
 		};
 		$[22] = isButton;
 		$[23] = isFocused;
 		$[24] = isHovered;
 		$[25] = isRadioDisabled;
 		$[26] = isRadioSelected;
-		$[27] = t10;
+		$[27] = t8;
 		$[28] = t9;
-		$[29] = t11;
-	} else t11 = $[29];
-	const mods = t11;
+		$[29] = t10;
+	} else t10 = $[29];
+	const mods = t10;
 	if (isButton) {
-		const t12 = effectiveButtonType;
-		let t13;
+		const t11 = effectiveButtonType;
+		let t12;
 		if ($[30] !== isInvalid || $[31] !== isValid) {
-			t13 = getValidationTheme("default", {
+			t12 = getValidationTheme("default", {
 				isInvalid,
 				isValid
 			}, { includeValid: true });
 			$[30] = isInvalid;
 			$[31] = isValid;
-			$[32] = t13;
-		} else t13 = $[32];
-		const t14 = effectiveSize;
-		let t15;
+			$[32] = t12;
+		} else t12 = $[32];
+		const t13 = effectiveSize;
+		let t14;
 		if ($[33] !== forceSelectedMod || $[34] !== isRadioDisabled) {
-			t15 = forceSelectedMod && !isRadioDisabled ? { selected: true } : {};
+			t14 = forceSelectedMod && !isRadioDisabled ? { selected: true } : {};
 			$[33] = forceSelectedMod;
 			$[34] = isRadioDisabled;
-			$[35] = t15;
-		} else t15 = $[35];
-		let t16;
-		if ($[36] !== mods || $[37] !== t15) {
-			t16 = {
+			$[35] = t14;
+		} else t14 = $[35];
+		let t15;
+		if ($[36] !== mods || $[37] !== t14) {
+			t15 = {
 				...mods,
-				...t15
+				...t14
 			};
 			$[36] = mods;
-			$[37] = t15;
-			$[38] = t16;
-		} else t16 = $[38];
-		let t17;
+			$[37] = t14;
+			$[38] = t15;
+		} else t15 = $[38];
+		let t16;
 		if ($[39] !== focusProps || $[40] !== hoverProps) {
-			t17 = mergeProps$1(hoverProps, focusProps);
+			t16 = mergeProps$1(hoverProps, focusProps);
 			$[39] = focusProps;
 			$[40] = hoverProps;
-			$[41] = t17;
-		} else t17 = $[41];
-		let t18;
+			$[41] = t16;
+		} else t16 = $[41];
+		let t17;
 		if ($[42] !== ariaLabel || $[43] !== autoFocus || $[44] !== getInputProps || $[45] !== isButton || $[46] !== isRadioDisabled || $[47] !== qa) {
-			t18 = (tooltipFocusProps, isItemTooltipActive) => /* @__PURE__ */ jsx(HiddenInput, {
+			t17 = (tooltipFocusProps, isItemTooltipActive) => /* @__PURE__ */ jsx(HiddenInput, {
 				qa: qa || "Radio",
 				"data-input-type": "radio",
 				"aria-label": ariaLabel,
@@ -428,23 +423,23 @@ function Radio(props, ref) {
 			$[45] = isButton;
 			$[46] = isRadioDisabled;
 			$[47] = qa;
-			$[48] = t18;
-		} else t18 = $[48];
-		let t19;
-		if ($[49] !== domRef || $[50] !== effectiveButtonType || $[51] !== effectiveSize || $[52] !== isRadioDisabled || $[53] !== isRadioSelected || $[54] !== itemProps || $[55] !== label || $[56] !== styles || $[57] !== t13 || $[58] !== t16 || $[59] !== t17 || $[60] !== t18) {
-			t19 = /* @__PURE__ */ jsx(RadioButtonElement, {
+			$[48] = t17;
+		} else t17 = $[48];
+		let t18;
+		if ($[49] !== domRef || $[50] !== effectiveButtonType || $[51] !== effectiveSize || $[52] !== isRadioDisabled || $[53] !== isRadioSelected || $[54] !== itemProps || $[55] !== label || $[56] !== styles || $[57] !== t12 || $[58] !== t15 || $[59] !== t16 || $[60] !== t17) {
+			t18 = /* @__PURE__ */ jsx(RadioButtonElement, {
 				ref: domRef,
-				type: t12,
-				theme: t13,
-				size: t14,
+				type: t11,
+				theme: t12,
+				size: t13,
 				...itemProps,
 				isSelected: isRadioSelected,
 				isDisabled: isRadioDisabled,
-				mods: t16,
+				mods: t15,
 				styles,
-				...t17,
+				...t16,
 				isDynamicLabel: true,
-				hiddenContent: t18,
+				hiddenContent: t17,
 				children: label
 			});
 			$[49] = domRef;
@@ -455,17 +450,17 @@ function Radio(props, ref) {
 			$[54] = itemProps;
 			$[55] = label;
 			$[56] = styles;
-			$[57] = t13;
-			$[58] = t16;
-			$[59] = t17;
-			$[60] = t18;
-			$[61] = t19;
-		} else t19 = $[61];
-		return t19;
+			$[57] = t12;
+			$[58] = t15;
+			$[59] = t16;
+			$[60] = t17;
+			$[61] = t18;
+		} else t18 = $[61];
+		return t18;
 	}
-	let t12;
+	let t11;
 	if ($[62] !== ariaLabel || $[63] !== autoFocus || $[64] !== domRef || $[65] !== focusProps || $[66] !== getInputProps || $[67] !== hoverProps || $[68] !== isButton || $[69] !== isRadioDisabled || $[70] !== isTooltipActive || $[71] !== label || $[72] !== labelProps || $[73] !== labelStyles || $[74] !== mods || $[75] !== qa || $[76] !== renderWithTooltip || $[77] !== styles || $[78] !== tooltipLabelRef || $[79] !== type) {
-		t12 = renderWithTooltip((tooltipTriggerProps, tooltipRef) => {
+		t11 = renderWithTooltip((tooltipTriggerProps, tooltipRef) => {
 			const { pointerProps, focusProps: tooltipFocusProps_0 } = splitTooltipTriggerProps(tooltipTriggerProps);
 			return /* @__PURE__ */ jsxs(RadioWrapperElement, {
 				styles,
@@ -523,9 +518,9 @@ function Radio(props, ref) {
 		$[77] = styles;
 		$[78] = tooltipLabelRef;
 		$[79] = type;
-		$[80] = t12;
-	} else t12 = $[80];
-	return t12;
+		$[80] = t11;
+	} else t11 = $[80];
+	return t11;
 }
 /**
 * Radio buttons allow users to select a single option from a list of mutually exclusive options.