/* @oracle/oraclejet-preact: undefined */
'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var jsxRuntime = require('preact/jsx-runtime');
var compat = require('preact/compat');
var hooks = require('preact/hooks');
var Flex = require('./Flex-3a257bc3.js');
var Label = require('./Label-eb654b0e.js');
var useDisplayValue = require('./useDisplayValue-4ace417c.js');
var Separator = require('./Separator-85962472.js');
require('./logger-2b636482.js');
var TabbableModeContext = require('./TabbableModeContext-e99d527e.js');
require('./LayerHost-3cd73603.js');


require('./UNSAFE_UserAssistance/themes/redwood/UserAssistanceVariants.css.js');
var InlineUserAssistance = require('./InlineUserAssistance-cfaa3d3e.js');


require('./UNSAFE_MessageBanner/themes/redwood/MessageBannerVariants.css.js');
require('preact');


require('./hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentVariants.css.js');
require('./tooltipUtils-2bc15136.js');

require('./IconButton-7503293b.js');

require('./MessageFormattingUtils-539d75b0.js');
require('./TransitionGroup-b239d98f.js');
require('./MessagesContext-4e939750.js');



require('./UNSAFE_ComponentMessage/themes/redwood/ComponentMessageVariants.css.js');
var FormFieldContext = require('./FormFieldContext-69fe83d2.js');
require('./Popup-de16d915.js');


require('./UNSAFE_Label/themes/redwood/LabelVariants.css.js');
require('./InputGroupContext-05f2a46f.js');

require('./UNSAFE_Popup/themes/redwood/PopupVariants.css.js');
var View = require('./View-ed116d78.js');
require('./FormContext-d1d05967.js');
var useFormContext = require('./useFormContext-a794f7b6.js');
var useLoadingIndicatorTimer = require('./useLoadingIndicatorTimer-128b4b14.js');
var useTextField = require('./useTextField-6ecf97b7.js');
var useTranslationBundle = require('./useTranslationBundle-12dd087d.js');
var keyboardUtils = require('./keyboardUtils-b42fe7d5.js');
var tabbableUtils = require('./tabbableUtils-22a50472.js');
var unsafeDomAccess = require('./unsafeDomAccess-c3a492f0.js');
var useSelectCommon = require('./useSelectCommon-27afecfa.js');
require('./useTestId-4f53d561.js');
require('./classNames-c14c6ef3.js');
require('./boxalignment-e287d370.js');
require('./size-1914356b.js');
require('./utils-c0efcd5e.js');
require('./themeContract.css-f3d431c6.js');
require('./colorUtils-01f3caa2.js');
require('./_curry1-e8f0d7ea.js');
require('./arrayUtils-7d8dcfc3.js');

require('./vanilla-extract-sprinkles-createRuntimeSprinkles.esm-d68f3e0f.js');
require('./dimensions-6101ca1f.js');
require('./flexbox-2cae9a01.js');

require('./flexitem-fee13e26.js');

require('./mergeInterpolations-6727b536.js');
require('./mergeDeepWithKey-210b024d.js');
require('./_curry3-18677bca.js');
require('./_curry2-c15d89cd.js');
require('./_isObject-28636267.js');

require('./useFormFieldContext-4632eb73.js');
require('./useComponentTheme-082fc8e4.js');
require('./useTooltip-34accecc.js');
require('./useTooltipControlled-0a95856c.js');
require('./useId-6c0eeb27.js');
require('./useHover-49b0430d.js');
require('./useToggle-3ebba7d8.js');
require('./useFocus-1b288fb9.js');
require('./useTouch-4dec8729.js');
require('./mergeProps-e3da7237.js');
require('./useAnimation-65c0e455.js');
require('./useThemeInterpolations-a37b37d9.js');
require('./useColorScheme-f8b1447d.js');
require('./useScale-db16c2b8.js');
require('./theme-dfd6a9fe.js');
require('./Theme-f06687af.js');
require('./useDensity-0b9fd9ca.js');
require('./hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentTheme.js');
require('./hooks/UNSAFE_useTooltip/themes/TooltipContentStyles.css.js');
require('./hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentBaseTheme.css.js');

require('./vanilla-extract-recipes-createRuntimeFn.esm-d1301b2d.js');
require('./clientHints-c40c5250.js');
require('./UNSAFE_Separator/themes/SeparatorStyles.css.js');

