npm - @cube-dev/ui-kit - Versions diffs - 0.202.0 → 0.204.0 - Mend

@cube-dev/ui-kit 0.202.0 → 0.204.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.

Files changed (645) hide show

package/dist/components/fields/DatePicker/DatePicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DatePicker.js","names":["FocusableRef","BaseProps","Styles","forwardRef","RefObject","useRef","AriaDatePickerProps","DateValue","Placement","useDatePicker","useFocusRing","useDatePickerState","useI18n","FieldBaseProps","mergeProps","mergeStyleLayers","useFieldProps","wrapWithField","FieldLayoutStyleProps","splitFieldLayout","Calendar","Dialog","DialogTrigger","DateInputBase","DatePickerButton","DatePickerInput","DEFAULT_DATE_PROPS","TimeInput","DateFieldBase","useFocusManagerRef","CubeDatePickerProps","Omit","T","wrapperStyles","inputStyles","triggerStyles","styles","size","maxVisibleMonths","shouldFlip","targetRef","HTMLElement","placement","useLocale","DatePicker","rawProps","ref","$","_c","t","t0","Symbol","for","defaultValidationTrigger","props","Object","assign","fieldLayout","qa","placeholderValue","isDisabled","isInvalid","isValid","useLocaleProp","autoFocus","state","shouldCloseOnSelect","hasTime","isOpen","setOpen","domRef","focusProps","within","isTextInput","isFocused","isFocusedButton","focusPropsButton","groupProps","labelProps","fieldProps","buttonProps","dialogProps","calendarProps","placeholder","undefined","timePlaceholder","timeMinValue","minValue","timeMaxValue","maxValue","timeGranularity","granularity","showTimeField","t1","isReadOnly","t2","t3","t4","t5","timeValue","hourCycle","hideTimeZone","setTimeValue","t6","component","field","_DatePicker","displayName","_c","mergeProps","Calendar","TimeInput","DateInputBase"],"sources":["../../../../src/components/fields/DatePicker/DatePicker.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { BaseProps, Styles } from '@tenphi/tasty';\nimport { forwardRef, RefObject, useRef } from 'react';\nimport {\n AriaDatePickerProps,\n DateValue,\n Placement,\n useDatePicker,\n useFocusRing,\n} from 'react-aria';\nimport { useDatePickerState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { mergeStyleLayers } from '../../../utils/styles';\nimport { useFieldProps, wrapWithField } from '../../form';\nimport {\n FieldLayoutStyleProps,\n splitFieldLayout,\n} from '../../form/field-layout';\nimport { Calendar } from '../../other/Calendar/Calendar';\nimport { Dialog } from '../../overlays/Dialog/Dialog';\nimport { DialogTrigger } from '../../overlays/Dialog/DialogTrigger';\n\nimport { DateInputBase } from './DateInputBase';\nimport { DatePickerButton } from './DatePickerButton';\nimport { DatePickerInput } from './DatePickerInput';\nimport { DEFAULT_DATE_PROPS } from './props';\nimport { TimeInput } from './TimeInput';\nimport { DateFieldBase } from './types';\nimport { useFocusManagerRef } from './utils';\n\nexport interface CubeDatePickerProps<T extends DateValue = DateValue>\n extends\n Omit<\n AriaDatePickerProps<T>,\n 'errorMessage' \| 'form' \| 'name' \| keyof DateFieldBase<T>\n >,\n DateFieldBase<T>,\n BaseProps,\n FieldLayoutStyleProps,\n FieldBaseProps<T \| null \| undefined> {\n wrapperStyles?: Styles;\n inputStyles?: Styles;\n triggerStyles?: Styles;\n styles?: Styles;\n size?: 'small' \| 'medium' \| 'large' \| (string & {});\n maxVisibleMonths?: number;\n shouldFlip?: boolean;\n /*\n The ref of the element the popover should visually attach itself to.\n * Defaults to the field wrapper.\n \n Forwarded to `DialogTrigger`, so the anchor also becomes what outside-click\n * dismissal treats as the trigger.\n /\n targetRef?: RefObject<HTMLElement \| null>;\n /\n Placement of the popover relative to the anchor.\n * Accepts React Aria's `Placement` strings (e.g. `'bottom start'`,\n * `'top start'`, `'right top'`, `'left top'`).\n * @default 'bottom right'\n */\n placement?: Placement;\n useLocale?: boolean;\n}\n\nfunction DatePicker<T extends DateValue>(\n rawProps: CubeDatePickerProps<T>,\n ref: FocusableRef<HTMLElement>,\n) {\n const { t } = useI18n();\n\n let props = useFieldProps(rawProps, {\n defaultValidationTrigger: 'onBlur',\n });\n props = Object.assign({}, DEFAULT_DATE_PROPS, props);\n\n // `wrapperStyles` styles the same box as `styles` and wins over it.\n const fieldLayout = splitFieldLayout(props);\n const styles = mergeStyleLayers(fieldLayout.styles, props.wrapperStyles);\n\n let {\n qa,\n size,\n placeholderValue,\n isDisabled,\n isInvalid,\n isValid,\n useLocale: useLocaleProp,\n autoFocus,\n } = props;\n let targetRef = useRef<HTMLDivElement>(null);\n let state = useDatePickerState({\n ...props,\n shouldCloseOnSelect: () => !state.hasTime,\n });\n let { isOpen, setOpen } = state;\n\n let domRef = useRef<HTMLDivElement>(null);\n\n useFocusManagerRef(ref, domRef);\n\n let { isFocused, focusProps } = useFocusRing({\n within: true,\n isTextInput: true,\n autoFocus,\n });\n\n let { isFocused: isFocusedButton, focusProps: focusPropsButton } =\n useFocusRing({\n within: false,\n isTextInput: false,\n autoFocus,\n });\n\n let {\n groupProps,\n labelProps,\n fieldProps,\n buttonProps,\n dialogProps,\n calendarProps,\n } = useDatePicker(props, state, targetRef);\n\n let placeholder: DateValue \| undefined = placeholderValue ?? undefined;\n let timePlaceholder =\n placeholder && 'hour' in placeholder ? placeholder : undefined;\n let timeMinValue =\n props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n let timeMaxValue =\n props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n let timeGranularity =\n state.granularity === 'hour' \|\|\n state.granularity === 'minute' \|\|\n state.granularity === 'second'\n ? state.granularity\n : null;\n let showTimeField = !!timeGranularity;\n // let visibleMonths = useVisibleMonths(maxVisibleMonths);\n\n const component = (\n <DateInputBase\n ref={targetRef}\n wrapperRef={domRef}\n qa={qa \|\| 'DatePicker'}\n inputType=\"datepicker\"\n autoFocus={autoFocus}\n styles={styles}\n disableFocusRing={isFocusedButton}\n isDisabled={isDisabled}\n isReadOnly={props.isReadOnly}\n isInvalid={isInvalid}\n isValid={isValid}\n size={size}\n fieldProps={groupProps}\n {...focusProps}\n suffix={\n <DialogTrigger\n hideArrow\n type=\"popover\"\n placement={props.placement ?? 'bottom right'}\n targetRef={props.targetRef ?? targetRef}\n isOpen={isOpen}\n shouldFlip={props.shouldFlip}\n onOpenChange={setOpen}\n >\n <DatePickerButton\n size={size}\n {...mergeProps(buttonProps, focusPropsButton)}\n isDisabled={isDisabled}\n />\n <Dialog {...dialogProps} width=\"max-content\" overflow=\"auto\">\n <Calendar {...calendarProps} />\n {showTimeField && (\n <TimeInput\n label={t('datePicker.time', 'Time')}\n value={state.timeValue}\n placeholderValue={timePlaceholder}\n granularity={timeGranularity}\n minValue={timeMinValue}\n maxValue={timeMaxValue}\n hourCycle={props.hourCycle}\n hideTimeZone={props.hideTimeZone}\n onChange={state.setTimeValue}\n />\n )}\n </Dialog>\n </DialogTrigger>\n }\n >\n <DatePickerInput useLocale={useLocaleProp} {...fieldProps} />\n </DateInputBase>\n );\n\n return wrapWithField(component, {\n ...props,\n ...fieldLayout.field,\n labelProps: mergeProps(props.labelProps, labelProps),\n });\n}\n\nconst _DatePicker = forwardRef(DatePicker);\n\n_DatePicker.displayName = 'DatePicker';\n\nexport { _DatePicker as DatePicker };\n"],"mappings":"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"}
1	+ {"version":3,"file":"DatePicker.js","names":["FocusableRef","BaseProps","Styles","forwardRef","RefObject","useRef","AriaDatePickerProps","DateValue","Placement","useDatePicker","useFocusRing","useDatePickerState","useI18n","FieldBaseProps","mergeProps","useFieldProps","wrapWithField","FieldLayoutStyleProps","splitFieldLayout","Calendar","Dialog","DialogTrigger","DateInputBase","DatePickerButton","DatePickerInput","DEFAULT_DATE_PROPS","TimeInput","DateFieldBase","useFocusManagerRef","CubeDatePickerProps","Omit","T","wrapperStyles","inputStyles","triggerStyles","styles","size","maxVisibleMonths","shouldFlip","targetRef","HTMLElement","placement","useLocale","DatePicker","rawProps","ref","$","_c","t","t0","Symbol","for","defaultValidationTrigger","props","Object","assign","fieldLayout","overStyles","qa","placeholderValue","isDisabled","isInvalid","isValid","useLocaleProp","autoFocus","state","shouldCloseOnSelect","hasTime","isOpen","setOpen","domRef","focusProps","within","isTextInput","isFocused","isFocusedButton","focusPropsButton","groupProps","labelProps","fieldProps","buttonProps","dialogProps","calendarProps","placeholder","undefined","timePlaceholder","timeMinValue","minValue","timeMaxValue","maxValue","timeGranularity","granularity","showTimeField","t1","isReadOnly","t2","t3","t4","t5","timeValue","hourCycle","hideTimeZone","setTimeValue","t6","component","field","_DatePicker","displayName","_c","mergeProps","Calendar","TimeInput","DateInputBase"],"sources":["../../../../src/components/fields/DatePicker/DatePicker.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { BaseProps, Styles } from '@tenphi/tasty';\nimport { forwardRef, RefObject, useRef } from 'react';\nimport {\n AriaDatePickerProps,\n DateValue,\n Placement,\n useDatePicker,\n useFocusRing,\n} from 'react-aria';\nimport { useDatePickerState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { useFieldProps, wrapWithField } from '../../form';\nimport {\n FieldLayoutStyleProps,\n splitFieldLayout,\n} from '../../form/field-layout';\nimport { Calendar } from '../../other/Calendar/Calendar';\nimport { Dialog } from '../../overlays/Dialog/Dialog';\nimport { DialogTrigger } from '../../overlays/Dialog/DialogTrigger';\n\nimport { DateInputBase } from './DateInputBase';\nimport { DatePickerButton } from './DatePickerButton';\nimport { DatePickerInput } from './DatePickerInput';\nimport { DEFAULT_DATE_PROPS } from './props';\nimport { TimeInput } from './TimeInput';\nimport { DateFieldBase } from './types';\nimport { useFocusManagerRef } from './utils';\n\nexport interface CubeDatePickerProps<T extends DateValue = DateValue>\n extends\n Omit<\n AriaDatePickerProps<T>,\n 'errorMessage' \| 'form' \| 'name' \| keyof DateFieldBase<T>\n >,\n DateFieldBase<T>,\n BaseProps,\n FieldLayoutStyleProps,\n FieldBaseProps<T \| null \| undefined> {\n wrapperStyles?: Styles;\n inputStyles?: Styles;\n triggerStyles?: Styles;\n styles?: Styles;\n size?: 'small' \| 'medium' \| 'large' \| (string & {});\n maxVisibleMonths?: number;\n shouldFlip?: boolean;\n /*\n The ref of the element the popover should visually attach itself to.\n * Defaults to the field wrapper.\n \n Forwarded to `DialogTrigger`, so the anchor also becomes what outside-click\n * dismissal treats as the trigger.\n /\n targetRef?: RefObject<HTMLElement \| null>;\n /\n Placement of the popover relative to the anchor.\n * Accepts React Aria's `Placement` strings (e.g. `'bottom start'`,\n * `'top start'`, `'right top'`, `'left top'`).\n * @default 'bottom right'\n */\n placement?: Placement;\n useLocale?: boolean;\n}\n\nfunction DatePicker<T extends DateValue>(\n rawProps: CubeDatePickerProps<T>,\n ref: FocusableRef<HTMLElement>,\n) {\n const { t } = useI18n();\n\n let props = useFieldProps(rawProps, {\n defaultValidationTrigger: 'onBlur',\n });\n props = Object.assign({}, DEFAULT_DATE_PROPS, props);\n\n // `wrapperStyles` styles the same box as `styles` and wins over it.\n const fieldLayout = splitFieldLayout(props, {\n overStyles: props.wrapperStyles,\n });\n const styles = fieldLayout.styles;\n\n let {\n qa,\n size,\n placeholderValue,\n isDisabled,\n isInvalid,\n isValid,\n useLocale: useLocaleProp,\n autoFocus,\n } = props;\n let targetRef = useRef<HTMLDivElement>(null);\n let state = useDatePickerState({\n ...props,\n shouldCloseOnSelect: () => !state.hasTime,\n });\n let { isOpen, setOpen } = state;\n\n let domRef = useRef<HTMLDivElement>(null);\n\n useFocusManagerRef(ref, domRef);\n\n let { isFocused, focusProps } = useFocusRing({\n within: true,\n isTextInput: true,\n autoFocus,\n });\n\n let { isFocused: isFocusedButton, focusProps: focusPropsButton } =\n useFocusRing({\n within: false,\n isTextInput: false,\n autoFocus,\n });\n\n let {\n groupProps,\n labelProps,\n fieldProps,\n buttonProps,\n dialogProps,\n calendarProps,\n } = useDatePicker(props, state, targetRef);\n\n let placeholder: DateValue \| undefined = placeholderValue ?? undefined;\n let timePlaceholder =\n placeholder && 'hour' in placeholder ? placeholder : undefined;\n let timeMinValue =\n props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n let timeMaxValue =\n props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n let timeGranularity =\n state.granularity === 'hour' \|\|\n state.granularity === 'minute' \|\|\n state.granularity === 'second'\n ? state.granularity\n : null;\n let showTimeField = !!timeGranularity;\n // let visibleMonths = useVisibleMonths(maxVisibleMonths);\n\n const component = (\n <DateInputBase\n ref={targetRef}\n wrapperRef={domRef}\n qa={qa \|\| 'DatePicker'}\n inputType=\"datepicker\"\n autoFocus={autoFocus}\n styles={styles}\n disableFocusRing={isFocusedButton}\n isDisabled={isDisabled}\n isReadOnly={props.isReadOnly}\n isInvalid={isInvalid}\n isValid={isValid}\n size={size}\n fieldProps={groupProps}\n {...focusProps}\n suffix={\n <DialogTrigger\n hideArrow\n type=\"popover\"\n placement={props.placement ?? 'bottom right'}\n targetRef={props.targetRef ?? targetRef}\n isOpen={isOpen}\n shouldFlip={props.shouldFlip}\n onOpenChange={setOpen}\n >\n <DatePickerButton\n size={size}\n {...mergeProps(buttonProps, focusPropsButton)}\n isDisabled={isDisabled}\n />\n <Dialog {...dialogProps} width=\"max-content\" overflow=\"auto\">\n <Calendar {...calendarProps} />\n {showTimeField && (\n <TimeInput\n label={t('datePicker.time', 'Time')}\n value={state.timeValue}\n placeholderValue={timePlaceholder}\n granularity={timeGranularity}\n minValue={timeMinValue}\n maxValue={timeMaxValue}\n hourCycle={props.hourCycle}\n hideTimeZone={props.hideTimeZone}\n onChange={state.setTimeValue}\n />\n )}\n </Dialog>\n </DialogTrigger>\n }\n >\n <DatePickerInput useLocale={useLocaleProp} {...fieldProps} />\n </DateInputBase>\n );\n\n return wrapWithField(component, {\n ...props,\n ...fieldLayout.field,\n labelProps: mergeProps(props.labelProps, labelProps),\n });\n}\n\nconst _DatePicker = forwardRef(DatePicker);\n\n_DatePicker.displayName = 'DatePicker';\n\nexport { _DatePicker as DatePicker };\n"],"mappings":"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"}

package/dist/components/fields/DatePicker/DatePickerButton.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 import { ItemActionProvider } from "../../actions/ItemActionContext.js";
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { CalendarIcon } from "../../../icons/CalendarIcon.js";

package/dist/components/fields/DatePicker/DatePickerElement.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 import { Space } from "../../layout/Space.js";
 import { tasty } from "@tenphi/tasty";
 //#region src/components/fields/DatePicker/DatePickerElement.tsx

package/dist/components/fields/DatePicker/DatePickerInput.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { DatePickerSegment } from "./DatePickerSegment.js";
 import { formatSegments } from "./utils.js";

package/dist/components/fields/DatePicker/DatePickerSegment.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 import { c } from "react/compiler-runtime";
 import { tasty } from "@tenphi/tasty";
 import { useRef } from "react";

package/dist/components/fields/DatePicker/DateRangePicker.js CHANGED Viewed

@@ -1,5 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
-import { mergeStyleLayers } from "../../../utils/styles.js";
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { Space } from "../../layout/Space.js";
@@ -38,8 +37,8 @@ function DateRangePicker(rawProps, ref) {
 	} else t0 = $[0];
 	let props = useFieldProps(rawProps, t0);
 	props = Object.assign({}, DEFAULT_DATE_PROPS, props);
-	const fieldLayout = splitFieldLayout(props);
-	const styles = mergeStyleLayers(fieldLayout.styles, props.wrapperStyles);
+	const fieldLayout = splitFieldLayout(props, { overStyles: props.wrapperStyles });
+	const styles = fieldLayout.styles;
 	const { qa, size, shouldFlip, targetRef: targetRefProp, placement: t1, placeholderValue, isDisabled, isInvalid, isValid, useLocale: useLocaleProp, autoFocus } = props;
 	const placement = t1 === void 0 ? "bottom right" : t1;
 	const targetRef = useRef(null);

package/dist/components/fields/DatePicker/DateRangePicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DateRangePicker.js","names":["FocusableRef","BaseProps","Styles","tasty","forwardRef","RefObject","useRef","AriaDateRangePickerProps","DateValue","Placement","useDateRangePicker","useFocusRing","useDateRangePickerState","useI18n","FieldBaseProps","mergeProps","mergeStyleLayers","useFieldProps","wrapWithField","FieldLayoutStyleProps","splitFieldLayout","Space","RangeCalendar","Dialog","DialogTrigger","DateInputBase","DatePickerButton","DatePickerInput","DEFAULT_DATE_PROPS","TimeInput","DateFieldBase","useFocusManagerRef","ReactElement","Ref","DateRangeDash","children","styles","padding","CubeDateRangePickerProps","Omit","T","start","end","wrapperStyles","inputStyles","size","maxVisibleMonths","shouldFlip","targetRef","HTMLElement","placement","useLocale","DateRangePicker","rawProps","ref","$","_c","t","t0","Symbol","for","defaultValidationTrigger","props","Object","assign","fieldLayout","qa","targetRefProp","t1","placeholderValue","isDisabled","isInvalid","isValid","useLocaleProp","autoFocus","undefined","state","shouldCloseOnSelect","hasTime","isOpen","setOpen","focusProps","within","isTextInput","isFocused","isFocusedButton","focusPropsButton","domRef","groupProps","labelProps","startFieldProps","endFieldProps","buttonProps","dialogProps","calendarProps","placeholder","timePlaceholder","timeMinValue","minValue","timeMaxValue","maxValue","timeGranularity","granularity","showTimeField","t2","isReadOnly","t3","t4","isDateUnavailable","t5","timeRange","hourCycle","hideTimeZone","v","setTime","v_0","t6","t7","t8","component","field","_DateRangePicker","displayName","_c","mergeProps","RangeCalendar","TimeInput","DateInputBase"],"sources":["../../../../src/components/fields/DatePicker/DateRangePicker.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { BaseProps, Styles, tasty } from '@tenphi/tasty';\nimport { forwardRef, RefObject, useRef } from 'react';\nimport {\n AriaDateRangePickerProps,\n DateValue,\n Placement,\n useDateRangePicker,\n useFocusRing,\n} from 'react-aria';\nimport { useDateRangePickerState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { mergeStyleLayers } from '../../../utils/styles';\nimport { useFieldProps, wrapWithField } from '../../form';\nimport {\n FieldLayoutStyleProps,\n splitFieldLayout,\n} from '../../form/field-layout';\nimport { Space } from '../../layout/Space';\nimport { RangeCalendar } from '../../other/Calendar/RangeCalendar';\nimport { Dialog } from '../../overlays/Dialog/Dialog';\nimport { DialogTrigger } from '../../overlays/Dialog/DialogTrigger';\n\nimport { DateInputBase } from './DateInputBase';\nimport { DatePickerButton } from './DatePickerButton';\nimport { DatePickerInput } from './DatePickerInput';\nimport { DEFAULT_DATE_PROPS } from './props';\nimport { TimeInput } from './TimeInput';\nimport { DateFieldBase } from './types';\nimport { useFocusManagerRef } from './utils';\n\nimport type { ReactElement, Ref } from 'react';\n\nconst DateRangeDash = tasty({\n 'aria-hidden': 'true',\n 'data-qa': 'DateRangeDash',\n children: '–',\n styles: {\n padding: '0 .5x',\n },\n});\n\nexport interface CubeDateRangePickerProps<T extends DateValue = DateValue>\n extends\n Omit<\n AriaDateRangePickerProps<T>,\n 'errorMessage' \| 'form' \| 'name' \| keyof DateFieldBase<T>\n >,\n BaseProps,\n DateFieldBase<T>,\n FieldLayoutStyleProps,\n FieldBaseProps<{ start: T; end: T } \| null \| undefined> {\n wrapperStyles?: Styles;\n inputStyles?: Styles;\n styles?: Styles;\n size?: 'small' \| 'medium' \| 'large' \| (string & {});\n maxVisibleMonths?: number;\n shouldFlip?: boolean;\n /*\n The ref of the element the popover should visually attach itself to.\n * Defaults to the field wrapper.\n \n Forwarded to `DialogTrigger`, so the anchor also becomes what outside-click\n * dismissal treats as the trigger.\n /\n targetRef?: RefObject<HTMLElement \| null>;\n /\n Placement of the popover relative to the anchor.\n * Accepts React Aria's `Placement` strings (e.g. `'bottom start'`,\n * `'top start'`, `'right top'`, `'left top'`).\n * @default 'bottom right'\n */\n placement?: Placement;\n useLocale?: boolean;\n}\n\nfunction DateRangePicker<T extends DateValue>(\n rawProps: CubeDateRangePickerProps<T>,\n ref: FocusableRef<HTMLElement>,\n) {\n const { t } = useI18n();\n\n let props = useFieldProps(rawProps, {\n defaultValidationTrigger: 'onBlur',\n });\n props = Object.assign({}, DEFAULT_DATE_PROPS, props);\n\n // `wrapperStyles` styles the same box as `styles` and wins over it.\n const fieldLayout = splitFieldLayout(props);\n const styles = mergeStyleLayers(fieldLayout.styles, props.wrapperStyles);\n\n let {\n qa,\n size,\n shouldFlip,\n targetRef: targetRefProp,\n placement = 'bottom right',\n placeholderValue,\n isDisabled,\n isInvalid,\n isValid,\n useLocale: useLocaleProp,\n autoFocus,\n } = props;\n let targetRef = useRef<HTMLDivElement>(null);\n let state = useDateRangePickerState({\n ...props,\n shouldCloseOnSelect: () => !state.hasTime,\n });\n let { isOpen, setOpen } = state;\n\n let { isFocused, focusProps } = useFocusRing({\n within: true,\n isTextInput: true,\n autoFocus,\n });\n\n let { isFocused: isFocusedButton, focusProps: focusPropsButton } =\n useFocusRing({\n within: false,\n isTextInput: false,\n autoFocus,\n });\n\n let domRef = useRef<HTMLDivElement>(null);\n\n useFocusManagerRef(ref, domRef);\n\n let {\n groupProps,\n labelProps,\n startFieldProps,\n endFieldProps,\n buttonProps,\n dialogProps,\n calendarProps,\n } = useDateRangePicker(props, state, targetRef);\n\n let placeholder: DateValue \| undefined = placeholderValue ?? undefined;\n let timePlaceholder =\n placeholder && 'hour' in placeholder ? placeholder : undefined;\n let timeMinValue =\n props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n let timeMaxValue =\n props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n let timeGranularity =\n state.granularity === 'hour' \|\|\n state.granularity === 'minute' \|\|\n state.granularity === 'second'\n ? state.granularity\n : null;\n let showTimeField = !!timeGranularity;\n // let visibleMonths = useVisibleMonths(maxVisibleMonths);\n\n const component = (\n <DateInputBase\n ref={targetRef}\n wrapperRef={domRef}\n qa={qa \|\| 'DateRangePicker'}\n inputType=\"daterangepicker\"\n autoFocus={autoFocus}\n styles={styles}\n disableFocusRing={isFocusedButton}\n isDisabled={isDisabled}\n isReadOnly={props.isReadOnly}\n isInvalid={isInvalid}\n isValid={isValid}\n size={size}\n fieldProps={groupProps}\n {...focusProps}\n suffix={\n <DialogTrigger\n hideArrow\n type=\"popover\"\n placement={placement}\n targetRef={targetRefProp ?? targetRef}\n isOpen={isOpen}\n shouldFlip={shouldFlip}\n onOpenChange={setOpen}\n >\n <DatePickerButton\n size={size}\n {...mergeProps(buttonProps, focusPropsButton)}\n isDisabled={isDisabled}\n />\n <Dialog {...dialogProps} width=\"max-content\" overflow=\"auto\">\n <RangeCalendar\n {...calendarProps}\n isDateUnavailable={props.isDateUnavailable}\n />\n {showTimeField && (\n <Space>\n <TimeInput\n label={t('datePicker.startTime', 'Start time')}\n value={state.timeRange?.start \|\| null}\n placeholderValue={timePlaceholder}\n granularity={timeGranularity}\n minValue={timeMinValue}\n maxValue={timeMaxValue}\n hourCycle={props.hourCycle}\n hideTimeZone={props.hideTimeZone}\n onChange={(v) => state.setTime('start', v)}\n />\n <TimeInput\n label={t('datePicker.endTime', 'End time')}\n value={state.timeRange?.end \|\| null}\n placeholderValue={timePlaceholder}\n granularity={timeGranularity}\n minValue={timeMinValue}\n maxValue={timeMaxValue}\n hourCycle={props.hourCycle}\n hideTimeZone={props.hideTimeZone}\n onChange={(v) => state.setTime('end', v)}\n />\n </Space>\n )}\n </Dialog>\n </DialogTrigger>\n }\n >\n <DatePickerInput useLocale={useLocaleProp} {...startFieldProps} />\n <DateRangeDash />\n <DatePickerInput useLocale={useLocaleProp} {...endFieldProps} />\n </DateInputBase>\n );\n\n return wrapWithField(component, {\n ...props,\n ...fieldLayout.field,\n labelProps: mergeProps(props.labelProps, labelProps),\n });\n}\n\nconst _DateRangePicker = forwardRef(DateRangePicker) as <\n T extends DateValue = DateValue,\n>(\n props: CubeDateRangePickerProps<T> & { ref?: Ref<HTMLElement> },\n) => ReactElement \| null;\n\n(_DateRangePicker as any).displayName = 'DateRangePicker';\n\nexport { _DateRangePicker as DateRangePicker };\n"],"mappings":"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"}
1	+ {"version":3,"file":"DateRangePicker.js","names":["FocusableRef","BaseProps","Styles","tasty","forwardRef","RefObject","useRef","AriaDateRangePickerProps","DateValue","Placement","useDateRangePicker","useFocusRing","useDateRangePickerState","useI18n","FieldBaseProps","mergeProps","useFieldProps","wrapWithField","FieldLayoutStyleProps","splitFieldLayout","Space","RangeCalendar","Dialog","DialogTrigger","DateInputBase","DatePickerButton","DatePickerInput","DEFAULT_DATE_PROPS","TimeInput","DateFieldBase","useFocusManagerRef","ReactElement","Ref","DateRangeDash","children","styles","padding","CubeDateRangePickerProps","Omit","T","start","end","wrapperStyles","inputStyles","size","maxVisibleMonths","shouldFlip","targetRef","HTMLElement","placement","useLocale","DateRangePicker","rawProps","ref","$","_c","t","t0","Symbol","for","defaultValidationTrigger","props","Object","assign","fieldLayout","overStyles","qa","targetRefProp","t1","placeholderValue","isDisabled","isInvalid","isValid","useLocaleProp","autoFocus","undefined","state","shouldCloseOnSelect","hasTime","isOpen","setOpen","focusProps","within","isTextInput","isFocused","isFocusedButton","focusPropsButton","domRef","groupProps","labelProps","startFieldProps","endFieldProps","buttonProps","dialogProps","calendarProps","placeholder","timePlaceholder","timeMinValue","minValue","timeMaxValue","maxValue","timeGranularity","granularity","showTimeField","t2","isReadOnly","t3","t4","isDateUnavailable","t5","timeRange","hourCycle","hideTimeZone","v","setTime","v_0","t6","t7","t8","component","field","_DateRangePicker","displayName","_c","mergeProps","RangeCalendar","TimeInput","DateInputBase"],"sources":["../../../../src/components/fields/DatePicker/DateRangePicker.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { BaseProps, Styles, tasty } from '@tenphi/tasty';\nimport { forwardRef, RefObject, useRef } from 'react';\nimport {\n AriaDateRangePickerProps,\n DateValue,\n Placement,\n useDateRangePicker,\n useFocusRing,\n} from 'react-aria';\nimport { useDateRangePickerState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { useFieldProps, wrapWithField } from '../../form';\nimport {\n FieldLayoutStyleProps,\n splitFieldLayout,\n} from '../../form/field-layout';\nimport { Space } from '../../layout/Space';\nimport { RangeCalendar } from '../../other/Calendar/RangeCalendar';\nimport { Dialog } from '../../overlays/Dialog/Dialog';\nimport { DialogTrigger } from '../../overlays/Dialog/DialogTrigger';\n\nimport { DateInputBase } from './DateInputBase';\nimport { DatePickerButton } from './DatePickerButton';\nimport { DatePickerInput } from './DatePickerInput';\nimport { DEFAULT_DATE_PROPS } from './props';\nimport { TimeInput } from './TimeInput';\nimport { DateFieldBase } from './types';\nimport { useFocusManagerRef } from './utils';\n\nimport type { ReactElement, Ref } from 'react';\n\nconst DateRangeDash = tasty({\n 'aria-hidden': 'true',\n 'data-qa': 'DateRangeDash',\n children: '–',\n styles: {\n padding: '0 .5x',\n },\n});\n\nexport interface CubeDateRangePickerProps<T extends DateValue = DateValue>\n extends\n Omit<\n AriaDateRangePickerProps<T>,\n 'errorMessage' \| 'form' \| 'name' \| keyof DateFieldBase<T>\n >,\n BaseProps,\n DateFieldBase<T>,\n FieldLayoutStyleProps,\n FieldBaseProps<{ start: T; end: T } \| null \| undefined> {\n wrapperStyles?: Styles;\n inputStyles?: Styles;\n styles?: Styles;\n size?: 'small' \| 'medium' \| 'large' \| (string & {});\n maxVisibleMonths?: number;\n shouldFlip?: boolean;\n /*\n The ref of the element the popover should visually attach itself to.\n * Defaults to the field wrapper.\n \n Forwarded to `DialogTrigger`, so the anchor also becomes what outside-click\n * dismissal treats as the trigger.\n /\n targetRef?: RefObject<HTMLElement \| null>;\n /\n Placement of the popover relative to the anchor.\n * Accepts React Aria's `Placement` strings (e.g. `'bottom start'`,\n * `'top start'`, `'right top'`, `'left top'`).\n * @default 'bottom right'\n */\n placement?: Placement;\n useLocale?: boolean;\n}\n\nfunction DateRangePicker<T extends DateValue>(\n rawProps: CubeDateRangePickerProps<T>,\n ref: FocusableRef<HTMLElement>,\n) {\n const { t } = useI18n();\n\n let props = useFieldProps(rawProps, {\n defaultValidationTrigger: 'onBlur',\n });\n props = Object.assign({}, DEFAULT_DATE_PROPS, props);\n\n // `wrapperStyles` styles the same box as `styles` and wins over it.\n const fieldLayout = splitFieldLayout(props, {\n overStyles: props.wrapperStyles,\n });\n const styles = fieldLayout.styles;\n\n let {\n qa,\n size,\n shouldFlip,\n targetRef: targetRefProp,\n placement = 'bottom right',\n placeholderValue,\n isDisabled,\n isInvalid,\n isValid,\n useLocale: useLocaleProp,\n autoFocus,\n } = props;\n let targetRef = useRef<HTMLDivElement>(null);\n let state = useDateRangePickerState({\n ...props,\n shouldCloseOnSelect: () => !state.hasTime,\n });\n let { isOpen, setOpen } = state;\n\n let { isFocused, focusProps } = useFocusRing({\n within: true,\n isTextInput: true,\n autoFocus,\n });\n\n let { isFocused: isFocusedButton, focusProps: focusPropsButton } =\n useFocusRing({\n within: false,\n isTextInput: false,\n autoFocus,\n });\n\n let domRef = useRef<HTMLDivElement>(null);\n\n useFocusManagerRef(ref, domRef);\n\n let {\n groupProps,\n labelProps,\n startFieldProps,\n endFieldProps,\n buttonProps,\n dialogProps,\n calendarProps,\n } = useDateRangePicker(props, state, targetRef);\n\n let placeholder: DateValue \| undefined = placeholderValue ?? undefined;\n let timePlaceholder =\n placeholder && 'hour' in placeholder ? placeholder : undefined;\n let timeMinValue =\n props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n let timeMaxValue =\n props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n let timeGranularity =\n state.granularity === 'hour' \|\|\n state.granularity === 'minute' \|\|\n state.granularity === 'second'\n ? state.granularity\n : null;\n let showTimeField = !!timeGranularity;\n // let visibleMonths = useVisibleMonths(maxVisibleMonths);\n\n const component = (\n <DateInputBase\n ref={targetRef}\n wrapperRef={domRef}\n qa={qa \|\| 'DateRangePicker'}\n inputType=\"daterangepicker\"\n autoFocus={autoFocus}\n styles={styles}\n disableFocusRing={isFocusedButton}\n isDisabled={isDisabled}\n isReadOnly={props.isReadOnly}\n isInvalid={isInvalid}\n isValid={isValid}\n size={size}\n fieldProps={groupProps}\n {...focusProps}\n suffix={\n <DialogTrigger\n hideArrow\n type=\"popover\"\n placement={placement}\n targetRef={targetRefProp ?? targetRef}\n isOpen={isOpen}\n shouldFlip={shouldFlip}\n onOpenChange={setOpen}\n >\n <DatePickerButton\n size={size}\n {...mergeProps(buttonProps, focusPropsButton)}\n isDisabled={isDisabled}\n />\n <Dialog {...dialogProps} width=\"max-content\" overflow=\"auto\">\n <RangeCalendar\n {...calendarProps}\n isDateUnavailable={props.isDateUnavailable}\n />\n {showTimeField && (\n <Space>\n <TimeInput\n label={t('datePicker.startTime', 'Start time')}\n value={state.timeRange?.start \|\| null}\n placeholderValue={timePlaceholder}\n granularity={timeGranularity}\n minValue={timeMinValue}\n maxValue={timeMaxValue}\n hourCycle={props.hourCycle}\n hideTimeZone={props.hideTimeZone}\n onChange={(v) => state.setTime('start', v)}\n />\n <TimeInput\n label={t('datePicker.endTime', 'End time')}\n value={state.timeRange?.end \|\| null}\n placeholderValue={timePlaceholder}\n granularity={timeGranularity}\n minValue={timeMinValue}\n maxValue={timeMaxValue}\n hourCycle={props.hourCycle}\n hideTimeZone={props.hideTimeZone}\n onChange={(v) => state.setTime('end', v)}\n />\n </Space>\n )}\n </Dialog>\n </DialogTrigger>\n }\n >\n <DatePickerInput useLocale={useLocaleProp} {...startFieldProps} />\n <DateRangeDash />\n <DatePickerInput useLocale={useLocaleProp} {...endFieldProps} />\n </DateInputBase>\n );\n\n return wrapWithField(component, {\n ...props,\n ...fieldLayout.field,\n labelProps: mergeProps(props.labelProps, labelProps),\n });\n}\n\nconst _DateRangePicker = forwardRef(DateRangePicker) as <\n T extends DateValue = DateValue,\n>(\n props: CubeDateRangePickerProps<T> & { ref?: Ref<HTMLElement> },\n) => ReactElement \| null;\n\n(_DateRangePicker as any).displayName = 'DateRangePicker';\n\nexport { _DateRangePicker as DateRangePicker };\n"],"mappings":"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"}

package/dist/components/fields/DatePicker/DateRangeSeparatedPicker.js CHANGED Viewed

@@ -1,5 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
-import { mergeStyleLayers } from "../../../utils/styles.js";
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { Dialog } from "../../overlays/Dialog/Dialog.js";
@@ -41,8 +40,8 @@ function DateRangeSeparatedPicker(rawProps, ref) {
 	} else t0 = $[0];
 	let props = useFieldProps(rawProps, t0);
 	props = Object.assign({}, DEFAULT_DATE_PROPS, props);
-	const fieldLayout = splitFieldLayout(props);
-	const styles = mergeStyleLayers(fieldLayout.styles, props.wrapperStyles);
+	const fieldLayout = splitFieldLayout(props, { overStyles: props.wrapperStyles });
+	const styles = fieldLayout.styles;
 	const { qa, size, placeholderValue, isDisabled, isInvalid, isValid, useLocale: useLocaleProp, autoFocus } = props;
 	const targetRef = useRef(null);
 	const state = useDateRangePickerState({ ...props });

package/dist/components/fields/DatePicker/DateRangeSeparatedPicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DateRangeSeparatedPicker.js","names":["FocusableRef","BaseProps","Styles","tasty","forwardRef","ReactElement","RefObject","useRef","AriaDateRangePickerProps","DateValue","Placement","useDatePicker","useDateRangePicker","useFocusRing","useDatePickerState","useDateRangePickerState","useI18n","FieldBaseProps","mergeProps","mergeStyleLayers","useFieldProps","wrapWithField","FieldLayoutStyleProps","splitFieldLayout","Calendar","Dialog","DialogTrigger","DateInputBase","DatePickerButton","DatePickerElement","DatePickerInput","DEFAULT_DATE_PROPS","TimeInput","DateFieldBase","useFocusManagerRef","DateRangeDash","children","styles","padding","color","CubeDateRangeSeparatedPickerProps","Omit","T","start","end","wrapperStyles","inputStyles","size","maxVisibleMonths","shouldFlip","targetRef","HTMLElement","placement","useLocale","DateRangeSeparatedPicker","rawProps","ref","$","_c","t","t0","Symbol","for","defaultValidationTrigger","props","Object","assign","fieldLayout","qa","placeholderValue","isDisabled","isInvalid","isValid","useLocaleProp","autoFocus","state","startDateProps","onChange","undefined","validate","value","defaultValue","endDateProps","startState","endState","startFocusRingProps","within","isTextInput","startFocusProps","endFocusRingProps","endFocusProps","groupProps","labelProps","startFieldProps","endFieldProps","startProps","endProps","placeholder","timePlaceholder","timeMinValue","minValue","timeMaxValue","maxValue","timeGranularity","granularity","showTimeField","t1","calendarProps","type","newRange","compare","setValue","setDateTime","setOpen","newRange_0","t2","isFocused","t3","isReadOnly","t4","focusProps","t5","isOpen","t6","t7","t8","buttonProps","t9","t10","t11","t12","value_0","t13","t14","timeValue","hourCycle","hideTimeZone","setTimeValue","t15","dialogProps","t16","t17","t18","t19","t20","t21","t22","t23","t24","t25","t26","t27","t28","t29","t30","value_1","t31","t32","t33","t34","t35","t36","component","field","_DateRangeSeparatedPicker","displayName","_c","mergeProps","Calendar","TimeInput","DateInputBase"],"sources":["../../../../src/components/fields/DatePicker/DateRangeSeparatedPicker.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { BaseProps, Styles, tasty } from '@tenphi/tasty';\nimport { forwardRef, ReactElement, RefObject, useRef } from 'react';\nimport {\n AriaDateRangePickerProps,\n DateValue,\n Placement,\n useDatePicker,\n useDateRangePicker,\n useFocusRing,\n} from 'react-aria';\nimport { useDatePickerState, useDateRangePickerState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { mergeStyleLayers } from '../../../utils/styles';\nimport { useFieldProps, wrapWithField } from '../../form';\nimport {\n FieldLayoutStyleProps,\n splitFieldLayout,\n} from '../../form/field-layout';\nimport { Calendar } from '../../other/Calendar/Calendar';\nimport { Dialog } from '../../overlays/Dialog/Dialog';\nimport { DialogTrigger } from '../../overlays/Dialog/DialogTrigger';\n\nimport { DateInputBase } from './DateInputBase';\nimport { DatePickerButton } from './DatePickerButton';\nimport { DatePickerElement } from './DatePickerElement';\nimport { DatePickerInput } from './DatePickerInput';\nimport { DEFAULT_DATE_PROPS } from './props';\nimport { TimeInput } from './TimeInput';\nimport { DateFieldBase } from './types';\nimport { useFocusManagerRef } from './utils';\n\nconst DateRangeDash = tasty({\n 'aria-hidden': 'true',\n 'data-qa': 'DateRangeDash',\n children: '–',\n styles: {\n padding: '0 .5x',\n color: '#dark-03',\n },\n});\n\nexport interface CubeDateRangeSeparatedPickerProps<\n T extends DateValue = DateValue,\n>\n extends\n Omit<\n AriaDateRangePickerProps<T>,\n 'errorMessage' \| 'form' \| 'name' \| keyof DateFieldBase<T>\n >,\n BaseProps,\n FieldLayoutStyleProps,\n DateFieldBase<T>,\n FieldBaseProps<{ start: T; end: T } \| null \| undefined> {\n wrapperStyles?: Styles;\n inputStyles?: Styles;\n styles?: Styles;\n size?: 'small' \| 'medium' \| 'large' \| (string & {});\n maxVisibleMonths?: number;\n shouldFlip?: boolean;\n /*\n The ref of the element the popover should visually attach itself to.\n * Defaults to the field wrapper.\n \n Forwarded to `DialogTrigger`, so the anchor also becomes what outside-click\n * dismissal treats as the trigger.\n /\n targetRef?: RefObject<HTMLElement \| null>;\n /\n Placement of the popover relative to the anchor.\n * Accepts React Aria's `Placement` strings (e.g. `'bottom start'`,\n * `'top start'`, `'right top'`, `'left top'`).\n * @default 'bottom right'\n */\n placement?: Placement;\n useLocale?: boolean;\n}\n\nfunction DateRangeSeparatedPicker<T extends DateValue>(\n rawProps: CubeDateRangeSeparatedPickerProps<T>,\n ref: FocusableRef<HTMLElement>,\n) {\n const { t } = useI18n();\n\n let props = useFieldProps(rawProps, {\n defaultValidationTrigger: 'onBlur',\n });\n props = Object.assign({}, DEFAULT_DATE_PROPS, props);\n\n // `wrapperStyles` styles the same box as `styles` and wins over it.\n const fieldLayout = splitFieldLayout(props);\n const styles = mergeStyleLayers(fieldLayout.styles, props.wrapperStyles);\n\n let {\n qa,\n size,\n placeholderValue,\n isDisabled,\n isInvalid,\n isValid,\n useLocale: useLocaleProp,\n autoFocus,\n } = props;\n let targetRef = useRef<HTMLDivElement>(null);\n\n let state = useDateRangePickerState({\n ...props,\n });\n\n let startDateProps = {\n ...props,\n onChange: undefined,\n validate: undefined,\n value: state.value?.start,\n defaultValue: props.defaultValue?.start,\n };\n let endDateProps = {\n ...props,\n onChange: undefined,\n validate: undefined,\n value: state.value?.end,\n defaultValue: props.defaultValue?.end,\n };\n let startState = useDatePickerState(startDateProps);\n let endState = useDatePickerState(endDateProps);\n\n let startFocusRingProps = useFocusRing({\n within: true,\n isTextInput: true,\n autoFocus,\n });\n let startFocusProps = useFocusRing({\n within: false,\n isTextInput: false,\n autoFocus,\n });\n let endFocusRingProps = useFocusRing({\n within: true,\n isTextInput: true,\n autoFocus,\n });\n let endFocusProps = useFocusRing({\n within: false,\n isTextInput: false,\n autoFocus,\n });\n\n useFocusManagerRef(ref, targetRef);\n\n let { groupProps, labelProps, startFieldProps, endFieldProps } =\n useDateRangePicker(props, state, targetRef);\n\n let startProps = useDatePicker(startDateProps, startState, targetRef);\n let endProps = useDatePicker(endDateProps, endState, targetRef);\n\n let placeholder: DateValue \| undefined = placeholderValue ?? undefined;\n let timePlaceholder =\n placeholder && 'hour' in placeholder ? placeholder : undefined;\n let timeMinValue =\n props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n let timeMaxValue =\n props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n let timeGranularity =\n state.granularity === 'hour' \|\|\n state.granularity === 'minute' \|\|\n state.granularity === 'second'\n ? state.granularity\n : undefined;\n let showTimeField = !!timeGranularity;\n\n // let visibleMonths = useVisibleMonths(maxVisibleMonths);\n\n function onChange(value: DateValue, type: 'start' \| 'end') {\n if (type === 'start') {\n const newRange = { ...state.value, start: value };\n\n if (\n newRange.start &&\n newRange.end &&\n newRange.end.compare(newRange.start) < 0\n ) {\n newRange.end = newRange.start;\n }\n\n if (newRange.end) {\n state.setValue({ start: newRange.start, end: newRange.end });\n } else {\n state.setDateTime('start', newRange.start);\n }\n startProps.calendarProps.onChange?.(value);\n startState.setOpen(false);\n } else {\n const newRange = { ...state.value, end: value };\n\n if (\n newRange.start &&\n newRange.end &&\n newRange.end.compare(newRange.start) < 0\n ) {\n newRange.start = newRange.end;\n }\n\n if (newRange.start) {\n state.setValue({ start: newRange.start, end: newRange.end });\n } else {\n state.setDateTime('end', newRange.end);\n }\n endProps.calendarProps.onChange?.(value);\n endState.setOpen(false);\n }\n }\n\n const component = (\n <DatePickerElement\n ref={targetRef}\n {...groupProps}\n styles={styles}\n qa={qa \|\| 'DateRangeSeparatedPicker'}\n data-input-type=\"daterangeseparatedpicker\"\n >\n <DateInputBase\n autoFocus={autoFocus}\n disableFocusRing={startFocusProps.isFocused}\n isDisabled={isDisabled}\n isReadOnly={props.isReadOnly}\n isInvalid={isInvalid}\n isValid={isValid}\n size={size}\n {...startFocusRingProps.focusProps}\n suffix={\n <DialogTrigger\n hideArrow\n type=\"popover\"\n placement={props.placement ?? 'bottom right'}\n targetRef={props.targetRef ?? targetRef}\n isOpen={startState.isOpen}\n shouldFlip={props.shouldFlip}\n onOpenChange={startState.setOpen}\n >\n <DatePickerButton\n size={size}\n {...mergeProps(\n startProps.buttonProps,\n startFocusProps.focusProps,\n )}\n // After React Aria's props, whose \"Calendar\" would replace it:\n // the two buttons need different names.\n aria-label={t(\n 'datePicker.showStartCalendar',\n 'Show calendar for the start date',\n )}\n isDisabled={isDisabled}\n />\n <Dialog\n {...startProps.dialogProps}\n width=\"max-content\"\n overflow=\"auto\"\n >\n <Calendar\n {...startProps.calendarProps}\n defaultFocusedValue={\n state.value?.start \|\| state.value?.end \|\| undefined\n }\n selectedRange={\n state.value?.start && state.value?.end\n ? { start: state.value.start, end: state.value.end }\n : undefined\n }\n onChange={(value: DateValue) => onChange(value, 'start')}\n />\n {showTimeField && (\n <TimeInput\n label={t('datePicker.time', 'Time')}\n value={startState.timeValue}\n placeholderValue={timePlaceholder}\n granularity={timeGranularity}\n minValue={timeMinValue}\n maxValue={timeMaxValue}\n hourCycle={props.hourCycle}\n hideTimeZone={props.hideTimeZone}\n onChange={startState.setTimeValue}\n />\n )}\n </Dialog>\n </DialogTrigger>\n }\n >\n <DatePickerInput useLocale={useLocaleProp} {...startFieldProps} />\n </DateInputBase>\n <DateRangeDash />\n <DateInputBase\n disableFocusRing={endFocusProps.isFocused}\n isDisabled={isDisabled}\n isReadOnly={props.isReadOnly}\n isInvalid={isInvalid}\n isValid={isValid}\n size={size}\n {...endFocusRingProps.focusProps}\n suffix={\n <DialogTrigger\n hideArrow\n type=\"popover\"\n placement={props.placement ?? 'bottom right'}\n targetRef={props.targetRef ?? targetRef}\n isOpen={endState.isOpen}\n shouldFlip={props.shouldFlip}\n onOpenChange={endState.setOpen}\n >\n <DatePickerButton\n size={size}\n {...mergeProps(endFocusProps.focusProps, endProps.buttonProps)}\n aria-label={t(\n 'datePicker.showEndCalendar',\n 'Show calendar for the end date',\n )}\n isDisabled={isDisabled}\n />\n <Dialog\n {...endProps.dialogProps}\n width=\"max-content\"\n overflow=\"auto\"\n >\n <Calendar\n {...endProps.calendarProps}\n defaultFocusedValue={\n state.value?.end \|\| state.value?.start \|\| undefined\n }\n selectedRange={\n state.value?.start && state.value?.end\n ? { start: state.value.start, end: state.value.end }\n : undefined\n }\n onChange={(value: DateValue) => {\n onChange(value, 'end');\n }}\n />\n {showTimeField && (\n <TimeInput\n label={t('datePicker.time', 'Time')}\n value={endState.timeValue}\n placeholderValue={timePlaceholder}\n granularity={timeGranularity}\n minValue={timeMinValue}\n maxValue={timeMaxValue}\n hourCycle={props.hourCycle}\n hideTimeZone={props.hideTimeZone}\n onChange={endState.setTimeValue}\n />\n )}\n </Dialog>\n </DialogTrigger>\n }\n >\n <DatePickerInput useLocale={useLocaleProp} {...endFieldProps} />\n </DateInputBase>\n </DatePickerElement>\n );\n\n return wrapWithField(component, {\n ...props,\n ...fieldLayout.field,\n labelProps: mergeProps(props.labelProps, labelProps),\n });\n}\n\nconst _DateRangeSeparatedPicker = forwardRef(DateRangeSeparatedPicker) as <\n T extends DateValue,\n>(\n props: CubeDateRangeSeparatedPickerProps<T> & {\n ref?: FocusableRef<HTMLElement>;\n },\n) => ReactElement;\n\n(_DateRangeSeparatedPicker as any).displayName = 'DateRangeSeparatedPicker';\n\nexport { _DateRangeSeparatedPicker as DateRangeSeparatedPicker };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAmCA,MAAMmC,gBAAgBhC,MAAM;CAC1B,eAAe;CACf,WAAW;CACXiC,UAAU;CACVC,QAAQ;EACNC,SAAS;EACTC,OAAO;CACT;AACF,CAAC;AAsCD,SAAAe,yBAAAC,UAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAIE,MAAA,EAAAC,MAAc3C,QAAQ;CAAE,IAAA4C;CAAA,IAAAH,EAAA,OAAAI,OAAAC,IAAA,2BAAA,GAAA;EAEYF,KAAA,EAAAG,0BACR,SAC5B;EAACN,EAAA,KAAAG;CAAA,OAAAA,KAAAH,EAAA;CAFD,IAAAO,QAAY5C,cAAcmC,UAAUK,EAEnC;CACDI,QAAQC,OAAMC,OAAQ,CAAC,GAAGnC,oBAAoBiC,KAAK;CAGnD,MAAAG,cAAoB5C,iBAAiByC,KAAK;CAC1C,MAAA3B,SAAelB,iBAAiBgD,YAAW9B,QAAS2B,MAAKnB,aAAc;CAEvE,MAAA,EAAAuB,IAAArB,MAAAsB,kBAAAC,YAAAC,WAAAC,SAAAnB,WAAAoB,eAAAC,cASIV;CACJ,MAAAd,YAAgB3C,OAAuB,IAAI;CAE3C,MAAAoE,QAAY5D,wBAAwB,EAAA,GAC/BiD,MACL,CAAC;CAED,MAAAY,iBAAqB;EAAA,GAChBZ;EAAKa,UACEC,KAAAA;EAASC,UACTD,KAAAA;EAASE,OACZL,MAAKK,OAAarC;EAAAsC,cACXjB,MAAKiB,cAAoBtC;CACzC;CACA,MAAAuC,eAAmB;EAAA,GACdlB;EAAKa,UACEC,KAAAA;EAASC,UACTD,KAAAA;EAASE,OACZL,MAAKK,OAAWpC;EAAAqC,cACTjB,MAAKiB,cAAkBrC;CACvC;CACA,MAAAuC,aAAiBrE,mBAAmB8D,cAAc;CAClD,MAAAQ,WAAetE,mBAAmBoE,YAAY;CAE9C,MAAAG,sBAA0BxE,aAAa;EAAAyE,QAC7B;EAAIC,aACC;EAAIb;CAEnB,CAAC;CACD,MAAAc,kBAAsB3E,aAAa;EAAAyE,QACzB;EAAKC,aACA;EAAKb;CAEpB,CAAC;CACD,MAAAe,oBAAwB5E,aAAa;EAAAyE,QAC3B;EAAIC,aACC;EAAIb;CAEnB,CAAC;CACD,MAAAgB,gBAAoB7E,aAAa;EAAAyE,QACvB;EAAKC,aACA;EAAKb;CAEpB,CAAC;CAEDxC,mBAAmBsB,KAAKN,SAAS;CAEjC,MAAA,EAAAyC,YAAAC,YAAAC,iBAAAC,kBACElF,mBAAmBoD,OAAOW,OAAOzB,SAAS;CAE5C,MAAA6C,aAAiBpF,cAAciE,gBAAgBO,YAAYjC,SAAS;CACpE,MAAA8C,WAAerF,cAAcuE,cAAcE,UAAUlC,SAAS;CAE9D,MAAA+C,cAAyC5B,oBAAAS,KAAAA;CACzC,MAAAoB,kBACED,eAAe,UAAUA,cAAzBA,cAAAnB,KAAAA;CACF,MAAAqB,eACEnC,MAAKoC,YAAa,UAAUpC,MAAKoC,WAAYpC,MAAKoC,WAAlDtB,KAAAA;CACF,MAAAuB,eACErC,MAAKsC,YAAa,UAAUtC,MAAKsC,WAAYtC,MAAKsC,WAAlDxB,KAAAA;CACF,MAAAyB,kBACE5B,MAAK6B,gBAAiB,UACtB7B,MAAK6B,gBAAiB,YACtB7B,MAAK6B,gBAAiB,WAClB7B,MAAK6B,cAHT1B,KAAAA;CAKF,MAAA2B,gBAAoB,CAAC,CAACF;CAAgB,IAAAG;CAAA,IAAAjD,EAAA,OAAAuC,SAAAW,iBAAAlD,EAAA,OAAA2B,YAAA3B,EAAA,OAAAsC,WAAAY,iBAAAlD,EAAA,OAAA0B,cAAA1B,EAAA,OAAAkB,OAAA;EAItC+B,KAAA,SAAA7B,SAAAG,OAAA4B,MAAA;GACE,IAAIA,SAAS,SAAO;IAClB,MAAAC,WAAiB;KAAA,GAAKlC,MAAKK;KAAMrC,OAASqC;IAAM;IAEhD,IACE6B,SAAQlE,SACRkE,SAAQjE,OACRiE,SAAQjE,IAAIkE,QAASD,SAAQlE,KAAM,IAAI,GAEvCkE,SAAQjE,MAAOiE,SAAQlE;IAGzB,IAAIkE,SAAQjE,KACV+B,MAAKoC,SAAU;KAAApE,OAASkE,SAAQlE;KAAMC,KAAOiE,SAAQjE;IAAK,CAAC;SAE3D+B,MAAKqC,YAAa,SAASH,SAAQlE,KAAM;IAE3CoD,WAAUY,cAAc9B,WAAYG,KAAK;IACzCG,WAAU8B,QAAS,KAAK;GAAC,OAAA;IAEzB,MAAAC,aAAiB;KAAA,GAAKvC,MAAKK;KAAMpC,KAAOoC;IAAM;IAE9C,IACE6B,WAAQlE,SACRkE,WAAQjE,OACRiE,WAAQjE,IAAIkE,QAASD,WAAQlE,KAAM,IAAI,GAEvCkE,WAAQlE,QAASkE,WAAQjE;IAG3B,IAAIiE,WAAQlE,OACVgC,MAAKoC,SAAU;KAAApE,OAASkE,WAAQlE;KAAMC,KAAOiE,WAAQjE;IAAK,CAAC;SAE3D+B,MAAKqC,YAAa,OAAOH,WAAQjE,GAAI;IAEvCoD,SAAQW,cAAc9B,WAAYG,KAAK;IACvCI,SAAQ6B,QAAS,KAAK;GAAC;EACxB;EACFxD,EAAA,KAAAuC,SAAAW;EAAAlD,EAAA,KAAA2B;EAAA3B,EAAA,KAAAsC,WAAAY;EAAAlD,EAAA,KAAA0B;EAAA1B,EAAA,KAAAkB;EAAAlB,EAAA,KAAAiD;CAAA,OAAAA,KAAAjD,EAAA;CAtCD,MAAAoB,WAAA6B;CAkDwB,MAAAS,KAAA3B,gBAAe4B;CAErB,MAAAC,KAAArD,MAAKsD;CAIb,MAAAC,KAAAlC,oBAAmBmC;CAOX,MAAAC,KAAAtC,WAAUuC;CACN,MAAAC,KAAA3D,MAAKf;CACH,MAAA2E,KAAAzC,WAAU8B;CAAQ,IAAAY;CAAA,IAAApE,EAAA,OAAA+B,gBAAAgC,cAAA/D,EAAA,OAAAsC,WAAA+B,aAAA;EAI1BD,KAAA3G,aACF6E,WAAU+B,aACVtC,gBAAegC,UACjB;EAAC/D,EAAA,KAAA+B,gBAAAgC;EAAA/D,EAAA,KAAAsC,WAAA+B;EAAArE,EAAA,KAAAoE;CAAA,OAAAA,KAAApE,EAAA;CAAA,IAAAsE;CAAA,IAAAtE,EAAA,QAAAE,GAAA;EAGWoE,KAAApE,EACV,gCACA,kCACF;EAACF,EAAA,MAAAE;EAAAF,EAAA,MAAAsE;CAAA,OAAAA,KAAAtE,EAAA;CAWG,MAAAuE,MAAArD,MAAKK,OAAarC,SAAIgC,MAAKK,OAAWpC,OAAtCkC,KAAAA;CAAmD,IAAAmD;CAAA,IAAAxE,EAAA,QAAAkB,MAAAK,OAAA;EAGnDiD,MAAAtD,MAAKK,OAAarC,SAAIgC,MAAKK,OAAWpC,MAAtC;GAAAD,OACagC,MAAKK,MAAMrC;GAAMC,KAAO+B,MAAKK,MAAMpC;EACpC,IAFZkC,KAAAA;EAEarB,EAAA,MAAAkB,MAAAK;EAAAvB,EAAA,MAAAwE;CAAA,OAAAA,MAAAxE,EAAA;CAAA,IAAAyE;CAAA,IAAAzE,EAAA,QAAAoB,UAAA;EAELqD,OAAAC,YAAsBtD,SAASG,SAAO,OAAO;EAACvB,EAAA,MAAAoB;EAAApB,EAAA,MAAAyE;CAAA,OAAAA,MAAAzE,EAAA;CAAA,IAAA2E;CAAA,IAAA3E,EAAA,QAAAsC,WAAAY,iBAAAlD,EAAA,QAAAuE,OAAAvE,EAAA,QAAAwE,OAAAxE,EAAA,QAAAyE,KAAA;EAV1DE,MAAA,oBAACoC,WAAD;GAAS,GACHzE,WAAUY;GAEZ,qBAAAqB;GAGA,eAAAC;GAIQ,UAAAC;EAA8C,CAAA;EACxDzE,EAAA,MAAAsC,WAAAY;EAAAlD,EAAA,MAAAuE;EAAAvE,EAAA,MAAAwE;EAAAxE,EAAA,MAAAyE;EAAAzE,EAAA,MAAA2E;CAAA,OAAAA,MAAA3E,EAAA;CACD,MAAA4E,MAAA5B,iBACC,oBAACgE,YAAD;EACS,OAAA9G,EAAE,mBAAmB,MAAM;EAC3B,OAAAwB,WAAUmD;EACCpC,kBAAAA;EACLK,aAAAA;EACHJ,UAAAA;EACAE,UAAAA;EACC,WAAArC,MAAKuE;EACF,cAAAvE,MAAKwE;EACT,UAAArD,WAAUsD;CAAa,CAAA;CAEpC,IAAAC;CAAA,IAAAjF,EAAA,QAAAsC,WAAA4C,eAAAlF,EAAA,QAAA2E,OAAA3E,EAAA,QAAA4E,KAAA;EA7BHK,MAAA,qBAAC,QAAD;GAAO,GACD3C,WAAU4C;GACR,OAAA;GACG,UAAA;GAHX,UAAA,CAKEP,KAYCC,GAjBI;;EA8BE5E,EAAA,MAAAsC,WAAA4C;EAAAlF,EAAA,MAAA2E;EAAA3E,EAAA,MAAA4E;EAAA5E,EAAA,MAAAiF;CAAA,OAAAA,MAAAjF,EAAA;CAAA,IAAAmF;CAAA,IAAAnF,EAAA,QAAAI,OAAAC,IAAA,2BAAA,GAAA;EAMf8E,MAAA,oBAAC,eAAD,CAAc,CAAA;EAAGnF,EAAA,MAAAmF;CAAA,OAAAA,MAAAnF,EAAA;CAEG,MAAAoF,MAAAnD,cAAa0B;CAEnB,MAAA0B,MAAA9E,MAAKsD;CAIb,MAAAyB,MAAAtD,kBAAiB+B;CAKN,MAAAwB,MAAAhF,MAAKZ,aAAL;CACA,MAAA6F,MAAAjF,MAAKd,aAALA;CACH,MAAAgG,MAAA9D,SAAQsC;CACJ,MAAAyB,MAAAnF,MAAKf;CACH,MAAAmG,MAAAhE,SAAQ6B;CAAQ,IAAAoC;CAAA,IAAA5F,EAAA,QAAAiC,cAAA8B,cAAA/D,EAAA,QAAAuC,SAAA8B,aAAA;EAIxBuB,MAAAnI,aAAWwE,cAAa8B,YAAaxB,SAAQ8B,WAAY;EAACrE,EAAA,MAAAiC,cAAA8B;EAAA/D,EAAA,MAAAuC,SAAA8B;EAAArE,EAAA,MAAA4F;CAAA,OAAAA,MAAA5F,EAAA;CAAA,IAAA6F;CAAA,IAAA7F,EAAA,QAAAE,GAAA;EAClD2F,MAAA3F,EACV,8BACA,gCACF;EAACF,EAAA,MAAAE;EAAAF,EAAA,MAAA6F;CAAA,OAAAA,MAAA7F,EAAA;CAAA,IAAA8F;CAAA,IAAA9F,EAAA,QAAAa,cAAAb,EAAA,QAAAV,QAAAU,EAAA,QAAA4F,OAAA5F,EAAA,QAAA6F,KAAA;EANHC,MAAA,oBAAC,kBAAD;GACQxG;GAAI,GACNsG;GACQ,cAAAC;GAIAhF;EAAU,CAAA;EACtBb,EAAA,MAAAa;EAAAb,EAAA,MAAAV;EAAAU,EAAA,MAAA4F;EAAA5F,EAAA,MAAA6F;EAAA7F,EAAA,MAAA8F;CAAA,OAAAA,MAAA9F,EAAA;CASI,MAAA+F,MAAA7E,MAAKK,OAAWpC,OAAI+B,MAAKK,OAAarC,SAAtCmC,KAAAA;CAAmD,IAAA2E;CAAA,IAAAhG,EAAA,QAAAkB,MAAAK,OAAA;EAGnDyE,MAAA9E,MAAKK,OAAarC,SAAIgC,MAAKK,OAAWpC,MAAtC;GAAAD,OACagC,MAAKK,MAAMrC;GAAMC,KAAO+B,MAAKK,MAAMpC;EACpC,IAFZkC,KAAAA;EAEarB,EAAA,MAAAkB,MAAAK;EAAAvB,EAAA,MAAAgG;CAAA,OAAAA,MAAAhG,EAAA;CAAA,IAAAiG;CAAA,IAAAjG,EAAA,QAAAoB,UAAA;EAEL6E,OAAAC,YAAA;GACR9E,SAASG,SAAO,KAAK;EAAC;EACvBvB,EAAA,MAAAoB;EAAApB,EAAA,MAAAiG;CAAA,OAAAA,MAAAjG,EAAA;CAAA,IAAAmG;CAAA,IAAAnG,EAAA,QAAAuC,SAAAW,iBAAAlD,EAAA,QAAA+F,OAAA/F,EAAA,QAAAgG,OAAAhG,EAAA,QAAAiG,KAAA;EAZHE,MAAA,oBAACY,WAAD;GAAS,GACHxE,SAAQW;GAEV,qBAAA6C;GAGA,eAAAC;GAIQ,UAAAC;EAET,CAAA;EACDjG,EAAA,MAAAuC,SAAAW;EAAAlD,EAAA,MAAA+F;EAAA/F,EAAA,MAAAgG;EAAAhG,EAAA,MAAAiG;EAAAjG,EAAA,MAAAmG;CAAA,OAAAA,MAAAnG,EAAA;CACD,MAAAoG,MAAApD,iBACC,oBAACgE,YAAD;EACS,OAAA9G,EAAE,mBAAmB,MAAM;EAC3B,OAAAyB,SAAQkD;EACGpC,kBAAAA;EACLK,aAAAA;EACHJ,UAAAA;EACAE,UAAAA;EACC,WAAArC,MAAKuE;EACF,cAAAvE,MAAKwE;EACT,UAAApD,SAAQqD;CAAa,CAAA;CAElC,IAAAqB;CAAA,IAAArG,EAAA,QAAAuC,SAAA2C,eAAAlF,EAAA,QAAAmG,OAAAnG,EAAA,QAAAoG,KAAA;EA/BHC,MAAA,qBAAC,QAAD;GAAO,GACD9D,SAAQ2C;GACN,OAAA;GACG,UAAA;GAHX,UAAA,CAKEiB,KAcCC,GAnBI;;EAgCEpG,EAAA,MAAAuC,SAAA2C;EAAAlF,EAAA,MAAAmG;EAAAnG,EAAA,MAAAoG;EAAApG,EAAA,MAAAqG;CAAA,OAAAA,MAAArG,EAAA;CAAA,IAAAsG;CAAA,IAAAtG,EAAA,QAAA2B,SAAAsC,UAAAjE,EAAA,QAAA2B,SAAA6B,WAAAxD,EAAA,QAAAO,SAAAP,EAAA,QAAAuF,OAAAvF,EAAA,QAAAwF,OAAAxF,EAAA,QAAA8F,OAAA9F,EAAA,QAAAqG,KAAA;EAlDXC,MAAA,qBAAC,eAAD;GACE,WAAA;GACK,MAAA;GACM,WAAAf;GACA,WAAAC;GACH,QAAAC;GACI,YAAAC;GACE,cAAAC;GAPhB,UAAA,CASEG,KASAO,GAlBY;;EAmDErG,EAAA,MAAA2B,SAAAsC;EAAAjE,EAAA,MAAA2B,SAAA6B;EAAAxD,EAAA,MAAAO;EAAAP,EAAA,MAAAuF;EAAAvF,EAAA,MAAAwF;EAAAxF,EAAA,MAAA8F;EAAA9F,EAAA,MAAAqG;EAAArG,EAAA,MAAAsG;CAAA,OAAAA,MAAAtG,EAAA;CAAA,IAAAuG;CAAA,IAAAvG,EAAA,QAAAqC,iBAAArC,EAAA,QAAAgB,eAAA;EAGlBuF,MAAA,oBAAC,iBAAD;GAA4BvF,WAAAA;GAAa,GAAMqB;EAAa,CAAA;EAAIrC,EAAA,MAAAqC;EAAArC,EAAA,MAAAgB;EAAAhB,EAAA,MAAAuG;CAAA,OAAAA,MAAAvG,EAAA;CAAA,IAAAwG;CAAA,IAAAxG,EAAA,QAAAiC,cAAA0B,aAAA3D,EAAA,QAAAgC,kBAAA+B,cAAA/D,EAAA,QAAAa,cAAAb,EAAA,QAAAc,aAAAd,EAAA,QAAAe,WAAAf,EAAA,QAAAO,SAAAP,EAAA,QAAAV,QAAAU,EAAA,QAAAsG,OAAAtG,EAAA,QAAAuG,KAAA;EA/DlEC,MAAA,oBAACS,gBAAD;GACoB,kBAAA7B;GACNvE;GACA,YAAAwE;GACDvE;GACFC;GACHzB;GAAI,GACNgG;GAEF,QAAAgB;GAsDFC,UAAAA;EA/DY,CAAA;EAgEEvG,EAAA,MAAAiC,cAAA0B;EAAA3D,EAAA,MAAAgC,kBAAA+B;EAAA/D,EAAA,MAAAa;EAAAb,EAAA,MAAAc;EAAAd,EAAA,MAAAe;EAAAf,EAAA,MAAAO;EAAAP,EAAA,MAAAV;EAAAU,EAAA,MAAAsG;EAAAtG,EAAA,MAAAuG;EAAAvG,EAAA,MAAAwG;CAAA,OAAAA,MAAAxG,EAAA;CA9IpB,MAAAyG,YACE,qBAAC,mBAAD;EACOhH,KAAAA;EAAS,GACVyC;EACItD;EACJ,IAAA+B,MAAA;EACY,mBAAA;EALlB,UAAA;GAOE,oBAACsG,gBAAD;IACahG;IACO,kBAAAyC;IACN7C;IACA,YAAA+C;IACD9C;IACFC;IACHzB;IAAI,GACNwE;IAEF,QAAA,qBAAC,eAAD;KACE,WAAA;KACK,MAAA;KACM,WAAAvD,MAAKZ,aAAL;KACA,WAAAY,MAAKd,aAALA;KACH,QAAAuE;KACI,YAAAE;KACE,cAAAC;KAPhB,UAAA,CASE,oBAAC,kBAAD;MACQ7E;MAAI,GACN8E;MAMQ,cAAAE;MAIAzD;KAAU,CAAA,GAExBoE,GAvBY;;IAyDhB,UAAA,oBAAC,iBAAD;KAA4BjE,WAAAA;KAAa,GAAMoB;IAAe,CAAA;GAnElD,CAAA;GAqEd+C;GACAqB;EA7EgB;;CA+IlB,OAEK5I,cAAc6I,WAAW;EAAA,GAC3BlG;EAAK,GACLG,YAAWgG;EAAMvE,YACR1E,aAAW8C,MAAK4B,YAAaA,UAAU;CACrD,CAAC;AAAC;AAGJ,MAAMwE,4BAA4BhK,WAAWkD,wBAAwB;AAQrE,0BAAmC+G,cAAc"}
1	+ {"version":3,"file":"DateRangeSeparatedPicker.js","names":["FocusableRef","BaseProps","Styles","tasty","forwardRef","ReactElement","RefObject","useRef","AriaDateRangePickerProps","DateValue","Placement","useDatePicker","useDateRangePicker","useFocusRing","useDatePickerState","useDateRangePickerState","useI18n","FieldBaseProps","mergeProps","useFieldProps","wrapWithField","FieldLayoutStyleProps","splitFieldLayout","Calendar","Dialog","DialogTrigger","DateInputBase","DatePickerButton","DatePickerElement","DatePickerInput","DEFAULT_DATE_PROPS","TimeInput","DateFieldBase","useFocusManagerRef","DateRangeDash","children","styles","padding","color","CubeDateRangeSeparatedPickerProps","Omit","T","start","end","wrapperStyles","inputStyles","size","maxVisibleMonths","shouldFlip","targetRef","HTMLElement","placement","useLocale","DateRangeSeparatedPicker","rawProps","ref","$","_c","t","t0","Symbol","for","defaultValidationTrigger","props","Object","assign","fieldLayout","overStyles","qa","placeholderValue","isDisabled","isInvalid","isValid","useLocaleProp","autoFocus","state","startDateProps","onChange","undefined","validate","value","defaultValue","endDateProps","startState","endState","startFocusRingProps","within","isTextInput","startFocusProps","endFocusRingProps","endFocusProps","groupProps","labelProps","startFieldProps","endFieldProps","startProps","endProps","placeholder","timePlaceholder","timeMinValue","minValue","timeMaxValue","maxValue","timeGranularity","granularity","showTimeField","t1","calendarProps","type","newRange","compare","setValue","setDateTime","setOpen","newRange_0","t2","isFocused","t3","isReadOnly","t4","focusProps","t5","isOpen","t6","t7","t8","buttonProps","t9","t10","t11","t12","value_0","t13","t14","timeValue","hourCycle","hideTimeZone","setTimeValue","t15","dialogProps","t16","t17","t18","t19","t20","t21","t22","t23","t24","t25","t26","t27","t28","t29","t30","value_1","t31","t32","t33","t34","t35","t36","component","field","_DateRangeSeparatedPicker","displayName","_c","mergeProps","Calendar","TimeInput","DateInputBase"],"sources":["../../../../src/components/fields/DatePicker/DateRangeSeparatedPicker.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { BaseProps, Styles, tasty } from '@tenphi/tasty';\nimport { forwardRef, ReactElement, RefObject, useRef } from 'react';\nimport {\n AriaDateRangePickerProps,\n DateValue,\n Placement,\n useDatePicker,\n useDateRangePicker,\n useFocusRing,\n} from 'react-aria';\nimport { useDatePickerState, useDateRangePickerState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { useFieldProps, wrapWithField } from '../../form';\nimport {\n FieldLayoutStyleProps,\n splitFieldLayout,\n} from '../../form/field-layout';\nimport { Calendar } from '../../other/Calendar/Calendar';\nimport { Dialog } from '../../overlays/Dialog/Dialog';\nimport { DialogTrigger } from '../../overlays/Dialog/DialogTrigger';\n\nimport { DateInputBase } from './DateInputBase';\nimport { DatePickerButton } from './DatePickerButton';\nimport { DatePickerElement } from './DatePickerElement';\nimport { DatePickerInput } from './DatePickerInput';\nimport { DEFAULT_DATE_PROPS } from './props';\nimport { TimeInput } from './TimeInput';\nimport { DateFieldBase } from './types';\nimport { useFocusManagerRef } from './utils';\n\nconst DateRangeDash = tasty({\n 'aria-hidden': 'true',\n 'data-qa': 'DateRangeDash',\n children: '–',\n styles: {\n padding: '0 .5x',\n color: '#dark-03',\n },\n});\n\nexport interface CubeDateRangeSeparatedPickerProps<\n T extends DateValue = DateValue,\n>\n extends\n Omit<\n AriaDateRangePickerProps<T>,\n 'errorMessage' \| 'form' \| 'name' \| keyof DateFieldBase<T>\n >,\n BaseProps,\n FieldLayoutStyleProps,\n DateFieldBase<T>,\n FieldBaseProps<{ start: T; end: T } \| null \| undefined> {\n wrapperStyles?: Styles;\n inputStyles?: Styles;\n styles?: Styles;\n size?: 'small' \| 'medium' \| 'large' \| (string & {});\n maxVisibleMonths?: number;\n shouldFlip?: boolean;\n /*\n The ref of the element the popover should visually attach itself to.\n * Defaults to the field wrapper.\n \n Forwarded to `DialogTrigger`, so the anchor also becomes what outside-click\n * dismissal treats as the trigger.\n /\n targetRef?: RefObject<HTMLElement \| null>;\n /\n Placement of the popover relative to the anchor.\n * Accepts React Aria's `Placement` strings (e.g. `'bottom start'`,\n * `'top start'`, `'right top'`, `'left top'`).\n * @default 'bottom right'\n */\n placement?: Placement;\n useLocale?: boolean;\n}\n\nfunction DateRangeSeparatedPicker<T extends DateValue>(\n rawProps: CubeDateRangeSeparatedPickerProps<T>,\n ref: FocusableRef<HTMLElement>,\n) {\n const { t } = useI18n();\n\n let props = useFieldProps(rawProps, {\n defaultValidationTrigger: 'onBlur',\n });\n props = Object.assign({}, DEFAULT_DATE_PROPS, props);\n\n // `wrapperStyles` styles the same box as `styles` and wins over it.\n const fieldLayout = splitFieldLayout(props, {\n overStyles: props.wrapperStyles,\n });\n const styles = fieldLayout.styles;\n\n let {\n qa,\n size,\n placeholderValue,\n isDisabled,\n isInvalid,\n isValid,\n useLocale: useLocaleProp,\n autoFocus,\n } = props;\n let targetRef = useRef<HTMLDivElement>(null);\n\n let state = useDateRangePickerState({\n ...props,\n });\n\n let startDateProps = {\n ...props,\n onChange: undefined,\n validate: undefined,\n value: state.value?.start,\n defaultValue: props.defaultValue?.start,\n };\n let endDateProps = {\n ...props,\n onChange: undefined,\n validate: undefined,\n value: state.value?.end,\n defaultValue: props.defaultValue?.end,\n };\n let startState = useDatePickerState(startDateProps);\n let endState = useDatePickerState(endDateProps);\n\n let startFocusRingProps = useFocusRing({\n within: true,\n isTextInput: true,\n autoFocus,\n });\n let startFocusProps = useFocusRing({\n within: false,\n isTextInput: false,\n autoFocus,\n });\n let endFocusRingProps = useFocusRing({\n within: true,\n isTextInput: true,\n autoFocus,\n });\n let endFocusProps = useFocusRing({\n within: false,\n isTextInput: false,\n autoFocus,\n });\n\n useFocusManagerRef(ref, targetRef);\n\n let { groupProps, labelProps, startFieldProps, endFieldProps } =\n useDateRangePicker(props, state, targetRef);\n\n let startProps = useDatePicker(startDateProps, startState, targetRef);\n let endProps = useDatePicker(endDateProps, endState, targetRef);\n\n let placeholder: DateValue \| undefined = placeholderValue ?? undefined;\n let timePlaceholder =\n placeholder && 'hour' in placeholder ? placeholder : undefined;\n let timeMinValue =\n props.minValue && 'hour' in props.minValue ? props.minValue : undefined;\n let timeMaxValue =\n props.maxValue && 'hour' in props.maxValue ? props.maxValue : undefined;\n let timeGranularity =\n state.granularity === 'hour' \|\|\n state.granularity === 'minute' \|\|\n state.granularity === 'second'\n ? state.granularity\n : undefined;\n let showTimeField = !!timeGranularity;\n\n // let visibleMonths = useVisibleMonths(maxVisibleMonths);\n\n function onChange(value: DateValue, type: 'start' \| 'end') {\n if (type === 'start') {\n const newRange = { ...state.value, start: value };\n\n if (\n newRange.start &&\n newRange.end &&\n newRange.end.compare(newRange.start) < 0\n ) {\n newRange.end = newRange.start;\n }\n\n if (newRange.end) {\n state.setValue({ start: newRange.start, end: newRange.end });\n } else {\n state.setDateTime('start', newRange.start);\n }\n startProps.calendarProps.onChange?.(value);\n startState.setOpen(false);\n } else {\n const newRange = { ...state.value, end: value };\n\n if (\n newRange.start &&\n newRange.end &&\n newRange.end.compare(newRange.start) < 0\n ) {\n newRange.start = newRange.end;\n }\n\n if (newRange.start) {\n state.setValue({ start: newRange.start, end: newRange.end });\n } else {\n state.setDateTime('end', newRange.end);\n }\n endProps.calendarProps.onChange?.(value);\n endState.setOpen(false);\n }\n }\n\n const component = (\n <DatePickerElement\n ref={targetRef}\n {...groupProps}\n styles={styles}\n qa={qa \|\| 'DateRangeSeparatedPicker'}\n data-input-type=\"daterangeseparatedpicker\"\n >\n <DateInputBase\n autoFocus={autoFocus}\n disableFocusRing={startFocusProps.isFocused}\n isDisabled={isDisabled}\n isReadOnly={props.isReadOnly}\n isInvalid={isInvalid}\n isValid={isValid}\n size={size}\n {...startFocusRingProps.focusProps}\n suffix={\n <DialogTrigger\n hideArrow\n type=\"popover\"\n placement={props.placement ?? 'bottom right'}\n targetRef={props.targetRef ?? targetRef}\n isOpen={startState.isOpen}\n shouldFlip={props.shouldFlip}\n onOpenChange={startState.setOpen}\n >\n <DatePickerButton\n size={size}\n {...mergeProps(\n startProps.buttonProps,\n startFocusProps.focusProps,\n )}\n // After React Aria's props, whose \"Calendar\" would replace it:\n // the two buttons need different names.\n aria-label={t(\n 'datePicker.showStartCalendar',\n 'Show calendar for the start date',\n )}\n isDisabled={isDisabled}\n />\n <Dialog\n {...startProps.dialogProps}\n width=\"max-content\"\n overflow=\"auto\"\n >\n <Calendar\n {...startProps.calendarProps}\n defaultFocusedValue={\n state.value?.start \|\| state.value?.end \|\| undefined\n }\n selectedRange={\n state.value?.start && state.value?.end\n ? { start: state.value.start, end: state.value.end }\n : undefined\n }\n onChange={(value: DateValue) => onChange(value, 'start')}\n />\n {showTimeField && (\n <TimeInput\n label={t('datePicker.time', 'Time')}\n value={startState.timeValue}\n placeholderValue={timePlaceholder}\n granularity={timeGranularity}\n minValue={timeMinValue}\n maxValue={timeMaxValue}\n hourCycle={props.hourCycle}\n hideTimeZone={props.hideTimeZone}\n onChange={startState.setTimeValue}\n />\n )}\n </Dialog>\n </DialogTrigger>\n }\n >\n <DatePickerInput useLocale={useLocaleProp} {...startFieldProps} />\n </DateInputBase>\n <DateRangeDash />\n <DateInputBase\n disableFocusRing={endFocusProps.isFocused}\n isDisabled={isDisabled}\n isReadOnly={props.isReadOnly}\n isInvalid={isInvalid}\n isValid={isValid}\n size={size}\n {...endFocusRingProps.focusProps}\n suffix={\n <DialogTrigger\n hideArrow\n type=\"popover\"\n placement={props.placement ?? 'bottom right'}\n targetRef={props.targetRef ?? targetRef}\n isOpen={endState.isOpen}\n shouldFlip={props.shouldFlip}\n onOpenChange={endState.setOpen}\n >\n <DatePickerButton\n size={size}\n {...mergeProps(endFocusProps.focusProps, endProps.buttonProps)}\n aria-label={t(\n 'datePicker.showEndCalendar',\n 'Show calendar for the end date',\n )}\n isDisabled={isDisabled}\n />\n <Dialog\n {...endProps.dialogProps}\n width=\"max-content\"\n overflow=\"auto\"\n >\n <Calendar\n {...endProps.calendarProps}\n defaultFocusedValue={\n state.value?.end \|\| state.value?.start \|\| undefined\n }\n selectedRange={\n state.value?.start && state.value?.end\n ? { start: state.value.start, end: state.value.end }\n : undefined\n }\n onChange={(value: DateValue) => {\n onChange(value, 'end');\n }}\n />\n {showTimeField && (\n <TimeInput\n label={t('datePicker.time', 'Time')}\n value={endState.timeValue}\n placeholderValue={timePlaceholder}\n granularity={timeGranularity}\n minValue={timeMinValue}\n maxValue={timeMaxValue}\n hourCycle={props.hourCycle}\n hideTimeZone={props.hideTimeZone}\n onChange={endState.setTimeValue}\n />\n )}\n </Dialog>\n </DialogTrigger>\n }\n >\n <DatePickerInput useLocale={useLocaleProp} {...endFieldProps} />\n </DateInputBase>\n </DatePickerElement>\n );\n\n return wrapWithField(component, {\n ...props,\n ...fieldLayout.field,\n labelProps: mergeProps(props.labelProps, labelProps),\n });\n}\n\nconst _DateRangeSeparatedPicker = forwardRef(DateRangeSeparatedPicker) as <\n T extends DateValue,\n>(\n props: CubeDateRangeSeparatedPickerProps<T> & {\n ref?: FocusableRef<HTMLElement>;\n },\n) => ReactElement;\n\n(_DateRangeSeparatedPicker as any).displayName = 'DateRangeSeparatedPicker';\n\nexport { _DateRangeSeparatedPicker as DateRangeSeparatedPicker };\n"],"mappings":"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"}

package/dist/components/fields/DatePicker/MonthPicker.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 import { PeriodPicker } from "./PeriodPicker.js";
 import { c } from "react/compiler-runtime";
 import { forwardRef } from "react";

package/dist/components/fields/DatePicker/PeriodPicker.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 import { mergeStyleLayers } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useI18n } from "../../../i18n/useI18n.js";
@@ -46,7 +46,7 @@ function PeriodPickerImpl(rawProps, ref) {
 		$[0] = t0;
 	} else t0 = $[0];
 	const props = useFieldProps(rawProps, t0);
-	const { styles, field } = splitFieldLayout(props);
+	const { styles, field } = splitFieldLayout(props, { overStyles: props.wrapperStyles });
 	const { qa, size, picker: t1, placeholder, formatValue, isDisabled, isReadOnly, isInvalid, isValid, autoFocus } = props;
 	const picker = t1 === void 0 ? "month" : t1;
 	let t2;
@@ -176,7 +176,7 @@ function PeriodPickerImpl(rawProps, ref) {
 		$[36] = t12;
 	} else t12 = $[36];
 	const panel = t12;
-	const t13 = mergeStyleLayers({ display: "grid" }, styles, props.wrapperStyles);
+	const t13 = mergeStyleLayers({ display: "grid" }, styles);
 	const t14 = isDisabled || isReadOnly ? INERT_INPUT_STYLES : INPUT_STYLES;
 	let t15;
 	if ($[37] !== props.inputStyles || $[38] !== t14) {

package/dist/components/fields/DatePicker/PeriodPicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PeriodPicker.js","names":["FocusableRef","BaseProps","Styles","tasty","forwardRef","ReactElement","RefObject","useId","useRef","AriaDatePickerProps","DateValue","Placement","useDatePicker","useFocusRing","useLocale","useDatePickerState","useI18n","FieldBaseProps","mergeProps","mergeStyleLayers","useFieldProps","wrapWithField","FieldLayoutStyleProps","splitFieldLayout","Calendar","PeriodCalendar","Dialog","DialogTrigger","DateInputBase","DatePickerButton","formatPeriod","PickerType","snapToPeriod","useFocusManagerRef","PeriodValueElement","qa","styles","preset","width","whiteSpace","textOverflow","overflow","color","placeholder","disabled","CubePeriodPickerProps","Omit","T","picker","wrapperStyles","inputStyles","triggerStyles","size","shouldFlip","targetRef","HTMLElement","placement","formatValue","date","locale","INPUT_STYLES","cursor","INERT_INPUT_STYLES","PeriodPickerImpl","rawProps","ref","$","_c","t","t0","Symbol","for","defaultValidationTrigger","props","field","t1","isDisabled","isReadOnly","isInvalid","isValid","autoFocus","undefined","t2","t3","t4","t5","t6","week","month","quarter","year","defaultPlaceholder","t7","granularity","shouldCloseOnSelect","state","isOpen","setOpen","domRef","t8","within","isTextInput","isFocused","isFocusedButton","focusProps","focusPropsButton","t9","groupProps","labelProps","buttonProps","dialogProps","calendarProps","t10","setValue","handleSelect","t11","value","displayText","valueId","t12","minValue","maxValue","isDateUnavailable","panel","t13","display","t14","t15","t16","t17","t18","t19","t20","t21","t22","t23","t24","t25","t26","component","_PeriodPicker","displayName","PeriodPicker","_c","Calendar","mergeProps","DateInputBase"],"sources":["../../../../src/components/fields/DatePicker/PeriodPicker.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { BaseProps, Styles, tasty } from '@tenphi/tasty';\nimport { forwardRef, ReactElement, RefObject, useId, useRef } from 'react';\nimport {\n AriaDatePickerProps,\n DateValue,\n Placement,\n useDatePicker,\n useFocusRing,\n useLocale,\n} from 'react-aria';\nimport { useDatePickerState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { mergeStyleLayers } from '../../../utils/styles';\nimport { useFieldProps, wrapWithField } from '../../form';\nimport {\n FieldLayoutStyleProps,\n splitFieldLayout,\n} from '../../form/field-layout';\nimport { Calendar } from '../../other/Calendar/Calendar';\nimport { PeriodCalendar } from '../../other/Calendar/PeriodCalendar';\nimport { Dialog } from '../../overlays/Dialog/Dialog';\nimport { DialogTrigger } from '../../overlays/Dialog/DialogTrigger';\n\nimport { DateInputBase } from './DateInputBase';\nimport { DatePickerButton } from './DatePickerButton';\nimport { formatPeriod, PickerType, snapToPeriod } from './period';\nimport { useFocusManagerRef } from './utils';\n\nconst PeriodValueElement = tasty({\n qa: 'PeriodPickerValue',\n styles: {\n preset: 't3',\n width: 'max 100%',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n overflow: 'hidden',\n color: {\n '': '#dark',\n placeholder: '#dark.30',\n disabled: '#dark.30',\n },\n },\n});\n\nexport interface CubePeriodPickerProps<T extends DateValue = DateValue>\n extends\n Omit<\n AriaDatePickerProps<T>,\n 'errorMessage' \| 'granularity' \| 'form' \| 'name'\n >,\n BaseProps,\n FieldLayoutStyleProps,\n FieldBaseProps<T \| null \| undefined> {\n /** Which period the picker selects. Set by the concrete picker components. /\n picker?: PickerType;\n wrapperStyles?: Styles;\n inputStyles?: Styles;\n triggerStyles?: Styles;\n styles?: Styles;\n size?: 'small' \| 'medium' \| 'large' \| (string & {});\n shouldFlip?: boolean;\n /\n The ref of the element the popover should visually attach itself to.\n * Defaults to the field wrapper.\n \n Forwarded to `DialogTrigger`, so the anchor also becomes what outside-click\n * dismissal treats as the trigger.\n /\n targetRef?: RefObject<HTMLElement \| null>;\n /\n Placement of the popover relative to the anchor.\n * Accepts React Aria's `Placement` strings (e.g. `'bottom start'`,\n * `'top start'`, `'right top'`, `'left top'`).\n * @default 'bottom right'\n /\n placement?: Placement;\n /* Placeholder shown when no value is selected. /\n placeholder?: string;\n /* Override how the selected value is rendered as text. */\n formatValue?: (date: DateValue, picker: PickerType, locale: string) => string;\n}\n\nconst INPUT_STYLES: Styles = { cursor: 'pointer' };\nconst INERT_INPUT_STYLES: Styles = { cursor: 'default' };\n\nfunction PeriodPickerImpl<T extends DateValue>(\n rawProps: CubePeriodPickerProps<T>,\n ref: FocusableRef<HTMLElement>,\n) {\n const { t } = useI18n();\n\n let props = useFieldProps(rawProps, {\n defaultValidationTrigger: 'onBlur',\n });\n\n const { styles, field } = splitFieldLayout(props);\n\n let {\n qa,\n size,\n picker = 'month',\n placeholder,\n formatValue,\n isDisabled,\n isReadOnly,\n isInvalid,\n isValid,\n autoFocus,\n } = props;\n\n let defaultPlaceholder: Record<PickerType, string> = {\n week: t('datePicker.selectWeek', 'Select week'),\n month: t('datePicker.selectMonth', 'Select month'),\n quarter: t('datePicker.selectQuarter', 'Select quarter'),\n year: t('datePicker.selectYear', 'Select year'),\n };\n\n let { locale } = useLocale();\n let targetRef = useRef<HTMLDivElement>(null);\n let state = useDatePickerState({\n ...props,\n granularity: 'day',\n shouldCloseOnSelect: true,\n });\n let { isOpen, setOpen } = state;\n\n let domRef = useRef<HTMLDivElement>(null);\n\n useFocusManagerRef(ref, domRef);\n\n let { isFocused: isFocusedButton, focusProps: focusPropsButton } =\n useFocusRing({\n within: false,\n isTextInput: false,\n autoFocus,\n });\n\n let { groupProps, labelProps, buttonProps, dialogProps, calendarProps } =\n useDatePicker({ ...props, granularity: 'day' }, state, targetRef);\n\n let handleSelect = (date: DateValue) => {\n state.setValue(snapToPeriod(date, picker, locale));\n setOpen(false);\n };\n\n let displayText = state.value\n ? (formatValue ?? formatPeriod)(state.value, picker, locale)\n : (placeholder ?? defaultPlaceholder[picker]);\n\n // The value is rendered as text rather than editable segments, so the trigger\n // has to point at it to announce the current selection.\n let valueId = useId();\n\n const panel =\n picker === 'week' ? (\n <Calendar\n {...calendarProps}\n autoFocus\n pickerMode=\"week\"\n isDisabled={isDisabled}\n onChange={handleSelect}\n />\n ) : (\n <PeriodCalendar\n autoFocus\n picker={picker}\n value={calendarProps.value}\n minValue={calendarProps.minValue}\n maxValue={calendarProps.maxValue}\n isDateUnavailable={calendarProps.isDateUnavailable}\n isDisabled={isDisabled}\n onChange={handleSelect}\n />\n );\n\n const component = (\n <DateInputBase\n ref={targetRef}\n wrapperRef={domRef}\n qa={qa \|\| 'PeriodPicker'}\n inputType=\"datepicker\"\n styles={mergeStyleLayers(\n { display: 'grid' },\n styles,\n props.wrapperStyles,\n )}\n inputStyles={mergeStyleLayers(\n isDisabled \|\| isReadOnly ? INERT_INPUT_STYLES : INPUT_STYLES,\n props.inputStyles,\n )}\n disableFocusRing={isFocusedButton}\n isDisabled={isDisabled}\n isReadOnly={isReadOnly}\n isInvalid={isInvalid}\n isValid={isValid}\n size={size}\n fieldProps={groupProps}\n suffix={\n <DialogTrigger\n hideArrow\n type=\"popover\"\n placement={props.placement ?? 'bottom right'}\n targetRef={props.targetRef ?? targetRef}\n isOpen={isOpen}\n shouldFlip={props.shouldFlip}\n onOpenChange={setOpen}\n >\n <DatePickerButton\n size={size}\n {...mergeProps(buttonProps, focusPropsButton)}\n aria-describedby={valueId}\n // Passed separately, not merged: only the field-disabled half is\n // inherited. See `DatePickerButton`.\n isDisabled={isDisabled}\n isReadOnly={isReadOnly}\n styles={props.triggerStyles}\n />\n <Dialog {...dialogProps} width=\"max-content\" overflow=\"auto\">\n {panel}\n </Dialog>\n </DialogTrigger>\n }\n >\n <PeriodValueElement\n id={valueId}\n mods={{ placeholder: !state.value, disabled: isDisabled }}\n onClick={() => !isDisabled && !isReadOnly && setOpen(true)}\n >\n {displayText}\n </PeriodValueElement>\n </DateInputBase>\n );\n\n return wrapWithField(component, {\n ...props,\n ...field,\n labelProps: mergeProps(props.labelProps, labelProps),\n });\n}\n\nconst _PeriodPicker = forwardRef(PeriodPickerImpl);\n\n_PeriodPicker.displayName = 'PeriodPicker';\n\nexport const PeriodPicker = _PeriodPicker as <T extends DateValue = DateValue>(\n props: CubePeriodPickerProps<T> & { ref?: FocusableRef<HTMLElement> },\n) => ReactElement \| null;\n"],"mappings":"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"}
1	+ {"version":3,"file":"PeriodPicker.js","names":["FocusableRef","BaseProps","Styles","tasty","forwardRef","ReactElement","RefObject","useId","useRef","AriaDatePickerProps","DateValue","Placement","useDatePicker","useFocusRing","useLocale","useDatePickerState","useI18n","FieldBaseProps","mergeProps","mergeStyleLayers","useFieldProps","wrapWithField","FieldLayoutStyleProps","splitFieldLayout","Calendar","PeriodCalendar","Dialog","DialogTrigger","DateInputBase","DatePickerButton","formatPeriod","PickerType","snapToPeriod","useFocusManagerRef","PeriodValueElement","qa","styles","preset","width","whiteSpace","textOverflow","overflow","color","placeholder","disabled","CubePeriodPickerProps","Omit","T","picker","wrapperStyles","inputStyles","triggerStyles","size","shouldFlip","targetRef","HTMLElement","placement","formatValue","date","locale","INPUT_STYLES","cursor","INERT_INPUT_STYLES","PeriodPickerImpl","rawProps","ref","$","_c","t","t0","Symbol","for","defaultValidationTrigger","props","field","overStyles","t1","isDisabled","isReadOnly","isInvalid","isValid","autoFocus","undefined","t2","t3","t4","t5","t6","week","month","quarter","year","defaultPlaceholder","t7","granularity","shouldCloseOnSelect","state","isOpen","setOpen","domRef","t8","within","isTextInput","isFocused","isFocusedButton","focusProps","focusPropsButton","t9","groupProps","labelProps","buttonProps","dialogProps","calendarProps","t10","setValue","handleSelect","t11","value","displayText","valueId","t12","minValue","maxValue","isDateUnavailable","panel","t13","display","t14","t15","t16","t17","t18","t19","t20","t21","t22","t23","t24","t25","t26","component","_PeriodPicker","displayName","PeriodPicker","_c","Calendar","mergeProps","DateInputBase"],"sources":["../../../../src/components/fields/DatePicker/PeriodPicker.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { BaseProps, Styles, tasty } from '@tenphi/tasty';\nimport { forwardRef, ReactElement, RefObject, useId, useRef } from 'react';\nimport {\n AriaDatePickerProps,\n DateValue,\n Placement,\n useDatePicker,\n useFocusRing,\n useLocale,\n} from 'react-aria';\nimport { useDatePickerState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { mergeStyleLayers } from '../../../utils/styles';\nimport { useFieldProps, wrapWithField } from '../../form';\nimport {\n FieldLayoutStyleProps,\n splitFieldLayout,\n} from '../../form/field-layout';\nimport { Calendar } from '../../other/Calendar/Calendar';\nimport { PeriodCalendar } from '../../other/Calendar/PeriodCalendar';\nimport { Dialog } from '../../overlays/Dialog/Dialog';\nimport { DialogTrigger } from '../../overlays/Dialog/DialogTrigger';\n\nimport { DateInputBase } from './DateInputBase';\nimport { DatePickerButton } from './DatePickerButton';\nimport { formatPeriod, PickerType, snapToPeriod } from './period';\nimport { useFocusManagerRef } from './utils';\n\nconst PeriodValueElement = tasty({\n qa: 'PeriodPickerValue',\n styles: {\n preset: 't3',\n width: 'max 100%',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n overflow: 'hidden',\n color: {\n '': '#dark',\n placeholder: '#dark.30',\n disabled: '#dark.30',\n },\n },\n});\n\nexport interface CubePeriodPickerProps<T extends DateValue = DateValue>\n extends\n Omit<\n AriaDatePickerProps<T>,\n 'errorMessage' \| 'granularity' \| 'form' \| 'name'\n >,\n BaseProps,\n FieldLayoutStyleProps,\n FieldBaseProps<T \| null \| undefined> {\n /** Which period the picker selects. Set by the concrete picker components. /\n picker?: PickerType;\n wrapperStyles?: Styles;\n inputStyles?: Styles;\n triggerStyles?: Styles;\n styles?: Styles;\n size?: 'small' \| 'medium' \| 'large' \| (string & {});\n shouldFlip?: boolean;\n /\n The ref of the element the popover should visually attach itself to.\n * Defaults to the field wrapper.\n \n Forwarded to `DialogTrigger`, so the anchor also becomes what outside-click\n * dismissal treats as the trigger.\n /\n targetRef?: RefObject<HTMLElement \| null>;\n /\n Placement of the popover relative to the anchor.\n * Accepts React Aria's `Placement` strings (e.g. `'bottom start'`,\n * `'top start'`, `'right top'`, `'left top'`).\n * @default 'bottom right'\n /\n placement?: Placement;\n /* Placeholder shown when no value is selected. /\n placeholder?: string;\n /* Override how the selected value is rendered as text. */\n formatValue?: (date: DateValue, picker: PickerType, locale: string) => string;\n}\n\nconst INPUT_STYLES: Styles = { cursor: 'pointer' };\nconst INERT_INPUT_STYLES: Styles = { cursor: 'default' };\n\nfunction PeriodPickerImpl<T extends DateValue>(\n rawProps: CubePeriodPickerProps<T>,\n ref: FocusableRef<HTMLElement>,\n) {\n const { t } = useI18n();\n\n let props = useFieldProps(rawProps, {\n defaultValidationTrigger: 'onBlur',\n });\n\n // `wrapperStyles` styles the same box as `styles` and wins over it.\n const { styles, field } = splitFieldLayout(props, {\n overStyles: props.wrapperStyles,\n });\n\n let {\n qa,\n size,\n picker = 'month',\n placeholder,\n formatValue,\n isDisabled,\n isReadOnly,\n isInvalid,\n isValid,\n autoFocus,\n } = props;\n\n let defaultPlaceholder: Record<PickerType, string> = {\n week: t('datePicker.selectWeek', 'Select week'),\n month: t('datePicker.selectMonth', 'Select month'),\n quarter: t('datePicker.selectQuarter', 'Select quarter'),\n year: t('datePicker.selectYear', 'Select year'),\n };\n\n let { locale } = useLocale();\n let targetRef = useRef<HTMLDivElement>(null);\n let state = useDatePickerState({\n ...props,\n granularity: 'day',\n shouldCloseOnSelect: true,\n });\n let { isOpen, setOpen } = state;\n\n let domRef = useRef<HTMLDivElement>(null);\n\n useFocusManagerRef(ref, domRef);\n\n let { isFocused: isFocusedButton, focusProps: focusPropsButton } =\n useFocusRing({\n within: false,\n isTextInput: false,\n autoFocus,\n });\n\n let { groupProps, labelProps, buttonProps, dialogProps, calendarProps } =\n useDatePicker({ ...props, granularity: 'day' }, state, targetRef);\n\n let handleSelect = (date: DateValue) => {\n state.setValue(snapToPeriod(date, picker, locale));\n setOpen(false);\n };\n\n let displayText = state.value\n ? (formatValue ?? formatPeriod)(state.value, picker, locale)\n : (placeholder ?? defaultPlaceholder[picker]);\n\n // The value is rendered as text rather than editable segments, so the trigger\n // has to point at it to announce the current selection.\n let valueId = useId();\n\n const panel =\n picker === 'week' ? (\n <Calendar\n {...calendarProps}\n autoFocus\n pickerMode=\"week\"\n isDisabled={isDisabled}\n onChange={handleSelect}\n />\n ) : (\n <PeriodCalendar\n autoFocus\n picker={picker}\n value={calendarProps.value}\n minValue={calendarProps.minValue}\n maxValue={calendarProps.maxValue}\n isDateUnavailable={calendarProps.isDateUnavailable}\n isDisabled={isDisabled}\n onChange={handleSelect}\n />\n );\n\n const component = (\n <DateInputBase\n ref={targetRef}\n wrapperRef={domRef}\n qa={qa \|\| 'PeriodPicker'}\n inputType=\"datepicker\"\n styles={mergeStyleLayers({ display: 'grid' }, styles)}\n inputStyles={mergeStyleLayers(\n isDisabled \|\| isReadOnly ? INERT_INPUT_STYLES : INPUT_STYLES,\n props.inputStyles,\n )}\n disableFocusRing={isFocusedButton}\n isDisabled={isDisabled}\n isReadOnly={isReadOnly}\n isInvalid={isInvalid}\n isValid={isValid}\n size={size}\n fieldProps={groupProps}\n suffix={\n <DialogTrigger\n hideArrow\n type=\"popover\"\n placement={props.placement ?? 'bottom right'}\n targetRef={props.targetRef ?? targetRef}\n isOpen={isOpen}\n shouldFlip={props.shouldFlip}\n onOpenChange={setOpen}\n >\n <DatePickerButton\n size={size}\n {...mergeProps(buttonProps, focusPropsButton)}\n aria-describedby={valueId}\n // Passed separately, not merged: only the field-disabled half is\n // inherited. See `DatePickerButton`.\n isDisabled={isDisabled}\n isReadOnly={isReadOnly}\n styles={props.triggerStyles}\n />\n <Dialog {...dialogProps} width=\"max-content\" overflow=\"auto\">\n {panel}\n </Dialog>\n </DialogTrigger>\n }\n >\n <PeriodValueElement\n id={valueId}\n mods={{ placeholder: !state.value, disabled: isDisabled }}\n onClick={() => !isDisabled && !isReadOnly && setOpen(true)}\n >\n {displayText}\n </PeriodValueElement>\n </DateInputBase>\n );\n\n return wrapWithField(component, {\n ...props,\n ...field,\n labelProps: mergeProps(props.labelProps, labelProps),\n });\n}\n\nconst _PeriodPicker = forwardRef(PeriodPickerImpl);\n\n_PeriodPicker.displayName = 'PeriodPicker';\n\nexport const PeriodPicker = _PeriodPicker as <T extends DateValue = DateValue>(\n props: CubePeriodPickerProps<T> & { ref?: FocusableRef<HTMLElement> },\n) => ReactElement \| null;\n"],"mappings":"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"}

package/dist/components/fields/DatePicker/QuarterPicker.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 import { PeriodPicker } from "./PeriodPicker.js";
 import { c } from "react/compiler-runtime";
 import { forwardRef } from "react";

package/dist/components/fields/DatePicker/TimeInput.js CHANGED Viewed

@@ -1,5 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
-import { mergeStyleLayers } from "../../../utils/styles.js";
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useFieldProps } from "../../form/Form/use-field/use-field-props.js";
 import { wrapWithField } from "../../form/wrapper.js";
@@ -23,8 +22,8 @@ function TimeInput(rawProps, ref) {
 	} else t0 = $[0];
 	let props = useFieldProps(rawProps, t0);
 	props = Object.assign({}, DEFAULT_TIME_PROPS, props);
-	const { styles, field } = splitFieldLayout(props);
-	const { qa, inputStyles, wrapperStyles, autoFocus, isDisabled, isReadOnly, isRequired, isInvalid, isValid, size: t1, labelProps: userLabelProps } = props;
+	const { styles, field } = splitFieldLayout(props, { overStyles: props.wrapperStyles });
+	const { qa, inputStyles, autoFocus, isDisabled, isReadOnly, isRequired, isInvalid, isValid, size: t1, labelProps: userLabelProps } = props;
 	const size = t1 === void 0 ? "medium" : t1;
 	const domRef = useRef(null);
 	useFocusManagerRef(ref, domRef);
@@ -50,7 +49,7 @@ function TimeInput(rawProps, ref) {
 		isReadOnly,
 		autoFocus,
 		inputStyles,
-		styles: mergeStyleLayers(styles, wrapperStyles),
+		styles,
 		isInvalid,
 		isValid,
 		children: state.segments.map((segment, i) => /* @__PURE__ */ jsx(DatePickerSegment, {

package/dist/components/fields/DatePicker/TimeInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TimeInput.js","names":["FocusableRef","BaseProps","Styles","forwardRef","useRef","AriaTimeFieldProps","DateValue","TimeValue","useTimeField","useTimeFieldState","FieldBaseProps","mergeProps","~~mergeStyleLayers","~~useFieldProps","wrapWithField","FieldLayoutStyleProps","splitFieldLayout","DateInputBase","DatePickerSegment","DEFAULT_TIME_PROPS","Granularity","useFocusManagerRef","CubeTimeInputProps","Omit","wrapperStyles","inputStyles","styles","size","value","minValue","maxValue","isDateUnavailable","date","placeholderValue","hourCycle","granularity","hideTimeZone","onChange","TimeInput","rawProps","ref","$","_c","t0","Symbol","for","defaultValidationTrigger","props","Object","assign","field","qa","autoFocus","isDisabled","isReadOnly","isRequired","isInvalid","isValid","t1","labelProps","userLabelProps","undefined","domRef","timeProps","state","locale","fieldRef","fieldProps","timeInput","segments","map","segment","i","_TimeInput","displayName","_c","DateInputBase","mergeProps"],"sources":["../../../../src/components/fields/DatePicker/TimeInput.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { BaseProps, Styles } from '@tenphi/tasty';\nimport { forwardRef, useRef } from 'react';\nimport {\n AriaTimeFieldProps,\n DateValue,\n TimeValue,\n useTimeField,\n} from 'react-aria';\nimport { useTimeFieldState } from 'react-stately';\n\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { ~~mergeStyleLayers } from '../../../utils/styles';\nimport {~~ useFieldProps, wrapWithField } from '../../form';\nimport {\n FieldLayoutStyleProps,\n splitFieldLayout,\n} from '../../form/field-layout';\n\nimport { DateInputBase } from './DateInputBase';\nimport { DatePickerSegment } from './DatePickerSegment';\nimport { DEFAULT_TIME_PROPS } from './props';\nimport { Granularity } from './types';\nimport { useFocusManagerRef } from './utils';\n\nexport interface CubeTimeInputProps<T extends TimeValue = TimeValue>\n extends\n Omit<\n AriaTimeFieldProps<TimeValue>,\n 'errorMessage' \| 'form' \| 'name' \| 'value' \| 'onChange' \| 'granularity'\n >,\n BaseProps,\n FieldLayoutStyleProps,\n FieldBaseProps<TimeValue \| null \| undefined> {\n wrapperStyles?: Styles;\n inputStyles?: Styles;\n styles?: Styles;\n size?: 'small' \| 'medium' \| 'large' \| (string & {});\n value?: TimeValue \| null;\n /** The minimum allowed date that a user may select. /\n minValue?: TimeValue;\n /* The maximum allowed date that a user may select. /\n maxValue?: TimeValue;\n /* Callback that is called for each date of the calendar. If it returns true, then the date is unavailable. /\n isDateUnavailable?: (date: DateValue) => boolean;\n /* A placeholder date that influences the format of the placeholder shown when no value is selected. Defaults to today's date at midnight. /\n placeholderValue?: TimeValue;\n /* Whether to display the time in 12 or 24 hour format. By default, this is determined by the user's locale. /\n hourCycle?: 12 \| 24;\n /* Determines the smallest unit that is displayed in the date picker. By default, this is `\"day\"` for dates, and `\"minute\"` for times. /\n granularity?: Granularity;\n /\n Whether to hide the time zone abbreviation.\n * @default false\n /\n hideTimeZone?: boolean;\n onChange?: (value: TimeValue) => void;\n}\n\nfunction TimeInput<T extends TimeValue>(\n rawProps: CubeTimeInputProps<T>,\n ref: FocusableRef<HTMLElement>,\n) {\n let props = useFieldProps(rawProps, {\n defaultValidationTrigger: 'onBlur',\n });\n props = Object.assign({}, DEFAULT_TIME_PROPS, props);\n\n const { styles, field } = splitFieldLayout(props);\n\n let {\n qa,\n inputStyles,\n ~~wrapperStyles,\n~~ autoFocus,\n isDisabled,\n isReadOnly,\n isRequired,\n isInvalid,\n isValid,\n size = 'medium',\n labelProps: userLabelProps,\n } = props;\n\n let domRef = useRef<HTMLDivElement>(null);\n\n useFocusManagerRef(ref, domRef);\n let timeProps = {\n ...props,\n granularity: props.granularity === 'day' ? undefined : props.granularity,\n // Aria clears with null; retain the kit's legacy nonnullable callback\n // declaration while forwarding exactly the same values as before.\n onChange: props.onChange as AriaTimeFieldProps<TimeValue>['onChange'],\n };\n let state = useTimeFieldState({ ...timeProps, locale: 'en-US' });\n\n let fieldRef = useRef(null);\n let { labelProps, fieldProps } = useTimeField(timeProps, state, fieldRef);\n\n const timeInput = (\n <DateInputBase\n ref={fieldRef}\n wrapperRef={domRef}\n qa={qa \|\| 'TimeInput'}\n inputType=\"timeinput\"\n size={size}\n fieldProps={fieldProps}\n isDisabled={isDisabled}\n isReadOnly={isReadOnly}\n autoFocus={autoFocus}\n inputStyles={inputStyles}\n styles={~~mergeStyleLayers(~~styles~~, wrapperStyles)~~}\n isInvalid={isInvalid}\n isValid={isValid}\n >\n {state.segments.map((segment, i) => (\n <DatePickerSegment\n key={i}\n segment={segment}\n state={state}\n isDisabled={isDisabled}\n isReadOnly={isReadOnly}\n isRequired={isRequired}\n />\n ))}\n </DateInputBase>\n );\n\n return wrapWithField(timeInput, {\n ...props,\n ...field,\n labelProps: mergeProps(labelProps, userLabelProps),\n });\n}\n\n/\n TimeFields allow users to enter and edit time values using a keyboard.\n * Each part of the time is displayed in an individually editable segment.\n */\nconst _TimeInput = forwardRef(TimeInput);\n\n_TimeInput.displayName = 'TimeInput';\n\nexport { _TimeInput as TimeInput };\n"],"mappings":"~~;;;;;;;;;;;;;;;;AA4DA~~,~~SAAAsC~~,UAAAC,UAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,CAAA;CAAA,IAAAC;CAAA,IAAAF,EAAA,OAAAG,OAAAC,IAAA,2BAAA,GAAA;EAIsCF,KAAA,EAAAG,0BACR,SAC5B;EAACL,EAAA,KAAAE;CAAA,OAAAA,KAAAF,EAAA;CAFD,IAAAM,QAAYlC,cAAc0B,UAAUI,EAEnC;CACDI,QAAQC,OAAMC,OAAQ,CAAC,GAAG9B,oBAAoB4B,KAAK;~~CAEnD~~,MAAA,EAAArB,QAAAwB,UAA0BlC,iBAAiB+B,~~KAAK~~;~~CAEhD~~,MAAA,~~EAAAI~~,~~IAAA1B~~,~~aAAAD~~,~~eAAA4B,~~WAAAC,YAAAC,YAAAC,YAAAC,WAAAC,~~SAAA9B,MAAA+~~B,IAAAC,YAAAC,~~mBAYIb~~;CAFF,MAAApB,~~OAAA+B~~,OAAAG,KAAAA,IAAA,WAAAH;CAIF,MAAAI,SAAa1D,OAAuB,IAAI;~~CAExCiB~~,mBAAmBmB,~~KAAKsB~~,MAAM;CAC9B,MAAAC,YAAgB;EAAA,~~GACXhB~~;EAAKZ,aACKY,MAAKZ,gBAAiB,~~QAAtB0B~~,KAAAA,~~IAA0Cd~~,MAAKZ;EAAYE,UAG9DU,MAAKV;CACjB;CACA,~~MAAA2B~~,QAAYvD,kBAAkB;EAAA,GAAKsD;EAASE,QAAU;CAAQ,CAAC;CAE/D,MAAAC,WAAe9D,OAAO,IAAI;CAC1B,MAAA,EAAAuD,YAAAQ,eAAiC3D,aAAauD,WAAWC,OAAOE,QAAQ;CAExE,MAAAE,YACE,oBAACQ,gBAAD;EACOV,KAAAA;EACOJ,YAAAA;EACR,IAAAX,MAAA;EACM,WAAA;~~EACJxB~~;~~EACMwC~~;EACAd;EACAC;EACDF;~~EACE3B~~;~~EACL,QAAAb,iBAAiBc,QAAQF,aAAa~~;~~EACnCgC~~;EACFC;EAERO,UAAAA,MAAKK,SAASC,KAAKC,SAAAC,MAClB,oBAAC,mBAAD;GAEWD;GACFP;GACKX;GACAC;GACAC;EAAU,GALjBiB,CAKiB,CAEzB;CAxBW,CAAA;CA0Bd,~~OAEK1D~~,~~cAAcsD~~,WAAW;EAAA,~~GAC3BrB~~;EAAK,GACLG;~~EAAKS~~,YACIhD,aAAWgD,YAAYC,cAAc;CACnD,CAAC;AAAC;;;;;AAOJ,MAAMa,aAAatE,~~WAAWmC~~,SAAS;~~AAEvCmC~~,WAAWC,cAAc"}
1	+ {"version":3,"file":"TimeInput.js","names":["FocusableRef","BaseProps","Styles","forwardRef","useRef","AriaTimeFieldProps","DateValue","TimeValue","useTimeField","useTimeFieldState","FieldBaseProps","mergeProps","useFieldProps","wrapWithField","FieldLayoutStyleProps","splitFieldLayout","DateInputBase","DatePickerSegment","DEFAULT_TIME_PROPS","Granularity","useFocusManagerRef","CubeTimeInputProps","Omit","wrapperStyles","inputStyles","styles","size","value","minValue","maxValue","isDateUnavailable","date","placeholderValue","hourCycle","granularity","hideTimeZone","onChange","TimeInput","rawProps","ref","$","_c","t0","Symbol","for","defaultValidationTrigger","props","Object","assign","field","overStyles","qa","autoFocus","isDisabled","isReadOnly","isRequired","isInvalid","isValid","t1","labelProps","userLabelProps","undefined","domRef","timeProps","state","locale","fieldRef","fieldProps","timeInput","segments","map","segment","i","_TimeInput","displayName","_c","DateInputBase","mergeProps"],"sources":["../../../../src/components/fields/DatePicker/TimeInput.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { BaseProps, Styles } from '@tenphi/tasty';\nimport { forwardRef, useRef } from 'react';\nimport {\n AriaTimeFieldProps,\n DateValue,\n TimeValue,\n useTimeField,\n} from 'react-aria';\nimport { useTimeFieldState } from 'react-stately';\n\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { useFieldProps, wrapWithField } from '../../form';\nimport {\n FieldLayoutStyleProps,\n splitFieldLayout,\n} from '../../form/field-layout';\n\nimport { DateInputBase } from './DateInputBase';\nimport { DatePickerSegment } from './DatePickerSegment';\nimport { DEFAULT_TIME_PROPS } from './props';\nimport { Granularity } from './types';\nimport { useFocusManagerRef } from './utils';\n\nexport interface CubeTimeInputProps<T extends TimeValue = TimeValue>\n extends\n Omit<\n AriaTimeFieldProps<TimeValue>,\n 'errorMessage' \| 'form' \| 'name' \| 'value' \| 'onChange' \| 'granularity'\n >,\n BaseProps,\n FieldLayoutStyleProps,\n FieldBaseProps<TimeValue \| null \| undefined> {\n wrapperStyles?: Styles;\n inputStyles?: Styles;\n styles?: Styles;\n size?: 'small' \| 'medium' \| 'large' \| (string & {});\n value?: TimeValue \| null;\n /** The minimum allowed date that a user may select. /\n minValue?: TimeValue;\n /* The maximum allowed date that a user may select. /\n maxValue?: TimeValue;\n /* Callback that is called for each date of the calendar. If it returns true, then the date is unavailable. /\n isDateUnavailable?: (date: DateValue) => boolean;\n /* A placeholder date that influences the format of the placeholder shown when no value is selected. Defaults to today's date at midnight. /\n placeholderValue?: TimeValue;\n /* Whether to display the time in 12 or 24 hour format. By default, this is determined by the user's locale. /\n hourCycle?: 12 \| 24;\n /* Determines the smallest unit that is displayed in the date picker. By default, this is `\"day\"` for dates, and `\"minute\"` for times. /\n granularity?: Granularity;\n /\n Whether to hide the time zone abbreviation.\n * @default false\n /\n hideTimeZone?: boolean;\n onChange?: (value: TimeValue) => void;\n}\n\nfunction TimeInput<T extends TimeValue>(\n rawProps: CubeTimeInputProps<T>,\n ref: FocusableRef<HTMLElement>,\n) {\n let props = useFieldProps(rawProps, {\n defaultValidationTrigger: 'onBlur',\n });\n props = Object.assign({}, DEFAULT_TIME_PROPS, props);\n\n // `wrapperStyles` styles the same box as `styles` and wins over it.\n const { styles, field } = splitFieldLayout(props, {\n overStyles: props.wrapperStyles,\n });\n\n let {\n qa,\n inputStyles,\n autoFocus,\n isDisabled,\n isReadOnly,\n isRequired,\n isInvalid,\n isValid,\n size = 'medium',\n labelProps: userLabelProps,\n } = props;\n\n let domRef = useRef<HTMLDivElement>(null);\n\n useFocusManagerRef(ref, domRef);\n let timeProps = {\n ...props,\n granularity: props.granularity === 'day' ? undefined : props.granularity,\n // Aria clears with null; retain the kit's legacy nonnullable callback\n // declaration while forwarding exactly the same values as before.\n onChange: props.onChange as AriaTimeFieldProps<TimeValue>['onChange'],\n };\n let state = useTimeFieldState({ ...timeProps, locale: 'en-US' });\n\n let fieldRef = useRef(null);\n let { labelProps, fieldProps } = useTimeField(timeProps, state, fieldRef);\n\n const timeInput = (\n <DateInputBase\n ref={fieldRef}\n wrapperRef={domRef}\n qa={qa \|\| 'TimeInput'}\n inputType=\"timeinput\"\n size={size}\n fieldProps={fieldProps}\n isDisabled={isDisabled}\n isReadOnly={isReadOnly}\n autoFocus={autoFocus}\n inputStyles={inputStyles}\n styles={styles}\n isInvalid={isInvalid}\n isValid={isValid}\n >\n {state.segments.map((segment, i) => (\n <DatePickerSegment\n key={i}\n segment={segment}\n state={state}\n isDisabled={isDisabled}\n isReadOnly={isReadOnly}\n isRequired={isRequired}\n />\n ))}\n </DateInputBase>\n );\n\n return wrapWithField(timeInput, {\n ...props,\n ...field,\n labelProps: mergeProps(labelProps, userLabelProps),\n });\n}\n\n/\n TimeFields allow users to enter and edit time values using a keyboard.\n * Each part of the time is displayed in an individually editable segment.\n */\nconst _TimeInput = forwardRef(TimeInput);\n\n_TimeInput.displayName = 'TimeInput';\n\nexport { _TimeInput as TimeInput };\n"],"mappings":";;;;;;;;;;;;;;;AA2DA,SAAAqC,UAAAC,UAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,CAAA;CAAA,IAAAC;CAAA,IAAAF,EAAA,OAAAG,OAAAC,IAAA,2BAAA,GAAA;EAIsCF,KAAA,EAAAG,0BACR,SAC5B;EAACL,EAAA,KAAAE;CAAA,OAAAA,KAAAF,EAAA;CAFD,IAAAM,QAAYlC,cAAc0B,UAAUI,EAEnC;CACDI,QAAQC,OAAMC,OAAQ,CAAC,GAAG9B,oBAAoB4B,KAAK;CAGnD,MAAA,EAAArB,QAAAwB,UAA0BlC,iBAAiB+B,OAAO,EAAAI,YACpCJ,MAAKvB,cACnB,CAAC;CAED,MAAA,EAAA4B,IAAA3B,aAAA4B,WAAAC,YAAAC,YAAAC,YAAAC,WAAAC,SAAA/B,MAAAgC,IAAAC,YAAAC,mBAWId;CAFF,MAAApB,OAAAgC,OAAAG,KAAAA,IAAA,WAAAH;CAIF,MAAAI,SAAa1D,OAAuB,IAAI;CAExCgB,mBAAmBmB,KAAKuB,MAAM;CAC9B,MAAAC,YAAgB;EAAA,GACXjB;EAAKZ,aACKY,MAAKZ,gBAAiB,QAAtB2B,KAAAA,IAA0Cf,MAAKZ;EAAYE,UAG9DU,MAAKV;CACjB;CACA,MAAA4B,QAAYvD,kBAAkB;EAAA,GAAKsD;EAASE,QAAU;CAAQ,CAAC;CAE/D,MAAAC,WAAe9D,OAAO,IAAI;CAC1B,MAAA,EAAAuD,YAAAQ,eAAiC3D,aAAauD,WAAWC,OAAOE,QAAQ;CAExE,MAAAE,YACE,oBAACQ,gBAAD;EACOV,KAAAA;EACOJ,YAAAA;EACR,IAAAX,MAAA;EACM,WAAA;EACJzB;EACMyC;EACAd;EACAC;EACDF;EACE5B;EACLC;EACG+B;EACFC;EAERO,UAAAA,MAAKK,SAASC,KAAKC,SAAAC,MAClB,oBAAC,mBAAD;GAEWD;GACFP;GACKX;GACAC;GACAC;EAAU,GALjBiB,CAKiB,CAEzB;CAxBW,CAAA;CA0Bd,OAEK3D,cAAcuD,WAAW;EAAA,GAC3BtB;EAAK,GACLG;EAAKU,YACIhD,aAAWgD,YAAYC,cAAc;CACnD,CAAC;AAAC;;;;;AAOJ,MAAMa,aAAatE,WAAWkC,SAAS;AAEvCoC,WAAWC,cAAc"}

package/dist/components/fields/DatePicker/WeekPicker.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 import { PeriodPicker } from "./PeriodPicker.js";
 import { c } from "react/compiler-runtime";
 import { forwardRef } from "react";

package/dist/components/fields/DatePicker/YearPicker.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 import { PeriodPicker } from "./PeriodPicker.js";
 import { c } from "react/compiler-runtime";
 import { forwardRef } from "react";

package/dist/components/fields/DatePicker/parseDate.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 import { parseAbsolute } from "@internationalized/date";
 //#region src/components/fields/DatePicker/parseDate.ts
 const ZONELESS_ISO_DATE = /^\d{4}-\d{2}-\d{2}(?:[Tt ]\d{2}:\d{2}(?::\d{2}(?:\.\d+)?)?)?$/;

package/dist/components/fields/DatePicker/period.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 import { CalendarDate, startOfMonth, startOfWeek, startOfYear, toCalendarDate } from "@internationalized/date";
 //#region src/components/fields/DatePicker/period.ts
 const MS_PER_DAY = 864e5;

package/dist/components/fields/DatePicker/props.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 //#region src/components/fields/DatePicker/props.ts
 const DEFAULT_DATE_PROPS = {
 	granularity: "day",

package/dist/components/fields/DatePicker/utils.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
 import { c } from "react/compiler-runtime";
 import { useImperativeHandle } from "react";
 import { createDOMRef } from "@react-spectrum/utils";