@oracle/oraclejet-preact 15.1.11 → 15.1.13

package/cjs/SelectSingle-cd12aa57.js

@@ -0,0 +1,384 @@
+/* @oracle/oraclejet-preact: 15.1.13 */
+'use strict';
+
+var jsxRuntime = require('preact/jsx-runtime');
+var preact = require('preact');
+var compat = require('preact/compat');
+var hooks_UNSAFE_useFocusableTextField = require('./hooks/UNSAFE_useFocusableTextField.js');
+var hooks_UNSAFE_useFormContext = require('./hooks/UNSAFE_useFormContext.js');
+var hooks_UNSAFE_useFormFieldContext = require('./hooks/UNSAFE_useFormFieldContext.js');
+var hooks_UNSAFE_useLoadingIndicatorTimer = require('./hooks/UNSAFE_useLoadingIndicatorTimer.js');
+var hooks_UNSAFE_useTextField = require('./hooks/UNSAFE_useTextField.js');
+require('./UNSAFE_Label.js');
+var UNSAFE_LiveRegion = require('./UNSAFE_LiveRegion.js');
+var UNSAFE_TextField = require('./UNSAFE_TextField.js');
+var UNSAFE_UserAssistance = require('./UNSAFE_UserAssistance.js');
+var PRIVATE_SelectCommon = require('./PRIVATE_SelectCommon.js');
+var hooks = require('preact/hooks');
+var utils_UNSAFE_mergeProps = require('./utils/UNSAFE_mergeProps.js');
+var hooks_UNSAFE_useTranslationBundle = require('./hooks/UNSAFE_useTranslationBundle.js');
+var Label = require('./Label-917072a8.js');
+var ReadonlyTextFieldInput = require('./ReadonlyTextFieldInput-6aceaf64.js');
+var TextFieldInput = require('./TextFieldInput-1b3e2ddd.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
+ */
+function useDisplayValue(itemText, valueItem) {
+    // create the text displayed in the field from the selected value
+    const displayValue = hooks.useMemo(() => {
+        return valueItem === undefined ? '' : PRIVATE_SelectCommon.renderItemText(valueItem, itemText) ?? '';
+    }, [valueItem, itemText]);
+    return displayValue;
+}
+
+/**
+ * @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
+ */
+/**
+ * Hook that manages SelectSingle state and behavior.  This hook creates state variables and
+ * event listeners, returning properties to apply to components internally rendered by
+ * SelectSingle, as well as state information.
+ *
+ * @param data Specifies data for the dropdown list.
+ * @param inputRef Ref to the input element.
+ * @param isDisabled Specifies whether the component is disabled.
+ * @param isFocused Specifies whether the component has focus.
+ * @param isReadonly Specifies whether the component is readonly.
+ * @param onCommit Callback invoked when the selected value is committed.
+ * @param onFilter Callback function to trigger loading data for the dropdown list,
+ * which may or may not be filtered by user entered text.
+ * @param valueItem Specifies the key, data, and optional metadata for the selected value.
+ *
+ * @returns Properties to apply to internal components that SelectSingle renders, and component
+ * state.
+ */
+function useSelectSingle({ data, inputRef, isDisabled, isFocused: propIsFocused, isReadonly, onCommit: propOnCommit, onFilter, valueItem }) {
+    const { currentRow, dropdownRef, handleDropdownArrowClick, handleDropdownAutoDismiss: baseHandleDropdownAutoDismiss, handleDropdownPosition, handleInput, handleMainFieldKeyDown: baseHandleMainFieldKeyDown, handleMainFieldKeyUp, isDropdownAbove, isDropdownOpen, isFocused, isUserFiltering, mainFieldRef, onCurrentKeyChange, onMouseDown, searchText, selectedKeys, setCurrentRow, setDropdownOpen, setSelectedKeys, stopFiltering, userInput } = PRIVATE_SelectCommon.useSelectCommon({
+        data,
+        inputRef,
+        isFocused: propIsFocused,
+        onFilter
+    });
+    // refs used by some of the effects below to determine whether the effect needs to run,
+    // for when the list of dependencies is longer than what we want the trigger to actually be
+    const prevDataRef = hooks.useRef(data);
+    const prevDropdownOpenRef = hooks.useRef(isDropdownOpen);
+    const prevSearchText = hooks.useRef(searchText);
+    const onCommit = hooks.useCallback((value) => {
+        propOnCommit?.({
+            value: value,
+            previousValue: valueItem !== undefined ? valueItem.key : undefined
+        });
+    }, [propOnCommit, valueItem]);
+    const clearValue = hooks.useCallback(() => {
+        setDropdownOpen(false);
+        setSelectedKeys(new Set());
+        // call the onCommit callback so that the consuming code can update the valueItem
+        onCommit(undefined);
+    }, [onCommit]);
+    const clearValueIfNeeded = hooks.useCallback(() => {
+        if (isUserFiltering && userInput === '' && valueItem !== undefined) {
+            clearValue();
+            return true;
+        }
+        return false;
+    }, [clearValue, isUserFiltering, userInput, valueItem]);
+    // when the field loses focus, check to see if we need to clear the value
+    hooks.useEffect(() => {
+        if (!isFocused) {
+            clearValueIfNeeded();
+        }
+        // only run when focus changes, at which point the current value of clearValueIfNeeded will
+        // be used
+    }, [isFocused]);
+    const focusInput = hooks.useCallback(() => {
+        inputRef.current?.focus();
+    }, []);
+    const removeDropdown = hooks.useCallback(() => {
+        dropdownRef.current?.parentElement?.removeChild(dropdownRef.current);
+    }, []);
+    const myHandleDropdownAutoDismiss = hooks.useCallback((event) => {
+        if (isDropdownOpen) {
+            if (event?.type === 'keydown') {
+                const keyboardEvent = event;
+                switch (keyboardEvent.code) {
+                    case PRIVATE_SelectCommon.KEYS.TAB:
+                        // if there is a currentRow in the dropdown, select it and commit it
+                        if (currentRow !== undefined && currentRow.rowKey !== undefined) {
+                            setSelectedKeys(new Set([currentRow.rowKey]));
+                            onCommit(currentRow.rowKey);
+                        }
+                        // Put focus on an element in the main field, but don't kill the event, so that
+                        // the browser can naturally transfer focus to the next focusable item relative
+                        // to the element in the main field.
+                        focusInput();
+                        // Remove the dropdown immediately, without waiting for a rerender based on changing
+                        // state, so that the open dropdown cannot get focus when the browser handles the
+                        // Tab key.
+                        removeDropdown();
+                        break;
+                    default:
+                        break;
+                }
+            }
+        }
+    }, [currentRow, focusInput, isDropdownOpen, onCommit]);
+    const myHandleMainFieldKeyDown = hooks.useCallback((event) => {
+        // ignore control key and function key
+        if (PRIVATE_SelectCommon.isControlOrFunctionKey(event)) {
+            return;
+        }
+        switch (event.code) {
+            case PRIVATE_SelectCommon.KEYS.TAB:
+                // check whether we need to clear the value;
+                // if not, check whether we need to select the current item
+                const isValueClearedTab = clearValueIfNeeded();
+                if (!isValueClearedTab && isDropdownOpen && data != null && data.data.length > 0) {
+                    // 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;
+                    // otherwise commit the currently selected value again so that a valueAction event
+                    // will be fired
+                    if (currentRow !== undefined && currentRow.rowKey !== undefined) {
+                        setSelectedKeys(new Set([currentRow.rowKey]));
+                        onCommit(currentRow.rowKey);
+                    }
+                    else {
+                        onCommit(valueItem?.key ?? undefined);
+                    }
+                }
+                // Remove the dropdown immediately, without waiting for a rerender based on changing
+                // state, so that the open dropdown cannot get focus when the browser handles the
+                // Tab key.
+                removeDropdown();
+                setDropdownOpen(false);
+                break;
+            case PRIVATE_SelectCommon.KEYS.ENTER:
+                // check whether we need to clear the value;
+                // if not, check whether we need to select the current item
+                const isValueCleared = clearValueIfNeeded();
+                if (!isValueCleared && isDropdownOpen && data != null && data.data.length > 0) {
+                    setDropdownOpen(false);
+                    // 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();
+                    // if there is a currentRow in the dropdown, select it and commit it;
+                    // otherwise commit the currently selected value again
+                    if (currentRow !== undefined && currentRow.rowKey !== undefined) {
+                        setSelectedKeys(new Set([currentRow.rowKey]));
+                        onCommit(currentRow.rowKey);
+                    }
+                    else {
+                        onCommit(valueItem?.key ?? undefined);
+                    }
+                }
+                break;
+            default:
+                break;
+        }
+    }, [clearValueIfNeeded, currentRow, data, isDropdownOpen, onCommit, valueItem]);
+    // when the valueItem changes, save the new selectedKeys
+    hooks.useEffect(() => {
+        setSelectedKeys(valueItem === undefined ? undefined : new Set([valueItem.key]));
+    }, [valueItem]);
+    const onItemAction = hooks.useCallback((detail) => {
+        focusInput();
+        setDropdownOpen(false);
+        // 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.metadata.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);
+    }, [focusInput, onCommit]);
+    hooks.useEffect(() => {
+        // only run this effect when data changes because we need to wait for the new set of
+        // filtered data to be set before highlighting the first result
+        if (data === prevDataRef.current) {
+            return;
+        }
+        // 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 (isDropdownOpen &&
+            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
+            setCurrentRow({
+                rowKey: searchText !== undefined && searchText?.length > 0 ? data.data[0].metadata.key : undefined
+            });
+        }
+    }, [data, isDropdownOpen, isUserFiltering, searchText]);
+    hooks.useEffect(() => {
+        // only run this effect when the state of the dropdown changes
+        if (isDropdownOpen === prevDropdownOpenRef.current) {
+            return;
+        }
+        // clear the current item when the dropdown opens if there is no filter text
+        if (isDropdownOpen &&
+            (!isUserFiltering || searchText === undefined || searchText.length === 0)) {
+            setCurrentRow({ rowKey: undefined });
+        }
+    }, [isDropdownOpen, isUserFiltering, searchText]);
+    const dropdownEventHandlers = hooks.useMemo(() => {
+        return utils_UNSAFE_mergeProps.mergeProps({
+            onAutoDismiss: baseHandleDropdownAutoDismiss,
+            onPosition: handleDropdownPosition
+        }, { onAutoDismiss: myHandleDropdownAutoDismiss });
+    }, [baseHandleDropdownAutoDismiss, handleDropdownPosition, myHandleDropdownAutoDismiss]);
+    const inputEventHandlers = hooks.useMemo(() => {
+        return utils_UNSAFE_mergeProps.mergeProps({
+            onInput: handleInput,
+            onKeyDown: baseHandleMainFieldKeyDown,
+            onKeyUp: handleMainFieldKeyUp
+        }, { onKeyDown: myHandleMainFieldKeyDown });
+    }, [baseHandleMainFieldKeyDown, handleInput, handleMainFieldKeyUp, myHandleMainFieldKeyDown]);
+    // update refs used in some of the above effects in a useEffect on every render so that they
+    // update after the above effects run
+    hooks.useEffect(() => {
+        prevDataRef.current = data;
+        prevDropdownOpenRef.current = isDropdownOpen;
+        prevSearchText.current = searchText;
+    });
+    return {
+        collectionProps: {
+            currentKey: currentRow.rowKey,
+            onCurrentKeyChange,
+            onItemAction,
+            selectedKeys
+        },
+        dropdownArrowEventHandlers: {
+            onClick: handleDropdownArrowClick
+        },
+        dropdownEventHandlers,
+        dropdownRef,
+        inputEventHandlers,
+        inputRef,
+        isDropdownAbove,
+        isDropdownOpen,
+        isFocused,
+        isUserFiltering,
+        mainFieldRef,
+        mouseProps: isDisabled || isReadonly ? {} : { onMouseDown },
+        searchText,
+        userInput
+    };
+}
+
+/**
+ * A SelectSingle is a dropdown list that supports single selection and search filtering.
+ */
+const SelectSingle = compat.forwardRef(({ 'aria-describedby': ariaDescribedBy, assistiveText, data, helpSourceLink, helpSourceText, isDisabled: propIsDisabled, isLoading: propIsLoading, isReadonly: propIsReadonly, isRequired, isRequiredShown, itemText, label, labelEdge: propLabelEdge, labelStartWidth: propLabelStartWidth, messages, onCommit, onFilter, onLoadRange, placeholder, textAlign: propTextAlign, userAssistanceDensity: propUserAssistanceDensity, valueItem, variant = 'default', virtualKeyboard }, ref) => {
+    const { isDisabled: isFormDisabled, isReadonly: isFormReadonly, labelEdge: formLabelEdge, labelStartWidth: formLabelStartWidth, textAlign: formTextAlign, userAssistanceDensity: formUserAssistanceDensity } = hooks_UNSAFE_useFormContext.useFormContext();
+    // default to FormContext values if component properties are not specified
+    const isDisabled = propIsDisabled ?? isFormDisabled;
+    const isReadonly = propIsReadonly ?? isFormReadonly;
+    const labelEdge = propLabelEdge ?? formLabelEdge;
+    const labelStartWidth = propLabelStartWidth ?? formLabelStartWidth;
+    const textAlign = propTextAlign ?? formTextAlign;
+    const userAssistanceDensity = propUserAssistanceDensity ?? formUserAssistanceDensity;
+    const { enabledElementRef, focusProps, isFocused: origIsFocused, readonlyElementRef } = hooks_UNSAFE_useFocusableTextField.useFocusableTextField({ isDisabled, isReadonly, ref });
+    const { collectionProps, dropdownArrowEventHandlers, dropdownEventHandlers, dropdownRef, inputEventHandlers, isDropdownAbove, isDropdownOpen, isFocused, isUserFiltering, mainFieldRef, mouseProps, searchText, userInput } = useSelectSingle({
+        data,
+        inputRef: enabledElementRef,
+        isDisabled,
+        isFocused: origIsFocused,
+        isReadonly,
+        onCommit,
+        onFilter,
+        valueItem
+    });
+    // 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 = hooks_UNSAFE_useLoadingIndicatorTimer.useLoadingIndicatorTimer(propIsLoading ?? false);
+    const { baseId, formFieldContext, inputProps, labelProps, textFieldProps, userAssistanceProps } = hooks_UNSAFE_useTextField.useTextField({
+        ariaDescribedBy,
+        helpSourceLink,
+        helpSourceText,
+        isDisabled,
+        isFocused,
+        isLoading,
+        isReadonly,
+        isRequiredShown,
+        labelEdge,
+        messages,
+        styleVariant: variant,
+        userAssistanceDensity,
+        value: valueItem !== undefined ? true : undefined
+    });
+    // JET-54256 - inside label animates up on initial display with selected value
+    // 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 dropdownId = `${baseId}-dropdown`;
+    const displayValue = useDisplayValue(itemText, valueItem);
+    const labelComp = labelEdge !== 'none' ? jsxRuntime.jsx(Label.Label, { ...labelProps, children: label }) : undefined;
+    const fieldLabelProps = {
+        label: labelEdge !== 'none' ? labelComp : undefined,
+        labelEdge: labelEdge !== 'none' ? labelEdge : undefined,
+        labelStartWidth: labelEdge !== 'none' ? labelStartWidth : undefined
+    };
+    const ariaLabel = labelEdge === 'none' ? label : undefined;
+    const isInlineDensity = userAssistanceDensity === 'efficient' || userAssistanceDensity === 'reflow';
+    const inlineUserAssistance = isInlineDensity ? (isDisabled || isReadonly ? (
+    // save space for user assistance if density is 'efficient', even though we don't
+    // render user assistance for disabled or readonly fields
+    userAssistanceDensity !== 'efficient' ? undefined : (jsxRuntime.jsx(UNSAFE_UserAssistance.InlineUserAssistance, { userAssistanceDensity: userAssistanceDensity, ...userAssistanceProps }))) : (jsxRuntime.jsx(UNSAFE_UserAssistance.InlineUserAssistance, { assistiveText: assistiveText, fieldLabel: label, helpSourceLink: helpSourceLink, helpSourceText: helpSourceText, messages: messages, isRequiredShown: isRequiredShown, userAssistanceDensity: userAssistanceDensity, ...userAssistanceProps }))) : undefined;
+    const compactUserAssistance = userAssistanceDensity === 'compact' ? (jsxRuntime.jsx(UNSAFE_UserAssistance.CompactUserAssistance, { anchorRef: mainFieldRef, messages: messages, assistiveText: assistiveText, ...userAssistanceProps })) : undefined;
+    const translations = hooks_UNSAFE_useTranslationBundle.useTranslationBundle('@oracle/oraclejet-preact');
+    if (isReadonly) {
+        return (jsxRuntime.jsx(hooks_UNSAFE_useFormFieldContext.FormFieldContext.Provider, { value: formFieldContext, children: jsxRuntime.jsx(UNSAFE_TextField.ReadonlyTextField, { role: "presentation", compactUserAssistance: compactUserAssistance, inlineUserAssistance: inlineUserAssistance, onBlur: focusProps.onfocusout, onFocus: focusProps.onfocusin, ref: mainFieldRef, ...fieldLabelProps, children: jsxRuntime.jsx(ReadonlyTextFieldInput.ReadonlyTextFieldInput, { "aria-describedby": inputProps['aria-describedby'], "aria-label": ariaLabel, "aria-labelledby": labelProps.id, as: "div", elementRef: readonlyElementRef, hasEmptyLabel: label === '' && labelEdge === 'none', hasInsideLabel: label !== undefined && labelEdge === 'inside', textAlign: textAlign, value: displayValue }) }) }));
+    }
+    const isDataFetched = data !== undefined && data !== null && !PRIVATE_SelectCommon.isBeforeDataFetch(data);
+    const hasInsideLabel = labelComp !== undefined && labelEdge === 'inside';
+    const liveRegionText = isDropdownOpen && 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}` })
+        : '';
+    const mainContent = (jsxRuntime.jsxs(preact.Fragment, { children: [jsxRuntime.jsx(TextFieldInput.TextFieldInput, { "aria-autocomplete": "list", "aria-controls": dropdownId, "aria-expanded": isDropdownOpen, "aria-label": ariaLabel, autoComplete: "off", hasEmptyLabel: label === '' && labelEdge === 'none', hasInsideLabel: hasInsideLabel, inputRef: enabledElementRef, isRequired: isRequired, ...inputEventHandlers, placeholder: placeholder, role: "combobox", spellcheck: false, textAlign: textAlign, type: PRIVATE_SelectCommon.isMobile() ? (virtualKeyboard === 'auto' ? 'search' : virtualKeyboard) : undefined, value: isUserFiltering ? userInput : displayValue, ...inputProps }), jsxRuntime.jsx(UNSAFE_LiveRegion.LiveRegion, { children: liveRegionText })] }));
+    const dropdownArrow = (jsxRuntime.jsx(PRIVATE_SelectCommon.DropdownArrow, { isDisabled: isDisabled, size: hasInsideLabel ? 'md' : 'sm', ...dropdownArrowEventHandlers }));
+    const dropdownInlineUserAssistance = isDropdownOpen &&
+        !isDropdownAbove &&
+        !isDisabled &&
+        !isReadonly &&
+        (assistiveText || helpSourceLink) &&
+        (userAssistanceDensity === 'efficient' || userAssistanceDensity === 'reflow') ? (jsxRuntime.jsx(PRIVATE_SelectCommon.DropdownUserAssistance, { assistiveText: assistiveText, fieldLabel: label, helpSourceLink: helpSourceLink, helpSourceText: helpSourceText, userAssistanceDensity: userAssistanceDensity })) : undefined;
+    const isEmptyResults = isDataFetched && data?.totalSize === 0;
+    const dropdownListContent = isEmptyResults ? (jsxRuntime.jsx(PRIVATE_SelectCommon.EmptyResults, {})) : (jsxRuntime.jsx(PRIVATE_SelectCommon.DefaultList, { ...collectionProps, "aria-label": label ?? '', currentItemVariant: "highlight", data: data, itemText: itemText, onLoadRange: onLoadRange, searchText: isUserFiltering ? searchText : undefined, selectionMode: "single" }));
+    return (jsxRuntime.jsxs(preact.Fragment, { children: [jsxRuntime.jsx(hooks_UNSAFE_useFormFieldContext.FormFieldContext.Provider, { value: formFieldContext, children: jsxRuntime.jsx(UNSAFE_TextField.TextField, { compactUserAssistance: compactUserAssistance, endContent: isLoading ? undefined : dropdownArrow, inlineUserAssistance: inlineUserAssistance, mainContent: mainContent, mainFieldRef: mainFieldRef, onBlur: focusProps?.onfocusout, onFocus: focusProps?.onfocusin, ...textFieldProps, ...fieldLabelProps, ...mouseProps }) }), jsxRuntime.jsxs(PRIVATE_SelectCommon.Dropdown, { dropdownRef: dropdownRef, id: dropdownId, isOpen: isDropdownOpen &&
+                    data !== undefined &&
+                    (data === null || data.totalSize > 0 || PRIVATE_SelectCommon.isBeforeDataFetch(data) || isEmptyResults), anchorRef: mainFieldRef, ...dropdownEventHandlers, children: [jsxRuntime.jsx(PRIVATE_SelectCommon.DropdownList, { hasBottomGap: dropdownInlineUserAssistance === undefined, isLoading: data === null, children: dropdownListContent }), dropdownInlineUserAssistance] })] }));
+});
+
+exports.SelectSingle = SelectSingle;
+//# sourceMappingURL=SelectSingle-cd12aa57.js.map

package/cjs/SelectSingle-cd12aa57.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectSingle-cd12aa57.js","sources":["../../src/UNSAFE_SelectSingle/useDisplayValue.ts","../../src/UNSAFE_SelectSingle/useSelectSingle.ts","../../src/UNSAFE_SelectSingle/SelectSingle.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\n\nimport { useMemo } from 'preact/hooks';\nimport { Item } from '../utils/UNSAFE_dataProvider';\nimport { ItemTextType } from '../utils/UNSAFE_selectUtils';\nimport { renderItemText } from '../PRIVATE_SelectCommon';\n\nexport function useDisplayValue<K, D>(\n  itemText: ItemTextType<K, D>,\n  valueItem?: Item<K, D>\n): string {\n  // create the text displayed in the field from the selected value\n  const displayValue = useMemo(() => {\n    return valueItem === undefined ? '' : renderItemText(valueItem, itemText) ?? '';\n  }, [valueItem, itemText]);\n\n  return displayValue;\n}\n","/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\n\nimport { ComponentProps } from 'preact';\nimport { MutableRef, useCallback, useEffect, useMemo, useRef } from 'preact/hooks';\nimport { DataState, ItemActionDetail } from '../UNSAFE_Collection';\nimport { Item } from '../utils/UNSAFE_dataProvider';\nimport { mergeProps } from '../utils/UNSAFE_mergeProps';\nimport { ValueUpdateDetail } from '../utils/UNSAFE_valueUpdateDetail';\nimport { isControlOrFunctionKey, KEYS, useSelectCommon } from '../PRIVATE_SelectCommon';\nimport { SelectSingle } from './SelectSingle';\n\ntype PickedPropsFromSelectSingle = Pick<\n  ComponentProps<typeof SelectSingle>,\n  'isDisabled' | 'isReadonly' | 'onFilter'\n>;\ntype UseSelectSingleProps<K, D> = PickedPropsFromSelectSingle & {\n  data?: DataState<K, D> | null;\n  inputRef: MutableRef<HTMLInputElement>;\n  isFocused?: boolean;\n  onCommit: (detail: ValueUpdateDetail<K>) => void;\n  valueItem?: Item<K, D>;\n};\n\n/**\n * Hook that manages SelectSingle state and behavior.  This hook creates state variables and\n * event listeners, returning properties to apply to components internally rendered by\n * SelectSingle, as well as state information.\n *\n * @param data Specifies data for the dropdown list.\n * @param inputRef Ref to the input element.\n * @param isDisabled Specifies whether the component is disabled.\n * @param isFocused Specifies whether the component has focus.\n * @param isReadonly Specifies whether the component is readonly.\n * @param onCommit Callback invoked when the selected value is committed.\n * @param onFilter Callback function to trigger loading data for the dropdown list,\n * which may or may not be filtered by user entered text.\n * @param valueItem Specifies the key, data, and optional metadata for the selected value.\n *\n * @returns Properties to apply to internal components that SelectSingle renders, and component\n * state.\n */\nexport function useSelectSingle<K, D>({\n  data,\n  inputRef,\n  isDisabled,\n  isFocused: propIsFocused,\n  isReadonly,\n  onCommit: propOnCommit,\n  onFilter,\n  valueItem\n}: UseSelectSingleProps<K, D>) {\n  const {\n    currentRow,\n    dropdownRef,\n    handleDropdownArrowClick,\n    handleDropdownAutoDismiss: baseHandleDropdownAutoDismiss,\n    handleDropdownPosition,\n    handleInput,\n    handleMainFieldKeyDown: baseHandleMainFieldKeyDown,\n    handleMainFieldKeyUp,\n    isDropdownAbove,\n    isDropdownOpen,\n    isFocused,\n    isUserFiltering,\n    mainFieldRef,\n    onCurrentKeyChange,\n    onMouseDown,\n    searchText,\n    selectedKeys,\n    setCurrentRow,\n    setDropdownOpen,\n    setSelectedKeys,\n    stopFiltering,\n    userInput\n  } = useSelectCommon<K, D>({\n    data,\n    inputRef,\n    isFocused: propIsFocused,\n    onFilter\n  });\n\n  // refs used by some of the effects below to determine whether the effect needs to run,\n  // for when the list of dependencies is longer than what we want the trigger to actually be\n  const prevDataRef = useRef(data);\n  const prevDropdownOpenRef = useRef(isDropdownOpen);\n  const prevSearchText = useRef(searchText);\n\n  const onCommit = useCallback(\n    (value?: K) => {\n      propOnCommit?.({\n        value: value,\n        previousValue: valueItem !== undefined ? valueItem.key : undefined\n      });\n    },\n    [propOnCommit, valueItem]\n  );\n\n  const clearValue = useCallback(() => {\n    setDropdownOpen(false);\n\n    setSelectedKeys(new Set<K>());\n\n    // call the onCommit callback so that the consuming code can update the valueItem\n    onCommit(undefined);\n  }, [onCommit]);\n\n  const clearValueIfNeeded = useCallback(() => {\n    if (isUserFiltering && userInput === '' && valueItem !== undefined) {\n      clearValue();\n      return true;\n    }\n    return false;\n  }, [clearValue, isUserFiltering, userInput, valueItem]);\n\n  // when the field loses focus, check to see if we need to clear the value\n  useEffect(() => {\n    if (!isFocused) {\n      clearValueIfNeeded();\n    }\n    // only run when focus changes, at which point the current value of clearValueIfNeeded will\n    // be used\n  }, [isFocused]);\n\n  const focusInput = useCallback(() => {\n    inputRef.current?.focus();\n  }, []);\n\n  const removeDropdown = useCallback(() => {\n    dropdownRef.current?.parentElement?.removeChild(dropdownRef.current);\n  }, []);\n\n  const myHandleDropdownAutoDismiss = useCallback(\n    (event?: Event) => {\n      if (isDropdownOpen) {\n        if (event?.type === 'keydown') {\n          const keyboardEvent = event as KeyboardEvent;\n          switch (keyboardEvent.code) {\n            case KEYS.TAB:\n              // if there is a currentRow in the dropdown, select it and commit it\n              if (currentRow !== undefined && currentRow.rowKey !== undefined) {\n                setSelectedKeys(new Set<K>([currentRow.rowKey]));\n                onCommit(currentRow.rowKey);\n              }\n\n              // Put focus on an element in the main field, but don't kill the event, so that\n              // the browser can naturally transfer focus to the next focusable item relative\n              // to the element in the main field.\n              focusInput();\n\n              // Remove the dropdown immediately, without waiting for a rerender based on changing\n              // state, so that the open dropdown cannot get focus when the browser handles the\n              // Tab key.\n              removeDropdown();\n              break;\n            default:\n              break;\n          }\n        }\n      }\n    },\n    [currentRow, focusInput, isDropdownOpen, onCommit]\n  );\n\n  const myHandleMainFieldKeyDown = useCallback(\n    (event: KeyboardEvent) => {\n      // ignore control key and function key\n      if (isControlOrFunctionKey(event)) {\n        return;\n      }\n\n      switch (event.code) {\n        case KEYS.TAB:\n          // check whether we need to clear the value;\n          // if not, check whether we need to select the current item\n          const isValueClearedTab = clearValueIfNeeded();\n          if (!isValueClearedTab && isDropdownOpen && data != null && data.data.length > 0) {\n            // if there is a currentRow in the dropdown (meaning a highlighted item that would\n            // have keyboard focus if the dropdown list had physical focus, which may be different\n            // from the currently selected item), select it and commit it;\n            // otherwise commit the currently selected value again so that a valueAction event\n            // will be fired\n            if (currentRow !== undefined && currentRow.rowKey !== undefined) {\n              setSelectedKeys(new Set<K>([currentRow.rowKey]));\n              onCommit(currentRow.rowKey);\n            } else {\n              onCommit(valueItem?.key ?? undefined);\n            }\n          }\n\n          // Remove the dropdown immediately, without waiting for a rerender based on changing\n          // state, so that the open dropdown cannot get focus when the browser handles the\n          // Tab key.\n          removeDropdown();\n\n          setDropdownOpen(false);\n          break;\n\n        case KEYS.ENTER:\n          // check whether we need to clear the value;\n          // if not, check whether we need to select the current item\n          const isValueCleared = clearValueIfNeeded();\n          if (!isValueCleared && isDropdownOpen && data != null && data.data.length > 0) {\n            setDropdownOpen(false);\n\n            // after selecting a value, the user is no longer actively filtering, so update related\n            // state accordingly so that the newly selected value appears in the field\n            stopFiltering();\n\n            // if there is a currentRow in the dropdown, select it and commit it;\n            // otherwise commit the currently selected value again\n            if (currentRow !== undefined && currentRow.rowKey !== undefined) {\n              setSelectedKeys(new Set<K>([currentRow.rowKey]));\n              onCommit(currentRow.rowKey);\n            } else {\n              onCommit(valueItem?.key ?? undefined);\n            }\n          }\n          break;\n\n        default:\n          break;\n      }\n    },\n    [clearValueIfNeeded, currentRow, data, isDropdownOpen, onCommit, valueItem]\n  );\n\n  // when the valueItem changes, save the new selectedKeys\n  useEffect(() => {\n    setSelectedKeys(valueItem === undefined ? undefined : new Set([valueItem.key]));\n  }, [valueItem]);\n\n  const onItemAction = useCallback(\n    (detail: ItemActionDetail<K, D>) => {\n      focusInput();\n      setDropdownOpen(false);\n\n      // after selecting a value, the user is no longer actively filtering, so update related\n      // state accordingly so that the newly selected value appears in the field\n      stopFiltering();\n\n      const newKey = detail.context.metadata.key;\n      // update the selectedKeys so that the selection visual state of the collection\n      // updates immediately while waiting for a new valueItem to be set\n      setSelectedKeys(new Set([newKey]));\n      // call the onCommit callback so that the consuming code can update the valueItem\n      onCommit(newKey);\n    },\n    [focusInput, onCommit]\n  );\n\n  useEffect(() => {\n    // only run this effect when data changes because we need to wait for the new set of\n    // filtered data to be set before highlighting the first result\n    if (data === prevDataRef.current) {\n      return;\n    }\n\n    // when filtering, set the first result of the filtered data set to be the current item\n    // (check the data offset so we don't try to highlight again if the user scrolls through\n    // the list and more data is fetched)\n    if (\n      isDropdownOpen &&\n      isUserFiltering &&\n      data != null &&\n      data.offset === 0 &&\n      data.data.length > 0\n    ) {\n      // if there are results and search text, highlight the first row, otherwise clear\n      // an existing highlight\n      setCurrentRow({\n        rowKey:\n          searchText !== undefined && searchText?.length > 0 ? data.data[0].metadata.key : undefined\n      });\n    }\n  }, [data, isDropdownOpen, isUserFiltering, searchText]);\n\n  useEffect(() => {\n    // only run this effect when the state of the dropdown changes\n    if (isDropdownOpen === prevDropdownOpenRef.current) {\n      return;\n    }\n\n    // clear the current item when the dropdown opens if there is no filter text\n    if (\n      isDropdownOpen &&\n      (!isUserFiltering || searchText === undefined || searchText.length === 0)\n    ) {\n      setCurrentRow({ rowKey: undefined });\n    }\n  }, [isDropdownOpen, isUserFiltering, searchText]);\n\n  const dropdownEventHandlers = useMemo(() => {\n    return mergeProps(\n      {\n        onAutoDismiss: baseHandleDropdownAutoDismiss,\n        onPosition: handleDropdownPosition\n      },\n      { onAutoDismiss: myHandleDropdownAutoDismiss }\n    );\n  }, [baseHandleDropdownAutoDismiss, handleDropdownPosition, myHandleDropdownAutoDismiss]);\n\n  const inputEventHandlers = useMemo(() => {\n    return mergeProps(\n      {\n        onInput: handleInput,\n        onKeyDown: baseHandleMainFieldKeyDown,\n        onKeyUp: handleMainFieldKeyUp\n      },\n      { onKeyDown: myHandleMainFieldKeyDown }\n    );\n  }, [baseHandleMainFieldKeyDown, handleInput, handleMainFieldKeyUp, myHandleMainFieldKeyDown]);\n\n  // update refs used in some of the above effects in a useEffect on every render so that they\n  // update after the above effects run\n  useEffect(() => {\n    prevDataRef.current = data;\n    prevDropdownOpenRef.current = isDropdownOpen;\n    prevSearchText.current = searchText;\n  });\n\n  return {\n    collectionProps: {\n      currentKey: currentRow.rowKey,\n      onCurrentKeyChange,\n      onItemAction,\n      selectedKeys\n    },\n    dropdownArrowEventHandlers: {\n      onClick: handleDropdownArrowClick\n    },\n    dropdownEventHandlers,\n    dropdownRef,\n    inputEventHandlers,\n    inputRef,\n    isDropdownAbove,\n    isDropdownOpen,\n    isFocused,\n    isUserFiltering,\n    mainFieldRef,\n    mouseProps: isDisabled || isReadonly ? {} : { onMouseDown },\n    searchText,\n    userInput\n  };\n}\n","/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\n\nimport { ComponentProps, Fragment, Ref } from 'preact';\nimport { forwardRef } from 'preact/compat';\nimport { MutableRef } from 'preact/hooks';\nimport { FocusableHandle, useFocusableTextField } from '../hooks/UNSAFE_useFocusableTextField';\nimport { useFormContext } from '../hooks/UNSAFE_useFormContext';\nimport { FormFieldContext } from '../hooks/UNSAFE_useFormFieldContext';\nimport { useLoadingIndicatorTimer } from '../hooks/UNSAFE_useLoadingIndicatorTimer';\nimport { useTextField } from '../hooks/UNSAFE_useTextField';\nimport { DataState } from '../UNSAFE_Collection';\nimport { Label } from '../UNSAFE_Label';\nimport { VirtualizedListView } from '../UNSAFE_VirtualizedListView';\nimport { LiveRegion } from '../UNSAFE_LiveRegion';\nimport {\n  ReadonlyTextField,\n  ReadonlyTextFieldInput,\n  TextField,\n  TextFieldInput\n} from '../UNSAFE_TextField';\nimport {\n  CompactUserAssistance,\n  InlineUserAssistance,\n  UserAssistanceDensityType\n} from '../UNSAFE_UserAssistance';\nimport { Item } from '../utils/UNSAFE_dataProvider';\nimport { Size } from '../utils/UNSAFE_size';\nimport { ValueUpdateDetail } from '../utils/UNSAFE_valueUpdateDetail';\nimport {\n  DefaultList,\n  Dropdown,\n  DropdownArrow,\n  DropdownList,\n  DropdownUserAssistance,\n  EmptyResults,\n  isBeforeDataFetch,\n  isMobile\n} from '../PRIVATE_SelectCommon';\nimport { ItemTextType } from '../utils/UNSAFE_selectUtils';\nimport { useDisplayValue } from './useDisplayValue';\nimport { useSelectSingle } from './useSelectSingle';\nimport { useTranslationBundle } from '../hooks/UNSAFE_useTranslationBundle';\nimport { BundleType } from '../resources/nls/bundle';\n\ntype TextFieldInputProps = ComponentProps<typeof TextFieldInput>;\ntype InlineUserAssistanceProps = ComponentProps<typeof InlineUserAssistance>;\n\ntype Props<K extends string | number, D extends Record<string, any>> = {\n  /**\n   * The ID of an element (or space separated IDs of multiple elements) that\n   * describes the input.\n   */\n  'aria-describedby'?: TextFieldInputProps['aria-describedby'];\n  /**\n   * Text to provide guidance to help the user understand what data to enter or select.\n   */\n  assistiveText?: InlineUserAssistanceProps['assistiveText'];\n  /**\n   * Specifies data for the dropdown list.\n   *\n   * Note that the <code>itemText</code> property allows for customizing the rendering\n   * of each data item.\n   */\n  data?: DataState<K, D> | null;\n  /**\n   * Help source URL associated with the component.\n   */\n  helpSourceLink?: InlineUserAssistanceProps['helpSourceLink'];\n  /**\n   * Custom text to be rendered for the <code>helpSourceLink</code>.\n   */\n  helpSourceText?: InlineUserAssistanceProps['helpSourceText'];\n  /**\n   * Specifies whether the component is disabled.\n   */\n  isDisabled?: boolean;\n  /**\n   * Specifies whether the component is waiting for <code>valueItems</code> to load.\n   * While loading, SelectSingle will show the progressive loading indicator in the text field.\n   */\n  isLoading?: boolean;\n  /**\n   * Specifies whether the component is readonly.\n   */\n  isReadonly?: boolean;\n  /**\n   * Specifies for accessibility purposes whether a value is required.\n   *\n   * Setting this property to <code>false</code> means that a value is not required to be\n   * selected by the user.  Setting this property to <code>true</code> means that a value\n   * is required to be selected by the user.\n   */\n  isRequired?: TextFieldInputProps['isRequired'];\n  /**\n   * Specifies whether to show an indicator on screen that a value is required, for example\n   * before the user has selected a value.\n   */\n  isRequiredShown?: InlineUserAssistanceProps['isRequiredShown'];\n  /**\n   * Specifies how to get the text string to render for a data item.\n   * This property can be set to either:\n   * <ul>\n   * <li>a string that specifies the name of a top level data attribute to render as text, or</li>\n   * <li>a callback function that takes a properties object and returns the text string to\n   * display.</li>\n   * </ul>\n   *\n   * This text will be rendered for the selected <code>valueItems</code> of the component.\n   * It will also be rendered for each item in the dropdown.  When rendered for the\n   * dropdown items, default matching search term highlighting will still be applied.\n   */\n  itemText: ItemTextType<K, D>;\n  /**\n   * Specifies the label associated with the field.\n   */\n  label: string;\n  /**\n   * Specifies where the label is positioned relative to the field.\n   */\n  labelEdge?: 'inside' | 'start' | 'top' | 'none';\n  /**\n   * Specifies the width of the label when <code>labelEdge</code> is <code>\"start\"</code>\n   */\n  labelStartWidth?: Size;\n  /**\n   * Messages to show on screen that are associated with the component.\n   */\n  messages?: InlineUserAssistanceProps['messages'];\n  /**\n   * A short hint to display before the user selects or enters a value.\n   */\n  placeholder?: TextFieldInputProps['placeholder'];\n  /**\n   * Specifies how to align text within the field.\n   */\n  textAlign?: TextFieldInputProps['textAlign'];\n  /**\n   * Specifies the density of the user assistance presentation.  It can be set to:\n   * <ul>\n   * <li><code>'efficient'</code>: Show inline and reserve space to prevent layout reflow when user\n   * assistance text is displayed.</li>\n   * <li><code>'reflow'</code>: Show inline.  Layout will reflow when text is displayed.</li>\n    * <li><code>'compact'</code>: Messages, help, hints, and required will not be shown inline; they will show in a mode that keeps the screen more compact, like a popup for the messages, and a required icon to indicate Required. </li>\n   \n  * </ul>\n   */\n  userAssistanceDensity?: UserAssistanceDensityType;\n  /**\n   * Specifies the key, data, and optional metadata for the selected value.\n   */\n  valueItem?: Item<K, D>;\n  /**\n   * The style variant of the component.\n   */\n  variant?: TextFieldInputProps['variant'];\n  /**\n   * The type of virtual keyboard to display for entering a value on mobile browsers.\n   * This property has no effect on desktop browsers.\n   */\n  virtualKeyboard?: 'auto' | 'email' | 'number' | 'search' | 'tel' | 'text' | 'url';\n  /**\n   * Callback invoked when the user commits the selected value.\n   *\n   * The function should set a new <code>valueItem</code> property.\n   */\n  onCommit: (detail: ValueUpdateDetail<K>) => void;\n  /**\n   * Callback function to trigger loading data for the dropdown list, which may or may not be\n   * filtered by user entered search text.\n   *\n   * The function should set a new <code>DataState</code> as the <code>data</code> property.\n   */\n  onFilter?: ({ searchText }: { searchText?: string }) => void;\n  /**\n   * Callback function to handle when the viewport of the dropdown list has changed, for example\n   * by scrolling, including the case where the user scrolls to the end of the list and there are\n   * more items to load.\n   *\n   * The function should set a new <code>DataState</code> for the specified range as the\n   * <code>data</code> property.\n   */\n  onLoadRange?: ComponentProps<typeof VirtualizedListView>['onLoadRange'];\n};\n\n/**\n * A SelectSingle is a dropdown list that supports single selection and search filtering.\n */\nexport const SelectSingle = forwardRef(\n  <K extends string | number, D extends Record<string, any>>(\n    {\n      'aria-describedby': ariaDescribedBy,\n      assistiveText,\n      data,\n      helpSourceLink,\n      helpSourceText,\n      isDisabled: propIsDisabled,\n      isLoading: propIsLoading,\n      isReadonly: propIsReadonly,\n      isRequired,\n      isRequiredShown,\n      itemText,\n      label,\n      labelEdge: propLabelEdge,\n      labelStartWidth: propLabelStartWidth,\n      messages,\n      onCommit,\n      onFilter,\n      onLoadRange,\n      placeholder,\n      textAlign: propTextAlign,\n      userAssistanceDensity: propUserAssistanceDensity,\n      valueItem,\n      variant = 'default',\n      virtualKeyboard\n    }: Props<K, D>,\n    ref?: Ref<FocusableHandle>\n  ) => {\n    const {\n      isDisabled: isFormDisabled,\n      isReadonly: isFormReadonly,\n      labelEdge: formLabelEdge,\n      labelStartWidth: formLabelStartWidth,\n      textAlign: formTextAlign,\n      userAssistanceDensity: formUserAssistanceDensity\n    } = useFormContext();\n    // default to FormContext values if component properties are not specified\n    const isDisabled = propIsDisabled ?? isFormDisabled;\n    const isReadonly = propIsReadonly ?? isFormReadonly;\n    const labelEdge = propLabelEdge ?? formLabelEdge;\n    const labelStartWidth = propLabelStartWidth ?? formLabelStartWidth;\n    const textAlign = propTextAlign ?? formTextAlign;\n    const userAssistanceDensity = propUserAssistanceDensity ?? formUserAssistanceDensity;\n\n    const {\n      enabledElementRef,\n      focusProps,\n      isFocused: origIsFocused,\n      readonlyElementRef\n    } = useFocusableTextField<HTMLInputElement, HTMLDivElement>({ isDisabled, isReadonly, ref });\n\n    const {\n      collectionProps,\n      dropdownArrowEventHandlers,\n      dropdownEventHandlers,\n      dropdownRef,\n      inputEventHandlers,\n      isDropdownAbove,\n      isDropdownOpen,\n      isFocused,\n      isUserFiltering,\n      mainFieldRef,\n      mouseProps,\n      searchText,\n      userInput\n    } = useSelectSingle<K, D>({\n      data,\n      inputRef: enabledElementRef as MutableRef<HTMLInputElement>,\n      isDisabled,\n      isFocused: origIsFocused,\n      isReadonly,\n      onCommit,\n      onFilter,\n      valueItem\n    });\n\n    // The incoming propIsLoading tells us that we are in a loading state, but we don't want to\n    // show the loading indicator until after a delay, because showing it immediately could result\n    // in unwanted flashing.  The isLoading var below will be set to true by useLoadingIndicatorTimer\n    // after the delay, when the timer expires, at which point we should show the loading indicator.\n    // If propIsLoading is set to false before the timer expires, then the timer will be cancelled\n    // and no loading indicator will be shown.\n    // (ListView detects its loading state by checking data === null.  While it would be nice for\n    // us to be consistent and check valueItems === null, we need to use a separate isLoading prop.\n    // If valueItems === null triggers our loading state, then the selections in the dropdown\n    // are cleared for that period of time, which is undesirable.)\n    const isLoading = useLoadingIndicatorTimer(propIsLoading ?? false);\n\n    const {\n      baseId,\n      formFieldContext,\n      inputProps,\n      labelProps,\n      textFieldProps,\n      userAssistanceProps\n    } = useTextField({\n      ariaDescribedBy,\n      helpSourceLink,\n      helpSourceText,\n      isDisabled,\n      isFocused,\n      isLoading,\n      isReadonly,\n      isRequiredShown,\n      labelEdge,\n      messages,\n      styleVariant: variant,\n      userAssistanceDensity,\n      value: valueItem !== undefined ? true : undefined\n    });\n\n    // JET-54256 - inside label animates up on initial display with selected value\n    // If we're waiting for the selected values to load, the component should look like it\n    // has a value in the meantime.\n    // Use the original propIsLoading instead of isLoading because we don't want to delay\n    // the inside label position by a timer like we do the progressive loading indicator.\n    formFieldContext.hasValue = propIsLoading || formFieldContext.hasValue;\n\n    const dropdownId = `${baseId}-dropdown`;\n\n    const displayValue = useDisplayValue(itemText, valueItem);\n\n    const labelComp = labelEdge !== 'none' ? <Label {...labelProps}>{label}</Label> : undefined;\n\n    const fieldLabelProps = {\n      label: labelEdge !== 'none' ? labelComp : undefined,\n      labelEdge: labelEdge !== 'none' ? labelEdge : undefined,\n      labelStartWidth: labelEdge !== 'none' ? labelStartWidth : undefined\n    };\n\n    const ariaLabel = labelEdge === 'none' ? label : undefined;\n    const isInlineDensity =\n      userAssistanceDensity === 'efficient' || userAssistanceDensity === 'reflow';\n\n    const inlineUserAssistance = isInlineDensity ? (\n      isDisabled || isReadonly ? (\n        // save space for user assistance if density is 'efficient', even though we don't\n        // render user assistance for disabled or readonly fields\n        userAssistanceDensity !== 'efficient' ? undefined : (\n          <InlineUserAssistance\n            userAssistanceDensity={userAssistanceDensity}\n            {...userAssistanceProps}\n          />\n        )\n      ) : (\n        <InlineUserAssistance\n          assistiveText={assistiveText}\n          fieldLabel={label}\n          helpSourceLink={helpSourceLink}\n          helpSourceText={helpSourceText}\n          messages={messages}\n          isRequiredShown={isRequiredShown}\n          userAssistanceDensity={userAssistanceDensity}\n          {...userAssistanceProps}\n        />\n      )\n    ) : undefined;\n\n    const compactUserAssistance =\n      userAssistanceDensity === 'compact' ? (\n        <CompactUserAssistance\n          anchorRef={mainFieldRef}\n          messages={messages}\n          assistiveText={assistiveText}\n          {...userAssistanceProps}\n        />\n      ) : undefined;\n\n    const translations = useTranslationBundle<BundleType>('@oracle/oraclejet-preact');\n\n    if (isReadonly) {\n      return (\n        <FormFieldContext.Provider value={formFieldContext}>\n          <ReadonlyTextField\n            role=\"presentation\"\n            compactUserAssistance={compactUserAssistance}\n            inlineUserAssistance={inlineUserAssistance}\n            onBlur={focusProps.onfocusout}\n            onFocus={focusProps.onfocusin}\n            ref={mainFieldRef}\n            {...fieldLabelProps}>\n            <ReadonlyTextFieldInput\n              aria-describedby={inputProps['aria-describedby']}\n              aria-label={ariaLabel}\n              aria-labelledby={labelProps.id}\n              as=\"div\"\n              elementRef={readonlyElementRef}\n              hasEmptyLabel={label === '' && labelEdge === 'none'}\n              hasInsideLabel={label !== undefined && labelEdge === 'inside'}\n              textAlign={textAlign}\n              value={displayValue}\n            />\n          </ReadonlyTextField>\n        </FormFieldContext.Provider>\n      );\n    }\n\n    const isDataFetched = data !== undefined && data !== null && !isBeforeDataFetch<K, D>(data);\n    const hasInsideLabel = labelComp !== undefined && labelEdge === 'inside';\n    const liveRegionText =\n      isDropdownOpen && isDataFetched\n        ? data?.totalSize === 0\n          ? translations.select_noMatchesFound()\n          : data?.totalSize === 1\n          ? translations.select_oneMatchFound()\n          : data?.sizePrecision === 'exact'\n          ? translations.select_sizeMatchesFound({ TOTAL_SIZE: `${data?.totalSize}` })\n          : translations.select_sizeOrMoreMatchesFound({ TOTAL_SIZE: `${data?.totalSize}` })\n        : '';\n\n    const mainContent = (\n      <Fragment>\n        <TextFieldInput\n          aria-autocomplete=\"list\"\n          aria-controls={dropdownId}\n          aria-expanded={isDropdownOpen}\n          aria-label={ariaLabel}\n          autoComplete=\"off\"\n          hasEmptyLabel={label === '' && labelEdge === 'none'}\n          hasInsideLabel={hasInsideLabel}\n          inputRef={enabledElementRef}\n          isRequired={isRequired}\n          // onCommit={handleCommit}\n          {...inputEventHandlers}\n          placeholder={placeholder}\n          role=\"combobox\"\n          spellcheck={false}\n          textAlign={textAlign}\n          type={isMobile() ? (virtualKeyboard === 'auto' ? 'search' : virtualKeyboard) : undefined}\n          value={isUserFiltering ? userInput : displayValue}\n          {...inputProps}\n        />\n        <LiveRegion>{liveRegionText}</LiveRegion>\n      </Fragment>\n    );\n\n    const dropdownArrow = (\n      <DropdownArrow\n        isDisabled={isDisabled}\n        size={hasInsideLabel ? 'md' : 'sm'}\n        {...dropdownArrowEventHandlers}\n      />\n    );\n\n    const dropdownInlineUserAssistance =\n      isDropdownOpen &&\n      !isDropdownAbove &&\n      !isDisabled &&\n      !isReadonly &&\n      (assistiveText || helpSourceLink) &&\n      (userAssistanceDensity === 'efficient' || userAssistanceDensity === 'reflow') ? (\n        <DropdownUserAssistance\n          assistiveText={assistiveText}\n          fieldLabel={label}\n          helpSourceLink={helpSourceLink}\n          helpSourceText={helpSourceText}\n          userAssistanceDensity={userAssistanceDensity}\n        />\n      ) : undefined;\n\n    const isEmptyResults = isDataFetched && data?.totalSize === 0;\n    const dropdownListContent = isEmptyResults ? (\n      <EmptyResults />\n    ) : (\n      <DefaultList<K, D>\n        {...collectionProps}\n        aria-label={label ?? ''}\n        currentItemVariant=\"highlight\"\n        data={data}\n        itemText={itemText}\n        onLoadRange={onLoadRange}\n        searchText={isUserFiltering ? searchText : undefined}\n        selectionMode=\"single\"\n      />\n    );\n\n    return (\n      <Fragment>\n        <FormFieldContext.Provider value={formFieldContext}>\n          <TextField\n            compactUserAssistance={compactUserAssistance}\n            endContent={isLoading ? undefined : dropdownArrow}\n            inlineUserAssistance={inlineUserAssistance}\n            mainContent={mainContent}\n            mainFieldRef={mainFieldRef}\n            onBlur={focusProps?.onfocusout}\n            onFocus={focusProps?.onfocusin}\n            {...textFieldProps}\n            {...fieldLabelProps}\n            {...mouseProps}\n          />\n        </FormFieldContext.Provider>\n        <Dropdown\n          dropdownRef={dropdownRef}\n          id={dropdownId}\n          isOpen={\n            isDropdownOpen &&\n            data !== undefined &&\n            (data === null || data.totalSize > 0 || isBeforeDataFetch<K, D>(data) || isEmptyResults)\n          }\n          anchorRef={mainFieldRef}\n          {...dropdownEventHandlers}>\n          <DropdownList\n            hasBottomGap={dropdownInlineUserAssistance === undefined}\n            isLoading={data === null}>\n            {dropdownListContent}\n          </DropdownList>\n          {dropdownInlineUserAssistance}\n        </Dropdown>\n      </Fragment>\n    );\n  }\n);\n"],"names":["useMemo","renderItemText","useSelectCommon","useRef","useCallback","useEffect","KEYS","isControlOrFunctionKey","mergeProps","forwardRef","useFormContext","useFocusableTextField","useLoadingIndicatorTimer","useTextField","_jsx","Label","InlineUserAssistance","CompactUserAssistance","useTranslationBundle","FormFieldContext","ReadonlyTextField","ReadonlyTextFieldInput","isBeforeDataFetch","_jsxs","Fragment","TextFieldInput","isMobile","LiveRegion","DropdownArrow","DropdownUserAssistance","EmptyResults","DefaultList","TextField","Dropdown","DropdownList"],"mappings":"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"}

package/cjs/SelectSingleMenuGroup-76db19db.js

@@ -0,0 +1,12 @@
+/* @oracle/oraclejet-preact: 15.1.13 */
+'use strict';
+
+var jsxRuntime = require('preact/jsx-runtime');
+var SelectMenuItem = require('./SelectMenuItem-cc7365ba.js');
+
+function SelectSingleMenuGroup({ value, onCommit, children }) {
+    return (jsxRuntime.jsx(SelectMenuItem.SelectMenuGroupContext.Provider, { value: { isMultiple: false, value, onCommit }, children: children }));
+}
+
+exports.SelectSingleMenuGroup = SelectSingleMenuGroup;
+//# sourceMappingURL=SelectSingleMenuGroup-76db19db.js.map

package/cjs/SelectSingleMenuGroup-76db19db.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectSingleMenuGroup-76db19db.js","sources":["../../src/UNSAFE_Menu/SelectSingleMenuGroup.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\n\nimport { ComponentChildren } from 'preact';\n\nimport { MenuValueUpdateDetail } from './menuUtils';\nimport { SelectMenuGroupContext } from './SelectMenuGroupContext';\n\ntype SelectSingleMenuGroupProps = {\n  children: ComponentChildren;\n  value?: string;\n  onCommit?: (detail: MenuValueUpdateDetail<string>) => void;\n};\n\nexport function SelectSingleMenuGroup({ value, onCommit, children }: SelectSingleMenuGroupProps) {\n  return (\n    <SelectMenuGroupContext.Provider value={{ isMultiple: false, value, onCommit }}>\n      {children}\n    </SelectMenuGroupContext.Provider>\n  );\n}\n"],"names":["_jsx","SelectMenuGroupContext"],"mappings":";;;;;;AAmBM,SAAU,qBAAqB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAA8B,EAAA;IAC7F,QACEA,eAACC,qCAAsB,CAAC,QAAQ,EAAC,EAAA,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,EAC3E,QAAA,EAAA,QAAQ,EACuB,CAAA,EAClC;AACJ;;;;"}

package/cjs/Skeleton-a11f281b.js

@@ -0,0 +1,36 @@
+/* @oracle/oraclejet-preact: 15.1.13 */
+'use strict';
+
+var jsxRuntime = require('preact/jsx-runtime');
+require('./utils/UNSAFE_classNames.js');
+var utils_UNSAFE_interpolations_dimensions = require('./utils/UNSAFE_interpolations/dimensions.js');
+var utils_UNSAFE_mergeInterpolations = require('./utils/UNSAFE_mergeInterpolations.js');
+var utils_UNSAFE_interpolations_borders = require('./utils/UNSAFE_interpolations/borders.js');
+var utils_UNSAFE_arrayUtils = require('./utils/UNSAFE_arrayUtils.js');
+var hooks_UNSAFE_useComponentTheme = require('./hooks/UNSAFE_useComponentTheme.js');
+var UNSAFE_Skeleton_themes_redwood_SkeletonTheme = require('./UNSAFE_Skeleton/themes/redwood/SkeletonTheme.js');
+var classNames = require('./classNames-d7bcb415.js');
+
+const dimensions = utils_UNSAFE_arrayUtils.stringLiteralArray(['height', 'width']);
+const border = utils_UNSAFE_arrayUtils.stringLiteralArray(['borderRadius']);
+// Create an array [dimensionInterpolations['height'], dimensionInterpolations['width']]
+const skeletonDimensionInterpolation = Array.from(dimensions, (x) => utils_UNSAFE_interpolations_dimensions.dimensionInterpolations[x]);
+const borderRadiusInterpolation = Array.from(border, (x) => utils_UNSAFE_interpolations_borders.borderInterpolations[x]);
+const interpolations = [
+    ...Object.values(borderRadiusInterpolation),
+    ...Object.values(skeletonDimensionInterpolation)
+];
+const SkeletonInterpolations = utils_UNSAFE_mergeInterpolations.mergeInterpolations(interpolations);
+/**
+ * Skeleton component allows the appropriate skeleton to be rendered based on the
+ * property values
+ **/
+function Skeleton({ ...props }) {
+    const { classes: skeletonBase } = hooks_UNSAFE_useComponentTheme.useComponentTheme(UNSAFE_Skeleton_themes_redwood_SkeletonTheme.SkeletonRedwoodTheme);
+    const classes = classNames.classNames([skeletonBase]);
+    const skeletonDimensions = SkeletonInterpolations({ width: '100%', borderRadius: 0, ...props });
+    return jsxRuntime.jsx("div", { style: skeletonDimensions, class: classes });
+}
+
+exports.Skeleton = Skeleton;
+//# sourceMappingURL=Skeleton-a11f281b.js.map

package/cjs/Skeleton-a11f281b.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton-a11f281b.js","sources":["../../src/UNSAFE_Skeleton/Skeleton.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { classNames } from '../utils/UNSAFE_classNames';\nimport { dimensionInterpolations } from '../utils/UNSAFE_interpolations/dimensions';\nimport type { DimensionProps } from '../utils/UNSAFE_interpolations/dimensions';\nimport { mergeInterpolations } from '../utils/UNSAFE_mergeInterpolations';\nimport { borderInterpolations } from '../utils/UNSAFE_interpolations/borders';\nimport type { BorderProps } from '../utils/UNSAFE_interpolations/borders';\nimport { stringLiteralArray } from '../utils/UNSAFE_arrayUtils';\nimport { WithRequired } from '../utils/UNSAFE_typeUtils';\nimport { useComponentTheme } from '../hooks/UNSAFE_useComponentTheme';\nimport { SkeletonRedwoodTheme } from './themes/redwood/SkeletonTheme';\n\nconst dimensions = stringLiteralArray(['height', 'width']);\ntype Dimension = typeof dimensions[number];\nconst border = stringLiteralArray(['borderRadius']);\ntype BorderRadius = typeof border[number];\n\n// This component has some StyleInterpolationProps. Those are the height and width properties of the SkeletonProps.\ntype StyleInterpolationProps = Pick<DimensionProps, Dimension>;\n// This component has some BorderRadiusProps, which is the borderRadius property of the SkeletonProps.\ntype BorderRadiusProps = Pick<BorderProps, BorderRadius>;\n//This type has StyleInterpolationProps and BorderRadiusProps with the height prop made required.\ntype SkeletonProps = WithRequired<StyleInterpolationProps, 'height'> & BorderRadiusProps;\n\n// Create an array [dimensionInterpolations['height'], dimensionInterpolations['width']]\nconst skeletonDimensionInterpolation = Array.from(dimensions, (x) => dimensionInterpolations[x]);\nconst borderRadiusInterpolation = Array.from(border, (x) => borderInterpolations[x]);\nconst interpolations = [\n  ...Object.values(borderRadiusInterpolation),\n  ...Object.values(skeletonDimensionInterpolation)\n];\n\nconst SkeletonInterpolations = mergeInterpolations<SkeletonProps>(interpolations);\n/**\n * Skeleton component allows the appropriate skeleton to be rendered based on the\n * property values\n **/\nexport function Skeleton({ ...props }: SkeletonProps) {\n  const { classes: skeletonBase } = useComponentTheme(SkeletonRedwoodTheme);\n  const classes = classNames([skeletonBase]);\n\n  const skeletonDimensions = SkeletonInterpolations({ width: '100%', borderRadius: 0, ...props });\n  return <div style={skeletonDimensions} class={classes} />;\n}\n"],"names":["stringLiteralArray","dimensionInterpolations","borderInterpolations","mergeInterpolations","useComponentTheme","SkeletonRedwoodTheme","classNames","_jsx"],"mappings":";;;;;;;;;;;;;AAkBA,MAAM,UAAU,GAAGA,0CAAkB,CAAC,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC;AAE3D,MAAM,MAAM,GAAGA,0CAAkB,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC;AAUpD;AACA,MAAM,8BAA8B,GAAG,KAAK,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,KAAKC,8DAAuB,CAAC,CAAC,CAAC,CAAC,CAAC;AACjG,MAAM,yBAAyB,GAAG,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC,KAAKC,wDAAoB,CAAC,CAAC,CAAC,CAAC,CAAC;AACrF,MAAM,cAAc,GAAG;AACrB,IAAA,GAAG,MAAM,CAAC,MAAM,CAAC,yBAAyB,CAAC;AAC3C,IAAA,GAAG,MAAM,CAAC,MAAM,CAAC,8BAA8B,CAAC;CACjD,CAAC;AAEF,MAAM,sBAAsB,GAAGC,oDAAmB,CAAgB,cAAc,CAAC,CAAC;AAClF;;;AAGI;SACY,QAAQ,CAAC,EAAE,GAAG,KAAK,EAAiB,EAAA;IAClD,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE,GAAGC,gDAAiB,CAACC,iEAAoB,CAAC,CAAC;IAC1E,MAAM,OAAO,GAAGC,qBAAU,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC;AAE3C,IAAA,MAAM,kBAAkB,GAAG,sBAAsB,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,YAAY,EAAE,CAAC,EAAE,GAAG,KAAK,EAAE,CAAC,CAAC;IAChG,OAAOC,cAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,kBAAkB,EAAE,KAAK,EAAE,OAAO,EAAA,CAAI,CAAC;AAC5D;;;;"}

package/cjs/SkeletonContainer-f1e441c0.js

@@ -0,0 +1,31 @@
+/* @oracle/oraclejet-preact: 15.1.13 */
+'use strict';
+
+var jsxRuntime = require('preact/jsx-runtime');
+var hooks = require('preact/hooks');
+require('./utils/UNSAFE_classNames.js');
+var PRIVATE_List_themes_ListStyles_css = require('./PRIVATE_List/themes/ListStyles.css.js');
+var classNames = require('./classNames-d7bcb415.js');
+
+/**
+ * Allows to specify the time delay for rendering the component
+ **/
+const timerValue = 50;
+/**
+ * SkeletonContainer renders 'minimumCount' number of skeletons
+ * of the variant specified from its child element - Skeleton's prop after
+ * 'timerValue' ms delay
+ **/
+function SkeletonContainer({ children, minimumCount = 1 }) {
+    const [isVisible, setIsVisible] = hooks.useState(false);
+    hooks.useEffect(() => {
+        setTimeout(() => {
+            setIsVisible(true);
+        }, timerValue);
+    }, []);
+    const containerClasses = classNames.classNames([PRIVATE_List_themes_ListStyles_css.skeletonStyles.container]);
+    return isVisible && children ? (jsxRuntime.jsx("div", { class: containerClasses, role: "presentation", children: [...Array(minimumCount)].map((_element, index) => children(index)) })) : null;
+}
+
+exports.SkeletonContainer = SkeletonContainer;
+//# sourceMappingURL=SkeletonContainer-f1e441c0.js.map

package/cjs/SkeletonContainer-f1e441c0.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonContainer-f1e441c0.js","sources":["../../src/PRIVATE_List/SkeletonContainer.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { ComponentChildren } from 'preact';\nimport { useState, useEffect } from 'preact/hooks';\nimport { classNames } from '../utils/UNSAFE_classNames';\nimport { skeletonStyles } from './themes/ListStyles.css';\n\ntype Props = {\n  /**\n   * Allows to pass and access the properties from child elements\n   **/\n  children?: (index: number) => ComponentChildren;\n  /**\n   * Allows to specify number of skeletons to be rendered on initial load\n   **/\n  minimumCount?: number;\n};\n\n/**\n * Allows to specify the time delay for rendering the component\n **/\nconst timerValue = 50;\n\n/**\n * SkeletonContainer renders 'minimumCount' number of skeletons\n * of the variant specified from its child element - Skeleton's prop after\n * 'timerValue' ms delay\n **/\nexport function SkeletonContainer({ children, minimumCount = 1 }: Props) {\n  const [isVisible, setIsVisible] = useState(false);\n\n  useEffect(() => {\n    setTimeout(() => {\n      setIsVisible(true);\n    }, timerValue);\n  }, []);\n\n  const containerClasses = classNames([skeletonStyles.container]);\n  return isVisible && children ? (\n    <div class={containerClasses} role=\"presentation\">\n      {[...Array(minimumCount)].map((_element, index) => children(index))}\n    </div>\n  ) : null;\n}\n"],"names":["useState","useEffect","classNames","skeletonStyles","_jsx"],"mappings":";;;;;;;;;AAuBA;;AAEI;AACJ,MAAM,UAAU,GAAG,EAAE,CAAC;AAEtB;;;;AAII;AACE,SAAU,iBAAiB,CAAC,EAAE,QAAQ,EAAE,YAAY,GAAG,CAAC,EAAS,EAAA;IACrE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAGA,cAAQ,CAAC,KAAK,CAAC,CAAC;IAElDC,eAAS,CAAC,MAAK;QACb,UAAU,CAAC,MAAK;YACd,YAAY,CAAC,IAAI,CAAC,CAAC;SACpB,EAAE,UAAU,CAAC,CAAC;KAChB,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,gBAAgB,GAAGC,qBAAU,CAAC,CAACC,iDAAc,CAAC,SAAS,CAAC,CAAC,CAAC;IAChE,OAAO,SAAS,IAAI,QAAQ,IAC1BC,wBAAK,KAAK,EAAE,gBAAgB,EAAE,IAAI,EAAC,cAAc,EAAA,QAAA,EAC9C,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,KAAK,KAAK,QAAQ,CAAC,KAAK,CAAC,CAAC,EAC/D,CAAA,IACJ,IAAI,CAAC;AACX;;;;"}

package/cjs/Spacer-71b4deea.js

@@ -0,0 +1,18 @@
+/* @oracle/oraclejet-preact: 15.1.13 */
+'use strict';
+
+var jsxRuntime = require('preact/jsx-runtime');
+var utils_UNSAFE_interpolations_dimensions = require('./utils/UNSAFE_interpolations/dimensions.js');
+var utils_UNSAFE_mergeInterpolations = require('./utils/UNSAFE_mergeInterpolations.js');
+require('./utils/UNSAFE_interpolations/flexitem.js');
+var flexitem = require('./flexitem-5052dcd2.js');
+
+const interpolations = [...Object.values(utils_UNSAFE_interpolations_dimensions.dimensionInterpolations), flexitem.flexitemInterpolations.flex];
+const styleInterpolations = utils_UNSAFE_mergeInterpolations.mergeInterpolations(interpolations);
+const Spacer = ({ ...props }) => {
+    const { class: cls, ...styles } = styleInterpolations(props);
+    return jsxRuntime.jsx("div", { class: cls, style: styles });
+};
+
+exports.Spacer = Spacer;
+//# sourceMappingURL=Spacer-71b4deea.js.map