@react-spectrum/combobox 3.14.0 → 3.14.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,3 +1,3 @@
1
1
  # @react-spectrum/combobox
2
2
 
3
- This package is part of [react-spectrum](https://github.com/adobe-private/react-spectrum-v3). See the repo for more details.
3
+ This package is part of [react-spectrum](https://github.com/adobe/react-spectrum). See the repo for more details.
@@ -2,9 +2,9 @@ require("./combobox.1c1869da.css");
2
2
  var $41fae9390a5a37fa$exports = require("./combobox_css.main.js");
3
3
  var $9e627d9ac6346a53$exports = require("./intlStrings.main.js");
4
4
  var $e514018f82d1b067$exports = require("./MobileComboBox.main.js");
5
- require("./vars.03cfef19.css");
5
+ require("./vars.3f2ff1e8.css");
6
6
  var $2f86633ce5b04f1e$exports = require("./inputgroup_vars_css.main.js");
7
- require("./vars.7a9c8a9c.css");
7
+ require("./vars.202cbdb0.css");
8
8
  var $40cb3a00c193680f$exports = require("./textfield_vars_css.main.js");
9
9
  var $XxzjX$spectrumiconsuiChevronDownMedium = require("@spectrum-icons/ui/ChevronDownMedium");
10
10
  var $XxzjX$reactspectrumutils = require("@react-spectrum/utils");
@@ -66,7 +66,7 @@ $parcel$export(module.exports, "ComboBox", () => $e4f518eb9b010873$export$72b969
66
66
 
67
67
 
68
68
 
69
- function $e4f518eb9b010873$var$ComboBox(props, ref) {
69
+ const $e4f518eb9b010873$export$72b9695b8216309a = /*#__PURE__*/ (0, ($parcel$interopDefault($XxzjX$react))).forwardRef(function ComboBox(props, ref) {
70
70
  props = (0, $XxzjX$reactspectrumprovider.useProviderProps)(props);
71
71
  props = (0, $XxzjX$reactspectrumform.useFormProps)(props);
72
72
  if (props.placeholder) console.warn('Placeholders are deprecated due to accessibility issues. Please use help text instead. See the docs for details: https://react-spectrum.adobe.com/react-spectrum/ComboBox.html#help-text');
@@ -81,7 +81,7 @@ function $e4f518eb9b010873$var$ComboBox(props, ref) {
81
81
  ...props,
82
82
  ref: ref
83
83
  });
84
- }
84
+ });
85
85
  const $e4f518eb9b010873$var$ComboBoxBase = /*#__PURE__*/ (0, ($parcel$interopDefault($XxzjX$react))).forwardRef(function ComboBoxBase(props, ref) {
86
86
  let { menuTrigger: menuTrigger = 'input', shouldFlip: shouldFlip = true, direction: direction = 'bottom', align: align = 'start', isQuiet: isQuiet, loadingState: loadingState, onLoadMore: onLoadMore, allowsCustomValue: allowsCustomValue, menuWidth: customMenuWidth, name: name, formValue: formValue = 'text' } = props;
87
87
  if (allowsCustomValue) formValue = 'text';
@@ -289,9 +289,6 @@ const $e4f518eb9b010873$var$ComboBoxInput = /*#__PURE__*/ (0, ($parcel$interopDe
289
289
  UNSAFE_className: (0, $XxzjX$reactspectrumutils.classNames)((0, ($parcel$interopDefault($2f86633ce5b04f1e$exports))), 'spectrum-Dropdown-chevron')
290
290
  })))));
291
291
  });
292
- /**
293
- * ComboBoxes combine a text entry with a picker menu, allowing users to filter longer lists to only the selections matching a query.
294
- */ const $e4f518eb9b010873$export$72b9695b8216309a = /*#__PURE__*/ (0, ($parcel$interopDefault($XxzjX$react))).forwardRef($e4f518eb9b010873$var$ComboBox);
295
292
 
296
293
 