require('./CompactLabelAssistance-e910bb56.js');
require('./useTabbableMode-dbd254e8.js');
require('./Help-dbc23ccd.js');
require('./Icon-56789beb.js');
require('./UNSAFE_Icon/themes/IconStyle.css.js');
require('./useFocusWithin-eb7f956a.js');
require('./UNSAFE_UserAssistance/themes/UserAssistanceStyles.css.js');
require('./UNSAFE_Label/themes/redwood/LabelTheme.js');
require('./UNSAFE_Label/themes/LabelStyles.css.js');
require('./UNSAFE_Label/themes/redwood/LabelBaseTheme.css.js');
require('./truncationUtils-2d44b04b.js');
require('./UNSAFE_TextField/themes/redwood/TextFieldTheme.js');
require('./UNSAFE_TextField/themes/TextFieldStyles.css.js');



require('./UNSAFE_TextField/themes/redwood/TextFieldBaseTheme.css.js');

require('./UNSAFE_TextField/themes/redwood/TextFieldVariants.css.js');

require('./NavLeft-a33ac5d2.js');
require('./StyledTextField-7839c90d.js');
require('./useAccessibleContext-c49d8d1b.js');
require('./useTextFieldInputHandlers-850d395c.js');
require('./formControlUtils-596c9dc3.js');
require('./textAlign-f41f49db.js');

require('./TextFieldUtils-96baac38.js');
require('./UNSAFE_TextField/themes/FormControlUtilsStyles.css.js');

require('./UNSAFE_TextField/themes/redwood/TextFieldInputTheme.js');
require('./UNSAFE_TextField/themes/TextFieldInputStyles.css.js');

require('./UNSAFE_TextField/themes/redwood/TextFieldInputVariants.css.js');

require('./LabelValueLayout-d67109b3.js');
require('./StyledLabelValueLayout-48da61b9.js');

require('./UNSAFE_TextField/themes/redwood/FormLayoutTheme.js');
require('./UNSAFE_TextField/themes/FormLayoutStyles.css.js');
require('./UNSAFE_TextField/themes/redwood/FormLayoutBaseTheme.css.js');

require('./formControlUtils-31d8bc55.js');
require('./LayoutStyles.css-b4025421.js');

require('./UNSAFE_Skeleton/themes/redwood/SkeletonTheme.js');
require('./UNSAFE_Skeleton/themes/SkeletonStyles.css.js');
require('./UNSAFE_Skeleton/themes/redwood/SkeletonBaseTheme.css.js');

require('./UNSAFE_Skeleton/themes/redwood/SkeletonVariants.css.js');
require('./useInputGroupContext-4c10bd57.js');
require('./useUser-1295b5cb.js');
require('./UNSAFE_TextField/themes/redwood/ReadonlyTextFieldTheme.js');
require('./UNSAFE_TextField/themes/ReadonlyTextFieldStyles.css.js');

require('./UNSAFE_TextField/themes/redwood/ReadonlyTextFieldVariants.css.js');



require('./UNSAFE_TextField/themes/redwood/ReadonlyTextFieldInputVariants.css.js');
require('./TextField-5c164264.js');

require('./LiveRegion-62ce9ac7.js');
require('./index-0aa99b92.js');
require('./UNSAFE_Layer/themes/LayerHostStyles.css.js');

require('./ComponentMessageContainer-b692adf3.js');
require('./MessagesManager-cba4bc60.js');
require('./SuccessS-b6757c64.js');
require('./ErrorS-b027f7ad.js');
require('./InformationS-b0bb102b.js');
require('./WarningS-cdb0a7ad.js');
require('./PRIVATE_Message/themes/MessageStyles.css.js');
require('./soundUtils-ff3c9c0d.js');
require('./useMessagesContext-23d62331.js');
require('./Transition-942950ed.js');
require('./HiddenAccessible-087eb49a.js');
require('./UNSAFE_ComponentMessage/themes/redwood/ComponentMessageTheme.js');
require('./UNSAFE_ComponentMessage/themes/ComponentMessageStyles.css.js');
require('./UNSAFE_ComponentMessage/themes/redwood/ComponentMessageBaseTheme.css.js');
require('./UNSAFE_UserAssistance/themes/redwood/UserAssistanceTheme.js');
require('./UNSAFE_UserAssistance/themes/redwood/UserAssistanceBaseTheme.css.js');
require('./InlineHelp-2add2d34.js');

