react-aria-components 1.10.1 → 1.12.0
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/dist/Autocomplete.main.js +7 -20
- package/dist/Autocomplete.main.js.map +1 -1
- package/dist/Autocomplete.mjs +8 -20
- package/dist/Autocomplete.module.js +8 -20
- package/dist/Autocomplete.module.js.map +1 -1
- package/dist/Breadcrumbs.main.js +13 -3
- package/dist/Breadcrumbs.main.js.map +1 -1
- package/dist/Breadcrumbs.mjs +15 -5
- package/dist/Breadcrumbs.module.js +15 -5
- package/dist/Breadcrumbs.module.js.map +1 -1
- package/dist/Button.main.js +7 -17
- package/dist/Button.main.js.map +1 -1
- package/dist/Button.mjs +7 -17
- package/dist/Button.module.js +7 -17
- package/dist/Button.module.js.map +1 -1
- package/dist/Calendar.main.js +36 -14
- package/dist/Calendar.main.js.map +1 -1
- package/dist/Calendar.mjs +38 -16
- package/dist/Calendar.module.js +38 -16
- package/dist/Calendar.module.js.map +1 -1
- package/dist/Checkbox.main.js +8 -3
- package/dist/Checkbox.main.js.map +1 -1
- package/dist/Checkbox.mjs +10 -5
- package/dist/Checkbox.module.js +10 -5
- package/dist/Checkbox.module.js.map +1 -1
- package/dist/Collection.main.js.map +1 -1
- package/dist/Collection.module.js.map +1 -1
- package/dist/ColorArea.main.js +4 -4
- package/dist/ColorArea.main.js.map +1 -1
- package/dist/ColorArea.mjs +5 -5
- package/dist/ColorArea.module.js +5 -5
- package/dist/ColorArea.module.js.map +1 -1
- package/dist/ColorField.main.js +14 -1
- package/dist/ColorField.main.js.map +1 -1
- package/dist/ColorField.mjs +14 -1
- package/dist/ColorField.module.js +14 -1
- package/dist/ColorField.module.js.map +1 -1
- package/dist/ColorSlider.main.js +3 -1
- package/dist/ColorSlider.main.js.map +1 -1
- package/dist/ColorSlider.mjs +3 -1
- package/dist/ColorSlider.module.js +3 -1
- package/dist/ColorSlider.module.js.map +1 -1
- package/dist/ColorSwatch.main.js +6 -2
- package/dist/ColorSwatch.main.js.map +1 -1
- package/dist/ColorSwatch.mjs +6 -2
- package/dist/ColorSwatch.module.js +6 -2
- package/dist/ColorSwatch.module.js.map +1 -1
- package/dist/ColorSwatchPicker.main.js.map +1 -1
- package/dist/ColorSwatchPicker.module.js.map +1 -1
- package/dist/ColorThumb.main.js +3 -1
- package/dist/ColorThumb.main.js.map +1 -1
- package/dist/ColorThumb.mjs +3 -1
- package/dist/ColorThumb.module.js +3 -1
- package/dist/ColorThumb.module.js.map +1 -1
- package/dist/ColorWheel.main.js +3 -1
- package/dist/ColorWheel.main.js.map +1 -1
- package/dist/ColorWheel.mjs +3 -1
- package/dist/ColorWheel.module.js +3 -1
- package/dist/ColorWheel.module.js.map +1 -1
- package/dist/ComboBox.main.js +4 -1
- package/dist/ComboBox.main.js.map +1 -1
- package/dist/ComboBox.mjs +4 -1
- package/dist/ComboBox.module.js +4 -1
- package/dist/ComboBox.module.js.map +1 -1
- package/dist/DateField.main.js +16 -3
- package/dist/DateField.main.js.map +1 -1
- package/dist/DateField.mjs +16 -3
- package/dist/DateField.module.js +16 -3
- package/dist/DateField.module.js.map +1 -1
- package/dist/DatePicker.main.js +15 -8
- package/dist/DatePicker.main.js.map +1 -1
- package/dist/DatePicker.mjs +16 -9
- package/dist/DatePicker.module.js +16 -9
- package/dist/DatePicker.module.js.map +1 -1
- package/dist/Dialog.main.js +4 -3
- package/dist/Dialog.main.js.map +1 -1
- package/dist/Dialog.mjs +5 -4
- package/dist/Dialog.module.js +5 -4
- package/dist/Dialog.module.js.map +1 -1
- package/dist/Disclosure.main.js +12 -10
- package/dist/Disclosure.main.js.map +1 -1
- package/dist/Disclosure.mjs +13 -11
- package/dist/Disclosure.module.js +13 -11
- package/dist/Disclosure.module.js.map +1 -1
- package/dist/DragAndDrop.main.js +31 -3
- package/dist/DragAndDrop.main.js.map +1 -1
- package/dist/DragAndDrop.mjs +31 -3
- package/dist/DragAndDrop.module.js +31 -3
- package/dist/DragAndDrop.module.js.map +1 -1
- package/dist/DropZone.main.js +4 -3
- package/dist/DropZone.main.js.map +1 -1
- package/dist/DropZone.mjs +4 -3
- package/dist/DropZone.module.js +4 -3
- package/dist/DropZone.module.js.map +1 -1
- package/dist/FieldError.main.js +3 -1
- package/dist/FieldError.main.js.map +1 -1
- package/dist/FieldError.mjs +3 -1
- package/dist/FieldError.module.js +3 -1
- package/dist/FieldError.module.js.map +1 -1
- package/dist/FileTrigger.main.js +3 -1
- package/dist/FileTrigger.main.js.map +1 -1
- package/dist/FileTrigger.mjs +3 -1
- package/dist/FileTrigger.module.js +3 -1
- package/dist/FileTrigger.module.js.map +1 -1
- package/dist/Form.main.js.map +1 -1
- package/dist/Form.module.js.map +1 -1
- package/dist/GridList.main.js +114 -26
- package/dist/GridList.main.js.map +1 -1
- package/dist/GridList.mjs +116 -30
- package/dist/GridList.module.js +116 -30
- package/dist/GridList.module.js.map +1 -1
- package/dist/Header.main.js +1 -1
- package/dist/Header.main.js.map +1 -1
- package/dist/Header.mjs +2 -2
- package/dist/Header.module.js +2 -2
- package/dist/Header.module.js.map +1 -1
- package/dist/HiddenDateInput.main.js +118 -0
- package/dist/HiddenDateInput.main.js.map +1 -0
- package/dist/HiddenDateInput.mjs +109 -0
- package/dist/HiddenDateInput.module.js +109 -0
- package/dist/HiddenDateInput.module.js.map +1 -0
- package/dist/Link.main.js +7 -1
- package/dist/Link.main.js.map +1 -1
- package/dist/Link.mjs +7 -1
- package/dist/Link.module.js +7 -1
- package/dist/Link.module.js.map +1 -1
- package/dist/ListBox.main.js +27 -36
- package/dist/ListBox.main.js.map +1 -1
- package/dist/ListBox.mjs +29 -38
- package/dist/ListBox.module.js +29 -38
- package/dist/ListBox.module.js.map +1 -1
- package/dist/Menu.main.js +44 -23
- package/dist/Menu.main.js.map +1 -1
- package/dist/Menu.mjs +47 -26
- package/dist/Menu.module.js +47 -26
- package/dist/Menu.module.js.map +1 -1
- package/dist/Meter.main.js +6 -2
- package/dist/Meter.main.js.map +1 -1
- package/dist/Meter.mjs +6 -2
- package/dist/Meter.module.js +6 -2
- package/dist/Meter.module.js.map +1 -1
- package/dist/Modal.main.js +31 -6
- package/dist/Modal.main.js.map +1 -1
- package/dist/Modal.mjs +31 -6
- package/dist/Modal.module.js +31 -6
- package/dist/Modal.module.js.map +1 -1
- package/dist/NumberField.main.js +4 -1
- package/dist/NumberField.main.js.map +1 -1
- package/dist/NumberField.mjs +4 -1
- package/dist/NumberField.module.js +4 -1
- package/dist/NumberField.module.js.map +1 -1
- package/dist/Popover.main.js +10 -12
- package/dist/Popover.main.js.map +1 -1
- package/dist/Popover.mjs +11 -13
- package/dist/Popover.module.js +11 -13
- package/dist/Popover.module.js.map +1 -1
- package/dist/ProgressBar.main.js +6 -2
- package/dist/ProgressBar.main.js.map +1 -1
- package/dist/ProgressBar.mjs +6 -2
- package/dist/ProgressBar.module.js +6 -2
- package/dist/ProgressBar.module.js.map +1 -1
- package/dist/RadioGroup.main.js +8 -3
- package/dist/RadioGroup.main.js.map +1 -1
- package/dist/RadioGroup.mjs +9 -4
- package/dist/RadioGroup.module.js +9 -4
- package/dist/RadioGroup.module.js.map +1 -1
- package/dist/SearchField.main.js +9 -5
- package/dist/SearchField.main.js.map +1 -1
- package/dist/SearchField.mjs +10 -6
- package/dist/SearchField.module.js +10 -6
- package/dist/SearchField.module.js.map +1 -1
- package/dist/Select.main.js +12 -14
- package/dist/Select.main.js.map +1 -1
- package/dist/Select.mjs +13 -15
- package/dist/Select.module.js +13 -15
- package/dist/Select.module.js.map +1 -1
- package/dist/Separator.main.js +17 -3
- package/dist/Separator.main.js.map +1 -1
- package/dist/Separator.mjs +20 -6
- package/dist/Separator.module.js +20 -6
- package/dist/Separator.module.js.map +1 -1
- package/dist/Slider.main.js +7 -5
- package/dist/Slider.main.js.map +1 -1
- package/dist/Slider.mjs +8 -6
- package/dist/Slider.module.js +8 -6
- package/dist/Slider.module.js.map +1 -1
- package/dist/Switch.main.js +4 -1
- package/dist/Switch.main.js.map +1 -1
- package/dist/Switch.mjs +4 -1
- package/dist/Switch.module.js +4 -1
- package/dist/Switch.module.js.map +1 -1
- package/dist/Table.main.js +104 -42
- package/dist/Table.main.js.map +1 -1
- package/dist/Table.mjs +107 -45
- package/dist/Table.module.js +107 -45
- package/dist/Table.module.js.map +1 -1
- package/dist/Tabs.main.js +24 -11
- package/dist/Tabs.main.js.map +1 -1
- package/dist/Tabs.mjs +26 -13
- package/dist/Tabs.module.js +26 -13
- package/dist/Tabs.module.js.map +1 -1
- package/dist/TagGroup.main.js +27 -12
- package/dist/TagGroup.main.js.map +1 -1
- package/dist/TagGroup.mjs +29 -14
- package/dist/TagGroup.module.js +29 -14
- package/dist/TagGroup.module.js.map +1 -1
- package/dist/TextField.main.js +20 -6
- package/dist/TextField.main.js.map +1 -1
- package/dist/TextField.mjs +21 -7
- package/dist/TextField.module.js +21 -7
- package/dist/TextField.module.js.map +1 -1
- package/dist/Toast.main.js +9 -5
- package/dist/Toast.main.js.map +1 -1
- package/dist/Toast.mjs +9 -5
- package/dist/Toast.module.js +9 -5
- package/dist/Toast.module.js.map +1 -1
- package/dist/ToggleButton.main.js +8 -2
- package/dist/ToggleButton.main.js.map +1 -1
- package/dist/ToggleButton.mjs +8 -2
- package/dist/ToggleButton.module.js +8 -2
- package/dist/ToggleButton.module.js.map +1 -1
- package/dist/ToggleButtonGroup.main.js +6 -2
- package/dist/ToggleButtonGroup.main.js.map +1 -1
- package/dist/ToggleButtonGroup.mjs +6 -2
- package/dist/ToggleButtonGroup.module.js +6 -2
- package/dist/ToggleButtonGroup.module.js.map +1 -1
- package/dist/Toolbar.main.js +4 -3
- package/dist/Toolbar.main.js.map +1 -1
- package/dist/Toolbar.mjs +4 -3
- package/dist/Toolbar.module.js +4 -3
- package/dist/Toolbar.module.js.map +1 -1
- package/dist/Tooltip.main.js +9 -14
- package/dist/Tooltip.main.js.map +1 -1
- package/dist/Tooltip.mjs +10 -15
- package/dist/Tooltip.module.js +10 -15
- package/dist/Tooltip.module.js.map +1 -1
- package/dist/Tree.main.js +81 -28
- package/dist/Tree.main.js.map +1 -1
- package/dist/Tree.mjs +83 -30
- package/dist/Tree.module.js +83 -30
- package/dist/Tree.module.js.map +1 -1
- package/dist/TreeDropTargetDelegate.main.js +8 -5
- package/dist/TreeDropTargetDelegate.main.js.map +1 -1
- package/dist/TreeDropTargetDelegate.mjs +8 -5
- package/dist/TreeDropTargetDelegate.module.js +8 -5
- package/dist/TreeDropTargetDelegate.module.js.map +1 -1
- package/dist/context.main.js +25 -0
- package/dist/context.main.js.map +1 -0
- package/dist/context.mjs +19 -0
- package/dist/context.module.js +19 -0
- package/dist/context.module.js.map +1 -0
- package/dist/import.mjs +6 -6
- package/dist/main.js +7 -4
- package/dist/main.js.map +1 -1
- package/dist/module.js +6 -6
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +358 -342
- package/dist/types.d.ts.map +1 -1
- package/dist/useDragAndDrop.main.js.map +1 -1
- package/dist/useDragAndDrop.module.js.map +1 -1
- package/dist/utils.main.js.map +1 -1
- package/dist/utils.module.js.map +1 -1
- package/i18n/de-DE.js +1 -1
- package/i18n/de-DE.mjs +1 -1
- package/package.json +27 -26
- package/src/Autocomplete.tsx +14 -25
- package/src/Breadcrumbs.tsx +16 -8
- package/src/Button.tsx +8 -30
- package/src/Calendar.tsx +41 -24
- package/src/Checkbox.tsx +8 -6
- package/src/Collection.tsx +2 -2
- package/src/ColorArea.tsx +5 -6
- package/src/ColorField.tsx +6 -4
- package/src/ColorSlider.tsx +3 -2
- package/src/ColorSwatch.tsx +6 -3
- package/src/ColorSwatchPicker.tsx +3 -3
- package/src/ColorThumb.tsx +3 -3
- package/src/ColorWheel.tsx +6 -5
- package/src/ComboBox.tsx +4 -4
- package/src/DateField.tsx +15 -10
- package/src/DatePicker.tsx +14 -12
- package/src/Dialog.tsx +6 -6
- package/src/Disclosure.tsx +10 -14
- package/src/DragAndDrop.tsx +31 -1
- package/src/DropZone.tsx +4 -5
- package/src/FieldError.tsx +3 -3
- package/src/FileTrigger.tsx +4 -3
- package/src/Form.tsx +2 -1
- package/src/GridList.tsx +112 -37
- package/src/Header.tsx +2 -2
- package/src/HiddenDateInput.tsx +142 -0
- package/src/Link.tsx +7 -3
- package/src/ListBox.tsx +40 -39
- package/src/Menu.tsx +52 -29
- package/src/Meter.tsx +6 -3
- package/src/Modal.tsx +16 -5
- package/src/NumberField.tsx +4 -4
- package/src/Popover.tsx +14 -14
- package/src/ProgressBar.tsx +6 -2
- package/src/RadioGroup.tsx +8 -6
- package/src/SearchField.tsx +8 -6
- package/src/Select.tsx +13 -16
- package/src/Separator.tsx +23 -6
- package/src/Slider.tsx +9 -11
- package/src/Switch.tsx +4 -3
- package/src/Table.tsx +119 -74
- package/src/Tabs.tsx +24 -17
- package/src/TagGroup.tsx +28 -18
- package/src/TextField.tsx +13 -9
- package/src/Toast.tsx +10 -8
- package/src/ToggleButton.tsx +8 -4
- package/src/ToggleButtonGroup.tsx +6 -4
- package/src/Toolbar.tsx +4 -5
- package/src/Tooltip.tsx +15 -18
- package/src/Tree.tsx +102 -46
- package/src/TreeDropTargetDelegate.ts +5 -1
- package/src/context.tsx +34 -0
- package/src/index.ts +9 -9
- package/src/useDragAndDrop.tsx +11 -11
- package/src/utils.tsx +9 -9
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;AA0CM,MAAM,0DAAqB,CAAA,GAAA,0BAAY,EAAkD;AAKzF,MAAM,4CAAc,WAAW,GAAG,CAAA,GAAA,mDAAsB,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAiC;IAC9I,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,EAAC,oBAAoB,sBAAsB,EAAC,GAAG,CAAA,GAAA,2CAAgB,EAAE,CAAA,GAAA,qCAAU,MAAM,CAAC;QAC7D,2BAAA;IAAzB,IAAI,qBAAqB,CAAA,OAAA,CAAA,4BAAA,MAAM,kBAAkB,cAAxB,uCAAA,4BAA4B,oCAA5B,kBAAA,OAAsD;IAC/E,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAoB;IACxC,CAAC,OAAO,SAAoB,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,UAAU,CAAA,GAAA,2CAAgB;IAChF,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,iCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;IAEnD,IAAI,QAAQ,CAAA,GAAA,uCAAkB,EAAE;QAC9B,GAAG,KAAK;4BACR;IACF;IAEA,IAAI,cAAC,UAAU,cAAE,UAAU,oBAAE,gBAAgB,oBAAE,gBAAgB,qBAAE,iBAAiB,EAAE,GAAG,YAAW,GAAG,CAAA,GAAA,+BAAa,EAAE;QAClH,GAAG,CAAA,GAAA,8CAAmB,EAAE,MAAM;eAC9B;4BACA;IACF,GAAG,OAAO;IAEV,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,QAAQ;YACN,SAAS,MAAM,KAAK,KAAK;YACzB,YAAY,MAAM,UAAU,IAAI;YAChC,WAAW,WAAW,SAAS,IAAI;mBACnC;QACF;QACA,kBAAkB;IACpB;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,0DAAC;QACE,GAAG,QAAQ;QACX,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,cAAY,MAAM,KAAK,KAAK,MAAM;QAClC,iBAAe,MAAM,UAAU,IAAI;QACnC,gBAAc,WAAW,SAAS,IAAI;qBACtC,0DAAC,CAAA,GAAA,kCAAO;QACN,QAAQ;YACN;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,uCAAY;gBAAG;aAAiB;YACjC;gBAAC,CAAA,GAAA,qCAAU;gBAAG;oBACZ,OAAO;wBACL,aAAa;wBACb,cAAc;oBAChB;gBACF;aAAE;YACF;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,WAAW,WAAW,SAAS;oBAAE,YAAY,MAAM,UAAU,IAAI;gBAAK;aAAE;YACxF;gBAAC,CAAA,GAAA,2CAAgB;gBAAG;aAAW;SAChC;OACA,YAAY,QAAQ;AAI7B","sources":["packages/react-aria-components/src/SearchField.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 {AriaSearchFieldProps, useSearchField} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {ContextValue, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {createHideableComponent} from '@react-aria/collections';\nimport {FieldErrorContext} from './FieldError';\nimport {FieldInputContext} from './context';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {GlobalDOMAttributes} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport React, {createContext, ForwardedRef, useRef} from 'react';\nimport {SearchFieldState, useSearchFieldState} from 'react-stately';\nimport {TextContext} from './Text';\n\nexport interface SearchFieldRenderProps {\n /**\n * Whether the search field is empty.\n * @selector [data-empty]\n */\n isEmpty: boolean,\n /**\n * Whether the search field is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the search field is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * State of the search field.\n */\n state: SearchFieldState\n}\n\nexport interface SearchFieldProps extends Omit<AriaSearchFieldProps, 'label' | 'placeholder' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<SearchFieldRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {}\n\nexport const SearchFieldContext = createContext<ContextValue<SearchFieldProps, HTMLDivElement>>(null);\n\n/**\n * A search field allows a user to enter and clear a search query.\n */\nexport const SearchField = /*#__PURE__*/ createHideableComponent(function SearchField(props: SearchFieldProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, SearchFieldContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let inputRef = useRef<HTMLInputElement>(null);\n [props, inputRef as unknown] = useContextProps(props, inputRef, FieldInputContext);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let state = useSearchFieldState({\n ...props,\n validationBehavior\n });\n\n let {labelProps, inputProps, clearButtonProps, descriptionProps, errorMessageProps, ...validation} = useSearchField({\n ...removeDataAttributes(props),\n label,\n validationBehavior\n }, state, inputRef);\n\n let renderProps = useRenderProps({\n ...props,\n values: {\n isEmpty: state.value === '',\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid || false,\n state\n },\n defaultClassName: 'react-aria-SearchField'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n return (\n <div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-empty={state.value === '' || undefined}\n data-disabled={props.isDisabled || undefined}\n data-invalid={validation.isInvalid || undefined}>\n <Provider\n values={[\n [LabelContext, {...labelProps, ref: labelRef}],\n [InputContext, {...inputProps, ref: inputRef}],\n [ButtonContext, clearButtonProps],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [GroupContext, {isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}],\n [FieldErrorContext, validation]\n ]}>\n {renderProps.children}\n </Provider>\n </div>\n );\n});\n"],"names":[],"version":3,"file":"SearchField.main.js.map"}
|
package/dist/SearchField.mjs
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import {ButtonContext as $d2b4bc8c273e7be6$export$24d547caef80ccd1} from "./Button.mjs";
|
|
2
2
|
import {Provider as $64fa3d84918910a7$export$2881499e37b75b9a, removeDataAttributes as $64fa3d84918910a7$export$ef03459518577ad4, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3, useSlot as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, useSlottedContext as $64fa3d84918910a7$export$fabf2dc03a41866e} from "./utils.mjs";
|
|
3
3
|
import {FieldErrorContext as $ee014567cb39d3f0$export$ff05c3ac10437e03} from "./FieldError.mjs";
|
|
4
|
+
import {FieldInputContext as $8e6cc465cc68f603$export$698f465ec27e93df} from "./context.mjs";
|
|
4
5
|
import {FormContext as $d3e0e05bdfcf66bd$export$c24727297075ec6a} from "./Form.mjs";
|
|
5
6
|
import {GroupContext as $a049562f99e7db0e$export$f9c6924e160136d1} from "./Group.mjs";
|
|
6
7
|
import {InputContext as $3985021b0ad6602f$export$37fb8590cf2c088c} from "./Input.mjs";
|
|
@@ -8,7 +9,7 @@ import {LabelContext as $01b77f81d0f07f68$export$75b6ee27786ba447} from "./Label
|
|
|
8
9
|
import {TextContext as $514c0188e459b4c0$export$9afb8bc826b033ea} from "./Text.mjs";
|
|
9
10
|
import {useSearchField as $8iEQ9$useSearchField} from "react-aria";
|
|
10
11
|
import {createHideableComponent as $8iEQ9$createHideableComponent} from "@react-aria/collections";
|
|
11
|
-
import {filterDOMProps as $8iEQ9$filterDOMProps
|
|
12
|
+
import {filterDOMProps as $8iEQ9$filterDOMProps} from "@react-aria/utils";
|
|
12
13
|
import $8iEQ9$react, {createContext as $8iEQ9$createContext, useRef as $8iEQ9$useRef} from "react";
|
|
13
14
|
import {useSearchFieldState as $8iEQ9$useSearchFieldState} from "react-stately";
|
|
14
15
|
|
|
@@ -35,6 +36,7 @@ import {useSearchFieldState as $8iEQ9$useSearchFieldState} from "react-stately";
|
|
|
35
36
|
|
|
36
37
|
|
|
37
38
|
|
|
39
|
+
|
|
38
40
|
const $440f4836bcb56932$export$d1c4e4c63cb03a11 = /*#__PURE__*/ (0, $8iEQ9$createContext)(null);
|
|
39
41
|
const $440f4836bcb56932$export$b94867ecbd698f21 = /*#__PURE__*/ (0, $8iEQ9$createHideableComponent)(function SearchField(props, ref) {
|
|
40
42
|
[props, ref] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $440f4836bcb56932$export$d1c4e4c63cb03a11);
|
|
@@ -42,7 +44,7 @@ const $440f4836bcb56932$export$b94867ecbd698f21 = /*#__PURE__*/ (0, $8iEQ9$creat
|
|
|
42
44
|
var _props_validationBehavior, _ref;
|
|
43
45
|
let validationBehavior = (_ref = (_props_validationBehavior = props.validationBehavior) !== null && _props_validationBehavior !== void 0 ? _props_validationBehavior : formValidationBehavior) !== null && _ref !== void 0 ? _ref : 'native';
|
|
44
46
|
let inputRef = (0, $8iEQ9$useRef)(null);
|
|
45
|
-
|
|
47
|
+
[props, inputRef] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(props, inputRef, (0, $8e6cc465cc68f603$export$698f465ec27e93df));
|
|
46
48
|
let [labelRef, label] = (0, $64fa3d84918910a7$export$9d4c57ee4c6ffdd8)(!props['aria-label'] && !props['aria-labelledby']);
|
|
47
49
|
let state = (0, $8iEQ9$useSearchFieldState)({
|
|
48
50
|
...props,
|
|
@@ -52,7 +54,7 @@ const $440f4836bcb56932$export$b94867ecbd698f21 = /*#__PURE__*/ (0, $8iEQ9$creat
|
|
|
52
54
|
...(0, $64fa3d84918910a7$export$ef03459518577ad4)(props),
|
|
53
55
|
label: label,
|
|
54
56
|
validationBehavior: validationBehavior
|
|
55
|
-
}, state,
|
|
57
|
+
}, state, inputRef);
|
|
56
58
|
let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({
|
|
57
59
|
...props,
|
|
58
60
|
values: {
|
|
@@ -63,7 +65,9 @@ const $440f4836bcb56932$export$b94867ecbd698f21 = /*#__PURE__*/ (0, $8iEQ9$creat
|
|
|
63
65
|
},
|
|
64
66
|
defaultClassName: 'react-aria-SearchField'
|
|
65
67
|
});
|
|
66
|
-
let DOMProps = (0, $8iEQ9$filterDOMProps)(props
|
|
68
|
+
let DOMProps = (0, $8iEQ9$filterDOMProps)(props, {
|
|
69
|
+
global: true
|
|
70
|
+
});
|
|
67
71
|
delete DOMProps.id;
|
|
68
72
|
return /*#__PURE__*/ (0, $8iEQ9$react).createElement("div", {
|
|
69
73
|
...DOMProps,
|
|
@@ -85,8 +89,8 @@ const $440f4836bcb56932$export$b94867ecbd698f21 = /*#__PURE__*/ (0, $8iEQ9$creat
|
|
|
85
89
|
[
|
|
86
90
|
(0, $3985021b0ad6602f$export$37fb8590cf2c088c),
|
|
87
91
|
{
|
|
88
|
-
...
|
|
89
|
-
ref:
|
|
92
|
+
...inputProps,
|
|
93
|
+
ref: inputRef
|
|
90
94
|
}
|
|
91
95
|
],
|
|
92
96
|
[
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import {ButtonContext as $d2b4bc8c273e7be6$export$24d547caef80ccd1} from "./Button.module.js";
|
|
2
2
|
import {Provider as $64fa3d84918910a7$export$2881499e37b75b9a, removeDataAttributes as $64fa3d84918910a7$export$ef03459518577ad4, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3, useSlot as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, useSlottedContext as $64fa3d84918910a7$export$fabf2dc03a41866e} from "./utils.module.js";
|
|
3
3
|
import {FieldErrorContext as $ee014567cb39d3f0$export$ff05c3ac10437e03} from "./FieldError.module.js";
|
|
4
|
+
import {FieldInputContext as $8e6cc465cc68f603$export$698f465ec27e93df} from "./context.module.js";
|
|
4
5
|
import {FormContext as $d3e0e05bdfcf66bd$export$c24727297075ec6a} from "./Form.module.js";
|
|
5
6
|
import {GroupContext as $a049562f99e7db0e$export$f9c6924e160136d1} from "./Group.module.js";
|
|
6
7
|
import {InputContext as $3985021b0ad6602f$export$37fb8590cf2c088c} from "./Input.module.js";
|
|
@@ -8,7 +9,7 @@ import {LabelContext as $01b77f81d0f07f68$export$75b6ee27786ba447} from "./Label
|
|
|
8
9
|
import {TextContext as $514c0188e459b4c0$export$9afb8bc826b033ea} from "./Text.module.js";
|
|
9
10
|
import {useSearchField as $8iEQ9$useSearchField} from "react-aria";
|
|
10
11
|
import {createHideableComponent as $8iEQ9$createHideableComponent} from "@react-aria/collections";
|
|
11
|
-
import {filterDOMProps as $8iEQ9$filterDOMProps
|
|
12
|
+
import {filterDOMProps as $8iEQ9$filterDOMProps} from "@react-aria/utils";
|
|
12
13
|
import $8iEQ9$react, {createContext as $8iEQ9$createContext, useRef as $8iEQ9$useRef} from "react";
|
|
13
14
|
import {useSearchFieldState as $8iEQ9$useSearchFieldState} from "react-stately";
|
|
14
15
|
|
|
@@ -35,6 +36,7 @@ import {useSearchFieldState as $8iEQ9$useSearchFieldState} from "react-stately";
|
|
|
35
36
|
|
|
36
37
|
|
|
37
38
|
|
|
39
|
+
|
|
38
40
|
const $440f4836bcb56932$export$d1c4e4c63cb03a11 = /*#__PURE__*/ (0, $8iEQ9$createContext)(null);
|
|
39
41
|
const $440f4836bcb56932$export$b94867ecbd698f21 = /*#__PURE__*/ (0, $8iEQ9$createHideableComponent)(function SearchField(props, ref) {
|
|
40
42
|
[props, ref] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $440f4836bcb56932$export$d1c4e4c63cb03a11);
|
|
@@ -42,7 +44,7 @@ const $440f4836bcb56932$export$b94867ecbd698f21 = /*#__PURE__*/ (0, $8iEQ9$creat
|
|
|
42
44
|
var _props_validationBehavior, _ref;
|
|
43
45
|
let validationBehavior = (_ref = (_props_validationBehavior = props.validationBehavior) !== null && _props_validationBehavior !== void 0 ? _props_validationBehavior : formValidationBehavior) !== null && _ref !== void 0 ? _ref : 'native';
|
|
44
46
|
let inputRef = (0, $8iEQ9$useRef)(null);
|
|
45
|
-
|
|
47
|
+
[props, inputRef] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(props, inputRef, (0, $8e6cc465cc68f603$export$698f465ec27e93df));
|
|
46
48
|
let [labelRef, label] = (0, $64fa3d84918910a7$export$9d4c57ee4c6ffdd8)(!props['aria-label'] && !props['aria-labelledby']);
|
|
47
49
|
let state = (0, $8iEQ9$useSearchFieldState)({
|
|
48
50
|
...props,
|
|
@@ -52,7 +54,7 @@ const $440f4836bcb56932$export$b94867ecbd698f21 = /*#__PURE__*/ (0, $8iEQ9$creat
|
|
|
52
54
|
...(0, $64fa3d84918910a7$export$ef03459518577ad4)(props),
|
|
53
55
|
label: label,
|
|
54
56
|
validationBehavior: validationBehavior
|
|
55
|
-
}, state,
|
|
57
|
+
}, state, inputRef);
|
|
56
58
|
let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({
|
|
57
59
|
...props,
|
|
58
60
|
values: {
|
|
@@ -63,7 +65,9 @@ const $440f4836bcb56932$export$b94867ecbd698f21 = /*#__PURE__*/ (0, $8iEQ9$creat
|
|
|
63
65
|
},
|
|
64
66
|
defaultClassName: 'react-aria-SearchField'
|
|
65
67
|
});
|
|
66
|
-
let DOMProps = (0, $8iEQ9$filterDOMProps)(props
|
|
68
|
+
let DOMProps = (0, $8iEQ9$filterDOMProps)(props, {
|
|
69
|
+
global: true
|
|
70
|
+
});
|
|
67
71
|
delete DOMProps.id;
|
|
68
72
|
return /*#__PURE__*/ (0, $8iEQ9$react).createElement("div", {
|
|
69
73
|
...DOMProps,
|
|
@@ -85,8 +89,8 @@ const $440f4836bcb56932$export$b94867ecbd698f21 = /*#__PURE__*/ (0, $8iEQ9$creat
|
|
|
85
89
|
[
|
|
86
90
|
(0, $3985021b0ad6602f$export$37fb8590cf2c088c),
|
|
87
91
|
{
|
|
88
|
-
...
|
|
89
|
-
ref:
|
|
92
|
+
...inputProps,
|
|
93
|
+
ref: inputRef
|
|
90
94
|
}
|
|
91
95
|
],
|
|
92
96
|
[
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;AA0CM,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAAkD;AAKzF,MAAM,4CAAc,WAAW,GAAG,CAAA,GAAA,8BAAsB,EAAE,SAAS,YAAY,KAAuB,EAAE,GAAiC;IAC9I,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,EAAC,oBAAoB,sBAAsB,EAAC,GAAG,CAAA,GAAA,yCAAgB,EAAE,CAAA,GAAA,yCAAU,MAAM,CAAC;QAC7D,2BAAA;IAAzB,IAAI,qBAAqB,CAAA,OAAA,CAAA,4BAAA,MAAM,kBAAkB,cAAxB,uCAAA,4BAA4B,oCAA5B,kBAAA,OAAsD;IAC/E,IAAI,WAAW,CAAA,GAAA,aAAK,EAAoB;IACxC,CAAC,OAAO,SAAoB,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,UAAU,CAAA,GAAA,yCAAgB;IAChF,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,yCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;IAEnD,IAAI,QAAQ,CAAA,GAAA,0BAAkB,EAAE;QAC9B,GAAG,KAAK;4BACR;IACF;IAEA,IAAI,cAAC,UAAU,cAAE,UAAU,oBAAE,gBAAgB,oBAAE,gBAAgB,qBAAE,iBAAiB,EAAE,GAAG,YAAW,GAAG,CAAA,GAAA,qBAAa,EAAE;QAClH,GAAG,CAAA,GAAA,yCAAmB,EAAE,MAAM;eAC9B;4BACA;IACF,GAAG,OAAO;IAEV,IAAI,cAAc,CAAA,GAAA,uCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,QAAQ;YACN,SAAS,MAAM,KAAK,KAAK;YACzB,YAAY,MAAM,UAAU,IAAI;YAChC,WAAW,WAAW,SAAS,IAAI;mBACnC;QACF;QACA,kBAAkB;IACpB;IAEA,IAAI,WAAW,CAAA,GAAA,qBAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,gCAAC;QACE,GAAG,QAAQ;QACX,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,cAAY,MAAM,KAAK,KAAK,MAAM;QAClC,iBAAe,MAAM,UAAU,IAAI;QACnC,gBAAc,WAAW,SAAS,IAAI;qBACtC,gCAAC,CAAA,GAAA,yCAAO;QACN,QAAQ;YACN;gBAAC,CAAA,GAAA,yCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,yCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,yCAAY;gBAAG;aAAiB;YACjC;gBAAC,CAAA,GAAA,yCAAU;gBAAG;oBACZ,OAAO;wBACL,aAAa;wBACb,cAAc;oBAChB;gBACF;aAAE;YACF;gBAAC,CAAA,GAAA,yCAAW;gBAAG;oBAAC,WAAW,WAAW,SAAS;oBAAE,YAAY,MAAM,UAAU,IAAI;gBAAK;aAAE;YACxF;gBAAC,CAAA,GAAA,yCAAgB;gBAAG;aAAW;SAChC;OACA,YAAY,QAAQ;AAI7B","sources":["packages/react-aria-components/src/SearchField.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 {AriaSearchFieldProps, useSearchField} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {ContextValue, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {createHideableComponent} from '@react-aria/collections';\nimport {FieldErrorContext} from './FieldError';\nimport {FieldInputContext} from './context';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {GlobalDOMAttributes} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport React, {createContext, ForwardedRef, useRef} from 'react';\nimport {SearchFieldState, useSearchFieldState} from 'react-stately';\nimport {TextContext} from './Text';\n\nexport interface SearchFieldRenderProps {\n /**\n * Whether the search field is empty.\n * @selector [data-empty]\n */\n isEmpty: boolean,\n /**\n * Whether the search field is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the search field is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * State of the search field.\n */\n state: SearchFieldState\n}\n\nexport interface SearchFieldProps extends Omit<AriaSearchFieldProps, 'label' | 'placeholder' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<SearchFieldRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {}\n\nexport const SearchFieldContext = createContext<ContextValue<SearchFieldProps, HTMLDivElement>>(null);\n\n/**\n * A search field allows a user to enter and clear a search query.\n */\nexport const SearchField = /*#__PURE__*/ createHideableComponent(function SearchField(props: SearchFieldProps, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, SearchFieldContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let inputRef = useRef<HTMLInputElement>(null);\n [props, inputRef as unknown] = useContextProps(props, inputRef, FieldInputContext);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let state = useSearchFieldState({\n ...props,\n validationBehavior\n });\n\n let {labelProps, inputProps, clearButtonProps, descriptionProps, errorMessageProps, ...validation} = useSearchField({\n ...removeDataAttributes(props),\n label,\n validationBehavior\n }, state, inputRef);\n\n let renderProps = useRenderProps({\n ...props,\n values: {\n isEmpty: state.value === '',\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid || false,\n state\n },\n defaultClassName: 'react-aria-SearchField'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n return (\n <div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-empty={state.value === '' || undefined}\n data-disabled={props.isDisabled || undefined}\n data-invalid={validation.isInvalid || undefined}>\n <Provider\n values={[\n [LabelContext, {...labelProps, ref: labelRef}],\n [InputContext, {...inputProps, ref: inputRef}],\n [ButtonContext, clearButtonProps],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [GroupContext, {isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}],\n [FieldErrorContext, validation]\n ]}>\n {renderProps.children}\n </Provider>\n </div>\n );\n});\n"],"names":[],"version":3,"file":"SearchField.module.js.map"}
|
package/dist/Select.main.js
CHANGED
|
@@ -102,7 +102,7 @@ function $17f0ecdc17674b23$var$SelectInner({ props: props, selectRef: ref, colle
|
|
|
102
102
|
// Get props for child elements from useSelect
|
|
103
103
|
let buttonRef = (0, $23VoQ$react.useRef)(null);
|
|
104
104
|
let [labelRef, label] = (0, $c5ccf687772c0422$exports.useSlot)(!props['aria-label'] && !props['aria-labelledby']);
|
|
105
|
-
let { labelProps: labelProps, triggerProps: triggerProps, valueProps: valueProps, menuProps: menuProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, ...validation } = (0, $23VoQ$reactaria.useSelect)({
|
|
105
|
+
let { labelProps: labelProps, triggerProps: triggerProps, valueProps: valueProps, menuProps: menuProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, hiddenSelectProps: hiddenSelectProps, ...validation } = (0, $23VoQ$reactaria.useSelect)({
|
|
106
106
|
...(0, $c5ccf687772c0422$exports.removeDataAttributes)(props),
|
|
107
107
|
label: label,
|
|
108
108
|
validationBehavior: validationBehavior
|
|
@@ -139,7 +139,9 @@ function $17f0ecdc17674b23$var$SelectInner({ props: props, selectRef: ref, colle
|
|
|
139
139
|
values: renderPropsState,
|
|
140
140
|
defaultClassName: 'react-aria-Select'
|
|
141
141
|
});
|
|
142
|
-
let DOMProps = (0, $23VoQ$reactariautils.filterDOMProps)(props
|
|
142
|
+
let DOMProps = (0, $23VoQ$reactariautils.filterDOMProps)(props, {
|
|
143
|
+
global: true
|
|
144
|
+
});
|
|
143
145
|
delete DOMProps.id;
|
|
144
146
|
let scrollRef = (0, $23VoQ$react.useRef)(null);
|
|
145
147
|
return /*#__PURE__*/ (0, ($parcel$interopDefault($23VoQ$react))).createElement((0, $c5ccf687772c0422$exports.Provider), {
|
|
@@ -217,9 +219,7 @@ function $17f0ecdc17674b23$var$SelectInner({ props: props, selectRef: ref, colle
|
|
|
217
219
|
]
|
|
218
220
|
]
|
|
219
221
|
}, /*#__PURE__*/ (0, ($parcel$interopDefault($23VoQ$react))).createElement("div", {
|
|
220
|
-
...DOMProps,
|
|
221
|
-
...renderProps,
|
|
222
|
-
...focusProps,
|
|
222
|
+
...(0, $23VoQ$reactariautils.mergeProps)(DOMProps, renderProps, focusProps),
|
|
223
223
|
ref: ref,
|
|
224
224
|
slot: props.slot || undefined,
|
|
225
225
|
"data-focused": state.isFocused || undefined,
|
|
@@ -228,14 +228,10 @@ function $17f0ecdc17674b23$var$SelectInner({ props: props, selectRef: ref, colle
|
|
|
228
228
|
"data-disabled": props.isDisabled || undefined,
|
|
229
229
|
"data-invalid": validation.isInvalid || undefined,
|
|
230
230
|
"data-required": props.isRequired || undefined
|
|
231
|
-
}
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
label: label,
|
|
236
|
-
name: props.name,
|
|
237
|
-
isDisabled: props.isDisabled
|
|
238
|
-
}));
|
|
231
|
+
}, renderProps.children, /*#__PURE__*/ (0, ($parcel$interopDefault($23VoQ$react))).createElement((0, $23VoQ$reactaria.HiddenSelect), {
|
|
232
|
+
...hiddenSelectProps,
|
|
233
|
+
autoComplete: props.autoComplete
|
|
234
|
+
})));
|
|
239
235
|
}
|
|
240
236
|
const $17f0ecdc17674b23$export$f8f745c04421623f = /*#__PURE__*/ (0, $23VoQ$react.createContext)(null);
|
|
241
237
|
const $17f0ecdc17674b23$export$e288731fd71264f0 = /*#__PURE__*/ (0, $23VoQ$react.forwardRef)(function SelectValue(props, ref) {
|
|
@@ -271,7 +267,9 @@ const $17f0ecdc17674b23$export$e288731fd71264f0 = /*#__PURE__*/ (0, $23VoQ$react
|
|
|
271
267
|
isPlaceholder: !selectedItem
|
|
272
268
|
}
|
|
273
269
|
});
|
|
274
|
-
let DOMProps = (0, $23VoQ$reactariautils.filterDOMProps)(props
|
|
270
|
+
let DOMProps = (0, $23VoQ$reactariautils.filterDOMProps)(props, {
|
|
271
|
+
global: true
|
|
272
|
+
});
|
|
275
273
|
return /*#__PURE__*/ (0, ($parcel$interopDefault($23VoQ$react))).createElement("span", {
|
|
276
274
|
ref: ref,
|
|
277
275
|
...DOMProps,
|
package/dist/Select.main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/react-aria-components/src/Select.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 {AriaSelectProps, HiddenSelect, useFocusRing, useLocalizedStringFormatter, useSelect} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {Collection, Node, SelectState, useSelectState} from 'react-stately';\nimport {CollectionBuilder} from '@react-aria/collections';\nimport {ContextValue, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useResizeObserver} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ItemRenderProps} from './Collection';\nimport {LabelContext} from './Label';\nimport {ListBoxContext, ListStateContext} from './ListBox';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport {PopoverContext} from './Popover';\nimport React, {createContext, ForwardedRef, forwardRef, HTMLAttributes, ReactNode, useCallback, useContext, useMemo, useRef, useState} from 'react';\nimport {TextContext} from './Text';\n\nexport interface SelectRenderProps {\n /**\n * Whether the select is focused, either via a mouse or keyboard.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the select is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the select is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the select is currently open.\n * @selector [data-open]\n */\n isOpen: boolean,\n /**\n * Whether the select is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the select is required.\n * @selector [data-required]\n */\n isRequired: boolean\n}\n\nexport interface SelectProps<T extends object = {}> extends Omit<AriaSelectProps<T>, 'children' | 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior' | 'items'>, RACValidation, RenderProps<SelectRenderProps>, SlotProps {\n /**\n * Temporary text that occupies the select when it is empty.\n * @default 'Select an item' (localized)\n */\n placeholder?: string\n}\n\nexport const SelectContext = createContext<ContextValue<SelectProps<any>, HTMLDivElement>>(null);\nexport const SelectStateContext = createContext<SelectState<unknown> | null>(null);\n\n/**\n * A select displays a collapsible list of options and allows a user to select one of them.\n */\nexport const Select = /*#__PURE__*/ (forwardRef as forwardRefType)(function Select<T extends object = {}>(props: SelectProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, SelectContext);\n let {children, isDisabled = false, isInvalid = false, isRequired = false} = props;\n let content = useMemo(() => (\n typeof children === 'function'\n ? children({\n isOpen: false,\n isDisabled,\n isInvalid,\n isRequired,\n isFocused: false,\n isFocusVisible: false,\n defaultChildren: null\n })\n : children\n ), [children, isDisabled, isInvalid, isRequired]);\n\n return (\n <CollectionBuilder content={content}>\n {collection => <SelectInner props={props} collection={collection} selectRef={ref} />}\n </CollectionBuilder>\n );\n});\n\n// Contexts to clear inside the popover.\nconst CLEAR_CONTEXTS = [LabelContext, ButtonContext, TextContext];\n\ninterface SelectInnerProps<T extends object> {\n props: SelectProps<T>,\n selectRef: ForwardedRef<HTMLDivElement>,\n collection: Collection<Node<T>>\n}\n\nfunction SelectInner<T extends object>({props, selectRef: ref, collection}: SelectInnerProps<T>) {\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let state = useSelectState({\n ...props,\n collection,\n children: undefined,\n validationBehavior\n });\n\n let {isFocusVisible, focusProps} = useFocusRing({within: true});\n\n // Get props for child elements from useSelect\n let buttonRef = useRef<HTMLButtonElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n labelProps,\n triggerProps,\n valueProps,\n menuProps,\n descriptionProps,\n errorMessageProps,\n ...validation\n } = useSelect({\n ...removeDataAttributes(props),\n label,\n validationBehavior\n }, state, buttonRef);\n\n // Make menu width match input + button\n let [buttonWidth, setButtonWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (buttonRef.current) {\n setButtonWidth(buttonRef.current.offsetWidth + 'px');\n }\n }, [buttonRef]);\n\n useResizeObserver({\n ref: buttonRef,\n onResize: onResize\n });\n\n // Only expose a subset of state to renderProps function to avoid infinite render loop\n let renderPropsState = useMemo(() => ({\n isOpen: state.isOpen,\n isFocused: state.isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid || false,\n isRequired: props.isRequired || false\n }), [state.isOpen, state.isFocused, isFocusVisible, props.isDisabled, validation.isInvalid, props.isRequired]);\n\n let renderProps = useRenderProps({\n ...props,\n values: renderPropsState,\n defaultClassName: 'react-aria-Select'\n });\n\n let DOMProps = filterDOMProps(props);\n delete DOMProps.id;\n\n let scrollRef = useRef(null);\n\n return (\n <Provider\n values={[\n [SelectContext, props],\n [SelectStateContext, state],\n [SelectValueContext, valueProps],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [ButtonContext, {...triggerProps, ref: buttonRef, isPressed: state.isOpen, autoFocus: props.autoFocus}],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n trigger: 'Select',\n triggerRef: buttonRef,\n scrollRef,\n placement: 'bottom start',\n style: {'--trigger-width': buttonWidth} as React.CSSProperties,\n 'aria-labelledby': menuProps['aria-labelledby'],\n clearContexts: CLEAR_CONTEXTS\n }],\n [ListBoxContext, {...menuProps, ref: scrollRef}],\n [ListStateContext, state],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...DOMProps}\n {...renderProps}\n {...focusProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focused={state.isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-open={state.isOpen || undefined}\n data-disabled={props.isDisabled || undefined}\n data-invalid={validation.isInvalid || undefined}\n data-required={props.isRequired || undefined} />\n <HiddenSelect\n autoComplete={props.autoComplete}\n state={state}\n triggerRef={buttonRef}\n label={label}\n name={props.name}\n isDisabled={props.isDisabled} />\n </Provider>\n );\n}\n\nexport interface SelectValueRenderProps<T> {\n /**\n * Whether the value is a placeholder.\n * @selector [data-placeholder]\n */\n isPlaceholder: boolean,\n /** The object value of the currently selected item. */\n selectedItem: T | null,\n /** The textValue of the currently selected item. */\n selectedText: string | null\n}\n\nexport interface SelectValueProps<T extends object> extends Omit<HTMLAttributes<HTMLElement>, keyof RenderProps<unknown>>, RenderProps<SelectValueRenderProps<T>> {}\n\nexport const SelectValueContext = createContext<ContextValue<SelectValueProps<any>, HTMLSpanElement>>(null);\n\n/**\n * SelectValue renders the current value of a Select, or a placeholder if no value is selected.\n * It is usually placed within the button element.\n */\nexport const SelectValue = /*#__PURE__*/ (forwardRef as forwardRefType)(function SelectValue<T extends object>(props: SelectValueProps<T>, ref: ForwardedRef<HTMLSpanElement>) {\n [props, ref] = useContextProps(props, ref, SelectValueContext);\n let state = useContext(SelectStateContext)!;\n let {placeholder} = useSlottedContext(SelectContext)!;\n let selectedItem = state.selectedKey != null\n ? state.collection.getItem(state.selectedKey)\n : null;\n let rendered = selectedItem?.props.children;\n if (typeof rendered === 'function') {\n // If the selected item has a function as a child, we need to call it to render to React.JSX.\n let fn = rendered as (s: ItemRenderProps) => ReactNode;\n rendered = fn({\n isHovered: false,\n isPressed: false,\n isSelected: false,\n isFocused: false,\n isFocusVisible: false,\n isDisabled: false,\n selectionMode: 'single',\n selectionBehavior: 'toggle'\n });\n }\n\n let stringFormatter = useLocalizedStringFormatter(intlMessages, 'react-aria-components');\n\n let renderProps = useRenderProps({\n ...props,\n defaultChildren: rendered ?? placeholder ?? stringFormatter.format('selectPlaceholder'),\n defaultClassName: 'react-aria-SelectValue',\n values: {\n selectedItem: state.selectedItem?.value as T ?? null,\n selectedText: state.selectedItem?.textValue ?? null,\n isPlaceholder: !selectedItem\n }\n });\n\n let DOMProps = filterDOMProps(props);\n\n return (\n <span ref={ref} {...DOMProps} {...renderProps} data-placeholder={!selectedItem || undefined}>\n {/* clear description and error message slots */}\n <TextContext.Provider value={undefined}>\n {renderProps.children}\n </TextContext.Provider>\n </span>\n );\n});\n"],"names":[],"version":3,"file":"Select.main.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/react-aria-components/src/Select.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 {AriaSelectProps, HiddenSelect, useFocusRing, useLocalizedStringFormatter, useSelect} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {Collection, Node, SelectState, useSelectState} from 'react-stately';\nimport {CollectionBuilder} from '@react-aria/collections';\nimport {ContextValue, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, mergeProps, useResizeObserver} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType, GlobalDOMAttributes} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ItemRenderProps} from './Collection';\nimport {LabelContext} from './Label';\nimport {ListBoxContext, ListStateContext} from './ListBox';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport {PopoverContext} from './Popover';\nimport React, {createContext, ForwardedRef, forwardRef, HTMLAttributes, ReactNode, useCallback, useContext, useMemo, useRef, useState} from 'react';\nimport {TextContext} from './Text';\n\nexport interface SelectRenderProps {\n /**\n * Whether the select is focused, either via a mouse or keyboard.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the select is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the select is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the select is currently open.\n * @selector [data-open]\n */\n isOpen: boolean,\n /**\n * Whether the select is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the select is required.\n * @selector [data-required]\n */\n isRequired: boolean\n}\n\nexport interface SelectProps<T extends object = {}> extends Omit<AriaSelectProps<T>, 'children' | 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior' | 'items'>, RACValidation, RenderProps<SelectRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * Temporary text that occupies the select when it is empty.\n * @default 'Select an item' (localized)\n */\n placeholder?: string\n}\n\nexport const SelectContext = createContext<ContextValue<SelectProps<any>, HTMLDivElement>>(null);\nexport const SelectStateContext = createContext<SelectState<unknown> | null>(null);\n\n/**\n * A select displays a collapsible list of options and allows a user to select one of them.\n */\nexport const Select = /*#__PURE__*/ (forwardRef as forwardRefType)(function Select<T extends object = {}>(props: SelectProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, SelectContext);\n let {children, isDisabled = false, isInvalid = false, isRequired = false} = props;\n let content = useMemo(() => (\n typeof children === 'function'\n ? children({\n isOpen: false,\n isDisabled,\n isInvalid,\n isRequired,\n isFocused: false,\n isFocusVisible: false,\n defaultChildren: null\n })\n : children\n ), [children, isDisabled, isInvalid, isRequired]);\n\n return (\n <CollectionBuilder content={content}>\n {collection => <SelectInner props={props} collection={collection} selectRef={ref} />}\n </CollectionBuilder>\n );\n});\n\n// Contexts to clear inside the popover.\nconst CLEAR_CONTEXTS = [LabelContext, ButtonContext, TextContext];\n\ninterface SelectInnerProps<T extends object> {\n props: SelectProps<T>,\n selectRef: ForwardedRef<HTMLDivElement>,\n collection: Collection<Node<T>>\n}\n\nfunction SelectInner<T extends object>({props, selectRef: ref, collection}: SelectInnerProps<T>) {\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let state = useSelectState({\n ...props,\n collection,\n children: undefined,\n validationBehavior\n });\n\n let {isFocusVisible, focusProps} = useFocusRing({within: true});\n\n // Get props for child elements from useSelect\n let buttonRef = useRef<HTMLButtonElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n labelProps,\n triggerProps,\n valueProps,\n menuProps,\n descriptionProps,\n errorMessageProps,\n hiddenSelectProps,\n ...validation\n } = useSelect({\n ...removeDataAttributes(props),\n label,\n validationBehavior\n }, state, buttonRef);\n\n // Make menu width match input + button\n let [buttonWidth, setButtonWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (buttonRef.current) {\n setButtonWidth(buttonRef.current.offsetWidth + 'px');\n }\n }, [buttonRef]);\n\n useResizeObserver({\n ref: buttonRef,\n onResize: onResize\n });\n\n // Only expose a subset of state to renderProps function to avoid infinite render loop\n let renderPropsState = useMemo(() => ({\n isOpen: state.isOpen,\n isFocused: state.isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid || false,\n isRequired: props.isRequired || false\n }), [state.isOpen, state.isFocused, isFocusVisible, props.isDisabled, validation.isInvalid, props.isRequired]);\n\n let renderProps = useRenderProps({\n ...props,\n values: renderPropsState,\n defaultClassName: 'react-aria-Select'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n let scrollRef = useRef(null);\n\n return (\n <Provider\n values={[\n [SelectContext, props],\n [SelectStateContext, state],\n [SelectValueContext, valueProps],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [ButtonContext, {...triggerProps, ref: buttonRef, isPressed: state.isOpen, autoFocus: props.autoFocus}],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n trigger: 'Select',\n triggerRef: buttonRef,\n scrollRef,\n placement: 'bottom start',\n style: {'--trigger-width': buttonWidth} as React.CSSProperties,\n 'aria-labelledby': menuProps['aria-labelledby'],\n clearContexts: CLEAR_CONTEXTS\n }],\n [ListBoxContext, {...menuProps, ref: scrollRef}],\n [ListStateContext, state],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...mergeProps(DOMProps, renderProps, focusProps)}\n ref={ref}\n slot={props.slot || undefined}\n data-focused={state.isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-open={state.isOpen || undefined}\n data-disabled={props.isDisabled || undefined}\n data-invalid={validation.isInvalid || undefined}\n data-required={props.isRequired || undefined}>\n {renderProps.children}\n <HiddenSelect\n {...hiddenSelectProps}\n autoComplete={props.autoComplete} />\n </div>\n </Provider>\n );\n}\n\nexport interface SelectValueRenderProps<T> {\n /**\n * Whether the value is a placeholder.\n * @selector [data-placeholder]\n */\n isPlaceholder: boolean,\n /** The object value of the currently selected item. */\n selectedItem: T | null,\n /** The textValue of the currently selected item. */\n selectedText: string | null\n}\n\nexport interface SelectValueProps<T extends object> extends Omit<HTMLAttributes<HTMLElement>, keyof RenderProps<unknown>>, RenderProps<SelectValueRenderProps<T>> {}\n\nexport const SelectValueContext = createContext<ContextValue<SelectValueProps<any>, HTMLSpanElement>>(null);\n\n/**\n * SelectValue renders the current value of a Select, or a placeholder if no value is selected.\n * It is usually placed within the button element.\n */\nexport const SelectValue = /*#__PURE__*/ (forwardRef as forwardRefType)(function SelectValue<T extends object>(props: SelectValueProps<T>, ref: ForwardedRef<HTMLSpanElement>) {\n [props, ref] = useContextProps(props, ref, SelectValueContext);\n let state = useContext(SelectStateContext)!;\n let {placeholder} = useSlottedContext(SelectContext)!;\n let selectedItem = state.selectedKey != null\n ? state.collection.getItem(state.selectedKey)\n : null;\n let rendered = selectedItem?.props.children;\n if (typeof rendered === 'function') {\n // If the selected item has a function as a child, we need to call it to render to React.JSX.\n let fn = rendered as (s: ItemRenderProps) => ReactNode;\n rendered = fn({\n isHovered: false,\n isPressed: false,\n isSelected: false,\n isFocused: false,\n isFocusVisible: false,\n isDisabled: false,\n selectionMode: 'single',\n selectionBehavior: 'toggle'\n });\n }\n\n let stringFormatter = useLocalizedStringFormatter(intlMessages, 'react-aria-components');\n\n let renderProps = useRenderProps({\n ...props,\n defaultChildren: rendered ?? placeholder ?? stringFormatter.format('selectPlaceholder'),\n defaultClassName: 'react-aria-SelectValue',\n values: {\n selectedItem: state.selectedItem?.value as T ?? null,\n selectedText: state.selectedItem?.textValue ?? null,\n isPlaceholder: !selectedItem\n }\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <span ref={ref} {...DOMProps} {...renderProps} data-placeholder={!selectedItem || undefined}>\n {/* clear description and error message slots */}\n <TextContext.Provider value={undefined}>\n {renderProps.children}\n </TextContext.Provider>\n </span>\n );\n});\n"],"names":[],"version":3,"file":"Select.main.js.map"}
|
package/dist/Select.mjs
CHANGED
|
@@ -11,7 +11,7 @@ import {TextContext as $514c0188e459b4c0$export$9afb8bc826b033ea} from "./Text.m
|
|
|
11
11
|
import {useFocusRing as $akiWb$useFocusRing, useSelect as $akiWb$useSelect, HiddenSelect as $akiWb$HiddenSelect, useLocalizedStringFormatter as $akiWb$useLocalizedStringFormatter} from "react-aria";
|
|
12
12
|
import {useSelectState as $akiWb$useSelectState} from "react-stately";
|
|
13
13
|
import {CollectionBuilder as $akiWb$CollectionBuilder} from "@react-aria/collections";
|
|
14
|
-
import {useResizeObserver as $akiWb$useResizeObserver, filterDOMProps as $akiWb$filterDOMProps} from "@react-aria/utils";
|
|
14
|
+
import {useResizeObserver as $akiWb$useResizeObserver, filterDOMProps as $akiWb$filterDOMProps, mergeProps as $akiWb$mergeProps} from "@react-aria/utils";
|
|
15
15
|
import $akiWb$react, {createContext as $akiWb$createContext, forwardRef as $akiWb$forwardRef, useMemo as $akiWb$useMemo, useRef as $akiWb$useRef, useState as $akiWb$useState, useCallback as $akiWb$useCallback, useContext as $akiWb$useContext} from "react";
|
|
16
16
|
|
|
17
17
|
|
|
@@ -92,7 +92,7 @@ function $82d7e5349645de74$var$SelectInner({ props: props, selectRef: ref, colle
|
|
|
92
92
|
// Get props for child elements from useSelect
|
|
93
93
|
let buttonRef = (0, $akiWb$useRef)(null);
|
|
94
94
|
let [labelRef, label] = (0, $64fa3d84918910a7$export$9d4c57ee4c6ffdd8)(!props['aria-label'] && !props['aria-labelledby']);
|
|
95
|
-
let { labelProps: labelProps, triggerProps: triggerProps, valueProps: valueProps, menuProps: menuProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, ...validation } = (0, $akiWb$useSelect)({
|
|
95
|
+
let { labelProps: labelProps, triggerProps: triggerProps, valueProps: valueProps, menuProps: menuProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, hiddenSelectProps: hiddenSelectProps, ...validation } = (0, $akiWb$useSelect)({
|
|
96
96
|
...(0, $64fa3d84918910a7$export$ef03459518577ad4)(props),
|
|
97
97
|
label: label,
|
|
98
98
|
validationBehavior: validationBehavior
|
|
@@ -129,7 +129,9 @@ function $82d7e5349645de74$var$SelectInner({ props: props, selectRef: ref, colle
|
|
|
129
129
|
values: renderPropsState,
|
|
130
130
|
defaultClassName: 'react-aria-Select'
|
|
131
131
|
});
|
|
132
|
-
let DOMProps = (0, $akiWb$filterDOMProps)(props
|
|
132
|
+
let DOMProps = (0, $akiWb$filterDOMProps)(props, {
|
|
133
|
+
global: true
|
|
134
|
+
});
|
|
133
135
|
delete DOMProps.id;
|
|
134
136
|
let scrollRef = (0, $akiWb$useRef)(null);
|
|
135
137
|
return /*#__PURE__*/ (0, $akiWb$react).createElement((0, $64fa3d84918910a7$export$2881499e37b75b9a), {
|
|
@@ -207,9 +209,7 @@ function $82d7e5349645de74$var$SelectInner({ props: props, selectRef: ref, colle
|
|
|
207
209
|
]
|
|
208
210
|
]
|
|
209
211
|
}, /*#__PURE__*/ (0, $akiWb$react).createElement("div", {
|
|
210
|
-
...DOMProps,
|
|
211
|
-
...renderProps,
|
|
212
|
-
...focusProps,
|
|
212
|
+
...(0, $akiWb$mergeProps)(DOMProps, renderProps, focusProps),
|
|
213
213
|
ref: ref,
|
|
214
214
|
slot: props.slot || undefined,
|
|
215
215
|
"data-focused": state.isFocused || undefined,
|
|
@@ -218,14 +218,10 @@ function $82d7e5349645de74$var$SelectInner({ props: props, selectRef: ref, colle
|
|
|
218
218
|
"data-disabled": props.isDisabled || undefined,
|
|
219
219
|
"data-invalid": validation.isInvalid || undefined,
|
|
220
220
|
"data-required": props.isRequired || undefined
|
|
221
|
-
}
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
label: label,
|
|
226
|
-
name: props.name,
|
|
227
|
-
isDisabled: props.isDisabled
|
|
228
|
-
}));
|
|
221
|
+
}, renderProps.children, /*#__PURE__*/ (0, $akiWb$react).createElement((0, $akiWb$HiddenSelect), {
|
|
222
|
+
...hiddenSelectProps,
|
|
223
|
+
autoComplete: props.autoComplete
|
|
224
|
+
})));
|
|
229
225
|
}
|
|
230
226
|
const $82d7e5349645de74$export$f8f745c04421623f = /*#__PURE__*/ (0, $akiWb$createContext)(null);
|
|
231
227
|
const $82d7e5349645de74$export$e288731fd71264f0 = /*#__PURE__*/ (0, $akiWb$forwardRef)(function SelectValue(props, ref) {
|
|
@@ -261,7 +257,9 @@ const $82d7e5349645de74$export$e288731fd71264f0 = /*#__PURE__*/ (0, $akiWb$forwa
|
|
|
261
257
|
isPlaceholder: !selectedItem
|
|
262
258
|
}
|
|
263
259
|
});
|
|
264
|
-
let DOMProps = (0, $akiWb$filterDOMProps)(props
|
|
260
|
+
let DOMProps = (0, $akiWb$filterDOMProps)(props, {
|
|
261
|
+
global: true
|
|
262
|
+
});
|
|
265
263
|
return /*#__PURE__*/ (0, $akiWb$react).createElement("span", {
|
|
266
264
|
ref: ref,
|
|
267
265
|
...DOMProps,
|
package/dist/Select.module.js
CHANGED
|
@@ -11,7 +11,7 @@ import {TextContext as $514c0188e459b4c0$export$9afb8bc826b033ea} from "./Text.m
|
|
|
11
11
|
import {useFocusRing as $akiWb$useFocusRing, useSelect as $akiWb$useSelect, HiddenSelect as $akiWb$HiddenSelect, useLocalizedStringFormatter as $akiWb$useLocalizedStringFormatter} from "react-aria";
|
|
12
12
|
import {useSelectState as $akiWb$useSelectState} from "react-stately";
|
|
13
13
|
import {CollectionBuilder as $akiWb$CollectionBuilder} from "@react-aria/collections";
|
|
14
|
-
import {useResizeObserver as $akiWb$useResizeObserver, filterDOMProps as $akiWb$filterDOMProps} from "@react-aria/utils";
|
|
14
|
+
import {useResizeObserver as $akiWb$useResizeObserver, filterDOMProps as $akiWb$filterDOMProps, mergeProps as $akiWb$mergeProps} from "@react-aria/utils";
|
|
15
15
|
import $akiWb$react, {createContext as $akiWb$createContext, forwardRef as $akiWb$forwardRef, useMemo as $akiWb$useMemo, useRef as $akiWb$useRef, useState as $akiWb$useState, useCallback as $akiWb$useCallback, useContext as $akiWb$useContext} from "react";
|
|
16
16
|
|
|
17
17
|
|
|
@@ -92,7 +92,7 @@ function $82d7e5349645de74$var$SelectInner({ props: props, selectRef: ref, colle
|
|
|
92
92
|
// Get props for child elements from useSelect
|
|
93
93
|
let buttonRef = (0, $akiWb$useRef)(null);
|
|
94
94
|
let [labelRef, label] = (0, $64fa3d84918910a7$export$9d4c57ee4c6ffdd8)(!props['aria-label'] && !props['aria-labelledby']);
|
|
95
|
-
let { labelProps: labelProps, triggerProps: triggerProps, valueProps: valueProps, menuProps: menuProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, ...validation } = (0, $akiWb$useSelect)({
|
|
95
|
+
let { labelProps: labelProps, triggerProps: triggerProps, valueProps: valueProps, menuProps: menuProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, hiddenSelectProps: hiddenSelectProps, ...validation } = (0, $akiWb$useSelect)({
|
|
96
96
|
...(0, $64fa3d84918910a7$export$ef03459518577ad4)(props),
|
|
97
97
|
label: label,
|
|
98
98
|
validationBehavior: validationBehavior
|
|
@@ -129,7 +129,9 @@ function $82d7e5349645de74$var$SelectInner({ props: props, selectRef: ref, colle
|
|
|
129
129
|
values: renderPropsState,
|
|
130
130
|
defaultClassName: 'react-aria-Select'
|
|
131
131
|
});
|
|
132
|
-
let DOMProps = (0, $akiWb$filterDOMProps)(props
|
|
132
|
+
let DOMProps = (0, $akiWb$filterDOMProps)(props, {
|
|
133
|
+
global: true
|
|
134
|
+
});
|
|
133
135
|
delete DOMProps.id;
|
|
134
136
|
let scrollRef = (0, $akiWb$useRef)(null);
|
|
135
137
|
return /*#__PURE__*/ (0, $akiWb$react).createElement((0, $64fa3d84918910a7$export$2881499e37b75b9a), {
|
|
@@ -207,9 +209,7 @@ function $82d7e5349645de74$var$SelectInner({ props: props, selectRef: ref, colle
|
|
|
207
209
|
]
|
|
208
210
|
]
|
|
209
211
|
}, /*#__PURE__*/ (0, $akiWb$react).createElement("div", {
|
|
210
|
-
...DOMProps,
|
|
211
|
-
...renderProps,
|
|
212
|
-
...focusProps,
|
|
212
|
+
...(0, $akiWb$mergeProps)(DOMProps, renderProps, focusProps),
|
|
213
213
|
ref: ref,
|
|
214
214
|
slot: props.slot || undefined,
|
|
215
215
|
"data-focused": state.isFocused || undefined,
|
|
@@ -218,14 +218,10 @@ function $82d7e5349645de74$var$SelectInner({ props: props, selectRef: ref, colle
|
|
|
218
218
|
"data-disabled": props.isDisabled || undefined,
|
|
219
219
|
"data-invalid": validation.isInvalid || undefined,
|
|
220
220
|
"data-required": props.isRequired || undefined
|
|
221
|
-
}
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
label: label,
|
|
226
|
-
name: props.name,
|
|
227
|
-
isDisabled: props.isDisabled
|
|
228
|
-
}));
|
|
221
|
+
}, renderProps.children, /*#__PURE__*/ (0, $akiWb$react).createElement((0, $akiWb$HiddenSelect), {
|
|
222
|
+
...hiddenSelectProps,
|
|
223
|
+
autoComplete: props.autoComplete
|
|
224
|
+
})));
|
|
229
225
|
}
|
|
230
226
|
const $82d7e5349645de74$export$f8f745c04421623f = /*#__PURE__*/ (0, $akiWb$createContext)(null);
|
|
231
227
|
const $82d7e5349645de74$export$e288731fd71264f0 = /*#__PURE__*/ (0, $akiWb$forwardRef)(function SelectValue(props, ref) {
|
|
@@ -261,7 +257,9 @@ const $82d7e5349645de74$export$e288731fd71264f0 = /*#__PURE__*/ (0, $akiWb$forwa
|
|
|
261
257
|
isPlaceholder: !selectedItem
|
|
262
258
|
}
|
|
263
259
|
});
|
|
264
|
-
let DOMProps = (0, $akiWb$filterDOMProps)(props
|
|
260
|
+
let DOMProps = (0, $akiWb$filterDOMProps)(props, {
|
|
261
|
+
global: true
|
|
262
|
+
});
|
|
265
263
|
return /*#__PURE__*/ (0, $akiWb$react).createElement("span", {
|
|
266
264
|
ref: ref,
|
|
267
265
|
...DOMProps,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/react-aria-components/src/Select.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 {AriaSelectProps, HiddenSelect, useFocusRing, useLocalizedStringFormatter, useSelect} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {Collection, Node, SelectState, useSelectState} from 'react-stately';\nimport {CollectionBuilder} from '@react-aria/collections';\nimport {ContextValue, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useResizeObserver} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ItemRenderProps} from './Collection';\nimport {LabelContext} from './Label';\nimport {ListBoxContext, ListStateContext} from './ListBox';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport {PopoverContext} from './Popover';\nimport React, {createContext, ForwardedRef, forwardRef, HTMLAttributes, ReactNode, useCallback, useContext, useMemo, useRef, useState} from 'react';\nimport {TextContext} from './Text';\n\nexport interface SelectRenderProps {\n /**\n * Whether the select is focused, either via a mouse or keyboard.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the select is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the select is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the select is currently open.\n * @selector [data-open]\n */\n isOpen: boolean,\n /**\n * Whether the select is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the select is required.\n * @selector [data-required]\n */\n isRequired: boolean\n}\n\nexport interface SelectProps<T extends object = {}> extends Omit<AriaSelectProps<T>, 'children' | 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior' | 'items'>, RACValidation, RenderProps<SelectRenderProps>, SlotProps {\n /**\n * Temporary text that occupies the select when it is empty.\n * @default 'Select an item' (localized)\n */\n placeholder?: string\n}\n\nexport const SelectContext = createContext<ContextValue<SelectProps<any>, HTMLDivElement>>(null);\nexport const SelectStateContext = createContext<SelectState<unknown> | null>(null);\n\n/**\n * A select displays a collapsible list of options and allows a user to select one of them.\n */\nexport const Select = /*#__PURE__*/ (forwardRef as forwardRefType)(function Select<T extends object = {}>(props: SelectProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, SelectContext);\n let {children, isDisabled = false, isInvalid = false, isRequired = false} = props;\n let content = useMemo(() => (\n typeof children === 'function'\n ? children({\n isOpen: false,\n isDisabled,\n isInvalid,\n isRequired,\n isFocused: false,\n isFocusVisible: false,\n defaultChildren: null\n })\n : children\n ), [children, isDisabled, isInvalid, isRequired]);\n\n return (\n <CollectionBuilder content={content}>\n {collection => <SelectInner props={props} collection={collection} selectRef={ref} />}\n </CollectionBuilder>\n );\n});\n\n// Contexts to clear inside the popover.\nconst CLEAR_CONTEXTS = [LabelContext, ButtonContext, TextContext];\n\ninterface SelectInnerProps<T extends object> {\n props: SelectProps<T>,\n selectRef: ForwardedRef<HTMLDivElement>,\n collection: Collection<Node<T>>\n}\n\nfunction SelectInner<T extends object>({props, selectRef: ref, collection}: SelectInnerProps<T>) {\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let state = useSelectState({\n ...props,\n collection,\n children: undefined,\n validationBehavior\n });\n\n let {isFocusVisible, focusProps} = useFocusRing({within: true});\n\n // Get props for child elements from useSelect\n let buttonRef = useRef<HTMLButtonElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n labelProps,\n triggerProps,\n valueProps,\n menuProps,\n descriptionProps,\n errorMessageProps,\n ...validation\n } = useSelect({\n ...removeDataAttributes(props),\n label,\n validationBehavior\n }, state, buttonRef);\n\n // Make menu width match input + button\n let [buttonWidth, setButtonWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (buttonRef.current) {\n setButtonWidth(buttonRef.current.offsetWidth + 'px');\n }\n }, [buttonRef]);\n\n useResizeObserver({\n ref: buttonRef,\n onResize: onResize\n });\n\n // Only expose a subset of state to renderProps function to avoid infinite render loop\n let renderPropsState = useMemo(() => ({\n isOpen: state.isOpen,\n isFocused: state.isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid || false,\n isRequired: props.isRequired || false\n }), [state.isOpen, state.isFocused, isFocusVisible, props.isDisabled, validation.isInvalid, props.isRequired]);\n\n let renderProps = useRenderProps({\n ...props,\n values: renderPropsState,\n defaultClassName: 'react-aria-Select'\n });\n\n let DOMProps = filterDOMProps(props);\n delete DOMProps.id;\n\n let scrollRef = useRef(null);\n\n return (\n <Provider\n values={[\n [SelectContext, props],\n [SelectStateContext, state],\n [SelectValueContext, valueProps],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [ButtonContext, {...triggerProps, ref: buttonRef, isPressed: state.isOpen, autoFocus: props.autoFocus}],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n trigger: 'Select',\n triggerRef: buttonRef,\n scrollRef,\n placement: 'bottom start',\n style: {'--trigger-width': buttonWidth} as React.CSSProperties,\n 'aria-labelledby': menuProps['aria-labelledby'],\n clearContexts: CLEAR_CONTEXTS\n }],\n [ListBoxContext, {...menuProps, ref: scrollRef}],\n [ListStateContext, state],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...DOMProps}\n {...renderProps}\n {...focusProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focused={state.isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-open={state.isOpen || undefined}\n data-disabled={props.isDisabled || undefined}\n data-invalid={validation.isInvalid || undefined}\n data-required={props.isRequired || undefined} />\n <HiddenSelect\n autoComplete={props.autoComplete}\n state={state}\n triggerRef={buttonRef}\n label={label}\n name={props.name}\n isDisabled={props.isDisabled} />\n </Provider>\n );\n}\n\nexport interface SelectValueRenderProps<T> {\n /**\n * Whether the value is a placeholder.\n * @selector [data-placeholder]\n */\n isPlaceholder: boolean,\n /** The object value of the currently selected item. */\n selectedItem: T | null,\n /** The textValue of the currently selected item. */\n selectedText: string | null\n}\n\nexport interface SelectValueProps<T extends object> extends Omit<HTMLAttributes<HTMLElement>, keyof RenderProps<unknown>>, RenderProps<SelectValueRenderProps<T>> {}\n\nexport const SelectValueContext = createContext<ContextValue<SelectValueProps<any>, HTMLSpanElement>>(null);\n\n/**\n * SelectValue renders the current value of a Select, or a placeholder if no value is selected.\n * It is usually placed within the button element.\n */\nexport const SelectValue = /*#__PURE__*/ (forwardRef as forwardRefType)(function SelectValue<T extends object>(props: SelectValueProps<T>, ref: ForwardedRef<HTMLSpanElement>) {\n [props, ref] = useContextProps(props, ref, SelectValueContext);\n let state = useContext(SelectStateContext)!;\n let {placeholder} = useSlottedContext(SelectContext)!;\n let selectedItem = state.selectedKey != null\n ? state.collection.getItem(state.selectedKey)\n : null;\n let rendered = selectedItem?.props.children;\n if (typeof rendered === 'function') {\n // If the selected item has a function as a child, we need to call it to render to React.JSX.\n let fn = rendered as (s: ItemRenderProps) => ReactNode;\n rendered = fn({\n isHovered: false,\n isPressed: false,\n isSelected: false,\n isFocused: false,\n isFocusVisible: false,\n isDisabled: false,\n selectionMode: 'single',\n selectionBehavior: 'toggle'\n });\n }\n\n let stringFormatter = useLocalizedStringFormatter(intlMessages, 'react-aria-components');\n\n let renderProps = useRenderProps({\n ...props,\n defaultChildren: rendered ?? placeholder ?? stringFormatter.format('selectPlaceholder'),\n defaultClassName: 'react-aria-SelectValue',\n values: {\n selectedItem: state.selectedItem?.value as T ?? null,\n selectedText: state.selectedItem?.textValue ?? null,\n isPlaceholder: !selectedItem\n }\n });\n\n let DOMProps = filterDOMProps(props);\n\n return (\n <span ref={ref} {...DOMProps} {...renderProps} data-placeholder={!selectedItem || undefined}>\n {/* clear description and error message slots */}\n <TextContext.Provider value={undefined}>\n {renderProps.children}\n </TextContext.Provider>\n </span>\n );\n});\n"],"names":[],"version":3,"file":"Select.module.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/react-aria-components/src/Select.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 {AriaSelectProps, HiddenSelect, useFocusRing, useLocalizedStringFormatter, useSelect} from 'react-aria';\nimport {ButtonContext} from './Button';\nimport {Collection, Node, SelectState, useSelectState} from 'react-stately';\nimport {CollectionBuilder} from '@react-aria/collections';\nimport {ContextValue, Provider, RACValidation, removeDataAttributes, RenderProps, SlotProps, useContextProps, useRenderProps, useSlot, useSlottedContext} from './utils';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, mergeProps, useResizeObserver} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType, GlobalDOMAttributes} from '@react-types/shared';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ItemRenderProps} from './Collection';\nimport {LabelContext} from './Label';\nimport {ListBoxContext, ListStateContext} from './ListBox';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport {PopoverContext} from './Popover';\nimport React, {createContext, ForwardedRef, forwardRef, HTMLAttributes, ReactNode, useCallback, useContext, useMemo, useRef, useState} from 'react';\nimport {TextContext} from './Text';\n\nexport interface SelectRenderProps {\n /**\n * Whether the select is focused, either via a mouse or keyboard.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the select is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the select is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the select is currently open.\n * @selector [data-open]\n */\n isOpen: boolean,\n /**\n * Whether the select is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the select is required.\n * @selector [data-required]\n */\n isRequired: boolean\n}\n\nexport interface SelectProps<T extends object = {}> extends Omit<AriaSelectProps<T>, 'children' | 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior' | 'items'>, RACValidation, RenderProps<SelectRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * Temporary text that occupies the select when it is empty.\n * @default 'Select an item' (localized)\n */\n placeholder?: string\n}\n\nexport const SelectContext = createContext<ContextValue<SelectProps<any>, HTMLDivElement>>(null);\nexport const SelectStateContext = createContext<SelectState<unknown> | null>(null);\n\n/**\n * A select displays a collapsible list of options and allows a user to select one of them.\n */\nexport const Select = /*#__PURE__*/ (forwardRef as forwardRefType)(function Select<T extends object = {}>(props: SelectProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, SelectContext);\n let {children, isDisabled = false, isInvalid = false, isRequired = false} = props;\n let content = useMemo(() => (\n typeof children === 'function'\n ? children({\n isOpen: false,\n isDisabled,\n isInvalid,\n isRequired,\n isFocused: false,\n isFocusVisible: false,\n defaultChildren: null\n })\n : children\n ), [children, isDisabled, isInvalid, isRequired]);\n\n return (\n <CollectionBuilder content={content}>\n {collection => <SelectInner props={props} collection={collection} selectRef={ref} />}\n </CollectionBuilder>\n );\n});\n\n// Contexts to clear inside the popover.\nconst CLEAR_CONTEXTS = [LabelContext, ButtonContext, TextContext];\n\ninterface SelectInnerProps<T extends object> {\n props: SelectProps<T>,\n selectRef: ForwardedRef<HTMLDivElement>,\n collection: Collection<Node<T>>\n}\n\nfunction SelectInner<T extends object>({props, selectRef: ref, collection}: SelectInnerProps<T>) {\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let state = useSelectState({\n ...props,\n collection,\n children: undefined,\n validationBehavior\n });\n\n let {isFocusVisible, focusProps} = useFocusRing({within: true});\n\n // Get props for child elements from useSelect\n let buttonRef = useRef<HTMLButtonElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n labelProps,\n triggerProps,\n valueProps,\n menuProps,\n descriptionProps,\n errorMessageProps,\n hiddenSelectProps,\n ...validation\n } = useSelect({\n ...removeDataAttributes(props),\n label,\n validationBehavior\n }, state, buttonRef);\n\n // Make menu width match input + button\n let [buttonWidth, setButtonWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (buttonRef.current) {\n setButtonWidth(buttonRef.current.offsetWidth + 'px');\n }\n }, [buttonRef]);\n\n useResizeObserver({\n ref: buttonRef,\n onResize: onResize\n });\n\n // Only expose a subset of state to renderProps function to avoid infinite render loop\n let renderPropsState = useMemo(() => ({\n isOpen: state.isOpen,\n isFocused: state.isFocused,\n isFocusVisible,\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid || false,\n isRequired: props.isRequired || false\n }), [state.isOpen, state.isFocused, isFocusVisible, props.isDisabled, validation.isInvalid, props.isRequired]);\n\n let renderProps = useRenderProps({\n ...props,\n values: renderPropsState,\n defaultClassName: 'react-aria-Select'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n let scrollRef = useRef(null);\n\n return (\n <Provider\n values={[\n [SelectContext, props],\n [SelectStateContext, state],\n [SelectValueContext, valueProps],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [ButtonContext, {...triggerProps, ref: buttonRef, isPressed: state.isOpen, autoFocus: props.autoFocus}],\n [OverlayTriggerStateContext, state],\n [PopoverContext, {\n trigger: 'Select',\n triggerRef: buttonRef,\n scrollRef,\n placement: 'bottom start',\n style: {'--trigger-width': buttonWidth} as React.CSSProperties,\n 'aria-labelledby': menuProps['aria-labelledby'],\n clearContexts: CLEAR_CONTEXTS\n }],\n [ListBoxContext, {...menuProps, ref: scrollRef}],\n [ListStateContext, state],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <div\n {...mergeProps(DOMProps, renderProps, focusProps)}\n ref={ref}\n slot={props.slot || undefined}\n data-focused={state.isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-open={state.isOpen || undefined}\n data-disabled={props.isDisabled || undefined}\n data-invalid={validation.isInvalid || undefined}\n data-required={props.isRequired || undefined}>\n {renderProps.children}\n <HiddenSelect\n {...hiddenSelectProps}\n autoComplete={props.autoComplete} />\n </div>\n </Provider>\n );\n}\n\nexport interface SelectValueRenderProps<T> {\n /**\n * Whether the value is a placeholder.\n * @selector [data-placeholder]\n */\n isPlaceholder: boolean,\n /** The object value of the currently selected item. */\n selectedItem: T | null,\n /** The textValue of the currently selected item. */\n selectedText: string | null\n}\n\nexport interface SelectValueProps<T extends object> extends Omit<HTMLAttributes<HTMLElement>, keyof RenderProps<unknown>>, RenderProps<SelectValueRenderProps<T>> {}\n\nexport const SelectValueContext = createContext<ContextValue<SelectValueProps<any>, HTMLSpanElement>>(null);\n\n/**\n * SelectValue renders the current value of a Select, or a placeholder if no value is selected.\n * It is usually placed within the button element.\n */\nexport const SelectValue = /*#__PURE__*/ (forwardRef as forwardRefType)(function SelectValue<T extends object>(props: SelectValueProps<T>, ref: ForwardedRef<HTMLSpanElement>) {\n [props, ref] = useContextProps(props, ref, SelectValueContext);\n let state = useContext(SelectStateContext)!;\n let {placeholder} = useSlottedContext(SelectContext)!;\n let selectedItem = state.selectedKey != null\n ? state.collection.getItem(state.selectedKey)\n : null;\n let rendered = selectedItem?.props.children;\n if (typeof rendered === 'function') {\n // If the selected item has a function as a child, we need to call it to render to React.JSX.\n let fn = rendered as (s: ItemRenderProps) => ReactNode;\n rendered = fn({\n isHovered: false,\n isPressed: false,\n isSelected: false,\n isFocused: false,\n isFocusVisible: false,\n isDisabled: false,\n selectionMode: 'single',\n selectionBehavior: 'toggle'\n });\n }\n\n let stringFormatter = useLocalizedStringFormatter(intlMessages, 'react-aria-components');\n\n let renderProps = useRenderProps({\n ...props,\n defaultChildren: rendered ?? placeholder ?? stringFormatter.format('selectPlaceholder'),\n defaultClassName: 'react-aria-SelectValue',\n values: {\n selectedItem: state.selectedItem?.value as T ?? null,\n selectedText: state.selectedItem?.textValue ?? null,\n isPlaceholder: !selectedItem\n }\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <span ref={ref} {...DOMProps} {...renderProps} data-placeholder={!selectedItem || undefined}>\n {/* clear description and error message slots */}\n <TextContext.Provider value={undefined}>\n {renderProps.children}\n </TextContext.Provider>\n </span>\n );\n});\n"],"names":[],"version":3,"file":"Select.module.js.map"}
|
package/dist/Separator.main.js
CHANGED
|
@@ -31,7 +31,19 @@ $parcel$export(module.exports, "Separator", () => $54b202ace195eaa4$export$1ff3c
|
|
|
31
31
|
|
|
32
32
|
|
|
33
33
|
const $54b202ace195eaa4$export$6615d83f6de245ce = /*#__PURE__*/ (0, $6jQ43$react.createContext)({});
|
|
34
|
-
|
|
34
|
+
class $54b202ace195eaa4$export$7750289ca694c0b5 extends (0, $6jQ43$reactariacollections.CollectionNode) {
|
|
35
|
+
filter(collection, newCollection) {
|
|
36
|
+
let prevItem = newCollection.getItem(this.prevKey);
|
|
37
|
+
if (prevItem && prevItem.type !== 'separator') {
|
|
38
|
+
let clone = this.clone();
|
|
39
|
+
newCollection.addDescendants(clone, collection);
|
|
40
|
+
return clone;
|
|
41
|
+
}
|
|
42
|
+
return null;
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
$54b202ace195eaa4$export$7750289ca694c0b5.type = 'separator';
|
|
46
|
+
const $54b202ace195eaa4$export$1ff3c3f08ae963c0 = /*#__PURE__*/ (0, $6jQ43$reactariacollections.createLeafComponent)($54b202ace195eaa4$export$7750289ca694c0b5, function Separator(props, ref) {
|
|
35
47
|
[props, ref] = (0, $c5ccf687772c0422$exports.useContextProps)(props, ref, $54b202ace195eaa4$export$6615d83f6de245ce);
|
|
36
48
|
let { elementType: elementType, orientation: orientation, style: style, className: className, slot: slot, ...otherProps } = props;
|
|
37
49
|
let Element = elementType || 'hr';
|
|
@@ -41,9 +53,11 @@ const $54b202ace195eaa4$export$1ff3c3f08ae963c0 = /*#__PURE__*/ (0, $6jQ43$react
|
|
|
41
53
|
elementType: elementType,
|
|
42
54
|
orientation: orientation
|
|
43
55
|
});
|
|
56
|
+
let DOMProps = (0, $6jQ43$reactariautils.filterDOMProps)(props, {
|
|
57
|
+
global: true
|
|
58
|
+
});
|
|
44
59
|
return /*#__PURE__*/ (0, ($parcel$interopDefault($6jQ43$react))).createElement(Element, {
|
|
45
|
-
...(0, $6jQ43$reactariautils.
|
|
46
|
-
...separatorProps,
|
|
60
|
+
...(0, $6jQ43$reactariautils.mergeProps)(DOMProps, separatorProps),
|
|
47
61
|
style: style,
|
|
48
62
|
className: className !== null && className !== void 0 ? className : 'react-aria-Separator',
|
|
49
63
|
ref: ref,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAWM,MAAM,0DAAmB,CAAA,GAAA,0BAAY,EAA6C,CAAC;AAEnF,MAAM,kDAAsB,CAAA,GAAA,0CAAa;IAG9C,OAAO,UAA+B,EAAE,aAAkC,EAA8B;QACtG,IAAI,WAAW,cAAc,OAAO,CAAC,IAAI,CAAC,OAAO;QACjD,IAAI,YAAY,SAAS,IAAI,KAAK,aAAa;YAC7C,IAAI,QAAQ,IAAI,CAAC,KAAK;YACtB,cAAc,cAAc,CAAC,OAAO;YACpC,OAAO;QACT;QAEA,OAAO;IACT;AACF;AAba,0CACK,OAAO;AAclB,MAAM,4CAAY,WAAW,GAAG,CAAA,GAAA,+CAAkB,EAAE,2CAAe,SAAS,UAAU,KAAqB,EAAE,GAA8B;IAChJ,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAE3C,IAAI,eAAC,WAAW,eAAE,WAAW,SAAE,KAAK,aAAE,SAAS,QAAE,IAAI,EAAE,GAAG,YAAW,GAAG;IACxE,IAAI,UAAU,AAAC,eAA+B;IAC9C,IAAI,YAAY,QAAQ,gBAAgB,YACtC,UAAU;IAGZ,IAAI,kBAAC,cAAc,EAAC,GAAG,CAAA,GAAA,6BAAW,EAAE;QAClC,GAAG,UAAU;qBACb;qBACA;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAElD,qBACE,0DAAC;QACE,GAAG,CAAA,GAAA,gCAAS,EAAE,UAAU,eAAe;QACxC,OAAO;QACP,WAAW,sBAAA,uBAAA,YAAa;QACxB,KAAK;QACL,MAAM,QAAQ;;AAEpB","sources":["packages/react-aria-components/src/Separator.tsx"],"sourcesContent":["/*\n * Copyright 2022 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 {SeparatorProps as AriaSeparatorProps, useSeparator} from 'react-aria';\nimport {BaseCollection, CollectionNode, createLeafComponent} from '@react-aria/collections';\nimport {ContextValue, SlotProps, StyleProps, useContextProps} from './utils';\nimport {filterDOMProps, mergeProps} from '@react-aria/utils';\nimport {GlobalDOMAttributes} from '@react-types/shared';\nimport React, {createContext, ElementType, ForwardedRef} from 'react';\n\nexport interface SeparatorProps extends AriaSeparatorProps, StyleProps, SlotProps, GlobalDOMAttributes<HTMLElement> {}\n\nexport const SeparatorContext = createContext<ContextValue<SeparatorProps, HTMLElement>>({});\n\nexport class SeparatorNode extends CollectionNode<any> {\n static readonly type = 'separator';\n\n filter(collection: BaseCollection<any>, newCollection: BaseCollection<any>): CollectionNode<any> | null {\n let prevItem = newCollection.getItem(this.prevKey!);\n if (prevItem && prevItem.type !== 'separator') {\n let clone = this.clone();\n newCollection.addDescendants(clone, collection);\n return clone;\n }\n\n return null;\n }\n}\n\nexport const Separator = /*#__PURE__*/ createLeafComponent(SeparatorNode, function Separator(props: SeparatorProps, ref: ForwardedRef<HTMLElement>) {\n [props, ref] = useContextProps(props, ref, SeparatorContext);\n\n let {elementType, orientation, style, className, slot, ...otherProps} = props;\n let Element = (elementType as ElementType) || 'hr';\n if (Element === 'hr' && orientation === 'vertical') {\n Element = 'div';\n }\n\n let {separatorProps} = useSeparator({\n ...otherProps,\n elementType,\n orientation\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <Element\n {...mergeProps(DOMProps, separatorProps)}\n style={style}\n className={className ?? 'react-aria-Separator'}\n ref={ref}\n slot={slot || undefined} />\n );\n});\n"],"names":[],"version":3,"file":"Separator.main.js.map"}
|