@depup/react-aria-components 1.19.0-depup.27 → 1.20.0-depup.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/PreviewTrigger/package.json +5 -0
- package/README.md +2 -2
- package/TokenField/package.json +5 -0
- package/changes.json +1 -1
- package/dist/exports/GridList.cjs.map +1 -1
- package/dist/exports/GridList.js.map +1 -1
- package/dist/exports/GridList.mjs.map +1 -1
- package/dist/exports/PreviewTrigger.cjs +26 -0
- package/dist/exports/PreviewTrigger.cjs.map +1 -0
- package/dist/exports/PreviewTrigger.js +21 -0
- package/dist/exports/PreviewTrigger.js.map +1 -0
- package/dist/exports/PreviewTrigger.mjs +21 -0
- package/dist/exports/PreviewTrigger.mjs.map +1 -0
- package/dist/exports/TokenField.cjs +31 -0
- package/dist/exports/TokenField.cjs.map +1 -0
- package/dist/exports/TokenField.js +21 -0
- package/dist/exports/TokenField.js.map +1 -0
- package/dist/exports/TokenField.mjs +21 -0
- package/dist/exports/TokenField.mjs.map +1 -0
- package/dist/exports/Tree.cjs.map +1 -1
- package/dist/exports/Tree.js.map +1 -1
- package/dist/exports/Tree.mjs.map +1 -1
- package/dist/exports/index.cjs +12 -0
- package/dist/exports/index.cjs.map +1 -1
- package/dist/exports/index.js +7 -1
- package/dist/exports/index.js.map +1 -1
- package/dist/exports/index.mjs +7 -1
- package/dist/exports/index.mjs.map +1 -1
- package/dist/private/Checkbox.cjs.map +1 -1
- package/dist/private/Checkbox.js.map +1 -1
- package/dist/private/Checkbox.mjs.map +1 -1
- package/dist/private/ComboBox.cjs +21 -2
- package/dist/private/ComboBox.cjs.map +1 -1
- package/dist/private/ComboBox.js +21 -2
- package/dist/private/ComboBox.js.map +1 -1
- package/dist/private/ComboBox.mjs +21 -2
- package/dist/private/ComboBox.mjs.map +1 -1
- package/dist/private/Dialog.cjs +15 -1
- package/dist/private/Dialog.cjs.map +1 -1
- package/dist/private/Dialog.js +15 -1
- package/dist/private/Dialog.js.map +1 -1
- package/dist/private/Dialog.mjs +15 -1
- package/dist/private/Dialog.mjs.map +1 -1
- package/dist/private/DragAndDrop.cjs +1 -0
- package/dist/private/DragAndDrop.cjs.map +1 -1
- package/dist/private/DragAndDrop.js +1 -0
- package/dist/private/DragAndDrop.js.map +1 -1
- package/dist/private/DragAndDrop.mjs +1 -0
- package/dist/private/DragAndDrop.mjs.map +1 -1
- package/dist/private/DropZone.cjs +5 -2
- package/dist/private/DropZone.cjs.map +1 -1
- package/dist/private/DropZone.js +5 -3
- package/dist/private/DropZone.js.map +1 -1
- package/dist/private/DropZone.mjs +5 -2
- package/dist/private/DropZone.mjs.map +1 -1
- package/dist/private/FileTrigger.cjs +1 -0
- package/dist/private/FileTrigger.cjs.map +1 -1
- package/dist/private/FileTrigger.js +1 -0
- package/dist/private/FileTrigger.js.map +1 -1
- package/dist/private/FileTrigger.mjs +1 -0
- package/dist/private/FileTrigger.mjs.map +1 -1
- package/dist/private/GridLayout.cjs +3 -1
- package/dist/private/GridLayout.cjs.map +1 -1
- package/dist/private/GridLayout.js +3 -1
- package/dist/private/GridLayout.js.map +1 -1
- package/dist/private/GridLayout.mjs +3 -1
- package/dist/private/GridLayout.mjs.map +1 -1
- package/dist/private/GridList.cjs +12 -1
- package/dist/private/GridList.cjs.map +1 -1
- package/dist/private/GridList.js +12 -1
- package/dist/private/GridList.js.map +1 -1
- package/dist/private/GridList.mjs +12 -1
- package/dist/private/GridList.mjs.map +1 -1
- package/dist/private/ListBox.cjs +9 -1
- package/dist/private/ListBox.cjs.map +1 -1
- package/dist/private/ListBox.js +9 -1
- package/dist/private/ListBox.js.map +1 -1
- package/dist/private/ListBox.mjs +9 -1
- package/dist/private/ListBox.mjs.map +1 -1
- package/dist/private/Menu.cjs +4 -2
- package/dist/private/Menu.cjs.map +1 -1
- package/dist/private/Menu.js +4 -2
- package/dist/private/Menu.js.map +1 -1
- package/dist/private/Menu.mjs +4 -2
- package/dist/private/Menu.mjs.map +1 -1
- package/dist/private/Meter.cjs +2 -1
- package/dist/private/Meter.cjs.map +1 -1
- package/dist/private/Meter.js +2 -1
- package/dist/private/Meter.js.map +1 -1
- package/dist/private/Meter.mjs +2 -1
- package/dist/private/Meter.mjs.map +1 -1
- package/dist/private/Modal.cjs +2 -0
- package/dist/private/Modal.cjs.map +1 -1
- package/dist/private/Modal.js +2 -0
- package/dist/private/Modal.js.map +1 -1
- package/dist/private/Modal.mjs +2 -0
- package/dist/private/Modal.mjs.map +1 -1
- package/dist/private/Popover.cjs +34 -9
- package/dist/private/Popover.cjs.map +1 -1
- package/dist/private/Popover.js +34 -9
- package/dist/private/Popover.js.map +1 -1
- package/dist/private/Popover.mjs +34 -9
- package/dist/private/Popover.mjs.map +1 -1
- package/dist/private/PreviewTrigger.cjs +88 -0
- package/dist/private/PreviewTrigger.cjs.map +1 -0
- package/dist/private/PreviewTrigger.js +80 -0
- package/dist/private/PreviewTrigger.js.map +1 -0
- package/dist/private/PreviewTrigger.mjs +79 -0
- package/dist/private/PreviewTrigger.mjs.map +1 -0
- package/dist/private/ProgressBar.cjs +6 -1
- package/dist/private/ProgressBar.cjs.map +1 -1
- package/dist/private/ProgressBar.js +6 -1
- package/dist/private/ProgressBar.js.map +1 -1
- package/dist/private/ProgressBar.mjs +6 -1
- package/dist/private/ProgressBar.mjs.map +1 -1
- package/dist/private/Select.cjs.map +1 -1
- package/dist/private/Select.js.map +1 -1
- package/dist/private/Select.mjs.map +1 -1
- package/dist/private/Table.cjs +26 -14
- package/dist/private/Table.cjs.map +1 -1
- package/dist/private/Table.js +26 -14
- package/dist/private/Table.js.map +1 -1
- package/dist/private/Table.mjs +26 -14
- package/dist/private/Table.mjs.map +1 -1
- package/dist/private/TableLayout.cjs +3 -1
- package/dist/private/TableLayout.cjs.map +1 -1
- package/dist/private/TableLayout.js +3 -1
- package/dist/private/TableLayout.js.map +1 -1
- package/dist/private/TableLayout.mjs +3 -1
- package/dist/private/TableLayout.mjs.map +1 -1
- package/dist/private/TagGroup.cjs +1 -0
- package/dist/private/TagGroup.cjs.map +1 -1
- package/dist/private/TagGroup.js +1 -0
- package/dist/private/TagGroup.js.map +1 -1
- package/dist/private/TagGroup.mjs +1 -0
- package/dist/private/TagGroup.mjs.map +1 -1
- package/dist/private/ToggleButton.cjs.map +1 -1
- package/dist/private/ToggleButton.js.map +1 -1
- package/dist/private/ToggleButton.mjs.map +1 -1
- package/dist/private/TokenField.cjs +207 -0
- package/dist/private/TokenField.cjs.map +1 -0
- package/dist/private/TokenField.js +197 -0
- package/dist/private/TokenField.js.map +1 -0
- package/dist/private/TokenField.mjs +195 -0
- package/dist/private/TokenField.mjs.map +1 -0
- package/dist/private/Tooltip.cjs +10 -2
- package/dist/private/Tooltip.cjs.map +1 -1
- package/dist/private/Tooltip.js +10 -2
- package/dist/private/Tooltip.js.map +1 -1
- package/dist/private/Tooltip.mjs +10 -2
- package/dist/private/Tooltip.mjs.map +1 -1
- package/dist/private/Tree.cjs +11 -1
- package/dist/private/Tree.cjs.map +1 -1
- package/dist/private/Tree.js +11 -1
- package/dist/private/Tree.js.map +1 -1
- package/dist/private/Tree.mjs +11 -1
- package/dist/private/Tree.mjs.map +1 -1
- package/dist/private/Virtualizer.cjs +18 -16
- package/dist/private/Virtualizer.cjs.map +1 -1
- package/dist/private/Virtualizer.js +18 -16
- package/dist/private/Virtualizer.js.map +1 -1
- package/dist/private/Virtualizer.mjs +18 -16
- package/dist/private/Virtualizer.mjs.map +1 -1
- package/dist/private/useDragAndDrop.cjs +7 -0
- package/dist/private/useDragAndDrop.cjs.map +1 -1
- package/dist/private/useDragAndDrop.js +7 -0
- package/dist/private/useDragAndDrop.js.map +1 -1
- package/dist/private/useDragAndDrop.mjs +7 -0
- package/dist/private/useDragAndDrop.mjs.map +1 -1
- package/dist/private/utils.cjs.map +1 -1
- package/dist/private/utils.js.map +1 -1
- package/dist/private/utils.mjs.map +1 -1
- package/dist/types/exports/GridList.d.ts +1 -1
- package/dist/types/exports/PreviewTrigger.d.ts +3 -0
- package/dist/types/exports/TokenField.d.ts +5 -0
- package/dist/types/exports/Tree.d.ts +1 -1
- package/dist/types/exports/index.d.ts +7 -2
- package/dist/types/src/ComboBox.d.ts +4 -1
- package/dist/types/src/GridList.d.ts +12 -1
- package/dist/types/src/ListBox.d.ts +1 -1
- package/dist/types/src/Popover.d.ts +7 -0
- package/dist/types/src/PreviewTrigger.d.ts +23 -0
- package/dist/types/src/Select.d.ts +1 -1
- package/dist/types/src/Table.d.ts +24 -0
- package/dist/types/src/TokenField.d.ts +111 -0
- package/dist/types/src/Tree.d.ts +7 -5
- package/dist/types/src/Virtualizer.d.ts +4 -0
- package/dist/types/src/utils.d.ts +19 -5
- package/i18n/ar-AE.js +1 -1
- package/i18n/ar-AE.mjs +1 -1
- package/i18n/bg-BG.js +1 -1
- package/i18n/bg-BG.mjs +1 -1
- package/i18n/cs-CZ.js +1 -1
- package/i18n/cs-CZ.mjs +1 -1
- package/i18n/da-DK.js +1 -1
- package/i18n/da-DK.mjs +1 -1
- package/i18n/de-DE.js +1 -1
- package/i18n/de-DE.mjs +1 -1
- package/i18n/el-GR.js +1 -1
- package/i18n/el-GR.mjs +1 -1
- package/i18n/en-US.js +1 -1
- package/i18n/en-US.mjs +1 -1
- package/i18n/es-ES.js +1 -1
- package/i18n/es-ES.mjs +1 -1
- package/i18n/et-EE.js +1 -1
- package/i18n/et-EE.mjs +1 -1
- package/i18n/fi-FI.js +1 -1
- package/i18n/fi-FI.mjs +1 -1
- package/i18n/fr-FR.js +1 -1
- package/i18n/fr-FR.mjs +1 -1
- package/i18n/he-IL.js +1 -1
- package/i18n/he-IL.mjs +1 -1
- package/i18n/hr-HR.js +1 -1
- package/i18n/hr-HR.mjs +1 -1
- package/i18n/hu-HU.js +1 -1
- package/i18n/hu-HU.mjs +1 -1
- package/i18n/it-IT.js +1 -1
- package/i18n/it-IT.mjs +1 -1
- package/i18n/ja-JP.js +1 -1
- package/i18n/ja-JP.mjs +1 -1
- package/i18n/ko-KR.js +1 -1
- package/i18n/ko-KR.mjs +1 -1
- package/i18n/lt-LT.js +1 -1
- package/i18n/lt-LT.mjs +1 -1
- package/i18n/lv-LV.js +1 -1
- package/i18n/lv-LV.mjs +1 -1
- package/i18n/nb-NO.js +1 -1
- package/i18n/nb-NO.mjs +1 -1
- package/i18n/nl-NL.js +1 -1
- package/i18n/nl-NL.mjs +1 -1
- package/i18n/pl-PL.js +1 -1
- package/i18n/pl-PL.mjs +1 -1
- package/i18n/pt-BR.js +1 -1
- package/i18n/pt-BR.mjs +1 -1
- package/i18n/pt-PT.js +1 -1
- package/i18n/pt-PT.mjs +1 -1
- package/i18n/ro-RO.js +1 -1
- package/i18n/ro-RO.mjs +1 -1
- package/i18n/ru-RU.js +1 -1
- package/i18n/ru-RU.mjs +1 -1
- package/i18n/sk-SK.js +1 -1
- package/i18n/sk-SK.mjs +1 -1
- package/i18n/sl-SI.js +1 -1
- package/i18n/sl-SI.mjs +1 -1
- package/i18n/sr-SP.js +1 -1
- package/i18n/sr-SP.mjs +1 -1
- package/i18n/sv-SE.js +1 -1
- package/i18n/sv-SE.mjs +1 -1
- package/i18n/tr-TR.js +1 -1
- package/i18n/tr-TR.mjs +1 -1
- package/i18n/uk-UA.js +1 -1
- package/i18n/uk-UA.mjs +1 -1
- package/i18n/zh-CN.js +1 -1
- package/i18n/zh-CN.mjs +1 -1
- package/i18n/zh-TW.js +1 -1
- package/i18n/zh-TW.mjs +1 -1
- package/package.json +32 -31
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import {ButtonContext as $7705c033048f6da7$export$24d547caef80ccd1} from "./Button.mjs";
|
|
2
2
|
import {dom as $7230ffa83bc0c2cf$export$df3a06d6289f983e, Provider as $7230ffa83bc0c2cf$export$2881499e37b75b9a, removeDataAttributes as $7230ffa83bc0c2cf$export$ef03459518577ad4, useContextProps as $7230ffa83bc0c2cf$export$29f1550f4b0d4415, useRenderProps as $7230ffa83bc0c2cf$export$4d86445c2cf5e3, useSlot as $7230ffa83bc0c2cf$export$9d4c57ee4c6ffdd8, useSlottedContext as $7230ffa83bc0c2cf$export$fabf2dc03a41866e} from "./utils.mjs";
|
|
3
3
|
import {FieldErrorContext as $1f3c3b1a70cec653$export$ff05c3ac10437e03} from "./FieldError.mjs";
|
|
4
|
+
import {FieldInputContext as $4b38b5b75ecc6208$export$698f465ec27e93df} from "./Autocomplete.mjs";
|
|
4
5
|
import {FormContext as $cdaed739b1139372$export$c24727297075ec6a} from "./Form.mjs";
|
|
5
6
|
import {GroupContext as $3a442827418ebe87$export$f9c6924e160136d1} from "./Group.mjs";
|
|
6
7
|
import {InputContext as $41fb335299a4a39e$export$37fb8590cf2c088c} from "./Input.mjs";
|
|
@@ -49,6 +50,7 @@ import {useResizeObserver as $er33p$useResizeObserver} from "react-aria/private/
|
|
|
49
50
|
|
|
50
51
|
|
|
51
52
|
|
|
53
|
+
|
|
52
54
|
const $dbdc5e6e7ce01b4b$export$d414ccceff7063c3 = /*#__PURE__*/ (0, $er33p$createContext)(null);
|
|
53
55
|
const $dbdc5e6e7ce01b4b$export$c02625b26074192c = /*#__PURE__*/ (0, $er33p$createContext)(null);
|
|
54
56
|
const $dbdc5e6e7ce01b4b$export$72b9695b8216309a = /*#__PURE__*/ (0, $er33p$createHideableComponent)(function ComboBox(props, ref) {
|
|
@@ -87,6 +89,7 @@ const $dbdc5e6e7ce01b4b$var$CLEAR_CONTEXTS = [
|
|
|
87
89
|
(0, $43a3b93638fe5db9$export$75b6ee27786ba447),
|
|
88
90
|
(0, $7705c033048f6da7$export$24d547caef80ccd1),
|
|
89
91
|
(0, $41fb335299a4a39e$export$37fb8590cf2c088c),
|
|
92
|
+
(0, $4b38b5b75ecc6208$export$698f465ec27e93df),
|
|
90
93
|
(0, $3a442827418ebe87$export$f9c6924e160136d1),
|
|
91
94
|
(0, $efe09c6d1c304b50$export$9afb8bc826b033ea)
|
|
92
95
|
];
|
|
@@ -113,6 +116,7 @@ function $dbdc5e6e7ce01b4b$var$ComboBoxInner({ props: props, collection: collect
|
|
|
113
116
|
let listBoxRef = (0, $er33p$useRef)(null);
|
|
114
117
|
let popoverRef = (0, $er33p$useRef)(null);
|
|
115
118
|
let [labelRef, label] = (0, $7230ffa83bc0c2cf$export$9d4c57ee4c6ffdd8)(!props['aria-label'] && !props['aria-labelledby']);
|
|
119
|
+
let [labelElementType, setLabelElementType] = (0, $er33p$useState)('label');
|
|
116
120
|
let { buttonProps: buttonProps, inputProps: inputProps, listBoxProps: listBoxProps, labelProps: labelProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, valueProps: valueProps, ...validation } = (0, $er33p$useComboBox)({
|
|
117
121
|
...(0, $7230ffa83bc0c2cf$export$ef03459518577ad4)(props),
|
|
118
122
|
label: label,
|
|
@@ -121,7 +125,8 @@ function $dbdc5e6e7ce01b4b$var$ComboBoxInner({ props: props, collection: collect
|
|
|
121
125
|
listBoxRef: listBoxRef,
|
|
122
126
|
popoverRef: popoverRef,
|
|
123
127
|
name: formValue === 'text' ? name : undefined,
|
|
124
|
-
validationBehavior: validationBehavior
|
|
128
|
+
validationBehavior: validationBehavior,
|
|
129
|
+
labelElementType: labelElementType
|
|
125
130
|
}, state);
|
|
126
131
|
// Make menu width match input + button
|
|
127
132
|
// Left for backward compatibility in case a <Group> is not rendered.
|
|
@@ -148,7 +153,8 @@ function $dbdc5e6e7ce01b4b$var$ComboBoxInner({ props: props, collection: collect
|
|
|
148
153
|
get current () {
|
|
149
154
|
return groupRef.current || inputRef.current;
|
|
150
155
|
}
|
|
151
|
-
}),
|
|
156
|
+
}), // oxlint-disable-next-line react/react-compiler
|
|
157
|
+
[
|
|
152
158
|
groupRef,
|
|
153
159
|
inputRef
|
|
154
160
|
]);
|
|
@@ -201,6 +207,7 @@ function $dbdc5e6e7ce01b4b$var$ComboBoxInner({ props: props, collection: collect
|
|
|
201
207
|
(0, $43a3b93638fe5db9$export$75b6ee27786ba447),
|
|
202
208
|
{
|
|
203
209
|
...labelProps,
|
|
210
|
+
elementType: labelElementType,
|
|
204
211
|
ref: labelRef
|
|
205
212
|
}
|
|
206
213
|
],
|
|
@@ -219,6 +226,18 @@ function $dbdc5e6e7ce01b4b$var$ComboBoxInner({ props: props, collection: collect
|
|
|
219
226
|
ref: inputRef
|
|
220
227
|
}
|
|
221
228
|
],
|
|
229
|
+
[
|
|
230
|
+
(0, $4b38b5b75ecc6208$export$698f465ec27e93df),
|
|
231
|
+
{
|
|
232
|
+
...inputProps,
|
|
233
|
+
ref: (0, $er33p$useCallback)((el)=>{
|
|
234
|
+
inputRef.current = el; // TODO: figure out how to fix non-input element types in useComboBox/useTextField
|
|
235
|
+
if (el) setLabelElementType(el.tagName.toLowerCase() === 'input' ? 'label' : 'span');
|
|
236
|
+
}, []),
|
|
237
|
+
value: state.inputValue,
|
|
238
|
+
onChange: (v)=>state.setInputValue(v)
|
|
239
|
+
}
|
|
240
|
+
],
|
|
222
241
|
[
|
|
223
242
|
(0, $f2ff30fde7b014be$export$d2f961adcb0afbe),
|
|
224
243
|
state
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/react-aria-components/src/ComboBox.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 */\nimport {AriaComboBoxProps, useComboBox} from 'react-aria/useComboBox';\n\nimport {ButtonContext} from './Button';\nimport {\n ClassNameOrFunction,\n ContextValue,\n dom,\n Provider,\n RACValidation,\n removeDataAttributes,\n RenderProps,\n SlotProps,\n useContextProps,\n useRenderProps,\n useSlot,\n useSlottedContext\n} from './utils';\nimport {Collection, Node} from '@react-types/shared';\nimport {CollectionBuilder} from 'react-aria/CollectionBuilder';\nimport {ComboBoxState, useComboBoxState} from 'react-stately/useComboBoxState';\nimport {createHideableComponent} from 'react-aria/private/collections/Hidden';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {FormContext} from './Form';\nimport {GlobalDOMAttributes, Key, RefObject} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport {ListBoxContext, ListStateContext} from './ListBox';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport {PopoverContext} from './Popover';\nimport React, {\n createContext,\n ForwardedRef,\n HTMLAttributes,\n ReactElement,\n ReactNode,\n useCallback,\n useContext,\n useMemo,\n useRef,\n useState\n} from 'react';\nimport {TextContext} from './Text';\nimport {useFilter} from 'react-aria/useFilter';\nimport {useListFormatter} from 'react-aria/useListFormatter';\nimport {useResizeObserver} from 'react-aria/private/utils/useResizeObserver';\n\ntype SelectionMode = 'single' | 'multiple';\n\nexport interface ComboBoxRenderProps {\n /**\n * Whether the combobox is currently open.\n *\n * @selector [data-open]\n */\n isOpen: boolean;\n /**\n * Whether the combobox is disabled.\n *\n * @selector [data-disabled]\n */\n isDisabled: boolean;\n /**\n * Whether the combobox is invalid.\n *\n * @selector [data-invalid]\n */\n isInvalid: boolean;\n /**\n * Whether the combobox is required.\n *\n * @selector [data-required]\n */\n isRequired: boolean;\n /**\n * Whether the combobox is read only.\n *\n * @selector [data-readonly]\n */\n isReadOnly: boolean;\n}\n\nexport interface ComboBoxProps<T, M extends SelectionMode = 'single'>\n extends\n Omit<\n AriaComboBoxProps<T, M>,\n | 'children'\n | 'placeholder'\n | 'label'\n | 'description'\n | 'errorMessage'\n | 'validationState'\n | 'validationBehavior'\n >,\n RACValidation,\n RenderProps<ComboBoxRenderProps>,\n SlotProps,\n GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the\n * element. A function may be provided to compute the class based on component state.\n *\n * @default 'react-aria-ComboBox'\n */\n className?: ClassNameOrFunction<ComboBoxRenderProps>;\n /** The filter function used to determine if a option should be included in the combo box list. */\n defaultFilter?: (textValue: string, inputValue: string) => boolean;\n /**\n * Whether the text or key of the selected item is submitted as part of an HTML form. When\n * `allowsCustomValue` is `true`, this option does not apply and the text is always submitted.\n *\n * @default 'key'\n */\n formValue?: 'text' | 'key';\n /** Whether the combo box allows the menu to be open when the collection is empty. */\n allowsEmptyCollection?: boolean;\n}\n\nexport const ComboBoxContext =\n createContext<ContextValue<ComboBoxProps<any, SelectionMode>, HTMLDivElement>>(null);\nexport const ComboBoxStateContext = createContext<ComboBoxState<any, SelectionMode> | null>(null);\n\n/**\n * A combo box combines a text input with a listbox, allowing users to filter a list of options to\n * items matching a query.\n */\nexport const ComboBox = /*#__PURE__*/ createHideableComponent(function ComboBox<\n T,\n M extends SelectionMode = 'single'\n>(props: ComboBoxProps<T, M>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ComboBoxContext);\n let {\n children,\n isDisabled = false,\n isInvalid = false,\n isRequired = false,\n isReadOnly = false\n } = props;\n let content = useMemo(\n () => (\n <ListBoxContext.Provider value={{items: props.items ?? props.defaultItems}}>\n {typeof children === 'function'\n ? children({\n isOpen: false,\n isDisabled,\n isInvalid,\n isRequired,\n defaultChildren: null,\n isReadOnly\n })\n : children}\n </ListBoxContext.Provider>\n ),\n [children, isDisabled, isInvalid, isRequired, isReadOnly, props.items, props.defaultItems]\n );\n\n return (\n <CollectionBuilder content={content}>\n {collection => <ComboBoxInner props={props} collection={collection} comboBoxRef={ref} />}\n </CollectionBuilder>\n );\n});\n\n// Contexts to clear inside the popover.\nconst CLEAR_CONTEXTS = [LabelContext, ButtonContext, InputContext, GroupContext, TextContext];\n\ninterface ComboBoxInnerProps<T> {\n props: ComboBoxProps<T, SelectionMode>;\n collection: Collection<Node<T>>;\n comboBoxRef: RefObject<HTMLDivElement | null>;\n}\n\nfunction ComboBoxInner<T>({props, collection, comboBoxRef: ref}: ComboBoxInnerProps<T>) {\n let {name, formValue = 'key', allowsCustomValue} = props;\n if (allowsCustomValue) {\n formValue = 'text';\n }\n\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let {contains} = useFilter({sensitivity: 'base'});\n let state = useComboBoxState({\n ...props,\n defaultFilter: props.defaultFilter || contains,\n // If props.items isn't provided, rely on collection filtering (aka listbox.items is provided or defaultItems provided to Combobox)\n items: props.items,\n children: undefined,\n collection,\n validationBehavior\n });\n\n let buttonRef = useRef<HTMLButtonElement>(null);\n let inputRef = useRef<HTMLInputElement>(null);\n let groupRef = useRef<HTMLDivElement>(null);\n let listBoxRef = useRef<HTMLDivElement>(null);\n let popoverRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(!props['aria-label'] && !props['aria-labelledby']);\n let {\n buttonProps,\n inputProps,\n listBoxProps,\n labelProps,\n descriptionProps,\n errorMessageProps,\n valueProps,\n ...validation\n } = useComboBox(\n {\n ...removeDataAttributes(props),\n label,\n inputRef,\n buttonRef,\n listBoxRef,\n popoverRef,\n name: formValue === 'text' ? name : undefined,\n validationBehavior\n },\n state\n );\n\n // Make menu width match input + button\n // Left for backward compatibility in case a <Group> is not rendered.\n let [menuWidth, setMenuWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (inputRef.current && !groupRef.current) {\n let buttonRect = buttonRef.current?.getBoundingClientRect();\n let inputRect = inputRef.current.getBoundingClientRect();\n let minX = buttonRect ? Math.min(buttonRect.left, inputRect.left) : inputRect.left;\n let maxX = buttonRect ? Math.max(buttonRect.right, inputRect.right) : inputRect.right;\n setMenuWidth(maxX - minX + 'px');\n }\n }, [buttonRef, inputRef, setMenuWidth]);\n\n useResizeObserver({\n ref: inputRef,\n onResize: onResize\n });\n\n // Position popover relative to group if available, otherwise input.\n let triggerRef = useMemo(\n () => ({\n get current() {\n return groupRef.current || inputRef.current;\n }\n }),\n [groupRef, inputRef]\n );\n\n // Only expose a subset of state to renderProps function to avoid infinite render loop\n let renderPropsState = useMemo(\n () => ({\n isOpen: state.isOpen,\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid || false,\n isRequired: props.isRequired || false,\n isReadOnly: props.isReadOnly || false\n }),\n [state.isOpen, props.isDisabled, validation.isInvalid, props.isRequired, props.isReadOnly]\n );\n\n let renderProps = useRenderProps({\n ...props,\n values: renderPropsState,\n defaultClassName: 'react-aria-ComboBox'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n let inputs: ReactElement[] = [];\n if (name && formValue === 'key') {\n let values: (Key | null)[] = Array.isArray(state.value) ? state.value : [state.value];\n if (values.length === 0) {\n values = [null];\n }\n\n inputs = values.map((value, i) => (\n <input key={i} type=\"hidden\" name={name} form={props.form} value={value ?? ''} />\n ));\n }\n\n return (\n <Provider\n values={[\n [ComboBoxStateContext, state],\n [LabelContext, {...labelProps, ref: labelRef}],\n [ButtonContext, {...buttonProps, ref: buttonRef, isPressed: state.isOpen}],\n [InputContext, {...inputProps, ref: inputRef}],\n [OverlayTriggerStateContext, state],\n [\n PopoverContext,\n {\n ref: popoverRef,\n triggerRef,\n scrollRef: listBoxRef,\n placement: 'bottom start',\n isNonModal: true,\n trigger: 'ComboBox',\n style: {'--trigger-width': menuWidth} as React.CSSProperties,\n clearContexts: CLEAR_CONTEXTS\n }\n ],\n [ListBoxContext, {...listBoxProps, ref: listBoxRef}],\n [ListStateContext, state],\n [\n TextContext,\n {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }\n ],\n [\n GroupContext,\n {ref: groupRef, isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}\n ],\n [FieldErrorContext, validation],\n [ComboBoxValueContext, valueProps]\n ]}>\n <dom.div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focused={state.isFocused || undefined}\n data-open={state.isOpen || undefined}\n data-disabled={props.isDisabled || undefined}\n data-readonly={props.isReadOnly || undefined}\n data-invalid={validation.isInvalid || undefined}\n data-required={props.isRequired || undefined}>\n {renderProps.children}\n {inputs}\n </dom.div>\n </Provider>\n );\n}\n\nexport interface ComboBoxValueRenderProps<T> {\n /**\n * Whether the value is a placeholder.\n *\n * @selector [data-placeholder]\n */\n isPlaceholder: boolean;\n /** The object values of the currently selected items. */\n selectedItems: (T | null)[];\n /** The textValue of the currently selected items. */\n selectedText: string;\n /** The state of the ComboBox. */\n state: ComboBoxState<T, 'single' | 'multiple'>;\n}\n\nexport interface ComboBoxValueProps<T>\n extends\n Omit<HTMLAttributes<HTMLElement>, keyof RenderProps<unknown>>,\n RenderProps<ComboBoxValueRenderProps<T>, 'div'> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the\n * element. A function may be provided to compute the class based on component state.\n *\n * @default 'react-aria-ComboBoxValue'\n */\n className?: ClassNameOrFunction<ComboBoxValueRenderProps<T>>;\n /** A value to display when no items are selected. */\n placeholder?: ReactNode;\n}\n\nexport const ComboBoxValueContext =\n createContext<ContextValue<ComboBoxValueProps<any>, HTMLDivElement>>(null);\n\n/**\n * ComboBoxValue renders the selected values of a ComboBox, or a placeholder if no value is\n * selected. By default, the items are rendered as a comma separated list. Use the render function\n * to customize this.\n */\nexport const ComboBoxValue = /*#__PURE__*/ createHideableComponent(function ComboBoxValue<T>(\n props: ComboBoxValueProps<T>,\n ref: ForwardedRef<HTMLDivElement>\n) {\n [props, ref] = useContextProps(props, ref, ComboBoxValueContext);\n let state = useContext(ComboBoxStateContext)!;\n let formatter = useListFormatter();\n let selectedText = useMemo(\n () =>\n formatter.format(\n state.selectedItems.map(item => item?.textValue || '').filter(v => v !== '')\n ),\n [formatter, state.selectedItems]\n );\n\n let renderProps = useRenderProps({\n ...props,\n defaultChildren: selectedText || props.placeholder,\n defaultClassName: 'react-aria-ComboBoxValue',\n values: {\n selectedItems: useMemo(\n () => state.selectedItems.map(item => (item.value as T) ?? null),\n [state.selectedItems]\n ),\n selectedText,\n isPlaceholder: state.selectedItems.length === 0,\n state\n }\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <dom.div\n ref={ref}\n {...DOMProps}\n {...renderProps}\n data-placeholder={state.selectedItems.length === 0 || undefined}\n />\n );\n});\n"],"names":[],"version":3,"file":"ComboBox.mjs.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/react-aria-components/src/ComboBox.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 */\nimport {AriaComboBoxProps, useComboBox} from 'react-aria/useComboBox';\n\nimport {ButtonContext} from './Button';\nimport {\n ClassNameOrFunction,\n ContextValue,\n dom,\n Provider,\n RACValidation,\n removeDataAttributes,\n RenderProps,\n SlotProps,\n useContextProps,\n useRenderProps,\n useSlot,\n useSlottedContext\n} from './utils';\nimport {Collection, FocusableElement, Node} from '@react-types/shared';\nimport {CollectionBuilder} from 'react-aria/CollectionBuilder';\nimport {ComboBoxState, useComboBoxState} from 'react-stately/useComboBoxState';\nimport {createHideableComponent} from 'react-aria/private/collections/Hidden';\nimport {FieldErrorContext} from './FieldError';\nimport {FieldInputContext} from './Autocomplete';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {FormContext} from './Form';\nimport {GlobalDOMAttributes, Key, RefObject} from '@react-types/shared';\nimport {GroupContext} from './Group';\nimport {InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport {ListBoxContext, ListStateContext} from './ListBox';\nimport {OverlayTriggerStateContext} from './Dialog';\nimport {PopoverContext} from './Popover';\nimport React, {\n createContext,\n ForwardedRef,\n HTMLAttributes,\n ReactElement,\n ReactNode,\n useCallback,\n useContext,\n useMemo,\n useRef,\n useState\n} from 'react';\nimport {TextContext} from './Text';\nimport {useFilter} from 'react-aria/useFilter';\nimport {useListFormatter} from 'react-aria/useListFormatter';\nimport {useResizeObserver} from 'react-aria/private/utils/useResizeObserver';\n\ntype SelectionMode = 'single' | 'multiple';\n\nexport interface ComboBoxRenderProps {\n /**\n * Whether the combobox is currently open.\n *\n * @selector [data-open]\n */\n isOpen: boolean;\n /**\n * Whether the combobox is disabled.\n *\n * @selector [data-disabled]\n */\n isDisabled: boolean;\n /**\n * Whether the combobox is invalid.\n *\n * @selector [data-invalid]\n */\n isInvalid: boolean;\n /**\n * Whether the combobox is required.\n *\n * @selector [data-required]\n */\n isRequired: boolean;\n /**\n * Whether the combobox is read only.\n *\n * @selector [data-readonly]\n */\n isReadOnly: boolean;\n}\n\nexport interface ComboBoxProps<T, M extends SelectionMode = 'single'>\n extends\n Omit<\n AriaComboBoxProps<T, M>,\n | 'children'\n | 'placeholder'\n | 'label'\n | 'description'\n | 'errorMessage'\n | 'validationState'\n | 'validationBehavior'\n >,\n RACValidation,\n RenderProps<ComboBoxRenderProps>,\n SlotProps,\n GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the\n * element. A function may be provided to compute the class based on component state.\n *\n * @default 'react-aria-ComboBox'\n */\n className?: ClassNameOrFunction<ComboBoxRenderProps>;\n /**\n * The filter function used to determine if an option should be included in the combo box list.\n * By default, a language-sensitive \"contains\" filter from `useFilter` is used.\n */\n defaultFilter?: (textValue: string, inputValue: string) => boolean;\n /**\n * Whether the text or key of the selected item is submitted as part of an HTML form. When\n * `allowsCustomValue` is `true`, this option does not apply and the text is always submitted.\n *\n * @default 'key'\n */\n formValue?: 'text' | 'key';\n /** Whether the combo box allows the menu to be open when the collection is empty. */\n allowsEmptyCollection?: boolean;\n}\n\nexport const ComboBoxContext =\n createContext<ContextValue<ComboBoxProps<any, SelectionMode>, HTMLDivElement>>(null);\nexport const ComboBoxStateContext = createContext<ComboBoxState<any, SelectionMode> | null>(null);\n\n/**\n * A combo box combines a text input with a listbox, allowing users to filter a list of options to\n * items matching a query.\n */\nexport const ComboBox = /*#__PURE__*/ createHideableComponent(function ComboBox<\n T,\n M extends SelectionMode = 'single'\n>(props: ComboBoxProps<T, M>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ComboBoxContext);\n let {\n children,\n isDisabled = false,\n isInvalid = false,\n isRequired = false,\n isReadOnly = false\n } = props;\n let content = useMemo(\n () => (\n <ListBoxContext.Provider value={{items: props.items ?? props.defaultItems}}>\n {typeof children === 'function'\n ? children({\n isOpen: false,\n isDisabled,\n isInvalid,\n isRequired,\n defaultChildren: null,\n isReadOnly\n })\n : children}\n </ListBoxContext.Provider>\n ),\n [children, isDisabled, isInvalid, isRequired, isReadOnly, props.items, props.defaultItems]\n );\n\n return (\n <CollectionBuilder content={content}>\n {collection => <ComboBoxInner props={props} collection={collection} comboBoxRef={ref} />}\n </CollectionBuilder>\n );\n});\n\n// Contexts to clear inside the popover.\nconst CLEAR_CONTEXTS = [\n LabelContext,\n ButtonContext,\n InputContext,\n FieldInputContext,\n GroupContext,\n TextContext\n];\n\ninterface ComboBoxInnerProps<T> {\n props: ComboBoxProps<T, SelectionMode>;\n collection: Collection<Node<T>>;\n comboBoxRef: RefObject<HTMLDivElement | null>;\n}\n\nfunction ComboBoxInner<T>({props, collection, comboBoxRef: ref}: ComboBoxInnerProps<T>) {\n let {name, formValue = 'key', allowsCustomValue} = props;\n if (allowsCustomValue) {\n formValue = 'text';\n }\n\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let {contains} = useFilter({sensitivity: 'base'});\n let state = useComboBoxState({\n ...props,\n defaultFilter: props.defaultFilter || contains,\n // If props.items isn't provided, rely on collection filtering (aka listbox.items is provided or defaultItems provided to Combobox)\n items: props.items,\n children: undefined,\n collection,\n validationBehavior\n });\n\n let buttonRef = useRef<HTMLButtonElement>(null);\n let inputRef = useRef<HTMLInputElement>(null);\n let groupRef = useRef<HTMLDivElement>(null);\n let listBoxRef = useRef<HTMLDivElement>(null);\n let popoverRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(!props['aria-label'] && !props['aria-labelledby']);\n let [labelElementType, setLabelElementType] = useState<'span' | 'label'>('label');\n\n let {\n buttonProps,\n inputProps,\n listBoxProps,\n labelProps,\n descriptionProps,\n errorMessageProps,\n valueProps,\n ...validation\n } = useComboBox(\n {\n ...removeDataAttributes(props),\n label,\n inputRef,\n buttonRef,\n listBoxRef,\n popoverRef,\n name: formValue === 'text' ? name : undefined,\n validationBehavior,\n labelElementType\n },\n state\n );\n\n // Make menu width match input + button\n // Left for backward compatibility in case a <Group> is not rendered.\n let [menuWidth, setMenuWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (inputRef.current && !groupRef.current) {\n let buttonRect = buttonRef.current?.getBoundingClientRect();\n let inputRect = inputRef.current.getBoundingClientRect();\n let minX = buttonRect ? Math.min(buttonRect.left, inputRect.left) : inputRect.left;\n let maxX = buttonRect ? Math.max(buttonRect.right, inputRect.right) : inputRect.right;\n setMenuWidth(maxX - minX + 'px');\n }\n }, [buttonRef, inputRef, setMenuWidth]);\n\n useResizeObserver({\n ref: inputRef,\n onResize: onResize\n });\n\n // Position popover relative to group if available, otherwise input.\n let triggerRef = useMemo(\n () => ({\n get current() {\n return groupRef.current || inputRef.current;\n }\n }),\n // oxlint-disable-next-line react/react-compiler\n [groupRef, inputRef]\n );\n\n // Only expose a subset of state to renderProps function to avoid infinite render loop\n let renderPropsState = useMemo(\n () => ({\n isOpen: state.isOpen,\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid || false,\n isRequired: props.isRequired || false,\n isReadOnly: props.isReadOnly || false\n }),\n [state.isOpen, props.isDisabled, validation.isInvalid, props.isRequired, props.isReadOnly]\n );\n\n let renderProps = useRenderProps({\n ...props,\n values: renderPropsState,\n defaultClassName: 'react-aria-ComboBox'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n let inputs: ReactElement[] = [];\n if (name && formValue === 'key') {\n let values: (Key | null)[] = Array.isArray(state.value) ? state.value : [state.value];\n if (values.length === 0) {\n values = [null];\n }\n\n inputs = values.map((value, i) => (\n <input key={i} type=\"hidden\" name={name} form={props.form} value={value ?? ''} />\n ));\n }\n\n return (\n <Provider\n values={[\n [ComboBoxStateContext, state],\n [LabelContext, {...labelProps, elementType: labelElementType, ref: labelRef}],\n [ButtonContext, {...buttonProps, ref: buttonRef, isPressed: state.isOpen}],\n [InputContext, {...inputProps, ref: inputRef}],\n [\n FieldInputContext,\n {\n ...inputProps,\n ref: useCallback((el: FocusableElement) => {\n inputRef.current = el as HTMLInputElement; // TODO: figure out how to fix non-input element types in useComboBox/useTextField\n if (el) {\n setLabelElementType(el.tagName.toLowerCase() === 'input' ? 'label' : 'span');\n }\n }, []),\n value: state.inputValue,\n onChange: v => state.setInputValue(v as string)\n } as any\n ],\n [OverlayTriggerStateContext, state],\n [\n PopoverContext,\n {\n ref: popoverRef,\n triggerRef,\n scrollRef: listBoxRef,\n placement: 'bottom start',\n isNonModal: true,\n trigger: 'ComboBox',\n style: {'--trigger-width': menuWidth} as React.CSSProperties,\n clearContexts: CLEAR_CONTEXTS\n }\n ],\n [ListBoxContext, {...listBoxProps, ref: listBoxRef}],\n [ListStateContext, state],\n [\n TextContext,\n {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }\n ],\n [\n GroupContext,\n {ref: groupRef, isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}\n ],\n [FieldErrorContext, validation],\n [ComboBoxValueContext, valueProps]\n ]}>\n <dom.div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-focused={state.isFocused || undefined}\n data-open={state.isOpen || undefined}\n data-disabled={props.isDisabled || undefined}\n data-readonly={props.isReadOnly || undefined}\n data-invalid={validation.isInvalid || undefined}\n data-required={props.isRequired || undefined}>\n {renderProps.children}\n {inputs}\n </dom.div>\n </Provider>\n );\n}\n\nexport interface ComboBoxValueRenderProps<T> {\n /**\n * Whether the value is a placeholder.\n *\n * @selector [data-placeholder]\n */\n isPlaceholder: boolean;\n /** The object values of the currently selected items. */\n selectedItems: (T | null)[];\n /** The textValue of the currently selected items. */\n selectedText: string;\n /** The state of the ComboBox. */\n state: ComboBoxState<T, 'single' | 'multiple'>;\n}\n\nexport interface ComboBoxValueProps<T>\n extends\n Omit<HTMLAttributes<HTMLElement>, keyof RenderProps<unknown>>,\n RenderProps<ComboBoxValueRenderProps<T>, 'div'> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the\n * element. A function may be provided to compute the class based on component state.\n *\n * @default 'react-aria-ComboBoxValue'\n */\n className?: ClassNameOrFunction<ComboBoxValueRenderProps<T>>;\n /** A value to display when no items are selected. */\n placeholder?: ReactNode;\n}\n\nexport const ComboBoxValueContext =\n createContext<ContextValue<ComboBoxValueProps<any>, HTMLDivElement>>(null);\n\n/**\n * ComboBoxValue renders the selected values of a ComboBox, or a placeholder if no value is\n * selected. By default, the items are rendered as a comma separated list. Use the render function\n * to customize this.\n */\nexport const ComboBoxValue = /*#__PURE__*/ createHideableComponent(function ComboBoxValue<T>(\n props: ComboBoxValueProps<T>,\n ref: ForwardedRef<HTMLDivElement>\n) {\n [props, ref] = useContextProps(props, ref, ComboBoxValueContext);\n let state = useContext(ComboBoxStateContext)!;\n let formatter = useListFormatter();\n let selectedText = useMemo(\n () =>\n formatter.format(\n state.selectedItems.map(item => item?.textValue || '').filter(v => v !== '')\n ),\n [formatter, state.selectedItems]\n );\n\n let renderProps = useRenderProps({\n ...props,\n defaultChildren: selectedText || props.placeholder,\n defaultClassName: 'react-aria-ComboBoxValue',\n values: {\n selectedItems: useMemo(\n () => state.selectedItems.map(item => (item.value as T) ?? null),\n [state.selectedItems]\n ),\n selectedText,\n isPlaceholder: state.selectedItems.length === 0,\n state\n }\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <dom.div\n ref={ref}\n {...DOMProps}\n {...renderProps}\n data-placeholder={state.selectedItems.length === 0 || undefined}\n />\n );\n});\n"],"names":[],"version":3,"file":"ComboBox.mjs.map"}
|
package/dist/private/Dialog.cjs
CHANGED
|
@@ -3,6 +3,7 @@ var $048d76b84370f141$exports = require("./utils.cjs");
|
|
|
3
3
|
var $03e8b4fd5e44cde9$exports = require("./Heading.cjs");
|
|
4
4
|
var $74e35a768d38d46b$exports = require("./Popover.cjs");
|
|
5
5
|
var $76f9e98b4261ab43$exports = require("./Menu.cjs");
|
|
6
|
+
var $cab7d9a238d19c33$exports = require("./Text.cjs");
|
|
6
7
|
var $kcsOx$reactariauseDialog = require("react-aria/useDialog");
|
|
7
8
|
var $kcsOx$reactariafilterDOMProps = require("react-aria/filterDOMProps");
|
|
8
9
|
var $kcsOx$reactariamergeProps = require("react-aria/mergeProps");
|
|
@@ -48,6 +49,7 @@ $parcel$export(module.exports, "Dialog", function () { return $88595bf043e542ec$
|
|
|
48
49
|
|
|
49
50
|
|
|
50
51
|
|
|
52
|
+
|
|
51
53
|
const $88595bf043e542ec$export$8b93a07348a7730c = /*#__PURE__*/ (0, $kcsOx$react.createContext)(null);
|
|
52
54
|
const $88595bf043e542ec$export$d2f961adcb0afbe = /*#__PURE__*/ (0, $kcsOx$react.createContext)(null);
|
|
53
55
|
function $88595bf043e542ec$export$2e1e1122cf0cba88(props) {
|
|
@@ -62,7 +64,9 @@ function $88595bf043e542ec$export$2e1e1122cf0cba88(props) {
|
|
|
62
64
|
// This is done in RAC instead of hooks because otherwise we cannot distinguish
|
|
63
65
|
// between context and props. Normally aria-labelledby overrides the title
|
|
64
66
|
// but when sent by context we want the title to win.
|
|
67
|
+
// oxlint-disable-next-line react/react-compiler
|
|
65
68
|
triggerProps.id = (0, $kcsOx$reactariauseId.useId)();
|
|
69
|
+
// oxlint-disable-next-line react/react-compiler
|
|
66
70
|
overlayProps['aria-labelledby'] = triggerProps.id;
|
|
67
71
|
return /*#__PURE__*/ (0, ($parcel$interopDefault($kcsOx$react))).createElement((0, $048d76b84370f141$exports.Provider), {
|
|
68
72
|
values: [
|
|
@@ -83,6 +87,7 @@ function $88595bf043e542ec$export$2e1e1122cf0cba88(props) {
|
|
|
83
87
|
{
|
|
84
88
|
trigger: 'DialogTrigger',
|
|
85
89
|
triggerRef: buttonRef,
|
|
90
|
+
id: overlayProps.id,
|
|
86
91
|
'aria-labelledby': overlayProps['aria-labelledby']
|
|
87
92
|
}
|
|
88
93
|
]
|
|
@@ -96,7 +101,7 @@ function $88595bf043e542ec$export$2e1e1122cf0cba88(props) {
|
|
|
96
101
|
const $88595bf043e542ec$export$3ddf2d174ce01153 = /*#__PURE__*/ (0, $kcsOx$react.forwardRef)(function Dialog(props, ref) {
|
|
97
102
|
let originalAriaLabelledby = props['aria-labelledby'];
|
|
98
103
|
[props, ref] = (0, $048d76b84370f141$exports.useContextProps)(props, ref, $88595bf043e542ec$export$8b93a07348a7730c);
|
|
99
|
-
let { dialogProps: dialogProps, titleProps: titleProps } = (0, $kcsOx$reactariauseDialog.useDialog)({
|
|
104
|
+
let { dialogProps: dialogProps, titleProps: titleProps, contentProps: contentProps } = (0, $kcsOx$reactariauseDialog.useDialog)({
|
|
100
105
|
...props,
|
|
101
106
|
// Only pass aria-labelledby from props, not context.
|
|
102
107
|
// Context is used as a fallback below.
|
|
@@ -140,6 +145,15 @@ const $88595bf043e542ec$export$3ddf2d174ce01153 = /*#__PURE__*/ (0, $kcsOx$react
|
|
|
140
145
|
}
|
|
141
146
|
}
|
|
142
147
|
],
|
|
148
|
+
[
|
|
149
|
+
(0, $cab7d9a238d19c33$exports.TextContext),
|
|
150
|
+
{
|
|
151
|
+
slots: {
|
|
152
|
+
[(0, $048d76b84370f141$exports.DEFAULT_SLOT)]: {},
|
|
153
|
+
description: contentProps
|
|
154
|
+
}
|
|
155
|
+
}
|
|
156
|
+
],
|
|
143
157
|
[
|
|
144
158
|
(0, $16c7f9b22cce3838$exports.ButtonContext),
|
|
145
159
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"
|
|
1
|
+
{"mappings":"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","sources":["packages/react-aria-components/src/Dialog.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 */\nimport {AriaDialogProps, useDialog} from 'react-aria/useDialog';\n\nimport {ButtonContext} from './Button';\nimport {\n ContextValue,\n DEFAULT_SLOT,\n dom,\n DOMRenderProps,\n Provider,\n SlotProps,\n StyleProps,\n useContextProps,\n useRenderProps\n} from './utils';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {forwardRefType, GlobalDOMAttributes} from '@react-types/shared';\nimport {HeadingContext} from './Heading';\nimport {mergeProps} from 'react-aria/mergeProps';\nimport {OverlayTriggerProps, OverlayTriggerState} from 'react-stately/useOverlayTriggerState';\nimport {PopoverContext} from './Popover';\nimport {PressResponder} from 'react-aria/private/interactions/PressResponder';\nimport React, {\n createContext,\n ForwardedRef,\n forwardRef,\n JSX,\n ReactNode,\n useContext,\n useRef\n} from 'react';\nimport {RootMenuTriggerStateContext} from './Menu';\nimport {TextContext} from './Text';\nimport {useId} from 'react-aria/useId';\nimport {useMenuTriggerState} from 'react-stately/useMenuTriggerState';\nimport {useOverlayTrigger} from 'react-aria/useOverlayTrigger';\n\nexport interface DialogTriggerProps extends OverlayTriggerProps {\n children: ReactNode;\n}\n\nexport interface DialogRenderProps {\n close: () => void;\n}\n\nexport interface DialogProps\n extends\n AriaDialogProps,\n StyleProps,\n SlotProps,\n DOMRenderProps<'section', undefined>,\n GlobalDOMAttributes<HTMLElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the\n * element.\n *\n * @default 'react-aria-Dialog'\n */\n className?: string;\n /** Children of the dialog. A function may be provided to access a function to close the dialog. */\n children?: ReactNode | ((opts: DialogRenderProps) => ReactNode);\n}\n\nexport const DialogContext = createContext<ContextValue<DialogProps, HTMLElement>>(null);\nexport const OverlayTriggerStateContext = createContext<OverlayTriggerState | null>(null);\n\n/**\n * A DialogTrigger opens a dialog when a trigger element is pressed.\n */\nexport function DialogTrigger(props: DialogTriggerProps): JSX.Element {\n // Use useMenuTriggerState instead of useOverlayTriggerState in case a menu is embedded in the dialog.\n // This is needed to handle submenus.\n let state = useMenuTriggerState(props);\n\n let buttonRef = useRef<HTMLButtonElement>(null);\n let {triggerProps, overlayProps} = useOverlayTrigger({type: 'dialog'}, state, buttonRef);\n\n // Label dialog by the trigger as a fallback if there is no title slot.\n // This is done in RAC instead of hooks because otherwise we cannot distinguish\n // between context and props. Normally aria-labelledby overrides the title\n // but when sent by context we want the title to win.\n // oxlint-disable-next-line react/react-compiler\n triggerProps.id = useId();\n // oxlint-disable-next-line react/react-compiler\n overlayProps['aria-labelledby'] = triggerProps.id;\n\n return (\n <Provider\n values={[\n [OverlayTriggerStateContext, state],\n [RootMenuTriggerStateContext, state],\n [DialogContext, overlayProps],\n [\n PopoverContext,\n {\n trigger: 'DialogTrigger',\n triggerRef: buttonRef,\n id: overlayProps.id,\n 'aria-labelledby': overlayProps['aria-labelledby']\n }\n ]\n ]}>\n <PressResponder {...triggerProps} ref={buttonRef} isPressed={state.isOpen}>\n {props.children}\n </PressResponder>\n </Provider>\n );\n}\n\n/**\n * A dialog is an overlay shown above other content in an application.\n */\nexport const Dialog = /*#__PURE__*/ (forwardRef as forwardRefType)(function Dialog(\n props: DialogProps,\n ref: ForwardedRef<HTMLElement>\n) {\n let originalAriaLabelledby = props['aria-labelledby'];\n [props, ref] = useContextProps(props, ref, DialogContext);\n let {dialogProps, titleProps, contentProps} = useDialog(\n {\n ...props,\n // Only pass aria-labelledby from props, not context.\n // Context is used as a fallback below.\n 'aria-labelledby': originalAriaLabelledby\n },\n ref\n );\n let state = useContext(OverlayTriggerStateContext);\n\n if (!dialogProps['aria-label'] && !dialogProps['aria-labelledby']) {\n // If aria-labelledby exists on props, we know it came from context.\n // Use that as a fallback in case there is no title slot.\n if (props['aria-labelledby']) {\n dialogProps['aria-labelledby'] = props['aria-labelledby'];\n } else if (process.env.NODE_ENV !== 'production') {\n console.warn(\n 'If a Dialog does not contain a <Heading slot=\"title\">, it must have an aria-label or aria-labelledby attribute for accessibility.'\n );\n }\n }\n\n let renderProps = useRenderProps({\n defaultClassName: 'react-aria-Dialog',\n className: props.className,\n style: props.style,\n children: props.children,\n values: {\n close: state?.close || (() => {})\n }\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <dom.section\n {...mergeProps(DOMProps, renderProps, dialogProps)}\n render={props.render}\n ref={ref}\n slot={props.slot || undefined}>\n <Provider\n values={[\n [\n HeadingContext,\n {\n slots: {\n [DEFAULT_SLOT]: {},\n title: {...titleProps, level: 2}\n }\n }\n ],\n [\n TextContext,\n {\n slots: {\n [DEFAULT_SLOT]: {},\n description: contentProps\n }\n }\n ],\n [\n ButtonContext,\n {\n slots: {\n [DEFAULT_SLOT]: {},\n close: {\n onPress: () => state?.close()\n }\n }\n }\n ]\n ]}>\n {renderProps.children}\n </Provider>\n </dom.section>\n );\n});\n"],"names":[],"version":3,"file":"Dialog.cjs.map"}
|
package/dist/private/Dialog.js
CHANGED
|
@@ -3,6 +3,7 @@ import {DEFAULT_SLOT as $b7b7a92703138c9b$export$c62b8e45d58ddad9, dom as $b7b7a
|
|
|
3
3
|
import {HeadingContext as $cd487658cd83358d$export$d688439359537581} from "./Heading.js";
|
|
4
4
|
import {PopoverContext as $03df2f2d3cffb62f$export$9b9a0cd73afb7ca4} from "./Popover.js";
|
|
5
5
|
import {RootMenuTriggerStateContext as $113aa0613e727c6c$export$795aec4671cbae19} from "./Menu.js";
|
|
6
|
+
import {TextContext as $20d769b1e2b13352$export$9afb8bc826b033ea} from "./Text.js";
|
|
6
7
|
import {useDialog as $bX1PO$useDialog} from "react-aria/useDialog";
|
|
7
8
|
import {filterDOMProps as $bX1PO$filterDOMProps} from "react-aria/filterDOMProps";
|
|
8
9
|
import {mergeProps as $bX1PO$mergeProps} from "react-aria/mergeProps";
|
|
@@ -35,6 +36,7 @@ import {useOverlayTrigger as $bX1PO$useOverlayTrigger} from "react-aria/useOverl
|
|
|
35
36
|
|
|
36
37
|
|
|
37
38
|
|
|
39
|
+
|
|
38
40
|
const $acf8e70c2f419f18$export$8b93a07348a7730c = /*#__PURE__*/ (0, $bX1PO$createContext)(null);
|
|
39
41
|
const $acf8e70c2f419f18$export$d2f961adcb0afbe = /*#__PURE__*/ (0, $bX1PO$createContext)(null);
|
|
40
42
|
function $acf8e70c2f419f18$export$2e1e1122cf0cba88(props) {
|
|
@@ -49,7 +51,9 @@ function $acf8e70c2f419f18$export$2e1e1122cf0cba88(props) {
|
|
|
49
51
|
// This is done in RAC instead of hooks because otherwise we cannot distinguish
|
|
50
52
|
// between context and props. Normally aria-labelledby overrides the title
|
|
51
53
|
// but when sent by context we want the title to win.
|
|
54
|
+
// oxlint-disable-next-line react/react-compiler
|
|
52
55
|
triggerProps.id = (0, $bX1PO$useId)();
|
|
56
|
+
// oxlint-disable-next-line react/react-compiler
|
|
53
57
|
overlayProps['aria-labelledby'] = triggerProps.id;
|
|
54
58
|
return /*#__PURE__*/ (0, $bX1PO$react).createElement((0, $b7b7a92703138c9b$export$2881499e37b75b9a), {
|
|
55
59
|
values: [
|
|
@@ -70,6 +74,7 @@ function $acf8e70c2f419f18$export$2e1e1122cf0cba88(props) {
|
|
|
70
74
|
{
|
|
71
75
|
trigger: 'DialogTrigger',
|
|
72
76
|
triggerRef: buttonRef,
|
|
77
|
+
id: overlayProps.id,
|
|
73
78
|
'aria-labelledby': overlayProps['aria-labelledby']
|
|
74
79
|
}
|
|
75
80
|
]
|
|
@@ -83,7 +88,7 @@ function $acf8e70c2f419f18$export$2e1e1122cf0cba88(props) {
|
|
|
83
88
|
const $acf8e70c2f419f18$export$3ddf2d174ce01153 = /*#__PURE__*/ (0, $bX1PO$forwardRef)(function Dialog(props, ref) {
|
|
84
89
|
let originalAriaLabelledby = props['aria-labelledby'];
|
|
85
90
|
[props, ref] = (0, $b7b7a92703138c9b$export$29f1550f4b0d4415)(props, ref, $acf8e70c2f419f18$export$8b93a07348a7730c);
|
|
86
|
-
let { dialogProps: dialogProps, titleProps: titleProps } = (0, $bX1PO$useDialog)({
|
|
91
|
+
let { dialogProps: dialogProps, titleProps: titleProps, contentProps: contentProps } = (0, $bX1PO$useDialog)({
|
|
87
92
|
...props,
|
|
88
93
|
// Only pass aria-labelledby from props, not context.
|
|
89
94
|
// Context is used as a fallback below.
|
|
@@ -127,6 +132,15 @@ const $acf8e70c2f419f18$export$3ddf2d174ce01153 = /*#__PURE__*/ (0, $bX1PO$forwa
|
|
|
127
132
|
}
|
|
128
133
|
}
|
|
129
134
|
],
|
|
135
|
+
[
|
|
136
|
+
(0, $20d769b1e2b13352$export$9afb8bc826b033ea),
|
|
137
|
+
{
|
|
138
|
+
slots: {
|
|
139
|
+
[(0, $b7b7a92703138c9b$export$c62b8e45d58ddad9)]: {},
|
|
140
|
+
description: contentProps
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
],
|
|
130
144
|
[
|
|
131
145
|
(0, $fc203795b9b363cd$export$24d547caef80ccd1),
|
|
132
146
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"
|
|
1
|
+
{"mappings":"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","sources":["packages/react-aria-components/src/Dialog.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 */\nimport {AriaDialogProps, useDialog} from 'react-aria/useDialog';\n\nimport {ButtonContext} from './Button';\nimport {\n ContextValue,\n DEFAULT_SLOT,\n dom,\n DOMRenderProps,\n Provider,\n SlotProps,\n StyleProps,\n useContextProps,\n useRenderProps\n} from './utils';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {forwardRefType, GlobalDOMAttributes} from '@react-types/shared';\nimport {HeadingContext} from './Heading';\nimport {mergeProps} from 'react-aria/mergeProps';\nimport {OverlayTriggerProps, OverlayTriggerState} from 'react-stately/useOverlayTriggerState';\nimport {PopoverContext} from './Popover';\nimport {PressResponder} from 'react-aria/private/interactions/PressResponder';\nimport React, {\n createContext,\n ForwardedRef,\n forwardRef,\n JSX,\n ReactNode,\n useContext,\n useRef\n} from 'react';\nimport {RootMenuTriggerStateContext} from './Menu';\nimport {TextContext} from './Text';\nimport {useId} from 'react-aria/useId';\nimport {useMenuTriggerState} from 'react-stately/useMenuTriggerState';\nimport {useOverlayTrigger} from 'react-aria/useOverlayTrigger';\n\nexport interface DialogTriggerProps extends OverlayTriggerProps {\n children: ReactNode;\n}\n\nexport interface DialogRenderProps {\n close: () => void;\n}\n\nexport interface DialogProps\n extends\n AriaDialogProps,\n StyleProps,\n SlotProps,\n DOMRenderProps<'section', undefined>,\n GlobalDOMAttributes<HTMLElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the\n * element.\n *\n * @default 'react-aria-Dialog'\n */\n className?: string;\n /** Children of the dialog. A function may be provided to access a function to close the dialog. */\n children?: ReactNode | ((opts: DialogRenderProps) => ReactNode);\n}\n\nexport const DialogContext = createContext<ContextValue<DialogProps, HTMLElement>>(null);\nexport const OverlayTriggerStateContext = createContext<OverlayTriggerState | null>(null);\n\n/**\n * A DialogTrigger opens a dialog when a trigger element is pressed.\n */\nexport function DialogTrigger(props: DialogTriggerProps): JSX.Element {\n // Use useMenuTriggerState instead of useOverlayTriggerState in case a menu is embedded in the dialog.\n // This is needed to handle submenus.\n let state = useMenuTriggerState(props);\n\n let buttonRef = useRef<HTMLButtonElement>(null);\n let {triggerProps, overlayProps} = useOverlayTrigger({type: 'dialog'}, state, buttonRef);\n\n // Label dialog by the trigger as a fallback if there is no title slot.\n // This is done in RAC instead of hooks because otherwise we cannot distinguish\n // between context and props. Normally aria-labelledby overrides the title\n // but when sent by context we want the title to win.\n // oxlint-disable-next-line react/react-compiler\n triggerProps.id = useId();\n // oxlint-disable-next-line react/react-compiler\n overlayProps['aria-labelledby'] = triggerProps.id;\n\n return (\n <Provider\n values={[\n [OverlayTriggerStateContext, state],\n [RootMenuTriggerStateContext, state],\n [DialogContext, overlayProps],\n [\n PopoverContext,\n {\n trigger: 'DialogTrigger',\n triggerRef: buttonRef,\n id: overlayProps.id,\n 'aria-labelledby': overlayProps['aria-labelledby']\n }\n ]\n ]}>\n <PressResponder {...triggerProps} ref={buttonRef} isPressed={state.isOpen}>\n {props.children}\n </PressResponder>\n </Provider>\n );\n}\n\n/**\n * A dialog is an overlay shown above other content in an application.\n */\nexport const Dialog = /*#__PURE__*/ (forwardRef as forwardRefType)(function Dialog(\n props: DialogProps,\n ref: ForwardedRef<HTMLElement>\n) {\n let originalAriaLabelledby = props['aria-labelledby'];\n [props, ref] = useContextProps(props, ref, DialogContext);\n let {dialogProps, titleProps, contentProps} = useDialog(\n {\n ...props,\n // Only pass aria-labelledby from props, not context.\n // Context is used as a fallback below.\n 'aria-labelledby': originalAriaLabelledby\n },\n ref\n );\n let state = useContext(OverlayTriggerStateContext);\n\n if (!dialogProps['aria-label'] && !dialogProps['aria-labelledby']) {\n // If aria-labelledby exists on props, we know it came from context.\n // Use that as a fallback in case there is no title slot.\n if (props['aria-labelledby']) {\n dialogProps['aria-labelledby'] = props['aria-labelledby'];\n } else if (process.env.NODE_ENV !== 'production') {\n console.warn(\n 'If a Dialog does not contain a <Heading slot=\"title\">, it must have an aria-label or aria-labelledby attribute for accessibility.'\n );\n }\n }\n\n let renderProps = useRenderProps({\n defaultClassName: 'react-aria-Dialog',\n className: props.className,\n style: props.style,\n children: props.children,\n values: {\n close: state?.close || (() => {})\n }\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <dom.section\n {...mergeProps(DOMProps, renderProps, dialogProps)}\n render={props.render}\n ref={ref}\n slot={props.slot || undefined}>\n <Provider\n values={[\n [\n HeadingContext,\n {\n slots: {\n [DEFAULT_SLOT]: {},\n title: {...titleProps, level: 2}\n }\n }\n ],\n [\n TextContext,\n {\n slots: {\n [DEFAULT_SLOT]: {},\n description: contentProps\n }\n }\n ],\n [\n ButtonContext,\n {\n slots: {\n [DEFAULT_SLOT]: {},\n close: {\n onPress: () => state?.close()\n }\n }\n }\n ]\n ]}>\n {renderProps.children}\n </Provider>\n </dom.section>\n );\n});\n"],"names":[],"version":3,"file":"Dialog.js.map"}
|
package/dist/private/Dialog.mjs
CHANGED
|
@@ -3,6 +3,7 @@ import {DEFAULT_SLOT as $7230ffa83bc0c2cf$export$c62b8e45d58ddad9, dom as $7230f
|
|
|
3
3
|
import {HeadingContext as $2ec61d1d4f780267$export$d688439359537581} from "./Heading.mjs";
|
|
4
4
|
import {PopoverContext as $542a13ca2fa5b484$export$9b9a0cd73afb7ca4} from "./Popover.mjs";
|
|
5
5
|
import {RootMenuTriggerStateContext as $49319ee1285aa241$export$795aec4671cbae19} from "./Menu.mjs";
|
|
6
|
+
import {TextContext as $efe09c6d1c304b50$export$9afb8bc826b033ea} from "./Text.mjs";
|
|
6
7
|
import {useDialog as $gV8PY$useDialog} from "react-aria/useDialog";
|
|
7
8
|
import {filterDOMProps as $gV8PY$filterDOMProps} from "react-aria/filterDOMProps";
|
|
8
9
|
import {mergeProps as $gV8PY$mergeProps} from "react-aria/mergeProps";
|
|
@@ -35,6 +36,7 @@ import {useOverlayTrigger as $gV8PY$useOverlayTrigger} from "react-aria/useOverl
|
|
|
35
36
|
|
|
36
37
|
|
|
37
38
|
|
|
39
|
+
|
|
38
40
|
const $f2ff30fde7b014be$export$8b93a07348a7730c = /*#__PURE__*/ (0, $gV8PY$createContext)(null);
|
|
39
41
|
const $f2ff30fde7b014be$export$d2f961adcb0afbe = /*#__PURE__*/ (0, $gV8PY$createContext)(null);
|
|
40
42
|
function $f2ff30fde7b014be$export$2e1e1122cf0cba88(props) {
|
|
@@ -49,7 +51,9 @@ function $f2ff30fde7b014be$export$2e1e1122cf0cba88(props) {
|
|
|
49
51
|
// This is done in RAC instead of hooks because otherwise we cannot distinguish
|
|
50
52
|
// between context and props. Normally aria-labelledby overrides the title
|
|
51
53
|
// but when sent by context we want the title to win.
|
|
54
|
+
// oxlint-disable-next-line react/react-compiler
|
|
52
55
|
triggerProps.id = (0, $gV8PY$useId)();
|
|
56
|
+
// oxlint-disable-next-line react/react-compiler
|
|
53
57
|
overlayProps['aria-labelledby'] = triggerProps.id;
|
|
54
58
|
return /*#__PURE__*/ (0, $gV8PY$react).createElement((0, $7230ffa83bc0c2cf$export$2881499e37b75b9a), {
|
|
55
59
|
values: [
|
|
@@ -70,6 +74,7 @@ function $f2ff30fde7b014be$export$2e1e1122cf0cba88(props) {
|
|
|
70
74
|
{
|
|
71
75
|
trigger: 'DialogTrigger',
|
|
72
76
|
triggerRef: buttonRef,
|
|
77
|
+
id: overlayProps.id,
|
|
73
78
|
'aria-labelledby': overlayProps['aria-labelledby']
|
|
74
79
|
}
|
|
75
80
|
]
|
|
@@ -83,7 +88,7 @@ function $f2ff30fde7b014be$export$2e1e1122cf0cba88(props) {
|
|
|
83
88
|
const $f2ff30fde7b014be$export$3ddf2d174ce01153 = /*#__PURE__*/ (0, $gV8PY$forwardRef)(function Dialog(props, ref) {
|
|
84
89
|
let originalAriaLabelledby = props['aria-labelledby'];
|
|
85
90
|
[props, ref] = (0, $7230ffa83bc0c2cf$export$29f1550f4b0d4415)(props, ref, $f2ff30fde7b014be$export$8b93a07348a7730c);
|
|
86
|
-
let { dialogProps: dialogProps, titleProps: titleProps } = (0, $gV8PY$useDialog)({
|
|
91
|
+
let { dialogProps: dialogProps, titleProps: titleProps, contentProps: contentProps } = (0, $gV8PY$useDialog)({
|
|
87
92
|
...props,
|
|
88
93
|
// Only pass aria-labelledby from props, not context.
|
|
89
94
|
// Context is used as a fallback below.
|
|
@@ -127,6 +132,15 @@ const $f2ff30fde7b014be$export$3ddf2d174ce01153 = /*#__PURE__*/ (0, $gV8PY$forwa
|
|
|
127
132
|
}
|
|
128
133
|
}
|
|
129
134
|
],
|
|
135
|
+
[
|
|
136
|
+
(0, $efe09c6d1c304b50$export$9afb8bc826b033ea),
|
|
137
|
+
{
|
|
138
|
+
slots: {
|
|
139
|
+
[(0, $7230ffa83bc0c2cf$export$c62b8e45d58ddad9)]: {},
|
|
140
|
+
description: contentProps
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
],
|
|
130
144
|
[
|
|
131
145
|
(0, $7705c033048f6da7$export$24d547caef80ccd1),
|
|
132
146
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"
|
|
1
|
+
{"mappings":"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","sources":["packages/react-aria-components/src/Dialog.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 */\nimport {AriaDialogProps, useDialog} from 'react-aria/useDialog';\n\nimport {ButtonContext} from './Button';\nimport {\n ContextValue,\n DEFAULT_SLOT,\n dom,\n DOMRenderProps,\n Provider,\n SlotProps,\n StyleProps,\n useContextProps,\n useRenderProps\n} from './utils';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {forwardRefType, GlobalDOMAttributes} from '@react-types/shared';\nimport {HeadingContext} from './Heading';\nimport {mergeProps} from 'react-aria/mergeProps';\nimport {OverlayTriggerProps, OverlayTriggerState} from 'react-stately/useOverlayTriggerState';\nimport {PopoverContext} from './Popover';\nimport {PressResponder} from 'react-aria/private/interactions/PressResponder';\nimport React, {\n createContext,\n ForwardedRef,\n forwardRef,\n JSX,\n ReactNode,\n useContext,\n useRef\n} from 'react';\nimport {RootMenuTriggerStateContext} from './Menu';\nimport {TextContext} from './Text';\nimport {useId} from 'react-aria/useId';\nimport {useMenuTriggerState} from 'react-stately/useMenuTriggerState';\nimport {useOverlayTrigger} from 'react-aria/useOverlayTrigger';\n\nexport interface DialogTriggerProps extends OverlayTriggerProps {\n children: ReactNode;\n}\n\nexport interface DialogRenderProps {\n close: () => void;\n}\n\nexport interface DialogProps\n extends\n AriaDialogProps,\n StyleProps,\n SlotProps,\n DOMRenderProps<'section', undefined>,\n GlobalDOMAttributes<HTMLElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the\n * element.\n *\n * @default 'react-aria-Dialog'\n */\n className?: string;\n /** Children of the dialog. A function may be provided to access a function to close the dialog. */\n children?: ReactNode | ((opts: DialogRenderProps) => ReactNode);\n}\n\nexport const DialogContext = createContext<ContextValue<DialogProps, HTMLElement>>(null);\nexport const OverlayTriggerStateContext = createContext<OverlayTriggerState | null>(null);\n\n/**\n * A DialogTrigger opens a dialog when a trigger element is pressed.\n */\nexport function DialogTrigger(props: DialogTriggerProps): JSX.Element {\n // Use useMenuTriggerState instead of useOverlayTriggerState in case a menu is embedded in the dialog.\n // This is needed to handle submenus.\n let state = useMenuTriggerState(props);\n\n let buttonRef = useRef<HTMLButtonElement>(null);\n let {triggerProps, overlayProps} = useOverlayTrigger({type: 'dialog'}, state, buttonRef);\n\n // Label dialog by the trigger as a fallback if there is no title slot.\n // This is done in RAC instead of hooks because otherwise we cannot distinguish\n // between context and props. Normally aria-labelledby overrides the title\n // but when sent by context we want the title to win.\n // oxlint-disable-next-line react/react-compiler\n triggerProps.id = useId();\n // oxlint-disable-next-line react/react-compiler\n overlayProps['aria-labelledby'] = triggerProps.id;\n\n return (\n <Provider\n values={[\n [OverlayTriggerStateContext, state],\n [RootMenuTriggerStateContext, state],\n [DialogContext, overlayProps],\n [\n PopoverContext,\n {\n trigger: 'DialogTrigger',\n triggerRef: buttonRef,\n id: overlayProps.id,\n 'aria-labelledby': overlayProps['aria-labelledby']\n }\n ]\n ]}>\n <PressResponder {...triggerProps} ref={buttonRef} isPressed={state.isOpen}>\n {props.children}\n </PressResponder>\n </Provider>\n );\n}\n\n/**\n * A dialog is an overlay shown above other content in an application.\n */\nexport const Dialog = /*#__PURE__*/ (forwardRef as forwardRefType)(function Dialog(\n props: DialogProps,\n ref: ForwardedRef<HTMLElement>\n) {\n let originalAriaLabelledby = props['aria-labelledby'];\n [props, ref] = useContextProps(props, ref, DialogContext);\n let {dialogProps, titleProps, contentProps} = useDialog(\n {\n ...props,\n // Only pass aria-labelledby from props, not context.\n // Context is used as a fallback below.\n 'aria-labelledby': originalAriaLabelledby\n },\n ref\n );\n let state = useContext(OverlayTriggerStateContext);\n\n if (!dialogProps['aria-label'] && !dialogProps['aria-labelledby']) {\n // If aria-labelledby exists on props, we know it came from context.\n // Use that as a fallback in case there is no title slot.\n if (props['aria-labelledby']) {\n dialogProps['aria-labelledby'] = props['aria-labelledby'];\n } else if (process.env.NODE_ENV !== 'production') {\n console.warn(\n 'If a Dialog does not contain a <Heading slot=\"title\">, it must have an aria-label or aria-labelledby attribute for accessibility.'\n );\n }\n }\n\n let renderProps = useRenderProps({\n defaultClassName: 'react-aria-Dialog',\n className: props.className,\n style: props.style,\n children: props.children,\n values: {\n close: state?.close || (() => {})\n }\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <dom.section\n {...mergeProps(DOMProps, renderProps, dialogProps)}\n render={props.render}\n ref={ref}\n slot={props.slot || undefined}>\n <Provider\n values={[\n [\n HeadingContext,\n {\n slots: {\n [DEFAULT_SLOT]: {},\n title: {...titleProps, level: 2}\n }\n }\n ],\n [\n TextContext,\n {\n slots: {\n [DEFAULT_SLOT]: {},\n description: contentProps\n }\n }\n ],\n [\n ButtonContext,\n {\n slots: {\n [DEFAULT_SLOT]: {},\n close: {\n onPress: () => state?.close()\n }\n }\n }\n ]\n ]}>\n {renderProps.children}\n </Provider>\n </dom.section>\n );\n});\n"],"names":[],"version":3,"file":"Dialog.mjs.map"}
|
|
@@ -36,6 +36,7 @@ function $d3d8871226fc64f2$export$971707d8a129a1f7(dragAndDropHooks, dropState)
|
|
|
36
36
|
let isVirtualDragging = dragAndDropHooks?.isVirtualDragging?.();
|
|
37
37
|
let fn = (0, $9uD35$react.useCallback)((target)=>{
|
|
38
38
|
// Only show drop indicators when virtual dragging or this is the current drop target.
|
|
39
|
+
// oxlint-disable-next-line react/react-compiler
|
|
39
40
|
if (isVirtualDragging || dropState?.isDropTarget(target)) return renderDropIndicator ? renderDropIndicator(target) : /*#__PURE__*/ (0, ($parcel$interopDefault($9uD35$react))).createElement($d3d8871226fc64f2$export$62ed72bc21f6b8a6, {
|
|
40
41
|
target: target
|
|
41
42
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;AA0BM,MAAM,0DAAqB,CAAA,GAAA,0BAAY,EAA2B,CAAC;AACnE,MAAM,0DAAuB,CAAA,GAAA,0BAAY,EAAoC;AA6B7E,MAAM,0DAAgB,CAAA,GAAA,uBAAS,EAAE,SAAS,cAC/C,KAAyB,EACzB,GAA8B;IAE9B,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,uBAAS,EAAE;IAC1B,qBAAO,sHAAG,OAAO,OAAO;AAC1B;AAIO,SAAS,0CACd,gBAAmC,EACnC,SAAoC;IAEpC,IAAI,sBAAsB,kBAAkB;IAC5C,IAAI,oBAAoB,kBAAkB;IAC1C,IAAI,KAAK,CAAA,GAAA,wBAAU,EACjB,CAAC;QACC,sFAAsF;QACtF,IAAI,qBAAqB,WAAW,aAAa,SAC/C,OAAO,sBACL,oBAAoB,wBAEpB,0DAAC;YAAc,QAAQ;;IAG7B,GACA,6CAA6C;IAC7C,uDAAuD;IACvD;QAAC,WAAW;QAAQ;QAAmB;KAAoB;IAE7D,OAAO,kBAAkB,mBAAmB,KAAK;AACnD;AAEO,SAAS,yCACd,gBAA0C,EAC1C,gBAAmC,EACnC,SAAoC;IAEpC,mDAAmD;IACnD,IAAI,aAAa,iBAAiB,UAAU;IAC5C,IAAI,gBAAwC;IAC5C,IAAI,kBAAkB,yBAAyB,WAAW,QAAQ,SAAS,QAAQ;QACjF,gBAAgB,UAAU,MAAM,CAAC,GAAG;QACpC,IAAI,UAAU,MAAM,CAAC,YAAY,KAAK,SAAS;YAC7C,iFAAiF;YACjF,IAAI,UAAU,UAAU,UAAU,CAAC,WAAW,CAAC;YAC/C,IAAI,oBAAgC;YACpC,IAAI,WAAW,MAAM;gBACnB,IAAI,cAAc,UAAU,UAAU,CAAC,OAAO,CAAC,gBAAgB,SAAS;gBACxE,wGAAwG;gBACxG,MAAO,WAAW,KAAM;oBACtB,IAAI,OAAO,UAAU,UAAU,CAAC,OAAO,CAAC;oBACxC,qCAAqC;oBACrC,IAAI,CAAC,MACH;oBAEF,6EAA6E;oBAC7E,qCAAqC;oBACrC,IAAI,KAAK,IAAI,KAAK,QAAQ;wBACxB,UAAU,UAAU,UAAU,CAAC,WAAW,CAAC;wBAC3C;oBACF;oBAEA,wDAAwD;oBACxD,qCAAqC;oBACrC,IAAI,AAAC,CAAA,KAAK,KAAK,IAAI,CAAA,KAAM,aACvB;oBAGF,oBAAoB;oBACpB,UAAU,UAAU,UAAU,CAAC,WAAW,CAAC;gBAC7C;YACF;YAEA,kEAAkE;YAClE,gBAAgB,WAAW,qBAAqB;QAClD;IACF;IAEA,OAAO,CAAA,GAAA,oBAAM,EAAE;QACb,OAAO,IAAI,IAAI;YAAC;YAAY;SAAc,CAAC,MAAM,CAAC,CAAA,IAAK,KAAK;IAC9D,GAAG;QAAC;QAAY;KAAc;AAChC","sources":["packages/react-aria-components/src/DragAndDrop.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 */\nimport type {DropIndicatorProps as AriaDropIndicatorProps} from 'react-aria/useDroppableCollection';\n\nimport type {ClassNameOrFunction, RenderProps} from './utils';\nimport type {DragAndDropHooks} from './useDragAndDrop';\nimport type {DraggableCollectionState} from 'react-stately/useDraggableCollectionState';\nimport type {DroppableCollectionState} from 'react-stately/useDroppableCollectionState';\nimport type {ItemDropTarget, Key} from '@react-types/shared';\nimport type {MultipleSelectionManager} from 'react-stately/useMultipleSelectionState';\nimport React, {\n createContext,\n ForwardedRef,\n forwardRef,\n JSX,\n ReactNode,\n useCallback,\n useContext,\n useMemo\n} from 'react';\n\nexport interface DragAndDropContextValue {\n dragAndDropHooks?: DragAndDropHooks;\n dragState?: DraggableCollectionState;\n dropState?: DroppableCollectionState;\n}\n\nexport const DragAndDropContext = createContext<DragAndDropContextValue>({});\nexport const DropIndicatorContext = createContext<DropIndicatorContextValue | null>(null);\n\nexport interface DropIndicatorRenderProps {\n /**\n * Whether the drop indicator is currently the active drop target.\n *\n * @selector [data-drop-target]\n */\n isDropTarget: boolean;\n}\n\nexport interface DropIndicatorProps\n extends Omit<AriaDropIndicatorProps, 'activateButtonRef'>, RenderProps<DropIndicatorRenderProps> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the\n * element. A function may be provided to compute the class based on component state.\n *\n * @default 'react-aria-DropIndicator'\n */\n className?: ClassNameOrFunction<DropIndicatorRenderProps>;\n}\ninterface DropIndicatorContextValue {\n render: (props: DropIndicatorProps, ref: ForwardedRef<HTMLElement>) => ReactNode;\n}\n\n/**\n * A DropIndicator is rendered between items in a collection to indicate where dropped data will be\n * inserted.\n */\nexport const DropIndicator = forwardRef(function DropIndicator(\n props: DropIndicatorProps,\n ref: ForwardedRef<HTMLElement>\n): JSX.Element {\n let {render} = useContext(DropIndicatorContext)!;\n return <>{render(props, ref)}</>;\n});\n\ntype RenderDropIndicatorRetValue = ((target: ItemDropTarget) => ReactNode | undefined) | undefined;\n\nexport function useRenderDropIndicator(\n dragAndDropHooks?: DragAndDropHooks,\n dropState?: DroppableCollectionState\n): RenderDropIndicatorRetValue {\n let renderDropIndicator = dragAndDropHooks?.renderDropIndicator;\n let isVirtualDragging = dragAndDropHooks?.isVirtualDragging?.();\n let fn = useCallback(\n (target: ItemDropTarget) => {\n // Only show drop indicators when virtual dragging or this is the current drop target.\n if (isVirtualDragging || dropState?.isDropTarget(target)) {\n return renderDropIndicator ? (\n renderDropIndicator(target)\n ) : (\n <DropIndicator target={target} />\n );\n }\n },\n // We invalidate whenever the target changes.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [dropState?.target, isVirtualDragging, renderDropIndicator]\n );\n return dragAndDropHooks?.useDropIndicator ? fn : undefined;\n}\n\nexport function useDndPersistedKeys(\n selectionManager: MultipleSelectionManager,\n dragAndDropHooks?: DragAndDropHooks,\n dropState?: DroppableCollectionState\n): Set<Key> {\n // Persist the focused key and the drop target key.\n let focusedKey = selectionManager.focusedKey;\n let dropTargetKey: Key | null | undefined = null;\n if (dragAndDropHooks?.isVirtualDragging?.() && dropState?.target?.type === 'item') {\n dropTargetKey = dropState.target.key;\n if (dropState.target.dropPosition === 'after') {\n // Normalize to the \"before\" drop position since we only render those to the DOM.\n let nextKey = dropState.collection.getKeyAfter(dropTargetKey);\n let lastDescendantKey: Key | null = null;\n if (nextKey != null) {\n let targetLevel = dropState.collection.getItem(dropTargetKey)?.level ?? 0;\n // Skip over any rows that are descendants of the target (\"after\" position should be after all children)\n while (nextKey != null) {\n let node = dropState.collection.getItem(nextKey);\n // eslint-disable-next-line max-depth\n if (!node) {\n break;\n }\n // Skip over non-item nodes (e.g., loaders) since they can't be drop targets.\n // eslint-disable-next-line max-depth\n if (node.type !== 'item') {\n nextKey = dropState.collection.getKeyAfter(nextKey);\n continue;\n }\n\n // Stop once we find an item at the same level or higher\n // eslint-disable-next-line max-depth\n if ((node.level ?? 0) <= targetLevel) {\n break;\n }\n\n lastDescendantKey = nextKey;\n nextKey = dropState.collection.getKeyAfter(nextKey);\n }\n }\n\n // If nextKey is null (end of collection), use the last descendant\n dropTargetKey = nextKey ?? lastDescendantKey ?? dropTargetKey;\n }\n }\n\n return useMemo(() => {\n return new Set([focusedKey, dropTargetKey].filter(k => k != null));\n }, [focusedKey, dropTargetKey]);\n}\n"],"names":[],"version":3,"file":"DragAndDrop.cjs.map"}
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;AA0BM,MAAM,0DAAqB,CAAA,GAAA,0BAAY,EAA2B,CAAC;AACnE,MAAM,0DAAuB,CAAA,GAAA,0BAAY,EAAoC;AA6B7E,MAAM,0DAAgB,CAAA,GAAA,uBAAS,EAAE,SAAS,cAC/C,KAAyB,EACzB,GAA8B;IAE9B,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,uBAAS,EAAE;IAC1B,qBAAO,sHAAG,OAAO,OAAO;AAC1B;AAIO,SAAS,0CACd,gBAAmC,EACnC,SAAoC;IAEpC,IAAI,sBAAsB,kBAAkB;IAC5C,IAAI,oBAAoB,kBAAkB;IAC1C,IAAI,KAAK,CAAA,GAAA,wBAAU,EACjB,CAAC;QACC,sFAAsF;QACtF,gDAAgD;QAChD,IAAI,qBAAqB,WAAW,aAAa,SAC/C,OAAO,sBACL,oBAAoB,wBAEpB,0DAAC;YAAc,QAAQ;;IAG7B,GACA,6CAA6C;IAC7C,uDAAuD;IACvD;QAAC,WAAW;QAAQ;QAAmB;KAAoB;IAE7D,OAAO,kBAAkB,mBAAmB,KAAK;AACnD;AAEO,SAAS,yCACd,gBAA0C,EAC1C,gBAAmC,EACnC,SAAoC;IAEpC,mDAAmD;IACnD,IAAI,aAAa,iBAAiB,UAAU;IAC5C,IAAI,gBAAwC;IAC5C,IAAI,kBAAkB,yBAAyB,WAAW,QAAQ,SAAS,QAAQ;QACjF,gBAAgB,UAAU,MAAM,CAAC,GAAG;QACpC,IAAI,UAAU,MAAM,CAAC,YAAY,KAAK,SAAS;YAC7C,iFAAiF;YACjF,IAAI,UAAU,UAAU,UAAU,CAAC,WAAW,CAAC;YAC/C,IAAI,oBAAgC;YACpC,IAAI,WAAW,MAAM;gBACnB,IAAI,cAAc,UAAU,UAAU,CAAC,OAAO,CAAC,gBAAgB,SAAS;gBACxE,wGAAwG;gBACxG,MAAO,WAAW,KAAM;oBACtB,IAAI,OAAO,UAAU,UAAU,CAAC,OAAO,CAAC;oBACxC,qCAAqC;oBACrC,IAAI,CAAC,MACH;oBAEF,6EAA6E;oBAC7E,qCAAqC;oBACrC,IAAI,KAAK,IAAI,KAAK,QAAQ;wBACxB,UAAU,UAAU,UAAU,CAAC,WAAW,CAAC;wBAC3C;oBACF;oBAEA,wDAAwD;oBACxD,qCAAqC;oBACrC,IAAI,AAAC,CAAA,KAAK,KAAK,IAAI,CAAA,KAAM,aACvB;oBAGF,oBAAoB;oBACpB,UAAU,UAAU,UAAU,CAAC,WAAW,CAAC;gBAC7C;YACF;YAEA,kEAAkE;YAClE,gBAAgB,WAAW,qBAAqB;QAClD;IACF;IAEA,OAAO,CAAA,GAAA,oBAAM,EAAE;QACb,OAAO,IAAI,IAAI;YAAC;YAAY;SAAc,CAAC,MAAM,CAAC,CAAA,IAAK,KAAK;IAC9D,GAAG;QAAC;QAAY;KAAc;AAChC","sources":["packages/react-aria-components/src/DragAndDrop.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 */\nimport type {DropIndicatorProps as AriaDropIndicatorProps} from 'react-aria/useDroppableCollection';\n\nimport type {ClassNameOrFunction, RenderProps} from './utils';\nimport type {DragAndDropHooks} from './useDragAndDrop';\nimport type {DraggableCollectionState} from 'react-stately/useDraggableCollectionState';\nimport type {DroppableCollectionState} from 'react-stately/useDroppableCollectionState';\nimport type {ItemDropTarget, Key} from '@react-types/shared';\nimport type {MultipleSelectionManager} from 'react-stately/useMultipleSelectionState';\nimport React, {\n createContext,\n ForwardedRef,\n forwardRef,\n JSX,\n ReactNode,\n useCallback,\n useContext,\n useMemo\n} from 'react';\n\nexport interface DragAndDropContextValue {\n dragAndDropHooks?: DragAndDropHooks;\n dragState?: DraggableCollectionState;\n dropState?: DroppableCollectionState;\n}\n\nexport const DragAndDropContext = createContext<DragAndDropContextValue>({});\nexport const DropIndicatorContext = createContext<DropIndicatorContextValue | null>(null);\n\nexport interface DropIndicatorRenderProps {\n /**\n * Whether the drop indicator is currently the active drop target.\n *\n * @selector [data-drop-target]\n */\n isDropTarget: boolean;\n}\n\nexport interface DropIndicatorProps\n extends Omit<AriaDropIndicatorProps, 'activateButtonRef'>, RenderProps<DropIndicatorRenderProps> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the\n * element. A function may be provided to compute the class based on component state.\n *\n * @default 'react-aria-DropIndicator'\n */\n className?: ClassNameOrFunction<DropIndicatorRenderProps>;\n}\ninterface DropIndicatorContextValue {\n render: (props: DropIndicatorProps, ref: ForwardedRef<HTMLElement>) => ReactNode;\n}\n\n/**\n * A DropIndicator is rendered between items in a collection to indicate where dropped data will be\n * inserted.\n */\nexport const DropIndicator = forwardRef(function DropIndicator(\n props: DropIndicatorProps,\n ref: ForwardedRef<HTMLElement>\n): JSX.Element {\n let {render} = useContext(DropIndicatorContext)!;\n return <>{render(props, ref)}</>;\n});\n\ntype RenderDropIndicatorRetValue = ((target: ItemDropTarget) => ReactNode | undefined) | undefined;\n\nexport function useRenderDropIndicator(\n dragAndDropHooks?: DragAndDropHooks,\n dropState?: DroppableCollectionState\n): RenderDropIndicatorRetValue {\n let renderDropIndicator = dragAndDropHooks?.renderDropIndicator;\n let isVirtualDragging = dragAndDropHooks?.isVirtualDragging?.();\n let fn = useCallback(\n (target: ItemDropTarget) => {\n // Only show drop indicators when virtual dragging or this is the current drop target.\n // oxlint-disable-next-line react/react-compiler\n if (isVirtualDragging || dropState?.isDropTarget(target)) {\n return renderDropIndicator ? (\n renderDropIndicator(target)\n ) : (\n <DropIndicator target={target} />\n );\n }\n },\n // We invalidate whenever the target changes.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [dropState?.target, isVirtualDragging, renderDropIndicator]\n );\n return dragAndDropHooks?.useDropIndicator ? fn : undefined;\n}\n\nexport function useDndPersistedKeys(\n selectionManager: MultipleSelectionManager,\n dragAndDropHooks?: DragAndDropHooks,\n dropState?: DroppableCollectionState\n): Set<Key> {\n // Persist the focused key and the drop target key.\n let focusedKey = selectionManager.focusedKey;\n let dropTargetKey: Key | null | undefined = null;\n if (dragAndDropHooks?.isVirtualDragging?.() && dropState?.target?.type === 'item') {\n dropTargetKey = dropState.target.key;\n if (dropState.target.dropPosition === 'after') {\n // Normalize to the \"before\" drop position since we only render those to the DOM.\n let nextKey = dropState.collection.getKeyAfter(dropTargetKey);\n let lastDescendantKey: Key | null = null;\n if (nextKey != null) {\n let targetLevel = dropState.collection.getItem(dropTargetKey)?.level ?? 0;\n // Skip over any rows that are descendants of the target (\"after\" position should be after all children)\n while (nextKey != null) {\n let node = dropState.collection.getItem(nextKey);\n // eslint-disable-next-line max-depth\n if (!node) {\n break;\n }\n // Skip over non-item nodes (e.g., loaders) since they can't be drop targets.\n // eslint-disable-next-line max-depth\n if (node.type !== 'item') {\n nextKey = dropState.collection.getKeyAfter(nextKey);\n continue;\n }\n\n // Stop once we find an item at the same level or higher\n // eslint-disable-next-line max-depth\n if ((node.level ?? 0) <= targetLevel) {\n break;\n }\n\n lastDescendantKey = nextKey;\n nextKey = dropState.collection.getKeyAfter(nextKey);\n }\n }\n\n // If nextKey is null (end of collection), use the last descendant\n dropTargetKey = nextKey ?? lastDescendantKey ?? dropTargetKey;\n }\n }\n\n return useMemo(() => {\n return new Set([focusedKey, dropTargetKey].filter(k => k != null));\n }, [focusedKey, dropTargetKey]);\n}\n"],"names":[],"version":3,"file":"DragAndDrop.cjs.map"}
|
|
@@ -23,6 +23,7 @@ function $49776fcddfd94ccc$export$971707d8a129a1f7(dragAndDropHooks, dropState)
|
|
|
23
23
|
let isVirtualDragging = dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : (_dragAndDropHooks_isVirtualDragging = dragAndDropHooks.isVirtualDragging) === null || _dragAndDropHooks_isVirtualDragging === void 0 ? void 0 : _dragAndDropHooks_isVirtualDragging.call(dragAndDropHooks);
|
|
24
24
|
let fn = (0, $a4UvK$useCallback)((target)=>{
|
|
25
25
|
// Only show drop indicators when virtual dragging or this is the current drop target.
|
|
26
|
+
// oxlint-disable-next-line react/react-compiler
|
|
26
27
|
if (isVirtualDragging || (dropState === null || dropState === void 0 ? void 0 : dropState.isDropTarget(target))) return renderDropIndicator ? renderDropIndicator(target) : /*#__PURE__*/ (0, $a4UvK$react).createElement($49776fcddfd94ccc$export$62ed72bc21f6b8a6, {
|
|
27
28
|
target: target
|
|
28
29
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;AAAA;;;;;;;;;;CAUC;AA0BM,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAA2B,CAAC;AACnE,MAAM,0DAAuB,CAAA,GAAA,oBAAY,EAAoC;AA6B7E,MAAM,0DAAgB,CAAA,GAAA,iBAAS,EAAE,SAAS,cAC/C,KAAyB,EACzB,GAA8B;IAE9B,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE;IAC1B,qBAAO,kEAAG,OAAO,OAAO;AAC1B;AAIO,SAAS,0CACd,gBAAmC,EACnC,SAAoC;QAGZ;IADxB,IAAI,sBAAsB,6BAAA,uCAAA,iBAAkB,mBAAmB;IAC/D,IAAI,oBAAoB,6BAAA,wCAAA,sCAAA,iBAAkB,iBAAiB,cAAnC,0DAAA,yCAAA;IACxB,IAAI,KAAK,CAAA,GAAA,kBAAU,EACjB,CAAC;QACC,sFAAsF;QACtF,IAAI,sBAAqB,sBAAA,gCAAA,UAAW,YAAY,CAAC,UAC/C,OAAO,sBACL,oBAAoB,wBAEpB,gCAAC;YAAc,QAAQ;;IAG7B,GACA,6CAA6C;IAC7C,uDAAuD;IACvD;QAAC,sBAAA,gCAAA,UAAW,MAAM;QAAE;QAAmB;KAAoB;IAE7D,OAAO,CAAA,6BAAA,uCAAA,iBAAkB,gBAAgB,IAAG,KAAK;AACnD;AAEO,SAAS,yCACd,gBAA0C,EAC1C,gBAAmC,EACnC,SAAoC;QAKhC,qCAA2C;IAH/C,mDAAmD;IACnD,IAAI,aAAa,iBAAiB,UAAU;IAC5C,IAAI,gBAAwC;IAC5C,IAAI,CAAA,6BAAA,wCAAA,sCAAA,iBAAkB,iBAAiB,cAAnC,0DAAA,yCAAA,sBAA2C,CAAA,sBAAA,iCAAA,oBAAA,UAAW,MAAM,cAAjB,wCAAA,kBAAmB,IAAI,MAAK,QAAQ;QACjF,gBAAgB,UAAU,MAAM,CAAC,GAAG;QACpC,IAAI,UAAU,MAAM,CAAC,YAAY,KAAK,SAAS;YAC7C,iFAAiF;YACjF,IAAI,UAAU,UAAU,UAAU,CAAC,WAAW,CAAC;YAC/C,IAAI,oBAAgC;YACpC,IAAI,WAAW,MAAM;oBACD;oBAAA;gBAAlB,IAAI,cAAc,CAAA,uCAAA,gCAAA,UAAU,UAAU,CAAC,OAAO,CAAC,4BAA7B,oDAAA,8BAA6C,KAAK,cAAlD,iDAAA,sCAAsD;gBACxE,wGAAwG;gBACxG,MAAO,WAAW,KAAM;oBACtB,IAAI,OAAO,UAAU,UAAU,CAAC,OAAO,CAAC;oBACxC,qCAAqC;oBACrC,IAAI,CAAC,MACH;oBAEF,6EAA6E;oBAC7E,qCAAqC;oBACrC,IAAI,KAAK,IAAI,KAAK,QAAQ;wBACxB,UAAU,UAAU,UAAU,CAAC,WAAW,CAAC;wBAC3C;oBACF;wBAIK;oBAFL,wDAAwD;oBACxD,qCAAqC;oBACrC,IAAI,AAAC,CAAA,CAAA,cAAA,KAAK,KAAK,cAAV,yBAAA,cAAc,CAAA,KAAM,aACvB;oBAGF,oBAAoB;oBACpB,UAAU,UAAU,UAAU,CAAC,WAAW,CAAC;gBAC7C;YACF;gBAGgB;YADhB,kEAAkE;YAClE,gBAAgB,CAAA,OAAA,oBAAA,qBAAA,UAAW,+BAAX,kBAAA,OAAgC;QAClD;IACF;IAEA,OAAO,CAAA,GAAA,cAAM,EAAE;QACb,OAAO,IAAI,IAAI;YAAC;YAAY;SAAc,CAAC,MAAM,CAAC,CAAA,IAAK,KAAK;IAC9D,GAAG;QAAC;QAAY;KAAc;AAChC","sources":["packages/react-aria-components/src/DragAndDrop.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 */\nimport type {DropIndicatorProps as AriaDropIndicatorProps} from 'react-aria/useDroppableCollection';\n\nimport type {ClassNameOrFunction, RenderProps} from './utils';\nimport type {DragAndDropHooks} from './useDragAndDrop';\nimport type {DraggableCollectionState} from 'react-stately/useDraggableCollectionState';\nimport type {DroppableCollectionState} from 'react-stately/useDroppableCollectionState';\nimport type {ItemDropTarget, Key} from '@react-types/shared';\nimport type {MultipleSelectionManager} from 'react-stately/useMultipleSelectionState';\nimport React, {\n createContext,\n ForwardedRef,\n forwardRef,\n JSX,\n ReactNode,\n useCallback,\n useContext,\n useMemo\n} from 'react';\n\nexport interface DragAndDropContextValue {\n dragAndDropHooks?: DragAndDropHooks;\n dragState?: DraggableCollectionState;\n dropState?: DroppableCollectionState;\n}\n\nexport const DragAndDropContext = createContext<DragAndDropContextValue>({});\nexport const DropIndicatorContext = createContext<DropIndicatorContextValue | null>(null);\n\nexport interface DropIndicatorRenderProps {\n /**\n * Whether the drop indicator is currently the active drop target.\n *\n * @selector [data-drop-target]\n */\n isDropTarget: boolean;\n}\n\nexport interface DropIndicatorProps\n extends Omit<AriaDropIndicatorProps, 'activateButtonRef'>, RenderProps<DropIndicatorRenderProps> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the\n * element. A function may be provided to compute the class based on component state.\n *\n * @default 'react-aria-DropIndicator'\n */\n className?: ClassNameOrFunction<DropIndicatorRenderProps>;\n}\ninterface DropIndicatorContextValue {\n render: (props: DropIndicatorProps, ref: ForwardedRef<HTMLElement>) => ReactNode;\n}\n\n/**\n * A DropIndicator is rendered between items in a collection to indicate where dropped data will be\n * inserted.\n */\nexport const DropIndicator = forwardRef(function DropIndicator(\n props: DropIndicatorProps,\n ref: ForwardedRef<HTMLElement>\n): JSX.Element {\n let {render} = useContext(DropIndicatorContext)!;\n return <>{render(props, ref)}</>;\n});\n\ntype RenderDropIndicatorRetValue = ((target: ItemDropTarget) => ReactNode | undefined) | undefined;\n\nexport function useRenderDropIndicator(\n dragAndDropHooks?: DragAndDropHooks,\n dropState?: DroppableCollectionState\n): RenderDropIndicatorRetValue {\n let renderDropIndicator = dragAndDropHooks?.renderDropIndicator;\n let isVirtualDragging = dragAndDropHooks?.isVirtualDragging?.();\n let fn = useCallback(\n (target: ItemDropTarget) => {\n // Only show drop indicators when virtual dragging or this is the current drop target.\n if (isVirtualDragging || dropState?.isDropTarget(target)) {\n return renderDropIndicator ? (\n renderDropIndicator(target)\n ) : (\n <DropIndicator target={target} />\n );\n }\n },\n // We invalidate whenever the target changes.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [dropState?.target, isVirtualDragging, renderDropIndicator]\n );\n return dragAndDropHooks?.useDropIndicator ? fn : undefined;\n}\n\nexport function useDndPersistedKeys(\n selectionManager: MultipleSelectionManager,\n dragAndDropHooks?: DragAndDropHooks,\n dropState?: DroppableCollectionState\n): Set<Key> {\n // Persist the focused key and the drop target key.\n let focusedKey = selectionManager.focusedKey;\n let dropTargetKey: Key | null | undefined = null;\n if (dragAndDropHooks?.isVirtualDragging?.() && dropState?.target?.type === 'item') {\n dropTargetKey = dropState.target.key;\n if (dropState.target.dropPosition === 'after') {\n // Normalize to the \"before\" drop position since we only render those to the DOM.\n let nextKey = dropState.collection.getKeyAfter(dropTargetKey);\n let lastDescendantKey: Key | null = null;\n if (nextKey != null) {\n let targetLevel = dropState.collection.getItem(dropTargetKey)?.level ?? 0;\n // Skip over any rows that are descendants of the target (\"after\" position should be after all children)\n while (nextKey != null) {\n let node = dropState.collection.getItem(nextKey);\n // eslint-disable-next-line max-depth\n if (!node) {\n break;\n }\n // Skip over non-item nodes (e.g., loaders) since they can't be drop targets.\n // eslint-disable-next-line max-depth\n if (node.type !== 'item') {\n nextKey = dropState.collection.getKeyAfter(nextKey);\n continue;\n }\n\n // Stop once we find an item at the same level or higher\n // eslint-disable-next-line max-depth\n if ((node.level ?? 0) <= targetLevel) {\n break;\n }\n\n lastDescendantKey = nextKey;\n nextKey = dropState.collection.getKeyAfter(nextKey);\n }\n }\n\n // If nextKey is null (end of collection), use the last descendant\n dropTargetKey = nextKey ?? lastDescendantKey ?? dropTargetKey;\n }\n }\n\n return useMemo(() => {\n return new Set([focusedKey, dropTargetKey].filter(k => k != null));\n }, [focusedKey, dropTargetKey]);\n}\n"],"names":[],"version":3,"file":"DragAndDrop.js.map"}
|
|
1
|
+
{"mappings":";;AAAA;;;;;;;;;;CAUC;AA0BM,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAA2B,CAAC;AACnE,MAAM,0DAAuB,CAAA,GAAA,oBAAY,EAAoC;AA6B7E,MAAM,0DAAgB,CAAA,GAAA,iBAAS,EAAE,SAAS,cAC/C,KAAyB,EACzB,GAA8B;IAE9B,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE;IAC1B,qBAAO,kEAAG,OAAO,OAAO;AAC1B;AAIO,SAAS,0CACd,gBAAmC,EACnC,SAAoC;QAGZ;IADxB,IAAI,sBAAsB,6BAAA,uCAAA,iBAAkB,mBAAmB;IAC/D,IAAI,oBAAoB,6BAAA,wCAAA,sCAAA,iBAAkB,iBAAiB,cAAnC,0DAAA,yCAAA;IACxB,IAAI,KAAK,CAAA,GAAA,kBAAU,EACjB,CAAC;QACC,sFAAsF;QACtF,gDAAgD;QAChD,IAAI,sBAAqB,sBAAA,gCAAA,UAAW,YAAY,CAAC,UAC/C,OAAO,sBACL,oBAAoB,wBAEpB,gCAAC;YAAc,QAAQ;;IAG7B,GACA,6CAA6C;IAC7C,uDAAuD;IACvD;QAAC,sBAAA,gCAAA,UAAW,MAAM;QAAE;QAAmB;KAAoB;IAE7D,OAAO,CAAA,6BAAA,uCAAA,iBAAkB,gBAAgB,IAAG,KAAK;AACnD;AAEO,SAAS,yCACd,gBAA0C,EAC1C,gBAAmC,EACnC,SAAoC;QAKhC,qCAA2C;IAH/C,mDAAmD;IACnD,IAAI,aAAa,iBAAiB,UAAU;IAC5C,IAAI,gBAAwC;IAC5C,IAAI,CAAA,6BAAA,wCAAA,sCAAA,iBAAkB,iBAAiB,cAAnC,0DAAA,yCAAA,sBAA2C,CAAA,sBAAA,iCAAA,oBAAA,UAAW,MAAM,cAAjB,wCAAA,kBAAmB,IAAI,MAAK,QAAQ;QACjF,gBAAgB,UAAU,MAAM,CAAC,GAAG;QACpC,IAAI,UAAU,MAAM,CAAC,YAAY,KAAK,SAAS;YAC7C,iFAAiF;YACjF,IAAI,UAAU,UAAU,UAAU,CAAC,WAAW,CAAC;YAC/C,IAAI,oBAAgC;YACpC,IAAI,WAAW,MAAM;oBACD;oBAAA;gBAAlB,IAAI,cAAc,CAAA,uCAAA,gCAAA,UAAU,UAAU,CAAC,OAAO,CAAC,4BAA7B,oDAAA,8BAA6C,KAAK,cAAlD,iDAAA,sCAAsD;gBACxE,wGAAwG;gBACxG,MAAO,WAAW,KAAM;oBACtB,IAAI,OAAO,UAAU,UAAU,CAAC,OAAO,CAAC;oBACxC,qCAAqC;oBACrC,IAAI,CAAC,MACH;oBAEF,6EAA6E;oBAC7E,qCAAqC;oBACrC,IAAI,KAAK,IAAI,KAAK,QAAQ;wBACxB,UAAU,UAAU,UAAU,CAAC,WAAW,CAAC;wBAC3C;oBACF;wBAIK;oBAFL,wDAAwD;oBACxD,qCAAqC;oBACrC,IAAI,AAAC,CAAA,CAAA,cAAA,KAAK,KAAK,cAAV,yBAAA,cAAc,CAAA,KAAM,aACvB;oBAGF,oBAAoB;oBACpB,UAAU,UAAU,UAAU,CAAC,WAAW,CAAC;gBAC7C;YACF;gBAGgB;YADhB,kEAAkE;YAClE,gBAAgB,CAAA,OAAA,oBAAA,qBAAA,UAAW,+BAAX,kBAAA,OAAgC;QAClD;IACF;IAEA,OAAO,CAAA,GAAA,cAAM,EAAE;QACb,OAAO,IAAI,IAAI;YAAC;YAAY;SAAc,CAAC,MAAM,CAAC,CAAA,IAAK,KAAK;IAC9D,GAAG;QAAC;QAAY;KAAc;AAChC","sources":["packages/react-aria-components/src/DragAndDrop.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 */\nimport type {DropIndicatorProps as AriaDropIndicatorProps} from 'react-aria/useDroppableCollection';\n\nimport type {ClassNameOrFunction, RenderProps} from './utils';\nimport type {DragAndDropHooks} from './useDragAndDrop';\nimport type {DraggableCollectionState} from 'react-stately/useDraggableCollectionState';\nimport type {DroppableCollectionState} from 'react-stately/useDroppableCollectionState';\nimport type {ItemDropTarget, Key} from '@react-types/shared';\nimport type {MultipleSelectionManager} from 'react-stately/useMultipleSelectionState';\nimport React, {\n createContext,\n ForwardedRef,\n forwardRef,\n JSX,\n ReactNode,\n useCallback,\n useContext,\n useMemo\n} from 'react';\n\nexport interface DragAndDropContextValue {\n dragAndDropHooks?: DragAndDropHooks;\n dragState?: DraggableCollectionState;\n dropState?: DroppableCollectionState;\n}\n\nexport const DragAndDropContext = createContext<DragAndDropContextValue>({});\nexport const DropIndicatorContext = createContext<DropIndicatorContextValue | null>(null);\n\nexport interface DropIndicatorRenderProps {\n /**\n * Whether the drop indicator is currently the active drop target.\n *\n * @selector [data-drop-target]\n */\n isDropTarget: boolean;\n}\n\nexport interface DropIndicatorProps\n extends Omit<AriaDropIndicatorProps, 'activateButtonRef'>, RenderProps<DropIndicatorRenderProps> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the\n * element. A function may be provided to compute the class based on component state.\n *\n * @default 'react-aria-DropIndicator'\n */\n className?: ClassNameOrFunction<DropIndicatorRenderProps>;\n}\ninterface DropIndicatorContextValue {\n render: (props: DropIndicatorProps, ref: ForwardedRef<HTMLElement>) => ReactNode;\n}\n\n/**\n * A DropIndicator is rendered between items in a collection to indicate where dropped data will be\n * inserted.\n */\nexport const DropIndicator = forwardRef(function DropIndicator(\n props: DropIndicatorProps,\n ref: ForwardedRef<HTMLElement>\n): JSX.Element {\n let {render} = useContext(DropIndicatorContext)!;\n return <>{render(props, ref)}</>;\n});\n\ntype RenderDropIndicatorRetValue = ((target: ItemDropTarget) => ReactNode | undefined) | undefined;\n\nexport function useRenderDropIndicator(\n dragAndDropHooks?: DragAndDropHooks,\n dropState?: DroppableCollectionState\n): RenderDropIndicatorRetValue {\n let renderDropIndicator = dragAndDropHooks?.renderDropIndicator;\n let isVirtualDragging = dragAndDropHooks?.isVirtualDragging?.();\n let fn = useCallback(\n (target: ItemDropTarget) => {\n // Only show drop indicators when virtual dragging or this is the current drop target.\n // oxlint-disable-next-line react/react-compiler\n if (isVirtualDragging || dropState?.isDropTarget(target)) {\n return renderDropIndicator ? (\n renderDropIndicator(target)\n ) : (\n <DropIndicator target={target} />\n );\n }\n },\n // We invalidate whenever the target changes.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [dropState?.target, isVirtualDragging, renderDropIndicator]\n );\n return dragAndDropHooks?.useDropIndicator ? fn : undefined;\n}\n\nexport function useDndPersistedKeys(\n selectionManager: MultipleSelectionManager,\n dragAndDropHooks?: DragAndDropHooks,\n dropState?: DroppableCollectionState\n): Set<Key> {\n // Persist the focused key and the drop target key.\n let focusedKey = selectionManager.focusedKey;\n let dropTargetKey: Key | null | undefined = null;\n if (dragAndDropHooks?.isVirtualDragging?.() && dropState?.target?.type === 'item') {\n dropTargetKey = dropState.target.key;\n if (dropState.target.dropPosition === 'after') {\n // Normalize to the \"before\" drop position since we only render those to the DOM.\n let nextKey = dropState.collection.getKeyAfter(dropTargetKey);\n let lastDescendantKey: Key | null = null;\n if (nextKey != null) {\n let targetLevel = dropState.collection.getItem(dropTargetKey)?.level ?? 0;\n // Skip over any rows that are descendants of the target (\"after\" position should be after all children)\n while (nextKey != null) {\n let node = dropState.collection.getItem(nextKey);\n // eslint-disable-next-line max-depth\n if (!node) {\n break;\n }\n // Skip over non-item nodes (e.g., loaders) since they can't be drop targets.\n // eslint-disable-next-line max-depth\n if (node.type !== 'item') {\n nextKey = dropState.collection.getKeyAfter(nextKey);\n continue;\n }\n\n // Stop once we find an item at the same level or higher\n // eslint-disable-next-line max-depth\n if ((node.level ?? 0) <= targetLevel) {\n break;\n }\n\n lastDescendantKey = nextKey;\n nextKey = dropState.collection.getKeyAfter(nextKey);\n }\n }\n\n // If nextKey is null (end of collection), use the last descendant\n dropTargetKey = nextKey ?? lastDescendantKey ?? dropTargetKey;\n }\n }\n\n return useMemo(() => {\n return new Set([focusedKey, dropTargetKey].filter(k => k != null));\n }, [focusedKey, dropTargetKey]);\n}\n"],"names":[],"version":3,"file":"DragAndDrop.js.map"}
|
|
@@ -22,6 +22,7 @@ function $f9554a667e4f0374$export$971707d8a129a1f7(dragAndDropHooks, dropState)
|
|
|
22
22
|
let isVirtualDragging = dragAndDropHooks?.isVirtualDragging?.();
|
|
23
23
|
let fn = (0, $k30rM$useCallback)((target)=>{
|
|
24
24
|
// Only show drop indicators when virtual dragging or this is the current drop target.
|
|
25
|
+
// oxlint-disable-next-line react/react-compiler
|
|
25
26
|
if (isVirtualDragging || dropState?.isDropTarget(target)) return renderDropIndicator ? renderDropIndicator(target) : /*#__PURE__*/ (0, $k30rM$react).createElement($f9554a667e4f0374$export$62ed72bc21f6b8a6, {
|
|
26
27
|
target: target
|
|
27
28
|
});
|