require('./EnvironmentProvider-5f2435e6.js');
require('./LayerManager-c535d963.js');
require('./Floating-79cbe5ad.js');
require('./useFloating-c753a7f9.js');
require('./positionUtils-a780137e.js');
require('./refUtils-a9872e75.js');
require('./useOutsideClick-dbf3d604.js');
require('./Layer-b60deb1b.js');
require('./UNSAFE_Layer/themes/LayerStyles.css.js');

require('./useModal-0739a528.js');
require('./UNSAFE_Floating/themes/redwood/FloatingTheme.js');
require('./UNSAFE_Floating/themes/FloatingStyles.css.js');

require('./UNSAFE_Floating/themes/redwood/FloatingBaseTheme.css.js');

require('./UNSAFE_Floating/themes/redwood/FloatingVariants.css.js');
require('./vanilla-extract-dynamic.esm-2e1b7c25.js');
require('./UNSAFE_Floating/themes/FloatingContract.css.js');
require('./useUnsafeDomElementRef-f22a2f0c.js');
require('./BaseButton-d8f96bfa.js');
require('./useActive-6770f917.js');
require('./UNSAFE_BaseButton/themes/redwood/BaseButtonTheme.js');
require('./UNSAFE_BaseButton/themes/BaseButtonStyles.css.js');

require('./UNSAFE_BaseButton/themes/redwood/BaseButtonVariants.css.js');

require('./BareButton-e8a030d7.js');
require('./useBareButton-463210c9.js');
require('./usePress-886180e4.js');
require('./usePressClick-7a34624a.js');
require('./buttonUtils-dff2ea3e.js');
require('./id-86356250.js');
require('./ButtonLabelLayout-c876923f.js');
require('./Text-056f1ec5.js');
require('./UNSAFE_Text/themes/TextStyles.css.js');

require('./useButtonLabelLayoutTheme-d09db0c9.js');
require('./UNSAFE_ButtonLabelLayout/themes/redwood/ButtonLabelLayoutTheme.js');
require('./UNSAFE_ButtonLabelLayout/themes/ButtonLabelLayoutStyles.css.js');

require('./UNSAFE_ButtonLabelLayout/themes/redwood/ButtonLabelLayoutBaseTheme.css.js');

require('./UNSAFE_ButtonLabelLayout/themes/redwood/ButtonLabelLayoutVariants.css.js');

require('./getLocale-8e17dc46.js');
require('./stringUtils-3e19c8af.js');
require('./FocusTrap-4873a3f2.js');
require('./FocusTracker-e2ea43c3.js');
require('./PRIVATE_FocusTracker/themes/FocusTrackerStyles.css.js');

require('./Modal-b751b643.js');
require('./UNSAFE_Modal/themes/ModalStyles.css.js');

require('./popupUtils-1d123cbe.js');
require('./WindowOverlay-85d999fa.js');
require('./UNSAFE_WindowOverlay/themes/WindowOverlayStyles.css.js');

require('./UNSAFE_WindowOverlay/themes/WindowOverlayContract.css.js');
require('./UNSAFE_WindowOverlay/themes/redwood/WindowOverlayTheme.js');
require('./UNSAFE_WindowOverlay/themes/redwood/WindowOverlayBaseTheme.css.js');

require('./UNSAFE_WindowOverlay/themes/redwood/WindowOverlayVariants.css.js');
require('./usePopupAnimation-f3b34413.js');
require('./useAnimationStatus-8075dc19.js');
require('./popupAnimationUtils-dcace427.js');
require('./UNSAFE_Popup/themes/PopupContract.css.js');
require('./UNSAFE_Popup/themes/redwood/PopupTheme.js');
require('./UNSAFE_Popup/themes/redwood/PopupBaseTheme.css.js');

require('./colors-f3ce979a.js');
require('./borders-4b8488cb.js');
require('./padding-ba041f6a.js');
require('./aria-889aedd0.js');
require('./equals-098f7781.js');
require('./_isArray-73160ad5.js');
require('./_isString-f4443c9e.js');
require('./useTimer-fa00fb49.js');
require('./useMessageSeverity-cfc4ae9d.js');
require('./useFormFieldContextProps-0fa67f6c.js');
require('./head-68d0992f.js');
require('./_arity-c228159c.js');
require('./HighlightText-f4535f3d.js');

