@cube-dev/ui-kit 0.168.1 → 0.169.0

package/dist/components/content/InlineInput/InlineInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
@@ -123,7 +123,7 @@ const PROGRAMMATIC_EDIT_BLUR_GRACE_MS = 500;
 * works regardless of `editTrigger`.
 */
 const InlineInput = forwardRef(function InlineInput(allProps, ref) {
-	const { value: valueProp, defaultValue, onChange, isEditing: isEditingProp, defaultIsEditing, onEditingChange, onSubmit, onCancel, editTrigger = "dblclick", keyboardActivation = true, submitOnBlur = true, trimOnSubmit = true, allowEmpty = false, isDisabled = false, isReadOnly = false, isStyled = false, placeholder, renderDisplay, tooltip = true, tooltipPlacement = "top", "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, qa, qaVal, styles: stylesProp, inputStyles, mods: customMods, tokens: customTokens, ...otherProps } = allProps;
+	const { value: valueProp, defaultValue, onChange, isEditing: isEditingProp, defaultIsEditing, onEditingChange, onSubmit, onCancel, editTrigger = "dblclick", keyboardActivation = true, submitOnBlur = true, trimOnSubmit = true, allowEmpty = false, isDisabled = false, isReadOnly = false, isStyled = false, placeholder, autoComplete, renderDisplay, tooltip = true, tooltipPlacement = "top", "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, qa, qaVal, styles: stylesProp, inputStyles, mods: customMods, tokens: customTokens, ...otherProps } = allProps;
 	const isControlled = valueProp !== void 0;
 	const inputRef = useRef(null);
 	const measureRef = useRef(null);
@@ -389,6 +389,7 @@ const InlineInput = forwardRef(function InlineInput(allProps, ref) {
 					type: "text",
 					value: draft,
 					placeholder,
+					autoComplete,
 					disabled: isDisabled,
 					readOnly: isReadOnly,
 					"aria-label": ariaLabel,

package/dist/components/content/InlineInput/InlineInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"InlineInput.js","names":["mergeProps"],"sources":["../../../../src/components/content/InlineInput/InlineInput.tsx"],"sourcesContent":["import { useControlledState } from '@react-stately/utils';\nimport {\n  BaseProps,\n  BLOCK_STYLES,\n  BlockStyleProps,\n  COLOR_STYLES,\n  ColorStyleProps,\n  filterBaseProps,\n  OUTER_STYLES,\n  OuterStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  forwardRef,\n  useEffect,\n  useImperativeHandle,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport {\n  FocusScope,\n  OverlayProps,\n  useFocusRing,\n  useFocusWithin,\n} from 'react-aria';\n\nimport { useEvent } from '../../../_internal/hooks';\nimport { mergeProps } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { AutoTooltipValue, useAutoTooltip } from '../use-auto-tooltip';\n\nimport type {\n  ChangeEvent,\n  HTMLAttributes,\n  KeyboardEvent,\n  MouseEvent,\n  ReactNode,\n  RefObject,\n} from 'react';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport type CubeInlineInputEditTrigger = 'dblclick' | 'click' | 'none';\n\nexport interface CubeInlineInputProps\n  extends BaseProps,\n    BlockStyleProps,\n    OuterStyleProps,\n    ColorStyleProps {\n  /** Controlled value. When provided, the component is controlled. */\n  value?: string;\n  /** Initial value for uncontrolled usage. */\n  defaultValue?: string;\n  /**\n   * Fires on commit *only when the value actually changed*. Use this to update\n   * external state. Pair with `value` for the controlled pattern.\n   */\n  onChange?: (value: string) => void;\n\n  /** Controlled editing state. When provided, the editing state is controlled. */\n  isEditing?: boolean;\n  /** Default editing state for uncontrolled usage. */\n  defaultIsEditing?: boolean;\n  /** Called when editing mode starts or ends. */\n  onEditingChange?: (isEditing: boolean) => void;\n\n  /**\n   * Fires every time the user commits (Enter / submit-on-blur / `ref.stopEditing(true)`),\n   * even if the value did not change. Use for side effects like analytics or\n   * \"save\" toasts. For state updates, prefer `onChange`.\n   *\n   * May return a Promise. If the returned Promise **rejects**, the component\n   * automatically reverts its optimistic display to the actual `value` prop —\n   * this gives async-save flows free rollback on failure (in controlled mode).\n   */\n  onSubmit?: (value: string) => void | Promise<unknown>;\n  /** Called when editing is cancelled (Escape or empty submit when `allowEmpty` is false). */\n  onCancel?: () => void;\n\n  /** How edit mode is activated from the display element. Default: `'dblclick'`. */\n  editTrigger?: CubeInlineInputEditTrigger;\n  /**\n   * When true (default) the display element is keyboard-focusable and\n   * responds to `Enter`, `F2` and `Space` by entering edit mode. Set to\n   * `false` when a host (e.g. an editable tab inside a button) already\n   * routes keyboard activation through `ref.startEditing()` — exposing the\n   * display element as a separate tab stop would create a nested keyboard\n   * focus inside the host.\n   *\n   * @default true\n   */\n  keyboardActivation?: boolean;\n  /** Whether to submit when focus leaves the input. Default: `true`. */\n  submitOnBlur?: boolean;\n  /** Whether to trim the value on submit. Default: `true`. */\n  trimOnSubmit?: boolean;\n  /** When false, submitting an empty/whitespace value cancels instead. Default: `false`. */\n  allowEmpty?: boolean;\n  /** When true, edit mode cannot be entered (programmatically or otherwise). */\n  isDisabled?: boolean;\n  /** When true, edit mode cannot be entered, but the display reads as enabled. */\n  isReadOnly?: boolean;\n\n  /**\n   * When true, applies a styled wrapper to the component (border, fill, padding,\n   * fixed height) so it visually matches a `TextInput`. Useful when swapping a\n   * field component (e.g. `Select`) for an `InlineInput` to rename / edit the\n   * current value without a visual jump.\n   *\n   * @default false\n   */\n  isStyled?: boolean;\n\n  /** Placeholder text shown in the input when the draft is empty. */\n  placeholder?: string;\n  /** Custom render for display (non-editing) mode. Receives the currently-displayed value (including optimistic). */\n  renderDisplay?: (value: string) => ReactNode;\n  /** ARIA label for the input (used when no visible label is associated). */\n  'aria-label'?: string;\n  /** ARIA labelledby for the input. */\n  'aria-labelledby'?: string;\n\n  /**\n   * Tooltip behaviour for the display value:\n   * - `true` (default): auto-tooltip — show the full value when the text is truncated.\n   * - `false`: never show a tooltip.\n   * - `string`: always show this tooltip text.\n   * - object: full `TooltipProvider` configuration (with optional `auto`).\n   *\n   * The tooltip is automatically suppressed while editing and when `renderDisplay` is used.\n   */\n  tooltip?: AutoTooltipValue;\n  /** Default tooltip placement. @default 'top' */\n  tooltipPlacement?: OverlayProps['placement'];\n\n  /** Convenience prop for styling the `Input` sub-element. Merged into `styles.Input`. */\n  inputStyles?: Styles;\n}\n\nexport interface CubeInlineInputRef {\n  /** Programmatically enter edit mode. */\n  startEditing(): void;\n  /** Programmatically exit edit mode. `submit=true` commits, `submit=false` cancels. Defaults to commit. */\n  stopEditing(submit?: boolean): void;\n  /** Focus the underlying element (input when editing, root span otherwise). */\n  focus(): void;\n  /** Current committed value (includes optimistic value if a parent hasn't synced yet). */\n  getValue(): string;\n}\n\n// =============================================================================\n// Styled element\n// =============================================================================\n\nconst InlineInputRoot = tasty({\n  as: 'span',\n  styles: {\n    // `inline-flex` with `alignItems: baseline` is used (instead of\n    // `inline-block` + `overflow: hidden`) so the container's baseline comes\n    // from the first flex item's content baseline. With `inline-block` +\n    // `overflow: hidden`, the CSS spec forces the baseline to the bottom\n    // margin edge, which visibly shifts the text upward inside surrounding\n    // line boxes (notably inside Tabs' centered `Item.Label`).\n    display: 'inline-flex',\n    alignItems: {\n      '': 'baseline',\n      styled: 'center',\n    },\n    verticalAlign: {\n      '': 'baseline',\n      styled: 'middle',\n    },\n    position: 'relative',\n    width: 'initial 100%',\n    boxSizing: 'border-box',\n    color: {\n      '': 'inherit',\n      styled: '#dark-02',\n      'styled & disabled': '#dark.30',\n    },\n    preset: {\n      '': 'inherit',\n      styled: 't3',\n    },\n    cursor: {\n      '': 'inherit',\n      'editable & !editing': 'text',\n    },\n    fill: {\n      '': '#clear',\n      styled: '#surface',\n      'styled & disabled': '#disabled-surface',\n    },\n    border: {\n      '': false,\n      styled: true,\n      'styled & focused': '#primary-text',\n      'styled & disabled': true,\n    },\n    // Focus ring. Shown when the display element is keyboard-focused\n    // (driven on the React side by `isFocusVisible`) and *always* while\n    // editing — so swapping into the input always presents a clear focus\n    // indicator regardless of how the user activated it (click vs keyboard).\n    // In `styled` mode the border colour transition is enough to indicate\n    // focus (matching `TextInput`'s visual), so the outline is suppressed.\n    // Outline doesn't take layout space and respects rounded corners via\n    // `outlineOffset`.\n    outline: {\n      '': '1bw #primary.0',\n      'focused & !styled': '1bw #primary',\n    },\n    outlineOffset: 1,\n    radius: {\n      '': 0,\n      focused: true,\n      styled: true,\n    },\n    padding: {\n      '': 0,\n      styled: '(.75x - 1bw) (1x - 1bw)',\n    },\n    height: {\n      '': 'auto',\n      styled: '$size-md',\n    },\n    transition: 'theme',\n\n    // Display flex item: owns the truncation (`overflow: hidden` here is a\n    // block-level rule that does *not* alter the parent's baseline, unlike\n    // an `inline-block` overflow rule).\n    Display: {\n      display: 'block',\n      whiteSpace: 'nowrap',\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n      width: 'initial 100%',\n      preset: 'inherit',\n      color: 'inherit',\n    },\n\n    Input: {\n      recipe: 'reset input / input-autofill',\n      preset: 'inherit',\n      color: 'inherit',\n      fill: '#clear',\n      textAlign: 'left',\n      // In `styled` mode the wrapper has a fixed size and we want the input\n      // to fill it (matches `TextInput`). In the default inline mode the\n      // input auto-sizes to its content via `$input-width`.\n      width: {\n        '': '1em $input-width 100%',\n        styled: '0 100% initial',\n      },\n      '&::placeholder': { recipe: 'input-placeholder' },\n    },\n\n    Measure: {\n      position: 'absolute',\n      visibility: 'hidden',\n      pointerEvents: 'none',\n      whiteSpace: 'pre',\n      preset: 'inherit',\n      height: 0,\n      overflow: 'hidden',\n    },\n\n    Placeholder: {\n      recipe: 'input-placeholder',\n      preset: 'inherit',\n    },\n  },\n});\n\nconst STYLE_PROPS = [...BLOCK_STYLES, ...OUTER_STYLES, ...COLOR_STYLES];\n\n// Grace window after a programmatic `startEditing()` during which a blur\n// re-focuses the input rather than committing. ~500ms covers the\n// Menu/Popover EXIT_DURATION (350ms in `Overlay.tsx`) with margin, since a\n// host that starts editing from a closing overlay is the case that needs the\n// widest window.\nconst PROGRAMMATIC_EDIT_BLUR_GRACE_MS = 500;\n\n// =============================================================================\n// Component\n// =============================================================================\n\n/**\n * Inline editable text. Renders the value as inline content by default and\n * swaps to an auto-sizing text input when entering edit mode.\n *\n * Designed to drop into any text context (tab title, heading, paragraph,\n * table cell) without style customization: typography, color, and font family\n * are all inherited from the parent.\n *\n * Value and `isEditing` can each be controlled or uncontrolled independently.\n * Programmatic entry via the imperative ref (`startEditing`/`stopEditing`)\n * works regardless of `editTrigger`.\n */\nexport const InlineInput = forwardRef<CubeInlineInputRef, CubeInlineInputProps>(\n  function InlineInput(allProps, ref) {\n    const {\n      value: valueProp,\n      defaultValue,\n      onChange,\n      isEditing: isEditingProp,\n      defaultIsEditing,\n      onEditingChange,\n      onSubmit,\n      onCancel,\n      editTrigger = 'dblclick',\n      keyboardActivation = true,\n      submitOnBlur = true,\n      trimOnSubmit = true,\n      allowEmpty = false,\n      isDisabled = false,\n      isReadOnly = false,\n      isStyled = false,\n      placeholder,\n      renderDisplay,\n      tooltip = true,\n      tooltipPlacement = 'top',\n      'aria-label': ariaLabel,\n      'aria-labelledby': ariaLabelledby,\n      qa,\n      qaVal,\n      styles: stylesProp,\n      inputStyles,\n      mods: customMods,\n      tokens: customTokens,\n      ...otherProps\n    } = allProps;\n\n    const isControlled = valueProp !== undefined;\n\n    const inputRef = useRef<HTMLInputElement>(null);\n    const measureRef = useRef<HTMLSpanElement>(null);\n    const rootRef = useRef<HTMLSpanElement>(null);\n\n    const [value, setValue] = useControlledState<string>(\n      valueProp as string,\n      (defaultValue ?? '') as string,\n      onChange,\n    );\n\n    const [isEditing, setIsEditing] = useControlledState<boolean>(\n      isEditingProp as boolean,\n      (defaultIsEditing ?? false) as boolean,\n      onEditingChange,\n    );\n\n    // Optimistic value. Holds the just-committed value while we wait for the\n    // (potentially async) controlled parent to sync `value`. In uncontrolled\n    // mode `value` updates immediately so this stays null after each render.\n    const [optimisticValue, setOptimisticValue] = useState<string | null>(null);\n    const displayedValue = optimisticValue ?? value;\n\n    const [draft, setDraft] = useState<string>(value);\n    const [inputWidth, setInputWidth] = useState<number | null>(null);\n\n    // Reliable focus presence for the whole component, driven by\n    // `useFocusWithin` (which, unlike `useFocusRing`/`useFocus` on a bare\n    // span, has an element-removal fallback). Used to gate the display focus\n    // ring so it can never get stuck on after editing ends or after focus\n    // moves to another component.\n    const [isFocusWithin, setIsFocusWithin] = useState(false);\n\n    // Suppresses the display focus ring for a single programmatic focus\n    // restore (when we return focus to the display span after a keyboard /\n    // programmatic edit-end). Reset whenever focus truly leaves the component\n    // so a later real keyboard Tab back shows the ring again.\n    const [ringSuppressed, setRingSuppressed] = useState(false);\n\n    // Token to invalidate in-flight onSubmit promises if a newer commit /\n    // re-entry happens before they settle.\n    const submitTokenRef = useRef(0);\n\n    // Timestamp of the most recent programmatic `startEditing()` call (via\n    // the imperative ref). Used to defeat a focus-theft race: something else\n    // takes focus in the same tick the input mounts, and the resulting blur\n    // would fire `submitOnBlur` and unmount the input the user just opened.\n    //\n    // The thief varies by host — a host's own focus restoration (`TabButton`\n    // re-focuses the tab button when editing ends), a collection's focus\n    // manager, or an overlay closing around the `startEditing()` call. It is\n    // NOT the closing `Menu` popover: `MenuTrigger` leaves focus alone once\n    // an action has moved it (see CUB-3962). The guard is host-agnostic on\n    // purpose — the imperative path cannot know who else wants focus.\n    //\n    // Cleared on first user interaction inside the input (`handleInputChange`\n    // / `handleKeyDown`) and on leaving editing mode, so any later blur\n    // commits normally.\n    const programmaticEditStartRef = useRef<number | null>(null);\n\n    // Set when an edit-end should return focus to the display span (keyboard\n    // Enter/Escape, imperative `stopEditing`). NOT set for submit-on-blur /\n    // tab-away, where focus has already moved elsewhere. Consumed by a layout\n    // effect after the display span re-mounts.\n    const pendingRestoreFocusRef = useRef(false);\n\n    // Synchronous mirror of `isEditing`. We need this because cancel/commit\n    // call user callbacks (`onCancel`/`onSubmit`) that may synchronously\n    // re-focus another element — that causes a synchronous blur on the\n    // input which would otherwise re-enter `commit` via `onBlurWithin` (the\n    // state update from `setIsEditing(false)` isn't committed yet, so the\n    // closure still sees `isEditing === true`).\n    //\n    // The ref is kept in sync via `useLayoutEffect` so concurrent renders\n    // that get thrown away don't leak a stale value into the next commit.\n    const isEditingRef = useRef(isEditing);\n\n    useLayoutEffect(() => {\n      isEditingRef.current = isEditing;\n    }, [isEditing]);\n\n    // Clear the optimistic value once `value` catches up or changes externally.\n    useEffect(() => {\n      setOptimisticValue(null);\n    }, [value]);\n\n    const enterEditing = useEvent(() => {\n      if (isDisabled || isReadOnly || isEditing) return;\n      // Invalidate any in-flight onSubmit promise — its outcome no longer\n      // matters because the user is about to commit a new value anyway.\n      submitTokenRef.current += 1;\n      isEditingRef.current = true;\n      // Start from the actual prop value, not optimistic — gives the user a\n      // way to recover if a previous commit was rejected by the parent.\n      setOptimisticValue(null);\n      setDraft(value);\n      setIsEditing(true);\n    });\n\n    // Whether an edit-end should return focus to the display span. Only when\n    // this component owns its own keyboard/focus story (standalone usage).\n    // Hosts that drive editing through `ref.startEditing()` with\n    // `keyboardActivation={false}` (e.g. `Tabs`) keep ownership of focus.\n    const canRestoreFocus = () =>\n      keyboardActivation &&\n      editTrigger !== 'none' &&\n      !isDisabled &&\n      !isReadOnly;\n\n    const commit = useEvent((rawValue: string, restoreFocus = true) => {\n      // Re-entry guard. `onSubmit`/`onCancel` may synchronously refocus and\n      // trigger another blur-driven commit before the state update lands.\n      if (!isEditingRef.current) return;\n\n      const next = trimOnSubmit ? rawValue.trim() : rawValue;\n\n      if (restoreFocus && canRestoreFocus()) {\n        pendingRestoreFocusRef.current = true;\n      }\n\n      if (!next && !allowEmpty) {\n        isEditingRef.current = false;\n        programmaticEditStartRef.current = null;\n        setIsEditing(false);\n        onCancel?.();\n\n        return;\n      }\n\n      const token = ++submitTokenRef.current;\n\n      if (isControlled) {\n        // Show the new value optimistically until the parent re-renders.\n        setOptimisticValue(next);\n      }\n      isEditingRef.current = false;\n      programmaticEditStartRef.current = null;\n      setValue(next);\n      setIsEditing(false);\n\n      const result = onSubmit?.(next);\n      // If onSubmit returns a Promise that rejects, the parent is signalling\n      // a save failure — revert the optimistic value back to the actual prop.\n      // We guard with a token so a slow rejection doesn't clobber a newer\n      // commit's optimistic display.\n      if (\n        result != null &&\n        typeof (result as Promise<unknown>).then === 'function'\n      ) {\n        (result as Promise<unknown>).then(\n          () => {},\n          () => {\n            if (submitTokenRef.current === token && isControlled) {\n              setOptimisticValue(null);\n            }\n          },\n        );\n      }\n    });\n\n    const cancel = useEvent((restoreFocus = true) => {\n      if (!isEditingRef.current) return;\n      if (restoreFocus && canRestoreFocus()) {\n        pendingRestoreFocusRef.current = true;\n      }\n      isEditingRef.current = false;\n      programmaticEditStartRef.current = null;\n      setIsEditing(false);\n      onCancel?.();\n    });\n\n    // Keep draft in sync with the external value while NOT editing.\n    useEffect(() => {\n      if (!isEditing) setDraft(value);\n    }, [value, isEditing]);\n\n    // Select all text synchronously when entering edit mode.\n    useLayoutEffect(() => {\n      if (!isEditing) return;\n      inputRef.current?.select();\n    }, [isEditing]);\n\n    // Return focus to the display span after a keyboard / programmatic\n    // edit-end so keyboard navigation continues from this control. The focus\n    // is programmatic (react-aria treats it as non-keyboard) and we set\n    // `ringSuppressed` so it does not draw a focus ring; a later real Tab to\n    // the element resets the suppression (see `onFocusWithinChange`).\n    //\n    // `onSubmit`/`onCancel` may synchronously move focus elsewhere. When the\n    // input unmounts, the browser drops focus to `<body>`, so we only restore\n    // focus to the display span when focus actually landed there (or nowhere).\n    // If a handler deliberately moved focus to another element, we leave it.\n    useLayoutEffect(() => {\n      if (isEditing || !pendingRestoreFocusRef.current) return;\n      pendingRestoreFocusRef.current = false;\n\n      const root = rootRef.current;\n      if (!root) return;\n\n      const active = root.ownerDocument.activeElement;\n      const focusLost = !active || active === root.ownerDocument.body;\n      // A handler moved focus to a real element outside this control — respect\n      // it and don't pull focus back.\n      if (!focusLost && !root.contains(active)) return;\n\n      setRingSuppressed(true);\n      root.focus();\n    }, [isEditing]);\n\n    // Measure the draft so the input width follows the typed glyphs.\n    useLayoutEffect(() => {\n      if (!isEditing) return;\n      const measure = measureRef.current;\n\n      if (!measure) return;\n      setInputWidth(measure.scrollWidth);\n    }, [isEditing, draft, placeholder]);\n\n    const handleKeyDown = useEvent((e: KeyboardEvent<HTMLInputElement>) => {\n      // User is interacting with the input — drop the post-`startEditing()`\n      // blur guard so a subsequent click-away commits normally.\n      programmaticEditStartRef.current = null;\n\n      if (e.key === 'Enter') {\n        e.preventDefault();\n        commit(draft);\n\n        return;\n      }\n\n      if (e.key === 'Escape') {\n        e.preventDefault();\n        cancel();\n\n        return;\n      }\n\n      // Prevent the host (e.g. Tabs) from intercepting text-editing keys.\n      if (\n        e.key === 'ArrowLeft' ||\n        e.key === 'ArrowRight' ||\n        e.key === ' ' ||\n        e.key === 'Delete' ||\n        e.key === 'Backspace'\n      ) {\n        e.stopPropagation();\n      }\n    });\n\n    const handleInputChange = useEvent((e: ChangeEvent<HTMLInputElement>) => {\n      programmaticEditStartRef.current = null;\n      setDraft(e.target.value);\n    });\n\n    // Keyboard focus-visible modality (mouse vs keyboard). Used together with\n    // `isFocusWithin` to drive the display focus ring. We rely on\n    // `useFocusWithin` (below) for the *presence* of focus because, unlike\n    // `useFocusRing`/`useFocus` on a bare span, it has an element-removal\n    // fallback — so the ring can never get stuck on after the inner input is\n    // unmounted on edit-end or after focus moves away.\n    const { isFocusVisible, focusProps: focusRingProps } = useFocusRing();\n\n    // Always enabled so it reliably reports focus presence in BOTH display\n    // and edit modes. The submit-on-blur logic is internally guarded by\n    // `isEditingRef`, so running `onBlurWithin` in display mode is a no-op.\n    const { focusWithinProps } = useFocusWithin({\n      onFocusWithinChange: (within) => {\n        setIsFocusWithin(within);\n        // Once focus truly leaves the component, clear the one-shot ring\n        // suppression so a later real keyboard Tab back shows the ring again.\n        if (!within) setRingSuppressed(false);\n      },\n      onBlurWithin: () => {\n        if (!isEditingRef.current) return;\n        if (!submitOnBlur) return;\n\n        // Spurious-blur guard. `useFocusWithin` fires a synthetic blur via its\n        // element-removal fallback when the display span unmounts as we enter\n        // edit mode (focus actually moved INTO the inner input). Ignore it if\n        // focus is in fact still within the component.\n        const active = rootRef.current?.ownerDocument.activeElement;\n        if (active && rootRef.current?.contains(active)) return;\n\n        // Grace-period guard against focus theft right after a programmatic\n        // `startEditing()` — see `programmaticEditStartRef` for who steals it.\n        // Re-focus the input on the next frame so the focus-stealing element\n        // finishes its own handler first, then we steal focus back. The guard\n        // is cleared on the first real user interaction with the input\n        // (keydown / input change) so subsequent click-aways commit normally.\n        const startedAt = programmaticEditStartRef.current;\n        if (\n          startedAt != null &&\n          Date.now() - startedAt < PROGRAMMATIC_EDIT_BLUR_GRACE_MS &&\n          isEditingRef.current\n        ) {\n          requestAnimationFrame(() => {\n            if (isEditingRef.current) {\n              inputRef.current?.focus();\n              inputRef.current?.select();\n            }\n          });\n\n          return;\n        }\n\n        // Focus has already moved elsewhere (tab-away / click-away), so do\n        // NOT pull it back to the display span.\n        commit(draft, false);\n      },\n    });\n\n    const handleDblClick = useEvent((e: MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      enterEditing();\n    });\n\n    const handleClick = useEvent((e: MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      enterEditing();\n    });\n\n    // Keyboard activation from the display element (standalone usage).\n    // Hosts that own keyboard handling themselves should pass\n    // `keyboardActivation={false}` (see `TabButton` for an example).\n    const handleRootKeyDown = useEvent((e: KeyboardEvent<HTMLSpanElement>) => {\n      if (e.key === 'Enter' || e.key === 'F2' || e.key === ' ') {\n        e.preventDefault();\n        e.stopPropagation();\n        enterEditing();\n      }\n    });\n\n    useImperativeHandle(\n      ref,\n      () => ({\n        startEditing: () => {\n          // Arm the grace-period blur guard for the imperative path only.\n          // Pointer-triggered entries (dblclick / click) don't suffer from\n          // the focus-theft race that motivates this guard — the user's own\n          // press is what put focus here.\n          const wasEditing = isEditingRef.current;\n          enterEditing();\n          if (!wasEditing && isEditingRef.current) {\n            programmaticEditStartRef.current = Date.now();\n          }\n        },\n        stopEditing: (submit = true) => {\n          if (!isEditingRef.current) return;\n          if (submit) commit(draft);\n          else cancel();\n        },\n        focus: () => {\n          if (isEditingRef.current) inputRef.current?.focus();\n          else rootRef.current?.focus();\n        },\n        getValue: () => displayedValue,\n      }),\n      [enterEditing, commit, cancel, draft, displayedValue],\n    );\n\n    const isEditable = editTrigger !== 'none' && !isDisabled && !isReadOnly;\n\n    // `focused` controls the visible focus indicator on the root.\n    //\n    // While editing, the inner `<input>` always has focus (FocusScope\n    // `autoFocus`), so we show the focus indicator on the root regardless\n    // of how the user activated edit mode (click vs keyboard).\n    //\n    // In display mode we show the indicator only on keyboard focus\n    // (`isFocusVisible`) AND when focus is actually within the component\n    // (`isFocusWithin`) AND the display element is focusable (`isEditable`).\n    // The `isFocusWithin` gate is the key fix: it reliably drops to `false`\n    // on edit-end / tab-away (it has an element-removal fallback that\n    // `useFocusRing` lacks on a bare span), so the ring can never get stuck\n    // on. `ringSuppressed` hides the ring for a single programmatic focus\n    // restore after a keyboard / programmatic edit-end.\n    //\n    // When `keyboardActivation` is `false` the host (e.g. `Tabs`) owns the\n    // entire focus story for this control, so we suppress the focus ring\n    // entirely — including while editing — to avoid drawing a redundant\n    // indicator on top of the host's own focus ring.\n    const showFocusRing =\n      keyboardActivation &&\n      (isEditing ||\n        (isFocusVisible && isFocusWithin && isEditable && !ringSuppressed));\n\n    const mods = useMemo(\n      () => ({\n        editing: isEditing,\n        editable: isEditable,\n        focused: showFocusRing,\n        disabled: isDisabled,\n        'read-only': isReadOnly,\n        styled: isStyled,\n        empty: !displayedValue,\n        ...customMods,\n      }),\n      [\n        isEditing,\n        isEditable,\n        showFocusRing,\n        isDisabled,\n        isReadOnly,\n        isStyled,\n        displayedValue,\n        customMods,\n      ],\n    );\n\n    const mergedStyles = useMemo<Styles | undefined>(() => {\n      if (!stylesProp && !inputStyles) return undefined;\n      if (!inputStyles) return stylesProp;\n      const existingInput =\n        (stylesProp?.Input as Styles | undefined) ?? undefined;\n\n      return {\n        ...stylesProp,\n        Input: existingInput\n          ? { ...existingInput, ...inputStyles }\n          : inputStyles,\n      };\n    }, [stylesProp, inputStyles]);\n\n    const extractedStyles = extractStyles(\n      otherProps,\n      STYLE_PROPS,\n      mergedStyles,\n    );\n\n    const tokens = useMemo(\n      () => ({\n        ...customTokens,\n        '$input-width': inputWidth != null ? `${inputWidth}px` : 'auto',\n      }),\n      [customTokens, inputWidth],\n    );\n\n    // In display mode, render the placeholder when the value is empty so the\n    // component remains visible / clickable. Consumers using `renderDisplay`\n    // take full control and are responsible for handling empty values\n    // themselves.\n    const displayContent = renderDisplay\n      ? renderDisplay(displayedValue)\n      : displayedValue ||\n        (placeholder ? (\n          <span data-element=\"Placeholder\">{placeholder}</span>\n        ) : (\n          ''\n        ));\n\n    const baseProps = filterBaseProps(otherProps, { eventProps: true });\n\n    // Overflow detection / auto-tooltip. Suppressed while editing (the input\n    // owns the visible text and isn't truncated), and when the consumer\n    // provides `renderDisplay` (they own the display story and should attach\n    // their own tooltip if needed).\n    const { labelRef: tooltipLabelRef, renderWithTooltip } = useAutoTooltip({\n      tooltip: isEditing || renderDisplay ? false : tooltip,\n      children: displayedValue,\n    });\n\n    // Wire pointer/keyboard activators only when relevant. Hosts that drive\n    // editing through `ref.startEditing()` keep all of these `undefined` so\n    // they don't intercept their own keyboard / focus story.\n    const wantsClick = !isEditing && isEditable && editTrigger === 'click';\n    const wantsDblClick =\n      !isEditing && isEditable && editTrigger === 'dblclick';\n    const wantsKeyboard = !isEditing && isEditable && keyboardActivation;\n\n    const renderRoot = (\n      triggerProps?: HTMLAttributes<HTMLElement>,\n      tooltipRef?: RefObject<HTMLElement>,\n    ) => {\n      const handleRootRef = (element: HTMLSpanElement | null) => {\n        rootRef.current = element;\n        if (tooltipRef) {\n          (tooltipRef as { current: HTMLElement | null }).current = element;\n        }\n      };\n\n      // Overflow detection has to look at the truncating element, which is now\n      // the inner `Display` (the root is `inline-flex` and doesn't clip). The\n      // tooltip still anchors to the root via `tooltipRef` above.\n      const handleDisplayRef = (element: HTMLSpanElement | null) => {\n        tooltipLabelRef(element);\n      };\n\n      const a11yProps: HTMLAttributes<HTMLElement> = {};\n\n      if (wantsKeyboard) {\n        a11yProps.tabIndex = 0;\n        a11yProps.role = 'button';\n        a11yProps['aria-roledescription'] = 'editable text';\n        if (ariaLabel) a11yProps['aria-label'] = ariaLabel;\n        if (ariaLabelledby) a11yProps['aria-labelledby'] = ariaLabelledby;\n      }\n\n      if (isDisabled) a11yProps['aria-disabled'] = true;\n      if (isReadOnly) a11yProps['aria-readonly'] = true;\n\n      return (\n        <InlineInputRoot\n          ref={handleRootRef}\n          qa={qa ?? 'InlineInput'}\n          qaVal={qaVal}\n          mods={mods}\n          tokens={tokens}\n          styles={extractedStyles}\n          {...mergeProps(\n            baseProps,\n            focusWithinProps,\n            // Always attach focusRingProps so the hook sees the blur event\n            // when focus moves into the inner input on edit-mode entry. If\n            // we only attached them while `wantsKeyboard` is true, the hook\n            // would miss the blur (since `wantsKeyboard` flips to false the\n            // moment editing starts), leaving `isFocused` stale and the\n            // ring stuck on after editing ends. `useFocusRing` filters\n            // bubbled focus from descendants internally (`target ===\n            // currentTarget`), so spreading these on a non-focusable span\n            // is a no-op.\n            focusRingProps,\n            triggerProps ?? {},\n            {\n              onDoubleClick: wantsDblClick ? handleDblClick : undefined,\n              onClick: wantsClick ? handleClick : undefined,\n              onKeyDown: wantsKeyboard ? handleRootKeyDown : undefined,\n              ...a11yProps,\n            },\n          )}\n        >\n          {isEditing ? (\n            <FocusScope autoFocus restoreFocus={false} contain={false}>\n              <span ref={measureRef} data-element=\"Measure\" aria-hidden=\"true\">\n                {draft || placeholder || ' '}\n              </span>\n              <input\n                ref={inputRef}\n                data-element=\"Input\"\n                type=\"text\"\n                value={draft}\n                placeholder={placeholder}\n                disabled={isDisabled}\n                readOnly={isReadOnly}\n                aria-label={ariaLabel}\n                aria-labelledby={ariaLabelledby}\n                onChange={handleInputChange}\n                onKeyDown={handleKeyDown}\n              />\n            </FocusScope>\n          ) : (\n            <span ref={handleDisplayRef} data-element=\"Display\">\n              {displayContent}\n            </span>\n          )}\n        </InlineInputRoot>\n      );\n    };\n\n    return renderWithTooltip(renderRoot, tooltipPlacement);\n  },\n);\n"],"mappings":"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"}
+{"version":3,"file":"InlineInput.js","names":["mergeProps"],"sources":["../../../../src/components/content/InlineInput/InlineInput.tsx"],"sourcesContent":["import { useControlledState } from '@react-stately/utils';\nimport {\n  BaseProps,\n  BLOCK_STYLES,\n  BlockStyleProps,\n  COLOR_STYLES,\n  ColorStyleProps,\n  filterBaseProps,\n  OUTER_STYLES,\n  OuterStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  forwardRef,\n  useEffect,\n  useImperativeHandle,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport {\n  FocusScope,\n  OverlayProps,\n  useFocusRing,\n  useFocusWithin,\n} from 'react-aria';\n\nimport { useEvent } from '../../../_internal/hooks';\nimport { mergeProps } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { AutoTooltipValue, useAutoTooltip } from '../use-auto-tooltip';\n\nimport type {\n  ChangeEvent,\n  HTMLAttributes,\n  KeyboardEvent,\n  MouseEvent,\n  ReactNode,\n  RefObject,\n} from 'react';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport type CubeInlineInputEditTrigger = 'dblclick' | 'click' | 'none';\n\nexport interface CubeInlineInputProps\n  extends BaseProps,\n    BlockStyleProps,\n    OuterStyleProps,\n    ColorStyleProps {\n  /** Controlled value. When provided, the component is controlled. */\n  value?: string;\n  /** Initial value for uncontrolled usage. */\n  defaultValue?: string;\n  /**\n   * Fires on commit *only when the value actually changed*. Use this to update\n   * external state. Pair with `value` for the controlled pattern.\n   */\n  onChange?: (value: string) => void;\n\n  /** Controlled editing state. When provided, the editing state is controlled. */\n  isEditing?: boolean;\n  /** Default editing state for uncontrolled usage. */\n  defaultIsEditing?: boolean;\n  /** Called when editing mode starts or ends. */\n  onEditingChange?: (isEditing: boolean) => void;\n\n  /**\n   * Fires every time the user commits (Enter / submit-on-blur / `ref.stopEditing(true)`),\n   * even if the value did not change. Use for side effects like analytics or\n   * \"save\" toasts. For state updates, prefer `onChange`.\n   *\n   * May return a Promise. If the returned Promise **rejects**, the component\n   * automatically reverts its optimistic display to the actual `value` prop —\n   * this gives async-save flows free rollback on failure (in controlled mode).\n   */\n  onSubmit?: (value: string) => void | Promise<unknown>;\n  /** Called when editing is cancelled (Escape or empty submit when `allowEmpty` is false). */\n  onCancel?: () => void;\n\n  /** How edit mode is activated from the display element. Default: `'dblclick'`. */\n  editTrigger?: CubeInlineInputEditTrigger;\n  /**\n   * When true (default) the display element is keyboard-focusable and\n   * responds to `Enter`, `F2` and `Space` by entering edit mode. Set to\n   * `false` when a host (e.g. an editable tab inside a button) already\n   * routes keyboard activation through `ref.startEditing()` — exposing the\n   * display element as a separate tab stop would create a nested keyboard\n   * focus inside the host.\n   *\n   * @default true\n   */\n  keyboardActivation?: boolean;\n  /** Whether to submit when focus leaves the input. Default: `true`. */\n  submitOnBlur?: boolean;\n  /** Whether to trim the value on submit. Default: `true`. */\n  trimOnSubmit?: boolean;\n  /** When false, submitting an empty/whitespace value cancels instead. Default: `false`. */\n  allowEmpty?: boolean;\n  /** When true, edit mode cannot be entered (programmatically or otherwise). */\n  isDisabled?: boolean;\n  /** When true, edit mode cannot be entered, but the display reads as enabled. */\n  isReadOnly?: boolean;\n\n  /**\n   * When true, applies a styled wrapper to the component (border, fill, padding,\n   * fixed height) so it visually matches a `TextInput`. Useful when swapping a\n   * field component (e.g. `Select`) for an `InlineInput` to rename / edit the\n   * current value without a visual jump.\n   *\n   * @default false\n   */\n  isStyled?: boolean;\n\n  /** Placeholder text shown in the input when the draft is empty. */\n  placeholder?: string;\n  /**\n   * What kind of autofill the browser may offer for the input, as the HTML `autocomplete` token\n   * (`email`, `off`, …). See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete).\n   */\n  autoComplete?: string;\n  /** Custom render for display (non-editing) mode. Receives the currently-displayed value (including optimistic). */\n  renderDisplay?: (value: string) => ReactNode;\n  /** ARIA label for the input (used when no visible label is associated). */\n  'aria-label'?: string;\n  /** ARIA labelledby for the input. */\n  'aria-labelledby'?: string;\n\n  /**\n   * Tooltip behaviour for the display value:\n   * - `true` (default): auto-tooltip — show the full value when the text is truncated.\n   * - `false`: never show a tooltip.\n   * - `string`: always show this tooltip text.\n   * - object: full `TooltipProvider` configuration (with optional `auto`).\n   *\n   * The tooltip is automatically suppressed while editing and when `renderDisplay` is used.\n   */\n  tooltip?: AutoTooltipValue;\n  /** Default tooltip placement. @default 'top' */\n  tooltipPlacement?: OverlayProps['placement'];\n\n  /** Convenience prop for styling the `Input` sub-element. Merged into `styles.Input`. */\n  inputStyles?: Styles;\n}\n\nexport interface CubeInlineInputRef {\n  /** Programmatically enter edit mode. */\n  startEditing(): void;\n  /** Programmatically exit edit mode. `submit=true` commits, `submit=false` cancels. Defaults to commit. */\n  stopEditing(submit?: boolean): void;\n  /** Focus the underlying element (input when editing, root span otherwise). */\n  focus(): void;\n  /** Current committed value (includes optimistic value if a parent hasn't synced yet). */\n  getValue(): string;\n}\n\n// =============================================================================\n// Styled element\n// =============================================================================\n\nconst InlineInputRoot = tasty({\n  as: 'span',\n  styles: {\n    // `inline-flex` with `alignItems: baseline` is used (instead of\n    // `inline-block` + `overflow: hidden`) so the container's baseline comes\n    // from the first flex item's content baseline. With `inline-block` +\n    // `overflow: hidden`, the CSS spec forces the baseline to the bottom\n    // margin edge, which visibly shifts the text upward inside surrounding\n    // line boxes (notably inside Tabs' centered `Item.Label`).\n    display: 'inline-flex',\n    alignItems: {\n      '': 'baseline',\n      styled: 'center',\n    },\n    verticalAlign: {\n      '': 'baseline',\n      styled: 'middle',\n    },\n    position: 'relative',\n    width: 'initial 100%',\n    boxSizing: 'border-box',\n    color: {\n      '': 'inherit',\n      styled: '#dark-02',\n      'styled & disabled': '#dark.30',\n    },\n    preset: {\n      '': 'inherit',\n      styled: 't3',\n    },\n    cursor: {\n      '': 'inherit',\n      'editable & !editing': 'text',\n    },\n    fill: {\n      '': '#clear',\n      styled: '#surface',\n      'styled & disabled': '#disabled-surface',\n    },\n    border: {\n      '': false,\n      styled: true,\n      'styled & focused': '#primary-text',\n      'styled & disabled': true,\n    },\n    // Focus ring. Shown when the display element is keyboard-focused\n    // (driven on the React side by `isFocusVisible`) and *always* while\n    // editing — so swapping into the input always presents a clear focus\n    // indicator regardless of how the user activated it (click vs keyboard).\n    // In `styled` mode the border colour transition is enough to indicate\n    // focus (matching `TextInput`'s visual), so the outline is suppressed.\n    // Outline doesn't take layout space and respects rounded corners via\n    // `outlineOffset`.\n    outline: {\n      '': '1bw #primary.0',\n      'focused & !styled': '1bw #primary',\n    },\n    outlineOffset: 1,\n    radius: {\n      '': 0,\n      focused: true,\n      styled: true,\n    },\n    padding: {\n      '': 0,\n      styled: '(.75x - 1bw) (1x - 1bw)',\n    },\n    height: {\n      '': 'auto',\n      styled: '$size-md',\n    },\n    transition: 'theme',\n\n    // Display flex item: owns the truncation (`overflow: hidden` here is a\n    // block-level rule that does *not* alter the parent's baseline, unlike\n    // an `inline-block` overflow rule).\n    Display: {\n      display: 'block',\n      whiteSpace: 'nowrap',\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n      width: 'initial 100%',\n      preset: 'inherit',\n      color: 'inherit',\n    },\n\n    Input: {\n      recipe: 'reset input / input-autofill',\n      preset: 'inherit',\n      color: 'inherit',\n      fill: '#clear',\n      textAlign: 'left',\n      // In `styled` mode the wrapper has a fixed size and we want the input\n      // to fill it (matches `TextInput`). In the default inline mode the\n      // input auto-sizes to its content via `$input-width`.\n      width: {\n        '': '1em $input-width 100%',\n        styled: '0 100% initial',\n      },\n      '&::placeholder': { recipe: 'input-placeholder' },\n    },\n\n    Measure: {\n      position: 'absolute',\n      visibility: 'hidden',\n      pointerEvents: 'none',\n      whiteSpace: 'pre',\n      preset: 'inherit',\n      height: 0,\n      overflow: 'hidden',\n    },\n\n    Placeholder: {\n      recipe: 'input-placeholder',\n      preset: 'inherit',\n    },\n  },\n});\n\nconst STYLE_PROPS = [...BLOCK_STYLES, ...OUTER_STYLES, ...COLOR_STYLES];\n\n// Grace window after a programmatic `startEditing()` during which a blur\n// re-focuses the input rather than committing. ~500ms covers the\n// Menu/Popover EXIT_DURATION (350ms in `Overlay.tsx`) with margin, since a\n// host that starts editing from a closing overlay is the case that needs the\n// widest window.\nconst PROGRAMMATIC_EDIT_BLUR_GRACE_MS = 500;\n\n// =============================================================================\n// Component\n// =============================================================================\n\n/**\n * Inline editable text. Renders the value as inline content by default and\n * swaps to an auto-sizing text input when entering edit mode.\n *\n * Designed to drop into any text context (tab title, heading, paragraph,\n * table cell) without style customization: typography, color, and font family\n * are all inherited from the parent.\n *\n * Value and `isEditing` can each be controlled or uncontrolled independently.\n * Programmatic entry via the imperative ref (`startEditing`/`stopEditing`)\n * works regardless of `editTrigger`.\n */\nexport const InlineInput = forwardRef<CubeInlineInputRef, CubeInlineInputProps>(\n  function InlineInput(allProps, ref) {\n    const {\n      value: valueProp,\n      defaultValue,\n      onChange,\n      isEditing: isEditingProp,\n      defaultIsEditing,\n      onEditingChange,\n      onSubmit,\n      onCancel,\n      editTrigger = 'dblclick',\n      keyboardActivation = true,\n      submitOnBlur = true,\n      trimOnSubmit = true,\n      allowEmpty = false,\n      isDisabled = false,\n      isReadOnly = false,\n      isStyled = false,\n      placeholder,\n      autoComplete,\n      renderDisplay,\n      tooltip = true,\n      tooltipPlacement = 'top',\n      'aria-label': ariaLabel,\n      'aria-labelledby': ariaLabelledby,\n      qa,\n      qaVal,\n      styles: stylesProp,\n      inputStyles,\n      mods: customMods,\n      tokens: customTokens,\n      ...otherProps\n    } = allProps;\n\n    const isControlled = valueProp !== undefined;\n\n    const inputRef = useRef<HTMLInputElement>(null);\n    const measureRef = useRef<HTMLSpanElement>(null);\n    const rootRef = useRef<HTMLSpanElement>(null);\n\n    const [value, setValue] = useControlledState<string>(\n      valueProp as string,\n      (defaultValue ?? '') as string,\n      onChange,\n    );\n\n    const [isEditing, setIsEditing] = useControlledState<boolean>(\n      isEditingProp as boolean,\n      (defaultIsEditing ?? false) as boolean,\n      onEditingChange,\n    );\n\n    // Optimistic value. Holds the just-committed value while we wait for the\n    // (potentially async) controlled parent to sync `value`. In uncontrolled\n    // mode `value` updates immediately so this stays null after each render.\n    const [optimisticValue, setOptimisticValue] = useState<string | null>(null);\n    const displayedValue = optimisticValue ?? value;\n\n    const [draft, setDraft] = useState<string>(value);\n    const [inputWidth, setInputWidth] = useState<number | null>(null);\n\n    // Reliable focus presence for the whole component, driven by\n    // `useFocusWithin` (which, unlike `useFocusRing`/`useFocus` on a bare\n    // span, has an element-removal fallback). Used to gate the display focus\n    // ring so it can never get stuck on after editing ends or after focus\n    // moves to another component.\n    const [isFocusWithin, setIsFocusWithin] = useState(false);\n\n    // Suppresses the display focus ring for a single programmatic focus\n    // restore (when we return focus to the display span after a keyboard /\n    // programmatic edit-end). Reset whenever focus truly leaves the component\n    // so a later real keyboard Tab back shows the ring again.\n    const [ringSuppressed, setRingSuppressed] = useState(false);\n\n    // Token to invalidate in-flight onSubmit promises if a newer commit /\n    // re-entry happens before they settle.\n    const submitTokenRef = useRef(0);\n\n    // Timestamp of the most recent programmatic `startEditing()` call (via\n    // the imperative ref). Used to defeat a focus-theft race: something else\n    // takes focus in the same tick the input mounts, and the resulting blur\n    // would fire `submitOnBlur` and unmount the input the user just opened.\n    //\n    // The thief varies by host — a host's own focus restoration (`TabButton`\n    // re-focuses the tab button when editing ends), a collection's focus\n    // manager, or an overlay closing around the `startEditing()` call. It is\n    // NOT the closing `Menu` popover: `MenuTrigger` leaves focus alone once\n    // an action has moved it (see CUB-3962). The guard is host-agnostic on\n    // purpose — the imperative path cannot know who else wants focus.\n    //\n    // Cleared on first user interaction inside the input (`handleInputChange`\n    // / `handleKeyDown`) and on leaving editing mode, so any later blur\n    // commits normally.\n    const programmaticEditStartRef = useRef<number | null>(null);\n\n    // Set when an edit-end should return focus to the display span (keyboard\n    // Enter/Escape, imperative `stopEditing`). NOT set for submit-on-blur /\n    // tab-away, where focus has already moved elsewhere. Consumed by a layout\n    // effect after the display span re-mounts.\n    const pendingRestoreFocusRef = useRef(false);\n\n    // Synchronous mirror of `isEditing`. We need this because cancel/commit\n    // call user callbacks (`onCancel`/`onSubmit`) that may synchronously\n    // re-focus another element — that causes a synchronous blur on the\n    // input which would otherwise re-enter `commit` via `onBlurWithin` (the\n    // state update from `setIsEditing(false)` isn't committed yet, so the\n    // closure still sees `isEditing === true`).\n    //\n    // The ref is kept in sync via `useLayoutEffect` so concurrent renders\n    // that get thrown away don't leak a stale value into the next commit.\n    const isEditingRef = useRef(isEditing);\n\n    useLayoutEffect(() => {\n      isEditingRef.current = isEditing;\n    }, [isEditing]);\n\n    // Clear the optimistic value once `value` catches up or changes externally.\n    useEffect(() => {\n      setOptimisticValue(null);\n    }, [value]);\n\n    const enterEditing = useEvent(() => {\n      if (isDisabled || isReadOnly || isEditing) return;\n      // Invalidate any in-flight onSubmit promise — its outcome no longer\n      // matters because the user is about to commit a new value anyway.\n      submitTokenRef.current += 1;\n      isEditingRef.current = true;\n      // Start from the actual prop value, not optimistic — gives the user a\n      // way to recover if a previous commit was rejected by the parent.\n      setOptimisticValue(null);\n      setDraft(value);\n      setIsEditing(true);\n    });\n\n    // Whether an edit-end should return focus to the display span. Only when\n    // this component owns its own keyboard/focus story (standalone usage).\n    // Hosts that drive editing through `ref.startEditing()` with\n    // `keyboardActivation={false}` (e.g. `Tabs`) keep ownership of focus.\n    const canRestoreFocus = () =>\n      keyboardActivation &&\n      editTrigger !== 'none' &&\n      !isDisabled &&\n      !isReadOnly;\n\n    const commit = useEvent((rawValue: string, restoreFocus = true) => {\n      // Re-entry guard. `onSubmit`/`onCancel` may synchronously refocus and\n      // trigger another blur-driven commit before the state update lands.\n      if (!isEditingRef.current) return;\n\n      const next = trimOnSubmit ? rawValue.trim() : rawValue;\n\n      if (restoreFocus && canRestoreFocus()) {\n        pendingRestoreFocusRef.current = true;\n      }\n\n      if (!next && !allowEmpty) {\n        isEditingRef.current = false;\n        programmaticEditStartRef.current = null;\n        setIsEditing(false);\n        onCancel?.();\n\n        return;\n      }\n\n      const token = ++submitTokenRef.current;\n\n      if (isControlled) {\n        // Show the new value optimistically until the parent re-renders.\n        setOptimisticValue(next);\n      }\n      isEditingRef.current = false;\n      programmaticEditStartRef.current = null;\n      setValue(next);\n      setIsEditing(false);\n\n      const result = onSubmit?.(next);\n      // If onSubmit returns a Promise that rejects, the parent is signalling\n      // a save failure — revert the optimistic value back to the actual prop.\n      // We guard with a token so a slow rejection doesn't clobber a newer\n      // commit's optimistic display.\n      if (\n        result != null &&\n        typeof (result as Promise<unknown>).then === 'function'\n      ) {\n        (result as Promise<unknown>).then(\n          () => {},\n          () => {\n            if (submitTokenRef.current === token && isControlled) {\n              setOptimisticValue(null);\n            }\n          },\n        );\n      }\n    });\n\n    const cancel = useEvent((restoreFocus = true) => {\n      if (!isEditingRef.current) return;\n      if (restoreFocus && canRestoreFocus()) {\n        pendingRestoreFocusRef.current = true;\n      }\n      isEditingRef.current = false;\n      programmaticEditStartRef.current = null;\n      setIsEditing(false);\n      onCancel?.();\n    });\n\n    // Keep draft in sync with the external value while NOT editing.\n    useEffect(() => {\n      if (!isEditing) setDraft(value);\n    }, [value, isEditing]);\n\n    // Select all text synchronously when entering edit mode.\n    useLayoutEffect(() => {\n      if (!isEditing) return;\n      inputRef.current?.select();\n    }, [isEditing]);\n\n    // Return focus to the display span after a keyboard / programmatic\n    // edit-end so keyboard navigation continues from this control. The focus\n    // is programmatic (react-aria treats it as non-keyboard) and we set\n    // `ringSuppressed` so it does not draw a focus ring; a later real Tab to\n    // the element resets the suppression (see `onFocusWithinChange`).\n    //\n    // `onSubmit`/`onCancel` may synchronously move focus elsewhere. When the\n    // input unmounts, the browser drops focus to `<body>`, so we only restore\n    // focus to the display span when focus actually landed there (or nowhere).\n    // If a handler deliberately moved focus to another element, we leave it.\n    useLayoutEffect(() => {\n      if (isEditing || !pendingRestoreFocusRef.current) return;\n      pendingRestoreFocusRef.current = false;\n\n      const root = rootRef.current;\n      if (!root) return;\n\n      const active = root.ownerDocument.activeElement;\n      const focusLost = !active || active === root.ownerDocument.body;\n      // A handler moved focus to a real element outside this control — respect\n      // it and don't pull focus back.\n      if (!focusLost && !root.contains(active)) return;\n\n      setRingSuppressed(true);\n      root.focus();\n    }, [isEditing]);\n\n    // Measure the draft so the input width follows the typed glyphs.\n    useLayoutEffect(() => {\n      if (!isEditing) return;\n      const measure = measureRef.current;\n\n      if (!measure) return;\n      setInputWidth(measure.scrollWidth);\n    }, [isEditing, draft, placeholder]);\n\n    const handleKeyDown = useEvent((e: KeyboardEvent<HTMLInputElement>) => {\n      // User is interacting with the input — drop the post-`startEditing()`\n      // blur guard so a subsequent click-away commits normally.\n      programmaticEditStartRef.current = null;\n\n      if (e.key === 'Enter') {\n        e.preventDefault();\n        commit(draft);\n\n        return;\n      }\n\n      if (e.key === 'Escape') {\n        e.preventDefault();\n        cancel();\n\n        return;\n      }\n\n      // Prevent the host (e.g. Tabs) from intercepting text-editing keys.\n      if (\n        e.key === 'ArrowLeft' ||\n        e.key === 'ArrowRight' ||\n        e.key === ' ' ||\n        e.key === 'Delete' ||\n        e.key === 'Backspace'\n      ) {\n        e.stopPropagation();\n      }\n    });\n\n    const handleInputChange = useEvent((e: ChangeEvent<HTMLInputElement>) => {\n      programmaticEditStartRef.current = null;\n      setDraft(e.target.value);\n    });\n\n    // Keyboard focus-visible modality (mouse vs keyboard). Used together with\n    // `isFocusWithin` to drive the display focus ring. We rely on\n    // `useFocusWithin` (below) for the *presence* of focus because, unlike\n    // `useFocusRing`/`useFocus` on a bare span, it has an element-removal\n    // fallback — so the ring can never get stuck on after the inner input is\n    // unmounted on edit-end or after focus moves away.\n    const { isFocusVisible, focusProps: focusRingProps } = useFocusRing();\n\n    // Always enabled so it reliably reports focus presence in BOTH display\n    // and edit modes. The submit-on-blur logic is internally guarded by\n    // `isEditingRef`, so running `onBlurWithin` in display mode is a no-op.\n    const { focusWithinProps } = useFocusWithin({\n      onFocusWithinChange: (within) => {\n        setIsFocusWithin(within);\n        // Once focus truly leaves the component, clear the one-shot ring\n        // suppression so a later real keyboard Tab back shows the ring again.\n        if (!within) setRingSuppressed(false);\n      },\n      onBlurWithin: () => {\n        if (!isEditingRef.current) return;\n        if (!submitOnBlur) return;\n\n        // Spurious-blur guard. `useFocusWithin` fires a synthetic blur via its\n        // element-removal fallback when the display span unmounts as we enter\n        // edit mode (focus actually moved INTO the inner input). Ignore it if\n        // focus is in fact still within the component.\n        const active = rootRef.current?.ownerDocument.activeElement;\n        if (active && rootRef.current?.contains(active)) return;\n\n        // Grace-period guard against focus theft right after a programmatic\n        // `startEditing()` — see `programmaticEditStartRef` for who steals it.\n        // Re-focus the input on the next frame so the focus-stealing element\n        // finishes its own handler first, then we steal focus back. The guard\n        // is cleared on the first real user interaction with the input\n        // (keydown / input change) so subsequent click-aways commit normally.\n        const startedAt = programmaticEditStartRef.current;\n        if (\n          startedAt != null &&\n          Date.now() - startedAt < PROGRAMMATIC_EDIT_BLUR_GRACE_MS &&\n          isEditingRef.current\n        ) {\n          requestAnimationFrame(() => {\n            if (isEditingRef.current) {\n              inputRef.current?.focus();\n              inputRef.current?.select();\n            }\n          });\n\n          return;\n        }\n\n        // Focus has already moved elsewhere (tab-away / click-away), so do\n        // NOT pull it back to the display span.\n        commit(draft, false);\n      },\n    });\n\n    const handleDblClick = useEvent((e: MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      enterEditing();\n    });\n\n    const handleClick = useEvent((e: MouseEvent) => {\n      e.preventDefault();\n      e.stopPropagation();\n      enterEditing();\n    });\n\n    // Keyboard activation from the display element (standalone usage).\n    // Hosts that own keyboard handling themselves should pass\n    // `keyboardActivation={false}` (see `TabButton` for an example).\n    const handleRootKeyDown = useEvent((e: KeyboardEvent<HTMLSpanElement>) => {\n      if (e.key === 'Enter' || e.key === 'F2' || e.key === ' ') {\n        e.preventDefault();\n        e.stopPropagation();\n        enterEditing();\n      }\n    });\n\n    useImperativeHandle(\n      ref,\n      () => ({\n        startEditing: () => {\n          // Arm the grace-period blur guard for the imperative path only.\n          // Pointer-triggered entries (dblclick / click) don't suffer from\n          // the focus-theft race that motivates this guard — the user's own\n          // press is what put focus here.\n          const wasEditing = isEditingRef.current;\n          enterEditing();\n          if (!wasEditing && isEditingRef.current) {\n            programmaticEditStartRef.current = Date.now();\n          }\n        },\n        stopEditing: (submit = true) => {\n          if (!isEditingRef.current) return;\n          if (submit) commit(draft);\n          else cancel();\n        },\n        focus: () => {\n          if (isEditingRef.current) inputRef.current?.focus();\n          else rootRef.current?.focus();\n        },\n        getValue: () => displayedValue,\n      }),\n      [enterEditing, commit, cancel, draft, displayedValue],\n    );\n\n    const isEditable = editTrigger !== 'none' && !isDisabled && !isReadOnly;\n\n    // `focused` controls the visible focus indicator on the root.\n    //\n    // While editing, the inner `<input>` always has focus (FocusScope\n    // `autoFocus`), so we show the focus indicator on the root regardless\n    // of how the user activated edit mode (click vs keyboard).\n    //\n    // In display mode we show the indicator only on keyboard focus\n    // (`isFocusVisible`) AND when focus is actually within the component\n    // (`isFocusWithin`) AND the display element is focusable (`isEditable`).\n    // The `isFocusWithin` gate is the key fix: it reliably drops to `false`\n    // on edit-end / tab-away (it has an element-removal fallback that\n    // `useFocusRing` lacks on a bare span), so the ring can never get stuck\n    // on. `ringSuppressed` hides the ring for a single programmatic focus\n    // restore after a keyboard / programmatic edit-end.\n    //\n    // When `keyboardActivation` is `false` the host (e.g. `Tabs`) owns the\n    // entire focus story for this control, so we suppress the focus ring\n    // entirely — including while editing — to avoid drawing a redundant\n    // indicator on top of the host's own focus ring.\n    const showFocusRing =\n      keyboardActivation &&\n      (isEditing ||\n        (isFocusVisible && isFocusWithin && isEditable && !ringSuppressed));\n\n    const mods = useMemo(\n      () => ({\n        editing: isEditing,\n        editable: isEditable,\n        focused: showFocusRing,\n        disabled: isDisabled,\n        'read-only': isReadOnly,\n        styled: isStyled,\n        empty: !displayedValue,\n        ...customMods,\n      }),\n      [\n        isEditing,\n        isEditable,\n        showFocusRing,\n        isDisabled,\n        isReadOnly,\n        isStyled,\n        displayedValue,\n        customMods,\n      ],\n    );\n\n    const mergedStyles = useMemo<Styles | undefined>(() => {\n      if (!stylesProp && !inputStyles) return undefined;\n      if (!inputStyles) return stylesProp;\n      const existingInput =\n        (stylesProp?.Input as Styles | undefined) ?? undefined;\n\n      return {\n        ...stylesProp,\n        Input: existingInput\n          ? { ...existingInput, ...inputStyles }\n          : inputStyles,\n      };\n    }, [stylesProp, inputStyles]);\n\n    const extractedStyles = extractStyles(\n      otherProps,\n      STYLE_PROPS,\n      mergedStyles,\n    );\n\n    const tokens = useMemo(\n      () => ({\n        ...customTokens,\n        '$input-width': inputWidth != null ? `${inputWidth}px` : 'auto',\n      }),\n      [customTokens, inputWidth],\n    );\n\n    // In display mode, render the placeholder when the value is empty so the\n    // component remains visible / clickable. Consumers using `renderDisplay`\n    // take full control and are responsible for handling empty values\n    // themselves.\n    const displayContent = renderDisplay\n      ? renderDisplay(displayedValue)\n      : displayedValue ||\n        (placeholder ? (\n          <span data-element=\"Placeholder\">{placeholder}</span>\n        ) : (\n          ''\n        ));\n\n    const baseProps = filterBaseProps(otherProps, { eventProps: true });\n\n    // Overflow detection / auto-tooltip. Suppressed while editing (the input\n    // owns the visible text and isn't truncated), and when the consumer\n    // provides `renderDisplay` (they own the display story and should attach\n    // their own tooltip if needed).\n    const { labelRef: tooltipLabelRef, renderWithTooltip } = useAutoTooltip({\n      tooltip: isEditing || renderDisplay ? false : tooltip,\n      children: displayedValue,\n    });\n\n    // Wire pointer/keyboard activators only when relevant. Hosts that drive\n    // editing through `ref.startEditing()` keep all of these `undefined` so\n    // they don't intercept their own keyboard / focus story.\n    const wantsClick = !isEditing && isEditable && editTrigger === 'click';\n    const wantsDblClick =\n      !isEditing && isEditable && editTrigger === 'dblclick';\n    const wantsKeyboard = !isEditing && isEditable && keyboardActivation;\n\n    const renderRoot = (\n      triggerProps?: HTMLAttributes<HTMLElement>,\n      tooltipRef?: RefObject<HTMLElement>,\n    ) => {\n      const handleRootRef = (element: HTMLSpanElement | null) => {\n        rootRef.current = element;\n        if (tooltipRef) {\n          (tooltipRef as { current: HTMLElement | null }).current = element;\n        }\n      };\n\n      // Overflow detection has to look at the truncating element, which is now\n      // the inner `Display` (the root is `inline-flex` and doesn't clip). The\n      // tooltip still anchors to the root via `tooltipRef` above.\n      const handleDisplayRef = (element: HTMLSpanElement | null) => {\n        tooltipLabelRef(element);\n      };\n\n      const a11yProps: HTMLAttributes<HTMLElement> = {};\n\n      if (wantsKeyboard) {\n        a11yProps.tabIndex = 0;\n        a11yProps.role = 'button';\n        a11yProps['aria-roledescription'] = 'editable text';\n        if (ariaLabel) a11yProps['aria-label'] = ariaLabel;\n        if (ariaLabelledby) a11yProps['aria-labelledby'] = ariaLabelledby;\n      }\n\n      if (isDisabled) a11yProps['aria-disabled'] = true;\n      if (isReadOnly) a11yProps['aria-readonly'] = true;\n\n      return (\n        <InlineInputRoot\n          ref={handleRootRef}\n          qa={qa ?? 'InlineInput'}\n          qaVal={qaVal}\n          mods={mods}\n          tokens={tokens}\n          styles={extractedStyles}\n          {...mergeProps(\n            baseProps,\n            focusWithinProps,\n            // Always attach focusRingProps so the hook sees the blur event\n            // when focus moves into the inner input on edit-mode entry. If\n            // we only attached them while `wantsKeyboard` is true, the hook\n            // would miss the blur (since `wantsKeyboard` flips to false the\n            // moment editing starts), leaving `isFocused` stale and the\n            // ring stuck on after editing ends. `useFocusRing` filters\n            // bubbled focus from descendants internally (`target ===\n            // currentTarget`), so spreading these on a non-focusable span\n            // is a no-op.\n            focusRingProps,\n            triggerProps ?? {},\n            {\n              onDoubleClick: wantsDblClick ? handleDblClick : undefined,\n              onClick: wantsClick ? handleClick : undefined,\n              onKeyDown: wantsKeyboard ? handleRootKeyDown : undefined,\n              ...a11yProps,\n            },\n          )}\n        >\n          {isEditing ? (\n            <FocusScope autoFocus restoreFocus={false} contain={false}>\n              <span ref={measureRef} data-element=\"Measure\" aria-hidden=\"true\">\n                {draft || placeholder || ' '}\n              </span>\n              <input\n                ref={inputRef}\n                data-element=\"Input\"\n                type=\"text\"\n                value={draft}\n                placeholder={placeholder}\n                autoComplete={autoComplete}\n                disabled={isDisabled}\n                readOnly={isReadOnly}\n                aria-label={ariaLabel}\n                aria-labelledby={ariaLabelledby}\n                onChange={handleInputChange}\n                onKeyDown={handleKeyDown}\n              />\n            </FocusScope>\n          ) : (\n            <span ref={handleDisplayRef} data-element=\"Display\">\n              {displayContent}\n            </span>\n          )}\n        </InlineInputRoot>\n      );\n    };\n\n    return renderWithTooltip(renderRoot, tooltipPlacement);\n  },\n);\n"],"mappings":"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"}

package/dist/components/content/Item/Item.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { getDisabledElementProps, omitActivationEventProps } from "../../../utils/react/disabledProps.js";
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { resolveIcon } from "../../../utils/react/resolveIcon.js";

package/dist/components/content/Item/Item.js.map

@@ -1 +1 @@
-{"version":3,"file":"Item.js","names":["HotKeys"],"sources":["../../../../src/components/content/Item/Item.tsx"],"sourcesContent":["import {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Mods,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  ForwardedRef,\n  forwardRef,\n  HTMLAttributes,\n  isValidElement,\n  KeyboardEvent,\n  MouseEvent,\n  PointerEvent,\n  ReactNode,\n  RefObject,\n  useMemo,\n} from 'react';\nimport { OverlayProps } from 'react-aria';\nimport { useHotkeys } from 'react-hotkeys-hook';\n\nimport { useWarn } from '../../../_internal/hooks/use-warn';\nimport {\n  ITEM_VARIANTS,\n  ItemVariant,\n  resolveItemVariant,\n} from '../../../data/item-themes';\nimport { CheckIcon } from '../../../icons/CheckIcon';\nimport { LoadingIcon } from '../../../icons/LoadingIcon';\nimport {\n  DynamicIcon,\n  getDisabledElementProps,\n  mergeProps,\n  omitActivationEventProps,\n  resolveIcon,\n} from '../../../utils/react';\nimport { ItemAction } from '../../actions/ItemAction';\nimport { ItemActionProvider } from '../../actions/ItemActionContext';\nimport { IconSwitch } from '../../helpers/IconSwitch/IconSwitch';\nimport { CubeTooltipProviderProps } from '../../overlays/Tooltip/TooltipProvider';\nimport { highlightText } from '../highlightText';\nimport { HotKeys } from '../HotKeys';\nimport { ItemBadge } from '../ItemBadge';\nimport { useAutoTooltip } from '../use-auto-tooltip';\n\nimport type { Props } from '../../../props';\n\nconst ITEM_SIZE_VALUES = [\n  'xsmall',\n  'small',\n  'medium',\n  'large',\n  'xlarge',\n  'inline',\n] as const;\n\n/** Known modifiers for Item component */\nexport type ItemMods = Mods<{\n  'has-icon'?: boolean;\n  'has-start-content'?: boolean;\n  'has-end-content'?: boolean;\n  'has-right-icon'?: boolean;\n  'has-label'?: boolean;\n  'has-prefix'?: boolean;\n  'has-suffix'?: boolean;\n  'has-description'?: boolean;\n  'has-actions'?: boolean;\n  'has-actions-content'?: boolean;\n  'auto-hide-actions'?: boolean;\n  'preserve-actions-space'?: boolean;\n  checkmark?: boolean;\n  disabled?: boolean;\n  selected?: boolean;\n  loading?: boolean;\n  size?: string;\n  description?: string;\n  type?: string;\n  theme?: string;\n  shape?: string;\n}>;\n\nexport interface CubeItemProps extends BaseProps, ContainerStyleProps {\n  icon?: DynamicIcon<ItemMods> | 'checkmark';\n  rightIcon?: DynamicIcon<ItemMods>;\n  prefix?: ReactNode;\n  suffix?: ReactNode;\n  description?: ReactNode;\n  descriptionPlacement?: 'inline' | 'block';\n  /**\n   * When true, the item is rendered inside a wrapper element to separate the actions from the item.\n   * @default false\n   */\n  insideWrapper?: boolean;\n  /**\n   * Whether the item is selected.\n   * @default false\n   */\n  isSelected?: boolean;\n  /**\n   * Actions to render inline or placeholder mode for ItemButton wrapper.\n   * - ReactNode: renders actions inline as part of the grid layout\n   * - true: placeholder mode for ItemButton (enables --actions-width calculation)\n   */\n  actions?: ReactNode | true;\n  /**\n   * When true, actions are hidden by default and shown only on hover, focus, or focus-within.\n   * Uses opacity transition for visual hiding while maintaining layout space.\n   */\n  autoHideActions?: boolean;\n  /**\n   * When true and insideWrapper is true, this controls the visibility of the actions.\n   * @default false\n   */\n  showActions?: boolean;\n  /**\n   * When true, preserves the actions width when hidden (only changes opacity).\n   * Only applies when autoHideActions is true.\n   * @default false\n   */\n  preserveActionsSpace?: boolean;\n  /**\n   * When true, disables focus on action buttons by setting tabIndex={-1}.\n   * @default true\n   */\n  disableActionsFocus?: boolean;\n  size?:\n    | 'xsmall'\n    | 'small'\n    | 'medium'\n    | 'large'\n    | 'xlarge'\n    | 'inline'\n    | number\n    | (string & {});\n  type?:\n    | 'item'\n    | 'header'\n    | 'primary'\n    | 'outline'\n    | 'outline-2'\n    | 'clear'\n    | 'link'\n    | 'card'\n    | (string & {});\n  theme?:\n    | 'default'\n    | 'danger'\n    | 'success'\n    | 'special'\n    | 'warning'\n    | 'note'\n    | 'current'\n    | (string & {});\n  /** Keyboard shortcut that triggers the element when pressed */\n  hotkeys?: string;\n  /**\n   * Tooltip content and configuration:\n   * - string: simple tooltip text\n   * - true: auto tooltip on overflow (shows children as tooltip when truncated)\n   * - object: advanced configuration with optional auto property\n   */\n  tooltip?:\n    | string\n    | boolean\n    | (Omit<CubeTooltipProviderProps, 'children'> & { auto?: boolean });\n  /**\n   * HTML button type to avoid implicit form submission when used as `as=\"button\"`.\n   * Kept separate from visual `type` prop.\n   */\n  htmlType?: 'button' | 'submit' | 'reset';\n  labelProps?: Props;\n  descriptionProps?: Props;\n  keyboardShortcutProps?: Props;\n  /**\n   * The slot which the loading icon should replace in loading state.\n   * - \"auto\": Smart selection - prefers icon if present, then rightIcon, fallback to icon\n   * - Specific slot names: Always use that slot\n   * @default \"auto\"\n   */\n  loadingSlot?: 'auto' | 'icon' | 'rightIcon' | 'prefix' | 'suffix';\n  /**\n   * When true, shows loading state by replacing the specified slot with LoadingIcon\n   * and makes the component disabled.\n   */\n  isLoading?: boolean;\n  /**\n   * Shape of the item's border radius.\n   * - `card` - Card shape with larger border radius (`1cr`)\n   * - `button` - Button shape with default border radius (default)\n   * - `sharp` - Sharp corners with no border radius (`0`)\n   * - `pill` - Pill shape with fully rounded ends (`round`)\n   * @default \"button\"\n   */\n  shape?: 'card' | 'button' | 'sharp' | 'pill';\n  /**\n   * @private\n   * Default tooltip placement for the item.\n   * @default \"top\"\n   */\n  defaultTooltipPlacement?: OverlayProps['placement'];\n  /**\n   * @private\n   * The native `disabled` attribute, which `useAction` forwards through\n   * `ItemButton`. Treated as an alias of `isDisabled` so that the item stays\n   * the only place deciding how the disabled state reaches the DOM.\n   */\n  disabled?: boolean;\n  /**\n   * Ref to access the label element directly\n   */\n  labelRef?: RefObject<HTMLElement>;\n  /**\n   * Heading level for the Label element when type=\"header\" or type=\"card\".\n   * Changes the Label's HTML tag to the corresponding heading (h1-h6).\n   * @default 3\n   */\n  level?: 1 | 2 | 3 | 4 | 5 | 6;\n  /**\n   * String to highlight within children.\n   * Only works when children is a plain string.\n   */\n  highlight?: string;\n  /**\n   * Whether highlight matching is case-sensitive.\n   * @default false\n   */\n  highlightCaseSensitive?: boolean;\n  /**\n   * Custom styles for highlighted text.\n   */\n  highlightStyles?: Styles;\n  /**\n   * Variant of the item.\n   */\n  variant?: ItemVariant;\n}\n\nconst DEFAULT_ICON_STYLES: Styles = {\n  $: '>',\n  display: 'grid',\n  placeItems: 'center',\n  placeContent: 'stretch',\n  aspectRatio: '1 / 1',\n  width: '($size - 2bw)',\n  opacity: {\n    '': 1,\n    'checkmark & selected': 1,\n    'checkmark & !selected': 0,\n    'checkmark & !selected & hovered': 0.4,\n  },\n};\n\nconst ADDITION_STYLES: Styles = {\n  $: '>',\n  display: 'grid',\n  flow: 'column',\n  placeItems: 'center',\n  placeContent: 'stretch',\n};\n\nconst ACTIONS_EVENT_HANDLERS = {\n  onClick: (e: MouseEvent) => e.stopPropagation(),\n  onPointerDown: (e: PointerEvent) => e.stopPropagation(),\n  onPointerUp: (e: PointerEvent) => e.stopPropagation(),\n  onMouseDown: (e: MouseEvent) => e.stopPropagation(),\n  onMouseUp: (e: MouseEvent) => e.stopPropagation(),\n  onKeyDown: (e: KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.stopPropagation();\n    }\n  },\n};\n\nconst ItemElement = tasty({\n  as: 'div',\n  styles: {\n    '@interacted':\n      'active | :hover | :focus | :focus-within | :has([data-pressed])',\n\n    display: 'inline-grid',\n    flow: 'column dense',\n    gap: 0,\n    outline: 0,\n    placeItems: 'stretch',\n    placeContent: 'stretch',\n    gridTemplate: {\n      '': '\"icon prefix label suffix rightIcon actions\" auto \"icon prefix label suffix rightIcon actions\" auto / max-content max-content 1sf max-content max-content max-content',\n      'description=inline':\n        '\"icon prefix description suffix rightIcon actions\" auto / max-content max-content 1sf max-content max-content max-content',\n      'description=inline & has-label':\n        '\"icon prefix label suffix rightIcon actions\" auto \"icon prefix description suffix rightIcon actions\" auto / max-content max-content 1sf max-content max-content max-content',\n      'description=block':\n        '\"icon prefix label suffix rightIcon actions\" auto \"description description description description description description\" auto / max-content max-content 1sf max-content max-content max-content',\n    },\n    // Prevent items from shrinking inside vertical flex layouts (Menu, ListBox, etc)\n    flexShrink: {\n      '': 'initial',\n      'menuitem | listboxitem': 0,\n    },\n    position: 'relative',\n    padding: {\n      '': 0,\n      'type=card': '.5x',\n    },\n    margin: 0,\n    radius: {\n      '': true,\n      'shape=card': '1cr',\n      'shape=button': true,\n      'shape=sharp': '0',\n      'shape=pill': 'round',\n    },\n    height: {\n      '': 'min $size',\n      'size=inline': '(1lh + 2bw)',\n    },\n    width: {\n      '': 'min $size',\n      'has-icon & has-right-icon': 'min ($size * 2)',\n      'size=inline': 'min (1lh + 2bw)',\n    },\n    border: '#clear',\n    fill: {\n      '': '#dark.0',\n      'hovered | focused': '#dark.03',\n      selected: '#dark.09',\n      'selected & (hovered | focused)': '#dark.12',\n      pressed: '#dark.09',\n      disabled: '#clear',\n    },\n    color: {\n      '': '#dark-02',\n      hovered: '#dark-02',\n      pressed: '#dark',\n      disabled: '#disabled-surface-text',\n    },\n    preset: {\n      '': 't3',\n      '!type=item': 't3m',\n      'size=xsmall': 't4',\n      'size=xlarge': 't2',\n      'size=inline': 'inherit',\n      '!type=item & (size=medium | size=small | size=large)': 't3m',\n      '!type=item & size=xlarge': 't2m',\n      '(type=header | type=card) & (size=xsmall | size=small | size=medium)':\n        'h6',\n      '(type=header | type=card) & size=large': 'h5',\n      '(type=header | type=card) & size=xlarge': 'h4',\n    },\n    recipe: 'reset button',\n    transition: 'theme',\n    outlineOffset: 1,\n    cursor: {\n      '': 'inherit',\n      ':is(a)': 'pointer',\n      ':is(button) | listboxitem | menuitem': '$pointer',\n      disabled: 'not-allowed',\n    },\n\n    $size: {\n      '': '$size-md',\n      'size=xsmall': '$size-xs',\n      'size=small': '$size-sm',\n      'size=medium': '$size-md',\n      'size=large': '$size-lg',\n      'size=xlarge': '$size-xl',\n      'size=inline': '(1lh + 2bw)',\n    },\n    '$inline-padding':\n      'max($min-inline-padding, (($size - 1lh - 2bw) / 2 + $inline-compensation))',\n    '$block-padding': {\n      '': '.5x',\n      'size=xsmall | size=small': '.25x',\n      'size=inline': 0,\n    },\n    '$inline-compensation': '.5x',\n    '$min-inline-padding': '(1x - 1bw)',\n\n    '$label-padding-left': {\n      '': '$inline-padding',\n      'has-start-content': '0',\n    },\n    '$label-padding-right': {\n      '': '$inline-padding',\n      'has-end-content': '0',\n      // Restore padding when actions are hidden AND no other visible end content\n      '!inside-wrapper & !has-suffix & !has-right-icon & auto-hide-actions & !preserve-actions-space & !@interacted':\n        '$inline-padding',\n      'inside-wrapper & !has-suffix & !has-right-icon & !preserve-actions-space & !actions-shown':\n        '$inline-padding',\n    },\n    '$label-padding-bottom': {\n      '': '$block-padding',\n      'description=inline': '0',\n    },\n    '$description-padding-left': {\n      '': '$inline-padding',\n      'has-start-content': 0,\n      'description=block': '($inline-padding - $inline-compensation + 1bw)',\n      'description=block & !has-start-content': '$inline-padding',\n    },\n    '$description-padding-right': {\n      '': '$inline-padding',\n      'has-end-content': 0,\n      'description=block': '($inline-padding - $inline-compensation + 1bw)',\n      'description=block & !has-end-content': '$inline-padding',\n    },\n    '$description-padding-bottom': {\n      '': 0,\n      'has-label & description=inline': '$block-padding',\n      'has-label & description=block':\n        'max($block-padding, (($size - 4x) / 2) + $block-padding)',\n    },\n\n    Icon: { ...DEFAULT_ICON_STYLES, gridArea: 'icon' },\n\n    RightIcon: { ...DEFAULT_ICON_STYLES, gridArea: 'rightIcon' },\n\n    Label: {\n      $: '>',\n      margin: 0,\n      gridArea: 'label',\n      display: 'block',\n      placeSelf: 'center start',\n      boxSizing: 'border-box',\n      placeContent: 'stretch',\n      whiteSpace: 'nowrap',\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n      width: '0 100%',\n      preset: 'inherit',\n      transition: 'padding',\n      padding:\n        '$block-padding $label-padding-right $label-padding-bottom $label-padding-left',\n    },\n\n    Description: {\n      $: '>',\n      gridArea: 'description',\n      preset: {\n        '': 't4',\n        'type=card | type=header': 't3',\n      },\n      placeSelf: 'center start',\n      boxSizing: 'border-box',\n      color: 'inherit',\n      opacity: {\n        '': 0.75,\n        'type=card | type=header': 1,\n      },\n      overflow: 'hidden',\n      whiteSpace: {\n        '': 'nowrap',\n        'type=card | type=header': 'normal',\n      },\n      textOverflow: 'ellipsis',\n      width: 'initial 100% 100%',\n      textAlign: 'left',\n      padding:\n        '0 $description-padding-right $description-padding-bottom $description-padding-left',\n    },\n\n    Prefix: {\n      ...ADDITION_STYLES,\n      gridArea: 'prefix',\n      padding: {\n        '': '$inline-padding left',\n        'has-icon': 0,\n      },\n    },\n\n    Suffix: {\n      ...ADDITION_STYLES,\n      gridArea: 'suffix',\n      padding: {\n        '': '$inline-padding right',\n        'has-right-icon': 0,\n      },\n    },\n\n    Actions: {\n      $: '>',\n      gridArea: 'actions',\n      display: 'flex',\n      gap: '1bw',\n      placeItems: 'center',\n      placeContent: 'end',\n      placeSelf: 'stretch',\n      padding: {\n        '': '0 $side-padding',\n        'inside-wrapper & !actions-shown': 0,\n      },\n      boxSizing: 'border-box',\n      height: 'min ($size - 2bw)',\n      width: {\n        '': 'fixed ($actions-width, 0px)',\n        'has-actions-content & !auto-hide-actions':\n          'max calc-size(max-content, size)',\n        'has-actions-content & auto-hide-actions & !preserve-actions-space':\n          'max 0px',\n        'has-actions-content & auto-hide-actions & (!preserve-actions-space & ((@interacted & !inside-wrapper) | (inside-wrapper & actions-shown)))':\n          'max calc-size(max-content, size)',\n        'has-actions-content & auto-hide-actions & preserve-actions-space':\n          'max calc-size(max-content, size)',\n      },\n      opacity: {\n        '': 1,\n        'auto-hide-actions': 0,\n        'auto-hide-actions & ((@interacted & !inside-wrapper) | (inside-wrapper & actions-shown))': 1,\n      },\n      transition:\n        'width $transition ease-out, opacity $transition ease-out, padding $transition ease-out',\n      interpolateSize: 'allow-keywords',\n\n      // Size for the action buttons\n      '$action-size': 'min(max((2x + 2bw), ($size - 1x - 2bw)), (3x - 2bw))',\n      // Side padding for the button\n      '$side-padding': '(($size - $action-size - 2bw) / 2)',\n    },\n  },\n  variants: ITEM_VARIANTS,\n  styleProps: CONTAINER_STYLES,\n});\n\nconst Item = <T extends HTMLElement = HTMLDivElement>(\n  props: CubeItemProps,\n  ref: ForwardedRef<T>,\n) => {\n  let {\n    children,\n    size = 'medium',\n    type = 'item',\n    theme = 'default',\n    mods,\n    icon: iconProp,\n    rightIcon: rightIconProp,\n    prefix,\n    suffix,\n    description,\n    descriptionPlacement,\n    labelProps,\n    descriptionProps,\n    keyboardShortcutProps,\n    styles,\n    htmlType,\n    isSelected,\n    hotkeys,\n    tooltip = true,\n    isDisabled,\n    // `useAction` (through `ItemButton`) hands the native attribute down as\n    // well. Fold it into the disabled state so this component stays the only\n    // place deciding how that state reaches the DOM.\n    disabled: nativeDisabledProp,\n    style,\n    loadingSlot = 'auto',\n    isLoading = false,\n    actions,\n    autoHideActions = false,\n    preserveActionsSpace = false,\n    disableActionsFocus = false,\n    shape,\n    defaultTooltipPlacement = 'top',\n    level = 3,\n    highlight,\n    highlightCaseSensitive = false,\n    highlightStyles,\n    insideWrapper = false,\n    showActions = false,\n    tokens,\n    ...rest\n  } = props;\n\n  // Determine if Label will be rendered\n  const hasLabel = !!(children || labelProps);\n\n  // Set default descriptionPlacement based on type\n  // For card/header types, use 'block' only when Label is rendered\n  const finalDescriptionPlacement =\n    descriptionPlacement ??\n    ((type === 'card' || type === 'header') && hasLabel ? 'block' : 'inline');\n\n  // Set default shape based on type\n  const finalShape = shape ?? (type === 'card' ? 'card' : 'button');\n\n  const isDisabledProp = isDisabled ?? (nativeDisabledProp || undefined);\n\n  // Loading state makes the component disabled\n  const finalIsDisabled =\n    isDisabledProp === true || (isLoading && isDisabledProp !== false);\n\n  // Validate type+theme combinations. `current` is a theme like any other here:\n  // it has a flavour for every type, so it is listed wherever `default` is.\n  const STANDARD_THEMES = [\n    'default',\n    'success',\n    'danger',\n    'warning',\n    'note',\n    'special',\n    'current',\n  ];\n  const CARD_THEMES = [\n    'default',\n    'success',\n    'danger',\n    'warning',\n    'note',\n    'current',\n  ];\n  const HEADER_THEMES = ['default'];\n\n  const isInvalidCombination =\n    (type === 'header' && !HEADER_THEMES.includes(theme)) ||\n    (type === 'card' && !CARD_THEMES.includes(theme)) ||\n    (!['header', 'card'].includes(type) && !STANDARD_THEMES.includes(theme));\n\n  useWarn(isInvalidCombination, {\n    key: ['Item', 'invalid-type-theme', type, theme],\n    args: [\n      `Item: Invalid type+theme combination. type=\"${type}\" does not support theme=\"${theme}\".` +\n        (type === 'header'\n          ? ' The \"header\" type only supports theme: default.'\n          : type === 'card'\n            ? ' The \"card\" type only supports themes: default, success, danger, warning, note, current.'\n            : ' Standard types support themes: default, success, danger, warning, note, special, current.'),\n    ],\n  });\n\n  // Warn if link type is used with icons or loading state\n  const hasLinkWithIcons = type === 'link' && (iconProp || rightIconProp);\n  const hasLinkWithLoading = type === 'link' && isLoading;\n  const hasLinkRestrictions = hasLinkWithIcons || hasLinkWithLoading;\n\n  const linkRestrictionMessages: string[] = [];\n  if (hasLinkWithIcons) {\n    linkRestrictionMessages.push('icons (`icon` or `rightIcon` props)');\n  }\n  if (hasLinkWithLoading) {\n    linkRestrictionMessages.push('loading state (`isLoading` prop)');\n  }\n\n  useWarn(hasLinkRestrictions, {\n    key: ['Item', 'link-restrictions'],\n    args: [\n      `Item: The \"link\" type does not support ${linkRestrictionMessages.join(' or ')}. Remove these props when using type=\"link\".`,\n    ],\n  });\n\n  // Determine if we should show a checkmark instead of icon\n  const hasCheckmark = iconProp === 'checkmark';\n\n  // Determine if size is custom (number or unrecognized string)\n  const isCustomSize =\n    typeof size === 'number' ||\n    !(ITEM_SIZE_VALUES as readonly string[]).includes(size);\n  const sizeTokenValue =\n    typeof size === 'number' ? `${size}px` : isCustomSize ? size : undefined;\n\n  // Base mods for icon resolution (without icon-dependent mods)\n  const baseMods = useMemo<ItemMods>(\n    () => ({\n      disabled: finalIsDisabled,\n      selected: isSelected === true,\n      loading: isLoading,\n      ...(!isCustomSize && { size: size as string }),\n      type,\n      theme,\n      shape: finalShape,\n      ...mods,\n    }),\n    [\n      finalIsDisabled,\n      isSelected,\n      isLoading,\n      size,\n      isCustomSize,\n      type,\n      theme,\n      finalShape,\n      mods,\n    ],\n  );\n\n  // Resolve dynamic icon props (skip resolution for 'checkmark' special value)\n  const resolvedIcon = useMemo(() => {\n    if (hasCheckmark) {\n      return { content: null, hasSlot: true };\n    }\n    return resolveIcon(iconProp as DynamicIcon<ItemMods>, baseMods);\n  }, [iconProp, baseMods, hasCheckmark]);\n\n  const resolvedRightIcon = useMemo(\n    () => resolveIcon(rightIconProp, baseMods),\n    [rightIconProp, baseMods],\n  );\n\n  // Determine which slot to use for loading when \"auto\" is selected\n  // Must be computed before hasIconSlot/hasRightIconSlot since they depend on it\n  const resolvedLoadingSlot = useMemo(() => {\n    if (loadingSlot !== 'auto') return loadingSlot;\n\n    // Auto logic: prefer icon if present, then rightIcon, fallback to icon\n    if (resolvedRightIcon.hasSlot && !resolvedIcon.hasSlot) return 'rightIcon';\n    return 'icon'; // fallback\n  }, [loadingSlot, resolvedIcon.hasSlot, resolvedRightIcon.hasSlot]);\n\n  // Determine if icon slots should render (original slot OR loading state targets this slot)\n  const hasIconSlot =\n    resolvedIcon.hasSlot || (isLoading && resolvedLoadingSlot === 'icon');\n  const hasRightIconSlot =\n    resolvedRightIcon.hasSlot ||\n    (isLoading && resolvedLoadingSlot === 'rightIcon');\n\n  const showDescription = useMemo(() => {\n    const copyProps = { ...descriptionProps };\n    delete copyProps.id;\n    return !!(description || Object.keys(copyProps).length > 0);\n  }, [description, descriptionProps]);\n\n  // Apply loading state to appropriate slots\n  const finalIcon =\n    isLoading && resolvedLoadingSlot === 'icon' ? (\n      <LoadingIcon />\n    ) : (\n      resolvedIcon.content\n    );\n  const finalRightIcon =\n    isLoading && resolvedLoadingSlot === 'rightIcon' ? (\n      <LoadingIcon />\n    ) : (\n      resolvedRightIcon.content\n    );\n\n  // Generate stable keys for icon transitions based on icon type\n  const iconKey = hasCheckmark\n    ? 'checkmark'\n    : isLoading && resolvedLoadingSlot === 'icon'\n      ? 'loading'\n      : isValidElement(finalIcon)\n        ? (finalIcon.type as any)?.displayName ||\n          (finalIcon.type as any)?.name ||\n          'icon'\n        : finalIcon\n          ? 'icon'\n          : 'empty';\n\n  const rightIconKey =\n    isLoading && resolvedLoadingSlot === 'rightIcon'\n      ? 'loading'\n      : isValidElement(finalRightIcon)\n        ? (finalRightIcon.type as any)?.displayName ||\n          (finalRightIcon.type as any)?.name ||\n          'icon'\n        : finalRightIcon\n          ? 'icon'\n          : 'empty';\n  const finalPrefix =\n    isLoading && resolvedLoadingSlot === 'prefix' ? <LoadingIcon /> : prefix;\n\n  // Which HotKeys flavour the shortcut hint wears. `inherit` paints the hint's\n  // glyphs and rim from `currentcolor`, so it tracks whatever the row labels\n  // itself with; `primary` pins the hint to `#white`; `default` is a neutral\n  // `#dark.65` chip built for a page-colored row.\n  //\n  // The whole `current` theme wants `inherit`: every flavour there derives its\n  // label from the inherited color, and a fixed hint cannot follow that. The\n  // neutral `#dark.65`-on-`#dark.04` chip all but vanishes on a dark overlay,\n  // which is exactly where this theme is meant to be used.\n  //\n  // `current.primary` is included despite painting its label with\n  // `-webkit-text-fill-color` rather than `color`. The hint renders inside the\n  // `Suffix` slot, and `CURRENT_PRIMARY_STYLES` recolors that slot to the label\n  // color — so `currentcolor` there is the LABEL, not the fill. An earlier\n  // version of this comment claimed the opposite and sent it to `primary`, which\n  // put a `#white` hint on a light fill (measured cr 2.17 on a `#note` container\n  // in dark mode).\n  const hotkeysType =\n    theme === 'current'\n      ? 'inherit'\n      : type === 'primary'\n        ? 'primary'\n        : 'default';\n\n  // Build final suffix: loading icon, custom suffix, or HotKeys hint\n  const finalSuffix =\n    isLoading && resolvedLoadingSlot === 'suffix' ? (\n      <LoadingIcon />\n    ) : (\n      suffix ??\n      (hotkeys ? (\n        <HotKeys\n          {...(keyboardShortcutProps as any)}\n          type={hotkeysType}\n          styles={{ padding: '1x left', opacity: finalIsDisabled ? 0.5 : 1 }}\n        >\n          {hotkeys}\n        </HotKeys>\n      ) : undefined)\n    );\n\n  // Register global hotkey if provided\n  useHotkeys(\n    typeof hotkeys === 'string' ? hotkeys.toLowerCase() : '',\n    () => {\n      if (!hotkeys) return;\n      if (finalIsDisabled) return;\n      // Simulate a click on the element so all existing handlers run\n      if (ref && typeof ref === 'object' && ref.current) {\n        (ref.current as HTMLElement).click();\n      }\n    },\n    {\n      enableOnContentEditable: true,\n      enabled: !!hotkeys,\n      preventDefault: true,\n      enableOnFormTags: true,\n    },\n    [hotkeys, finalIsDisabled],\n  );\n\n  const finalMods = useMemo<ItemMods>(() => {\n    return {\n      ...baseMods,\n      'has-icon': hasIconSlot,\n      'has-start-content': !!(hasIconSlot || finalPrefix),\n      'has-end-content': !!(hasRightIconSlot || finalSuffix || actions),\n      'has-right-icon': hasRightIconSlot,\n      'has-label': hasLabel,\n      'has-prefix': !!finalPrefix,\n      'has-suffix': !!finalSuffix,\n      'has-description': showDescription,\n      'has-actions': !!actions,\n      'has-actions-content': !!(actions && actions !== true),\n      'auto-hide-actions': autoHideActions === true,\n      'preserve-actions-space': preserveActionsSpace === true,\n      'inside-wrapper': insideWrapper,\n      'actions-shown': showActions && insideWrapper,\n      checkmark: hasCheckmark,\n      description: showDescription ? finalDescriptionPlacement : 'none',\n    };\n  }, [\n    baseMods,\n    hasIconSlot,\n    hasRightIconSlot,\n    finalPrefix,\n    finalSuffix,\n    showDescription,\n    finalDescriptionPlacement,\n    hasCheckmark,\n    actions,\n    autoHideActions,\n    preserveActionsSpace,\n    hasLabel,\n    showActions,\n    insideWrapper,\n  ]);\n\n  const {\n    labelProps: finalLabelProps,\n    labelRef,\n    renderWithTooltip,\n    isTooltipActive,\n  } = useAutoTooltip({\n    tooltip,\n    children,\n    labelProps,\n    isDynamicLabel: !!actions,\n  });\n\n  // A disabled item still has to be able to show its tooltip — that is usually\n  // where the reason for being unavailable is written. The native `disabled`\n  // attribute would make the browser drop the hover that opens it, so when a\n  // tooltip is present the item is marked `aria-disabled` and kept inert\n  // instead.\n  const { isNativelyDisabled, isInert, inertProps } = getDisabledElementProps({\n    isDisabled: finalIsDisabled,\n    keepEvents: isTooltipActive,\n    as: (rest as { as?: string }).as,\n  });\n\n  // Process children with highlight if applicable\n  const processedChildren = useMemo(() => {\n    if (typeof children === 'string' && highlight) {\n      return highlightText(\n        children,\n        highlight,\n        highlightCaseSensitive,\n        highlightStyles,\n      );\n    }\n    return children;\n  }, [children, highlight, highlightCaseSensitive, highlightStyles]);\n\n  // Process description with highlight if applicable\n  const processedDescription = useMemo(() => {\n    if (typeof description === 'string' && highlight) {\n      return highlightText(\n        description,\n        highlight,\n        highlightCaseSensitive,\n        highlightStyles,\n      );\n    }\n    return description;\n  }, [description, highlight, highlightCaseSensitive, highlightStyles]);\n\n  // Render function that creates the item element\n  const renderItemElement = (\n    tooltipTriggerProps?: HTMLAttributes<HTMLElement>,\n    tooltipRef?: RefObject<HTMLElement>,\n  ) => {\n    // Use callback ref to merge multiple refs without calling hooks\n    const handleRef = (element: HTMLElement | null) => {\n      // Set the component's forwarded ref\n      if (typeof ref === 'function') {\n        ref(element as T | null);\n      } else if (ref) {\n        (ref as any).current = element;\n      }\n      // Set the tooltip ref if provided\n      if (tooltipRef) {\n        (tooltipRef as any).current = element;\n      }\n    };\n\n    return (\n      <ItemElement\n        ref={handleRef}\n        // Shared with `ItemButton`, which repeats this lookup on the wrapper that\n        // carries the row color to actions rendered outside the row.\n        variant={theme && type ? resolveItemVariant(theme, type) : undefined}\n        disabled={isNativelyDisabled}\n        aria-disabled={finalIsDisabled}\n        aria-selected={isSelected}\n        mods={finalMods}\n        styles={styles}\n        tokens={{\n          ...tokens,\n          ...(sizeTokenValue ? { $size: sizeTokenValue } : {}),\n        }}\n        type={htmlType as any}\n        {...mergeProps(\n          isInert ? omitActivationEventProps(rest) : rest,\n          tooltipTriggerProps || {},\n          inertProps,\n        )}\n        style={style}\n      >\n        {hasIconSlot && (\n          <div data-element=\"Icon\">\n            <IconSwitch noWrapper contentKey={iconKey}>\n              {hasCheckmark ? <CheckIcon /> : finalIcon}\n            </IconSwitch>\n          </div>\n        )}\n        {finalPrefix && <div data-element=\"Prefix\">{finalPrefix}</div>}\n        {children || labelProps\n          ? (() => {\n              const LabelTag =\n                type === 'header' || type === 'card'\n                  ? (`h${level}` as const)\n                  : 'div';\n              return (\n                <LabelTag\n                  data-element=\"Label\"\n                  {...finalLabelProps}\n                  ref={labelRef}\n                >\n                  {processedChildren}\n                </LabelTag>\n              );\n            })()\n          : null}\n        {showDescription ? (\n          <div data-element=\"Description\" {...descriptionProps}>\n            {processedDescription}\n          </div>\n        ) : null}\n        {finalSuffix && <div data-element=\"Suffix\">{finalSuffix}</div>}\n        {hasRightIconSlot && (\n          <div data-element=\"RightIcon\">\n            <IconSwitch noWrapper contentKey={rightIconKey}>\n              {finalRightIcon}\n            </IconSwitch>\n          </div>\n        )}\n        {actions && (\n          <div data-element=\"Actions\" {...ACTIONS_EVENT_HANDLERS}>\n            {actions !== true ? (\n              <ItemActionProvider\n                type={type}\n                theme={theme}\n                disableActionsFocus={disableActionsFocus}\n                isDisabled={finalIsDisabled}\n              >\n                {actions}\n              </ItemActionProvider>\n            ) : null}\n          </div>\n        )}\n      </ItemElement>\n    );\n  };\n\n  return renderWithTooltip(renderItemElement, defaultTooltipPlacement);\n};\n\nconst _Item = Object.assign(forwardRef(Item), {\n  Action: ItemAction,\n  Badge: ItemBadge,\n});\n\nexport { _Item as Item };\n\n/**\n * @deprecated Use `Item` instead. This export will be removed in a future version.\n */\nexport { _Item as ItemBase };\nexport type { CubeItemProps as CubeItemBaseProps };\n"],"mappings":"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"}
+{"version":3,"file":"Item.js","names":["HotKeys"],"sources":["../../../../src/components/content/Item/Item.tsx"],"sourcesContent":["import {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Mods,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  ForwardedRef,\n  forwardRef,\n  HTMLAttributes,\n  isValidElement,\n  KeyboardEvent,\n  MouseEvent,\n  PointerEvent,\n  ReactNode,\n  RefObject,\n  useMemo,\n} from 'react';\nimport { OverlayProps } from 'react-aria';\nimport { useHotkeys } from 'react-hotkeys-hook';\n\nimport { useWarn } from '../../../_internal/hooks/use-warn';\nimport {\n  ITEM_VARIANTS,\n  ItemVariant,\n  resolveItemVariant,\n} from '../../../data/item-themes';\nimport { CheckIcon } from '../../../icons/CheckIcon';\nimport { LoadingIcon } from '../../../icons/LoadingIcon';\nimport {\n  DynamicIcon,\n  getDisabledElementProps,\n  mergeProps,\n  omitActivationEventProps,\n  resolveIcon,\n} from '../../../utils/react';\nimport { ItemAction } from '../../actions/ItemAction';\nimport { ItemActionProvider } from '../../actions/ItemActionContext';\nimport { IconSwitch } from '../../helpers/IconSwitch/IconSwitch';\nimport { CubeTooltipProviderProps } from '../../overlays/Tooltip/TooltipProvider';\nimport { highlightText } from '../highlightText';\nimport { HotKeys } from '../HotKeys/HotKeys';\nimport { ItemBadge } from '../ItemBadge';\nimport { useAutoTooltip } from '../use-auto-tooltip';\n\nimport type { Props } from '../../../props';\n\nconst ITEM_SIZE_VALUES = [\n  'xsmall',\n  'small',\n  'medium',\n  'large',\n  'xlarge',\n  'inline',\n] as const;\n\n/** Known modifiers for Item component */\nexport type ItemMods = Mods<{\n  'has-icon'?: boolean;\n  'has-start-content'?: boolean;\n  'has-end-content'?: boolean;\n  'has-right-icon'?: boolean;\n  'has-label'?: boolean;\n  'has-prefix'?: boolean;\n  'has-suffix'?: boolean;\n  'has-description'?: boolean;\n  'has-actions'?: boolean;\n  'has-actions-content'?: boolean;\n  'auto-hide-actions'?: boolean;\n  'preserve-actions-space'?: boolean;\n  checkmark?: boolean;\n  disabled?: boolean;\n  selected?: boolean;\n  loading?: boolean;\n  size?: string;\n  description?: string;\n  type?: string;\n  theme?: string;\n  shape?: string;\n}>;\n\nexport interface CubeItemProps extends BaseProps, ContainerStyleProps {\n  icon?: DynamicIcon<ItemMods> | 'checkmark';\n  rightIcon?: DynamicIcon<ItemMods>;\n  prefix?: ReactNode;\n  suffix?: ReactNode;\n  description?: ReactNode;\n  descriptionPlacement?: 'inline' | 'block';\n  /**\n   * When true, the item is rendered inside a wrapper element to separate the actions from the item.\n   * @default false\n   */\n  insideWrapper?: boolean;\n  /**\n   * Whether the item is selected.\n   * @default false\n   */\n  isSelected?: boolean;\n  /**\n   * Actions to render inline or placeholder mode for ItemButton wrapper.\n   * - ReactNode: renders actions inline as part of the grid layout\n   * - true: placeholder mode for ItemButton (enables --actions-width calculation)\n   */\n  actions?: ReactNode | true;\n  /**\n   * When true, actions are hidden by default and shown only on hover, focus, or focus-within.\n   * Uses opacity transition for visual hiding while maintaining layout space.\n   */\n  autoHideActions?: boolean;\n  /**\n   * When true and insideWrapper is true, this controls the visibility of the actions.\n   * @default false\n   */\n  showActions?: boolean;\n  /**\n   * When true, preserves the actions width when hidden (only changes opacity).\n   * Only applies when autoHideActions is true.\n   * @default false\n   */\n  preserveActionsSpace?: boolean;\n  /**\n   * When true, disables focus on action buttons by setting tabIndex={-1}.\n   * @default true\n   */\n  disableActionsFocus?: boolean;\n  size?:\n    | 'xsmall'\n    | 'small'\n    | 'medium'\n    | 'large'\n    | 'xlarge'\n    | 'inline'\n    | number\n    | (string & {});\n  type?:\n    | 'item'\n    | 'header'\n    | 'primary'\n    | 'outline'\n    | 'outline-2'\n    | 'clear'\n    | 'link'\n    | 'card'\n    | (string & {});\n  theme?:\n    | 'default'\n    | 'danger'\n    | 'success'\n    | 'special'\n    | 'warning'\n    | 'note'\n    | 'current'\n    | (string & {});\n  /** Keyboard shortcut that triggers the element when pressed */\n  hotkeys?: string;\n  /**\n   * Tooltip content and configuration:\n   * - string: simple tooltip text\n   * - true: auto tooltip on overflow (shows children as tooltip when truncated)\n   * - object: advanced configuration with optional auto property\n   */\n  tooltip?:\n    | string\n    | boolean\n    | (Omit<CubeTooltipProviderProps, 'children'> & { auto?: boolean });\n  /**\n   * HTML button type to avoid implicit form submission when used as `as=\"button\"`.\n   * Kept separate from visual `type` prop.\n   */\n  htmlType?: 'button' | 'submit' | 'reset';\n  labelProps?: Props;\n  descriptionProps?: Props;\n  keyboardShortcutProps?: Props;\n  /**\n   * The slot which the loading icon should replace in loading state.\n   * - \"auto\": Smart selection - prefers icon if present, then rightIcon, fallback to icon\n   * - Specific slot names: Always use that slot\n   * @default \"auto\"\n   */\n  loadingSlot?: 'auto' | 'icon' | 'rightIcon' | 'prefix' | 'suffix';\n  /**\n   * When true, shows loading state by replacing the specified slot with LoadingIcon\n   * and makes the component disabled.\n   */\n  isLoading?: boolean;\n  /**\n   * Shape of the item's border radius.\n   * - `card` - Card shape with larger border radius (`1cr`)\n   * - `button` - Button shape with default border radius (default)\n   * - `sharp` - Sharp corners with no border radius (`0`)\n   * - `pill` - Pill shape with fully rounded ends (`round`)\n   * @default \"button\"\n   */\n  shape?: 'card' | 'button' | 'sharp' | 'pill';\n  /**\n   * @private\n   * Default tooltip placement for the item.\n   * @default \"top\"\n   */\n  defaultTooltipPlacement?: OverlayProps['placement'];\n  /**\n   * @private\n   * The native `disabled` attribute, which `useAction` forwards through\n   * `ItemButton`. Treated as an alias of `isDisabled` so that the item stays\n   * the only place deciding how the disabled state reaches the DOM.\n   */\n  disabled?: boolean;\n  /**\n   * Ref to access the label element directly\n   */\n  labelRef?: RefObject<HTMLElement>;\n  /**\n   * Heading level for the Label element when type=\"header\" or type=\"card\".\n   * Changes the Label's HTML tag to the corresponding heading (h1-h6).\n   * @default 3\n   */\n  level?: 1 | 2 | 3 | 4 | 5 | 6;\n  /**\n   * String to highlight within children.\n   * Only works when children is a plain string.\n   */\n  highlight?: string;\n  /**\n   * Whether highlight matching is case-sensitive.\n   * @default false\n   */\n  highlightCaseSensitive?: boolean;\n  /**\n   * Custom styles for highlighted text.\n   */\n  highlightStyles?: Styles;\n  /**\n   * Variant of the item.\n   */\n  variant?: ItemVariant;\n}\n\nconst DEFAULT_ICON_STYLES: Styles = {\n  $: '>',\n  display: 'grid',\n  placeItems: 'center',\n  placeContent: 'stretch',\n  aspectRatio: '1 / 1',\n  width: '($size - 2bw)',\n  opacity: {\n    '': 1,\n    'checkmark & selected': 1,\n    'checkmark & !selected': 0,\n    'checkmark & !selected & hovered': 0.4,\n  },\n};\n\nconst ADDITION_STYLES: Styles = {\n  $: '>',\n  display: 'grid',\n  flow: 'column',\n  placeItems: 'center',\n  placeContent: 'stretch',\n};\n\nconst ACTIONS_EVENT_HANDLERS = {\n  onClick: (e: MouseEvent) => e.stopPropagation(),\n  onPointerDown: (e: PointerEvent) => e.stopPropagation(),\n  onPointerUp: (e: PointerEvent) => e.stopPropagation(),\n  onMouseDown: (e: MouseEvent) => e.stopPropagation(),\n  onMouseUp: (e: MouseEvent) => e.stopPropagation(),\n  onKeyDown: (e: KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.stopPropagation();\n    }\n  },\n};\n\nconst ItemElement = tasty({\n  as: 'div',\n  styles: {\n    '@interacted':\n      'active | :hover | :focus | :focus-within | :has([data-pressed])',\n\n    display: 'inline-grid',\n    flow: 'column dense',\n    gap: 0,\n    outline: 0,\n    placeItems: 'stretch',\n    placeContent: 'stretch',\n    gridTemplate: {\n      '': '\"icon prefix label suffix rightIcon actions\" auto \"icon prefix label suffix rightIcon actions\" auto / max-content max-content 1sf max-content max-content max-content',\n      'description=inline':\n        '\"icon prefix description suffix rightIcon actions\" auto / max-content max-content 1sf max-content max-content max-content',\n      'description=inline & has-label':\n        '\"icon prefix label suffix rightIcon actions\" auto \"icon prefix description suffix rightIcon actions\" auto / max-content max-content 1sf max-content max-content max-content',\n      'description=block':\n        '\"icon prefix label suffix rightIcon actions\" auto \"description description description description description description\" auto / max-content max-content 1sf max-content max-content max-content',\n    },\n    // Prevent items from shrinking inside vertical flex layouts (Menu, ListBox, etc)\n    flexShrink: {\n      '': 'initial',\n      'menuitem | listboxitem': 0,\n    },\n    position: 'relative',\n    padding: {\n      '': 0,\n      'type=card': '.5x',\n    },\n    margin: 0,\n    radius: {\n      '': true,\n      'shape=card': '1cr',\n      'shape=button': true,\n      'shape=sharp': '0',\n      'shape=pill': 'round',\n    },\n    height: {\n      '': 'min $size',\n      'size=inline': '(1lh + 2bw)',\n    },\n    width: {\n      '': 'min $size',\n      'has-icon & has-right-icon': 'min ($size * 2)',\n      'size=inline': 'min (1lh + 2bw)',\n    },\n    border: '#clear',\n    fill: {\n      '': '#dark.0',\n      'hovered | focused': '#dark.03',\n      selected: '#dark.09',\n      'selected & (hovered | focused)': '#dark.12',\n      pressed: '#dark.09',\n      disabled: '#clear',\n    },\n    color: {\n      '': '#dark-02',\n      hovered: '#dark-02',\n      pressed: '#dark',\n      disabled: '#disabled-surface-text',\n    },\n    preset: {\n      '': 't3',\n      '!type=item': 't3m',\n      'size=xsmall': 't4',\n      'size=xlarge': 't2',\n      'size=inline': 'inherit',\n      '!type=item & (size=medium | size=small | size=large)': 't3m',\n      '!type=item & size=xlarge': 't2m',\n      '(type=header | type=card) & (size=xsmall | size=small | size=medium)':\n        'h6',\n      '(type=header | type=card) & size=large': 'h5',\n      '(type=header | type=card) & size=xlarge': 'h4',\n    },\n    recipe: 'reset button',\n    transition: 'theme',\n    outlineOffset: 1,\n    cursor: {\n      '': 'inherit',\n      ':is(a)': 'pointer',\n      ':is(button) | listboxitem | menuitem': '$pointer',\n      disabled: 'not-allowed',\n    },\n\n    $size: {\n      '': '$size-md',\n      'size=xsmall': '$size-xs',\n      'size=small': '$size-sm',\n      'size=medium': '$size-md',\n      'size=large': '$size-lg',\n      'size=xlarge': '$size-xl',\n      'size=inline': '(1lh + 2bw)',\n    },\n    '$inline-padding':\n      'max($min-inline-padding, (($size - 1lh - 2bw) / 2 + $inline-compensation))',\n    '$block-padding': {\n      '': '.5x',\n      'size=xsmall | size=small': '.25x',\n      'size=inline': 0,\n    },\n    '$inline-compensation': '.5x',\n    '$min-inline-padding': '(1x - 1bw)',\n\n    '$label-padding-left': {\n      '': '$inline-padding',\n      'has-start-content': '0',\n    },\n    '$label-padding-right': {\n      '': '$inline-padding',\n      'has-end-content': '0',\n      // Restore padding when actions are hidden AND no other visible end content\n      '!inside-wrapper & !has-suffix & !has-right-icon & auto-hide-actions & !preserve-actions-space & !@interacted':\n        '$inline-padding',\n      'inside-wrapper & !has-suffix & !has-right-icon & !preserve-actions-space & !actions-shown':\n        '$inline-padding',\n    },\n    '$label-padding-bottom': {\n      '': '$block-padding',\n      'description=inline': '0',\n    },\n    '$description-padding-left': {\n      '': '$inline-padding',\n      'has-start-content': 0,\n      'description=block': '($inline-padding - $inline-compensation + 1bw)',\n      'description=block & !has-start-content': '$inline-padding',\n    },\n    '$description-padding-right': {\n      '': '$inline-padding',\n      'has-end-content': 0,\n      'description=block': '($inline-padding - $inline-compensation + 1bw)',\n      'description=block & !has-end-content': '$inline-padding',\n    },\n    '$description-padding-bottom': {\n      '': 0,\n      'has-label & description=inline': '$block-padding',\n      'has-label & description=block':\n        'max($block-padding, (($size - 4x) / 2) + $block-padding)',\n    },\n\n    Icon: { ...DEFAULT_ICON_STYLES, gridArea: 'icon' },\n\n    RightIcon: { ...DEFAULT_ICON_STYLES, gridArea: 'rightIcon' },\n\n    Label: {\n      $: '>',\n      margin: 0,\n      gridArea: 'label',\n      display: 'block',\n      placeSelf: 'center start',\n      boxSizing: 'border-box',\n      placeContent: 'stretch',\n      whiteSpace: 'nowrap',\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n      width: '0 100%',\n      preset: 'inherit',\n      transition: 'padding',\n      padding:\n        '$block-padding $label-padding-right $label-padding-bottom $label-padding-left',\n    },\n\n    Description: {\n      $: '>',\n      gridArea: 'description',\n      preset: {\n        '': 't4',\n        'type=card | type=header': 't3',\n      },\n      placeSelf: 'center start',\n      boxSizing: 'border-box',\n      color: 'inherit',\n      opacity: {\n        '': 0.75,\n        'type=card | type=header': 1,\n      },\n      overflow: 'hidden',\n      whiteSpace: {\n        '': 'nowrap',\n        'type=card | type=header': 'normal',\n      },\n      textOverflow: 'ellipsis',\n      width: 'initial 100% 100%',\n      textAlign: 'left',\n      padding:\n        '0 $description-padding-right $description-padding-bottom $description-padding-left',\n    },\n\n    Prefix: {\n      ...ADDITION_STYLES,\n      gridArea: 'prefix',\n      padding: {\n        '': '$inline-padding left',\n        'has-icon': 0,\n      },\n    },\n\n    Suffix: {\n      ...ADDITION_STYLES,\n      gridArea: 'suffix',\n      padding: {\n        '': '$inline-padding right',\n        'has-right-icon': 0,\n      },\n    },\n\n    Actions: {\n      $: '>',\n      gridArea: 'actions',\n      display: 'flex',\n      gap: '1bw',\n      placeItems: 'center',\n      placeContent: 'end',\n      placeSelf: 'stretch',\n      padding: {\n        '': '0 $side-padding',\n        'inside-wrapper & !actions-shown': 0,\n      },\n      boxSizing: 'border-box',\n      height: 'min ($size - 2bw)',\n      width: {\n        '': 'fixed ($actions-width, 0px)',\n        'has-actions-content & !auto-hide-actions':\n          'max calc-size(max-content, size)',\n        'has-actions-content & auto-hide-actions & !preserve-actions-space':\n          'max 0px',\n        'has-actions-content & auto-hide-actions & (!preserve-actions-space & ((@interacted & !inside-wrapper) | (inside-wrapper & actions-shown)))':\n          'max calc-size(max-content, size)',\n        'has-actions-content & auto-hide-actions & preserve-actions-space':\n          'max calc-size(max-content, size)',\n      },\n      opacity: {\n        '': 1,\n        'auto-hide-actions': 0,\n        'auto-hide-actions & ((@interacted & !inside-wrapper) | (inside-wrapper & actions-shown))': 1,\n      },\n      transition:\n        'width $transition ease-out, opacity $transition ease-out, padding $transition ease-out',\n      interpolateSize: 'allow-keywords',\n\n      // Size for the action buttons\n      '$action-size': 'min(max((2x + 2bw), ($size - 1x - 2bw)), (3x - 2bw))',\n      // Side padding for the button\n      '$side-padding': '(($size - $action-size - 2bw) / 2)',\n    },\n  },\n  variants: ITEM_VARIANTS,\n  styleProps: CONTAINER_STYLES,\n});\n\nconst Item = <T extends HTMLElement = HTMLDivElement>(\n  props: CubeItemProps,\n  ref: ForwardedRef<T>,\n) => {\n  let {\n    children,\n    size = 'medium',\n    type = 'item',\n    theme = 'default',\n    mods,\n    icon: iconProp,\n    rightIcon: rightIconProp,\n    prefix,\n    suffix,\n    description,\n    descriptionPlacement,\n    labelProps,\n    descriptionProps,\n    keyboardShortcutProps,\n    styles,\n    htmlType,\n    isSelected,\n    hotkeys,\n    tooltip = true,\n    isDisabled,\n    // `useAction` (through `ItemButton`) hands the native attribute down as\n    // well. Fold it into the disabled state so this component stays the only\n    // place deciding how that state reaches the DOM.\n    disabled: nativeDisabledProp,\n    style,\n    loadingSlot = 'auto',\n    isLoading = false,\n    actions,\n    autoHideActions = false,\n    preserveActionsSpace = false,\n    disableActionsFocus = false,\n    shape,\n    defaultTooltipPlacement = 'top',\n    level = 3,\n    highlight,\n    highlightCaseSensitive = false,\n    highlightStyles,\n    insideWrapper = false,\n    showActions = false,\n    tokens,\n    ...rest\n  } = props;\n\n  // Determine if Label will be rendered\n  const hasLabel = !!(children || labelProps);\n\n  // Set default descriptionPlacement based on type\n  // For card/header types, use 'block' only when Label is rendered\n  const finalDescriptionPlacement =\n    descriptionPlacement ??\n    ((type === 'card' || type === 'header') && hasLabel ? 'block' : 'inline');\n\n  // Set default shape based on type\n  const finalShape = shape ?? (type === 'card' ? 'card' : 'button');\n\n  const isDisabledProp = isDisabled ?? (nativeDisabledProp || undefined);\n\n  // Loading state makes the component disabled\n  const finalIsDisabled =\n    isDisabledProp === true || (isLoading && isDisabledProp !== false);\n\n  // Validate type+theme combinations. `current` is a theme like any other here:\n  // it has a flavour for every type, so it is listed wherever `default` is.\n  const STANDARD_THEMES = [\n    'default',\n    'success',\n    'danger',\n    'warning',\n    'note',\n    'special',\n    'current',\n  ];\n  const CARD_THEMES = [\n    'default',\n    'success',\n    'danger',\n    'warning',\n    'note',\n    'current',\n  ];\n  const HEADER_THEMES = ['default'];\n\n  const isInvalidCombination =\n    (type === 'header' && !HEADER_THEMES.includes(theme)) ||\n    (type === 'card' && !CARD_THEMES.includes(theme)) ||\n    (!['header', 'card'].includes(type) && !STANDARD_THEMES.includes(theme));\n\n  useWarn(isInvalidCombination, {\n    key: ['Item', 'invalid-type-theme', type, theme],\n    args: [\n      `Item: Invalid type+theme combination. type=\"${type}\" does not support theme=\"${theme}\".` +\n        (type === 'header'\n          ? ' The \"header\" type only supports theme: default.'\n          : type === 'card'\n            ? ' The \"card\" type only supports themes: default, success, danger, warning, note, current.'\n            : ' Standard types support themes: default, success, danger, warning, note, special, current.'),\n    ],\n  });\n\n  // Warn if link type is used with icons or loading state\n  const hasLinkWithIcons = type === 'link' && (iconProp || rightIconProp);\n  const hasLinkWithLoading = type === 'link' && isLoading;\n  const hasLinkRestrictions = hasLinkWithIcons || hasLinkWithLoading;\n\n  const linkRestrictionMessages: string[] = [];\n  if (hasLinkWithIcons) {\n    linkRestrictionMessages.push('icons (`icon` or `rightIcon` props)');\n  }\n  if (hasLinkWithLoading) {\n    linkRestrictionMessages.push('loading state (`isLoading` prop)');\n  }\n\n  useWarn(hasLinkRestrictions, {\n    key: ['Item', 'link-restrictions'],\n    args: [\n      `Item: The \"link\" type does not support ${linkRestrictionMessages.join(' or ')}. Remove these props when using type=\"link\".`,\n    ],\n  });\n\n  // Determine if we should show a checkmark instead of icon\n  const hasCheckmark = iconProp === 'checkmark';\n\n  // Determine if size is custom (number or unrecognized string)\n  const isCustomSize =\n    typeof size === 'number' ||\n    !(ITEM_SIZE_VALUES as readonly string[]).includes(size);\n  const sizeTokenValue =\n    typeof size === 'number' ? `${size}px` : isCustomSize ? size : undefined;\n\n  // Base mods for icon resolution (without icon-dependent mods)\n  const baseMods = useMemo<ItemMods>(\n    () => ({\n      disabled: finalIsDisabled,\n      selected: isSelected === true,\n      loading: isLoading,\n      ...(!isCustomSize && { size: size as string }),\n      type,\n      theme,\n      shape: finalShape,\n      ...mods,\n    }),\n    [\n      finalIsDisabled,\n      isSelected,\n      isLoading,\n      size,\n      isCustomSize,\n      type,\n      theme,\n      finalShape,\n      mods,\n    ],\n  );\n\n  // Resolve dynamic icon props (skip resolution for 'checkmark' special value)\n  const resolvedIcon = useMemo(() => {\n    if (hasCheckmark) {\n      return { content: null, hasSlot: true };\n    }\n    return resolveIcon(iconProp as DynamicIcon<ItemMods>, baseMods);\n  }, [iconProp, baseMods, hasCheckmark]);\n\n  const resolvedRightIcon = useMemo(\n    () => resolveIcon(rightIconProp, baseMods),\n    [rightIconProp, baseMods],\n  );\n\n  // Determine which slot to use for loading when \"auto\" is selected\n  // Must be computed before hasIconSlot/hasRightIconSlot since they depend on it\n  const resolvedLoadingSlot = useMemo(() => {\n    if (loadingSlot !== 'auto') return loadingSlot;\n\n    // Auto logic: prefer icon if present, then rightIcon, fallback to icon\n    if (resolvedRightIcon.hasSlot && !resolvedIcon.hasSlot) return 'rightIcon';\n    return 'icon'; // fallback\n  }, [loadingSlot, resolvedIcon.hasSlot, resolvedRightIcon.hasSlot]);\n\n  // Determine if icon slots should render (original slot OR loading state targets this slot)\n  const hasIconSlot =\n    resolvedIcon.hasSlot || (isLoading && resolvedLoadingSlot === 'icon');\n  const hasRightIconSlot =\n    resolvedRightIcon.hasSlot ||\n    (isLoading && resolvedLoadingSlot === 'rightIcon');\n\n  const showDescription = useMemo(() => {\n    const copyProps = { ...descriptionProps };\n    delete copyProps.id;\n    return !!(description || Object.keys(copyProps).length > 0);\n  }, [description, descriptionProps]);\n\n  // Apply loading state to appropriate slots\n  const finalIcon =\n    isLoading && resolvedLoadingSlot === 'icon' ? (\n      <LoadingIcon />\n    ) : (\n      resolvedIcon.content\n    );\n  const finalRightIcon =\n    isLoading && resolvedLoadingSlot === 'rightIcon' ? (\n      <LoadingIcon />\n    ) : (\n      resolvedRightIcon.content\n    );\n\n  // Generate stable keys for icon transitions based on icon type\n  const iconKey = hasCheckmark\n    ? 'checkmark'\n    : isLoading && resolvedLoadingSlot === 'icon'\n      ? 'loading'\n      : isValidElement(finalIcon)\n        ? (finalIcon.type as any)?.displayName ||\n          (finalIcon.type as any)?.name ||\n          'icon'\n        : finalIcon\n          ? 'icon'\n          : 'empty';\n\n  const rightIconKey =\n    isLoading && resolvedLoadingSlot === 'rightIcon'\n      ? 'loading'\n      : isValidElement(finalRightIcon)\n        ? (finalRightIcon.type as any)?.displayName ||\n          (finalRightIcon.type as any)?.name ||\n          'icon'\n        : finalRightIcon\n          ? 'icon'\n          : 'empty';\n  const finalPrefix =\n    isLoading && resolvedLoadingSlot === 'prefix' ? <LoadingIcon /> : prefix;\n\n  // Which HotKeys flavour the shortcut hint wears. `inherit` paints the hint's\n  // glyphs and rim from `currentcolor`, so it tracks whatever the row labels\n  // itself with; `primary` pins the hint to `#white`; `default` is a neutral\n  // `#dark.65` chip built for a page-colored row.\n  //\n  // The whole `current` theme wants `inherit`: every flavour there derives its\n  // label from the inherited color, and a fixed hint cannot follow that. The\n  // neutral `#dark.65`-on-`#dark.04` chip all but vanishes on a dark overlay,\n  // which is exactly where this theme is meant to be used.\n  //\n  // `current.primary` is included despite painting its label with\n  // `-webkit-text-fill-color` rather than `color`. The hint renders inside the\n  // `Suffix` slot, and `CURRENT_PRIMARY_STYLES` recolors that slot to the label\n  // color — so `currentcolor` there is the LABEL, not the fill. An earlier\n  // version of this comment claimed the opposite and sent it to `primary`, which\n  // put a `#white` hint on a light fill (measured cr 2.17 on a `#note` container\n  // in dark mode).\n  const hotkeysType =\n    theme === 'current'\n      ? 'inherit'\n      : type === 'primary'\n        ? 'primary'\n        : 'default';\n\n  // Build final suffix: loading icon, custom suffix, or HotKeys hint\n  const finalSuffix =\n    isLoading && resolvedLoadingSlot === 'suffix' ? (\n      <LoadingIcon />\n    ) : (\n      suffix ??\n      (hotkeys ? (\n        <HotKeys\n          {...(keyboardShortcutProps as any)}\n          type={hotkeysType}\n          styles={{ padding: '1x left', opacity: finalIsDisabled ? 0.5 : 1 }}\n        >\n          {hotkeys}\n        </HotKeys>\n      ) : undefined)\n    );\n\n  // Register global hotkey if provided\n  useHotkeys(\n    typeof hotkeys === 'string' ? hotkeys.toLowerCase() : '',\n    () => {\n      if (!hotkeys) return;\n      if (finalIsDisabled) return;\n      // Simulate a click on the element so all existing handlers run\n      if (ref && typeof ref === 'object' && ref.current) {\n        (ref.current as HTMLElement).click();\n      }\n    },\n    {\n      enableOnContentEditable: true,\n      enabled: !!hotkeys,\n      preventDefault: true,\n      enableOnFormTags: true,\n    },\n    [hotkeys, finalIsDisabled],\n  );\n\n  const finalMods = useMemo<ItemMods>(() => {\n    return {\n      ...baseMods,\n      'has-icon': hasIconSlot,\n      'has-start-content': !!(hasIconSlot || finalPrefix),\n      'has-end-content': !!(hasRightIconSlot || finalSuffix || actions),\n      'has-right-icon': hasRightIconSlot,\n      'has-label': hasLabel,\n      'has-prefix': !!finalPrefix,\n      'has-suffix': !!finalSuffix,\n      'has-description': showDescription,\n      'has-actions': !!actions,\n      'has-actions-content': !!(actions && actions !== true),\n      'auto-hide-actions': autoHideActions === true,\n      'preserve-actions-space': preserveActionsSpace === true,\n      'inside-wrapper': insideWrapper,\n      'actions-shown': showActions && insideWrapper,\n      checkmark: hasCheckmark,\n      description: showDescription ? finalDescriptionPlacement : 'none',\n    };\n  }, [\n    baseMods,\n    hasIconSlot,\n    hasRightIconSlot,\n    finalPrefix,\n    finalSuffix,\n    showDescription,\n    finalDescriptionPlacement,\n    hasCheckmark,\n    actions,\n    autoHideActions,\n    preserveActionsSpace,\n    hasLabel,\n    showActions,\n    insideWrapper,\n  ]);\n\n  const {\n    labelProps: finalLabelProps,\n    labelRef,\n    renderWithTooltip,\n    isTooltipActive,\n  } = useAutoTooltip({\n    tooltip,\n    children,\n    labelProps,\n    isDynamicLabel: !!actions,\n  });\n\n  // A disabled item still has to be able to show its tooltip — that is usually\n  // where the reason for being unavailable is written. The native `disabled`\n  // attribute would make the browser drop the hover that opens it, so when a\n  // tooltip is present the item is marked `aria-disabled` and kept inert\n  // instead.\n  const { isNativelyDisabled, isInert, inertProps } = getDisabledElementProps({\n    isDisabled: finalIsDisabled,\n    keepEvents: isTooltipActive,\n    as: (rest as { as?: string }).as,\n  });\n\n  // Process children with highlight if applicable\n  const processedChildren = useMemo(() => {\n    if (typeof children === 'string' && highlight) {\n      return highlightText(\n        children,\n        highlight,\n        highlightCaseSensitive,\n        highlightStyles,\n      );\n    }\n    return children;\n  }, [children, highlight, highlightCaseSensitive, highlightStyles]);\n\n  // Process description with highlight if applicable\n  const processedDescription = useMemo(() => {\n    if (typeof description === 'string' && highlight) {\n      return highlightText(\n        description,\n        highlight,\n        highlightCaseSensitive,\n        highlightStyles,\n      );\n    }\n    return description;\n  }, [description, highlight, highlightCaseSensitive, highlightStyles]);\n\n  // Render function that creates the item element\n  const renderItemElement = (\n    tooltipTriggerProps?: HTMLAttributes<HTMLElement>,\n    tooltipRef?: RefObject<HTMLElement>,\n  ) => {\n    // Use callback ref to merge multiple refs without calling hooks\n    const handleRef = (element: HTMLElement | null) => {\n      // Set the component's forwarded ref\n      if (typeof ref === 'function') {\n        ref(element as T | null);\n      } else if (ref) {\n        (ref as any).current = element;\n      }\n      // Set the tooltip ref if provided\n      if (tooltipRef) {\n        (tooltipRef as any).current = element;\n      }\n    };\n\n    return (\n      <ItemElement\n        ref={handleRef}\n        // Shared with `ItemButton`, which repeats this lookup on the wrapper that\n        // carries the row color to actions rendered outside the row.\n        variant={theme && type ? resolveItemVariant(theme, type) : undefined}\n        disabled={isNativelyDisabled}\n        aria-disabled={finalIsDisabled}\n        aria-selected={isSelected}\n        mods={finalMods}\n        styles={styles}\n        tokens={{\n          ...tokens,\n          ...(sizeTokenValue ? { $size: sizeTokenValue } : {}),\n        }}\n        type={htmlType as any}\n        {...mergeProps(\n          isInert ? omitActivationEventProps(rest) : rest,\n          tooltipTriggerProps || {},\n          inertProps,\n        )}\n        style={style}\n      >\n        {hasIconSlot && (\n          <div data-element=\"Icon\">\n            <IconSwitch noWrapper contentKey={iconKey}>\n              {hasCheckmark ? <CheckIcon /> : finalIcon}\n            </IconSwitch>\n          </div>\n        )}\n        {finalPrefix && <div data-element=\"Prefix\">{finalPrefix}</div>}\n        {children || labelProps\n          ? (() => {\n              const LabelTag =\n                type === 'header' || type === 'card'\n                  ? (`h${level}` as const)\n                  : 'div';\n              return (\n                <LabelTag\n                  data-element=\"Label\"\n                  {...finalLabelProps}\n                  ref={labelRef}\n                >\n                  {processedChildren}\n                </LabelTag>\n              );\n            })()\n          : null}\n        {showDescription ? (\n          <div data-element=\"Description\" {...descriptionProps}>\n            {processedDescription}\n          </div>\n        ) : null}\n        {finalSuffix && <div data-element=\"Suffix\">{finalSuffix}</div>}\n        {hasRightIconSlot && (\n          <div data-element=\"RightIcon\">\n            <IconSwitch noWrapper contentKey={rightIconKey}>\n              {finalRightIcon}\n            </IconSwitch>\n          </div>\n        )}\n        {actions && (\n          <div data-element=\"Actions\" {...ACTIONS_EVENT_HANDLERS}>\n            {actions !== true ? (\n              <ItemActionProvider\n                type={type}\n                theme={theme}\n                disableActionsFocus={disableActionsFocus}\n                isDisabled={finalIsDisabled}\n              >\n                {actions}\n              </ItemActionProvider>\n            ) : null}\n          </div>\n        )}\n      </ItemElement>\n    );\n  };\n\n  return renderWithTooltip(renderItemElement, defaultTooltipPlacement);\n};\n\nconst _Item = Object.assign(forwardRef(Item), {\n  Action: ItemAction,\n  Badge: ItemBadge,\n});\n\nexport { _Item as Item };\n\n/**\n * @deprecated Use `Item` instead. This export will be removed in a future version.\n */\nexport { _Item as ItemBase };\nexport type { CubeItemProps as CubeItemBaseProps };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAiDA,MAAM,mBAAmB;CACvB;CACA;CACA;CACA;CACA;CACA;CACD;AAuLD,MAAM,sBAA8B;CAClC,GAAG;CACH,SAAS;CACT,YAAY;CACZ,cAAc;CACd,aAAa;CACb,OAAO;CACP,SAAS;EACP,IAAI;EACJ,wBAAwB;EACxB,yBAAyB;EACzB,mCAAmC;EACpC;CACF;AAED,MAAM,kBAA0B;CAC9B,GAAG;CACH,SAAS;CACT,MAAM;CACN,YAAY;CACZ,cAAc;CACf;AAED,MAAM,yBAAyB;CAC7B,UAAU,MAAkB,EAAE,iBAAiB;CAC/C,gBAAgB,MAAoB,EAAE,iBAAiB;CACvD,cAAc,MAAoB,EAAE,iBAAiB;CACrD,cAAc,MAAkB,EAAE,iBAAiB;CACnD,YAAY,MAAkB,EAAE,iBAAiB;CACjD,YAAY,MAAqB;AAC/B,MAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,IACjC,GAAE,iBAAiB;;CAGxB;AAED,MAAM,cAAc,MAAM;CACxB,IAAI;CACJ,QAAQ;EACN,eACE;EAEF,SAAS;EACT,MAAM;EACN,KAAK;EACL,SAAS;EACT,YAAY;EACZ,cAAc;EACd,cAAc;GACZ,IAAI;GACJ,sBACE;GACF,kCACE;GACF,qBACE;GACH;EAED,YAAY;GACV,IAAI;GACJ,0BAA0B;GAC3B;EACD,UAAU;EACV,SAAS;GACP,IAAI;GACJ,aAAa;GACd;EACD,QAAQ;EACR,QAAQ;GACN,IAAI;GACJ,cAAc;GACd,gBAAgB;GAChB,eAAe;GACf,cAAc;GACf;EACD,QAAQ;GACN,IAAI;GACJ,eAAe;GAChB;EACD,OAAO;GACL,IAAI;GACJ,6BAA6B;GAC7B,eAAe;GAChB;EACD,QAAQ;EACR,MAAM;GACJ,IAAI;GACJ,qBAAqB;GACrB,UAAU;GACV,kCAAkC;GAClC,SAAS;GACT,UAAU;GACX;EACD,OAAO;GACL,IAAI;GACJ,SAAS;GACT,SAAS;GACT,UAAU;GACX;EACD,QAAQ;GACN,IAAI;GACJ,cAAc;GACd,eAAe;GACf,eAAe;GACf,eAAe;GACf,wDAAwD;GACxD,4BAA4B;GAC5B,wEACE;GACF,0CAA0C;GAC1C,2CAA2C;GAC5C;EACD,QAAQ;EACR,YAAY;EACZ,eAAe;EACf,QAAQ;GACN,IAAI;GACJ,UAAU;GACV,wCAAwC;GACxC,UAAU;GACX;EAED,OAAO;GACL,IAAI;GACJ,eAAe;GACf,cAAc;GACd,eAAe;GACf,cAAc;GACd,eAAe;GACf,eAAe;GAChB;EACD,mBACE;EACF,kBAAkB;GAChB,IAAI;GACJ,4BAA4B;GAC5B,eAAe;GAChB;EACD,wBAAwB;EACxB,uBAAuB;EAEvB,uBAAuB;GACrB,IAAI;GACJ,qBAAqB;GACtB;EACD,wBAAwB;GACtB,IAAI;GACJ,mBAAmB;GAEnB,gHACE;GACF,6FACE;GACH;EACD,yBAAyB;GACvB,IAAI;GACJ,sBAAsB;GACvB;EACD,6BAA6B;GAC3B,IAAI;GACJ,qBAAqB;GACrB,qBAAqB;GACrB,0CAA0C;GAC3C;EACD,8BAA8B;GAC5B,IAAI;GACJ,mBAAmB;GACnB,qBAAqB;GACrB,wCAAwC;GACzC;EACD,+BAA+B;GAC7B,IAAI;GACJ,kCAAkC;GAClC,iCACE;GACH;EAED,MAAM;GAAE,GAAG;GAAqB,UAAU;GAAQ;EAElD,WAAW;GAAE,GAAG;GAAqB,UAAU;GAAa;EAE5D,OAAO;GACL,GAAG;GACH,QAAQ;GACR,UAAU;GACV,SAAS;GACT,WAAW;GACX,WAAW;GACX,cAAc;GACd,YAAY;GACZ,UAAU;GACV,cAAc;GACd,OAAO;GACP,QAAQ;GACR,YAAY;GACZ,SACE;GACH;EAED,aAAa;GACX,GAAG;GACH,UAAU;GACV,QAAQ;IACN,IAAI;IACJ,2BAA2B;IAC5B;GACD,WAAW;GACX,WAAW;GACX,OAAO;GACP,SAAS;IACP,IAAI;IACJ,2BAA2B;IAC5B;GACD,UAAU;GACV,YAAY;IACV,IAAI;IACJ,2BAA2B;IAC5B;GACD,cAAc;GACd,OAAO;GACP,WAAW;GACX,SACE;GACH;EAED,QAAQ;GACN,GAAG;GACH,UAAU;GACV,SAAS;IACP,IAAI;IACJ,YAAY;IACb;GACF;EAED,QAAQ;GACN,GAAG;GACH,UAAU;GACV,SAAS;IACP,IAAI;IACJ,kBAAkB;IACnB;GACF;EAED,SAAS;GACP,GAAG;GACH,UAAU;GACV,SAAS;GACT,KAAK;GACL,YAAY;GACZ,cAAc;GACd,WAAW;GACX,SAAS;IACP,IAAI;IACJ,mCAAmC;IACpC;GACD,WAAW;GACX,QAAQ;GACR,OAAO;IACL,IAAI;IACJ,4CACE;IACF,qEACE;IACF,8IACE;IACF,oEACE;IACH;GACD,SAAS;IACP,IAAI;IACJ,qBAAqB;IACrB,4FAA4F;IAC7F;GACD,YACE;GACF,iBAAiB;GAGjB,gBAAgB;GAEhB,iBAAiB;GAClB;EACF;CACD,UAAU;CACV,YAAY;CACb,CAAC;AAEF,MAAM,QACJ,OACA,QACG;CACH,IAAI,EACF,UACA,OAAO,UACP,OAAO,QACP,QAAQ,WACR,MACA,MAAM,UACN,WAAW,eACX,QACA,QACA,aACA,sBACA,YACA,kBACA,uBACA,QACA,UACA,YACA,SACA,UAAU,MACV,YAIA,UAAU,oBACV,OACA,cAAc,QACd,YAAY,OACZ,SACA,kBAAkB,OAClB,uBAAuB,OACvB,sBAAsB,OACtB,OACA,0BAA0B,OAC1B,QAAQ,GACR,WACA,yBAAyB,OACzB,iBACA,gBAAgB,OAChB,cAAc,OACd,QACA,GAAG,SACD;CAGJ,MAAM,WAAW,CAAC,EAAE,YAAY;CAIhC,MAAM,4BACJ,0BACE,SAAS,UAAU,SAAS,aAAa,WAAW,UAAU;CAGlE,MAAM,aAAa,UAAU,SAAS,SAAS,SAAS;CAExD,MAAM,iBAAiB,eAAe,sBAAsB;CAG5D,MAAM,kBACJ,mBAAmB,QAAS,aAAa,mBAAmB;AA4B9D,SAJG,SAAS,YAAY,CAHF,CAAC,UAAU,CAGM,SAAS,MAAM,IACnD,SAAS,UAAU,CAZF;EAClB;EACA;EACA;EACA;EACA;EACA;EACD,CAKkC,SAAS,MAAM,IAC/C,CAAC,CAAC,UAAU,OAAO,CAAC,SAAS,KAAK,IAAI,CAtBjB;EACtB;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAcyD,SAAS,MAAM,EAE3C;EAC5B,KAAK;GAAC;GAAQ;GAAsB;GAAM;GAAM;EAChD,MAAM,CACJ,+CAA+C,KAAK,4BAA4B,MAAM,OACnF,SAAS,WACN,uDACA,SAAS,SACP,+FACA,8FACT;EACF,CAAC;CAGF,MAAM,mBAAmB,SAAS,WAAW,YAAY;CACzD,MAAM,qBAAqB,SAAS,UAAU;CAC9C,MAAM,sBAAsB,oBAAoB;CAEhD,MAAM,0BAAoC,EAAE;AAC5C,KAAI,iBACF,yBAAwB,KAAK,sCAAsC;AAErE,KAAI,mBACF,yBAAwB,KAAK,mCAAmC;AAGlE,SAAQ,qBAAqB;EAC3B,KAAK,CAAC,QAAQ,oBAAoB;EAClC,MAAM,CACJ,0CAA0C,wBAAwB,KAAK,OAAO,CAAC,8CAChF;EACF,CAAC;CAGF,MAAM,eAAe,aAAa;CAGlC,MAAM,eACJ,OAAO,SAAS,YAChB,CAAE,iBAAuC,SAAS,KAAK;CACzD,MAAM,iBACJ,OAAO,SAAS,WAAW,GAAG,KAAK,MAAM,eAAe,OAAO;CAGjE,MAAM,WAAW,eACR;EACL,UAAU;EACV,UAAU,eAAe;EACzB,SAAS;EACT,GAAI,CAAC,gBAAgB,EAAQ,MAAgB;EAC7C;EACA;EACA,OAAO;EACP,GAAG;EACJ,GACD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CAGD,MAAM,eAAe,cAAc;AACjC,MAAI,aACF,QAAO;GAAE,SAAS;GAAM,SAAS;GAAM;AAEzC,SAAO,YAAY,UAAmC,SAAS;IAC9D;EAAC;EAAU;EAAU;EAAa,CAAC;CAEtC,MAAM,oBAAoB,cAClB,YAAY,eAAe,SAAS,EAC1C,CAAC,eAAe,SAAS,CAC1B;CAID,MAAM,sBAAsB,cAAc;AACxC,MAAI,gBAAgB,OAAQ,QAAO;AAGnC,MAAI,kBAAkB,WAAW,CAAC,aAAa,QAAS,QAAO;AAC/D,SAAO;IACN;EAAC;EAAa,aAAa;EAAS,kBAAkB;EAAQ,CAAC;CAGlE,MAAM,cACJ,aAAa,WAAY,aAAa,wBAAwB;CAChE,MAAM,mBACJ,kBAAkB,WACjB,aAAa,wBAAwB;CAExC,MAAM,kBAAkB,cAAc;EACpC,MAAM,YAAY,EAAE,GAAG,kBAAkB;AACzC,SAAO,UAAU;AACjB,SAAO,CAAC,EAAE,eAAe,OAAO,KAAK,UAAU,CAAC,SAAS;IACxD,CAAC,aAAa,iBAAiB,CAAC;CAGnC,MAAM,YACJ,aAAa,wBAAwB,SACnC,oBAAC,gBAAc,GAEf,aAAa;CAEjB,MAAM,iBACJ,aAAa,wBAAwB,cACnC,oBAAC,gBAAc,GAEf,kBAAkB;CAItB,MAAM,UAAU,eACZ,cACA,aAAa,wBAAwB,SACnC,YACA,eAAe,UAAU,GACtB,UAAU,MAAc,eACxB,UAAU,MAAc,QACzB,SACA,YACE,SACA;CAEV,MAAM,eACJ,aAAa,wBAAwB,cACjC,YACA,eAAe,eAAe,GAC3B,eAAe,MAAc,eAC7B,eAAe,MAAc,QAC9B,SACA,iBACE,SACA;CACV,MAAM,cACJ,aAAa,wBAAwB,WAAW,oBAAC,gBAAc,GAAG;CAmBpE,MAAM,cACJ,UAAU,YACN,YACA,SAAS,YACP,YACA;CAGR,MAAM,cACJ,aAAa,wBAAwB,WACnC,oBAAC,gBAAc,GAEf,WACC,UACC,oBAACA;EACC,GAAK;EACL,MAAM;EACN,QAAQ;GAAE,SAAS;GAAW,SAAS,kBAAkB,KAAM;GAAG;YAEjE;GACO,GACR;AAIR,YACE,OAAO,YAAY,WAAW,QAAQ,aAAa,GAAG,UAChD;AACJ,MAAI,CAAC,QAAS;AACd,MAAI,gBAAiB;AAErB,MAAI,OAAO,OAAO,QAAQ,YAAY,IAAI,QACxC,CAAC,IAAI,QAAwB,OAAO;IAGxC;EACE,yBAAyB;EACzB,SAAS,CAAC,CAAC;EACX,gBAAgB;EAChB,kBAAkB;EACnB,EACD,CAAC,SAAS,gBAAgB,CAC3B;CAED,MAAM,YAAY,cAAwB;AACxC,SAAO;GACL,GAAG;GACH,YAAY;GACZ,qBAAqB,CAAC,EAAE,eAAe;GACvC,mBAAmB,CAAC,EAAE,oBAAoB,eAAe;GACzD,kBAAkB;GAClB,aAAa;GACb,cAAc,CAAC,CAAC;GAChB,cAAc,CAAC,CAAC;GAChB,mBAAmB;GACnB,eAAe,CAAC,CAAC;GACjB,uBAAuB,CAAC,EAAE,WAAW,YAAY;GACjD,qBAAqB,oBAAoB;GACzC,0BAA0B,yBAAyB;GACnD,kBAAkB;GAClB,iBAAiB,eAAe;GAChC,WAAW;GACX,aAAa,kBAAkB,4BAA4B;GAC5D;IACA;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,EACJ,YAAY,iBACZ,UACA,mBACA,oBACE,eAAe;EACjB;EACA;EACA;EACA,gBAAgB,CAAC,CAAC;EACnB,CAAC;CAOF,MAAM,EAAE,oBAAoB,SAAS,eAAe,wBAAwB;EAC1E,YAAY;EACZ,YAAY;EACZ,IAAK,KAAyB;EAC/B,CAAC;CAGF,MAAM,oBAAoB,cAAc;AACtC,MAAI,OAAO,aAAa,YAAY,UAClC,QAAO,cACL,UACA,WACA,wBACA,gBACD;AAEH,SAAO;IACN;EAAC;EAAU;EAAW;EAAwB;EAAgB,CAAC;CAGlE,MAAM,uBAAuB,cAAc;AACzC,MAAI,OAAO,gBAAgB,YAAY,UACrC,QAAO,cACL,aACA,WACA,wBACA,gBACD;AAEH,SAAO;IACN;EAAC;EAAa;EAAW;EAAwB;EAAgB,CAAC;CAGrE,MAAM,qBACJ,qBACA,eACG;EAEH,MAAM,aAAa,YAAgC;AAEjD,OAAI,OAAO,QAAQ,WACjB,KAAI,QAAoB;YACf,IACT,CAAC,IAAY,UAAU;AAGzB,OAAI,WACF,CAAC,WAAmB,UAAU;;AAIlC,SACE,qBAAC;GACC,KAAK;GAGL,SAAS,SAAS,OAAO,mBAAmB,OAAO,KAAK,GAAG;GAC3D,UAAU;GACV,iBAAe;GACf,iBAAe;GACf,MAAM;GACE;GACR,QAAQ;IACN,GAAG;IACH,GAAI,iBAAiB,EAAE,OAAO,gBAAgB,GAAG,EAAE;IACpD;GACD,MAAM;GACN,GAAI,WACF,UAAU,yBAAyB,KAAK,GAAG,MAC3C,uBAAuB,EAAE,EACzB,WACD;GACM;;IAEN,eACC,oBAAC;KAAI,gBAAa;eAChB,oBAAC;MAAW;MAAU,YAAY;gBAC/B,eAAe,oBAAC,cAAY,GAAG;OACrB;MACT;IAEP,eAAe,oBAAC;KAAI,gBAAa;eAAU;MAAkB;IAC7D,YAAY,aAOL,oBAJA,SAAS,YAAY,SAAS,SACzB,IAAI,UACL;KAGF,gBAAa;KACb,GAAI;KACJ,KAAK;eAEJ;MACQ,GAGf;IACH,kBACC,oBAAC;KAAI,gBAAa;KAAc,GAAI;eACjC;MACG,GACJ;IACH,eAAe,oBAAC;KAAI,gBAAa;eAAU;MAAkB;IAC7D,oBACC,oBAAC;KAAI,gBAAa;eAChB,oBAAC;MAAW;MAAU,YAAY;gBAC/B;OACU;MACT;IAEP,WACC,oBAAC;KAAI,gBAAa;KAAU,GAAI;eAC7B,YAAY,OACX,oBAAC;MACO;MACC;MACc;MACrB,YAAY;gBAEX;OACkB,GACnB;MACA;;IAEI;;AAIlB,QAAO,kBAAkB,mBAAmB,wBAAwB;;AAGtE,MAAM,QAAQ,OAAO,OAAO,WAAW,KAAK,EAAE;CAC5C,QAAQ;CACR,OAAO;CACR,CAAC"}

package/dist/components/content/ItemBadge/ItemBadge.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { TooltipProvider } from "../../overlays/Tooltip/TooltipProvider.js";
 import { CURRENT_CLEAR_STYLES, CURRENT_OUTLINE_STYLES, CURRENT_PRIMARY_STYLES, DANGER_CLEAR_STYLES, DANGER_OUTLINE_STYLES, DANGER_PRIMARY_STYLES, DEFAULT_CLEAR_STYLES, DEFAULT_OUTLINE_STYLES, DEFAULT_PRIMARY_STYLES, ITEM_ACTION_BASE_STYLES, SPECIAL_CLEAR_STYLES, SPECIAL_OUTLINE_STYLES, SPECIAL_PRIMARY_STYLES, SUCCESS_CLEAR_STYLES, SUCCESS_OUTLINE_STYLES, SUCCESS_PRIMARY_STYLES } from "../../../data/item-themes.js";

package/dist/components/content/ItemCard/ItemCard.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { _Item } from "../Item/Item.js";
 import { forwardRef } from "react";

package/dist/components/content/Layout/GridLayout.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { _Layout } from "./Layout.js";
 import { _LayoutContent } from "./LayoutContent.js";
 import { _LayoutBlock } from "./LayoutBlock.js";

package/dist/components/content/Layout/Layout.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { Alert } from "../Alert/Alert.js";

package/dist/components/content/Layout/LayoutBlock.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { _LayoutContent } from "./LayoutContent.js";
 import { tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/content/Layout/LayoutCenter.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { _LayoutContainer } from "./LayoutContainer.js";
 import { tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/content/Layout/LayoutContainer.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { LayoutContextReset } from "./LayoutContext.js";

package/dist/components/content/Layout/LayoutContent.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { LayoutContextReset } from "./LayoutContext.js";

package/dist/components/content/Layout/LayoutContext.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { createContext, useContext, useMemo, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/content/Layout/LayoutFlex.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { _LayoutContent } from "./LayoutContent.js";
 import { tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/content/Layout/LayoutFooter.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { _LayoutContent } from "./LayoutContent.js";
 import { tasty } from "@tenphi/tasty";
 import { forwardRef, useMemo } from "react";

package/dist/components/content/Layout/LayoutGrid.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { _LayoutContent } from "./LayoutContent.js";
 import { tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/content/Layout/LayoutHeader.js

@@ -1,10 +1,10 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { useAutoTooltip } from "../use-auto-tooltip.js";
 import { useI18n } from "../../../i18n/useI18n.js";
-import { SlashIcon } from "../../../icons/SlashIcon.js";
 import { Button } from "../../actions/Button/Button.js";
 import { Link } from "../../actions/Link/Link.js";
 import { _LayoutContent } from "./LayoutContent.js";
+import { SlashIcon } from "../../../icons/SlashIcon.js";
 import { tasty } from "@tenphi/tasty";
 import { Fragment, forwardRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/content/Layout/LayoutPane.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";

package/dist/components/content/Layout/LayoutPanel.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";

package/dist/components/content/Layout/LayoutPanelHeader.js

@@ -1,10 +1,10 @@
-/** @license MIT | @cube-dev/ui-kit v0.168.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.169.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { _Item } from "../Item/Item.js";
 import { useI18n } from "../../../i18n/useI18n.js";
-import { CloseIcon } from "../../../icons/CloseIcon.js";
 import { useDialogContext } from "../../overlays/Dialog/context.js";
+import { CloseIcon } from "../../../icons/CloseIcon.js";
 import { useLayoutPanelContext } from "./LayoutContext.js";
 import { CONTAINER_STYLES, tasty } from "@tenphi/tasty";
 import { forwardRef, useCallback } from "react";