/**
 * @license MIT
 * author: Cube Dev Team
 * @cube-dev/ui-kit v0.0.0-canary-e980ce7
 * Released under the MIT license.
 */

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { forwardRef, isValidElement, useMemo, } from 'react';
import { useHotkeys } from 'react-hotkeys-hook';
import { useWarn } from '../../../_internal/hooks/use-warn.js';
import { DANGER_CARD_STYLES, DANGER_CLEAR_STYLES, DANGER_ITEM_STYLES, DANGER_LINK_STYLES, DANGER_NEUTRAL_STYLES, DANGER_OUTLINE_STYLES, DANGER_PRIMARY_STYLES, DANGER_SECONDARY_STYLES, DEFAULT_CARD_STYLES, DEFAULT_CLEAR_STYLES, DEFAULT_ITEM_STYLES, DEFAULT_LINK_STYLES, DEFAULT_NEUTRAL_STYLES, DEFAULT_OUTLINE_STYLES, DEFAULT_PRIMARY_STYLES, DEFAULT_SECONDARY_STYLES, NOTE_CARD_STYLES, NOTE_CLEAR_STYLES, NOTE_ITEM_STYLES, NOTE_LINK_STYLES, NOTE_NEUTRAL_STYLES, NOTE_OUTLINE_STYLES, NOTE_PRIMARY_STYLES, NOTE_SECONDARY_STYLES, SPECIAL_CLEAR_STYLES, SPECIAL_ITEM_STYLES, SPECIAL_LINK_STYLES, SPECIAL_NEUTRAL_STYLES, SPECIAL_OUTLINE_STYLES, SPECIAL_PRIMARY_STYLES, SPECIAL_SECONDARY_STYLES, SUCCESS_CARD_STYLES, SUCCESS_CLEAR_STYLES, SUCCESS_ITEM_STYLES, SUCCESS_LINK_STYLES, SUCCESS_NEUTRAL_STYLES, SUCCESS_OUTLINE_STYLES, SUCCESS_PRIMARY_STYLES, SUCCESS_SECONDARY_STYLES, WARNING_CARD_STYLES, WARNING_CLEAR_STYLES, WARNING_ITEM_STYLES, WARNING_LINK_STYLES, WARNING_NEUTRAL_STYLES, WARNING_OUTLINE_STYLES, WARNING_PRIMARY_STYLES, WARNING_SECONDARY_STYLES, } from '../../../data/item-themes.js';
import { CheckIcon } from '../../../icons/CheckIcon.js';
import { LoadingIcon } from '../../../icons/LoadingIcon.js';
import { CONTAINER_STYLES, tasty, } from '../../../tasty/index.js';
import { mergeProps, resolveIcon } from '../../../utils/react/index.js';
import { ItemAction } from '../../actions/ItemAction/index.js';
import { ItemActionProvider } from '../../actions/ItemActionContext.js';
import { IconSwitch } from '../../helpers/IconSwitch/IconSwitch.js';
import { highlightText } from '../highlightText.js';
import { HotKeys } from '../HotKeys/index.js';
import { ItemBadge } from '../ItemBadge/index.js';
import { useAutoTooltip } from '../use-auto-tooltip.js';
const ITEM_SIZE_VALUES = [
    'xsmall',
    'small',
    'medium',
    'large',
    'xlarge',
    'inline',
];
const DEFAULT_ICON_STYLES = {
    $: '>',
    display: 'grid',
    placeItems: 'center',
    placeContent: 'stretch',
    aspectRatio: '1 / 1',
    width: '($size - 2bw)',
    opacity: {
        '': 1,
        'checkbox & selected': 1,
        'checkbox & !selected': 0,
        'checkbox & !selected & hovered': 0.4,
    },
};
const ADDITION_STYLES = {
    $: '>',
    display: 'grid',
    flow: 'column',
    placeItems: 'center',
    placeContent: 'stretch',
};
const ACTIONS_EVENT_HANDLERS = {
    onClick: (e) => e.stopPropagation(),
    onPointerDown: (e) => e.stopPropagation(),
    onPointerUp: (e) => e.stopPropagation(),
    onMouseDown: (e) => e.stopPropagation(),
    onMouseUp: (e) => e.stopPropagation(),
    onKeyDown: (e) => {
        if (e.key === 'Enter' || e.key === ' ') {
            e.stopPropagation();
        }
    },
};
const ItemElement = tasty({
    as: 'div',
    styles: {
        '@interacted': 'active | :hover | :focus | :focus-within | :has([data-pressed])',
        display: 'inline-grid',
        flow: 'column dense',
        gap: 0,
        outline: 0,
        placeItems: 'stretch',
        placeContent: 'stretch',
        gridTemplate: {
            '': '"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',
            'description=inline': '"icon prefix description suffix rightIcon actions" auto / max-content max-content 1sf max-content max-content max-content',
            'description=inline & has-label': '"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',
            'description=block': '"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',
        },
        // Prevent items from shrinking inside vertical flex layouts (Menu, ListBox, etc)
        flexShrink: {
            '': 'initial',
            'menuitem | listboxitem': 0,
        },
        position: 'relative',
        padding: {
            '': 0,
            'type=card': '.5x',
        },
        margin: 0,
        radius: {
            '': true,
            'shape=card': '1cr',
            'shape=button': true,
            'shape=sharp': '0',
            'shape=pill': 'round',
        },
        height: {
            '': 'min $size',
            'size=inline': '(1lh + 2bw)',
        },
        width: {
            '': 'min $size',
            'has-icon & has-right-icon': 'min ($size * 2)',
            'size=inline': 'min (1lh + 2bw)',
        },
        border: '#clear',
        fill: {
            '': '#dark.0',
            'hovered | focused': '#dark.03',
            selected: '#dark.09',
            'selected & (hovered | focused)': '#dark.12',
            pressed: '#dark.09',
            disabled: '#clear',
        },
        color: {
            '': '#dark-02',
            hovered: '#dark-02',
            pressed: '#dark',
            disabled: '#dark-04',
        },
        preset: {
            '': 't3',
            '!type=item': 't3m',
            'size=xsmall': 't4',
            'size=xlarge': 't2',
            'size=inline': 'inline',
            '!type=item & (size=medium | size=small | size=large)': 't3m',
            '!type=item & size=xlarge': 't2m',
            '(type=header | type=card) & (size=xsmall | size=small | size=medium)': 'h6',
            '(type=header | type=card) & size=large': 'h5',
            '(type=header | type=card) & size=xlarge': 'h4',
        },
        boxSizing: 'border-box',
        transition: 'theme',
        reset: 'button',
        appearance: 'none',
        touchAction: 'manipulation',
        textDecoration: 'none',
        outlineOffset: 1,
        cursor: {
            '': 'inherit',
            ':is(a)': 'pointer',
            ':is(button) | listboxitem | menuitem': '$pointer',
            disabled: 'not-allowed',
        },
        $size: {
            '': '$size-md',
            'size=xsmall': '$size-xs',
            'size=small': '$size-sm',
            'size=medium': '$size-md',
            'size=large': '$size-lg',
            'size=xlarge': '$size-xl',
            'size=inline': '(1lh + 2bw)',
        },
        '$inline-padding': 'max($min-inline-padding, (($size - 1lh - 2bw) / 2 + $inline-compensation))',
        '$block-padding': {
            '': '.5x',
            'size=xsmall | size=small': '.25x',
            'size=inline': 0,
        },
        '$inline-compensation': '.5x',
        '$min-inline-padding': '(1x - 1bw)',
        '$label-padding-left': {
            '': '$inline-padding',
            'has-start-content': '0',
        },
        '$label-padding-right': {
            '': '$inline-padding',
            'has-end-content': '0',
            // Restore padding when actions are hidden AND no other visible end content
            '!inside-wrapper & !has-suffix & !has-right-icon & auto-hide-actions & !preserve-actions-space & !@interacted': '$inline-padding',
            'inside-wrapper & !has-suffix & !has-right-icon & !preserve-actions-space & !actions-shown': '$inline-padding',
        },
        '$label-padding-bottom': {
            '': '$block-padding',
            'description=inline': '0',
        },
        '$description-padding-left': {
            '': '$inline-padding',
            'has-start-content': 0,
            'description=block': '($inline-padding - $inline-compensation + 1bw)',
            'description=block & !has-start-content': '$inline-padding',
        },
        '$description-padding-right': {
            '': '$inline-padding',
            'has-end-content': 0,
            'description=block': '($inline-padding - $inline-compensation + 1bw)',
            'description=block & !has-end-content': '$inline-padding',
        },
        '$description-padding-bottom': {
            '': 0,
            'has-label & description=inline': '$block-padding',
            'has-label & description=block': 'max($block-padding, (($size - 4x) / 2) + $block-padding)',
        },
        Icon: { ...DEFAULT_ICON_STYLES, gridArea: 'icon' },
        RightIcon: { ...DEFAULT_ICON_STYLES, gridArea: 'rightIcon' },
        Label: {
            $: '>',
            margin: 0,
            gridArea: 'label',
            display: 'block',
            placeSelf: 'center start',
            boxSizing: 'border-box',
            placeContent: 'stretch',
            whiteSpace: 'nowrap',
            overflow: 'hidden',
            textOverflow: 'ellipsis',
            width: '0 100%',
            preset: 'inherit',
            transition: 'padding',
            padding: '$block-padding $label-padding-right $label-padding-bottom $label-padding-left',
        },
        Description: {
            $: '>',
            gridArea: 'description',
            preset: {
                '': 't4',
                'type=card | type=header': 't3',
            },
            placeSelf: 'center start',
            boxSizing: 'border-box',
            color: 'inherit',
            opacity: {
                '': 0.75,
                'type=card | type=header': 1,
            },
            overflow: 'hidden',
            whiteSpace: {
                '': 'nowrap',
                'type=card | type=header': 'normal',
            },
            textOverflow: 'ellipsis',
            width: 'initial 100% 100%',
            textAlign: 'left',
            padding: '0 $description-padding-right $description-padding-bottom $description-padding-left',
        },
        Prefix: {
            ...ADDITION_STYLES,
            gridArea: 'prefix',
            padding: {
                '': '$inline-padding left',
                'has-icon': 0,
            },
        },
        Suffix: {
            ...ADDITION_STYLES,
            gridArea: 'suffix',
            padding: {
                '': '$inline-padding right',
                'has-right-icon': 0,
            },
        },
        Actions: {
            $: '>',
            gridArea: 'actions',
            display: 'flex',
            gap: '1bw',
            placeItems: 'center',
            placeContent: 'end',
            placeSelf: 'stretch',
            padding: {
                '': '0 $side-padding',
                'inside-wrapper & !actions-shown': 0,
            },
            boxSizing: 'border-box',
            height: 'min ($size - 2bw)',
            width: {
                '': 'fixed ($actions-width, 0px)',
                'has-actions-content & !auto-hide-actions': 'max calc-size(max-content, size)',
                'has-actions-content & auto-hide-actions & !preserve-actions-space': 'max 0px',
                'has-actions-content & auto-hide-actions & (!preserve-actions-space & ((@interacted & !inside-wrapper) | (inside-wrapper & actions-shown)))': 'max calc-size(max-content, size)',
                'has-actions-content & auto-hide-actions & preserve-actions-space': 'max calc-size(max-content, size)',
            },
            opacity: {
                '': 1,
                'auto-hide-actions': 0,
                'auto-hide-actions & ((@interacted & !inside-wrapper) | (inside-wrapper & actions-shown))': 1,
            },
            transition: 'width $transition ease-out, opacity $transition ease-out, padding $transition ease-out',
            interpolateSize: 'allow-keywords',
            // Size for the action buttons
            '$action-size': 'min(max((2x + 2bw), ($size - 1x - 2bw)), (3x - 2bw))',
            // Side padding for the button
            '$side-padding': '(($size - $action-size - 2bw) / 2)',
        },
    },
    variants: {
        // Default theme
        'default.primary': DEFAULT_PRIMARY_STYLES,
        'default.secondary': DEFAULT_SECONDARY_STYLES,
        'default.outline': DEFAULT_OUTLINE_STYLES,
        'default.neutral': DEFAULT_NEUTRAL_STYLES,
        'default.clear': DEFAULT_CLEAR_STYLES,
        'default.link': DEFAULT_LINK_STYLES,
        'default.item': DEFAULT_ITEM_STYLES,
        'default.card': DEFAULT_CARD_STYLES,
        // Danger theme
        'danger.primary': DANGER_PRIMARY_STYLES,
        'danger.secondary': DANGER_SECONDARY_STYLES,
        'danger.outline': DANGER_OUTLINE_STYLES,
        'danger.neutral': DANGER_NEUTRAL_STYLES,
        'danger.clear': DANGER_CLEAR_STYLES,
        'danger.link': DANGER_LINK_STYLES,
        'danger.item': DANGER_ITEM_STYLES,
        'danger.card': DANGER_CARD_STYLES,
        // Success theme
        'success.primary': SUCCESS_PRIMARY_STYLES,
        'success.secondary': SUCCESS_SECONDARY_STYLES,
        'success.outline': SUCCESS_OUTLINE_STYLES,
        'success.neutral': SUCCESS_NEUTRAL_STYLES,
        'success.clear': SUCCESS_CLEAR_STYLES,
        'success.link': SUCCESS_LINK_STYLES,
        'success.item': SUCCESS_ITEM_STYLES,
        'success.card': SUCCESS_CARD_STYLES,
        // Warning theme
        'warning.primary': WARNING_PRIMARY_STYLES,
        'warning.secondary': WARNING_SECONDARY_STYLES,
        'warning.outline': WARNING_OUTLINE_STYLES,
        'warning.neutral': WARNING_NEUTRAL_STYLES,
        'warning.clear': WARNING_CLEAR_STYLES,
        'warning.link': WARNING_LINK_STYLES,
        'warning.item': WARNING_ITEM_STYLES,
        'warning.card': WARNING_CARD_STYLES,
        // Note theme
        'note.primary': NOTE_PRIMARY_STYLES,
        'note.secondary': NOTE_SECONDARY_STYLES,
        'note.outline': NOTE_OUTLINE_STYLES,
        'note.neutral': NOTE_NEUTRAL_STYLES,
        'note.clear': NOTE_CLEAR_STYLES,
        'note.link': NOTE_LINK_STYLES,
        'note.item': NOTE_ITEM_STYLES,
        'note.card': NOTE_CARD_STYLES,
        // Special theme
        'special.primary': SPECIAL_PRIMARY_STYLES,
        'special.secondary': SPECIAL_SECONDARY_STYLES,
        'special.outline': SPECIAL_OUTLINE_STYLES,
        'special.neutral': SPECIAL_NEUTRAL_STYLES,
        'special.clear': SPECIAL_CLEAR_STYLES,
        'special.link': SPECIAL_LINK_STYLES,
        'special.item': SPECIAL_ITEM_STYLES,
    },
    styleProps: CONTAINER_STYLES,
});
const Item = (props, ref) => {
    let { children, size = 'medium', type = 'item', theme = 'default', mods, icon: iconProp, rightIcon: rightIconProp, prefix, suffix, description, descriptionPlacement, labelProps, descriptionProps, keyboardShortcutProps, styles, htmlType, isSelected, hotkeys, tooltip = true, isDisabled, style, loadingSlot = 'auto', isLoading = false, actions, autoHideActions = false, preserveActionsSpace = false, disableActionsFocus = false, shape, defaultTooltipPlacement = 'top', level = 3, highlight, highlightCaseSensitive = false, highlightStyles, insideWrapper = false, showActions = false, ...rest } = props;
    // Determine if Label will be rendered
    const hasLabel = !!(children || labelProps);
    // Set default descriptionPlacement based on type
    // For card/header types, use 'block' only when Label is rendered
    const finalDescriptionPlacement = descriptionPlacement ??
        ((type === 'card' || type === 'header') && hasLabel ? 'block' : 'inline');
    // Set default shape based on type
    const finalShape = shape ?? (type === 'card' ? 'card' : 'button');
    // Loading state makes the component disabled
    const finalIsDisabled = isDisabled === true || (isLoading && isDisabled !== false);
    // Validate type+theme combinations
    const STANDARD_THEMES = [
        'default',
        'success',
        'danger',
        'warning',
        'note',
        'special',
    ];
    const CARD_THEMES = ['default', 'success', 'danger', 'warning', 'note'];
    const HEADER_THEMES = ['default'];
    const isInvalidCombination = (type === 'header' && !HEADER_THEMES.includes(theme)) ||
        (type === 'card' && !CARD_THEMES.includes(theme)) ||
        (!['header', 'card'].includes(type) && !STANDARD_THEMES.includes(theme));
    useWarn(isInvalidCombination, {
        key: ['Item', 'invalid-type-theme', type, theme],
        args: [
            `Item: Invalid type+theme combination. type="${type}" does not support theme="${theme}".` +
                (type === 'header'
                    ? ' The "header" type only supports theme: default.'
                    : type === 'card'
                        ? ' The "card" type only supports themes: default, success, danger, warning, note.'
                        : ' Standard types support themes: default, success, danger, warning, note, special.'),
        ],
    });
    // Warn if link type is used with icons or loading state
    const hasLinkWithIcons = type === 'link' && (iconProp || rightIconProp);
    const hasLinkWithLoading = type === 'link' && isLoading;
    const hasLinkRestrictions = hasLinkWithIcons || hasLinkWithLoading;
    const linkRestrictionMessages = [];
    if (hasLinkWithIcons) {
        linkRestrictionMessages.push('icons (`icon` or `rightIcon` props)');
    }
    if (hasLinkWithLoading) {
        linkRestrictionMessages.push('loading state (`isLoading` prop)');
    }
    useWarn(hasLinkRestrictions, {
        key: ['Item', 'link-restrictions'],
        args: [
            `Item: The "link" type does not support ${linkRestrictionMessages.join(' or ')}. Remove these props when using type="link".`,
        ],
    });
    // Determine if we should show checkbox instead of icon
    const hasCheckbox = iconProp === 'checkbox';
    // Determine if size is custom (number or unrecognized string)
    const isCustomSize = typeof size === 'number' ||
        !ITEM_SIZE_VALUES.includes(size);
    const sizeTokenValue = typeof size === 'number' ? `${size}px` : isCustomSize ? size : undefined;
    // Base mods for icon resolution (without icon-dependent mods)
    const baseMods = useMemo(() => ({
        disabled: finalIsDisabled,
        selected: isSelected === true,
        loading: isLoading,
        ...(!isCustomSize && { size: size }),
        type,
        theme,
        shape: finalShape,
        ...mods,
    }), [
        finalIsDisabled,
        isSelected,
        isLoading,
        size,
        isCustomSize,
        type,
        theme,
        finalShape,
        mods,
    ]);
    // Resolve dynamic icon props (skip resolution for 'checkbox' special value)
    const resolvedIcon = useMemo(() => {
        if (hasCheckbox) {
            return { content: null, hasSlot: true };
        }
        return resolveIcon(iconProp, baseMods);
    }, [iconProp, baseMods, hasCheckbox]);
    const resolvedRightIcon = useMemo(() => resolveIcon(rightIconProp, baseMods), [rightIconProp, baseMods]);
    // Determine which slot to use for loading when "auto" is selected
    // Must be computed before hasIconSlot/hasRightIconSlot since they depend on it
    const resolvedLoadingSlot = useMemo(() => {
        if (loadingSlot !== 'auto')
            return loadingSlot;
        // Auto logic: prefer icon if present, then rightIcon, fallback to icon
        if (resolvedRightIcon.hasSlot && !resolvedIcon.hasSlot)
            return 'rightIcon';
        return 'icon'; // fallback
    }, [loadingSlot, resolvedIcon.hasSlot, resolvedRightIcon.hasSlot]);
    // Determine if icon slots should render (original slot OR loading state targets this slot)
    const hasIconSlot = resolvedIcon.hasSlot || (isLoading && resolvedLoadingSlot === 'icon');
    const hasRightIconSlot = resolvedRightIcon.hasSlot ||
        (isLoading && resolvedLoadingSlot === 'rightIcon');
    const showDescription = useMemo(() => {
        const copyProps = { ...descriptionProps };
        delete copyProps.id;
        return !!(description || Object.keys(copyProps).length > 0);
    }, [description, descriptionProps]);
    // Apply loading state to appropriate slots
    const finalIcon = isLoading && resolvedLoadingSlot === 'icon' ? (_jsx(LoadingIcon, {})) : (resolvedIcon.content);
    const finalRightIcon = isLoading && resolvedLoadingSlot === 'rightIcon' ? (_jsx(LoadingIcon, {})) : (resolvedRightIcon.content);
    // Generate stable keys for icon transitions based on icon type
    const iconKey = hasCheckbox
        ? 'checkbox'
        : isLoading && resolvedLoadingSlot === 'icon'
            ? 'loading'
            : isValidElement(finalIcon)
                ? finalIcon.type?.displayName ||
                    finalIcon.type?.name ||
                    'icon'
                : finalIcon
                    ? 'icon'
                    : 'empty';
    const rightIconKey = isLoading && resolvedLoadingSlot === 'rightIcon'
        ? 'loading'
        : isValidElement(finalRightIcon)
            ? finalRightIcon.type?.displayName ||
                finalRightIcon.type?.name ||
                'icon'
            : finalRightIcon
                ? 'icon'
                : 'empty';
    const finalPrefix = isLoading && resolvedLoadingSlot === 'prefix' ? _jsx(LoadingIcon, {}) : prefix;
    // Build final suffix: loading icon, custom suffix, or HotKeys hint
    const finalSuffix = isLoading && resolvedLoadingSlot === 'suffix' ? (_jsx(LoadingIcon, {})) : (suffix ??
        (hotkeys ? (_jsx(HotKeys, { ...keyboardShortcutProps, type: type === 'primary' ? 'primary' : 'default', styles: { padding: '1x left', opacity: finalIsDisabled ? 0.5 : 1 }, children: hotkeys })) : undefined));
    // Register global hotkey if provided
    useHotkeys(typeof hotkeys === 'string' ? hotkeys.toLowerCase() : '', () => {
        if (!hotkeys)
            return;
        if (finalIsDisabled)
            return;
        // Simulate a click on the element so all existing handlers run
        if (ref && typeof ref === 'object' && ref.current) {
            ref.current.click();
        }
    }, {
        enableOnContentEditable: true,
        enabled: !!hotkeys,
        preventDefault: true,
        enableOnFormTags: true,
    }, [hotkeys, finalIsDisabled]);
    const finalMods = useMemo(() => {
        return {
            ...baseMods,
            'has-icon': hasIconSlot,
            'has-start-content': !!(hasIconSlot || finalPrefix),
            'has-end-content': !!(hasRightIconSlot || finalSuffix || actions),
            'has-right-icon': hasRightIconSlot,
            'has-label': hasLabel,
            'has-prefix': !!finalPrefix,
            'has-suffix': !!finalSuffix,
            'has-description': showDescription,
            'has-actions': !!actions,
            'has-actions-content': !!(actions && actions !== true),
            'auto-hide-actions': autoHideActions === true,
            'preserve-actions-space': preserveActionsSpace === true,
            'inside-wrapper': insideWrapper,
            'actions-shown': showActions && insideWrapper,
            checkbox: hasCheckbox,
            description: showDescription ? finalDescriptionPlacement : 'none',
        };
    }, [
        baseMods,
        hasIconSlot,
        hasRightIconSlot,
        finalPrefix,
        finalSuffix,
        showDescription,
        finalDescriptionPlacement,
        hasCheckbox,
        actions,
        autoHideActions,
        preserveActionsSpace,
        hasLabel,
        showActions,
        insideWrapper,
    ]);
    const { labelProps: finalLabelProps, labelRef, renderWithTooltip, } = useAutoTooltip({
        tooltip,
        children,
        labelProps,
        isDynamicLabel: !!actions,
    });
    // Process children with highlight if applicable
    const processedChildren = useMemo(() => {
        if (typeof children === 'string' && highlight) {
            return highlightText(children, highlight, highlightCaseSensitive, highlightStyles);
        }
        return children;
    }, [children, highlight, highlightCaseSensitive, highlightStyles]);
    // Render function that creates the item element
    const renderItemElement = (tooltipTriggerProps, tooltipRef) => {
        // Use callback ref to merge multiple refs without calling hooks
        const handleRef = (element) => {
            // Set the component's forwarded ref
            if (typeof ref === 'function') {
                ref(element);
            }
            else if (ref) {
                ref.current = element;
            }
            // Set the tooltip ref if provided
            if (tooltipRef) {
                tooltipRef.current = element;
            }
        };
        return (_jsxs(ItemElement, { ref: handleRef, variant: theme && type
                ? `${type === 'header' ? 'default' : theme}.${type === 'header' ? 'item' : type}`
                : undefined, disabled: finalIsDisabled, "aria-disabled": finalIsDisabled, "aria-selected": isSelected, mods: finalMods, styles: styles, tokens: sizeTokenValue ? { $size: sizeTokenValue } : undefined, type: htmlType, ...mergeProps(rest, tooltipTriggerProps || {}), style: style, children: [hasIconSlot && (_jsx("div", { "data-element": "Icon", children: _jsx(IconSwitch, { noWrapper: true, contentKey: iconKey, children: hasCheckbox ? _jsx(CheckIcon, {}) : finalIcon }) })), finalPrefix && _jsx("div", { "data-element": "Prefix", children: finalPrefix }), children || labelProps
                    ? (() => {
                        const LabelTag = type === 'header' || type === 'card'
                            ? `h${level}`
                            : 'div';
                        return (_jsx(LabelTag, { "data-element": "Label", ...finalLabelProps, ref: labelRef, children: processedChildren }));
                    })()
                    : null, showDescription ? (_jsx("div", { "data-element": "Description", ...descriptionProps, children: description })) : null, finalSuffix && _jsx("div", { "data-element": "Suffix", children: finalSuffix }), hasRightIconSlot && (_jsx("div", { "data-element": "RightIcon", children: _jsx(IconSwitch, { noWrapper: true, contentKey: rightIconKey, children: finalRightIcon }) })), actions && (_jsx("div", { "data-element": "Actions", ...ACTIONS_EVENT_HANDLERS, children: actions !== true ? (_jsx(ItemActionProvider, { type: type, theme: theme, disableActionsFocus: disableActionsFocus, isDisabled: finalIsDisabled, children: actions })) : null }))] }));
    };
    return renderWithTooltip(renderItemElement, defaultTooltipPlacement);
};
const _Item = Object.assign(forwardRef(Item), {
    Action: ItemAction,
    Badge: ItemBadge,
});
export { _Item as Item };
/**
 * @deprecated Use `Item` instead. This export will be removed in a future version.
 */
export { _Item as ItemBase };

        