require('./Grid-cef20569.js');
require('./grid-7c06084e.js');


require('./ListItemText-3e93c76c.js');
require('./PRIVATE_SelectCommon/themes/dropdownStyles.css.js');

require('./List-afcfa338.js');
require('./keys-25710458.js');
require('./collectionUtils-f1d3183f.js');
require('./Selector-6550b8e0.js');
require('./BaseSelector-2dc69917.js');
require('./StyledCheckbox-9047ed7d.js');
require('./Check-1272bb86.js');
require('./CheckboxOff-a3ed334d.js');
require('./CheckboxOn-b5dda28b.js');
require('./CheckboxMixed-a17c8298.js');
require('./UNSAFE_Checkbox/themes/CheckboxIconContract.css.js');
require('./UNSAFE_Checkbox/themes/redwood/CheckboxIconTheme.js');
require('./UNSAFE_Checkbox/themes/CheckboxIconStyles.css.js');

require('./UNSAFE_Checkbox/themes/redwood/CheckboxIconBaseTheme.css.js');

require('./UNSAFE_Checkbox/themes/redwood/CheckboxIconVariants.css.js');


require('./PRIVATE_BaseSelector/themes/SelectorStyles.css.js');

require('./CollectionInteractionContext-f84ff7a1.js');
require('./useCollectionInteractionContext-6fc0200e.js');
require('./LoadMoreCollection-eb1f2603.js');
require('./Collection-e27077ff.js');
require('./useViewportIntersect-2e802bac.js');
require('./VirtualizedCollection-a90800c7.js');
require('./useNavigation-fa3f5a50.js');
require('./useCurrentKey-1b9e3382.js');
require('./useReorderableContext-92514102.js');
require('./ReorderableContext-16396e17.js');
require('./useCollectionFocusRing-bed0aa16.js');
require('./useTabbableModeSet-5bce852a.js');
require('./useInteractionStyle-c203a8a0.js');
require('./PRIVATE_List/themes/ListStyles.css.js');


require('./Skeleton-8e35c7d1.js');
require('./ImageVars.css-3fbb1c0b.js');
require('./useTheme-2a034a21.js');
require('./useSelection-37939f09.js');
require('./textSelectionUtils-57082239.js');
require('./useAdditiveSelection-bf845689.js');
require('./useItemAction-66c2387c.js');
require('./Inset-69f359cd.js');
require('./UNSAFE_Inset/themes/InsetStyles.css.js');


require('./CaretDown-bdf57d9c.js');

/**
 * @license
 * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.
 * The Universal Permissive License (UPL), Version 1.0
 * as shown at https://oss.oracle.com/licenses/upl/
 * @ignore
 */
/**
 * A custom hook for determining prop values for the InlineSelectSingle's child
 * components from its own props.
 * @param param0 options
 * @param ref The ref handle of the component.
 */