297
294
  //# sourceMappingURL=ComboBox.main.js.map
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/combobox/src/ComboBox.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaButtonProps} from '@react-types/button';\nimport ChevronDownMedium from '@spectrum-icons/ui/ChevronDownMedium';\nimport {\n classNames,\n dimensionValue,\n useFocusableRef,\n useIsMobileDevice,\n useResizeObserver,\n useUnwrapDOMRef\n} from '@react-spectrum/utils';\nimport comboboxStyles from './combobox.css';\nimport {DOMRefValue, FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {Field} from '@react-spectrum/label';\nimport {FieldButton} from '@react-spectrum/button';\nimport {FocusRing} from '@react-aria/focus';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListBoxBase, useListBoxLayout} from '@react-spectrum/listbox';\nimport {MobileComboBox} from './MobileComboBox';\nimport {Popover} from '@react-spectrum/overlays';\nimport {PressResponder, useHover} from '@react-aria/interactions';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {\n ForwardedRef,\n InputHTMLAttributes,\n ReactElement,\n RefObject,\n useCallback,\n useEffect,\n useRef,\n useState\n} from 'react';\nimport {SpectrumComboBoxProps} from '@react-types/combobox';\nimport styles from '@adobe/spectrum-css-temp/components/inputgroup/vars.css';\nimport {TextFieldBase} from '@react-spectrum/textfield';\nimport textfieldStyles from '@adobe/spectrum-css-temp/components/textfield/vars.css';\nimport {useComboBox} from '@react-aria/combobox';\nimport {useComboBoxState} from '@react-stately/combobox';\nimport {useFilter, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useFormProps} from '@react-spectrum/form';\nimport {useLayoutEffect} from '@react-aria/utils';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\n\nfunction ComboBox<T extends object>(props: SpectrumComboBoxProps<T>, ref: FocusableRef<HTMLElement>) {\n props = useProviderProps(props);\n props = useFormProps(props);\n\n if (props.placeholder) {\n console.warn('Placeholders are deprecated due to accessibility issues. Please use help text instead. See the docs for details: https://react-spectrum.adobe.com/react-spectrum/ComboBox.html#help-text');\n }\n\n let isMobile = useIsMobileDevice();\n if (isMobile) {\n // menuTrigger=focus/manual don't apply to mobile combobox\n return <MobileComboBox {...props} menuTrigger=\"input\" ref={ref} />;\n } else {\n return <ComboBoxBase {...props} ref={ref} />;\n }\n}\n\nconst ComboBoxBase = React.forwardRef(function ComboBoxBase(props: SpectrumComboBoxProps<any>, ref: FocusableRef<HTMLElement>) {\n let {\n menuTrigger = 'input',\n shouldFlip = true,\n direction = 'bottom',\n align = 'start',\n isQuiet,\n loadingState,\n onLoadMore,\n allowsCustomValue,\n menuWidth: customMenuWidth,\n name,\n formValue = 'text'\n } = props;\n if (allowsCustomValue) {\n formValue = 'text';\n }\n\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/combobox');\n let isAsync = loadingState != null;\n let popoverRef = useRef<DOMRefValue<HTMLDivElement>>(null);\n let unwrappedPopoverRef = useUnwrapDOMRef(popoverRef);\n let buttonRef = useRef<FocusableRefValue<HTMLElement>>(null);\n let unwrappedButtonRef = useUnwrapDOMRef(buttonRef);\n let listBoxRef = useRef(null);\n let inputRef = useRef<HTMLInputElement>(null);\n // serve as the new popover `triggerRef` instead of `unwrappedButtonRef` before for better positioning.\n let inputGroupRef = useRef<HTMLDivElement>(null);\n let domRef = useFocusableRef(ref, inputRef);\n\n let {contains} = useFilter({sensitivity: 'base'});\n let state = useComboBoxState(\n {\n ...props,\n defaultFilter: contains,\n allowsEmptyCollection: isAsync\n }\n );\n let layout = useListBoxLayout();\n\n let {buttonProps, inputProps, listBoxProps, labelProps, descriptionProps, errorMessageProps, isInvalid, validationErrors, validationDetails} = useComboBox(\n {\n ...props,\n layoutDelegate: layout,\n buttonRef: unwrappedButtonRef,\n popoverRef: unwrappedPopoverRef,\n listBoxRef,\n inputRef: inputRef,\n menuTrigger,\n name: formValue === 'text' ? name : undefined\n },\n state\n );\n\n // Measure the width of the inputfield and the button to inform the width of the menu (below).\n let [menuWidth, setMenuWidth] = useState<number | undefined>(undefined);\n let {scale} = useProvider();\n\n let onResize = useCallback(() => {\n if (unwrappedButtonRef.current && inputRef.current) {\n let buttonWidth = unwrappedButtonRef.current.offsetWidth;\n let inputWidth = inputRef.current.offsetWidth;\n setMenuWidth(buttonWidth + inputWidth);\n }\n }, [unwrappedButtonRef, inputRef, setMenuWidth]);\n\n useResizeObserver({\n ref: domRef,\n onResize: onResize\n });\n\n useLayoutEffect(onResize, [scale, onResize]);\n\n let width = isQuiet ? undefined : menuWidth;\n let style = {\n width: customMenuWidth ? dimensionValue(customMenuWidth) : width,\n minWidth: isQuiet ? `calc(${menuWidth}px + calc(2 * var(--spectrum-dropdown-quiet-offset)))` : menuWidth\n };\n let cbInputProps = {...props, children: null};\n\n return (\n <>\n <Field\n {...props}\n descriptionProps={descriptionProps}\n errorMessageProps={errorMessageProps}\n isInvalid={isInvalid}\n validationErrors={validationErrors}\n validationDetails={validationDetails}\n labelProps={labelProps}\n ref={domRef}>\n <ComboBoxInput\n {...cbInputProps}\n isOpen={state.isOpen}\n loadingState={loadingState}\n inputProps={inputProps}\n inputRef={inputRef}\n triggerProps={buttonProps}\n triggerRef={buttonRef}\n validationState={props.validationState || (isInvalid ? 'invalid' : undefined)}\n ref={inputGroupRef} />\n </Field>\n {name && formValue === 'key' && <input type=\"hidden\" name={name} value={state.selectedKey ?? ''} />}\n <Popover\n state={state}\n UNSAFE_style={style}\n UNSAFE_className={classNames(styles, 'spectrum-InputGroup-popover', {'spectrum-InputGroup-popover--quiet': isQuiet})}\n ref={popoverRef}\n triggerRef={inputGroupRef}\n scrollRef={listBoxRef}\n placement={`${direction} ${align}`}\n hideArrow\n isNonModal\n shouldFlip={shouldFlip}>\n <ListBoxBase\n {...listBoxProps}\n ref={listBoxRef}\n disallowEmptySelection\n autoFocus={state.focusStrategy ?? undefined}\n shouldSelectOnPressUp\n focusOnPointerEnter\n layout={layout}\n state={state}\n shouldUseVirtualFocus\n isLoading={loadingState === 'loading' || loadingState === 'loadingMore'}\n showLoadingSpinner={loadingState === 'loadingMore'}\n onLoadMore={onLoadMore}\n renderEmptyState={() => isAsync && (\n <span className={classNames(comboboxStyles, 'no-results')}>\n {loadingState === 'loading' ? stringFormatter.format('loading') : stringFormatter.format('noResults')}\n </span>\n )} />\n </Popover>\n </>\n );\n});\n\ninterface ComboBoxInputProps extends SpectrumComboBoxProps<unknown> {\n inputProps: InputHTMLAttributes<HTMLInputElement>,\n inputRef: RefObject<HTMLInputElement | HTMLTextAreaElement | null>,\n triggerProps: AriaButtonProps,\n triggerRef: RefObject<FocusableRefValue<HTMLElement> | null>,\n style?: React.CSSProperties,\n className?: string,\n isOpen?: boolean\n}\n\nconst ComboBoxInput = React.forwardRef(function ComboBoxInput(props: ComboBoxInputProps, ref: ForwardedRef<HTMLElement | null>) {\n let {\n isQuiet,\n isDisabled,\n validationState,\n inputProps,\n inputRef,\n triggerProps,\n triggerRef,\n autoFocus,\n style,\n className,\n loadingState,\n isOpen,\n menuTrigger\n } = props;\n let {hoverProps, isHovered} = useHover({});\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/combobox');\n let timeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n let [showLoading, setShowLoading] = useState(false);\n\n let loadingCircle = (\n <ProgressCircle\n aria-label={stringFormatter.format('loading')}\n size=\"S\"\n isIndeterminate\n UNSAFE_className={classNames(\n textfieldStyles,\n 'spectrum-Textfield-circleLoader',\n classNames(\n styles,\n 'spectrum-InputGroup-input-circleLoader'\n )\n )} />\n );\n\n let isLoading = loadingState === 'loading' || loadingState === 'filtering';\n let inputValue = inputProps.value;\n let lastInputValue = useRef(inputValue);\n useEffect(() => {\n if (isLoading && !showLoading) {\n if (timeout.current === null) {\n timeout.current = setTimeout(() => {\n setShowLoading(true);\n }, 500);\n }\n\n // If user is typing, clear the timer and restart since it is a new request\n if (inputValue !== lastInputValue.current) {\n clearTimeout(timeout.current);\n timeout.current = setTimeout(() => {\n setShowLoading(true);\n }, 500);\n }\n } else if (!isLoading) {\n // If loading is no longer happening, clear any timers and hide the loading circle\n setShowLoading(false);\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n timeout.current = null;\n }\n\n lastInputValue.current = inputValue;\n }, [isLoading, showLoading, inputValue]);\n\n useEffect(() => {\n return () => {\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n timeout.current = null;\n };\n }, []);\n\n return (\n (<FocusRing\n within\n isTextInput\n focusClass={classNames(styles, 'is-focused')}\n focusRingClass={classNames(styles, 'focus-ring')}\n autoFocus={autoFocus}>\n <div\n {...hoverProps}\n ref={ref as RefObject<HTMLDivElement | null>}\n style={style}\n className={\n classNames(\n styles,\n 'spectrum-InputGroup',\n {\n 'spectrum-InputGroup--quiet': isQuiet,\n 'is-disabled': isDisabled,\n 'spectrum-InputGroup--invalid': validationState === 'invalid' && !isDisabled,\n 'is-hovered': isHovered\n },\n className\n )\n }>\n <TextFieldBase\n inputProps={inputProps}\n inputRef={inputRef}\n UNSAFE_className={\n classNames(\n styles,\n 'spectrum-InputGroup-field'\n )\n }\n inputClassName={\n classNames(\n styles,\n 'spectrum-InputGroup-input'\n )\n }\n validationIconClassName={\n classNames(\n styles,\n 'spectrum-InputGroup-input-validationIcon'\n )\n }\n isDisabled={isDisabled}\n isQuiet={isQuiet}\n validationState={validationState}\n // loading circle should only be displayed if menu is open, if menuTrigger is \"manual\", or first time load (to stop circle from showing up when user selects an option)\n // TODO: add special case for completionMode: complete as well\n isLoading={showLoading && (isOpen || menuTrigger === 'manual' || loadingState === 'loading')}\n loadingIndicator={loadingState != null ? loadingCircle : undefined}\n disableFocusRing />\n <PressResponder preventFocusOnPress isPressed={isOpen}>\n <FieldButton\n {...triggerProps}\n ref={triggerRef}\n UNSAFE_className={\n classNames(\n styles,\n 'spectrum-FieldButton'\n )\n }\n isQuiet={isQuiet}\n validationState={validationState}>\n <ChevronDownMedium UNSAFE_className={classNames(styles, 'spectrum-Dropdown-chevron')} />\n </FieldButton>\n </PressResponder>\n </div>\n </FocusRing>)\n );\n});\n\n/**\n * ComboBoxes combine a text entry with a picker menu, allowing users to filter longer lists to only the selections matching a query.\n */\nconst _ComboBox = React.forwardRef(ComboBox) as <T>(props: SpectrumComboBoxProps<T> & {ref?: FocusableRef<HTMLElement>}) => ReactElement;\nexport {_ComboBox as ComboBox};\n"],"names":[],"version":3,"file":"ComboBox.main.js.map"}
1
+ {"mappings":"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","sources":["packages/@react-spectrum/combobox/src/ComboBox.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaButtonProps} from '@react-types/button';\nimport ChevronDownMedium from '@spectrum-icons/ui/ChevronDownMedium';\nimport {\n classNames,\n dimensionValue,\n useFocusableRef,\n useIsMobileDevice,\n useResizeObserver,\n useUnwrapDOMRef\n} from '@react-spectrum/utils';\nimport comboboxStyles from './combobox.css';\nimport {DOMRefValue, FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {Field} from '@react-spectrum/label';\nimport {FieldButton} from '@react-spectrum/button';\nimport {FocusRing} from '@react-aria/focus';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListBoxBase, useListBoxLayout} from '@react-spectrum/listbox';\nimport {MobileComboBox} from './MobileComboBox';\nimport {Popover} from '@react-spectrum/overlays';\nimport {PressResponder, useHover} from '@react-aria/interactions';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {\n ForwardedRef,\n InputHTMLAttributes,\n ReactElement,\n RefObject,\n useCallback,\n useEffect,\n useRef,\n useState\n} from 'react';\nimport {SpectrumComboBoxProps} from '@react-types/combobox';\nimport styles from '@adobe/spectrum-css-temp/components/inputgroup/vars.css';\nimport {TextFieldBase} from '@react-spectrum/textfield';\nimport textfieldStyles from '@adobe/spectrum-css-temp/components/textfield/vars.css';\nimport {useComboBox} from '@react-aria/combobox';\nimport {useComboBoxState} from '@react-stately/combobox';\nimport {useFilter, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useFormProps} from '@react-spectrum/form';\nimport {useLayoutEffect} from '@react-aria/utils';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\n\n/**\n * ComboBoxes combine a text entry with a picker menu, allowing users to filter longer lists to only the selections matching a query.\n */\nexport const ComboBox = React.forwardRef(function ComboBox<T extends object>(props: SpectrumComboBoxProps<T>, ref: FocusableRef<HTMLElement>) {\n props = useProviderProps(props);\n props = useFormProps(props);\n\n if (props.placeholder) {\n console.warn('Placeholders are deprecated due to accessibility issues. Please use help text instead. See the docs for details: https://react-spectrum.adobe.com/react-spectrum/ComboBox.html#help-text');\n }\n\n let isMobile = useIsMobileDevice();\n if (isMobile) {\n // menuTrigger=focus/manual don't apply to mobile combobox\n return <MobileComboBox {...props} menuTrigger=\"input\" ref={ref} />;\n } else {\n return <ComboBoxBase {...props} ref={ref} />;\n }\n}) as <T>(props: SpectrumComboBoxProps<T> & {ref?: FocusableRef<HTMLElement>}) => ReactElement;\n\nconst ComboBoxBase = React.forwardRef(function ComboBoxBase(props: SpectrumComboBoxProps<any>, ref: FocusableRef<HTMLElement>) {\n let {\n menuTrigger = 'input',\n shouldFlip = true,\n direction = 'bottom',\n align = 'start',\n isQuiet,\n loadingState,\n onLoadMore,\n allowsCustomValue,\n menuWidth: customMenuWidth,\n name,\n formValue = 'text'\n } = props;\n if (allowsCustomValue) {\n formValue = 'text';\n }\n\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/combobox');\n let isAsync = loadingState != null;\n let popoverRef = useRef<DOMRefValue<HTMLDivElement>>(null);\n let unwrappedPopoverRef = useUnwrapDOMRef(popoverRef);\n let buttonRef = useRef<FocusableRefValue<HTMLElement>>(null);\n let unwrappedButtonRef = useUnwrapDOMRef(buttonRef);\n let listBoxRef = useRef(null);\n let inputRef = useRef<HTMLInputElement>(null);\n // serve as the new popover `triggerRef` instead of `unwrappedButtonRef` before for better positioning.\n let inputGroupRef = useRef<HTMLDivElement>(null);\n let domRef = useFocusableRef(ref, inputRef);\n\n let {contains} = useFilter({sensitivity: 'base'});\n let state = useComboBoxState(\n {\n ...props,\n defaultFilter: contains,\n allowsEmptyCollection: isAsync\n }\n );\n let layout = useListBoxLayout();\n\n let {buttonProps, inputProps, listBoxProps, labelProps, descriptionProps, errorMessageProps, isInvalid, validationErrors, validationDetails} = useComboBox(\n {\n ...props,\n layoutDelegate: layout,\n buttonRef: unwrappedButtonRef,\n popoverRef: unwrappedPopoverRef,\n listBoxRef,\n inputRef: inputRef,\n menuTrigger,\n name: formValue === 'text' ? name : undefined\n },\n state\n );\n\n // Measure the width of the inputfield and the button to inform the width of the menu (below).\n let [menuWidth, setMenuWidth] = useState<number | undefined>(undefined);\n let {scale} = useProvider();\n\n let onResize = useCallback(() => {\n if (unwrappedButtonRef.current && inputRef.current) {\n let buttonWidth = unwrappedButtonRef.current.offsetWidth;\n let inputWidth = inputRef.current.offsetWidth;\n setMenuWidth(buttonWidth + inputWidth);\n }\n }, [unwrappedButtonRef, inputRef, setMenuWidth]);\n\n useResizeObserver({\n ref: domRef,\n onResize: onResize\n });\n\n useLayoutEffect(onResize, [scale, onResize]);\n\n let width = isQuiet ? undefined : menuWidth;\n let style = {\n width: customMenuWidth ? dimensionValue(customMenuWidth) : width,\n minWidth: isQuiet ? `calc(${menuWidth}px + calc(2 * var(--spectrum-dropdown-quiet-offset)))` : menuWidth\n };\n let cbInputProps = {...props, children: null};\n\n return (\n <>\n <Field\n {...props}\n descriptionProps={descriptionProps}\n errorMessageProps={errorMessageProps}\n isInvalid={isInvalid}\n validationErrors={validationErrors}\n validationDetails={validationDetails}\n labelProps={labelProps}\n ref={domRef}>\n <ComboBoxInput\n {...cbInputProps}\n isOpen={state.isOpen}\n loadingState={loadingState}\n inputProps={inputProps}\n inputRef={inputRef}\n triggerProps={buttonProps}\n triggerRef={buttonRef}\n validationState={props.validationState || (isInvalid ? 'invalid' : undefined)}\n ref={inputGroupRef} />\n </Field>\n {name && formValue === 'key' && <input type=\"hidden\" name={name} value={state.selectedKey ?? ''} />}\n <Popover\n state={state}\n UNSAFE_style={style}\n UNSAFE_className={classNames(styles, 'spectrum-InputGroup-popover', {'spectrum-InputGroup-popover--quiet': isQuiet})}\n ref={popoverRef}\n triggerRef={inputGroupRef}\n scrollRef={listBoxRef}\n placement={`${direction} ${align}`}\n hideArrow\n isNonModal\n shouldFlip={shouldFlip}>\n <ListBoxBase\n {...listBoxProps}\n ref={listBoxRef}\n disallowEmptySelection\n autoFocus={state.focusStrategy ?? undefined}\n shouldSelectOnPressUp\n focusOnPointerEnter\n layout={layout}\n state={state}\n shouldUseVirtualFocus\n isLoading={loadingState === 'loading' || loadingState === 'loadingMore'}\n showLoadingSpinner={loadingState === 'loadingMore'}\n onLoadMore={onLoadMore}\n renderEmptyState={() => isAsync && (\n <span className={classNames(comboboxStyles, 'no-results')}>\n {loadingState === 'loading' ? stringFormatter.format('loading') : stringFormatter.format('noResults')}\n </span>\n )} />\n </Popover>\n </>\n );\n});\n\ninterface ComboBoxInputProps extends SpectrumComboBoxProps<unknown> {\n inputProps: InputHTMLAttributes<HTMLInputElement>,\n inputRef: RefObject<HTMLInputElement | HTMLTextAreaElement | null>,\n triggerProps: AriaButtonProps,\n triggerRef: RefObject<FocusableRefValue<HTMLElement> | null>,\n style?: React.CSSProperties,\n className?: string,\n isOpen?: boolean\n}\n\nconst ComboBoxInput = React.forwardRef(function ComboBoxInput(props: ComboBoxInputProps, ref: ForwardedRef<HTMLElement | null>) {\n let {\n isQuiet,\n isDisabled,\n validationState,\n inputProps,\n inputRef,\n triggerProps,\n triggerRef,\n autoFocus,\n style,\n className,\n loadingState,\n isOpen,\n menuTrigger\n } = props;\n let {hoverProps, isHovered} = useHover({});\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/combobox');\n let timeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n let [showLoading, setShowLoading] = useState(false);\n\n let loadingCircle = (\n <ProgressCircle\n aria-label={stringFormatter.format('loading')}\n size=\"S\"\n isIndeterminate\n UNSAFE_className={classNames(\n textfieldStyles,\n 'spectrum-Textfield-circleLoader',\n classNames(\n styles,\n 'spectrum-InputGroup-input-circleLoader'\n )\n )} />\n );\n\n let isLoading = loadingState === 'loading' || loadingState === 'filtering';\n let inputValue = inputProps.value;\n let lastInputValue = useRef(inputValue);\n useEffect(() => {\n if (isLoading && !showLoading) {\n if (timeout.current === null) {\n timeout.current = setTimeout(() => {\n setShowLoading(true);\n }, 500);\n }\n\n // If user is typing, clear the timer and restart since it is a new request\n if (inputValue !== lastInputValue.current) {\n clearTimeout(timeout.current);\n timeout.current = setTimeout(() => {\n setShowLoading(true);\n }, 500);\n }\n } else if (!isLoading) {\n // If loading is no longer happening, clear any timers and hide the loading circle\n setShowLoading(false);\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n timeout.current = null;\n }\n\n lastInputValue.current = inputValue;\n }, [isLoading, showLoading, inputValue]);\n\n useEffect(() => {\n return () => {\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n timeout.current = null;\n };\n }, []);\n\n return (\n (<FocusRing\n within\n isTextInput\n focusClass={classNames(styles, 'is-focused')}\n focusRingClass={classNames(styles, 'focus-ring')}\n autoFocus={autoFocus}>\n <div\n {...hoverProps}\n ref={ref as RefObject<HTMLDivElement | null>}\n style={style}\n className={\n classNames(\n styles,\n 'spectrum-InputGroup',\n {\n 'spectrum-InputGroup--quiet': isQuiet,\n 'is-disabled': isDisabled,\n 'spectrum-InputGroup--invalid': validationState === 'invalid' && !isDisabled,\n 'is-hovered': isHovered\n },\n className\n )\n }>\n <TextFieldBase\n inputProps={inputProps}\n inputRef={inputRef}\n UNSAFE_className={\n classNames(\n styles,\n 'spectrum-InputGroup-field'\n )\n }\n inputClassName={\n classNames(\n styles,\n 'spectrum-InputGroup-input'\n )\n }\n validationIconClassName={\n classNames(\n styles,\n 'spectrum-InputGroup-input-validationIcon'\n )\n }\n isDisabled={isDisabled}\n isQuiet={isQuiet}\n validationState={validationState}\n // loading circle should only be displayed if menu is open, if menuTrigger is \"manual\", or first time load (to stop circle from showing up when user selects an option)\n // TODO: add special case for completionMode: complete as well\n isLoading={showLoading && (isOpen || menuTrigger === 'manual' || loadingState === 'loading')}\n loadingIndicator={loadingState != null ? loadingCircle : undefined}\n disableFocusRing />\n <PressResponder preventFocusOnPress isPressed={isOpen}>\n <FieldButton\n {...triggerProps}\n ref={triggerRef}\n UNSAFE_className={\n classNames(\n styles,\n 'spectrum-FieldButton'\n )\n }\n isQuiet={isQuiet}\n validationState={validationState}>\n <ChevronDownMedium UNSAFE_className={classNames(styles, 'spectrum-Dropdown-chevron')} />\n </FieldButton>\n </PressResponder>\n </div>\n </FocusRing>)\n );\n});\n"],"names":[],"version":3,"file":"ComboBox.main.js.map"}
package/dist/ComboBox.mjs CHANGED
@@ -2,9 +2,9 @@ import "./combobox.1c1869da.css";
2
2
  import $c3ZYr$combobox_cssmodulejs from "./combobox_css.mjs";
3
3
  import $c3ZYr$intlStringsmodulejs from "./intlStrings.mjs";
4
4
  import {MobileComboBox as $a1ae4cad4496428f$export$7637df911c069b4d} from "./MobileComboBox.mjs";
5
- import "./vars.03cfef19.css";
5
+ import "./vars.3f2ff1e8.css";
6
6
  import $c3ZYr$inputgroup_vars_cssmodulejs from "./inputgroup_vars_css.mjs";
7
- import "./vars.7a9c8a9c.css";
7
+ import "./vars.202cbdb0.css";
8
8
  import $c3ZYr$textfield_vars_cssmodulejs from "./textfield_vars_css.mjs";
9
9
  import $c3ZYr$spectrumiconsuiChevronDownMedium from "@spectrum-icons/ui/ChevronDownMedium";
10
10
  import {useIsMobileDevice as $c3ZYr$useIsMobileDevice, useUnwrapDOMRef as $c3ZYr$useUnwrapDOMRef, useFocusableRef as $c3ZYr$useFocusableRef, useResizeObserver as $c3ZYr$useResizeObserver, dimensionValue as $c3ZYr$dimensionValue, classNames as $c3ZYr$classNames} from "@react-spectrum/utils";
@@ -60,7 +60,7 @@ function $parcel$interopDefault(a) {
60
60
 
61
61
 
62
62
 
63
- function $2289f375e813f187$var$ComboBox(props, ref) {
63
+ const $2289f375e813f187$export$72b9695b8216309a = /*#__PURE__*/ (0, $c3ZYr$react).forwardRef(function ComboBox(props, ref) {
64
64
  props = (0, $c3ZYr$useProviderProps)(props);
65
65
  props = (0, $c3ZYr$useFormProps)(props);
66
66
  if (props.placeholder) console.warn('Placeholders are deprecated due to accessibility issues. Please use help text instead. See the docs for details: https://react-spectrum.adobe.com/react-spectrum/ComboBox.html#help-text');
@@ -75,7 +75,7 @@ function $2289f375e813f187$var$ComboBox(props, ref) {
75
75
  ...props,
76
76
  ref: ref
77
77
  });
78
- }
78
+ });
79
79
  const $2289f375e813f187$var$ComboBoxBase = /*#__PURE__*/ (0, $c3ZYr$react).forwardRef(function ComboBoxBase(props, ref) {
80
80
  let { menuTrigger: menuTrigger = 'input', shouldFlip: shouldFlip = true, direction: direction = 'bottom', align: align = 'start', isQuiet: isQuiet, loadingState: loadingState, onLoadMore: onLoadMore, allowsCustomValue: allowsCustomValue, menuWidth: customMenuWidth, name: name, formValue: formValue = 'text' } = props;
81
81
  if (allowsCustomValue) formValue = 'text';
@@ -283,9 +283,6 @@ const $2289f375e813f187$var$ComboBoxInput = /*#__PURE__*/ (0, $c3ZYr$react).forw
283
283
  UNSAFE_className: (0, $c3ZYr$classNames)((0, ($parcel$interopDefault($c3ZYr$inputgroup_vars_cssmodulejs))), 'spectrum-Dropdown-chevron')
284
284
  })))));
