react-aria-components 1.15.1 → 1.16.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Button.main.js +3 -2
- package/dist/Button.main.js.map +1 -1
- package/dist/Button.mjs +3 -2
- package/dist/Button.module.js +3 -2
- package/dist/Button.module.js.map +1 -1
- package/dist/Collection.main.js +3 -0
- package/dist/Collection.main.js.map +1 -1
- package/dist/Collection.mjs +3 -0
- package/dist/Collection.module.js +3 -0
- package/dist/Collection.module.js.map +1 -1
- package/dist/ComboBox.main.js +59 -8
- package/dist/ComboBox.main.js.map +1 -1
- package/dist/ComboBox.mjs +61 -12
- package/dist/ComboBox.module.js +61 -12
- package/dist/ComboBox.module.js.map +1 -1
- package/dist/DateField.main.js +8 -4
- package/dist/DateField.main.js.map +1 -1
- package/dist/DateField.mjs +8 -4
- package/dist/DateField.module.js +8 -4
- package/dist/DateField.module.js.map +1 -1
- package/dist/DatePicker.main.js +6 -2
- package/dist/DatePicker.main.js.map +1 -1
- package/dist/DatePicker.mjs +6 -2
- package/dist/DatePicker.module.js +6 -2
- package/dist/DatePicker.module.js.map +1 -1
- package/dist/DropZone.main.js +1 -1
- package/dist/DropZone.main.js.map +1 -1
- package/dist/DropZone.mjs +2 -2
- package/dist/DropZone.module.js +2 -2
- package/dist/DropZone.module.js.map +1 -1
- package/dist/FileTrigger.main.js +1 -1
- package/dist/FileTrigger.main.js.map +1 -1
- package/dist/FileTrigger.mjs +2 -2
- package/dist/FileTrigger.module.js +2 -2
- package/dist/FileTrigger.module.js.map +1 -1
- package/dist/GridList.main.js +7 -4
- package/dist/GridList.main.js.map +1 -1
- package/dist/GridList.mjs +7 -5
- package/dist/GridList.module.js +7 -5
- package/dist/GridList.module.js.map +1 -1
- package/dist/HiddenDateInput.main.js +3 -1
- package/dist/HiddenDateInput.main.js.map +1 -1
- package/dist/HiddenDateInput.mjs +3 -1
- package/dist/HiddenDateInput.module.js +3 -1
- package/dist/HiddenDateInput.module.js.map +1 -1
- package/dist/Keyboard.main.js.map +1 -1
- package/dist/Keyboard.module.js.map +1 -1
- package/dist/ListBox.main.js +2 -1
- package/dist/ListBox.main.js.map +1 -1
- package/dist/ListBox.mjs +3 -2
- package/dist/ListBox.module.js +3 -2
- package/dist/ListBox.module.js.map +1 -1
- package/dist/Menu.main.js +3 -1
- package/dist/Menu.main.js.map +1 -1
- package/dist/Menu.mjs +3 -1
- package/dist/Menu.module.js +3 -1
- package/dist/Menu.module.js.map +1 -1
- package/dist/Popover.main.js +1 -1
- package/dist/Popover.main.js.map +1 -1
- package/dist/Popover.mjs +3 -3
- package/dist/Popover.module.js +3 -3
- package/dist/Popover.module.js.map +1 -1
- package/dist/Tree.main.js +151 -102
- package/dist/Tree.main.js.map +1 -1
- package/dist/Tree.mjs +153 -106
- package/dist/Tree.module.js +153 -106
- package/dist/Tree.module.js.map +1 -1
- package/dist/import.mjs +3 -3
- package/dist/main.js +4 -0
- package/dist/main.js.map +1 -1
- package/dist/module.js +3 -3
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +76 -22
- package/dist/types.d.ts.map +1 -1
- package/dist/utils.main.js.map +1 -1
- package/dist/utils.module.js.map +1 -1
- package/package.json +23 -23
- package/src/Button.tsx +4 -2
- package/src/Collection.tsx +6 -0
- package/src/ComboBox.tsx +89 -12
- package/src/DateField.tsx +14 -5
- package/src/DatePicker.tsx +11 -2
- package/src/DropZone.tsx +2 -2
- package/src/FileTrigger.tsx +2 -2
- package/src/GridList.tsx +12 -3
- package/src/HiddenDateInput.tsx +2 -1
- package/src/Keyboard.tsx +2 -2
- package/src/ListBox.tsx +5 -4
- package/src/Menu.tsx +3 -2
- package/src/Popover.tsx +3 -3
- package/src/Tree.tsx +209 -146
- package/src/index.ts +4 -3
- package/src/utils.tsx +6 -5
package/dist/ComboBox.module.js
CHANGED
|
@@ -9,11 +9,11 @@ import {ListBoxContext as $eed445e0843c11d0$export$7ff8f37d2d81a48d, ListStateCo
|
|
|
9
9
|
import {OverlayTriggerStateContext as $de32f1b87079253c$export$d2f961adcb0afbe} from "./Dialog.module.js";
|
|
10
10
|
import {PopoverContext as $07b14b47974efb58$export$9b9a0cd73afb7ca4} from "./Popover.module.js";
|
|
11
11
|
import {TextContext as $514c0188e459b4c0$export$9afb8bc826b033ea} from "./Text.module.js";
|
|
12
|
-
import {useFilter as $cP7hC$useFilter, useComboBox as $cP7hC$useComboBox} from "react-aria";
|
|
12
|
+
import {useFilter as $cP7hC$useFilter, useComboBox as $cP7hC$useComboBox, useListFormatter as $cP7hC$useListFormatter} from "react-aria";
|
|
13
13
|
import {useComboBoxState as $cP7hC$useComboBoxState} from "react-stately";
|
|
14
|
-
import {CollectionBuilder as $cP7hC$CollectionBuilder} from "@react-aria/collections";
|
|
14
|
+
import {CollectionBuilder as $cP7hC$CollectionBuilder, createHideableComponent as $cP7hC$createHideableComponent} from "@react-aria/collections";
|
|
15
15
|
import {useResizeObserver as $cP7hC$useResizeObserver, filterDOMProps as $cP7hC$filterDOMProps} from "@react-aria/utils";
|
|
16
|
-
import $cP7hC$react, {createContext as $cP7hC$createContext, forwardRef as $cP7hC$forwardRef, useMemo as $cP7hC$useMemo, useRef as $cP7hC$useRef, useState as $cP7hC$useState, useCallback as $cP7hC$useCallback} from "react";
|
|
16
|
+
import $cP7hC$react, {createContext as $cP7hC$createContext, forwardRef as $cP7hC$forwardRef, useMemo as $cP7hC$useMemo, useRef as $cP7hC$useRef, useState as $cP7hC$useState, useCallback as $cP7hC$useCallback, useContext as $cP7hC$useContext} from "react";
|
|
17
17
|
|
|
18
18
|
/*
|
|
19
19
|
* Copyright 2022 Adobe. All rights reserved.
|
|
@@ -106,7 +106,7 @@ function $d01f2c01039c0eec$var$ComboBoxInner({ props: props, collection: collect
|
|
|
106
106
|
let listBoxRef = (0, $cP7hC$useRef)(null);
|
|
107
107
|
let popoverRef = (0, $cP7hC$useRef)(null);
|
|
108
108
|
let [labelRef, label] = (0, $64fa3d84918910a7$export$9d4c57ee4c6ffdd8)(!props['aria-label'] && !props['aria-labelledby']);
|
|
109
|
-
let { buttonProps: buttonProps, inputProps: inputProps, listBoxProps: listBoxProps, labelProps: labelProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, ...validation } = (0, $cP7hC$useComboBox)({
|
|
109
|
+
let { buttonProps: buttonProps, inputProps: inputProps, listBoxProps: listBoxProps, labelProps: labelProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, valueProps: valueProps, ...validation } = (0, $cP7hC$useComboBox)({
|
|
110
110
|
...(0, $64fa3d84918910a7$export$ef03459518577ad4)(props),
|
|
111
111
|
label: label,
|
|
112
112
|
inputRef: inputRef,
|
|
@@ -157,7 +157,22 @@ function $d01f2c01039c0eec$var$ComboBoxInner({ props: props, collection: collect
|
|
|
157
157
|
global: true
|
|
158
158
|
});
|
|
159
159
|
delete DOMProps.id;
|
|
160
|
-
|
|
160
|
+
let inputs = [];
|
|
161
|
+
if (name && formValue === 'key') {
|
|
162
|
+
let values = Array.isArray(state.value) ? state.value : [
|
|
163
|
+
state.value
|
|
164
|
+
];
|
|
165
|
+
if (values.length === 0) values = [
|
|
166
|
+
null
|
|
167
|
+
];
|
|
168
|
+
inputs = values.map((value, i)=>/*#__PURE__*/ (0, $cP7hC$react).createElement("input", {
|
|
169
|
+
key: i,
|
|
170
|
+
type: "hidden",
|
|
171
|
+
name: name,
|
|
172
|
+
form: props.form,
|
|
173
|
+
value: value !== null && value !== void 0 ? value : ''
|
|
174
|
+
}));
|
|
175
|
+
}
|
|
161
176
|
return /*#__PURE__*/ (0, $cP7hC$react).createElement((0, $64fa3d84918910a7$export$2881499e37b75b9a), {
|
|
162
177
|
values: [
|
|
163
178
|
[
|
|
@@ -235,6 +250,10 @@ function $d01f2c01039c0eec$var$ComboBoxInner({ props: props, collection: collect
|
|
|
235
250
|
[
|
|
236
251
|
(0, $ee014567cb39d3f0$export$ff05c3ac10437e03),
|
|
237
252
|
validation
|
|
253
|
+
],
|
|
254
|
+
[
|
|
255
|
+
$d01f2c01039c0eec$export$5c804022b41722df,
|
|
256
|
+
valueProps
|
|
238
257
|
]
|
|
239
258
|
]
|
|
240
259
|
}, /*#__PURE__*/ (0, $cP7hC$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).div, {
|
|
@@ -247,14 +266,44 @@ function $d01f2c01039c0eec$var$ComboBoxInner({ props: props, collection: collect
|
|
|
247
266
|
"data-disabled": props.isDisabled || undefined,
|
|
248
267
|
"data-invalid": validation.isInvalid || undefined,
|
|
249
268
|
"data-required": props.isRequired || undefined
|
|
250
|
-
}
|
|
251
|
-
type: "hidden",
|
|
252
|
-
name: name,
|
|
253
|
-
form: props.form,
|
|
254
|
-
value: (_state_selectedKey = state.selectedKey) !== null && _state_selectedKey !== void 0 ? _state_selectedKey : ''
|
|
255
|
-
}));
|
|
269
|
+
}, renderProps.children, inputs));
|
|
256
270
|
}
|
|
271
|
+
const $d01f2c01039c0eec$export$5c804022b41722df = /*#__PURE__*/ (0, $cP7hC$createContext)(null);
|
|
272
|
+
const $d01f2c01039c0eec$export$3527949051a2d3a = /*#__PURE__*/ (0, $cP7hC$createHideableComponent)(function ComboBoxValue(props, ref) {
|
|
273
|
+
[props, ref] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $d01f2c01039c0eec$export$5c804022b41722df);
|
|
274
|
+
let state = (0, $cP7hC$useContext)($d01f2c01039c0eec$export$c02625b26074192c);
|
|
275
|
+
let formatter = (0, $cP7hC$useListFormatter)();
|
|
276
|
+
let selectedText = (0, $cP7hC$useMemo)(()=>formatter.format(state.selectedItems.map((item)=>(item === null || item === void 0 ? void 0 : item.textValue) || '').filter((v)=>v !== '')), [
|
|
277
|
+
formatter,
|
|
278
|
+
state.selectedItems
|
|
279
|
+
]);
|
|
280
|
+
let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({
|
|
281
|
+
...props,
|
|
282
|
+
defaultChildren: selectedText || props.placeholder,
|
|
283
|
+
defaultClassName: 'react-aria-ComboBoxValue',
|
|
284
|
+
values: {
|
|
285
|
+
selectedItems: (0, $cP7hC$useMemo)(()=>state.selectedItems.map((item)=>{
|
|
286
|
+
var _item_value;
|
|
287
|
+
return (_item_value = item.value) !== null && _item_value !== void 0 ? _item_value : null;
|
|
288
|
+
}), [
|
|
289
|
+
state.selectedItems
|
|
290
|
+
]),
|
|
291
|
+
selectedText: selectedText,
|
|
292
|
+
isPlaceholder: state.selectedItems.length === 0,
|
|
293
|
+
state: state
|
|
294
|
+
}
|
|
295
|
+
});
|
|
296
|
+
let DOMProps = (0, $cP7hC$filterDOMProps)(props, {
|
|
297
|
+
global: true
|
|
298
|
+
});
|
|
299
|
+
return /*#__PURE__*/ (0, $cP7hC$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).div, {
|
|
300
|
+
ref: ref,
|
|
301
|
+
...DOMProps,
|
|
302
|
+
...renderProps,
|
|
303
|
+
"data-placeholder": state.selectedItems.length === 0 || undefined
|
|
304
|
+
});
|
|
305
|
+
});
|
|
257
306
|
|
|
258
307
|
|
|
259
|
-
export {$d01f2c01039c0eec$export$d414ccceff7063c3 as ComboBoxContext, $d01f2c01039c0eec$export$c02625b26074192c as ComboBoxStateContext, $d01f2c01039c0eec$export$72b9695b8216309a as ComboBox};
|
|
308
|
+
export {$d01f2c01039c0eec$export$d414ccceff7063c3 as ComboBoxContext, $d01f2c01039c0eec$export$c02625b26074192c as ComboBoxStateContext, $d01f2c01039c0eec$export$72b9695b8216309a as ComboBox, $d01f2c01039c0eec$export$5c804022b41722df as ComboBoxValueContext, $d01f2c01039c0eec$export$3527949051a2d3a as ComboBoxValue};
|
|
260
309
|
//# sourceMappingURL=ComboBox.module.js.map
|
|
@@ -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, useFilter} from 'react-aria';\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, ComboBoxState, Node, useComboBoxState} from 'react-stately';\nimport {CollectionBuilder} from '@react-aria/collections';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useResizeObserver} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType, GlobalDOMAttributes, 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, {createContext, ForwardedRef, forwardRef, useCallback, useMemo, useRef, useState} from 'react';\nimport {TextContext} from './Text';\n\nexport interface ComboBoxRenderProps {\n /**\n * Whether the combobox is currently open.\n * @selector [data-open]\n */\n isOpen: boolean,\n /**\n * Whether the combobox is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the combobox is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the combobox is required.\n * @selector [data-required]\n */\n isRequired: boolean\n}\n\nexport interface ComboBoxProps<T extends object> extends Omit<AriaComboBoxProps<T>, 'children' | 'placeholder' | 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<ComboBoxRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\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.\n * When `allowsCustomValue` is `true`, this option does not apply and the text is always submitted.\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 = createContext<ContextValue<ComboBoxProps<any>, HTMLDivElement>>(null);\nexport const ComboBoxStateContext = createContext<ComboBoxState<any> | null>(null);\n\n/**\n * A combo box combines a text input with a listbox, allowing users to filter a list of options to items matching a query.\n */\nexport const ComboBox = /*#__PURE__*/ (forwardRef as forwardRefType)(function ComboBox<T extends object>(props: ComboBoxProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ComboBoxContext);\n let {children, isDisabled = false, isInvalid = false, isRequired = false} = props;\n let content = useMemo(() => (\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 })\n : children}\n </ListBoxContext.Provider>\n ), [children, isDisabled, isInvalid, isRequired, props.items, props.defaultItems]);\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 extends object> {\n props: ComboBoxProps<T>,\n collection: Collection<Node<T>>,\n comboBoxRef: RefObject<HTMLDivElement | null>\n}\n\nfunction ComboBoxInner<T extends object>({props, collection, comboBoxRef: ref}: ComboBoxInnerProps<T>) {\n let {\n name,\n formValue = 'key',\n allowsCustomValue\n } = 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 listBoxRef = useRef<HTMLDivElement>(null);\n let popoverRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n buttonProps,\n inputProps,\n listBoxProps,\n labelProps,\n descriptionProps,\n errorMessageProps,\n ...validation\n } = useComboBox({\n ...removeDataAttributes(props),\n label,\n inputRef,\n buttonRef,\n listBoxRef,\n popoverRef,\n name: formValue === 'text' ? name : undefined,\n validationBehavior\n }, state);\n\n // Make menu width match input + button\n let [menuWidth, setMenuWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (inputRef.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 // Only expose a subset of state to renderProps function to avoid infinite render loop\n let renderPropsState = useMemo(() => ({\n isOpen: state.isOpen,\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid || false,\n isRequired: props.isRequired || false\n }), [state.isOpen, props.isDisabled, validation.isInvalid, props.isRequired]);\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 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 [PopoverContext, {\n ref: popoverRef,\n triggerRef: inputRef,\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 [ListBoxContext, {...listBoxProps, ref: listBoxRef}],\n [ListStateContext, state],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [GroupContext, {isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}],\n [FieldErrorContext, validation]\n ]}>\n <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-invalid={validation.isInvalid || undefined}\n data-required={props.isRequired || undefined} />\n {name && formValue === 'key' && <input type=\"hidden\" name={name} form={props.form} value={state.selectedKey ?? ''} />}\n </Provider>\n );\n}\n"],"names":[],"version":3,"file":"ComboBox.module.js.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, useFilter, useListFormatter} from 'react-aria';\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, ComboBoxState, Node, useComboBoxState} from 'react-stately';\nimport {CollectionBuilder, createHideableComponent} from '@react-aria/collections';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useResizeObserver} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType, 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, {createContext, ForwardedRef, forwardRef, HTMLAttributes, ReactElement, ReactNode, useCallback, useContext, useMemo, useRef, useState} from 'react';\nimport {TextContext} from './Text';\n\ntype SelectionMode = 'single' | 'multiple';\n\nexport interface ComboBoxRenderProps {\n /**\n * Whether the combobox is currently open.\n * @selector [data-open]\n */\n isOpen: boolean,\n /**\n * Whether the combobox is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the combobox is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the combobox is required.\n * @selector [data-required]\n */\n isRequired: boolean\n}\n\nexport interface ComboBoxProps<T extends object, M extends SelectionMode = 'single'> extends Omit<AriaComboBoxProps<T, M>, 'children' | 'placeholder' | 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<ComboBoxRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\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.\n * When `allowsCustomValue` is `true`, this option does not apply and the text is always submitted.\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 = 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 items matching a query.\n */\nexport const ComboBox = /*#__PURE__*/ (forwardRef as forwardRefType)(function ComboBox<T extends object, M extends SelectionMode = 'single'>(props: ComboBoxProps<T, M>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ComboBoxContext);\n let {children, isDisabled = false, isInvalid = false, isRequired = false} = props;\n let content = useMemo(() => (\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 })\n : children}\n </ListBoxContext.Provider>\n ), [children, isDisabled, isInvalid, isRequired, props.items, props.defaultItems]);\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 extends object> {\n props: ComboBoxProps<T, SelectionMode>,\n collection: Collection<Node<T>>,\n comboBoxRef: RefObject<HTMLDivElement | null>\n}\n\nfunction ComboBoxInner<T extends object>({props, collection, comboBoxRef: ref}: ComboBoxInnerProps<T>) {\n let {\n name,\n formValue = 'key',\n allowsCustomValue\n } = 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 listBoxRef = useRef<HTMLDivElement>(null);\n let popoverRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let {\n buttonProps,\n inputProps,\n listBoxProps,\n labelProps,\n descriptionProps,\n errorMessageProps,\n valueProps,\n ...validation\n } = useComboBox({\n ...removeDataAttributes(props),\n label,\n inputRef,\n buttonRef,\n listBoxRef,\n popoverRef,\n name: formValue === 'text' ? name : undefined,\n validationBehavior\n }, state);\n\n // Make menu width match input + button\n let [menuWidth, setMenuWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (inputRef.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 // Only expose a subset of state to renderProps function to avoid infinite render loop\n let renderPropsState = useMemo(() => ({\n isOpen: state.isOpen,\n isDisabled: props.isDisabled || false,\n isInvalid: validation.isInvalid || false,\n isRequired: props.isRequired || false\n }), [state.isOpen, props.isDisabled, validation.isInvalid, props.isRequired]);\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 [PopoverContext, {\n ref: popoverRef,\n triggerRef: inputRef,\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 [ListBoxContext, {...listBoxProps, ref: listBoxRef}],\n [ListStateContext, state],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [GroupContext, {isInvalid: validation.isInvalid, isDisabled: props.isDisabled || false}],\n [FieldErrorContext, validation],\n [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-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 * @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 extends object> extends Omit<HTMLAttributes<HTMLElement>, keyof RenderProps<unknown>>, RenderProps<ComboBoxValueRenderProps<T>, 'div'> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\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 = createContext<ContextValue<ComboBoxValueProps<any>, HTMLDivElement>>(null);\n\n/**\n * ComboBoxValue renders the selected values of a ComboBox, or a placeholder if no value is selected.\n * By default, the items are rendered as a comma separated list. Use the render function to customize this.\n */\nexport const ComboBoxValue = /*#__PURE__*/ createHideableComponent(function ComboBoxValue<T extends object>(props: ComboBoxValueProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ComboBoxValueContext);\n let state = useContext(ComboBoxStateContext)!;\n let formatter = useListFormatter();\n let selectedText = useMemo(() => formatter.format(state.selectedItems.map(item => item?.textValue || '').filter(v => v !== '')), [formatter, state.selectedItems]);\n\n let renderProps = useRenderProps({\n ...props,\n defaultChildren: selectedText || props.placeholder,\n defaultClassName: 'react-aria-ComboBoxValue',\n values: {\n selectedItems: useMemo(() => state.selectedItems.map(item => item.value as T ?? null), [state.selectedItems]),\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"],"names":[],"version":3,"file":"ComboBox.module.js.map"}
|
package/dist/DateField.main.js
CHANGED
|
@@ -83,7 +83,8 @@ const $9eb4e1c2268ca198$export$d9781c7894a82487 = /*#__PURE__*/ (0, $hucUZ$react
|
|
|
83
83
|
state: state,
|
|
84
84
|
isInvalid: state.isInvalid,
|
|
85
85
|
isDisabled: state.isDisabled,
|
|
86
|
-
isReadOnly: state.isReadOnly
|
|
86
|
+
isReadOnly: state.isReadOnly,
|
|
87
|
+
isRequired: props.isRequired || false
|
|
87
88
|
},
|
|
88
89
|
defaultClassName: 'react-aria-DateField'
|
|
89
90
|
});
|
|
@@ -142,7 +143,8 @@ const $9eb4e1c2268ca198$export$d9781c7894a82487 = /*#__PURE__*/ (0, $hucUZ$react
|
|
|
142
143
|
slot: props.slot || undefined,
|
|
143
144
|
"data-invalid": state.isInvalid || undefined,
|
|
144
145
|
"data-disabled": state.isDisabled || undefined,
|
|
145
|
-
"data-readonly": state.isReadOnly || undefined
|
|
146
|
+
"data-readonly": state.isReadOnly || undefined,
|
|
147
|
+
"data-required": props.isRequired || undefined
|
|
146
148
|
}), /*#__PURE__*/ (0, ($parcel$interopDefault($hucUZ$react))).createElement((0, $7753596769f21492$exports.HiddenDateInput), {
|
|
147
149
|
autoComplete: props.autoComplete,
|
|
148
150
|
name: props.name,
|
|
@@ -176,7 +178,8 @@ const $9eb4e1c2268ca198$export$5eaee2322dd727eb = /*#__PURE__*/ (0, $hucUZ$react
|
|
|
176
178
|
state: state,
|
|
177
179
|
isInvalid: state.isInvalid,
|
|
178
180
|
isDisabled: state.isDisabled,
|
|
179
|
-
isReadOnly: state.isReadOnly
|
|
181
|
+
isReadOnly: state.isReadOnly,
|
|
182
|
+
isRequired: props.isRequired || false
|
|
180
183
|
},
|
|
181
184
|
defaultClassName: 'react-aria-TimeField'
|
|
182
185
|
});
|
|
@@ -235,7 +238,8 @@ const $9eb4e1c2268ca198$export$5eaee2322dd727eb = /*#__PURE__*/ (0, $hucUZ$react
|
|
|
235
238
|
slot: props.slot || undefined,
|
|
236
239
|
"data-invalid": state.isInvalid || undefined,
|
|
237
240
|
"data-disabled": state.isDisabled || undefined,
|
|
238
|
-
"data-readonly": state.isReadOnly || undefined
|
|
241
|
+
"data-readonly": state.isReadOnly || undefined,
|
|
242
|
+
"data-required": props.isRequired || undefined
|
|
239
243
|
}));
|
|
240
244
|
});
|
|
241
245
|
const $9eb4e1c2268ca198$export$7edc06cf1783b30f = /*#__PURE__*/ (0, $hucUZ$react.forwardRef)(function DateInput(props, ref) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;AAkEM,MAAM,0DAAmB,CAAA,GAAA,0BAAY,EAAqD;AAC1F,MAAM,0DAAmB,CAAA,GAAA,0BAAY,EAAqD;AAC1F,MAAM,0DAAwB,CAAA,GAAA,0BAAY,EAAyB;AACnE,MAAM,0DAAwB,CAAA,GAAA,0BAAY,EAAyB;AAMnE,MAAM,4CAA0B,AAAd,WAAW,GAAI,CAAA,GAAA,uBAAS,EAAqB,SAAS,UAA+B,KAAwB,EAAE,GAAiC;IACvK,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,EAAC,oBAAoB,sBAAsB,EAAC,GAAG,CAAA,GAAA,2CAAgB,EAAE,CAAA,GAAA,qCAAU,MAAM,CAAC;QAC7D,2BAAA;IAAzB,IAAI,qBAAqB,CAAA,OAAA,CAAA,4BAAA,MAAM,kBAAkB,cAAxB,uCAAA,4BAA4B,oCAA5B,kBAAA,OAAsD;IAC/E,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,0BAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,qCAAgB,EAAE;QAC5B,GAAG,KAAK;gBACR;wBACA;4BACA;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAkB;IACtC,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,iCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;IAEnD,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAoB;IACxC,IAAI,cAAC,UAAU,cAAE,UAAU,cAAE,UAAU,oBAAE,gBAAgB,qBAAE,iBAAiB,EAAE,GAAG,YAAW,GAAG,CAAA,GAAA,6BAAW,EAAE;QAC1G,GAAG,CAAA,GAAA,8CAAmB,EAAE,MAAM;eAC9B;kBACA;4BACA;IACF,GAAG,OAAO;IAEV,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,CAAA,GAAA,8CAAmB,EAAE,MAAM;QAC9B,QAAQ;mBACN;YACA,WAAW,MAAM,SAAS;YAC1B,YAAY,MAAM,UAAU;YAC5B,YAAY,MAAM,UAAU;QAC9B;QACA,kBAAkB;IACpB;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,0DAAC,CAAA,GAAA,kCAAO;QACN,QAAQ;YACN;gBAAC;gBAAuB;aAAM;YAC9B;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;oBAAU,WAAW,MAAM,SAAS;oBAAE,YAAY,MAAM,UAAU;gBAAA;aAAE;YACxG;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;oBAAU,aAAa;gBAAM;aAAE;YACnE;gBAAC,CAAA,GAAA,qCAAU;gBAAG;oBACZ,OAAO;wBACL,aAAa;wBACb,cAAc;oBAChB;gBACF;aAAE;YACF;gBAAC,CAAA,GAAA,2CAAgB;gBAAG;aAAW;SAChC;qBACD,0DAAC,CAAA,GAAA,6BAAE,EAAE,GAAG;QACL,GAAG,QAAQ;QACX,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,gBAAc,MAAM,SAAS,IAAI;QACjC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;sBACrC,0DAAC,CAAA,GAAA,yCAAc;QACb,cAAc,MAAM,YAAY;QAChC,MAAM,MAAM,IAAI;QAChB,YAAY,MAAM,UAAU;QAC5B,OAAO;;AAGf;AAMO,MAAM,4CAA0B,AAAd,WAAW,GAAI,CAAA,GAAA,uBAAS,EAAqB,SAAS,UAA+B,KAAwB,EAAE,GAAiC;IACvK,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,EAAC,oBAAoB,sBAAsB,EAAC,GAAG,CAAA,GAAA,2CAAgB,EAAE,CAAA,GAAA,qCAAU,MAAM,CAAC;QAC7D,2BAAA;IAAzB,IAAI,qBAAqB,CAAA,OAAA,CAAA,4BAAA,MAAM,kBAAkB,cAAxB,uCAAA,4BAA4B,oCAA5B,kBAAA,OAAsD;IAC/E,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,0BAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,qCAAgB,EAAE;QAC5B,GAAG,KAAK;gBACR;4BACA;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAkB;IACtC,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,iCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;IAEnD,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAoB;IACxC,IAAI,cAAC,UAAU,cAAE,UAAU,cAAE,UAAU,oBAAE,gBAAgB,qBAAE,iBAAiB,EAAE,GAAG,YAAW,GAAG,CAAA,GAAA,6BAAW,EAAE;QAC1G,GAAG,CAAA,GAAA,8CAAmB,EAAE,MAAM;eAC9B;kBACA;4BACA;IACF,GAAG,OAAO;IAEV,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,QAAQ;mBACN;YACA,WAAW,MAAM,SAAS;YAC1B,YAAY,MAAM,UAAU;YAC5B,YAAY,MAAM,UAAU;QAC9B;QACA,kBAAkB;IACpB;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,0DAAC,CAAA,GAAA,kCAAO;QACN,QAAQ;YACN;gBAAC;gBAAuB;aAAM;YAC9B;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;oBAAU,WAAW,MAAM,SAAS;oBAAE,YAAY,MAAM,UAAU;gBAAA;aAAE;YACxG;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;oBAAU,aAAa;gBAAM;aAAE;YACnE;gBAAC,CAAA,GAAA,qCAAU;gBAAG;oBACZ,OAAO;wBACL,aAAa;wBACb,cAAc;oBAChB;gBACF;aAAE;YACF;gBAAC,CAAA,GAAA,2CAAgB;gBAAG;aAAW;SAChC;qBACD,0DAAC,CAAA,GAAA,6BAAE,EAAE,GAAG;QACL,GAAG,QAAQ;QACX,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,gBAAc,MAAM,SAAS,IAAI;QACjC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;;AAG3C;AA2CO,MAAM,4CAA0B,AAAd,WAAW,GAAI,CAAA,GAAA,uBAAS,EAAqB,SAAS,UAAU,KAAqB,EAAE,GAAiC;IAC/I,4DAA4D;IAC5D,oFAAoF;IACpF,IAAI,iBAAiB,CAAA,GAAA,uBAAS,EAAE;IAChC,IAAI,iBAAiB,CAAA,GAAA,uBAAS,EAAE;IAChC,OAAO,kBAAkB,+BACrB,0DAAC;QAAgB,GAAG,KAAK;QAAE,KAAK;uBAChC,0DAAC;QAAqB,GAAG,KAAK;QAAE,KAAK;;AAC3C;AAEA,MAAM,0DAAsB,CAAA,GAAA,uBAAS,EAAE,CAAC,OAAuB;IAC7D,IAAI,CAAC,gBAAgB,SAAS,GAAG,CAAA,GAAA,yCAAc,EAAE;QAAC,MAAM,MAAM,IAAI;IAAA,GAA0B,KAAK;IACjG,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,0BAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,qCAAgB,EAAE;QAC5B,GAAG,cAAc;gBACjB;wBACA;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAoB;IACxC,IAAI,cAAC,UAAU,cAAE,UAAU,EAAC,GAAG,CAAA,GAAA,6BAAW,EAAE;QAAC,GAAG,cAAc;kBAAE;IAAQ,GAAG,OAAO;IAElF,qBACE,0DAAC,CAAA,GAAA,kCAAO;QACN,QAAQ;YACN;gBAAC;gBAAuB;aAAM;YAC9B;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;oBAAU,WAAW,MAAM,SAAS;oBAAE,YAAY,MAAM,UAAU;gBAAA;aAAE;SACzG;qBACD,0DAAC,sCAAmB;AAG1B;AAEA,MAAM,qDAAiB,CAAA,GAAA,uBAAS,EAAE,CAAC,OAAuB;IACxD,IAAI,aAAC,SAAS,YAAE,QAAQ,EAAC,GAAG;IAC5B,IAAI,iBAAiB,CAAA,GAAA,uBAAS,EAAE;IAChC,IAAI,iBAAiB,CAAA,GAAA,uBAAS,EAAE;IAChC,IAAI,QAAQ,2BAAA,4BAAA,iBAAkB;IAE9B,qBACE,oIACE,0DAAC,CAAA,GAAA,+BAAI;QACF,GAAG,KAAK;QACT,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,WAAW,sBAAA,uBAAA,YAAa;QACxB,YAAY,MAAM,UAAU;QAC5B,WAAW,MAAM,SAAS;QAC1B,YAAY,MAAM,UAAU;OAC3B,MAAM,QAAQ,CAAC,GAAG,CAAC,CAAC,SAAS,kBAAM,CAAA,GAAA,yBAAW,EAAE,SAAS,UAAU;YAAC,KAAK;QAAC,oBAE7E,0DAAC,CAAA,GAAA,+BAAI;QAAE,WAAU;;AAGvB;AA0DO,MAAM,4CAA4B,AAAd,WAAW,GAAI,CAAA,GAAA,uBAAS,EAAqB,SAAS,YAAY,WAAC,OAAO,EAAE,GAAG,YAA6B,EAAE,GAAkC;IACzK,IAAI,iBAAiB,CAAA,GAAA,uBAAS,EAAE;IAChC,IAAI,iBAAiB,CAAA,GAAA,uBAAS,EAAE;IAChC,IAAI,QAAQ,2BAAA,4BAAA,iBAAkB;IAC9B,IAAI,SAAS,CAAA,GAAA,kCAAW,EAAE;IAC1B,IAAI,gBAAC,YAAY,EAAC,GAAG,CAAA,GAAA,+BAAa,EAAE,SAAS,OAAO;IACpD,IAAI,cAAC,UAAU,aAAE,SAAS,kBAAE,cAAc,EAAC,GAAG,CAAA,GAAA,6BAAW;IACzD,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,yBAAO,EAAE;QAAC,GAAG,UAAU;QAAE,YAAY,MAAM,UAAU,IAAI,QAAQ,IAAI,KAAK;IAAS;IACjH,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,UAAU;QACb,QAAQ;YACN,GAAG,OAAO;YACV,YAAY,MAAM,UAAU;YAC5B,WAAW,MAAM,SAAS;YAC1B,YAAY,MAAM,UAAU;uBAC5B;uBACA;4BACA;QACF;QACA,iBAAiB,QAAQ,IAAI;QAC7B,kBAAkB;IACpB;IAEA,qBACE,0DAAC,CAAA,GAAA,6BAAE,EAAE,IAAI;QACN,GAAG,CAAA,GAAA,2BAAS,EAAE,CAAA,GAAA,oCAAa,EAAE,YAAY;YAAC,QAAQ;QAAI,IAAI,cAAc,YAAY,WAAW;QAC/F,GAAG,WAAW;QACf,OAAO,aAAa,KAAK;QACzB,KAAK;QACL,oBAAkB,QAAQ,aAAa,IAAI;QAC3C,gBAAc,MAAM,SAAS,IAAI;QACjC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;QACnC,aAAW,QAAQ,IAAI;QACvB,gBAAc,aAAa;QAC3B,gBAAc,aAAa;QAC3B,sBAAoB,kBAAkB;;AAE5C","sources":["packages/react-aria-components/src/DateField.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 {AriaDateFieldProps, AriaTimeFieldProps, DateValue, HoverEvents, mergeProps, TimeValue, useDateField, useDateSegment, useFocusRing, useHover, useLocale, useTimeField} from 'react-aria';\nimport {\n ClassNameOrFunction,\n ContextValue,\n dom,\n Provider,\n RACValidation,\n removeDataAttributes,\n RenderProps,\n SlotProps,\n StyleRenderProps,\n useContextProps,\n useRenderProps,\n useSlot,\n useSlottedContext\n} from './utils';\nimport {createCalendar} from '@internationalized/date';\nimport {DateFieldState, DateSegmentType, DateSegment as IDateSegment, TimeFieldState, useDateFieldState, useTimeFieldState} from 'react-stately';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useObjectRef} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType, GlobalDOMAttributes} from '@react-types/shared';\nimport {Group, GroupContext} from './Group';\nimport {HiddenDateInput} from './HiddenDateInput';\nimport {Input, InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport React, {cloneElement, createContext, ForwardedRef, forwardRef, JSX, ReactElement, useContext, useRef} from 'react';\nimport {TextContext} from './Text';\n\nexport interface DateFieldRenderProps {\n /**\n * State of the date field.\n */\n state: DateFieldState,\n /**\n * Whether the date field is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the date field is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the date field is read only.\n * @selector [data-readonly]\n */\n isReadOnly: boolean\n}\nexport interface DateFieldProps<T extends DateValue> extends Omit<AriaDateFieldProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<DateFieldRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-DateField'\n */\n className?: ClassNameOrFunction<DateFieldRenderProps>\n}\nexport interface TimeFieldProps<T extends TimeValue> extends Omit<AriaTimeFieldProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<DateFieldRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-TimeField'\n */\n className?: ClassNameOrFunction<DateFieldRenderProps>\n}\n\nexport const DateFieldContext = createContext<ContextValue<DateFieldProps<any>, HTMLDivElement>>(null);\nexport const TimeFieldContext = createContext<ContextValue<TimeFieldProps<any>, HTMLDivElement>>(null);\nexport const DateFieldStateContext = createContext<DateFieldState | null>(null);\nexport const TimeFieldStateContext = createContext<TimeFieldState | null>(null);\n\n/**\n * A date field allows users to enter and edit date and time values using a keyboard.\n * Each part of a date value is displayed in an individually editable segment.\n */\nexport const DateField = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateField<T extends DateValue>(props: DateFieldProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, DateFieldContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let {locale} = useLocale();\n let state = useDateFieldState({\n ...props,\n locale,\n createCalendar,\n validationBehavior\n });\n\n let fieldRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let inputRef = useRef<HTMLInputElement>(null);\n let {labelProps, fieldProps, inputProps, descriptionProps, errorMessageProps, ...validation} = useDateField({\n ...removeDataAttributes(props),\n label,\n inputRef,\n validationBehavior\n }, state, fieldRef);\n\n let renderProps = useRenderProps({\n ...removeDataAttributes(props),\n values: {\n state,\n isInvalid: state.isInvalid,\n isDisabled: state.isDisabled,\n isReadOnly: state.isReadOnly\n },\n defaultClassName: 'react-aria-DateField'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [DateFieldStateContext, state],\n [GroupContext, {...fieldProps, ref: fieldRef, isInvalid: state.isInvalid, isDisabled: state.isDisabled}],\n [InputContext, {...inputProps, ref: inputRef}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <dom.div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-invalid={state.isInvalid || undefined}\n data-disabled={state.isDisabled || undefined}\n data-readonly={state.isReadOnly || undefined} />\n <HiddenDateInput\n autoComplete={props.autoComplete}\n name={props.name}\n isDisabled={props.isDisabled}\n state={state} />\n </Provider>\n );\n});\n\n/**\n * A time field allows users to enter and edit time values using a keyboard.\n * Each part of a time value is displayed in an individually editable segment.\n */\nexport const TimeField = /*#__PURE__*/ (forwardRef as forwardRefType)(function TimeField<T extends TimeValue>(props: TimeFieldProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, TimeFieldContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let {locale} = useLocale();\n let state = useTimeFieldState({\n ...props,\n locale,\n validationBehavior\n });\n\n let fieldRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let inputRef = useRef<HTMLInputElement>(null);\n let {labelProps, fieldProps, inputProps, descriptionProps, errorMessageProps, ...validation} = useTimeField({\n ...removeDataAttributes(props),\n label,\n inputRef,\n validationBehavior\n }, state, fieldRef);\n\n let renderProps = useRenderProps({\n ...props,\n values: {\n state,\n isInvalid: state.isInvalid,\n isDisabled: state.isDisabled,\n isReadOnly: state.isReadOnly\n },\n defaultClassName: 'react-aria-TimeField'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [TimeFieldStateContext, state],\n [GroupContext, {...fieldProps, ref: fieldRef, isInvalid: state.isInvalid, isDisabled: state.isDisabled}],\n [InputContext, {...inputProps, ref: inputRef}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <dom.div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-invalid={state.isInvalid || undefined}\n data-disabled={state.isDisabled || undefined}\n data-readonly={state.isReadOnly || undefined} />\n </Provider>\n );\n});\n\nexport interface DateInputRenderProps {\n /**\n * Whether the date input is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether an element within the date input is focused, either via a mouse or keyboard.\n * @selector [data-focus-within]\n */\n isFocusWithin: boolean,\n /**\n * Whether an element within the date input is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the date input is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n\n /**\n * Whether the date input is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean\n}\n\nexport interface DateInputProps extends SlotProps, StyleRenderProps<DateInputRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-DateInput'\n */\n className?: ClassNameOrFunction<DateInputRenderProps>,\n children: (segment: IDateSegment) => ReactElement\n}\n\n/**\n * A date input groups the editable date segments within a date field.\n */\nexport const DateInput = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateInput(props: DateInputProps, ref: ForwardedRef<HTMLDivElement>): JSX.Element {\n // If state is provided by DateField/TimeField, just render.\n // Otherwise (e.g. in DatePicker), we need to call hooks and create state ourselves.\n let dateFieldState = useContext(DateFieldStateContext);\n let timeFieldState = useContext(TimeFieldStateContext);\n return dateFieldState || timeFieldState\n ? <DateInputInner {...props} ref={ref} />\n : <DateInputStandalone {...props} ref={ref} />;\n});\n\nconst DateInputStandalone = forwardRef((props: DateInputProps, ref: ForwardedRef<HTMLDivElement>) => {\n let [dateFieldProps, fieldRef] = useContextProps({slot: props.slot} as DateFieldProps<any>, ref, DateFieldContext);\n let {locale} = useLocale();\n let state = useDateFieldState({\n ...dateFieldProps,\n locale,\n createCalendar\n });\n\n let inputRef = useRef<HTMLInputElement>(null);\n let {fieldProps, inputProps} = useDateField({...dateFieldProps, inputRef}, state, fieldRef);\n\n return (\n <Provider\n values={[\n [DateFieldStateContext, state],\n [InputContext, {...inputProps, ref: inputRef}],\n [GroupContext, {...fieldProps, ref: fieldRef, isInvalid: state.isInvalid, isDisabled: state.isDisabled}]\n ]}>\n <DateInputInner {...props} />\n </Provider>\n );\n});\n\nconst DateInputInner = forwardRef((props: DateInputProps, ref: ForwardedRef<HTMLDivElement>) => {\n let {className, children} = props;\n let dateFieldState = useContext(DateFieldStateContext);\n let timeFieldState = useContext(TimeFieldStateContext);\n let state = dateFieldState ?? timeFieldState!;\n\n return (\n <>\n <Group\n {...props}\n ref={ref}\n slot={props.slot || undefined}\n className={className ?? 'react-aria-DateInput'}\n isReadOnly={state.isReadOnly}\n isInvalid={state.isInvalid}\n isDisabled={state.isDisabled}>\n {state.segments.map((segment, i) => cloneElement(children(segment), {key: i}))}\n </Group>\n <Input className=\"\" />\n </>\n );\n});\n\nexport interface DateSegmentRenderProps extends Omit<IDateSegment, 'isEditable'> {\n /**\n * Whether the segment is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether the segment is focused, either via a mouse or keyboard.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the segment is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the value is a placeholder.\n * @selector [data-placeholder]\n */\n isPlaceholder: boolean,\n /**\n * Whether the segment is read only.\n * @selector [data-readonly]\n */\n isReadOnly: boolean,\n /**\n * Whether the date field is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the date field is in an invalid state.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * The type of segment. Values include `literal`, `year`, `month`, `day`, etc.\n * @selector [data-type=\"...\"]\n */\n type: DateSegmentType\n}\n\nexport interface DateSegmentProps extends RenderProps<DateSegmentRenderProps, 'span'>, HoverEvents, GlobalDOMAttributes<HTMLSpanElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-DateSegment'\n */\n className?: ClassNameOrFunction<DateSegmentRenderProps>,\n segment: IDateSegment\n}\n\n/**\n * A date segment displays an individual unit of a date and time, and allows users to edit\n * the value by typing or using the arrow keys to increment and decrement.\n */\nexport const DateSegment = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateSegment({segment, ...otherProps}: DateSegmentProps, ref: ForwardedRef<HTMLSpanElement>) {\n let dateFieldState = useContext(DateFieldStateContext);\n let timeFieldState = useContext(TimeFieldStateContext);\n let state = dateFieldState ?? timeFieldState!;\n let domRef = useObjectRef(ref);\n let {segmentProps} = useDateSegment(segment, state, domRef);\n let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n let {hoverProps, isHovered} = useHover({...otherProps, isDisabled: state.isDisabled || segment.type === 'literal'});\n let renderProps = useRenderProps({\n ...otherProps,\n values: {\n ...segment,\n isReadOnly: state.isReadOnly,\n isInvalid: state.isInvalid,\n isDisabled: state.isDisabled,\n isHovered,\n isFocused,\n isFocusVisible\n },\n defaultChildren: segment.text,\n defaultClassName: 'react-aria-DateSegment'\n });\n\n return (\n <dom.span\n {...mergeProps(filterDOMProps(otherProps, {global: true}), segmentProps, focusProps, hoverProps)}\n {...renderProps}\n style={segmentProps.style}\n ref={domRef}\n data-placeholder={segment.isPlaceholder || undefined}\n data-invalid={state.isInvalid || undefined}\n data-readonly={state.isReadOnly || undefined}\n data-disabled={state.isDisabled || undefined}\n data-type={segment.type}\n data-hovered={isHovered || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined} />\n );\n});\n"],"names":[],"version":3,"file":"DateField.main.js.map"}
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;AAuEM,MAAM,0DAAmB,CAAA,GAAA,0BAAY,EAAqD;AAC1F,MAAM,0DAAmB,CAAA,GAAA,0BAAY,EAAqD;AAC1F,MAAM,0DAAwB,CAAA,GAAA,0BAAY,EAAyB;AACnE,MAAM,0DAAwB,CAAA,GAAA,0BAAY,EAAyB;AAMnE,MAAM,4CAA0B,AAAd,WAAW,GAAI,CAAA,GAAA,uBAAS,EAAqB,SAAS,UAA+B,KAAwB,EAAE,GAAiC;IACvK,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,EAAC,oBAAoB,sBAAsB,EAAC,GAAG,CAAA,GAAA,2CAAgB,EAAE,CAAA,GAAA,qCAAU,MAAM,CAAC;QAC7D,2BAAA;IAAzB,IAAI,qBAAqB,CAAA,OAAA,CAAA,4BAAA,MAAM,kBAAkB,cAAxB,uCAAA,4BAA4B,oCAA5B,kBAAA,OAAsD;IAC/E,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,0BAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,qCAAgB,EAAE;QAC5B,GAAG,KAAK;gBACR;wBACA;4BACA;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAkB;IACtC,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,iCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;IAEnD,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAoB;IACxC,IAAI,cAAC,UAAU,cAAE,UAAU,cAAE,UAAU,oBAAE,gBAAgB,qBAAE,iBAAiB,EAAE,GAAG,YAAW,GAAG,CAAA,GAAA,6BAAW,EAAE;QAC1G,GAAG,CAAA,GAAA,8CAAmB,EAAE,MAAM;eAC9B;kBACA;4BACA;IACF,GAAG,OAAO;IAEV,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,CAAA,GAAA,8CAAmB,EAAE,MAAM;QAC9B,QAAQ;mBACN;YACA,WAAW,MAAM,SAAS;YAC1B,YAAY,MAAM,UAAU;YAC5B,YAAY,MAAM,UAAU;YAC5B,YAAY,MAAM,UAAU,IAAI;QAClC;QACA,kBAAkB;IACpB;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,0DAAC,CAAA,GAAA,kCAAO;QACN,QAAQ;YACN;gBAAC;gBAAuB;aAAM;YAC9B;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;oBAAU,WAAW,MAAM,SAAS;oBAAE,YAAY,MAAM,UAAU;gBAAA;aAAE;YACxG;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;oBAAU,aAAa;gBAAM;aAAE;YACnE;gBAAC,CAAA,GAAA,qCAAU;gBAAG;oBACZ,OAAO;wBACL,aAAa;wBACb,cAAc;oBAChB;gBACF;aAAE;YACF;gBAAC,CAAA,GAAA,2CAAgB;gBAAG;aAAW;SAChC;qBACD,0DAAC,CAAA,GAAA,6BAAE,EAAE,GAAG;QACL,GAAG,QAAQ;QACX,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,gBAAc,MAAM,SAAS,IAAI;QACjC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;sBACrC,0DAAC,CAAA,GAAA,yCAAc;QACb,cAAc,MAAM,YAAY;QAChC,MAAM,MAAM,IAAI;QAChB,YAAY,MAAM,UAAU;QAC5B,OAAO;;AAGf;AAMO,MAAM,4CAA0B,AAAd,WAAW,GAAI,CAAA,GAAA,uBAAS,EAAqB,SAAS,UAA+B,KAAwB,EAAE,GAAiC;IACvK,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,EAAC,oBAAoB,sBAAsB,EAAC,GAAG,CAAA,GAAA,2CAAgB,EAAE,CAAA,GAAA,qCAAU,MAAM,CAAC;QAC7D,2BAAA;IAAzB,IAAI,qBAAqB,CAAA,OAAA,CAAA,4BAAA,MAAM,kBAAkB,cAAxB,uCAAA,4BAA4B,oCAA5B,kBAAA,OAAsD;IAC/E,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,0BAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,qCAAgB,EAAE;QAC5B,GAAG,KAAK;gBACR;4BACA;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAkB;IACtC,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,iCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;IAEnD,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAoB;IACxC,IAAI,cAAC,UAAU,cAAE,UAAU,cAAE,UAAU,oBAAE,gBAAgB,qBAAE,iBAAiB,EAAE,GAAG,YAAW,GAAG,CAAA,GAAA,6BAAW,EAAE;QAC1G,GAAG,CAAA,GAAA,8CAAmB,EAAE,MAAM;eAC9B;kBACA;4BACA;IACF,GAAG,OAAO;IAEV,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,QAAQ;mBACN;YACA,WAAW,MAAM,SAAS;YAC1B,YAAY,MAAM,UAAU;YAC5B,YAAY,MAAM,UAAU;YAC5B,YAAY,MAAM,UAAU,IAAI;QAClC;QACA,kBAAkB;IACpB;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,0DAAC,CAAA,GAAA,kCAAO;QACN,QAAQ;YACN;gBAAC;gBAAuB;aAAM;YAC9B;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;oBAAU,WAAW,MAAM,SAAS;oBAAE,YAAY,MAAM,UAAU;gBAAA;aAAE;YACxG;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;oBAAU,aAAa;gBAAM;aAAE;YACnE;gBAAC,CAAA,GAAA,qCAAU;gBAAG;oBACZ,OAAO;wBACL,aAAa;wBACb,cAAc;oBAChB;gBACF;aAAE;YACF;gBAAC,CAAA,GAAA,2CAAgB;gBAAG;aAAW;SAChC;qBACD,0DAAC,CAAA,GAAA,6BAAE,EAAE,GAAG;QACL,GAAG,QAAQ;QACX,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,gBAAc,MAAM,SAAS,IAAI;QACjC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;;AAG3C;AA2CO,MAAM,4CAA0B,AAAd,WAAW,GAAI,CAAA,GAAA,uBAAS,EAAqB,SAAS,UAAU,KAAqB,EAAE,GAAiC;IAC/I,4DAA4D;IAC5D,oFAAoF;IACpF,IAAI,iBAAiB,CAAA,GAAA,uBAAS,EAAE;IAChC,IAAI,iBAAiB,CAAA,GAAA,uBAAS,EAAE;IAChC,OAAO,kBAAkB,+BACrB,0DAAC;QAAgB,GAAG,KAAK;QAAE,KAAK;uBAChC,0DAAC;QAAqB,GAAG,KAAK;QAAE,KAAK;;AAC3C;AAEA,MAAM,0DAAsB,CAAA,GAAA,uBAAS,EAAE,CAAC,OAAuB;IAC7D,IAAI,CAAC,gBAAgB,SAAS,GAAG,CAAA,GAAA,yCAAc,EAAE;QAAC,MAAM,MAAM,IAAI;IAAA,GAA0B,KAAK;IACjG,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,0BAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,qCAAgB,EAAE;QAC5B,GAAG,cAAc;gBACjB;wBACA;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAoB;IACxC,IAAI,cAAC,UAAU,cAAE,UAAU,EAAC,GAAG,CAAA,GAAA,6BAAW,EAAE;QAAC,GAAG,cAAc;kBAAE;IAAQ,GAAG,OAAO;IAElF,qBACE,0DAAC,CAAA,GAAA,kCAAO;QACN,QAAQ;YACN;gBAAC;gBAAuB;aAAM;YAC9B;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,sCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;oBAAU,WAAW,MAAM,SAAS;oBAAE,YAAY,MAAM,UAAU;gBAAA;aAAE;SACzG;qBACD,0DAAC,sCAAmB;AAG1B;AAEA,MAAM,qDAAiB,CAAA,GAAA,uBAAS,EAAE,CAAC,OAAuB;IACxD,IAAI,aAAC,SAAS,YAAE,QAAQ,EAAC,GAAG;IAC5B,IAAI,iBAAiB,CAAA,GAAA,uBAAS,EAAE;IAChC,IAAI,iBAAiB,CAAA,GAAA,uBAAS,EAAE;IAChC,IAAI,QAAQ,2BAAA,4BAAA,iBAAkB;IAE9B,qBACE,oIACE,0DAAC,CAAA,GAAA,+BAAI;QACF,GAAG,KAAK;QACT,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,WAAW,sBAAA,uBAAA,YAAa;QACxB,YAAY,MAAM,UAAU;QAC5B,WAAW,MAAM,SAAS;QAC1B,YAAY,MAAM,UAAU;OAC3B,MAAM,QAAQ,CAAC,GAAG,CAAC,CAAC,SAAS,kBAAM,CAAA,GAAA,yBAAW,EAAE,SAAS,UAAU;YAAC,KAAK;QAAC,oBAE7E,0DAAC,CAAA,GAAA,+BAAI;QAAE,WAAU;;AAGvB;AA0DO,MAAM,4CAA4B,AAAd,WAAW,GAAI,CAAA,GAAA,uBAAS,EAAqB,SAAS,YAAY,WAAC,OAAO,EAAE,GAAG,YAA6B,EAAE,GAAkC;IACzK,IAAI,iBAAiB,CAAA,GAAA,uBAAS,EAAE;IAChC,IAAI,iBAAiB,CAAA,GAAA,uBAAS,EAAE;IAChC,IAAI,QAAQ,2BAAA,4BAAA,iBAAkB;IAC9B,IAAI,SAAS,CAAA,GAAA,kCAAW,EAAE;IAC1B,IAAI,gBAAC,YAAY,EAAC,GAAG,CAAA,GAAA,+BAAa,EAAE,SAAS,OAAO;IACpD,IAAI,cAAC,UAAU,aAAE,SAAS,kBAAE,cAAc,EAAC,GAAG,CAAA,GAAA,6BAAW;IACzD,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,yBAAO,EAAE;QAAC,GAAG,UAAU;QAAE,YAAY,MAAM,UAAU,IAAI,QAAQ,IAAI,KAAK;IAAS;IACjH,IAAI,cAAc,CAAA,GAAA,wCAAa,EAAE;QAC/B,GAAG,UAAU;QACb,QAAQ;YACN,GAAG,OAAO;YACV,YAAY,MAAM,UAAU;YAC5B,WAAW,MAAM,SAAS;YAC1B,YAAY,MAAM,UAAU;uBAC5B;uBACA;4BACA;QACF;QACA,iBAAiB,QAAQ,IAAI;QAC7B,kBAAkB;IACpB;IAEA,qBACE,0DAAC,CAAA,GAAA,6BAAE,EAAE,IAAI;QACN,GAAG,CAAA,GAAA,2BAAS,EAAE,CAAA,GAAA,oCAAa,EAAE,YAAY;YAAC,QAAQ;QAAI,IAAI,cAAc,YAAY,WAAW;QAC/F,GAAG,WAAW;QACf,OAAO,aAAa,KAAK;QACzB,KAAK;QACL,oBAAkB,QAAQ,aAAa,IAAI;QAC3C,gBAAc,MAAM,SAAS,IAAI;QACjC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;QACnC,aAAW,QAAQ,IAAI;QACvB,gBAAc,aAAa;QAC3B,gBAAc,aAAa;QAC3B,sBAAoB,kBAAkB;;AAE5C","sources":["packages/react-aria-components/src/DateField.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 {AriaDateFieldProps, AriaTimeFieldProps, DateValue, HoverEvents, mergeProps, TimeValue, useDateField, useDateSegment, useFocusRing, useHover, useLocale, useTimeField} from 'react-aria';\nimport {\n ClassNameOrFunction,\n ContextValue,\n dom,\n Provider,\n RACValidation,\n removeDataAttributes,\n RenderProps,\n SlotProps,\n StyleRenderProps,\n useContextProps,\n useRenderProps,\n useSlot,\n useSlottedContext\n} from './utils';\nimport {createCalendar} from '@internationalized/date';\nimport {DateFieldState, DateSegmentType, DateSegment as IDateSegment, TimeFieldState, useDateFieldState, useTimeFieldState} from 'react-stately';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useObjectRef} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType, GlobalDOMAttributes} from '@react-types/shared';\nimport {Group, GroupContext} from './Group';\nimport {HiddenDateInput} from './HiddenDateInput';\nimport {Input, InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport React, {cloneElement, createContext, ForwardedRef, forwardRef, JSX, ReactElement, useContext, useRef} from 'react';\nimport {TextContext} from './Text';\n\nexport interface DateFieldRenderProps {\n /**\n * State of the date field.\n */\n state: DateFieldState,\n /**\n * Whether the date field is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the date field is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the date field is read only.\n * @selector [data-readonly]\n */\n isReadOnly: boolean,\n /**\n * Whether the date field is required.\n * @selector [data-required]\n */\n isRequired: boolean\n}\nexport interface DateFieldProps<T extends DateValue> extends Omit<AriaDateFieldProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<DateFieldRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-DateField'\n */\n className?: ClassNameOrFunction<DateFieldRenderProps>\n}\nexport interface TimeFieldProps<T extends TimeValue> extends Omit<AriaTimeFieldProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<DateFieldRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-TimeField'\n */\n className?: ClassNameOrFunction<DateFieldRenderProps>\n}\n\nexport const DateFieldContext = createContext<ContextValue<DateFieldProps<any>, HTMLDivElement>>(null);\nexport const TimeFieldContext = createContext<ContextValue<TimeFieldProps<any>, HTMLDivElement>>(null);\nexport const DateFieldStateContext = createContext<DateFieldState | null>(null);\nexport const TimeFieldStateContext = createContext<TimeFieldState | null>(null);\n\n/**\n * A date field allows users to enter and edit date and time values using a keyboard.\n * Each part of a date value is displayed in an individually editable segment.\n */\nexport const DateField = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateField<T extends DateValue>(props: DateFieldProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, DateFieldContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let {locale} = useLocale();\n let state = useDateFieldState({\n ...props,\n locale,\n createCalendar,\n validationBehavior\n });\n\n let fieldRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let inputRef = useRef<HTMLInputElement>(null);\n let {labelProps, fieldProps, inputProps, descriptionProps, errorMessageProps, ...validation} = useDateField({\n ...removeDataAttributes(props),\n label,\n inputRef,\n validationBehavior\n }, state, fieldRef);\n\n let renderProps = useRenderProps({\n ...removeDataAttributes(props),\n values: {\n state,\n isInvalid: state.isInvalid,\n isDisabled: state.isDisabled,\n isReadOnly: state.isReadOnly,\n isRequired: props.isRequired || false\n },\n defaultClassName: 'react-aria-DateField'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [DateFieldStateContext, state],\n [GroupContext, {...fieldProps, ref: fieldRef, isInvalid: state.isInvalid, isDisabled: state.isDisabled}],\n [InputContext, {...inputProps, ref: inputRef}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <dom.div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-invalid={state.isInvalid || undefined}\n data-disabled={state.isDisabled || undefined}\n data-readonly={state.isReadOnly || undefined}\n data-required={props.isRequired || undefined} />\n <HiddenDateInput\n autoComplete={props.autoComplete}\n name={props.name}\n isDisabled={props.isDisabled}\n state={state} />\n </Provider>\n );\n});\n\n/**\n * A time field allows users to enter and edit time values using a keyboard.\n * Each part of a time value is displayed in an individually editable segment.\n */\nexport const TimeField = /*#__PURE__*/ (forwardRef as forwardRefType)(function TimeField<T extends TimeValue>(props: TimeFieldProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, TimeFieldContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let {locale} = useLocale();\n let state = useTimeFieldState({\n ...props,\n locale,\n validationBehavior\n });\n\n let fieldRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let inputRef = useRef<HTMLInputElement>(null);\n let {labelProps, fieldProps, inputProps, descriptionProps, errorMessageProps, ...validation} = useTimeField({\n ...removeDataAttributes(props),\n label,\n inputRef,\n validationBehavior\n }, state, fieldRef);\n\n let renderProps = useRenderProps({\n ...props,\n values: {\n state,\n isInvalid: state.isInvalid,\n isDisabled: state.isDisabled,\n isReadOnly: state.isReadOnly,\n isRequired: props.isRequired || false\n },\n defaultClassName: 'react-aria-TimeField'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [TimeFieldStateContext, state],\n [GroupContext, {...fieldProps, ref: fieldRef, isInvalid: state.isInvalid, isDisabled: state.isDisabled}],\n [InputContext, {...inputProps, ref: inputRef}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <dom.div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-invalid={state.isInvalid || undefined}\n data-disabled={state.isDisabled || undefined}\n data-readonly={state.isReadOnly || undefined}\n data-required={props.isRequired || undefined} />\n </Provider>\n );\n});\n\nexport interface DateInputRenderProps {\n /**\n * Whether the date input is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether an element within the date input is focused, either via a mouse or keyboard.\n * @selector [data-focus-within]\n */\n isFocusWithin: boolean,\n /**\n * Whether an element within the date input is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the date input is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n\n /**\n * Whether the date input is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean\n}\n\nexport interface DateInputProps extends SlotProps, StyleRenderProps<DateInputRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-DateInput'\n */\n className?: ClassNameOrFunction<DateInputRenderProps>,\n children: (segment: IDateSegment) => ReactElement\n}\n\n/**\n * A date input groups the editable date segments within a date field.\n */\nexport const DateInput = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateInput(props: DateInputProps, ref: ForwardedRef<HTMLDivElement>): JSX.Element {\n // If state is provided by DateField/TimeField, just render.\n // Otherwise (e.g. in DatePicker), we need to call hooks and create state ourselves.\n let dateFieldState = useContext(DateFieldStateContext);\n let timeFieldState = useContext(TimeFieldStateContext);\n return dateFieldState || timeFieldState\n ? <DateInputInner {...props} ref={ref} />\n : <DateInputStandalone {...props} ref={ref} />;\n});\n\nconst DateInputStandalone = forwardRef((props: DateInputProps, ref: ForwardedRef<HTMLDivElement>) => {\n let [dateFieldProps, fieldRef] = useContextProps({slot: props.slot} as DateFieldProps<any>, ref, DateFieldContext);\n let {locale} = useLocale();\n let state = useDateFieldState({\n ...dateFieldProps,\n locale,\n createCalendar\n });\n\n let inputRef = useRef<HTMLInputElement>(null);\n let {fieldProps, inputProps} = useDateField({...dateFieldProps, inputRef}, state, fieldRef);\n\n return (\n <Provider\n values={[\n [DateFieldStateContext, state],\n [InputContext, {...inputProps, ref: inputRef}],\n [GroupContext, {...fieldProps, ref: fieldRef, isInvalid: state.isInvalid, isDisabled: state.isDisabled}]\n ]}>\n <DateInputInner {...props} />\n </Provider>\n );\n});\n\nconst DateInputInner = forwardRef((props: DateInputProps, ref: ForwardedRef<HTMLDivElement>) => {\n let {className, children} = props;\n let dateFieldState = useContext(DateFieldStateContext);\n let timeFieldState = useContext(TimeFieldStateContext);\n let state = dateFieldState ?? timeFieldState!;\n\n return (\n <>\n <Group\n {...props}\n ref={ref}\n slot={props.slot || undefined}\n className={className ?? 'react-aria-DateInput'}\n isReadOnly={state.isReadOnly}\n isInvalid={state.isInvalid}\n isDisabled={state.isDisabled}>\n {state.segments.map((segment, i) => cloneElement(children(segment), {key: i}))}\n </Group>\n <Input className=\"\" />\n </>\n );\n});\n\nexport interface DateSegmentRenderProps extends Omit<IDateSegment, 'isEditable'> {\n /**\n * Whether the segment is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether the segment is focused, either via a mouse or keyboard.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the segment is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the value is a placeholder.\n * @selector [data-placeholder]\n */\n isPlaceholder: boolean,\n /**\n * Whether the segment is read only.\n * @selector [data-readonly]\n */\n isReadOnly: boolean,\n /**\n * Whether the date field is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the date field is in an invalid state.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * The type of segment. Values include `literal`, `year`, `month`, `day`, etc.\n * @selector [data-type=\"...\"]\n */\n type: DateSegmentType\n}\n\nexport interface DateSegmentProps extends RenderProps<DateSegmentRenderProps, 'span'>, HoverEvents, GlobalDOMAttributes<HTMLSpanElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-DateSegment'\n */\n className?: ClassNameOrFunction<DateSegmentRenderProps>,\n segment: IDateSegment\n}\n\n/**\n * A date segment displays an individual unit of a date and time, and allows users to edit\n * the value by typing or using the arrow keys to increment and decrement.\n */\nexport const DateSegment = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateSegment({segment, ...otherProps}: DateSegmentProps, ref: ForwardedRef<HTMLSpanElement>) {\n let dateFieldState = useContext(DateFieldStateContext);\n let timeFieldState = useContext(TimeFieldStateContext);\n let state = dateFieldState ?? timeFieldState!;\n let domRef = useObjectRef(ref);\n let {segmentProps} = useDateSegment(segment, state, domRef);\n let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n let {hoverProps, isHovered} = useHover({...otherProps, isDisabled: state.isDisabled || segment.type === 'literal'});\n let renderProps = useRenderProps({\n ...otherProps,\n values: {\n ...segment,\n isReadOnly: state.isReadOnly,\n isInvalid: state.isInvalid,\n isDisabled: state.isDisabled,\n isHovered,\n isFocused,\n isFocusVisible\n },\n defaultChildren: segment.text,\n defaultClassName: 'react-aria-DateSegment'\n });\n\n return (\n <dom.span\n {...mergeProps(filterDOMProps(otherProps, {global: true}), segmentProps, focusProps, hoverProps)}\n {...renderProps}\n style={segmentProps.style}\n ref={domRef}\n data-placeholder={segment.isPlaceholder || undefined}\n data-invalid={state.isInvalid || undefined}\n data-readonly={state.isReadOnly || undefined}\n data-disabled={state.isDisabled || undefined}\n data-type={segment.type}\n data-hovered={isHovered || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined} />\n );\n});\n"],"names":[],"version":3,"file":"DateField.main.js.map"}
|
package/dist/DateField.mjs
CHANGED
|
@@ -66,7 +66,8 @@ const $40825cdb76e74f70$export$d9781c7894a82487 = /*#__PURE__*/ (0, $a9Sgq$forwa
|
|
|
66
66
|
state: state,
|
|
67
67
|
isInvalid: state.isInvalid,
|
|
68
68
|
isDisabled: state.isDisabled,
|
|
69
|
-
isReadOnly: state.isReadOnly
|
|
69
|
+
isReadOnly: state.isReadOnly,
|
|
70
|
+
isRequired: props.isRequired || false
|
|
70
71
|
},
|
|
71
72
|
defaultClassName: 'react-aria-DateField'
|
|
72
73
|
});
|
|
@@ -125,7 +126,8 @@ const $40825cdb76e74f70$export$d9781c7894a82487 = /*#__PURE__*/ (0, $a9Sgq$forwa
|
|
|
125
126
|
slot: props.slot || undefined,
|
|
126
127
|
"data-invalid": state.isInvalid || undefined,
|
|
127
128
|
"data-disabled": state.isDisabled || undefined,
|
|
128
|
-
"data-readonly": state.isReadOnly || undefined
|
|
129
|
+
"data-readonly": state.isReadOnly || undefined,
|
|
130
|
+
"data-required": props.isRequired || undefined
|
|
129
131
|
}), /*#__PURE__*/ (0, $a9Sgq$react).createElement((0, $c699643d2073b351$export$eefa3e19139f00f3), {
|
|
130
132
|
autoComplete: props.autoComplete,
|
|
131
133
|
name: props.name,
|
|
@@ -159,7 +161,8 @@ const $40825cdb76e74f70$export$5eaee2322dd727eb = /*#__PURE__*/ (0, $a9Sgq$forwa
|
|
|
159
161
|
state: state,
|
|
160
162
|
isInvalid: state.isInvalid,
|
|
161
163
|
isDisabled: state.isDisabled,
|
|
162
|
-
isReadOnly: state.isReadOnly
|
|
164
|
+
isReadOnly: state.isReadOnly,
|
|
165
|
+
isRequired: props.isRequired || false
|
|
163
166
|
},
|
|
164
167
|
defaultClassName: 'react-aria-TimeField'
|
|
165
168
|
});
|
|
@@ -218,7 +221,8 @@ const $40825cdb76e74f70$export$5eaee2322dd727eb = /*#__PURE__*/ (0, $a9Sgq$forwa
|
|
|
218
221
|
slot: props.slot || undefined,
|
|
219
222
|
"data-invalid": state.isInvalid || undefined,
|
|
220
223
|
"data-disabled": state.isDisabled || undefined,
|
|
221
|
-
"data-readonly": state.isReadOnly || undefined
|
|
224
|
+
"data-readonly": state.isReadOnly || undefined,
|
|
225
|
+
"data-required": props.isRequired || undefined
|
|
222
226
|
}));
|
|
223
227
|
});
|
|
224
228
|
const $40825cdb76e74f70$export$7edc06cf1783b30f = /*#__PURE__*/ (0, $a9Sgq$forwardRef)(function DateInput(props, ref) {
|
package/dist/DateField.module.js
CHANGED
|
@@ -66,7 +66,8 @@ const $40825cdb76e74f70$export$d9781c7894a82487 = /*#__PURE__*/ (0, $a9Sgq$forwa
|
|
|
66
66
|
state: state,
|
|
67
67
|
isInvalid: state.isInvalid,
|
|
68
68
|
isDisabled: state.isDisabled,
|
|
69
|
-
isReadOnly: state.isReadOnly
|
|
69
|
+
isReadOnly: state.isReadOnly,
|
|
70
|
+
isRequired: props.isRequired || false
|
|
70
71
|
},
|
|
71
72
|
defaultClassName: 'react-aria-DateField'
|
|
72
73
|
});
|
|
@@ -125,7 +126,8 @@ const $40825cdb76e74f70$export$d9781c7894a82487 = /*#__PURE__*/ (0, $a9Sgq$forwa
|
|
|
125
126
|
slot: props.slot || undefined,
|
|
126
127
|
"data-invalid": state.isInvalid || undefined,
|
|
127
128
|
"data-disabled": state.isDisabled || undefined,
|
|
128
|
-
"data-readonly": state.isReadOnly || undefined
|
|
129
|
+
"data-readonly": state.isReadOnly || undefined,
|
|
130
|
+
"data-required": props.isRequired || undefined
|
|
129
131
|
}), /*#__PURE__*/ (0, $a9Sgq$react).createElement((0, $c699643d2073b351$export$eefa3e19139f00f3), {
|
|
130
132
|
autoComplete: props.autoComplete,
|
|
131
133
|
name: props.name,
|
|
@@ -159,7 +161,8 @@ const $40825cdb76e74f70$export$5eaee2322dd727eb = /*#__PURE__*/ (0, $a9Sgq$forwa
|
|
|
159
161
|
state: state,
|
|
160
162
|
isInvalid: state.isInvalid,
|
|
161
163
|
isDisabled: state.isDisabled,
|
|
162
|
-
isReadOnly: state.isReadOnly
|
|
164
|
+
isReadOnly: state.isReadOnly,
|
|
165
|
+
isRequired: props.isRequired || false
|
|
163
166
|
},
|
|
164
167
|
defaultClassName: 'react-aria-TimeField'
|
|
165
168
|
});
|
|
@@ -218,7 +221,8 @@ const $40825cdb76e74f70$export$5eaee2322dd727eb = /*#__PURE__*/ (0, $a9Sgq$forwa
|
|
|
218
221
|
slot: props.slot || undefined,
|
|
219
222
|
"data-invalid": state.isInvalid || undefined,
|
|
220
223
|
"data-disabled": state.isDisabled || undefined,
|
|
221
|
-
"data-readonly": state.isReadOnly || undefined
|
|
224
|
+
"data-readonly": state.isReadOnly || undefined,
|
|
225
|
+
"data-required": props.isRequired || undefined
|
|
222
226
|
}));
|
|
223
227
|
});
|
|
224
228
|
const $40825cdb76e74f70$export$7edc06cf1783b30f = /*#__PURE__*/ (0, $a9Sgq$forwardRef)(function DateInput(props, ref) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/react-aria-components/src/DateField.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 {AriaDateFieldProps, AriaTimeFieldProps, DateValue, HoverEvents, mergeProps, TimeValue, useDateField, useDateSegment, useFocusRing, useHover, useLocale, useTimeField} from 'react-aria';\nimport {\n ClassNameOrFunction,\n ContextValue,\n dom,\n Provider,\n RACValidation,\n removeDataAttributes,\n RenderProps,\n SlotProps,\n StyleRenderProps,\n useContextProps,\n useRenderProps,\n useSlot,\n useSlottedContext\n} from './utils';\nimport {createCalendar} from '@internationalized/date';\nimport {DateFieldState, DateSegmentType, DateSegment as IDateSegment, TimeFieldState, useDateFieldState, useTimeFieldState} from 'react-stately';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useObjectRef} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType, GlobalDOMAttributes} from '@react-types/shared';\nimport {Group, GroupContext} from './Group';\nimport {HiddenDateInput} from './HiddenDateInput';\nimport {Input, InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport React, {cloneElement, createContext, ForwardedRef, forwardRef, JSX, ReactElement, useContext, useRef} from 'react';\nimport {TextContext} from './Text';\n\nexport interface DateFieldRenderProps {\n /**\n * State of the date field.\n */\n state: DateFieldState,\n /**\n * Whether the date field is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the date field is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the date field is read only.\n * @selector [data-readonly]\n */\n isReadOnly: boolean\n}\nexport interface DateFieldProps<T extends DateValue> extends Omit<AriaDateFieldProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<DateFieldRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-DateField'\n */\n className?: ClassNameOrFunction<DateFieldRenderProps>\n}\nexport interface TimeFieldProps<T extends TimeValue> extends Omit<AriaTimeFieldProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<DateFieldRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-TimeField'\n */\n className?: ClassNameOrFunction<DateFieldRenderProps>\n}\n\nexport const DateFieldContext = createContext<ContextValue<DateFieldProps<any>, HTMLDivElement>>(null);\nexport const TimeFieldContext = createContext<ContextValue<TimeFieldProps<any>, HTMLDivElement>>(null);\nexport const DateFieldStateContext = createContext<DateFieldState | null>(null);\nexport const TimeFieldStateContext = createContext<TimeFieldState | null>(null);\n\n/**\n * A date field allows users to enter and edit date and time values using a keyboard.\n * Each part of a date value is displayed in an individually editable segment.\n */\nexport const DateField = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateField<T extends DateValue>(props: DateFieldProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, DateFieldContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let {locale} = useLocale();\n let state = useDateFieldState({\n ...props,\n locale,\n createCalendar,\n validationBehavior\n });\n\n let fieldRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let inputRef = useRef<HTMLInputElement>(null);\n let {labelProps, fieldProps, inputProps, descriptionProps, errorMessageProps, ...validation} = useDateField({\n ...removeDataAttributes(props),\n label,\n inputRef,\n validationBehavior\n }, state, fieldRef);\n\n let renderProps = useRenderProps({\n ...removeDataAttributes(props),\n values: {\n state,\n isInvalid: state.isInvalid,\n isDisabled: state.isDisabled,\n isReadOnly: state.isReadOnly\n },\n defaultClassName: 'react-aria-DateField'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [DateFieldStateContext, state],\n [GroupContext, {...fieldProps, ref: fieldRef, isInvalid: state.isInvalid, isDisabled: state.isDisabled}],\n [InputContext, {...inputProps, ref: inputRef}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <dom.div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-invalid={state.isInvalid || undefined}\n data-disabled={state.isDisabled || undefined}\n data-readonly={state.isReadOnly || undefined} />\n <HiddenDateInput\n autoComplete={props.autoComplete}\n name={props.name}\n isDisabled={props.isDisabled}\n state={state} />\n </Provider>\n );\n});\n\n/**\n * A time field allows users to enter and edit time values using a keyboard.\n * Each part of a time value is displayed in an individually editable segment.\n */\nexport const TimeField = /*#__PURE__*/ (forwardRef as forwardRefType)(function TimeField<T extends TimeValue>(props: TimeFieldProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, TimeFieldContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let {locale} = useLocale();\n let state = useTimeFieldState({\n ...props,\n locale,\n validationBehavior\n });\n\n let fieldRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let inputRef = useRef<HTMLInputElement>(null);\n let {labelProps, fieldProps, inputProps, descriptionProps, errorMessageProps, ...validation} = useTimeField({\n ...removeDataAttributes(props),\n label,\n inputRef,\n validationBehavior\n }, state, fieldRef);\n\n let renderProps = useRenderProps({\n ...props,\n values: {\n state,\n isInvalid: state.isInvalid,\n isDisabled: state.isDisabled,\n isReadOnly: state.isReadOnly\n },\n defaultClassName: 'react-aria-TimeField'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [TimeFieldStateContext, state],\n [GroupContext, {...fieldProps, ref: fieldRef, isInvalid: state.isInvalid, isDisabled: state.isDisabled}],\n [InputContext, {...inputProps, ref: inputRef}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <dom.div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-invalid={state.isInvalid || undefined}\n data-disabled={state.isDisabled || undefined}\n data-readonly={state.isReadOnly || undefined} />\n </Provider>\n );\n});\n\nexport interface DateInputRenderProps {\n /**\n * Whether the date input is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether an element within the date input is focused, either via a mouse or keyboard.\n * @selector [data-focus-within]\n */\n isFocusWithin: boolean,\n /**\n * Whether an element within the date input is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the date input is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n\n /**\n * Whether the date input is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean\n}\n\nexport interface DateInputProps extends SlotProps, StyleRenderProps<DateInputRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-DateInput'\n */\n className?: ClassNameOrFunction<DateInputRenderProps>,\n children: (segment: IDateSegment) => ReactElement\n}\n\n/**\n * A date input groups the editable date segments within a date field.\n */\nexport const DateInput = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateInput(props: DateInputProps, ref: ForwardedRef<HTMLDivElement>): JSX.Element {\n // If state is provided by DateField/TimeField, just render.\n // Otherwise (e.g. in DatePicker), we need to call hooks and create state ourselves.\n let dateFieldState = useContext(DateFieldStateContext);\n let timeFieldState = useContext(TimeFieldStateContext);\n return dateFieldState || timeFieldState\n ? <DateInputInner {...props} ref={ref} />\n : <DateInputStandalone {...props} ref={ref} />;\n});\n\nconst DateInputStandalone = forwardRef((props: DateInputProps, ref: ForwardedRef<HTMLDivElement>) => {\n let [dateFieldProps, fieldRef] = useContextProps({slot: props.slot} as DateFieldProps<any>, ref, DateFieldContext);\n let {locale} = useLocale();\n let state = useDateFieldState({\n ...dateFieldProps,\n locale,\n createCalendar\n });\n\n let inputRef = useRef<HTMLInputElement>(null);\n let {fieldProps, inputProps} = useDateField({...dateFieldProps, inputRef}, state, fieldRef);\n\n return (\n <Provider\n values={[\n [DateFieldStateContext, state],\n [InputContext, {...inputProps, ref: inputRef}],\n [GroupContext, {...fieldProps, ref: fieldRef, isInvalid: state.isInvalid, isDisabled: state.isDisabled}]\n ]}>\n <DateInputInner {...props} />\n </Provider>\n );\n});\n\nconst DateInputInner = forwardRef((props: DateInputProps, ref: ForwardedRef<HTMLDivElement>) => {\n let {className, children} = props;\n let dateFieldState = useContext(DateFieldStateContext);\n let timeFieldState = useContext(TimeFieldStateContext);\n let state = dateFieldState ?? timeFieldState!;\n\n return (\n <>\n <Group\n {...props}\n ref={ref}\n slot={props.slot || undefined}\n className={className ?? 'react-aria-DateInput'}\n isReadOnly={state.isReadOnly}\n isInvalid={state.isInvalid}\n isDisabled={state.isDisabled}>\n {state.segments.map((segment, i) => cloneElement(children(segment), {key: i}))}\n </Group>\n <Input className=\"\" />\n </>\n );\n});\n\nexport interface DateSegmentRenderProps extends Omit<IDateSegment, 'isEditable'> {\n /**\n * Whether the segment is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether the segment is focused, either via a mouse or keyboard.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the segment is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the value is a placeholder.\n * @selector [data-placeholder]\n */\n isPlaceholder: boolean,\n /**\n * Whether the segment is read only.\n * @selector [data-readonly]\n */\n isReadOnly: boolean,\n /**\n * Whether the date field is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the date field is in an invalid state.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * The type of segment. Values include `literal`, `year`, `month`, `day`, etc.\n * @selector [data-type=\"...\"]\n */\n type: DateSegmentType\n}\n\nexport interface DateSegmentProps extends RenderProps<DateSegmentRenderProps, 'span'>, HoverEvents, GlobalDOMAttributes<HTMLSpanElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-DateSegment'\n */\n className?: ClassNameOrFunction<DateSegmentRenderProps>,\n segment: IDateSegment\n}\n\n/**\n * A date segment displays an individual unit of a date and time, and allows users to edit\n * the value by typing or using the arrow keys to increment and decrement.\n */\nexport const DateSegment = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateSegment({segment, ...otherProps}: DateSegmentProps, ref: ForwardedRef<HTMLSpanElement>) {\n let dateFieldState = useContext(DateFieldStateContext);\n let timeFieldState = useContext(TimeFieldStateContext);\n let state = dateFieldState ?? timeFieldState!;\n let domRef = useObjectRef(ref);\n let {segmentProps} = useDateSegment(segment, state, domRef);\n let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n let {hoverProps, isHovered} = useHover({...otherProps, isDisabled: state.isDisabled || segment.type === 'literal'});\n let renderProps = useRenderProps({\n ...otherProps,\n values: {\n ...segment,\n isReadOnly: state.isReadOnly,\n isInvalid: state.isInvalid,\n isDisabled: state.isDisabled,\n isHovered,\n isFocused,\n isFocusVisible\n },\n defaultChildren: segment.text,\n defaultClassName: 'react-aria-DateSegment'\n });\n\n return (\n <dom.span\n {...mergeProps(filterDOMProps(otherProps, {global: true}), segmentProps, focusProps, hoverProps)}\n {...renderProps}\n style={segmentProps.style}\n ref={domRef}\n data-placeholder={segment.isPlaceholder || undefined}\n data-invalid={state.isInvalid || undefined}\n data-readonly={state.isReadOnly || undefined}\n data-disabled={state.isDisabled || undefined}\n data-type={segment.type}\n data-hovered={isHovered || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined} />\n );\n});\n"],"names":[],"version":3,"file":"DateField.module.js.map"}
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;AAuEM,MAAM,0DAAmB,CAAA,GAAA,oBAAY,EAAqD;AAC1F,MAAM,0DAAmB,CAAA,GAAA,oBAAY,EAAqD;AAC1F,MAAM,0DAAwB,CAAA,GAAA,oBAAY,EAAyB;AACnE,MAAM,0DAAwB,CAAA,GAAA,oBAAY,EAAyB;AAMnE,MAAM,4CAA0B,AAAd,WAAW,GAAI,CAAA,GAAA,iBAAS,EAAqB,SAAS,UAA+B,KAAwB,EAAE,GAAiC;IACvK,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,EAAC,oBAAoB,sBAAsB,EAAC,GAAG,CAAA,GAAA,yCAAgB,EAAE,CAAA,GAAA,yCAAU,MAAM,CAAC;QAC7D,2BAAA;IAAzB,IAAI,qBAAqB,CAAA,OAAA,CAAA,4BAAA,MAAM,kBAAkB,cAAxB,uCAAA,4BAA4B,oCAA5B,kBAAA,OAAsD;IAC/E,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,gBAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,wBAAgB,EAAE;QAC5B,GAAG,KAAK;gBACR;wBACA;4BACA;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,aAAK,EAAkB;IACtC,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,yCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;IAEnD,IAAI,WAAW,CAAA,GAAA,aAAK,EAAoB;IACxC,IAAI,cAAC,UAAU,cAAE,UAAU,cAAE,UAAU,oBAAE,gBAAgB,qBAAE,iBAAiB,EAAE,GAAG,YAAW,GAAG,CAAA,GAAA,mBAAW,EAAE;QAC1G,GAAG,CAAA,GAAA,yCAAmB,EAAE,MAAM;eAC9B;kBACA;4BACA;IACF,GAAG,OAAO;IAEV,IAAI,cAAc,CAAA,GAAA,uCAAa,EAAE;QAC/B,GAAG,CAAA,GAAA,yCAAmB,EAAE,MAAM;QAC9B,QAAQ;mBACN;YACA,WAAW,MAAM,SAAS;YAC1B,YAAY,MAAM,UAAU;YAC5B,YAAY,MAAM,UAAU;YAC5B,YAAY,MAAM,UAAU,IAAI;QAClC;QACA,kBAAkB;IACpB;IAEA,IAAI,WAAW,CAAA,GAAA,qBAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,gCAAC,CAAA,GAAA,yCAAO;QACN,QAAQ;YACN;gBAAC;gBAAuB;aAAM;YAC9B;gBAAC,CAAA,GAAA,yCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;oBAAU,WAAW,MAAM,SAAS;oBAAE,YAAY,MAAM,UAAU;gBAAA;aAAE;YACxG;gBAAC,CAAA,GAAA,yCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,yCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;oBAAU,aAAa;gBAAM;aAAE;YACnE;gBAAC,CAAA,GAAA,yCAAU;gBAAG;oBACZ,OAAO;wBACL,aAAa;wBACb,cAAc;oBAChB;gBACF;aAAE;YACF;gBAAC,CAAA,GAAA,yCAAgB;gBAAG;aAAW;SAChC;qBACD,gCAAC,CAAA,GAAA,yCAAE,EAAE,GAAG;QACL,GAAG,QAAQ;QACX,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,gBAAc,MAAM,SAAS,IAAI;QACjC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;sBACrC,gCAAC,CAAA,GAAA,yCAAc;QACb,cAAc,MAAM,YAAY;QAChC,MAAM,MAAM,IAAI;QAChB,YAAY,MAAM,UAAU;QAC5B,OAAO;;AAGf;AAMO,MAAM,4CAA0B,AAAd,WAAW,GAAI,CAAA,GAAA,iBAAS,EAAqB,SAAS,UAA+B,KAAwB,EAAE,GAAiC;IACvK,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,EAAC,oBAAoB,sBAAsB,EAAC,GAAG,CAAA,GAAA,yCAAgB,EAAE,CAAA,GAAA,yCAAU,MAAM,CAAC;QAC7D,2BAAA;IAAzB,IAAI,qBAAqB,CAAA,OAAA,CAAA,4BAAA,MAAM,kBAAkB,cAAxB,uCAAA,4BAA4B,oCAA5B,kBAAA,OAAsD;IAC/E,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,gBAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,wBAAgB,EAAE;QAC5B,GAAG,KAAK;gBACR;4BACA;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,aAAK,EAAkB;IACtC,IAAI,CAAC,UAAU,MAAM,GAAG,CAAA,GAAA,yCAAM,EAC5B,CAAC,KAAK,CAAC,aAAa,IAAI,CAAC,KAAK,CAAC,kBAAkB;IAEnD,IAAI,WAAW,CAAA,GAAA,aAAK,EAAoB;IACxC,IAAI,cAAC,UAAU,cAAE,UAAU,cAAE,UAAU,oBAAE,gBAAgB,qBAAE,iBAAiB,EAAE,GAAG,YAAW,GAAG,CAAA,GAAA,mBAAW,EAAE;QAC1G,GAAG,CAAA,GAAA,yCAAmB,EAAE,MAAM;eAC9B;kBACA;4BACA;IACF,GAAG,OAAO;IAEV,IAAI,cAAc,CAAA,GAAA,uCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,QAAQ;mBACN;YACA,WAAW,MAAM,SAAS;YAC1B,YAAY,MAAM,UAAU;YAC5B,YAAY,MAAM,UAAU;YAC5B,YAAY,MAAM,UAAU,IAAI;QAClC;QACA,kBAAkB;IACpB;IAEA,IAAI,WAAW,CAAA,GAAA,qBAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAClD,OAAO,SAAS,EAAE;IAElB,qBACE,gCAAC,CAAA,GAAA,yCAAO;QACN,QAAQ;YACN;gBAAC;gBAAuB;aAAM;YAC9B;gBAAC,CAAA,GAAA,yCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;oBAAU,WAAW,MAAM,SAAS;oBAAE,YAAY,MAAM,UAAU;gBAAA;aAAE;YACxG;gBAAC,CAAA,GAAA,yCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,yCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;oBAAU,aAAa;gBAAM;aAAE;YACnE;gBAAC,CAAA,GAAA,yCAAU;gBAAG;oBACZ,OAAO;wBACL,aAAa;wBACb,cAAc;oBAChB;gBACF;aAAE;YACF;gBAAC,CAAA,GAAA,yCAAgB;gBAAG;aAAW;SAChC;qBACD,gCAAC,CAAA,GAAA,yCAAE,EAAE,GAAG;QACL,GAAG,QAAQ;QACX,GAAG,WAAW;QACf,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,gBAAc,MAAM,SAAS,IAAI;QACjC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;;AAG3C;AA2CO,MAAM,4CAA0B,AAAd,WAAW,GAAI,CAAA,GAAA,iBAAS,EAAqB,SAAS,UAAU,KAAqB,EAAE,GAAiC;IAC/I,4DAA4D;IAC5D,oFAAoF;IACpF,IAAI,iBAAiB,CAAA,GAAA,iBAAS,EAAE;IAChC,IAAI,iBAAiB,CAAA,GAAA,iBAAS,EAAE;IAChC,OAAO,kBAAkB,+BACrB,gCAAC;QAAgB,GAAG,KAAK;QAAE,KAAK;uBAChC,gCAAC;QAAqB,GAAG,KAAK;QAAE,KAAK;;AAC3C;AAEA,MAAM,0DAAsB,CAAA,GAAA,iBAAS,EAAE,CAAC,OAAuB;IAC7D,IAAI,CAAC,gBAAgB,SAAS,GAAG,CAAA,GAAA,yCAAc,EAAE;QAAC,MAAM,MAAM,IAAI;IAAA,GAA0B,KAAK;IACjG,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,gBAAQ;IACvB,IAAI,QAAQ,CAAA,GAAA,wBAAgB,EAAE;QAC5B,GAAG,cAAc;gBACjB;wBACA;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,aAAK,EAAoB;IACxC,IAAI,cAAC,UAAU,cAAE,UAAU,EAAC,GAAG,CAAA,GAAA,mBAAW,EAAE;QAAC,GAAG,cAAc;kBAAE;IAAQ,GAAG,OAAO;IAElF,qBACE,gCAAC,CAAA,GAAA,yCAAO;QACN,QAAQ;YACN;gBAAC;gBAAuB;aAAM;YAC9B;gBAAC,CAAA,GAAA,yCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;gBAAQ;aAAE;YAC9C;gBAAC,CAAA,GAAA,yCAAW;gBAAG;oBAAC,GAAG,UAAU;oBAAE,KAAK;oBAAU,WAAW,MAAM,SAAS;oBAAE,YAAY,MAAM,UAAU;gBAAA;aAAE;SACzG;qBACD,gCAAC,sCAAmB;AAG1B;AAEA,MAAM,qDAAiB,CAAA,GAAA,iBAAS,EAAE,CAAC,OAAuB;IACxD,IAAI,aAAC,SAAS,YAAE,QAAQ,EAAC,GAAG;IAC5B,IAAI,iBAAiB,CAAA,GAAA,iBAAS,EAAE;IAChC,IAAI,iBAAiB,CAAA,GAAA,iBAAS,EAAE;IAChC,IAAI,QAAQ,2BAAA,4BAAA,iBAAkB;IAE9B,qBACE,gFACE,gCAAC,CAAA,GAAA,yCAAI;QACF,GAAG,KAAK;QACT,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,WAAW,sBAAA,uBAAA,YAAa;QACxB,YAAY,MAAM,UAAU;QAC5B,WAAW,MAAM,SAAS;QAC1B,YAAY,MAAM,UAAU;OAC3B,MAAM,QAAQ,CAAC,GAAG,CAAC,CAAC,SAAS,kBAAM,CAAA,GAAA,mBAAW,EAAE,SAAS,UAAU;YAAC,KAAK;QAAC,oBAE7E,gCAAC,CAAA,GAAA,yCAAI;QAAE,WAAU;;AAGvB;AA0DO,MAAM,4CAA4B,AAAd,WAAW,GAAI,CAAA,GAAA,iBAAS,EAAqB,SAAS,YAAY,WAAC,OAAO,EAAE,GAAG,YAA6B,EAAE,GAAkC;IACzK,IAAI,iBAAiB,CAAA,GAAA,iBAAS,EAAE;IAChC,IAAI,iBAAiB,CAAA,GAAA,iBAAS,EAAE;IAChC,IAAI,QAAQ,2BAAA,4BAAA,iBAAkB;IAC9B,IAAI,SAAS,CAAA,GAAA,mBAAW,EAAE;IAC1B,IAAI,gBAAC,YAAY,EAAC,GAAG,CAAA,GAAA,qBAAa,EAAE,SAAS,OAAO;IACpD,IAAI,cAAC,UAAU,aAAE,SAAS,kBAAE,cAAc,EAAC,GAAG,CAAA,GAAA,mBAAW;IACzD,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;QAAC,GAAG,UAAU;QAAE,YAAY,MAAM,UAAU,IAAI,QAAQ,IAAI,KAAK;IAAS;IACjH,IAAI,cAAc,CAAA,GAAA,uCAAa,EAAE;QAC/B,GAAG,UAAU;QACb,QAAQ;YACN,GAAG,OAAO;YACV,YAAY,MAAM,UAAU;YAC5B,WAAW,MAAM,SAAS;YAC1B,YAAY,MAAM,UAAU;uBAC5B;uBACA;4BACA;QACF;QACA,iBAAiB,QAAQ,IAAI;QAC7B,kBAAkB;IACpB;IAEA,qBACE,gCAAC,CAAA,GAAA,yCAAE,EAAE,IAAI;QACN,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,qBAAa,EAAE,YAAY;YAAC,QAAQ;QAAI,IAAI,cAAc,YAAY,WAAW;QAC/F,GAAG,WAAW;QACf,OAAO,aAAa,KAAK;QACzB,KAAK;QACL,oBAAkB,QAAQ,aAAa,IAAI;QAC3C,gBAAc,MAAM,SAAS,IAAI;QACjC,iBAAe,MAAM,UAAU,IAAI;QACnC,iBAAe,MAAM,UAAU,IAAI;QACnC,aAAW,QAAQ,IAAI;QACvB,gBAAc,aAAa;QAC3B,gBAAc,aAAa;QAC3B,sBAAoB,kBAAkB;;AAE5C","sources":["packages/react-aria-components/src/DateField.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 {AriaDateFieldProps, AriaTimeFieldProps, DateValue, HoverEvents, mergeProps, TimeValue, useDateField, useDateSegment, useFocusRing, useHover, useLocale, useTimeField} from 'react-aria';\nimport {\n ClassNameOrFunction,\n ContextValue,\n dom,\n Provider,\n RACValidation,\n removeDataAttributes,\n RenderProps,\n SlotProps,\n StyleRenderProps,\n useContextProps,\n useRenderProps,\n useSlot,\n useSlottedContext\n} from './utils';\nimport {createCalendar} from '@internationalized/date';\nimport {DateFieldState, DateSegmentType, DateSegment as IDateSegment, TimeFieldState, useDateFieldState, useTimeFieldState} from 'react-stately';\nimport {FieldErrorContext} from './FieldError';\nimport {filterDOMProps, useObjectRef} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {forwardRefType, GlobalDOMAttributes} from '@react-types/shared';\nimport {Group, GroupContext} from './Group';\nimport {HiddenDateInput} from './HiddenDateInput';\nimport {Input, InputContext} from './Input';\nimport {LabelContext} from './Label';\nimport React, {cloneElement, createContext, ForwardedRef, forwardRef, JSX, ReactElement, useContext, useRef} from 'react';\nimport {TextContext} from './Text';\n\nexport interface DateFieldRenderProps {\n /**\n * State of the date field.\n */\n state: DateFieldState,\n /**\n * Whether the date field is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * Whether the date field is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the date field is read only.\n * @selector [data-readonly]\n */\n isReadOnly: boolean,\n /**\n * Whether the date field is required.\n * @selector [data-required]\n */\n isRequired: boolean\n}\nexport interface DateFieldProps<T extends DateValue> extends Omit<AriaDateFieldProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<DateFieldRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-DateField'\n */\n className?: ClassNameOrFunction<DateFieldRenderProps>\n}\nexport interface TimeFieldProps<T extends TimeValue> extends Omit<AriaTimeFieldProps<T>, 'label' | 'description' | 'errorMessage' | 'validationState' | 'validationBehavior'>, RACValidation, RenderProps<DateFieldRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-TimeField'\n */\n className?: ClassNameOrFunction<DateFieldRenderProps>\n}\n\nexport const DateFieldContext = createContext<ContextValue<DateFieldProps<any>, HTMLDivElement>>(null);\nexport const TimeFieldContext = createContext<ContextValue<TimeFieldProps<any>, HTMLDivElement>>(null);\nexport const DateFieldStateContext = createContext<DateFieldState | null>(null);\nexport const TimeFieldStateContext = createContext<TimeFieldState | null>(null);\n\n/**\n * A date field allows users to enter and edit date and time values using a keyboard.\n * Each part of a date value is displayed in an individually editable segment.\n */\nexport const DateField = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateField<T extends DateValue>(props: DateFieldProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, DateFieldContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let {locale} = useLocale();\n let state = useDateFieldState({\n ...props,\n locale,\n createCalendar,\n validationBehavior\n });\n\n let fieldRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let inputRef = useRef<HTMLInputElement>(null);\n let {labelProps, fieldProps, inputProps, descriptionProps, errorMessageProps, ...validation} = useDateField({\n ...removeDataAttributes(props),\n label,\n inputRef,\n validationBehavior\n }, state, fieldRef);\n\n let renderProps = useRenderProps({\n ...removeDataAttributes(props),\n values: {\n state,\n isInvalid: state.isInvalid,\n isDisabled: state.isDisabled,\n isReadOnly: state.isReadOnly,\n isRequired: props.isRequired || false\n },\n defaultClassName: 'react-aria-DateField'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [DateFieldStateContext, state],\n [GroupContext, {...fieldProps, ref: fieldRef, isInvalid: state.isInvalid, isDisabled: state.isDisabled}],\n [InputContext, {...inputProps, ref: inputRef}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <dom.div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-invalid={state.isInvalid || undefined}\n data-disabled={state.isDisabled || undefined}\n data-readonly={state.isReadOnly || undefined}\n data-required={props.isRequired || undefined} />\n <HiddenDateInput\n autoComplete={props.autoComplete}\n name={props.name}\n isDisabled={props.isDisabled}\n state={state} />\n </Provider>\n );\n});\n\n/**\n * A time field allows users to enter and edit time values using a keyboard.\n * Each part of a time value is displayed in an individually editable segment.\n */\nexport const TimeField = /*#__PURE__*/ (forwardRef as forwardRefType)(function TimeField<T extends TimeValue>(props: TimeFieldProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, TimeFieldContext);\n let {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {};\n let validationBehavior = props.validationBehavior ?? formValidationBehavior ?? 'native';\n let {locale} = useLocale();\n let state = useTimeFieldState({\n ...props,\n locale,\n validationBehavior\n });\n\n let fieldRef = useRef<HTMLDivElement>(null);\n let [labelRef, label] = useSlot(\n !props['aria-label'] && !props['aria-labelledby']\n );\n let inputRef = useRef<HTMLInputElement>(null);\n let {labelProps, fieldProps, inputProps, descriptionProps, errorMessageProps, ...validation} = useTimeField({\n ...removeDataAttributes(props),\n label,\n inputRef,\n validationBehavior\n }, state, fieldRef);\n\n let renderProps = useRenderProps({\n ...props,\n values: {\n state,\n isInvalid: state.isInvalid,\n isDisabled: state.isDisabled,\n isReadOnly: state.isReadOnly,\n isRequired: props.isRequired || false\n },\n defaultClassName: 'react-aria-TimeField'\n });\n\n let DOMProps = filterDOMProps(props, {global: true});\n delete DOMProps.id;\n\n return (\n <Provider\n values={[\n [TimeFieldStateContext, state],\n [GroupContext, {...fieldProps, ref: fieldRef, isInvalid: state.isInvalid, isDisabled: state.isDisabled}],\n [InputContext, {...inputProps, ref: inputRef}],\n [LabelContext, {...labelProps, ref: labelRef, elementType: 'span'}],\n [TextContext, {\n slots: {\n description: descriptionProps,\n errorMessage: errorMessageProps\n }\n }],\n [FieldErrorContext, validation]\n ]}>\n <dom.div\n {...DOMProps}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-invalid={state.isInvalid || undefined}\n data-disabled={state.isDisabled || undefined}\n data-readonly={state.isReadOnly || undefined}\n data-required={props.isRequired || undefined} />\n </Provider>\n );\n});\n\nexport interface DateInputRenderProps {\n /**\n * Whether the date input is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether an element within the date input is focused, either via a mouse or keyboard.\n * @selector [data-focus-within]\n */\n isFocusWithin: boolean,\n /**\n * Whether an element within the date input is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the date input is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n\n /**\n * Whether the date input is invalid.\n * @selector [data-invalid]\n */\n isInvalid: boolean\n}\n\nexport interface DateInputProps extends SlotProps, StyleRenderProps<DateInputRenderProps>, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-DateInput'\n */\n className?: ClassNameOrFunction<DateInputRenderProps>,\n children: (segment: IDateSegment) => ReactElement\n}\n\n/**\n * A date input groups the editable date segments within a date field.\n */\nexport const DateInput = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateInput(props: DateInputProps, ref: ForwardedRef<HTMLDivElement>): JSX.Element {\n // If state is provided by DateField/TimeField, just render.\n // Otherwise (e.g. in DatePicker), we need to call hooks and create state ourselves.\n let dateFieldState = useContext(DateFieldStateContext);\n let timeFieldState = useContext(TimeFieldStateContext);\n return dateFieldState || timeFieldState\n ? <DateInputInner {...props} ref={ref} />\n : <DateInputStandalone {...props} ref={ref} />;\n});\n\nconst DateInputStandalone = forwardRef((props: DateInputProps, ref: ForwardedRef<HTMLDivElement>) => {\n let [dateFieldProps, fieldRef] = useContextProps({slot: props.slot} as DateFieldProps<any>, ref, DateFieldContext);\n let {locale} = useLocale();\n let state = useDateFieldState({\n ...dateFieldProps,\n locale,\n createCalendar\n });\n\n let inputRef = useRef<HTMLInputElement>(null);\n let {fieldProps, inputProps} = useDateField({...dateFieldProps, inputRef}, state, fieldRef);\n\n return (\n <Provider\n values={[\n [DateFieldStateContext, state],\n [InputContext, {...inputProps, ref: inputRef}],\n [GroupContext, {...fieldProps, ref: fieldRef, isInvalid: state.isInvalid, isDisabled: state.isDisabled}]\n ]}>\n <DateInputInner {...props} />\n </Provider>\n );\n});\n\nconst DateInputInner = forwardRef((props: DateInputProps, ref: ForwardedRef<HTMLDivElement>) => {\n let {className, children} = props;\n let dateFieldState = useContext(DateFieldStateContext);\n let timeFieldState = useContext(TimeFieldStateContext);\n let state = dateFieldState ?? timeFieldState!;\n\n return (\n <>\n <Group\n {...props}\n ref={ref}\n slot={props.slot || undefined}\n className={className ?? 'react-aria-DateInput'}\n isReadOnly={state.isReadOnly}\n isInvalid={state.isInvalid}\n isDisabled={state.isDisabled}>\n {state.segments.map((segment, i) => cloneElement(children(segment), {key: i}))}\n </Group>\n <Input className=\"\" />\n </>\n );\n});\n\nexport interface DateSegmentRenderProps extends Omit<IDateSegment, 'isEditable'> {\n /**\n * Whether the segment is currently hovered with a mouse.\n * @selector [data-hovered]\n */\n isHovered: boolean,\n /**\n * Whether the segment is focused, either via a mouse or keyboard.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the segment is keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the value is a placeholder.\n * @selector [data-placeholder]\n */\n isPlaceholder: boolean,\n /**\n * Whether the segment is read only.\n * @selector [data-readonly]\n */\n isReadOnly: boolean,\n /**\n * Whether the date field is disabled.\n * @selector [data-disabled]\n */\n isDisabled: boolean,\n /**\n * Whether the date field is in an invalid state.\n * @selector [data-invalid]\n */\n isInvalid: boolean,\n /**\n * The type of segment. Values include `literal`, `year`, `month`, `day`, etc.\n * @selector [data-type=\"...\"]\n */\n type: DateSegmentType\n}\n\nexport interface DateSegmentProps extends RenderProps<DateSegmentRenderProps, 'span'>, HoverEvents, GlobalDOMAttributes<HTMLSpanElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-DateSegment'\n */\n className?: ClassNameOrFunction<DateSegmentRenderProps>,\n segment: IDateSegment\n}\n\n/**\n * A date segment displays an individual unit of a date and time, and allows users to edit\n * the value by typing or using the arrow keys to increment and decrement.\n */\nexport const DateSegment = /*#__PURE__*/ (forwardRef as forwardRefType)(function DateSegment({segment, ...otherProps}: DateSegmentProps, ref: ForwardedRef<HTMLSpanElement>) {\n let dateFieldState = useContext(DateFieldStateContext);\n let timeFieldState = useContext(TimeFieldStateContext);\n let state = dateFieldState ?? timeFieldState!;\n let domRef = useObjectRef(ref);\n let {segmentProps} = useDateSegment(segment, state, domRef);\n let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n let {hoverProps, isHovered} = useHover({...otherProps, isDisabled: state.isDisabled || segment.type === 'literal'});\n let renderProps = useRenderProps({\n ...otherProps,\n values: {\n ...segment,\n isReadOnly: state.isReadOnly,\n isInvalid: state.isInvalid,\n isDisabled: state.isDisabled,\n isHovered,\n isFocused,\n isFocusVisible\n },\n defaultChildren: segment.text,\n defaultClassName: 'react-aria-DateSegment'\n });\n\n return (\n <dom.span\n {...mergeProps(filterDOMProps(otherProps, {global: true}), segmentProps, focusProps, hoverProps)}\n {...renderProps}\n style={segmentProps.style}\n ref={domRef}\n data-placeholder={segment.isPlaceholder || undefined}\n data-invalid={state.isInvalid || undefined}\n data-readonly={state.isReadOnly || undefined}\n data-disabled={state.isDisabled || undefined}\n data-type={segment.type}\n data-hovered={isHovered || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined} />\n );\n});\n"],"names":[],"version":3,"file":"DateField.module.js.map"}
|
package/dist/DatePicker.main.js
CHANGED
|
@@ -104,7 +104,8 @@ const $adfe8d3f75d5162e$export$5109c6dd95d8fb00 = /*#__PURE__*/ (0, $bhT4V$react
|
|
|
104
104
|
isDisabled: props.isDisabled || false,
|
|
105
105
|
isInvalid: state.isInvalid,
|
|
106
106
|
isOpen: state.isOpen,
|
|
107
|
-
isReadOnly: props.isReadOnly || false
|
|
107
|
+
isReadOnly: props.isReadOnly || false,
|
|
108
|
+
isRequired: props.isRequired || false
|
|
108
109
|
},
|
|
109
110
|
defaultClassName: 'react-aria-DatePicker'
|
|
110
111
|
});
|
|
@@ -192,6 +193,7 @@ const $adfe8d3f75d5162e$export$5109c6dd95d8fb00 = /*#__PURE__*/ (0, $bhT4V$react
|
|
|
192
193
|
"data-focus-visible": isFocusVisible || undefined,
|
|
193
194
|
"data-disabled": props.isDisabled || undefined,
|
|
194
195
|
"data-readonly": props.isReadOnly || undefined,
|
|
196
|
+
"data-required": props.isRequired || undefined,
|
|
195
197
|
"data-open": state.isOpen || undefined
|
|
196
198
|
}), /*#__PURE__*/ (0, ($parcel$interopDefault($bhT4V$react))).createElement((0, $7753596769f21492$exports.HiddenDateInput), {
|
|
197
199
|
autoComplete: props.autoComplete,
|
|
@@ -237,7 +239,8 @@ const $adfe8d3f75d5162e$export$17334619f3ac2224 = /*#__PURE__*/ (0, $bhT4V$react
|
|
|
237
239
|
isDisabled: props.isDisabled || false,
|
|
238
240
|
isInvalid: state.isInvalid,
|
|
239
241
|
isOpen: state.isOpen,
|
|
240
|
-
isReadOnly: props.isReadOnly || false
|
|
242
|
+
isReadOnly: props.isReadOnly || false,
|
|
243
|
+
isRequired: props.isRequired || false
|
|
241
244
|
},
|
|
242
245
|
defaultClassName: 'react-aria-DateRangePicker'
|
|
243
246
|
});
|
|
@@ -330,6 +333,7 @@ const $adfe8d3f75d5162e$export$17334619f3ac2224 = /*#__PURE__*/ (0, $bhT4V$react
|
|
|
330
333
|
"data-focus-visible": isFocusVisible || undefined,
|
|
331
334
|
"data-disabled": props.isDisabled || undefined,
|
|
332
335
|
"data-readonly": props.isReadOnly || undefined,
|
|
336
|
+
"data-required": props.isRequired || undefined,
|
|
333
337
|
"data-open": state.isOpen || undefined
|
|
334
338
|
}));
|
|
335
339
|
});
|