function useInlineSelectSingle({ 'aria-describedby': ariaDescribedBy, assistiveText, data, hasBackIcon = 'never', hasClearIcon = 'never', helpSourceLink, helpSourceText, isLoading: propIsLoading, itemText, label, onBackIconAction, onCommit: propOnCommit, onFilter, placeholder, textAlign: propTextAlign, valueItem, virtualKeyboard }, ref) {
    const inputRef = hooks.useRef(null);
    const { textAlign: formTextAlign } = useFormContext.useFormContext();
    const textAlign = propTextAlign ?? formTextAlign ?? 'start';
    const isDataFetched = data != null && !useSelectCommon.isBeforeDataFetch(data);
    const isEmptyResults = isDataFetched && data?.totalSize === 0;
    // Refs to keep track of prop changes and sync internal state
    const prevDataRef = hooks.useRef(data);
    const prevValueItemRef = hooks.useRef(valueItem);
    const isInitialRender = hooks.useRef(true);
    // State for holding the selected keys in the list
    const [selectedKeys, setSelectedKeys] = hooks.useState(valueItem === undefined ? undefined : new Set([valueItem.key]));
    // The incoming propIsLoading tells us that we are in a loading state, but we don't want to
    // show the loading indicator until after a delay, because showing it immediately could result
    // in unwanted flashing.  The isLoading var below will be set to true by useLoadingIndicatorTimer
    // after the delay, when the timer expires, at which point we should show the loading indicator.
    // If propIsLoading is set to false before the timer expires, then the timer will be cancelled
    // and no loading indicator will be shown.
    // (ListView detects its loading state by checking data === null.  While it would be nice for
    // us to be consistent and check valueItems === null, we need to use a separate isLoading prop.
    // If valueItems === null triggers our loading state, then the selections in the dropdown
    // are cleared for that period of time, which is undesirable.)
    const isLoading = useLoadingIndicatorTimer.useLoadingIndicatorTimer(propIsLoading ?? false);
    const displayValue = useDisplayValue.useDisplayValue(itemText, valueItem, 'InlineSelectSingle');
    // add methods to the ref
    hooks.useImperativeHandle(ref, () => ({
        focus: () => inputRef.current?.focus(),
        blur: () => inputRef.current?.blur(),
        [unsafeDomAccess.UNSAFE_DOM_ACCESS]: inputRef.current
    }), []);
    const { currentRowKeyRef, currentRowOverride, dropdownRef, isFocused, isUserFiltering, onCurrentKeyChange, searchText, setCurrentRowOverride, stopFiltering, updateFiltering, userInput } = useSelectCommon.useSelectCommon({
        data,
        inputRef,
        // The component can only be in a focused visual state
        isFocused: true,
        onFilter
    });
    const { baseId, formFieldContext, inputProps, labelProps, userAssistanceProps } = useTextField.useTextField({
        ariaDescribedBy,
        helpSourceLink,
        helpSourceText,
        isFocused,
        isLoading,
        value: valueItem !== undefined ? true : undefined
    });
    const listId = `${baseId}-list`;
    // If we're waiting for the selected values to load, the component should look like it
    // has a value in the meantime.
    // Use the original propIsLoading instead of isLoading because we don't want to delay
    // the inside label position by a timer like we do the progressive loading indicator.
    formFieldContext.hasValue = propIsLoading || formFieldContext.hasValue;
    const translations = useTranslationBundle.useTranslationBundle('@oracle/oraclejet-preact');
    const liveRegionText = isDataFetched
        ? data?.totalSize === 0
            ? translations.select_noMatchesFound()
            : data?.totalSize === 1
                ? translations.select_oneMatchFound()
                : data?.sizePrecision === 'exact'
                    ? translations.select_sizeMatchesFound({ TOTAL_SIZE: `${data?.totalSize}` })
                    : translations.select_sizeOrMoreMatchesFound({ TOTAL_SIZE: `${data?.totalSize}` })
        : '';
    /**
     * Lifecycle updates
     */
    // When the valueItem changes, save the new selectedKeys
    if (prevValueItemRef.current !== valueItem) {
        prevValueItemRef.current = valueItem;
        setSelectedKeys(valueItem === undefined ? undefined : new Set([valueItem.key]));
    }
    // When data changes, highlight the first result
    if (prevDataRef.current !== data) {
        prevDataRef.current = data;
        // when filtering, set the first result of the filtered data set to be the current item
        // (check the data offset so we don't try to highlight again if the user scrolls through
        // the list and more data is fetched)
        if (isUserFiltering && data != null && data.offset === 0 && data.data.length > 0) {
            // if there are results and search text, highlight the first row, otherwise clear
            // an existing highlight
            setCurrentRowOverride({
                rowKey: !useSelectCommon.isSearchTextEmptyOrUndefined(searchText) ? data.data[0].metadata.key : undefined
            });
        }
    }
    // During the initial render, set the current row override if we have selected values.
    // This way pressing DOWN arrow will start the navigation from the selected row.
    if (isInitialRender.current) {
        isInitialRender.current = false;
        setCurrentRowOverride({ rowKey: [...(selectedKeys ?? [undefined])][0] });
    }
    /**
     * A helper onCommit wrapper that consumes the metadata and calls the
     * propOnCommit with only the necessary information.
     * (Similar to onCommit in useSelectSingle.ts)
     */
    const onCommit = hooks.useCallback((value, metadata) => {
        propOnCommit?.({
            value: value,
            previousValue: valueItem !== undefined ? valueItem.key : undefined,
            reason: metadata.reason
        });
    }, [propOnCommit, valueItem]);
    /**
     * A helper function to clear the selectedKeys and commits empty value.
     * (Similar to clearValue in useSelectSingle.ts but without dropdown related logic)
     */
    const clearValue = hooks.useCallback((metadata) => {
        setSelectedKeys(new Set());
        // call the onCommit callback so that the consuming code can update the valueItem
        onCommit(undefined, metadata);
    }, [onCommit]);
    /**
     * Determine if we need to clear the value because the user has deleted all the text.
     * (Similar to isClearValueNeeded in useSelectSingle.ts)
     */
    const isClearValueNeeded = hooks.useCallback(() => {
        return isUserFiltering && userInput === '' && valueItem !== undefined;
    }, [isUserFiltering, userInput, valueItem]);
    /**
     * Handler for List.onItemAction
     * (Similar to useSelectSingle.ts's onItemAction but without dropdown related logic)
     * This is used for handling:
     * - Commits value when one performs an action on the list
     */
    const handleItemAction = hooks.useCallback((detail) => {
        // after selecting a value, the user is no longer actively filtering, so update related
        // state accordingly so that the newly selected value appears in the field
        stopFiltering();
        const newKey = detail.context.key;
        // update the selectedKeys so that the selection visual state of the collection
        // updates immediately while waiting for a new valueItem to be set
        setSelectedKeys(new Set([newKey]));
        // call the onCommit callback so that the consuming code can update the valueItem
        onCommit(newKey, { reason: 'itemAction' });
    }, [onCommit, stopFiltering]);
    /**
     * Handler for SelectSingleFieldInput.onInput
     * This is used for handling:
     * - Typing in text in the field should filter the results (i.e. invoke onFilter with the text)
     */
    const handleFieldInput = hooks.useCallback(({ value }) => {
        updateFiltering(value);
        onFilter?.({ searchText: value });
    }, [onFilter, updateFiltering]);
    /**
     * Handler for SelectSingleFieldInput.onKeyDown
     * This is used for handling:
     * - Prevents default browser behavior on UP/DOWN to avoid scrolling
     * - Clears value or selects current row on ENTER
     * - Clears value or selects current row on TAB
     */
    const handleFieldKeyDown = hooks.useCallback((event) => {
        // ignore ctrl and fn key events
        if (keyboardUtils.isControlOrFunctionKey(event))
            return;
        switch (event.code) {
            case keyboardUtils.KEYS.UP:
            case keyboardUtils.KEYS.DOWN:
                // prevent the default action, since we do not want the page to scroll
                event.preventDefault();
                break;
            case keyboardUtils.KEYS.ENTER:
            case keyboardUtils.KEYS.TAB: {
                // if this is on a mobile device (only phone and not in tablet devices), do not do anything
                if (useSelectCommon.isPhone())
                    return;
                // Otherwise, proceed
                const commitMetadata = {
                    reason: event.code === keyboardUtils.KEYS.TAB ? 'tabKey' : 'itemAction'
                };
                // check to see if we need to clear the value
                if (isClearValueNeeded()) {
                    // in this case, clear the value and return.
                    clearValue(commitMetadata);
                    return;
                }
                // if there is no data to select, no need to handle this event
                if (data == null || data.data.length === 0)
                    return;
                // If we will be making a selection, the user is no longer actively filtering,
                // so update related state accordingly so that the newly selected value appears in the field.
                stopFiltering();
                // Current design have this component in a dropdown/modal. So, pressing Tab from
                // the main field without doing any other interaction is still considered a selection
                // unlike SelectSingle (see JET-68215). So, we handle both Enter and Tab similarly.
                // If there is a currentRow in the dropdown (meaning a highlighted item that would
                // have keyboard focus if the dropdown list had physical focus, which may be different
                // from the currently selected item), select it and commit it.
                if (currentRowKeyRef.current !== undefined && data != null && data.data.length > 0) {
                    setSelectedKeys(new Set([currentRowKeyRef.current]));
                    onCommit(currentRowKeyRef.current, commitMetadata);
                    return;
                }
                // Otherwise commit the currently selected value again so that a valueAction event
                // can be fired from the core-pack side.
                onCommit(valueItem?.key ?? undefined, commitMetadata);
                break;
            }
        }
    }, [clearValue, currentRowKeyRef, data, isClearValueNeeded, onCommit, stopFiltering, valueItem]);
    /**
     * Handler for SelectSingleFieldInput.onKeyUp
     * This is used for handling:
     * - Pressing UP/DOWN from the main field should move the focus to the list
     * - If Ctrl or Fn key is pressed, then ignore the event
     */
    const handleFieldKeyUp = hooks.useCallback((event) => {
        // ignore ctrl and fn key events
        if (keyboardUtils.isControlOrFunctionKey(event))
            return;
        switch (event.code) {
            case keyboardUtils.KEYS.UP:
            case keyboardUtils.KEYS.DOWN:
                // Transfer physical focus into the dropdown only if the data is present and the dropdown
                // has rendered the data. Otherwise, keep the focus in the field.
                if (data != null && dropdownRef.current) {
                    // get the focusable element from the dropdown.
                    // consider element with tabindex=-1 as well.
                    const firstFocusableElem = tabbableUtils.allTabbableElements(dropdownRef.current, undefined, true)[0];
                    // focus the first element if it exists
                    firstFocusableElem?.focus();
                    // set the first row as current row if there is no current row at the moment
                    if (currentRowOverride.rowKey === undefined) {
                        setCurrentRowOverride({ rowKey: data.data[0]?.metadata?.key });
                    }
                }
                // prevent the default action, since we are handling it
                event.preventDefault();
                break;
        }
    }, [currentRowOverride, data, dropdownRef, setCurrentRowOverride]);
    /**
     * Handler for DropdownList.onKeyDown
     * This is used for handling:
     * - Pressing Tab when highlighted on a list item should select & commit that item as value
     */
    const handleListKeyDown = hooks.useCallback((event) => {
        switch (event.code) {
            case keyboardUtils.KEYS.TAB:
                // if there is a currentRow in the dropdown, select it and commit it
                if (currentRowKeyRef.current !== undefined && data != null && data.data.length > 0) {
                    setSelectedKeys(new Set([currentRowKeyRef.current]));
                    onCommit(currentRowKeyRef.current, { reason: 'tabKey' });
                }
                break;
        }
    }, [currentRowKeyRef, data, onCommit]);
    /**
     * Handler for ClearButton.onClick
     * This is for handling:
     * - on clicking the clear icon, the value & selection should be cleared.
     */
    const handleClearButtonClick = hooks.useCallback(() => {
        // reset the user filter and the value of the component
        stopFiltering();
        // clear the value
        clearValue({ reason: 'itemAction' });
        // set focus to the input
        inputRef.current?.focus();
        // call onFilter with undefined
        onFilter?.({ searchText: undefined });
    }, [clearValue, onFilter, stopFiltering]);
    /**
     * Create collection Renderer context. This will be used by the default
     * collectionRenderer.
     */
    const collectionRendererContext = useSelectCommon.useCollectionRenderer({
        currentKey: currentRowOverride.rowKey,
        searchText,
        selectedKeys,
        onCurrentKeyChange,
        onItemAction: handleItemAction
    });
    // TODO: JET-73973 - ListView is not respecting TabbableMode
    // Currently List does not respect TabbableMode, so for now explicitly set tabindex="-1".
    // When this bug is fixed, this useEffect can be removed.
    hooks.useEffect(() => {
        const list = dropdownRef.current?.querySelector('div[role="listbox"][tabindex="0"]');
        list?.setAttribute('tabindex', '-1');
    });
    return {
        collectionRendererContext,
        formFieldContext,
        hasUserAssistance: Boolean(assistiveText || helpSourceLink),
        isEmptyResults,
        isUserFiltering,
        labelProps: {
            ...labelProps,
            children: label
        },
        listContainerProps: {
            id: listId,
            dropdownListRef: dropdownRef,
            onKeyDown: handleListKeyDown
        },
        selectSingleFieldProps: {
            contentVariant: 'input',
            // InlineSelectSingle currently only supports inside label.
            hasInsideLabel: true,
            isBackButtonShown: hasBackIcon === 'always',
            isClearButtonShown: hasClearIcon === 'conditionally' && valueItem !== undefined,
            onBackButtonClick: onBackIconAction,
            onClearButtonClick: handleClearButtonClick,
            styleVariant: 'embedded'
        },
        selectFieldInputProps: {
            ...inputProps,
            'aria-controls': listId,
            // InlineSelectSingle always have the list open, so it will always be in an expanded state.
            'aria-expanded': true,
            displayValue,
            // InlineSelectSingle currently only supports inside label,
            // so it is expected to always have a label.
            hasEmptyLabel: false,
            // InlineSelectSingle currently only supports inside label.
            hasInsideLabel: true,
            inputRef,
            // InlineSelectSingle currently does not support Add to List.
            isAddToListShown: false,
            // InlineSelectSingle currently does not support Advanced Search.
            isAdvancedSearchShown: false,
            // InlineSelectSingle currently does not support Required.
            isRequired: false,
            isUserFiltering,
            liveRegionText,
            onInput: handleFieldInput,
            onKeyDown: handleFieldKeyDown,
            onKeyUp: handleFieldKeyUp,
            placeholder,
            textAlign,
            userInput,
            variant: 'embedded',
            virtualKeyboard
        },
        userAssistanceProps: {
            ...userAssistanceProps,
            assistiveText,
            fieldLabel: label,
            helpSourceLink,
            helpSourceText
        }
    };
}