285
285
  });
286
- /**
287
- * ComboBoxes combine a text entry with a picker menu, allowing users to filter longer lists to only the selections matching a query.
288
- */ const $2289f375e813f187$export$72b9695b8216309a = /*#__PURE__*/ (0, $c3ZYr$react).forwardRef($2289f375e813f187$var$ComboBox);
289
286
 
290
287
 
291
288
  export {$2289f375e813f187$export$72b9695b8216309a as ComboBox};
@@ -2,9 +2,9 @@ import "./combobox.1c1869da.css";
2
2
  import $c3ZYr$combobox_cssmodulejs from "./combobox_css.module.js";
3
3
  import $c3ZYr$intlStringsmodulejs from "./intlStrings.module.js";
4
4
  import {MobileComboBox as $a1ae4cad4496428f$export$7637df911c069b4d} from "./MobileComboBox.module.js";
5
- import "./vars.03cfef19.css";
5
+ import "./vars.3f2ff1e8.css";
6
6
  import $c3ZYr$inputgroup_vars_cssmodulejs from "./inputgroup_vars_css.module.js";
7
- import "./vars.7a9c8a9c.css";
7
+ import "./vars.202cbdb0.css";
8
8
  import $c3ZYr$textfield_vars_cssmodulejs from "./textfield_vars_css.module.js";
9
9
  import $c3ZYr$spectrumiconsuiChevronDownMedium from "@spectrum-icons/ui/ChevronDownMedium";
10
10
  import {useIsMobileDevice as $c3ZYr$useIsMobileDevice, useUnwrapDOMRef as $c3ZYr$useUnwrapDOMRef, useFocusableRef as $c3ZYr$useFocusableRef, useResizeObserver as $c3ZYr$useResizeObserver, dimensionValue as $c3ZYr$dimensionValue, classNames as $c3ZYr$classNames} from "@react-spectrum/utils";