const PREVENT_TABBING = { isTabbable: false };
/**
 * A InlineSelectSingle is a text field with an inline list that supports single selection and search filtering.
 * Note: This is only meant to be used by the Spectra Smart Search component. As such, it only has limited features
 * needed for the Smart Search component.
 */
function InlineSelectSingleImpl(props, ref) {
    const { data, itemRenderer, itemText, label, onLoadRange, testId, userAssistancePosition = 'belowList' } = props;
    const { collectionRendererContext, formFieldContext, hasUserAssistance, isEmptyResults, isUserFiltering, labelProps, listContainerProps, selectSingleFieldProps, selectFieldInputProps, userAssistanceProps } = useInlineSelectSingle(props, ref);
    const defaultCollectionRenderer = hooks.useCallback(({ onPersistCurrentRowKey, onRowAction, selected, searchText, currentRowKeyOverride }) => (jsxRuntime.jsx(useSelectCommon.DefaultList, { "aria-label": label, componentName: "InlineSelectSingle", currentItemVariant: "highlight", currentKey: currentRowKeyOverride, data: data, itemRenderer: itemRenderer, itemText: itemText, onCurrentKeyChange: onPersistCurrentRowKey, onItemAction: onRowAction, onLoadRange: onLoadRange, searchText: isUserFiltering ? searchText : undefined, selectedKeys: selected, selectionMode: "single" })), [data, isUserFiltering, itemRenderer, itemText, label, onLoadRange]);
    const userAssistance = (jsxRuntime.jsx(View.View, { minWidth: "100%", padding: "2x", children: jsxRuntime.jsx(InlineUserAssistance.InlineUserAssistance, { testId: testId && `${testId}_userAssistance`, ...userAssistanceProps }) }));
    return (jsxRuntime.jsx(Flex.Flex, { direction: "column", gap: "2x", maxHeight: "100%", width: "100%", children: jsxRuntime.jsxs(FormFieldContext.FormFieldContext.Provider, { value: formFieldContext, children: [jsxRuntime.jsxs(View.View, { flex: 0, children: [jsxRuntime.jsx(useDisplayValue.SelectSingleField, { ...selectSingleFieldProps, label: jsxRuntime.jsx(Label.Label, { ...labelProps }), testId: testId && `${testId}_selectSingleField`, children: jsxRuntime.jsx(useDisplayValue.SelectSingleFieldInput, { ...selectFieldInputProps }) }), userAssistancePosition === 'aboveList' && jsxRuntime.jsx(Separator.Separator, {}), userAssistancePosition === 'aboveList' && hasUserAssistance && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [userAssistance, jsxRuntime.jsx(Separator.Separator, {})] }))] }), userAssistancePosition !== 'aboveList' && jsxRuntime.jsx(Separator.Separator, {}), jsxRuntime.jsx(useSelectCommon.DropdownList, { ...listContainerProps, 
                    // Add bottom gap only when we are configured to show UA above the list
                    hasBottomGap: userAssistancePosition === 'aboveList', hasTopGap: false, children: jsxRuntime.jsx(TabbableModeContext.TabbableModeContext.Provider, { value: PREVENT_TABBING, children: isEmptyResults ? (jsxRuntime.jsx(useSelectCommon.EmptyResults, {})) : (defaultCollectionRenderer(collectionRendererContext)) }) }), userAssistancePosition === 'belowList' && hasUserAssistance && (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Separator.Separator, {}), userAssistance] }))] }) }));
}
const InlineSelectSingle = compat.forwardRef(InlineSelectSingleImpl); // forwardRef will remove generics, so we cast it explicitly to preserve generics.;

exports.InlineSelectSingle = InlineSelectSingle;
//# sourceMappingURL=UNSAFE_InlineSelectSingle.js.map