@@ -60,7 +60,7 @@ function $parcel$interopDefault(a) {
60
60
 
61
61
 
62
62
 
63
- function $2289f375e813f187$var$ComboBox(props, ref) {
63
+ const $2289f375e813f187$export$72b9695b8216309a = /*#__PURE__*/ (0, $c3ZYr$react).forwardRef(function ComboBox(props, ref) {
64
64
  props = (0, $c3ZYr$useProviderProps)(props);
65
65
  props = (0, $c3ZYr$useFormProps)(props);
66
66
  if (props.placeholder) console.warn('Placeholders are deprecated due to accessibility issues. Please use help text instead. See the docs for details: https://react-spectrum.adobe.com/react-spectrum/ComboBox.html#help-text');
@@ -75,7 +75,7 @@ function $2289f375e813f187$var$ComboBox(props, ref) {
75
75
  ...props,
76
76
  ref: ref
77
77
  });
78
- }
78
+ });
79
79
  const $2289f375e813f187$var$ComboBoxBase = /*#__PURE__*/ (0, $c3ZYr$react).forwardRef(function ComboBoxBase(props, ref) {
80
80
  let { menuTrigger: menuTrigger = 'input', shouldFlip: shouldFlip = true, direction: direction = 'bottom', align: align = 'start', isQuiet: isQuiet, loadingState: loadingState, onLoadMore: onLoadMore, allowsCustomValue: allowsCustomValue, menuWidth: customMenuWidth, name: name, formValue: formValue = 'text' } = props;
81
81
  if (allowsCustomValue) formValue = 'text';
@@ -283,9 +283,6 @@ const $2289f375e813f187$var$ComboBoxInput = /*#__PURE__*/ (0, $c3ZYr$react).forw
283
283
  UNSAFE_className: (0, $c3ZYr$classNames)((0, ($parcel$interopDefault($c3ZYr$inputgroup_vars_cssmodulejs))), 'spectrum-Dropdown-chevron')
284
284
  })))));
285
285
  });
286
- /**
287
- * ComboBoxes combine a text entry with a picker menu, allowing users to filter longer lists to only the selections matching a query.
288
- */ const $2289f375e813f187$export$72b9695b8216309a = /*#__PURE__*/ (0, $c3ZYr$react).forwardRef($2289f375e813f187$var$ComboBox);
289
286
 
290
287
 
291
288
  export {$2289f375e813f187$export$72b9695b8216309a as ComboBox};
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/combobox/src/ComboBox.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaButtonProps} from '@react-types/button';\nimport ChevronDownMedium from '@spectrum-icons/ui/ChevronDownMedium';\nimport {\n classNames,\n dimensionValue,\n useFocusableRef,\n useIsMobileDevice,\n useResizeObserver,\n useUnwrapDOMRef\n} from '@react-spectrum/utils';\nimport comboboxStyles from './combobox.css';\nimport {DOMRefValue, FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {Field} from '@react-spectrum/label';\nimport {FieldButton} from '@react-spectrum/button';\nimport {FocusRing} from '@react-aria/focus';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListBoxBase, useListBoxLayout} from '@react-spectrum/listbox';\nimport {MobileComboBox} from './MobileComboBox';\nimport {Popover} from '@react-spectrum/overlays';\nimport {PressResponder, useHover} from '@react-aria/interactions';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {\n ForwardedRef,\n InputHTMLAttributes,\n ReactElement,\n RefObject,\n useCallback,\n useEffect,\n useRef,\n useState\n} from 'react';\nimport {SpectrumComboBoxProps} from '@react-types/combobox';\nimport styles from '@adobe/spectrum-css-temp/components/inputgroup/vars.css';\nimport {TextFieldBase} from '@react-spectrum/textfield';\nimport textfieldStyles from '@adobe/spectrum-css-temp/components/textfield/vars.css';\nimport {useComboBox} from '@react-aria/combobox';\nimport {useComboBoxState} from '@react-stately/combobox';\nimport {useFilter, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useFormProps} from '@react-spectrum/form';\nimport {useLayoutEffect} from '@react-aria/utils';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\n\nfunction ComboBox<T extends object>(props: SpectrumComboBoxProps<T>, ref: FocusableRef<HTMLElement>) {\n props = useProviderProps(props);\n props = useFormProps(props);\n\n if (props.placeholder) {\n console.warn('Placeholders are deprecated due to accessibility issues. Please use help text instead. See the docs for details: https://react-spectrum.adobe.com/react-spectrum/ComboBox.html#help-text');\n }\n\n let isMobile = useIsMobileDevice();\n if (isMobile) {\n // menuTrigger=focus/manual don't apply to mobile combobox\n return <MobileComboBox {...props} menuTrigger=\"input\" ref={ref} />;\n } else {\n return <ComboBoxBase {...props} ref={ref} />;\n }\n}\n\nconst ComboBoxBase = React.forwardRef(function ComboBoxBase(props: SpectrumComboBoxProps<any>, ref: FocusableRef<HTMLElement>) {\n let {\n menuTrigger = 'input',\n shouldFlip = true,\n direction = 'bottom',\n align = 'start',\n isQuiet,\n loadingState,\n onLoadMore,\n allowsCustomValue,\n menuWidth: customMenuWidth,\n name,\n formValue = 'text'\n } = props;\n if (allowsCustomValue) {\n formValue = 'text';\n }\n\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/combobox');\n let isAsync = loadingState != null;\n let popoverRef = useRef<DOMRefValue<HTMLDivElement>>(null);\n let unwrappedPopoverRef = useUnwrapDOMRef(popoverRef);\n let buttonRef = useRef<FocusableRefValue<HTMLElement>>(null);\n let unwrappedButtonRef = useUnwrapDOMRef(buttonRef);\n let listBoxRef = useRef(null);\n let inputRef = useRef<HTMLInputElement>(null);\n // serve as the new popover `triggerRef` instead of `unwrappedButtonRef` before for better positioning.\n let inputGroupRef = useRef<HTMLDivElement>(null);\n let domRef = useFocusableRef(ref, inputRef);\n\n let {contains} = useFilter({sensitivity: 'base'});\n let state = useComboBoxState(\n {\n ...props,\n defaultFilter: contains,\n allowsEmptyCollection: isAsync\n }\n );\n let layout = useListBoxLayout();\n\n let {buttonProps, inputProps, listBoxProps, labelProps, descriptionProps, errorMessageProps, isInvalid, validationErrors, validationDetails} = useComboBox(\n {\n ...props,\n layoutDelegate: layout,\n buttonRef: unwrappedButtonRef,\n popoverRef: unwrappedPopoverRef,\n listBoxRef,\n inputRef: inputRef,\n menuTrigger,\n name: formValue === 'text' ? name : undefined\n },\n state\n );\n\n // Measure the width of the inputfield and the button to inform the width of the menu (below).\n let [menuWidth, setMenuWidth] = useState<number | undefined>(undefined);\n let {scale} = useProvider();\n\n let onResize = useCallback(() => {\n if (unwrappedButtonRef.current && inputRef.current) {\n let buttonWidth = unwrappedButtonRef.current.offsetWidth;\n let inputWidth = inputRef.current.offsetWidth;\n setMenuWidth(buttonWidth + inputWidth);\n }\n }, [unwrappedButtonRef, inputRef, setMenuWidth]);\n\n useResizeObserver({\n ref: domRef,\n onResize: onResize\n });\n\n useLayoutEffect(onResize, [scale, onResize]);\n\n let width = isQuiet ? undefined : menuWidth;\n let style = {\n width: customMenuWidth ? dimensionValue(customMenuWidth) : width,\n minWidth: isQuiet ? `calc(${menuWidth}px + calc(2 * var(--spectrum-dropdown-quiet-offset)))` : menuWidth\n };\n let cbInputProps = {...props, children: null};\n\n return (\n <>\n <Field\n {...props}\n descriptionProps={descriptionProps}\n errorMessageProps={errorMessageProps}\n isInvalid={isInvalid}\n validationErrors={validationErrors}\n validationDetails={validationDetails}\n labelProps={labelProps}\n ref={domRef}>\n <ComboBoxInput\n {...cbInputProps}\n isOpen={state.isOpen}\n loadingState={loadingState}\n inputProps={inputProps}\n inputRef={inputRef}\n triggerProps={buttonProps}\n triggerRef={buttonRef}\n validationState={props.validationState || (isInvalid ? 'invalid' : undefined)}\n ref={inputGroupRef} />\n </Field>\n {name && formValue === 'key' && <input type=\"hidden\" name={name} value={state.selectedKey ?? ''} />}\n <Popover\n state={state}\n UNSAFE_style={style}\n UNSAFE_className={classNames(styles, 'spectrum-InputGroup-popover', {'spectrum-InputGroup-popover--quiet': isQuiet})}\n ref={popoverRef}\n triggerRef={inputGroupRef}\n scrollRef={listBoxRef}\n placement={`${direction} ${align}`}\n hideArrow\n isNonModal\n shouldFlip={shouldFlip}>\n <ListBoxBase\n {...listBoxProps}\n ref={listBoxRef}\n disallowEmptySelection\n autoFocus={state.focusStrategy ?? undefined}\n shouldSelectOnPressUp\n focusOnPointerEnter\n layout={layout}\n state={state}\n shouldUseVirtualFocus\n isLoading={loadingState === 'loading' || loadingState === 'loadingMore'}\n showLoadingSpinner={loadingState === 'loadingMore'}\n onLoadMore={onLoadMore}\n renderEmptyState={() => isAsync && (\n <span className={classNames(comboboxStyles, 'no-results')}>\n {loadingState === 'loading' ? stringFormatter.format('loading') : stringFormatter.format('noResults')}\n </span>\n )} />\n </Popover>\n </>\n );\n});\n\ninterface ComboBoxInputProps extends SpectrumComboBoxProps<unknown> {\n inputProps: InputHTMLAttributes<HTMLInputElement>,\n inputRef: RefObject<HTMLInputElement | HTMLTextAreaElement | null>,\n triggerProps: AriaButtonProps,\n triggerRef: RefObject<FocusableRefValue<HTMLElement> | null>,\n style?: React.CSSProperties,\n className?: string,\n isOpen?: boolean\n}\n\nconst ComboBoxInput = React.forwardRef(function ComboBoxInput(props: ComboBoxInputProps, ref: ForwardedRef<HTMLElement | null>) {\n let {\n isQuiet,\n isDisabled,\n validationState,\n inputProps,\n inputRef,\n triggerProps,\n triggerRef,\n autoFocus,\n style,\n className,\n loadingState,\n isOpen,\n menuTrigger\n } = props;\n let {hoverProps, isHovered} = useHover({});\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/combobox');\n let timeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n let [showLoading, setShowLoading] = useState(false);\n\n let loadingCircle = (\n <ProgressCircle\n aria-label={stringFormatter.format('loading')}\n size=\"S\"\n isIndeterminate\n UNSAFE_className={classNames(\n textfieldStyles,\n 'spectrum-Textfield-circleLoader',\n classNames(\n styles,\n 'spectrum-InputGroup-input-circleLoader'\n )\n )} />\n );\n\n let isLoading = loadingState === 'loading' || loadingState === 'filtering';\n let inputValue = inputProps.value;\n let lastInputValue = useRef(inputValue);\n useEffect(() => {\n if (isLoading && !showLoading) {\n if (timeout.current === null) {\n timeout.current = setTimeout(() => {\n setShowLoading(true);\n }, 500);\n }\n\n // If user is typing, clear the timer and restart since it is a new request\n if (inputValue !== lastInputValue.current) {\n clearTimeout(timeout.current);\n timeout.current = setTimeout(() => {\n setShowLoading(true);\n }, 500);\n }\n } else if (!isLoading) {\n // If loading is no longer happening, clear any timers and hide the loading circle\n setShowLoading(false);\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n timeout.current = null;\n }\n\n lastInputValue.current = inputValue;\n }, [isLoading, showLoading, inputValue]);\n\n useEffect(() => {\n return () => {\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n timeout.current = null;\n };\n }, []);\n\n return (\n (<FocusRing\n within\n isTextInput\n focusClass={classNames(styles, 'is-focused')}\n focusRingClass={classNames(styles, 'focus-ring')}\n autoFocus={autoFocus}>\n <div\n {...hoverProps}\n ref={ref as RefObject<HTMLDivElement | null>}\n style={style}\n className={\n classNames(\n styles,\n 'spectrum-InputGroup',\n {\n 'spectrum-InputGroup--quiet': isQuiet,\n 'is-disabled': isDisabled,\n 'spectrum-InputGroup--invalid': validationState === 'invalid' && !isDisabled,\n 'is-hovered': isHovered\n },\n className\n )\n }>\n <TextFieldBase\n inputProps={inputProps}\n inputRef={inputRef}\n UNSAFE_className={\n classNames(\n styles,\n 'spectrum-InputGroup-field'\n )\n }\n inputClassName={\n classNames(\n styles,\n 'spectrum-InputGroup-input'\n )\n }\n validationIconClassName={\n classNames(\n styles,\n 'spectrum-InputGroup-input-validationIcon'\n )\n }\n isDisabled={isDisabled}\n isQuiet={isQuiet}\n validationState={validationState}\n // loading circle should only be displayed if menu is open, if menuTrigger is \"manual\", or first time load (to stop circle from showing up when user selects an option)\n // TODO: add special case for completionMode: complete as well\n isLoading={showLoading && (isOpen || menuTrigger === 'manual' || loadingState === 'loading')}\n loadingIndicator={loadingState != null ? loadingCircle : undefined}\n disableFocusRing />\n <PressResponder preventFocusOnPress isPressed={isOpen}>\n <FieldButton\n {...triggerProps}\n ref={triggerRef}\n UNSAFE_className={\n classNames(\n styles,\n 'spectrum-FieldButton'\n )\n }\n isQuiet={isQuiet}\n validationState={validationState}>\n <ChevronDownMedium UNSAFE_className={classNames(styles, 'spectrum-Dropdown-chevron')} />\n </FieldButton>\n </PressResponder>\n </div>\n </FocusRing>)\n );\n});\n\n/**\n * ComboBoxes combine a text entry with a picker menu, allowing users to filter longer lists to only the selections matching a query.\n */\nconst _ComboBox = React.forwardRef(ComboBox) as <T>(props: SpectrumComboBoxProps<T> & {ref?: FocusableRef<HTMLElement>}) => ReactElement;\nexport {_ComboBox as ComboBox};\n"],"names":[],"version":3,"file":"ComboBox.module.js.map"}
1
+ {"mappings":"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","sources":["packages/@react-spectrum/combobox/src/ComboBox.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaButtonProps} from '@react-types/button';\nimport ChevronDownMedium from '@spectrum-icons/ui/ChevronDownMedium';\nimport {\n classNames,\n dimensionValue,\n useFocusableRef,\n useIsMobileDevice,\n useResizeObserver,\n useUnwrapDOMRef\n} from '@react-spectrum/utils';\nimport comboboxStyles from './combobox.css';\nimport {DOMRefValue, FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {Field} from '@react-spectrum/label';\nimport {FieldButton} from '@react-spectrum/button';\nimport {FocusRing} from '@react-aria/focus';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListBoxBase, useListBoxLayout} from '@react-spectrum/listbox';\nimport {MobileComboBox} from './MobileComboBox';\nimport {Popover} from '@react-spectrum/overlays';\nimport {PressResponder, useHover} from '@react-aria/interactions';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {\n ForwardedRef,\n InputHTMLAttributes,\n ReactElement,\n RefObject,\n useCallback,\n useEffect,\n useRef,\n useState\n} from 'react';\nimport {SpectrumComboBoxProps} from '@react-types/combobox';\nimport styles from '@adobe/spectrum-css-temp/components/inputgroup/vars.css';\nimport {TextFieldBase} from '@react-spectrum/textfield';\nimport textfieldStyles from '@adobe/spectrum-css-temp/components/textfield/vars.css';\nimport {useComboBox} from '@react-aria/combobox';\nimport {useComboBoxState} from '@react-stately/combobox';\nimport {useFilter, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useFormProps} from '@react-spectrum/form';\nimport {useLayoutEffect} from '@react-aria/utils';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\n\n/**\n * ComboBoxes combine a text entry with a picker menu, allowing users to filter longer lists to only the selections matching a query.\n */\nexport const ComboBox = React.forwardRef(function ComboBox<T extends object>(props: SpectrumComboBoxProps<T>, ref: FocusableRef<HTMLElement>) {\n props = useProviderProps(props);\n props = useFormProps(props);\n\n if (props.placeholder) {\n console.warn('Placeholders are deprecated due to accessibility issues. Please use help text instead. See the docs for details: https://react-spectrum.adobe.com/react-spectrum/ComboBox.html#help-text');\n }\n\n let isMobile = useIsMobileDevice();\n if (isMobile) {\n // menuTrigger=focus/manual don't apply to mobile combobox\n return <MobileComboBox {...props} menuTrigger=\"input\" ref={ref} />;\n } else {\n return <ComboBoxBase {...props} ref={ref} />;\n }\n}) as <T>(props: SpectrumComboBoxProps<T> & {ref?: FocusableRef<HTMLElement>}) => ReactElement;\n\nconst ComboBoxBase = React.forwardRef(function ComboBoxBase(props: SpectrumComboBoxProps<any>, ref: FocusableRef<HTMLElement>) {\n let {\n menuTrigger = 'input',\n shouldFlip = true,\n direction = 'bottom',\n align = 'start',\n isQuiet,\n loadingState,\n onLoadMore,\n allowsCustomValue,\n menuWidth: customMenuWidth,\n name,\n formValue = 'text'\n } = props;\n if (allowsCustomValue) {\n formValue = 'text';\n }\n\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/combobox');\n let isAsync = loadingState != null;\n let popoverRef = useRef<DOMRefValue<HTMLDivElement>>(null);\n let unwrappedPopoverRef = useUnwrapDOMRef(popoverRef);\n let buttonRef = useRef<FocusableRefValue<HTMLElement>>(null);\n let unwrappedButtonRef = useUnwrapDOMRef(buttonRef);\n let listBoxRef = useRef(null);\n let inputRef = useRef<HTMLInputElement>(null);\n // serve as the new popover `triggerRef` instead of `unwrappedButtonRef` before for better positioning.\n let inputGroupRef = useRef<HTMLDivElement>(null);\n let domRef = useFocusableRef(ref, inputRef);\n\n let {contains} = useFilter({sensitivity: 'base'});\n let state = useComboBoxState(\n {\n ...props,\n defaultFilter: contains,\n allowsEmptyCollection: isAsync\n }\n );\n let layout = useListBoxLayout();\n\n let {buttonProps, inputProps, listBoxProps, labelProps, descriptionProps, errorMessageProps, isInvalid, validationErrors, validationDetails} = useComboBox(\n {\n ...props,\n layoutDelegate: layout,\n buttonRef: unwrappedButtonRef,\n popoverRef: unwrappedPopoverRef,\n listBoxRef,\n inputRef: inputRef,\n menuTrigger,\n name: formValue === 'text' ? name : undefined\n },\n state\n );\n\n // Measure the width of the inputfield and the button to inform the width of the menu (below).\n let [menuWidth, setMenuWidth] = useState<number | undefined>(undefined);\n let {scale} = useProvider();\n\n let onResize = useCallback(() => {\n if (unwrappedButtonRef.current && inputRef.current) {\n let buttonWidth = unwrappedButtonRef.current.offsetWidth;\n let inputWidth = inputRef.current.offsetWidth;\n setMenuWidth(buttonWidth + inputWidth);\n }\n }, [unwrappedButtonRef, inputRef, setMenuWidth]);\n\n useResizeObserver({\n ref: domRef,\n onResize: onResize\n });\n\n useLayoutEffect(onResize, [scale, onResize]);\n\n let width = isQuiet ? undefined : menuWidth;\n let style = {\n width: customMenuWidth ? dimensionValue(customMenuWidth) : width,\n minWidth: isQuiet ? `calc(${menuWidth}px + calc(2 * var(--spectrum-dropdown-quiet-offset)))` : menuWidth\n };\n let cbInputProps = {...props, children: null};\n\n return (\n <>\n <Field\n {...props}\n descriptionProps={descriptionProps}\n errorMessageProps={errorMessageProps}\n isInvalid={isInvalid}\n validationErrors={validationErrors}\n validationDetails={validationDetails}\n labelProps={labelProps}\n ref={domRef}>\n <ComboBoxInput\n {...cbInputProps}\n isOpen={state.isOpen}\n loadingState={loadingState}\n inputProps={inputProps}\n inputRef={inputRef}\n triggerProps={buttonProps}\n triggerRef={buttonRef}\n validationState={props.validationState || (isInvalid ? 'invalid' : undefined)}\n ref={inputGroupRef} />\n </Field>\n {name && formValue === 'key' && <input type=\"hidden\" name={name} value={state.selectedKey ?? ''} />}\n <Popover\n state={state}\n UNSAFE_style={style}\n UNSAFE_className={classNames(styles, 'spectrum-InputGroup-popover', {'spectrum-InputGroup-popover--quiet': isQuiet})}\n ref={popoverRef}\n triggerRef={inputGroupRef}\n scrollRef={listBoxRef}\n placement={`${direction} ${align}`}\n hideArrow\n isNonModal\n shouldFlip={shouldFlip}>\n <ListBoxBase\n {...listBoxProps}\n ref={listBoxRef}\n disallowEmptySelection\n autoFocus={state.focusStrategy ?? undefined}\n shouldSelectOnPressUp\n focusOnPointerEnter\n layout={layout}\n state={state}\n shouldUseVirtualFocus\n isLoading={loadingState === 'loading' || loadingState === 'loadingMore'}\n showLoadingSpinner={loadingState === 'loadingMore'}\n onLoadMore={onLoadMore}\n renderEmptyState={() => isAsync && (\n <span className={classNames(comboboxStyles, 'no-results')}>\n {loadingState === 'loading' ? stringFormatter.format('loading') : stringFormatter.format('noResults')}\n </span>\n )} />\n </Popover>\n </>\n );\n});\n\ninterface ComboBoxInputProps extends SpectrumComboBoxProps<unknown> {\n inputProps: InputHTMLAttributes<HTMLInputElement>,\n inputRef: RefObject<HTMLInputElement | HTMLTextAreaElement | null>,\n triggerProps: AriaButtonProps,\n triggerRef: RefObject<FocusableRefValue<HTMLElement> | null>,\n style?: React.CSSProperties,\n className?: string,\n isOpen?: boolean\n}\n\nconst ComboBoxInput = React.forwardRef(function ComboBoxInput(props: ComboBoxInputProps, ref: ForwardedRef<HTMLElement | null>) {\n let {\n isQuiet,\n isDisabled,\n validationState,\n inputProps,\n inputRef,\n triggerProps,\n triggerRef,\n autoFocus,\n style,\n className,\n loadingState,\n isOpen,\n menuTrigger\n } = props;\n let {hoverProps, isHovered} = useHover({});\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/combobox');\n let timeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n let [showLoading, setShowLoading] = useState(false);\n\n let loadingCircle = (\n <ProgressCircle\n aria-label={stringFormatter.format('loading')}\n size=\"S\"\n isIndeterminate\n UNSAFE_className={classNames(\n textfieldStyles,\n 'spectrum-Textfield-circleLoader',\n classNames(\n styles,\n 'spectrum-InputGroup-input-circleLoader'\n )\n )} />\n );\n\n let isLoading = loadingState === 'loading' || loadingState === 'filtering';\n let inputValue = inputProps.value;\n let lastInputValue = useRef(inputValue);\n useEffect(() => {\n if (isLoading && !showLoading) {\n if (timeout.current === null) {\n timeout.current = setTimeout(() => {\n setShowLoading(true);\n }, 500);\n }\n\n // If user is typing, clear the timer and restart since it is a new request\n if (inputValue !== lastInputValue.current) {\n clearTimeout(timeout.current);\n timeout.current = setTimeout(() => {\n setShowLoading(true);\n }, 500);\n }\n } else if (!isLoading) {\n // If loading is no longer happening, clear any timers and hide the loading circle\n setShowLoading(false);\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n timeout.current = null;\n }\n\n lastInputValue.current = inputValue;\n }, [isLoading, showLoading, inputValue]);\n\n useEffect(() => {\n return () => {\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n timeout.current = null;\n };\n }, []);\n\n return (\n (<FocusRing\n within\n isTextInput\n focusClass={classNames(styles, 'is-focused')}\n focusRingClass={classNames(styles, 'focus-ring')}\n autoFocus={autoFocus}>\n <div\n {...hoverProps}\n ref={ref as RefObject<HTMLDivElement | null>}\n style={style}\n className={\n classNames(\n styles,\n 'spectrum-InputGroup',\n {\n 'spectrum-InputGroup--quiet': isQuiet,\n 'is-disabled': isDisabled,\n 'spectrum-InputGroup--invalid': validationState === 'invalid' && !isDisabled,\n 'is-hovered': isHovered\n },\n className\n )\n }>\n <TextFieldBase\n inputProps={inputProps}\n inputRef={inputRef}\n UNSAFE_className={\n classNames(\n styles,\n 'spectrum-InputGroup-field'\n )\n }\n inputClassName={\n classNames(\n styles,\n 'spectrum-InputGroup-input'\n )\n }\n validationIconClassName={\n classNames(\n styles,\n 'spectrum-InputGroup-input-validationIcon'\n )\n }\n isDisabled={isDisabled}\n isQuiet={isQuiet}\n validationState={validationState}\n // loading circle should only be displayed if menu is open, if menuTrigger is \"manual\", or first time load (to stop circle from showing up when user selects an option)\n // TODO: add special case for completionMode: complete as well\n isLoading={showLoading && (isOpen || menuTrigger === 'manual' || loadingState === 'loading')}\n loadingIndicator={loadingState != null ? loadingCircle : undefined}\n disableFocusRing />\n <PressResponder preventFocusOnPress isPressed={isOpen}>\n <FieldButton\n {...triggerProps}\n ref={triggerRef}\n UNSAFE_className={\n classNames(\n styles,\n 'spectrum-FieldButton'\n )\n }\n isQuiet={isQuiet}\n validationState={validationState}>\n <ChevronDownMedium UNSAFE_className={classNames(styles, 'spectrum-Dropdown-chevron')} />\n </FieldButton>\n </PressResponder>\n </div>\n </FocusRing>)\n );\n});\n"],"names":[],"version":3,"file":"ComboBox.module.js.map"}
@@ -1,15 +1,15 @@
1
- require("./vars.01699409.css");
1
+ require("./vars.8e9a1ae1.css");
2
2
  var $afc5a4514aca2340$exports = require("./button_vars_css.main.js");
3
3
  require("./combobox.1c1869da.css");
4
4
  var $41fae9390a5a37fa$exports = require("./combobox_css.main.js");
5
5
  var $9e627d9ac6346a53$exports = require("./intlStrings.main.js");
6
- require("./vars.09a5f62b.css");
6
+ require("./vars.3ad1a294.css");
7
7
  var $eb2fc0ee655eff6b$exports = require("./fieldlabel_vars_css.main.js");
8
8
  require("./vars.3e061265.css");
9
9
  var $1e139f06a0a4b696$exports = require("./search_vars_css.main.js");
10
- require("./vars.03cfef19.css");
10
+ require("./vars.3f2ff1e8.css");
11
11
  var $2f86633ce5b04f1e$exports = require("./inputgroup_vars_css.main.js");
12
- require("./vars.7a9c8a9c.css");
12
+ require("./vars.202cbdb0.css");
13
13
  var $40cb3a00c193680f$exports = require("./textfield_vars_css.main.js");
14
14
  var $iKVNA$spectrumiconsuiAlertMedium = require("@spectrum-icons/ui/AlertMedium");
15
15
  var $iKVNA$spectrumiconsuiCheckmarkMedium = require("@spectrum-icons/ui/CheckmarkMedium");
@@ -1,15 +1,15 @@
1
- import "./vars.01699409.css";
1
+ import "./vars.8e9a1ae1.css";
2
2
  import $gRayl$button_vars_cssmodulejs from "./button_vars_css.mjs";
3
3
  import "./combobox.1c1869da.css";
4
4
  import $gRayl$combobox_cssmodulejs from "./combobox_css.mjs";
5
5
  import $gRayl$intlStringsmodulejs from "./intlStrings.mjs";
6
- import "./vars.09a5f62b.css";
6
+ import "./vars.3ad1a294.css";
7
7
  import $gRayl$fieldlabel_vars_cssmodulejs from "./fieldlabel_vars_css.mjs";
8
8
  import "./vars.3e061265.css";
9
9
  import $gRayl$search_vars_cssmodulejs from "./search_vars_css.mjs";
10
- import "./vars.03cfef19.css";
10
+ import "./vars.3f2ff1e8.css";
11
11
  import $gRayl$inputgroup_vars_cssmodulejs from "./inputgroup_vars_css.mjs";
12
- import "./vars.7a9c8a9c.css";
12
+ import "./vars.202cbdb0.css";
13
13
  import $gRayl$textfield_vars_cssmodulejs from "./textfield_vars_css.mjs";
14
14
  import $gRayl$spectrumiconsuiAlertMedium from "@spectrum-icons/ui/AlertMedium";
15
15
  import $gRayl$spectrumiconsuiCheckmarkMedium from "@spectrum-icons/ui/CheckmarkMedium";
@@ -1,15 +1,15 @@
1
- import "./vars.01699409.css";
1
+ import "./vars.8e9a1ae1.css";
2
2
  import $gRayl$button_vars_cssmodulejs from "./button_vars_css.module.js";
3
3
  import "./combobox.1c1869da.css";
4
4
  import $gRayl$combobox_cssmodulejs from "./combobox_css.module.js";
5
5
  import $gRayl$intlStringsmodulejs from "./intlStrings.module.js";
6
- import "./vars.09a5f62b.css";
6
+ import "./vars.3ad1a294.css";
7
7
  import $gRayl$fieldlabel_vars_cssmodulejs from "./fieldlabel_vars_css.module.js";
8
8
  import "./vars.3e061265.css";
9
9
  import $gRayl$search_vars_cssmodulejs from "./search_vars_css.module.js";
10
- import "./vars.03cfef19.css";
10
+ import "./vars.3f2ff1e8.css";
11
11
  import $gRayl$inputgroup_vars_cssmodulejs from "./inputgroup_vars_css.module.js";
12
- import "./vars.7a9c8a9c.css";
12
+ import "./vars.202cbdb0.css";
13
13
  import $gRayl$textfield_vars_cssmodulejs from "./textfield_vars_css.module.js";
14
14
  import $gRayl$spectrumiconsuiAlertMedium from "@spectrum-icons/ui/AlertMedium";
15
15
  import $gRayl$spectrumiconsuiCheckmarkMedium from "@spectrum-icons/ui/CheckmarkMedium";
@@ -1 +1 @@
1
- {"mappings":";;;AC+WA;;GAEG;AACH,OAAA,MAAM,UAA0C,CAAC,CAAC,EAAE,KAAK,EAAE,sBAAsB,CAAC,CAAC,GAAG;IAAC,GAAG,CAAC,EAAE,aAAa,WAAW,CAAC,CAAA;CAAC,KAAK,YAAY,CAAC;ACnWzI,OAAO,EAAC,IAAI,EAAE,OAAO,EAAC,MAAM,4BAA4B,CAAC;AACzD,YAAY,EAAC,qBAAqB,EAAC,MAAM,uBAAuB,CAAC","sources":["packages/@react-spectrum/combobox/src/packages/@react-spectrum/combobox/src/MobileComboBox.tsx","packages/@react-spectrum/combobox/src/packages/@react-spectrum/combobox/src/ComboBox.tsx","packages/@react-spectrum/combobox/src/packages/@react-spectrum/combobox/src/index.ts","packages/@react-spectrum/combobox/src/index.ts"],"sourcesContent":[null,null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {ComboBox} from './ComboBox';\nexport {Item, Section} from '@react-stately/collections';\nexport type {SpectrumComboBoxProps} from '@react-types/combobox';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
1
+ {"mappings":";;;ACuDA;;GAEG;AACH,OAAO,MAAM,UAeP,CAAC,CAAC,EAAE,KAAK,EAAE,sBAAsB,CAAC,CAAC,GAAG;IAAC,GAAG,CAAC,EAAE,aAAa,WAAW,CAAC,CAAA;CAAC,KAAK,YAAY,CAAC;AC1D/F,OAAO,EAAC,IAAI,EAAE,OAAO,EAAC,MAAM,4BAA4B,CAAC;AACzD,YAAY,EAAC,qBAAqB,EAAC,MAAM,uBAAuB,CAAC","sources":["packages/@react-spectrum/combobox/src/packages/@react-spectrum/combobox/src/MobileComboBox.tsx","packages/@react-spectrum/combobox/src/packages/@react-spectrum/combobox/src/ComboBox.tsx","packages/@react-spectrum/combobox/src/packages/@react-spectrum/combobox/src/index.ts","packages/@react-spectrum/combobox/src/index.ts"],"sourcesContent":[null,null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {ComboBox} from './ComboBox';\nexport {Item, Section} from '@react-stately/collections';\nexport type {SpectrumComboBoxProps} from '@react-types/combobox';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
@@ -97,6 +97,7 @@
97
97
  border-radius: var(--spectrum-textfield-border-radius, var(--spectrum-alias-border-radius-regular));
98
98
  padding: 3px var(--spectrum-textfield-padding-x, var(--spectrum-global-dimension-size-150)) 5px calc(var(--spectrum-textfield-padding-x, var(--spectrum-global-dimension-size-150)) - 1px);
99
99
  text-indent: 0;
100
+ inline-size: 100%;
100
101
  height: var(--spectrum-textfield-height, var(--spectrum-alias-single-line-height));
101
102
  vertical-align: top;
102
103
  font-size: var(--spectrum-textfield-text-size, var(--spectrum-alias-font-size-default));
@@ -106,7 +107,6 @@
106
107
  -webkit-appearance: none;
107
108
  -moz-appearance: textfield;
108
109
  outline: none;
109
- inline-size: 100%;
110
110
  margin: 0;
111
111
  overflow: visible;
112
112
  }
@@ -199,10 +199,10 @@
199
199
  }
200
200
 
201
201
  .zo2IKa_spectrum-Textfield--multiline .zo2IKa_spectrum-Textfield-input {
202
+ height: auto;
202
203
  min-height: var(--spectrum-global-dimension-size-700);
203
204
  padding: 3px var(--spectrum-textfield-padding-x, var(--spectrum-global-dimension-size-150)) 5px calc(var(--spectrum-textfield-padding-x, var(--spectrum-global-dimension-size-150)) - 1px);
204
205
  resize: none;
205
- height: auto;
206
206
  overflow: auto;
207
207
  }
208
208
 
@@ -547,4 +547,4 @@
547
547
  border-color: var(--spectrum-textfield-quiet-border-color-key-focus, var(--spectrum-alias-border-color-focus));
548
548
  }
549
549
  }
550
- /*# sourceMappingURL=vars.7a9c8a9c.css.map */
550
+ /*# sourceMappingURL=vars.202cbdb0.css.map */
@@ -1 +1 @@
1
- {"mappings":"AA4DA;;;;;AAIE;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAQA;;;;AAIA;;;;AAKF;;;;;;;;AAOE;;;;;;;;;;;AAqBE;;;;;AAQF;;;;AAKE;;;;;AAOJ;EACE;;;;EAIE;;;;;AAMJ;;;;;;;AAQE;;;;;;AAWF;;;;;;;;;;;;;;;;;;;;AA4CE;;;;;;;;AAYA;;;;;;;AAWE;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAMA;;;;AAKF;;;;;AAME;;;;AAQF;;;;;AAOA;;;;;AAAA;;;;;AAOA;;;;AAIA;;;;;;;;AAUA;;;;;;;AASA;;;;AAIA;;;;AASF;;;;AAIA;;;;;AAKE;;;;AAIA;;;;;AAME;;;;AAOJ;;;;;;;;AAUE;;;;AAKF;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAOA;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AASA;;;;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAaA;;;;AASE;;;;AAIE;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAKF;;;;;AAQF;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAME;;;;AAiBF;;;;;;AAKE;;;;AAKA;;;;;AAIE;;;;AAMF;;;;;;AAKE;;;;AAMF;;;;AAME;;;;;AAMF;;;;;;;AASE;;;;AAKA;;;;AAdF;;;;;;;AASE;;;;AAKA;;;;AAKF;;;;AAGE;;;;AAcE;;;;;AAOJ;;;;;AAIE;;;;AAIA;;;;AAIA;;;;AAME;;;;;AAMF;;;;;AAOF;;;;AAGE;;;;AAIA;;;;AAIA;;;;AAME;;;;;AASA;;;;AASJ;;;;AAIA;;;;AAKF;EACE;;;;;;;;;;;;EAUE;;;;;EAKE;;;;;;EAKE","sources":["packages/@adobe/spectrum-css-temp/components/textfield/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"vars.7a9c8a9c.css.map"}
1
+ {"mappings":"AA4DA;;;;;AAIE;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAQA;;;;AAIA;;;;AAKF;;;;;;;;AAOE;;;;;;;;;;;AAqBE;;;;;AAQF;;;;AAKE;;;;;AAOJ;EACE;;;;EAIE;;;;;AAMJ;;;;;;;AAQE;;;;;;AAWF;;;;;;;;;;;;;;;;;;;;AA4CE;;;;;;;;AAYA;;;;;;;AAWE;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAMA;;;;AAKF;;;;;AAME;;;;AAQF;;;;;AAOA;;;;;AAAA;;;;;AAOA;;;;AAIA;;;;;;;;AAUA;;;;;;;AASA;;;;AAIA;;;;AASF;;;;AAIA;;;;;AAKE;;;;AAIA;;;;;AAME;;;;AAOJ;;;;;;;;AAUE;;;;AAKF;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAOA;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AASA;;;;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAaA;;;;AASE;;;;AAIE;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAKF;;;;;AAQF;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAME;;;;AAiBF;;;;;;AAKE;;;;AAKA;;;;;AAIE;;;;AAMF;;;;;;AAKE;;;;AAMF;;;;AAME;;;;;AAMF;;;;;;;AASE;;;;AAKA;;;;AAdF;;;;;;;AASE;;;;AAKA;;;;AAKF;;;;AAGE;;;;AAcE;;;;;AAOJ;;;;;AAIE;;;;AAIA;;;;AAIA;;;;AAME;;;;;AAMF;;;;;AAOF;;;;AAGE;;;;AAIA;;;;AAIA;;;;AAME;;;;;AASA;;;;AASJ;;;;AAIA;;;;AAKF;EACE;;;;;;;;;;;;EAUE;;;;;EAKE;;;;;;EAKE","sources":["packages/@adobe/spectrum-css-temp/components/textfield/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"vars.202cbdb0.css.map"}
@@ -152,9 +152,9 @@
152
152
  }
153
153
 
154
154
  .jIQVGq_spectrum-Field:where(.jIQVGq_spectrum-Field--positionSide) .jIQVGq_spectrum-Field-wrapper {
155
+ min-width: 0;
155
156
  width: var(--spectrum-field-default-width);
156
157
  flex: 1;
157
- min-width: 0;
158
158
  height: 100%;
159
159
  }
160
160
 
@@ -214,8 +214,8 @@
214
214
  }
215
215
 
216
216
  .jIQVGq_spectrum-Form.jIQVGq_spectrum-Form--positionSide .jIQVGq_spectrum-Field-field {
217
- min-width: var(--spectrum-alias-single-line-width, var(--spectrum-global-dimension-size-2400));
218
217
  width: auto;
218
+ min-width: var(--spectrum-alias-single-line-width, var(--spectrum-global-dimension-size-2400));
219
219
  }
220
220
 
221
221
  .jIQVGq_spectrum-Form.jIQVGq_spectrum-Form--positionTop {
@@ -268,4 +268,4 @@
268
268
  :is(.jIQVGq_spectrum-FieldLabel, .jIQVGq_spectrum-Form-itemLabel).jIQVGq_is-disabled {
269
269
  color: var(--spectrum-fieldlabel-text-color-disabled, var(--spectrum-alias-text-color-disabled));
270
270
  }
271
- /*# sourceMappingURL=vars.09a5f62b.css.map */
271
+ /*# sourceMappingURL=vars.3ad1a294.css.map */
@@ -1 +1 @@
1
- {"mappings":"AA4DA;;;;;AAIE;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAQA;;;;AAIA;;;;AAKF;;;;;;;;AAOE;;;;;;;;;;;AAqBE;;;;;AAQF;;;;AAKE;;;;;AAOJ;EACE;;;;EAIE;;;;;AAMJ;;;;;;;;;;;;;;;;AAsBA;;;;;;AAMA;;;;;;;AAOA;;;;;AAUA;;;;;AAIE;;;;;;AAMA;;;;;;;;;;AAUE;;;;;AAMA;;;;AAIA;;;;AAOF;;;;;AAKE;;;;;;;AAaE;;;;AAMF;;;;;AAKA;;;;;AAOA;;;;AAaF;;;;;;;;AAOE;;;;;AAME;;;;AAKA;;;;AAKA;;;;AAKA;;;;AAGE;;;;AAMJ;;;;AAIA;;;;;AAOF;;;;;;;AASE;;;;;AASF;;;;AAGE;;;;;;AAOF;;;;AAIA;;;;AAIA;;;;AAIA;;;;;AAKA;;;;AAkBF;;;;AAIE","sources":["packages/@adobe/spectrum-css-temp/components/fieldlabel/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"vars.09a5f62b.css.map"}
1
+ {"mappings":"AA4DA;;;;;AAIE;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAQA;;;;AAIA;;;;AAKF;;;;;;;;AAOE;;;;;;;;;;;AAqBE;;;;;AAQF;;;;AAKE;;;;;AAOJ;EACE;;;;EAIE;;;;;AAMJ;;;;;;;;;;;;;;;;AAsBA;;;;;;AAMA;;;;;;;AAOA;;;;;AAUA;;;;;AAIE;;;;;;AAMA;;;;;;;;;;AAUE;;;;;AAMA;;;;AAIA;;;;AAOF;;;;;AAKE;;;;;;;AAaE;;;;AAMF;;;;;AAKA;;;;;AAOA;;;;AAaF;;;;;;;;AAOE;;;;;AAME;;;;AAKA;;;;AAKA;;;;AAKA;;;;AAGE;;;;AAMJ;;;;AAIA;;;;;AAOF;;;;;;;AASE;;;;;AASF;;;;AAGE;;;;;;AAOF;;;;AAIA;;;;AAIA;;;;AAIA;;;;;AAKA;;;;AAkBF;;;;AAIE","sources":["packages/@adobe/spectrum-css-temp/components/fieldlabel/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"vars.3ad1a294.css.map"}
@@ -79,10 +79,10 @@
79
79
  }
80
80
 
81
81
  .penpuW_spectrum-InputGroup {
82
+ block-size: max-content;
82
83
  min-width: calc(2.5 * var(--spectrum-dropdown-height, var(--spectrum-global-dimension-size-400)));
83
84
  border-radius: var(--spectrum-alias-border-radius-regular, var(--spectrum-global-dimension-size-50));
84
85
  flex-flow: row;
85
- block-size: max-content;
86
86
  display: inline-flex;
87
87
  position: relative;
88
88
  }
@@ -646,4 +646,4 @@
646
646
  box-shadow: 0 2px 0 0 var(--spectrum-dropdown-border-color-key-focus, var(--spectrum-alias-border-color-focus));
647
647
  }
648
648
  }
649
- /*# sourceMappingURL=vars.03cfef19.css.map */
649
+ /*# sourceMappingURL=vars.3f2ff1e8.css.map */
@@ -1 +1 @@
1
- {"mappings":"AA4DA;;;;;AAIE;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAQA;;;;AAIA;;;;AAKF;;;;;;;;AAOE;;;;;;;;;;;AAqBE;;;;;AAQF;;;;AAKE;;;;;AAOJ;EACE;;;;EAIE;;;;;AAMJ;;;;;;;;;AAWE;;;;;;;;;;AAAA;;;;;;;AAAA;;;;;;;AAAA;;;;;;;AAAA;;;;;;;AAaE;;;;;;;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAaA;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AASA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AASA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAKA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAOJ;;;;AAMA;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAMA;;;;;AAME;;;;;;;AAOE;;;;;;;AAQA;;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AASF;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAKE;;;;AAMA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAKA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAOJ;;;;;AAMA;;;;AAGE;;;;AASE;;;;;AAMF;;;;;;AAME;;;;;AAKA;;;;AAKA;;;;;;;AAQF;;;;;;;;AAME;;;;;;;;;;AAYA;;;;;;;AAYE;;;;;AAMA;;;;AAmBN;;;;;AAKI;;;;AAOE;;;;AAcA;;;;AAWF;;;;AAME;;;;AAOA;;;;AASA;;;;AAQJ;;;;AAgBA;;;;AAKF;;;;AAQM;;;;AAqBA;;;;AAgBA;;;;AAQA;;;;AAME;;;;AAOA;;;;AAQF;;;;AAgBF;;;;AAMA;;;;AAMF;;;;AAGE;;;;AAUA;;;;AAME;;;;AACE;;;;AAOF;;;;AAIE;;;;;AAQJ;;;;AAII;;;;AAEE;;;;AAIE;;;;AAKJ;;;;AAQR;EACE;;;;;;;;;;;;;;;;EAeE;;;;;;EAKA;;;;;;;;;;;;;;;;EAiBE;;;;EAeI;;;;EAQF;;;;EAQF;;;;EAIF;;;;EAuBE;;;;EAGA","sources":["packages/@adobe/spectrum-css-temp/components/inputgroup/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"vars.03cfef19.css.map"}
1
+ {"mappings":"AA4DA;;;;;AAIE;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAQA;;;;AAIA;;;;AAKF;;;;;;;;AAOE;;;;;;;;;;;AAqBE;;;;;AAQF;;;;AAKE;;;;;AAOJ;EACE;;;;EAIE;;;;;AAMJ;;;;;;;;;AAWE;;;;;;;;;;AAAA;;;;;;;AAAA;;;;;;;AAAA;;;;;;;AAAA;;;;;;;AAaE;;;;;;;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAaA;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AASA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AASA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAKA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAOJ;;;;AAMA;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAMA;;;;;AAME;;;;;;;AAOE;;;;;;;AAQA;;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AASF;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAKE;;;;AAMA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAKA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAOJ;;;;;AAMA;;;;AAGE;;;;AASE;;;;;AAMF;;;;;;AAME;;;;;AAKA;;;;AAKA;;;;;;;AAQF;;;;;;;;AAME;;;;;;;;;;AAYA;;;;;;;AAYE;;;;;AAMA;;;;AAmBN;;;;;AAKI;;;;AAOE;;;;AAcA;;;;AAWF;;;;AAME;;;;AAOA;;;;AASA;;;;AAQJ;;;;AAgBA;;;;AAKF;;;;AAQM;;;;AAqBA;;;;AAgBA;;;;AAQA;;;;AAME;;;;AAOA;;;;AAQF;;;;AAgBF;;;;AAMA;;;;AAMF;;;;AAGE;;;;AAUA;;;;AAME;;;;AACE;;;;AAOF;;;;AAIE;;;;;AAQJ;;;;AAII;;;;AAEE;;;;AAIE;;;;AAKJ;;;;AAQR;EACE;;;;;;;;;;;;;;;;EAeE;;;;;;EAKA;;;;;;;;;;;;;;;;EAiBE;;;;EAeI;;;;EAQF;;;;EAQF;;;;EAIF;;;;EAuBE;;;;EAGA","sources":["packages/@adobe/spectrum-css-temp/components/inputgroup/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"vars.3f2ff1e8.css.map"}
@@ -130,23 +130,23 @@ button.ntVziG_spectrum-BaseButton {
130
130
  }
131
131
 
132
132
  .ntVziG_spectrum-BaseButton .ntVziG_spectrum-Icon {
133
+ max-block-size: 100%;
133
134
  transition: background var(--spectrum-global-animation-duration-100, .13s) ease-out, fill var(--spectrum-global-animation-duration-100, .13s) ease-out;
134
135
  box-sizing: initial;
135
136
  flex-shrink: 0;
136
137
  order: 0;
137
- max-block-size: 100%;
138
138
  }
139
139
 
140
140
  .ntVziG_spectrum-Button {
141
141
  --spectrum-button-border-radius: var(--spectrum-button-primary-border-radius, var(--spectrum-alias-border-radius-large));
142
142
  --spectrum-button-border-width: var(--spectrum-button-primary-border-size, var(--spectrum-alias-border-size-thick));
143
143
  min-block-size: var(--spectrum-button-primary-height, var(--spectrum-alias-single-line-height));
144
+ block-size: 0%;
144
145
  min-inline-size: var(--spectrum-button-primary-min-width);
145
146
  padding: var(--spectrum-global-dimension-size-50) calc(var(--spectrum-button-primary-padding-x, var(--spectrum-global-dimension-size-200)) - var(--spectrum-button-primary-border-size, var(--spectrum-alias-border-size-thick)));
146
147
  font-size: var(--spectrum-button-primary-text-size, var(--spectrum-alias-pill-button-text-size));
147
148
  font-weight: var(--spectrum-button-primary-text-font-weight, var(--spectrum-global-font-weight-bold));
148
149
  border-style: solid;
149
- block-size: 0%;
150
150
  padding-block-start: calc(var(--spectrum-global-dimension-size-50) - 1px);
151
151
  padding-block-end: calc(var(--spectrum-global-dimension-size-50) + 1px);
152
152
  }
@@ -1642,4 +1642,4 @@ a.ntVziG_spectrum-Button, a.ntVziG_spectrum-ActionButton {
1642
1642
  --spectrum-actionbutton-static-color-selected-disabled: ButtonFace;
1643
1643
  }
1644
1644
  }
1645
- /*# sourceMappingURL=vars.01699409.css.map */
1645
+ /*# sourceMappingURL=vars.8e9a1ae1.css.map */
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@adobe/spectrum-css-temp/components/button/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"vars.01699409.css.map"}
1
+ {"mappings":"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","sources":["packages/@adobe/spectrum-css-temp/components/button/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"vars.8e9a1ae1.css.map"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@react-spectrum/combobox",
3
- "version": "3.14.0",
3
+ "version": "3.14.1",
4
4
  "description": "Spectrum UI components in React",
5
5
  "license": "Apache-2.0",
6
6
  "main": "dist/main.js",
@@ -36,30 +36,30 @@
36
36
  "url": "https://github.com/adobe/react-spectrum"
37
37
  },
38
38
  "dependencies": {
39
- "@react-aria/button": "^3.11.0",
40
- "@react-aria/combobox": "^3.11.0",
41
- "@react-aria/dialog": "^3.5.20",
42
- "@react-aria/focus": "^3.19.0",
43
- "@react-aria/form": "^3.0.11",
44
- "@react-aria/i18n": "^3.12.4",
45
- "@react-aria/interactions": "^3.22.5",
46
- "@react-aria/label": "^3.7.13",
47
- "@react-aria/overlays": "^3.24.0",
48
- "@react-aria/utils": "^3.26.0",
49
- "@react-spectrum/button": "^3.16.9",
50
- "@react-spectrum/form": "^3.7.10",
51
- "@react-spectrum/label": "^3.16.10",
52
- "@react-spectrum/listbox": "^3.14.0",
53
- "@react-spectrum/overlays": "^5.7.0",
54
- "@react-spectrum/progress": "^3.7.11",
55
- "@react-spectrum/textfield": "^3.12.7",
56
- "@react-spectrum/utils": "^3.12.0",
57
- "@react-stately/collections": "^3.12.0",
58
- "@react-stately/combobox": "^3.10.1",
59
- "@react-types/button": "^3.10.1",
60
- "@react-types/combobox": "^3.13.1",
61
- "@react-types/shared": "^3.26.0",
62
- "@spectrum-icons/ui": "^3.6.11",
39
+ "@react-aria/button": "^3.11.1",
40
+ "@react-aria/combobox": "^3.11.1",
41
+ "@react-aria/dialog": "^3.5.21",
42
+ "@react-aria/focus": "^3.19.1",
43
+ "@react-aria/form": "^3.0.12",
44
+ "@react-aria/i18n": "^3.12.5",
45
+ "@react-aria/interactions": "^3.23.0",
46
+ "@react-aria/label": "^3.7.14",
47
+ "@react-aria/overlays": "^3.25.0",
48
+ "@react-aria/utils": "^3.27.0",
49
+ "@react-spectrum/button": "^3.16.10",
50
+ "@react-spectrum/form": "^3.7.11",
51
+ "@react-spectrum/label": "^3.16.11",
52
+ "@react-spectrum/listbox": "^3.14.1",
53
+ "@react-spectrum/overlays": "^5.7.1",
54
+ "@react-spectrum/progress": "^3.7.12",
55
+ "@react-spectrum/textfield": "^3.12.8",
56
+ "@react-spectrum/utils": "^3.12.1",
57
+ "@react-stately/collections": "^3.12.1",
58
+ "@react-stately/combobox": "^3.10.2",
59
+ "@react-types/button": "^3.10.2",
60
+ "@react-types/combobox": "^3.13.2",
61
+ "@react-types/shared": "^3.27.0",
62
+ "@spectrum-icons/ui": "^3.6.12",
63
63
  "@swc/helpers": "^0.5.0"
64
64
  },
65
65
  "devDependencies": {
@@ -73,5 +73,5 @@
73
73
  "publishConfig": {
74
74
  "access": "public"
75
75
  },
76
- "gitHead": "71f0ef23053f9e03ee7e97df736e8b083e006849"
76
+ "gitHead": "09e7f44bebdc9d89122926b2b439a0a38a2814ea"
77
77
  }
package/src/ComboBox.tsx CHANGED
@@ -53,7 +53,10 @@ import {useFormProps} from '@react-spectrum/form';
53
53
  import {useLayoutEffect} from '@react-aria/utils';
54
54
  import {useProvider, useProviderProps} from '@react-spectrum/provider';
55
55
 
56
- function ComboBox<T extends object>(props: SpectrumComboBoxProps<T>, ref: FocusableRef<HTMLElement>) {
56
+ /**
57
+ * ComboBoxes combine a text entry with a picker menu, allowing users to filter longer lists to only the selections matching a query.
58
+ */
59
+ export const ComboBox = React.forwardRef(function ComboBox<T extends object>(props: SpectrumComboBoxProps<T>, ref: FocusableRef<HTMLElement>) {
57
60
  props = useProviderProps(props);
58
61
  props = useFormProps(props);
59
62
 
@@ -68,7 +71,7 @@ function ComboBox<T extends object>(props: SpectrumComboBoxProps<T>, ref: Focusa
68
71
  } else {
69
72
  return <ComboBoxBase {...props} ref={ref} />;
70
73
  }
71
- }
74
+ }) as <T>(props: SpectrumComboBoxProps<T> & {ref?: FocusableRef<HTMLElement>}) => ReactElement;
72
75
 
73
76
  const ComboBoxBase = React.forwardRef(function ComboBoxBase(props: SpectrumComboBoxProps<any>, ref: FocusableRef<HTMLElement>) {
74
77
  let {
@@ -364,9 +367,3 @@ const ComboBoxInput = React.forwardRef(function ComboBoxInput(props: ComboBoxInp
364
367
  </FocusRing>)
365
368
  );
366
369
  });
367
-
368
- /**
369
- * ComboBoxes combine a text entry with a picker menu, allowing users to filter longer lists to only the selections matching a query.
370
- */
371
- const _ComboBox = React.forwardRef(ComboBox) as <T>(props: SpectrumComboBoxProps<T> & {ref?: FocusableRef<HTMLElement>}) => ReactElement;
372
- export {_ComboBox as ComboBox};