npm - @gravity-ui/date-components - Versions diffs - 3.0.2 → 3.0.3 - Mend

@gravity-ui/date-components 3.0.2 → 3.0.3

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 (33) hide show

package/dist/cjs/components/DatePicker/hooks/useDatePickerProps.js CHANGED Viewed

@@ -107,6 +107,7 @@ function useDatePickerProps(state, _a) {
                     : state.dateFieldState.displayValue.start);
             },
             modal: !props.disableFocusTrap,
+            returnFocus: !props.disableFocusTrap,
             disablePortal: props.disablePortal,
             placement: props.popupPlacement,
             offset: props.popupOffset,

package/dist/cjs/components/DatePicker/hooks/useDatePickerProps.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDatePickerProps.js","sourceRoot":"../../../../../src","sources":["components/DatePicker/hooks/useDatePickerProps.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {isDateTime} from '@gravity-ui/date-utils';\nimport type {DateTime} from '@gravity-ui/date-utils';\nimport {useFocusWithin, useForkRef} from '@gravity-ui/uikit';\nimport type {ButtonButtonProps, PopupProps, TextInputProps} from '@gravity-ui/uikit';\n\nimport type {CalendarInstance, CalendarProps} from '../../Calendar';\nimport {useDateFieldProps} from '../../DateField';\nimport type {DateFieldProps} from '../../DateField';\nimport type {RangeValue} from '../../types';\nimport {getButtonSizeForInput} from '../../utils/getButtonSizeForInput';\nimport {mergeProps} from '../../utils/mergeProps';\nimport type {DatePickerProps} from '../DatePicker';\nimport {i18n} from '../i18n';\nimport {getCalendarModes, getDateTimeValue} from '../utils';\n\nimport type {DatePickerState} from './useDatePickerState';\n\ninterface InnerDatePickerProps<T = DateTime> {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n groupProps: React.HTMLAttributes<unknown> & {ref: React.Ref<any>};\n fieldProps: TextInputProps;\n calendarButtonProps: ButtonButtonProps & {ref: React.Ref<HTMLButtonElement>};\n popupProps: PopupProps;\n calendarProps: CalendarProps<T> & {ref: React.Ref<CalendarInstance>};\n timeInputProps: DateFieldProps<T>;\n}\n\nexport function useDatePickerProps<T extends DateTime \| RangeValue<DateTime>>(\n state: DatePickerState<T>,\n {onFocus, onBlur, ...props}: DatePickerProps<T>,\n): InnerDatePickerProps<T> {\n const [isActive, setActive] = React.useState(false);\n\n const [focusedDate, setFocusedDate] = React.useState(\n isDateTime(state.dateFieldState.displayValue)\n ? state.dateFieldState.displayValue\n : state.dateFieldState.displayValue.start,\n );\n const [prevDateValue, setPrevDateValue] = React.useState<any>(\n state.dateFieldState.displayValue,\n );\n\n if (isDateTime(state.dateFieldState.displayValue)) {\n if (!state.dateFieldState.displayValue.isSame(prevDateValue, 'day')) {\n setPrevDateValue(state.dateFieldState.displayValue);\n setFocusedDate(state.dateFieldState.displayValue);\n }\n } else if (!state.dateFieldState.displayValue.start.isSame(prevDateValue.start, 'day')) {\n setPrevDateValue(state.dateFieldState.displayValue);\n setFocusedDate(state.dateFieldState.displayValue.start);\n } else if (!state.dateFieldState.displayValue.end.isSame(prevDateValue.end, 'day')) {\n setPrevDateValue(state.dateFieldState.displayValue);\n setFocusedDate(state.dateFieldState.displayValue.end);\n }\n\n const {focusWithinProps} = useFocusWithin({\n onFocusWithin: onFocus,\n onBlurWithin: onBlur,\n onFocusWithinChange(isFocusWithin) {\n setActive(isFocusWithin);\n if (!isFocusWithin) {\n state.setOpen(false, 'FocusOut');\n }\n },\n });\n\n const {inputProps} = useDateFieldProps(state.dateFieldState, props);\n\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n const handleRef = useForkRef(inputRef, inputProps.controlRef);\n\n const calendarRef = React.useRef<CalendarInstance>(null);\n const calendarButtonRef = React.useRef<HTMLButtonElement>(null);\n const groupRef = React.useRef<HTMLElement>(null);\n\n function focusInput() {\n setTimeout(() => {\n inputRef.current?.focus({preventScroll: true});\n });\n }\n\n const onlyTime = state.formatInfo.hasTime && !state.formatInfo.hasDate;\n const calendarModes = getCalendarModes(state.formatInfo);\n\n return {\n groupProps: {\n ref: groupRef,\n tabIndex: -1,\n role: 'group',\n ...focusWithinProps,\n style: props.style,\n 'aria-disabled': state.disabled \|\| undefined,\n onKeyDown: (e) => {\n if (!onlyTime && e.altKey && (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')) {\n e.preventDefault();\n e.stopPropagation();\n state.setOpen(true, 'ShortcutKeyDown');\n }\n },\n },\n fieldProps: mergeProps(\n inputProps,\n state.dateFieldState.isEmpty && !isActive && props.placeholder\n ? {value: ''}\n : undefined,\n {\n controlRef: handleRef,\n controlProps: {role: 'combobox', 'aria-expanded': state.isOpen},\n },\n ),\n calendarButtonProps: {\n ref: calendarButtonRef,\n size: getButtonSizeForInput(props.size),\n disabled: state.disabled,\n 'aria-label': i18n('Calendar'),\n 'aria-haspopup': 'dialog',\n 'aria-expanded': state.isOpen,\n view: 'flat-secondary',\n onClick: () => {\n setActive(true);\n state.setOpen(!state.isOpen, 'TriggerButtonClick');\n },\n },\n popupProps: {\n open: state.isOpen,\n onOpenChange: (open, e, reason) => {\n if (!open) {\n if (reason === 'escape-key') {\n state.setOpen(false, 'EscapeKeyDown');\n focusInput();\n } else if (reason === 'outside-press') {\n if (!e?.target \|\| !calendarButtonRef.current?.contains(e.target as Node)) {\n state.setOpen(false, 'ClickOutside');\n }\n\n if (e?.target && groupRef.current?.contains(e.target as Node)) {\n focusInput();\n }\n }\n }\n },\n onTransitionOutComplete: () => {\n setFocusedDate(\n isDateTime(state.dateFieldState.displayValue)\n ? state.dateFieldState.displayValue\n : state.dateFieldState.displayValue.start,\n );\n },\n modal: !props.disableFocusTrap,\n disablePortal: props.disablePortal,\n placement: props.popupPlacement,\n offset: props.popupOffset,\n className: props.popupClassName,\n style: props.popupStyle,\n },\n calendarProps: {\n ref: calendarRef,\n autoFocus: true,\n size: props.size === 's' ? 'm' : props.size,\n disabled: props.disabled,\n readOnly: props.readOnly,\n onUpdate: (d) => {\n state.setDateValue(d);\n if (!state.formatInfo.hasTime) {\n focusInput();\n }\n },\n value: state.dateFieldState.displayValue,\n minValue: props.minValue,\n maxValue: props.maxValue,\n isDateUnavailable: props.isDateUnavailable,\n timeZone: state.timeZone,\n focusedValue: focusedDate,\n onFocusUpdate: setFocusedDate,\n modes: calendarModes,\n },\n timeInputProps: {\n value: state.timeValue,\n placeholderValue: getDateTimeValue(state.dateFieldState.displayValue),\n onUpdate: state.setTimeValue,\n format: state.timeFormat,\n readOnly: state.readOnly,\n disabled: state.disabled,\n timeZone: state.timeZone,\n hasClear: props.hasClear,\n size: props.size,\n },\n };\n}\n"]}
1	+ {"version":3,"file":"useDatePickerProps.js","sourceRoot":"../../../../../src","sources":["components/DatePicker/hooks/useDatePickerProps.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {isDateTime} from '@gravity-ui/date-utils';\nimport type {DateTime} from '@gravity-ui/date-utils';\nimport {useFocusWithin, useForkRef} from '@gravity-ui/uikit';\nimport type {ButtonButtonProps, PopupProps, TextInputProps} from '@gravity-ui/uikit';\n\nimport type {CalendarInstance, CalendarProps} from '../../Calendar';\nimport {useDateFieldProps} from '../../DateField';\nimport type {DateFieldProps} from '../../DateField';\nimport type {RangeValue} from '../../types';\nimport {getButtonSizeForInput} from '../../utils/getButtonSizeForInput';\nimport {mergeProps} from '../../utils/mergeProps';\nimport type {DatePickerProps} from '../DatePicker';\nimport {i18n} from '../i18n';\nimport {getCalendarModes, getDateTimeValue} from '../utils';\n\nimport type {DatePickerState} from './useDatePickerState';\n\ninterface InnerDatePickerProps<T = DateTime> {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n groupProps: React.HTMLAttributes<unknown> & {ref: React.Ref<any>};\n fieldProps: TextInputProps;\n calendarButtonProps: ButtonButtonProps & {ref: React.Ref<HTMLButtonElement>};\n popupProps: PopupProps;\n calendarProps: CalendarProps<T> & {ref: React.Ref<CalendarInstance>};\n timeInputProps: DateFieldProps<T>;\n}\n\nexport function useDatePickerProps<T extends DateTime \| RangeValue<DateTime>>(\n state: DatePickerState<T>,\n {onFocus, onBlur, ...props}: DatePickerProps<T>,\n): InnerDatePickerProps<T> {\n const [isActive, setActive] = React.useState(false);\n\n const [focusedDate, setFocusedDate] = React.useState(\n isDateTime(state.dateFieldState.displayValue)\n ? state.dateFieldState.displayValue\n : state.dateFieldState.displayValue.start,\n );\n const [prevDateValue, setPrevDateValue] = React.useState<any>(\n state.dateFieldState.displayValue,\n );\n\n if (isDateTime(state.dateFieldState.displayValue)) {\n if (!state.dateFieldState.displayValue.isSame(prevDateValue, 'day')) {\n setPrevDateValue(state.dateFieldState.displayValue);\n setFocusedDate(state.dateFieldState.displayValue);\n }\n } else if (!state.dateFieldState.displayValue.start.isSame(prevDateValue.start, 'day')) {\n setPrevDateValue(state.dateFieldState.displayValue);\n setFocusedDate(state.dateFieldState.displayValue.start);\n } else if (!state.dateFieldState.displayValue.end.isSame(prevDateValue.end, 'day')) {\n setPrevDateValue(state.dateFieldState.displayValue);\n setFocusedDate(state.dateFieldState.displayValue.end);\n }\n\n const {focusWithinProps} = useFocusWithin({\n onFocusWithin: onFocus,\n onBlurWithin: onBlur,\n onFocusWithinChange(isFocusWithin) {\n setActive(isFocusWithin);\n if (!isFocusWithin) {\n state.setOpen(false, 'FocusOut');\n }\n },\n });\n\n const {inputProps} = useDateFieldProps(state.dateFieldState, props);\n\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n const handleRef = useForkRef(inputRef, inputProps.controlRef);\n\n const calendarRef = React.useRef<CalendarInstance>(null);\n const calendarButtonRef = React.useRef<HTMLButtonElement>(null);\n const groupRef = React.useRef<HTMLElement>(null);\n\n function focusInput() {\n setTimeout(() => {\n inputRef.current?.focus({preventScroll: true});\n });\n }\n\n const onlyTime = state.formatInfo.hasTime && !state.formatInfo.hasDate;\n const calendarModes = getCalendarModes(state.formatInfo);\n\n return {\n groupProps: {\n ref: groupRef,\n tabIndex: -1,\n role: 'group',\n ...focusWithinProps,\n style: props.style,\n 'aria-disabled': state.disabled \|\| undefined,\n onKeyDown: (e) => {\n if (!onlyTime && e.altKey && (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')) {\n e.preventDefault();\n e.stopPropagation();\n state.setOpen(true, 'ShortcutKeyDown');\n }\n },\n },\n fieldProps: mergeProps(\n inputProps,\n state.dateFieldState.isEmpty && !isActive && props.placeholder\n ? {value: ''}\n : undefined,\n {\n controlRef: handleRef,\n controlProps: {role: 'combobox', 'aria-expanded': state.isOpen},\n },\n ),\n calendarButtonProps: {\n ref: calendarButtonRef,\n size: getButtonSizeForInput(props.size),\n disabled: state.disabled,\n 'aria-label': i18n('Calendar'),\n 'aria-haspopup': 'dialog',\n 'aria-expanded': state.isOpen,\n view: 'flat-secondary',\n onClick: () => {\n setActive(true);\n state.setOpen(!state.isOpen, 'TriggerButtonClick');\n },\n },\n popupProps: {\n open: state.isOpen,\n onOpenChange: (open, e, reason) => {\n if (!open) {\n if (reason === 'escape-key') {\n state.setOpen(false, 'EscapeKeyDown');\n focusInput();\n } else if (reason === 'outside-press') {\n if (!e?.target \|\| !calendarButtonRef.current?.contains(e.target as Node)) {\n state.setOpen(false, 'ClickOutside');\n }\n\n if (e?.target && groupRef.current?.contains(e.target as Node)) {\n focusInput();\n }\n }\n }\n },\n onTransitionOutComplete: () => {\n setFocusedDate(\n isDateTime(state.dateFieldState.displayValue)\n ? state.dateFieldState.displayValue\n : state.dateFieldState.displayValue.start,\n );\n },\n modal: !props.disableFocusTrap,\n returnFocus: !props.disableFocusTrap,\n disablePortal: props.disablePortal,\n placement: props.popupPlacement,\n offset: props.popupOffset,\n className: props.popupClassName,\n style: props.popupStyle,\n },\n calendarProps: {\n ref: calendarRef,\n autoFocus: true,\n size: props.size === 's' ? 'm' : props.size,\n disabled: props.disabled,\n readOnly: props.readOnly,\n onUpdate: (d) => {\n state.setDateValue(d);\n if (!state.formatInfo.hasTime) {\n focusInput();\n }\n },\n value: state.dateFieldState.displayValue,\n minValue: props.minValue,\n maxValue: props.maxValue,\n isDateUnavailable: props.isDateUnavailable,\n timeZone: state.timeZone,\n focusedValue: focusedDate,\n onFocusUpdate: setFocusedDate,\n modes: calendarModes,\n },\n timeInputProps: {\n value: state.timeValue,\n placeholderValue: getDateTimeValue(state.dateFieldState.displayValue),\n onUpdate: state.setTimeValue,\n format: state.timeFormat,\n readOnly: state.readOnly,\n disabled: state.disabled,\n timeZone: state.timeZone,\n hasClear: props.hasClear,\n size: props.size,\n },\n };\n}\n"]}

package/dist/cjs/components/RelativeDateField/RelativeDateField.js CHANGED Viewed

@@ -20,9 +20,12 @@ function RelativeDateField(props) {
     const isMobile = (0, uikit_1.useMobile)();
     const [anchor, setAnchor] = react_1.default.useState(null);
     const [isOpen, setOpen] = react_1.default.useState(false);
+    const dialogClosing = react_1.default.useRef(false);
     const { focusWithinProps } = (0, uikit_1.useFocusWithin)({
         onFocusWithinChange: (isFocusWithin) => {
-            setOpen(isFocusWithin);
+            if (!dialogClosing.current) {
+                setOpen(isFocusWithin);
+            }
         },
         isDisabled: isMobile,
     });
@@ -36,12 +39,19 @@ function RelativeDateField(props) {
                         e.stopPropagation();
                         setOpen(true);
                     }
-                } })), (0, jsx_runtime_1.jsx)(HiddenInput_1.HiddenInput, { name: props.name, value: state.value, onReset: (value) => {
+                }, controlProps: Object.assign(Object.assign({}, inputProps.controlProps), { onClick: () => {
+                        setOpen(true);
+                    } }) })), (0, jsx_runtime_1.jsx)(HiddenInput_1.HiddenInput, { name: props.name, value: state.value, onReset: (value) => {
                     state.setValue(value);
-                }, disabled: state.disabled, form: props.form }), !isMobile && ((0, jsx_runtime_1.jsx)(uikit_1.Popup, { anchorElement: anchor, open: isOpen, onOpenChange: (_open, _event, reason) => {
-                    if (reason === 'escape-key') {
+                }, disabled: state.disabled, form: props.form }), !isMobile && ((0, jsx_runtime_1.jsx)(uikit_1.Popup, { anchorElement: anchor, open: isOpen, onOpenChange: (open) => {
+                    if (!open) {
                         setOpen(false);
                     }
+                    dialogClosing.current = !open;
+                }, onTransitionOutComplete: () => {
+                    setTimeout(() => {
+                        dialogClosing.current = false;
+                    });
                 }, placement: props.popupPlacement, offset: props.popupOffset, className: props.popupClassName, style: props.popupStyle, children: (0, jsx_runtime_1.jsxs)("div", { className: b('popup-content'), children: [(0, jsx_runtime_1.jsx)(Calendar_1.Calendar, Object.assign({}, calendarProps)), props.hasTime ? ((0, jsx_runtime_1.jsx)("div", { className: b('time-field-wrapper'), children: (0, jsx_runtime_1.jsx)(DateField_1.DateField, Object.assign({ className: b('time-field') }, timeInputProps)) })) : null] }) }))] })));
 }
 //# sourceMappingURL=RelativeDateField.js.map

package/dist/cjs/components/RelativeDateField/RelativeDateField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RelativeDateField.js","sourceRoot":"../../../../src","sources":["components/RelativeDateField/RelativeDateField.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;AA+Cb,~~8CA6EC~~;;;~~AA1HD~~,0DAA0B;AAE1B,6CAA8E;AAE9E,0CAAqC;AACrC,mDAAqC;AACrC,qDAAuC;AACvC,+DAAuD;AAavD,oFAA4E;AAC5E,oFAA4E;AAG5E,mCAAkC;AAElC,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,qBAAqB,CAAC,CAAC;AAmBvC,SAAgB,iBAAiB,CAAC,KAA6B;IAC3D,MAAM,KAAK,GAAG,IAAA,qDAAyB,EAAC,KAAK,CAAC,CAAC;IAC/C,MAAM,EAAC,UAAU,EAAE,aAAa,EAAE,cAAc,EAAC,GAAG,IAAA,qDAAyB,EAAC,KAAK,EAAE,KAAK,CAAC,CAAC;IAE5F,MAAM,QAAQ,GAAG,IAAA,iBAAS,GAAE,CAAC;IAE7B,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,eAAK,CAAC,QAAQ,CAAqB,IAAI,CAAC,CAAC;IAErE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,eAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;~~IAEhD~~,MAAM,EAAC,gBAAgB,EAAC,GAAG,IAAA,sBAAc,EAAC;QACtC,mBAAmB,EAAE,CAAC,aAAa,EAAE,EAAE;YACnC,OAAO,CAAC,aAAa,CAAC,CAAC;~~QAC3B~~,CAAC;QACD,UAAU,EAAE,QAAQ;KACvB,CAAC,CAAC;IAEH,OAAO,CACH,+CACI,IAAI,EAAC,OAAO,EACZ,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC,EACnC,KAAK,EAAE,KAAK,CAAC,KAAK,IACd,gBAAgB,eAEpB,uBAAC,iBAAS,oBACF,UAAU,IACd,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,EACrB,GAAG,EAAE,SAAS,EACd,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;;oBACb,MAAA,UAAU,CAAC,SAAS,2DAAG,CAAC,CAAC,CAAC;oBAC1B,IACI,CAAC,CAAC,CAAC,gBAAgB;wBACnB,CAAC,CAAC,MAAM;wBACR,CAAC,CAAC,CAAC,GAAG,KAAK,WAAW,IAAI,CAAC,CAAC,GAAG,KAAK,SAAS,CAAC,EAChD,CAAC;wBACC,CAAC,CAAC,cAAc,EAAE,CAAC;wBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;wBACpB,OAAO,CAAC,IAAI,CAAC,CAAC;oBAClB,CAAC;gBACL,CAAC,~~IACH~~,EACF,uBAAC,yBAAW,IACR,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE;oBACf,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;gBAC1B,CAAC,EACD,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,IAAI,EAAE,KAAK,CAAC,IAAI,GAClB,EACD,CAAC,QAAQ,IAAI,CACV,uBAAC,aAAK,IACF,aAAa,EAAE,MAAM,EACrB,IAAI,EAAE,MAAM,EACZ,YAAY,EAAE,CAAC,~~KAAK~~,EAAE,~~MAAM,~~EAAE,~~MAAM~~,EAAE,~~EAAE~~;~~oBACpC~~,~~IAAI~~,~~MAAM~~,KAAK,~~YAAY~~,~~EAAE~~,CAAC;~~wBAC1B~~,OAAO,CAAC,~~KAAK~~,CAAC,CAAC;~~oBACnB~~,CAAC;~~gBACL~~,CAAC,EACD,SAAS,EAAE,KAAK,CAAC,cAAc,EAC/B,MAAM,EAAE,KAAK,CAAC,WAAW,EACzB,SAAS,EAAE,KAAK,CAAC,cAAc,EAC/B,KAAK,EAAE,KAAK,CAAC,UAAU,YAEvB,iCAAK,SAAS,EAAE,CAAC,CAAC,eAAe,CAAC,aAC9B,uBAAC,mBAAQ,oBAAK,aAAa,EAAI,EAC9B,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CACb,gCAAK,SAAS,EAAE,CAAC,CAAC,oBAAoB,CAAC,YACnC,uBAAC,qBAAS,kBAAC,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,IAAM,cAAc,EAAI,GAC3D,CACT,CAAC,CAAC,CAAC,IAAI,IACN,GACF,CACX,KACC,CACT,CAAC;AACN,CAAC","sourcesContent":["'use client';\n\nimport React from 'react';\n\nimport {Popup, TextInput, useFocusWithin, useMobile} from '@gravity-ui/uikit';\n\nimport {block} from '../../utils/cn';\nimport {Calendar} from '../Calendar';\nimport {DateField} from '../DateField';\nimport {HiddenInput} from '../HiddenInput/HiddenInput';\nimport type {\n AccessibilityProps,\n DomProps,\n FocusableProps,\n InputDOMProps,\n KeyboardEvents,\n PopupStyleProps,\n StyleProps,\n TextInputExtendProps,\n TextInputProps,\n} from '../types';\n\nimport {useRelativeDateFieldProps} from './hooks/useRelativeDateFieldProps';\nimport {useRelativeDateFieldState} from './hooks/useRelativeDateFieldState';\nimport type {RelativeDateFieldOptions} from './hooks/useRelativeDateFieldState';\n\nimport './RelativeDateField.scss';\n\nconst b = block('relative-date-field');\n\nexport interface RelativeDateFieldProps\n extends RelativeDateFieldOptions,\n TextInputProps,\n TextInputExtendProps,\n DomProps,\n InputDOMProps,\n StyleProps,\n AccessibilityProps,\n FocusableProps,\n KeyboardEvents,\n PopupStyleProps {\n /*\n Show time field in popup\n * @default false\n */\n hasTime?: boolean;\n}\nexport function RelativeDateField(props: RelativeDateFieldProps) {\n const state = useRelativeDateFieldState(props);\n const {inputProps, calendarProps, timeInputProps} = useRelativeDateFieldProps(state, props);\n\n const isMobile = useMobile();\n\n const [anchor, setAnchor] = React.useState<HTMLElement \| null>(null);\n\n const [isOpen, setOpen] = React.useState(false);\n\n const {focusWithinProps} = useFocusWithin({\n onFocusWithinChange: (isFocusWithin) => {\n setOpen(isFocusWithin);\n },\n isDisabled: isMobile,\n });\n\n return (\n <div\n role=\"group\"\n className={b(null, props.className)}\n style={props.style}\n {...focusWithinProps}\n >\n <TextInput\n {...inputProps}\n className={b('field')}\n ref={setAnchor}\n onBlur={props.onBlur}\n onKeyDown={(e) => {\n inputProps.onKeyDown?.(e);\n if (\n !e.defaultPrevented &&\n e.altKey &&\n (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')\n ) {\n e.preventDefault();\n e.stopPropagation();\n setOpen(true);\n }\n }}\n />\n <HiddenInput\n name={props.name}\n value={state.value}\n onReset={(value) => {\n state.setValue(value);\n }}\n disabled={state.disabled}\n form={props.form}\n />\n {!isMobile && (\n <Popup\n anchorElement={anchor}\n open={isOpen}\n onOpenChange={(~~_open, _event, reason~~) => {\n if (~~reason === 'escape-key'~~) {\n setOpen(false);\n }\n }}\n placement={props.popupPlacement}\n offset={props.popupOffset}\n className={props.popupClassName}\n style={props.popupStyle}\n >\n <div className={b('popup-content')}>\n <Calendar {...calendarProps} />\n {props.hasTime ? (\n <div className={b('time-field-wrapper')}>\n <DateField className={b('time-field')} {...timeInputProps} />\n </div>\n ) : null}\n </div>\n </Popup>\n )}\n </div>\n );\n}\n"]}
1	+ {"version":3,"file":"RelativeDateField.js","sourceRoot":"../../../../src","sources":["components/RelativeDateField/RelativeDateField.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport React from 'react';\n\nimport {Popup, TextInput, useFocusWithin, useMobile} from '@gravity-ui/uikit';\n\nimport {block} from '../../utils/cn';\nimport {Calendar} from '../Calendar';\nimport {DateField} from '../DateField';\nimport {HiddenInput} from '../HiddenInput/HiddenInput';\nimport type {\n AccessibilityProps,\n DomProps,\n FocusableProps,\n InputDOMProps,\n KeyboardEvents,\n PopupStyleProps,\n StyleProps,\n TextInputExtendProps,\n TextInputProps,\n} from '../types';\n\nimport {useRelativeDateFieldProps} from './hooks/useRelativeDateFieldProps';\nimport {useRelativeDateFieldState} from './hooks/useRelativeDateFieldState';\nimport type {RelativeDateFieldOptions} from './hooks/useRelativeDateFieldState';\n\nimport './RelativeDateField.scss';\n\nconst b = block('relative-date-field');\n\nexport interface RelativeDateFieldProps\n extends RelativeDateFieldOptions,\n TextInputProps,\n TextInputExtendProps,\n DomProps,\n InputDOMProps,\n StyleProps,\n AccessibilityProps,\n FocusableProps,\n KeyboardEvents,\n PopupStyleProps {\n /*\n Show time field in popup\n * @default false\n */\n hasTime?: boolean;\n}\nexport function RelativeDateField(props: RelativeDateFieldProps) {\n const state = useRelativeDateFieldState(props);\n const {inputProps, calendarProps, timeInputProps} = useRelativeDateFieldProps(state, props);\n\n const isMobile = useMobile();\n\n const [anchor, setAnchor] = React.useState<HTMLElement \| null>(null);\n\n const [isOpen, setOpen] = React.useState(false);\n const dialogClosing = React.useRef(false);\n\n const {focusWithinProps} = useFocusWithin({\n onFocusWithinChange: (isFocusWithin) => {\n if (!dialogClosing.current) {\n setOpen(isFocusWithin);\n }\n },\n isDisabled: isMobile,\n });\n\n return (\n <div\n role=\"group\"\n className={b(null, props.className)}\n style={props.style}\n {...focusWithinProps}\n >\n <TextInput\n {...inputProps}\n className={b('field')}\n ref={setAnchor}\n onBlur={props.onBlur}\n onKeyDown={(e) => {\n inputProps.onKeyDown?.(e);\n if (\n !e.defaultPrevented &&\n e.altKey &&\n (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')\n ) {\n e.preventDefault();\n e.stopPropagation();\n setOpen(true);\n }\n }}\n controlProps={{\n ...inputProps.controlProps,\n onClick: () => {\n setOpen(true);\n },\n }}\n />\n <HiddenInput\n name={props.name}\n value={state.value}\n onReset={(value) => {\n state.setValue(value);\n }}\n disabled={state.disabled}\n form={props.form}\n />\n {!isMobile && (\n <Popup\n anchorElement={anchor}\n open={isOpen}\n onOpenChange={(open) => {\n if (!open) {\n setOpen(false);\n }\n dialogClosing.current = !open;\n }}\n onTransitionOutComplete={() => {\n setTimeout(() => {\n dialogClosing.current = false;\n });\n }}\n placement={props.popupPlacement}\n offset={props.popupOffset}\n className={props.popupClassName}\n style={props.popupStyle}\n >\n <div className={b('popup-content')}>\n <Calendar {...calendarProps} />\n {props.hasTime ? (\n <div className={b('time-field-wrapper')}>\n <DateField className={b('time-field')} {...timeInputProps} />\n </div>\n ) : null}\n </div>\n </Popup>\n )}\n </div>\n );\n}\n"]}

package/dist/cjs/components/RelativeDatePicker/hooks/useRelativeDatePickerProps.js CHANGED Viewed

@@ -160,6 +160,7 @@ function useRelativeDatePickerProps(state, _a) {
             offset: props.popupOffset,
             className: props.popupClassName,
             style: props.popupStyle,
+            returnFocus: false,
         },
         calendarProps: {
             ref: calendarRef,

package/dist/cjs/components/RelativeDatePicker/hooks/useRelativeDatePickerProps.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useRelativeDatePickerProps.js","sourceRoot":"../../../../../src","sources":["components/RelativeDatePicker/hooks/useRelativeDatePickerProps.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {useControlledState, useFocusWithin, useForkRef} from '@gravity-ui/uikit';\nimport type {ButtonButtonProps, PopupProps, TextInputProps} from '@gravity-ui/uikit';\n\nimport type {Calendar, CalendarInstance} from '../../Calendar';\nimport {useDateFieldProps} from '../../DateField';\nimport type {DateFieldProps} from '../../DateField';\nimport {getCalendarModes} from '../../DatePicker/utils';\nimport {useRelativeDateFieldProps} from '../../RelativeDateField';\nimport {getButtonSizeForInput} from '../../utils/getButtonSizeForInput';\nimport {mergeProps} from '../../utils/mergeProps';\nimport type {RelativeDatePickerProps} from '../RelativeDatePicker';\nimport {i18n} from '../i18n';\n\nimport type {RelativeDatePickerState} from './useRelativeDatePickerState';\n\ninterface InnerRelativeDatePickerProps {\n groupProps: React.HTMLAttributes<unknown> & {ref: React.Ref<HTMLElement>};\n fieldProps: TextInputProps;\n modeSwitcherProps: ButtonButtonProps;\n calendarButtonProps: ButtonButtonProps;\n popupProps: PopupProps;\n calendarProps: React.ComponentProps<typeof Calendar>;\n timeInputProps: DateFieldProps;\n}\n\nexport function useRelativeDatePickerProps(\n state: RelativeDatePickerState,\n {onFocus, onBlur, ...props}: RelativeDatePickerProps,\n): InnerRelativeDatePickerProps {\n const {mode, setMode, datePickerState, relativeDateState} = state;\n\n const [focusedDate, setFocusedDate] = React.useState(\n mode === 'relative'\n ? relativeDateState.lastCorrectDate\n : datePickerState.dateFieldState.displayValue,\n );\n\n const [prevCorrectDate, setPrevCorrectDate] = React.useState(relativeDateState.lastCorrectDate);\n if (prevCorrectDate !== relativeDateState.lastCorrectDate) {\n setPrevCorrectDate(relativeDateState.lastCorrectDate);\n setFocusedDate(relativeDateState.lastCorrectDate);\n }\n\n const [prevDateValue, setPrevDateValue] = React.useState(\n datePickerState.dateFieldState.displayValue,\n );\n if (!datePickerState.dateFieldState.displayValue.isSame(prevDateValue, 'day')) {\n setPrevDateValue(datePickerState.dateFieldState.displayValue);\n setFocusedDate(datePickerState.dateFieldState.displayValue);\n }\n const {focusWithinProps} = useFocusWithin({\n onFocusWithin: onFocus,\n onBlurWithin: onBlur,\n onFocusWithinChange(isFocusWithin) {\n if (!isFocusWithin) {\n state.setActive(false);\n }\n },\n });\n\n const [isOpen, setOpen] = useControlledState<boolean>(undefined, false, props.onOpenChange);\n if (!state.isActive && isOpen) {\n setOpen(false);\n }\n\n const commonInputProps: TextInputProps = {\n onFocus: () => {\n if (!state.isActive) {\n state.setActive(true);\n setOpen(true);\n }\n },\n errorMessage: props.errorMessage,\n errorPlacement: props.errorPlacement,\n controlProps: {\n onClick: () => {\n if (state.disabled) {\n return;\n }\n if (!isOpen) {\n state.setActive(true);\n setOpen(true);\n }\n },\n role: 'combobox',\n 'aria-expanded': isOpen,\n },\n };\n\n const {inputProps} = useDateFieldProps(datePickerState.dateFieldState, {\n ...props,\n value: undefined,\n defaultValue: undefined,\n onUpdate: undefined,\n });\n\n const {inputProps: relativeDateProps} = useRelativeDateFieldProps(relativeDateState, {\n ...props,\n value: undefined,\n defaultValue: undefined,\n onUpdate: undefined,\n });\n\n let validationState = props.validationState;\n if (!validationState) {\n validationState =\n mode === 'relative'\n ? relativeDateState.validationState\n : datePickerState.dateFieldState.validationState;\n }\n\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n const handleRef = useForkRef(\n inputRef,\n mode === 'relative' ? relativeDateProps.controlRef : inputProps.controlRef,\n );\n\n const calendarRef = React.useRef<CalendarInstance>(null);\n\n function focusCalendar() {\n setTimeout(() => {\n calendarRef.current?.focus();\n });\n }\n\n function focusInput() {\n setTimeout(() => {\n inputRef.current?.focus({preventScroll: true});\n });\n }\n const groupRef = React.useRef<HTMLElement>(null);\n const calendarModes = getCalendarModes(datePickerState.formatInfo);\n\n return {\n groupProps: {\n ref: groupRef,\n tabIndex: -1,\n role: 'group',\n ...focusWithinProps,\n onKeyDown: (e) => {\n if (e.altKey && (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')) {\n e.preventDefault();\n e.stopPropagation();\n setOpen(true);\n focusCalendar();\n }\n },\n },\n fieldProps: mergeProps(\n commonInputProps,\n mode === 'relative' ? relativeDateProps : inputProps,\n mode === 'absolute' &&\n datePickerState.dateFieldState.isEmpty &&\n !state.isActive &&\n props.placeholder\n ? {value: ''}\n : undefined,\n {controlRef: handleRef, validationState},\n ),\n modeSwitcherProps: {\n size: getButtonSizeForInput(props.size),\n disabled: state.readOnly \|\| state.disabled,\n view: 'flat-secondary',\n style: {zIndex: 2, marginInlineEnd: 2},\n selected: mode === 'relative',\n 'aria-label': i18n('Formula input mode'),\n onClick: () => {\n setMode(mode === 'relative' ? 'absolute' : 'relative');\n if (mode === 'relative') {\n const valueDate = datePickerState.value;\n if (valueDate) {\n setFocusedDate(valueDate);\n }\n } else if (relativeDateState.parsedDate) {\n setFocusedDate(relativeDateState.parsedDate);\n }\n focusInput();\n },\n },\n calendarButtonProps: {\n size: getButtonSizeForInput(props.size),\n disabled: state.disabled,\n 'aria-label': i18n('Calendar'),\n 'aria-haspopup': 'dialog',\n 'aria-expanded': isOpen,\n view: 'flat-secondary',\n onClick: () => {\n state.setActive(true);\n setOpen(!isOpen);\n if (!isOpen) {\n focusCalendar();\n }\n },\n },\n popupProps: {\n open: isOpen,\n onEscapeKeyDown: () => {\n setOpen(false);\n focusInput();\n },\n onOutsideClick: (e) => {\n if (e.target && !groupRef.current?.contains(e.target as Node)) {\n setOpen(false);\n }\n },\n onTransitionOutComplete: () => {\n setFocusedDate(\n mode === 'relative'\n ? relativeDateState.lastCorrectDate\n : datePickerState.dateFieldState.displayValue,\n );\n },\n placement: props.popupPlacement,\n offset: props.popupOffset,\n className: props.popupClassName,\n style: props.popupStyle,\n },\n calendarProps: {\n ref: calendarRef,\n size: props.size === 's' ? 'm' : props.size,\n readOnly: props.readOnly,\n value: state.selectedDate,\n onUpdate: (v) => {\n datePickerState.setDateValue(v);\n if (!state.datePickerState.formatInfo.hasTime) {\n setOpen(false);\n focusInput();\n }\n },\n focusedValue: focusedDate,\n onFocusUpdate: setFocusedDate,\n minValue: props.minValue,\n maxValue: props.maxValue,\n modes: mode === 'absolute' ? calendarModes : undefined,\n },\n timeInputProps: {\n value: datePickerState.timeValue,\n onUpdate: datePickerState.setTimeValue,\n format: datePickerState.timeFormat,\n readOnly: state.readOnly,\n disabled: state.disabled,\n timeZone: props.timeZone,\n hasClear: props.hasClear,\n size: props.size,\n },\n };\n}\n"]}
1	+ {"version":3,"file":"useRelativeDatePickerProps.js","sourceRoot":"../../../../../src","sources":["components/RelativeDatePicker/hooks/useRelativeDatePickerProps.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {useControlledState, useFocusWithin, useForkRef} from '@gravity-ui/uikit';\nimport type {ButtonButtonProps, PopupProps, TextInputProps} from '@gravity-ui/uikit';\n\nimport type {Calendar, CalendarInstance} from '../../Calendar';\nimport {useDateFieldProps} from '../../DateField';\nimport type {DateFieldProps} from '../../DateField';\nimport {getCalendarModes} from '../../DatePicker/utils';\nimport {useRelativeDateFieldProps} from '../../RelativeDateField';\nimport {getButtonSizeForInput} from '../../utils/getButtonSizeForInput';\nimport {mergeProps} from '../../utils/mergeProps';\nimport type {RelativeDatePickerProps} from '../RelativeDatePicker';\nimport {i18n} from '../i18n';\n\nimport type {RelativeDatePickerState} from './useRelativeDatePickerState';\n\ninterface InnerRelativeDatePickerProps {\n groupProps: React.HTMLAttributes<unknown> & {ref: React.Ref<HTMLElement>};\n fieldProps: TextInputProps;\n modeSwitcherProps: ButtonButtonProps;\n calendarButtonProps: ButtonButtonProps;\n popupProps: PopupProps;\n calendarProps: React.ComponentProps<typeof Calendar>;\n timeInputProps: DateFieldProps;\n}\n\nexport function useRelativeDatePickerProps(\n state: RelativeDatePickerState,\n {onFocus, onBlur, ...props}: RelativeDatePickerProps,\n): InnerRelativeDatePickerProps {\n const {mode, setMode, datePickerState, relativeDateState} = state;\n\n const [focusedDate, setFocusedDate] = React.useState(\n mode === 'relative'\n ? relativeDateState.lastCorrectDate\n : datePickerState.dateFieldState.displayValue,\n );\n\n const [prevCorrectDate, setPrevCorrectDate] = React.useState(relativeDateState.lastCorrectDate);\n if (prevCorrectDate !== relativeDateState.lastCorrectDate) {\n setPrevCorrectDate(relativeDateState.lastCorrectDate);\n setFocusedDate(relativeDateState.lastCorrectDate);\n }\n\n const [prevDateValue, setPrevDateValue] = React.useState(\n datePickerState.dateFieldState.displayValue,\n );\n if (!datePickerState.dateFieldState.displayValue.isSame(prevDateValue, 'day')) {\n setPrevDateValue(datePickerState.dateFieldState.displayValue);\n setFocusedDate(datePickerState.dateFieldState.displayValue);\n }\n const {focusWithinProps} = useFocusWithin({\n onFocusWithin: onFocus,\n onBlurWithin: onBlur,\n onFocusWithinChange(isFocusWithin) {\n if (!isFocusWithin) {\n state.setActive(false);\n }\n },\n });\n\n const [isOpen, setOpen] = useControlledState<boolean>(undefined, false, props.onOpenChange);\n if (!state.isActive && isOpen) {\n setOpen(false);\n }\n\n const commonInputProps: TextInputProps = {\n onFocus: () => {\n if (!state.isActive) {\n state.setActive(true);\n setOpen(true);\n }\n },\n errorMessage: props.errorMessage,\n errorPlacement: props.errorPlacement,\n controlProps: {\n onClick: () => {\n if (state.disabled) {\n return;\n }\n if (!isOpen) {\n state.setActive(true);\n setOpen(true);\n }\n },\n role: 'combobox',\n 'aria-expanded': isOpen,\n },\n };\n\n const {inputProps} = useDateFieldProps(datePickerState.dateFieldState, {\n ...props,\n value: undefined,\n defaultValue: undefined,\n onUpdate: undefined,\n });\n\n const {inputProps: relativeDateProps} = useRelativeDateFieldProps(relativeDateState, {\n ...props,\n value: undefined,\n defaultValue: undefined,\n onUpdate: undefined,\n });\n\n let validationState = props.validationState;\n if (!validationState) {\n validationState =\n mode === 'relative'\n ? relativeDateState.validationState\n : datePickerState.dateFieldState.validationState;\n }\n\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n const handleRef = useForkRef(\n inputRef,\n mode === 'relative' ? relativeDateProps.controlRef : inputProps.controlRef,\n );\n\n const calendarRef = React.useRef<CalendarInstance>(null);\n\n function focusCalendar() {\n setTimeout(() => {\n calendarRef.current?.focus();\n });\n }\n\n function focusInput() {\n setTimeout(() => {\n inputRef.current?.focus({preventScroll: true});\n });\n }\n const groupRef = React.useRef<HTMLElement>(null);\n const calendarModes = getCalendarModes(datePickerState.formatInfo);\n\n return {\n groupProps: {\n ref: groupRef,\n tabIndex: -1,\n role: 'group',\n ...focusWithinProps,\n onKeyDown: (e) => {\n if (e.altKey && (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')) {\n e.preventDefault();\n e.stopPropagation();\n setOpen(true);\n focusCalendar();\n }\n },\n },\n fieldProps: mergeProps(\n commonInputProps,\n mode === 'relative' ? relativeDateProps : inputProps,\n mode === 'absolute' &&\n datePickerState.dateFieldState.isEmpty &&\n !state.isActive &&\n props.placeholder\n ? {value: ''}\n : undefined,\n {controlRef: handleRef, validationState},\n ),\n modeSwitcherProps: {\n size: getButtonSizeForInput(props.size),\n disabled: state.readOnly \|\| state.disabled,\n view: 'flat-secondary',\n style: {zIndex: 2, marginInlineEnd: 2},\n selected: mode === 'relative',\n 'aria-label': i18n('Formula input mode'),\n onClick: () => {\n setMode(mode === 'relative' ? 'absolute' : 'relative');\n if (mode === 'relative') {\n const valueDate = datePickerState.value;\n if (valueDate) {\n setFocusedDate(valueDate);\n }\n } else if (relativeDateState.parsedDate) {\n setFocusedDate(relativeDateState.parsedDate);\n }\n focusInput();\n },\n },\n calendarButtonProps: {\n size: getButtonSizeForInput(props.size),\n disabled: state.disabled,\n 'aria-label': i18n('Calendar'),\n 'aria-haspopup': 'dialog',\n 'aria-expanded': isOpen,\n view: 'flat-secondary',\n onClick: () => {\n state.setActive(true);\n setOpen(!isOpen);\n if (!isOpen) {\n focusCalendar();\n }\n },\n },\n popupProps: {\n open: isOpen,\n onEscapeKeyDown: () => {\n setOpen(false);\n focusInput();\n },\n onOutsideClick: (e) => {\n if (e.target && !groupRef.current?.contains(e.target as Node)) {\n setOpen(false);\n }\n },\n onTransitionOutComplete: () => {\n setFocusedDate(\n mode === 'relative'\n ? relativeDateState.lastCorrectDate\n : datePickerState.dateFieldState.displayValue,\n );\n },\n placement: props.popupPlacement,\n offset: props.popupOffset,\n className: props.popupClassName,\n style: props.popupStyle,\n returnFocus: false,\n },\n calendarProps: {\n ref: calendarRef,\n size: props.size === 's' ? 'm' : props.size,\n readOnly: props.readOnly,\n value: state.selectedDate,\n onUpdate: (v) => {\n datePickerState.setDateValue(v);\n if (!state.datePickerState.formatInfo.hasTime) {\n setOpen(false);\n focusInput();\n }\n },\n focusedValue: focusedDate,\n onFocusUpdate: setFocusedDate,\n minValue: props.minValue,\n maxValue: props.maxValue,\n modes: mode === 'absolute' ? calendarModes : undefined,\n },\n timeInputProps: {\n value: datePickerState.timeValue,\n onUpdate: datePickerState.setTimeValue,\n format: datePickerState.timeFormat,\n readOnly: state.readOnly,\n disabled: state.disabled,\n timeZone: props.timeZone,\n hasClear: props.hasClear,\n size: props.size,\n },\n };\n}\n"]}

package/dist/cjs/components/RelativeRangeDatePicker/RelativeRangeDatePicker.js CHANGED Viewed

@@ -17,33 +17,27 @@ function RelativeRangeDatePicker(props) {
     const state = (0, useRelativeRangeDatePickerState_1.useRelativeRangeDatePickerState)(props);
     const isMobile = (0, uikit_1.useMobile)();
     const [anchor, setAnchor] = react_1.default.useState(null);
-    const inputRef = react_1.default.useRef(null);
-    const [isActive, setIsActive] = react_1.default.useState(false);
+    const dialogClosing = react_1.default.useRef(false);
     const [open, setOpen] = (0, uikit_1.useControlledState)(undefined, false, props.onOpenChange);
     const { focusWithinProps } = (0, uikit_1.useFocusWithin)({
         isDisabled: props.disabled,
-        onFocusWithin: (e) => {
+        onFocusWithin: props.onFocus,
+        onBlurWithin: props.onBlur,
+        onFocusWithinChange: (isFocusWithin) => {
             var _a;
-            if (!isActive) {
-                (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, e);
-            }
-        },
-        onBlurWithin: (e) => {
-            var _a;
-            if (!open) {
-                setIsActive(false);
-                (_a = props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props, e);
+            if (isFocusWithin &&
+                !dialogClosing.current &&
+                !props.renderControl &&
+                ((_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.tagName) !== 'BUTTON') {
+                setOpen(true);
             }
         },
     });
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: setAnchor }, focusWithinProps, { className: b(null, props.className), style: props.style, children: [(0, jsx_runtime_1.jsx)(Control_1.Control, { props: props, state: state, open: open, isMobile: isMobile, ref: inputRef, onClick: () => {
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: setAnchor }, focusWithinProps, { className: b(null, props.className), style: props.style, children: [(0, jsx_runtime_1.jsx)(Control_1.Control, { props: props, state: state, open: open, setOpen: setOpen, isMobile: isMobile, onClick: () => {
                     if (props.disabled) {
                         return;
                     }
-                    if (!open) {
-                        setIsActive(true);
-                        setOpen(true);
-                    }
+                    setOpen(true);
                 }, onKeyDown: (e) => {
                     if (props.disabled) {
                         return;
@@ -53,28 +47,21 @@ function RelativeRangeDatePicker(props) {
                         setOpen(true);
                     }
                 }, onClickCalendar: () => {
-                    setIsActive(true);
                     setOpen(!open);
-                }, onFocus: () => {
-                    if (!isActive) {
-                        setIsActive(true);
-                        setOpen(true);
-                    }
                 }, onUpdate: (v) => {
                     if (!props.readOnly && !v) {
                         state.setValue(null, 'default');
                     }
                 } }), (0, jsx_runtime_1.jsx)(HiddenInput_1.HiddenInput, { name: props.name, form: props.form, value: state.value, toStringValue: (v) => { var _a, _b; return (_b = (_a = v === null || v === void 0 ? void 0 : v.start) === null || _a === void 0 ? void 0 : _a.type) !== null && _b !== void 0 ? _b : ''; }, disabled: props.disabled }), (0, jsx_runtime_1.jsx)(HiddenInput_1.HiddenInput, { name: props.name, form: props.form, value: state.value, toStringValue: (v) => { var _a; return getNativeValue((_a = v === null || v === void 0 ? void 0 : v.start) !== null && _a !== void 0 ? _a : null); }, disabled: props.disabled }), (0, jsx_runtime_1.jsx)(HiddenInput_1.HiddenInput, { name: props.name, form: props.form, value: state.value, toStringValue: (v) => { var _a, _b; return (_b = (_a = v === null || v === void 0 ? void 0 : v.end) === null || _a === void 0 ? void 0 : _a.type) !== null && _b !== void 0 ? _b : ''; }, disabled: props.disabled }), (0, jsx_runtime_1.jsx)(HiddenInput_1.HiddenInput, { name: props.name, form: props.form, value: state.value, toStringValue: (v) => { var _a; return getNativeValue((_a = v === null || v === void 0 ? void 0 : v.end) !== null && _a !== void 0 ? _a : null); }, disabled: props.disabled }), (0, jsx_runtime_1.jsx)(HiddenInput_1.HiddenInput, { name: props.name, form: props.form, onReset: (v) => {
                     state.setValue(v.value, v.timeZone);
-                }, value: { value: state.value, timeZone: state.timeZone }, toStringValue: (v) => v.timeZone, disabled: props.disabled }), (0, jsx_runtime_1.jsx)(PickerDialog_1.PickerDialog, { value: state.value, onUpdate: state.setValue, timeZone: state.timeZone, open: open, onClose: (reason) => {
+                }, value: { value: state.value, timeZone: state.timeZone }, toStringValue: (v) => v.timeZone, disabled: props.disabled }), (0, jsx_runtime_1.jsx)(PickerDialog_1.PickerDialog, { value: state.value, onUpdate: state.setValue, timeZone: state.timeZone, open: open, onClose: () => {
                     setOpen(false);
-                    if (reason === 'escape-key') {
-                        setTimeout(() => {
-                            var _a;
-                            (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus({ preventScroll: true });
-                        });
-                    }
-                }, anchor: anchor, modal: true, popupClassName: props.popupClassName, popupStyle: props.popupStyle, popupPlacement: props.popupPlacement, popupOffset: props.popupOffset, isMobile: isMobile, size: props.size, format: props.format, readOnly: props.readOnly, minValue: props.minValue, maxValue: props.maxValue, allowNullableValues: props.allowNullableValues, isDateUnavailable: props.isDateUnavailable, placeholderValue: props.placeholderValue, withPresets: props.withPresets, presetTabs: props.presetTabs, docs: props.docs, withApplyButton: props.withApplyButton, withZonesList: props.withZonesList })] })));
+                    dialogClosing.current = true;
+                }, onRemove: () => {
+                    setTimeout(() => {
+                        dialogClosing.current = false;
+                    });
+                }, anchor: anchor, modal: true, returnFocus: true, popupClassName: props.popupClassName, popupStyle: props.popupStyle, popupPlacement: props.popupPlacement, popupOffset: props.popupOffset, isMobile: isMobile, size: props.size, format: props.format, readOnly: props.readOnly, minValue: props.minValue, maxValue: props.maxValue, allowNullableValues: props.allowNullableValues, isDateUnavailable: props.isDateUnavailable, placeholderValue: props.placeholderValue, withPresets: props.withPresets, presetTabs: props.presetTabs, docs: props.docs, withApplyButton: props.withApplyButton, withZonesList: props.withZonesList })] })));
 }
 function getNativeValue(value) {
     if (!value) {

package/dist/cjs/components/RelativeRangeDatePicker/RelativeRangeDatePicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RelativeRangeDatePicker.js","sourceRoot":"../../../../src","sources":["components/RelativeRangeDatePicker/RelativeRangeDatePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport React from 'react';\n\nimport {useControlledState, useFocusWithin, useMobile} from '@gravity-ui/uikit';\n\nimport {block} from '../../utils/cn';\nimport {HiddenInput} from '../HiddenInput/HiddenInput';\nimport type {Value} from '../RelativeDatePicker';\n\nimport {Control} from './components/Control/Control';\nimport {PickerDialog} from './components/PickerDialog/PickerDialog';\nimport {useRelativeRangeDatePickerState} from './hooks/useRelativeRangeDatePickerState';\nimport type {RelativeRangeDatePickerProps} from './types';\n\nimport './RelativeRangeDatePicker.scss';\n\nconst b = block('relative-range-date-picker');\n\nexport function RelativeRangeDatePicker(props: RelativeRangeDatePickerProps) {\n const state = useRelativeRangeDatePickerState(props);\n\n const isMobile = useMobile();\n\n const [anchor, setAnchor] = React.useState<HTMLDivElement \| null>(null);\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n const [isActive, setIsActive] = React.useState(false);\n const [open, setOpen] = useControlledState<boolean>(undefined, false, props.onOpenChange);\n\n const {focusWithinProps} = useFocusWithin({\n isDisabled: props.disabled,\n onFocusWithin: (e) => {\n if (!isActive) {\n props.onFocus?.(e);\n }\n },\n onBlurWithin: (e) => {\n if (!open) {\n setIsActive(false);\n props.onBlur?.(e);\n }\n },\n });\n\n return (\n <div\n ref={setAnchor}\n {...focusWithinProps}\n className={b(null, props.className)}\n style={props.style}\n >\n <Control\n props={props}\n state={state}\n open={open}\n isMobile={isMobile}\n ref={inputRef}\n onClick={() => {\n if (props.disabled) {\n return;\n }\n if (!open) {\n setIsActive(true);\n setOpen(true);\n }\n }}\n onKeyDown={(e) => {\n if (props.disabled) {\n return;\n }\n if (e.altKey && (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')) {\n e.preventDefault();\n setOpen(true);\n }\n }}\n onClickCalendar={() => {\n setIsActive(true);\n setOpen(!open);\n }}\n onFocus={() => {\n if (!isActive) {\n setIsActive(true);\n setOpen(true);\n }\n }}\n onUpdate={(v: string) => {\n if (!props.readOnly && !v) {\n state.setValue(null, 'default');\n }\n }}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => v?.start?.type ?? ''}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => getNativeValue(v?.start ?? null)}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => v?.end?.type ?? ''}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => getNativeValue(v?.end ?? null)}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n onReset={(v) => {\n state.setValue(v.value, v.timeZone);\n }}\n value={{value: state.value, timeZone: state.timeZone}}\n toStringValue={(v) => v.timeZone}\n disabled={props.disabled}\n />\n\n <PickerDialog\n value={state.value}\n onUpdate={state.setValue}\n timeZone={state.timeZone}\n open={open}\n onClose={(reason) => {\n setOpen(false);\n if (reason === 'escape-key') {\n setTimeout(() => {\n inputRef.current?.focus({preventScroll: true});\n });\n }\n }}\n anchor={anchor}\n modal\n popupClassName={props.popupClassName}\n popupStyle={props.popupStyle}\n popupPlacement={props.popupPlacement}\n popupOffset={props.popupOffset}\n isMobile={isMobile}\n size={props.size}\n format={props.format}\n readOnly={props.readOnly}\n minValue={props.minValue}\n maxValue={props.maxValue}\n allowNullableValues={props.allowNullableValues}\n isDateUnavailable={props.isDateUnavailable}\n placeholderValue={props.placeholderValue}\n withPresets={props.withPresets}\n presetTabs={props.presetTabs}\n docs={props.docs}\n withApplyButton={props.withApplyButton}\n withZonesList={props.withZonesList}\n />\n </div>\n );\n}\n\nfunction getNativeValue(value: Value \| null) {\n if (!value) {\n return '';\n }\n if (value.type === 'relative') {\n return value.value;\n }\n return value.value.toISOString();\n}\n"]}
1	+ {"version":3,"file":"RelativeRangeDatePicker.js","sourceRoot":"../../../../src","sources":["components/RelativeRangeDatePicker/RelativeRangeDatePicker.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;AAmBb,0DA4IC;;;AA7JD,0DAA0B;AAE1B,6CAAgF;AAEhF,0CAAqC;AACrC,+DAAuD;AAGvD,6DAAqD;AACrD,4EAAoE;AACpE,gGAAwF;AAGxF,yCAAwC;AAExC,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,4BAA4B,CAAC,CAAC;AAE9C,SAAgB,uBAAuB,CAAC,KAAmC;IACvE,MAAM,KAAK,GAAG,IAAA,iEAA+B,EAAC,KAAK,CAAC,CAAC;IAErD,MAAM,QAAQ,GAAG,IAAA,iBAAS,GAAE,CAAC;IAE7B,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,eAAK,CAAC,QAAQ,CAAwB,IAAI,CAAC,CAAC;IACxE,MAAM,aAAa,GAAG,eAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAE1C,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,IAAA,0BAAkB,EAAU,SAAS,EAAE,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC;IAE1F,MAAM,EAAC,gBAAgB,EAAC,GAAG,IAAA,sBAAc,EAAC;QACtC,UAAU,EAAE,KAAK,CAAC,QAAQ;QAC1B,aAAa,EAAE,KAAK,CAAC,OAAO;QAC5B,YAAY,EAAE,KAAK,CAAC,MAAM;QAC1B,mBAAmB,EAAE,CAAC,aAAa,EAAE,EAAE;;YACnC,IACI,aAAa;gBACb,CAAC,aAAa,CAAC,OAAO;gBACtB,CAAC,KAAK,CAAC,aAAa;gBACpB,CAAA,MAAA,QAAQ,CAAC,aAAa,0CAAE,OAAO,MAAK,QAAQ,EAC9C,CAAC;gBACC,OAAO,CAAC,IAAI,CAAC,CAAC;YAClB,CAAC;QACL,CAAC;KACJ,CAAC,CAAC;IAEH,OAAO,CACH,+CACI,GAAG,EAAE,SAAS,IACV,gBAAgB,IACpB,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC,EACnC,KAAK,EAAE,KAAK,CAAC,KAAK,aAElB,uBAAC,iBAAO,IACJ,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,GAAG,EAAE;oBACV,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;wBACjB,OAAO;oBACX,CAAC;oBACD,OAAO,CAAC,IAAI,CAAC,CAAC;gBAClB,CAAC,EACD,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;oBACb,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;wBACjB,OAAO;oBACX,CAAC;oBACD,IAAI,CAAC,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,WAAW,IAAI,CAAC,CAAC,GAAG,KAAK,SAAS,CAAC,EAAE,CAAC;wBAC7D,CAAC,CAAC,cAAc,EAAE,CAAC;wBACnB,OAAO,CAAC,IAAI,CAAC,CAAC;oBAClB,CAAC;gBACL,CAAC,EACD,eAAe,EAAE,GAAG,EAAE;oBAClB,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC;gBACnB,CAAC,EACD,QAAQ,EAAE,CAAC,CAAS,EAAE,EAAE;oBACpB,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,CAAC,EAAE,CAAC;wBACxB,KAAK,CAAC,QAAQ,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;oBACpC,CAAC;gBACL,CAAC,GACH,EACF,uBAAC,yBAAW,IACR,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,aAAa,EAAE,CAAC,CAAC,EAAE,EAAE,eAAC,OAAA,MAAA,MAAA,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,KAAK,0CAAE,IAAI,mCAAI,EAAE,CAAA,EAAA,EAC1C,QAAQ,EAAE,KAAK,CAAC,QAAQ,GAC1B,EACF,uBAAC,yBAAW,IACR,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,aAAa,EAAE,CAAC,CAAC,EAAE,EAAE,WAAC,OAAA,cAAc,CAAC,MAAA,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,KAAK,mCAAI,IAAI,CAAC,CAAA,EAAA,EACtD,QAAQ,EAAE,KAAK,CAAC,QAAQ,GAC1B,EACF,uBAAC,yBAAW,IACR,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,aAAa,EAAE,CAAC,CAAC,EAAE,EAAE,eAAC,OAAA,MAAA,MAAA,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,GAAG,0CAAE,IAAI,mCAAI,EAAE,CAAA,EAAA,EACxC,QAAQ,EAAE,KAAK,CAAC,QAAQ,GAC1B,EACF,uBAAC,yBAAW,IACR,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,aAAa,EAAE,CAAC,CAAC,EAAE,EAAE,WAAC,OAAA,cAAc,CAAC,MAAA,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,GAAG,mCAAI,IAAI,CAAC,CAAA,EAAA,EACpD,QAAQ,EAAE,KAAK,CAAC,QAAQ,GAC1B,EACF,uBAAC,yBAAW,IACR,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oBACX,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC;gBACxC,CAAC,EACD,KAAK,EAAE,EAAC,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAC,EACrD,aAAa,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,EAChC,QAAQ,EAAE,KAAK,CAAC,QAAQ,GAC1B,EAEF,uBAAC,2BAAY,IACT,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,GAAG,EAAE;oBACV,OAAO,CAAC,KAAK,CAAC,CAAC;oBACf,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC;gBACjC,CAAC,EACD,QAAQ,EAAE,GAAG,EAAE;oBACX,UAAU,CAAC,GAAG,EAAE;wBACZ,aAAa,CAAC,OAAO,GAAG,KAAK,CAAC;oBAClC,CAAC,CAAC,CAAC;gBACP,CAAC,EACD,MAAM,EAAE,MAAM,EACd,KAAK,QACL,WAAW,QACX,cAAc,EAAE,KAAK,CAAC,cAAc,EACpC,UAAU,EAAE,KAAK,CAAC,UAAU,EAC5B,cAAc,EAAE,KAAK,CAAC,cAAc,EACpC,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,mBAAmB,EAAE,KAAK,CAAC,mBAAmB,EAC9C,iBAAiB,EAAE,KAAK,CAAC,iBAAiB,EAC1C,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,EACxC,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,UAAU,EAAE,KAAK,CAAC,UAAU,EAC5B,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,eAAe,EAAE,KAAK,CAAC,eAAe,EACtC,aAAa,EAAE,KAAK,CAAC,aAAa,GACpC,KACA,CACT,CAAC;AACN,CAAC;AAED,SAAS,cAAc,CAAC,KAAmB;IACvC,IAAI,CAAC,KAAK,EAAE,CAAC;QACT,OAAO,EAAE,CAAC;IACd,CAAC;IACD,IAAI,KAAK,CAAC,IAAI,KAAK,UAAU,EAAE,CAAC;QAC5B,OAAO,KAAK,CAAC,KAAK,CAAC;IACvB,CAAC;IACD,OAAO,KAAK,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC;AACrC,CAAC","sourcesContent":["'use client';\n\nimport React from 'react';\n\nimport {useControlledState, useFocusWithin, useMobile} from '@gravity-ui/uikit';\n\nimport {block} from '../../utils/cn';\nimport {HiddenInput} from '../HiddenInput/HiddenInput';\nimport type {Value} from '../RelativeDatePicker';\n\nimport {Control} from './components/Control/Control';\nimport {PickerDialog} from './components/PickerDialog/PickerDialog';\nimport {useRelativeRangeDatePickerState} from './hooks/useRelativeRangeDatePickerState';\nimport type {RelativeRangeDatePickerProps} from './types';\n\nimport './RelativeRangeDatePicker.scss';\n\nconst b = block('relative-range-date-picker');\n\nexport function RelativeRangeDatePicker(props: RelativeRangeDatePickerProps) {\n const state = useRelativeRangeDatePickerState(props);\n\n const isMobile = useMobile();\n\n const [anchor, setAnchor] = React.useState<HTMLDivElement \| null>(null);\n const dialogClosing = React.useRef(false);\n\n const [open, setOpen] = useControlledState<boolean>(undefined, false, props.onOpenChange);\n\n const {focusWithinProps} = useFocusWithin({\n isDisabled: props.disabled,\n onFocusWithin: props.onFocus,\n onBlurWithin: props.onBlur,\n onFocusWithinChange: (isFocusWithin) => {\n if (\n isFocusWithin &&\n !dialogClosing.current &&\n !props.renderControl &&\n document.activeElement?.tagName !== 'BUTTON'\n ) {\n setOpen(true);\n }\n },\n });\n\n return (\n <div\n ref={setAnchor}\n {...focusWithinProps}\n className={b(null, props.className)}\n style={props.style}\n >\n <Control\n props={props}\n state={state}\n open={open}\n setOpen={setOpen}\n isMobile={isMobile}\n onClick={() => {\n if (props.disabled) {\n return;\n }\n setOpen(true);\n }}\n onKeyDown={(e) => {\n if (props.disabled) {\n return;\n }\n if (e.altKey && (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')) {\n e.preventDefault();\n setOpen(true);\n }\n }}\n onClickCalendar={() => {\n setOpen(!open);\n }}\n onUpdate={(v: string) => {\n if (!props.readOnly && !v) {\n state.setValue(null, 'default');\n }\n }}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => v?.start?.type ?? ''}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => getNativeValue(v?.start ?? null)}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => v?.end?.type ?? ''}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => getNativeValue(v?.end ?? null)}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n onReset={(v) => {\n state.setValue(v.value, v.timeZone);\n }}\n value={{value: state.value, timeZone: state.timeZone}}\n toStringValue={(v) => v.timeZone}\n disabled={props.disabled}\n />\n\n <PickerDialog\n value={state.value}\n onUpdate={state.setValue}\n timeZone={state.timeZone}\n open={open}\n onClose={() => {\n setOpen(false);\n dialogClosing.current = true;\n }}\n onRemove={() => {\n setTimeout(() => {\n dialogClosing.current = false;\n });\n }}\n anchor={anchor}\n modal\n returnFocus\n popupClassName={props.popupClassName}\n popupStyle={props.popupStyle}\n popupPlacement={props.popupPlacement}\n popupOffset={props.popupOffset}\n isMobile={isMobile}\n size={props.size}\n format={props.format}\n readOnly={props.readOnly}\n minValue={props.minValue}\n maxValue={props.maxValue}\n allowNullableValues={props.allowNullableValues}\n isDateUnavailable={props.isDateUnavailable}\n placeholderValue={props.placeholderValue}\n withPresets={props.withPresets}\n presetTabs={props.presetTabs}\n docs={props.docs}\n withApplyButton={props.withApplyButton}\n withZonesList={props.withZonesList}\n />\n </div>\n );\n}\n\nfunction getNativeValue(value: Value \| null) {\n if (!value) {\n return '';\n }\n if (value.type === 'relative') {\n return value.value;\n }\n return value.value.toISOString();\n}\n"]}

package/dist/cjs/components/RelativeRangeDatePicker/components/Control/Control.d.ts CHANGED Viewed

@@ -6,10 +6,11 @@ export type ControlProps = {
     props: RelativeRangeDatePickerProps;
     state: RelativeRangeDatePickerState;
     open: boolean;
+    setOpen: (open: boolean) => void;
     isMobile?: boolean;
     onClick: (e: React.MouseEvent<HTMLElement>) => void;
     onKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;
-    onFocus: (e: React.FocusEvent<HTMLElement>) => void;
+    onFocus?: (e: React.FocusEvent<HTMLElement>) => void;
     onClickCalendar: (e: React.MouseEvent<HTMLElement>) => void;
     onUpdate: (value: string) => void;
 };

package/dist/cjs/components/RelativeRangeDatePicker/components/Control/Control.js CHANGED Viewed

@@ -12,7 +12,7 @@ const utils_1 = require("../../utils.js");
 const i18n_1 = require("./i18n/index.js");
 require("./Control.css");
 const b = (0, cn_1.block)('relative-range-date-picker-control');
-exports.Control = react_1.default.forwardRef(({ props, state, open, isMobile, onClick, onKeyDown, onFocus, onClickCalendar, onUpdate }, ref) => {
+exports.Control = react_1.default.forwardRef(({ props, state, open, setOpen, isMobile, onClick, onKeyDown, onFocus, onClickCalendar, onUpdate, }, ref) => {
     var _a;
     const { alwaysShowAsAbsolute, presetTabs, getRangeTitle } = props;
     const format = props.format || 'L';
@@ -48,8 +48,9 @@ exports.Control = react_1.default.forwardRef(({ props, state, open, isMobile, on
         validationState,
         errorMessage,
         open,
+        setOpen,
         triggerProps,
-    })) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(uikit_1.TextInput, { id: props.id, autoFocus: props.autoFocus, controlRef: ref, value: text, placeholder: props.placeholder, onUpdate: onUpdate, controlProps: Object.assign(Object.assign({ className: b('input', { mobile: isMobile }) }, triggerProps), { disabled: isMobile, onClick }), onKeyDown: onKeyDown, onFocus: onFocus, validationState: validationState, errorMessage: errorMessage, errorPlacement: props.errorPlacement, pin: props.pin, size: props.size, label: props.label, hasClear: props.hasClear, disabled: props.disabled, endContent: (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "flat-secondary", size: (0, getButtonSizeForInput_1.getButtonSizeForInput)(props.size), disabled: props.disabled, "aria-haspopup": "dialog", "aria-expanded": open, "aria-label": (0, i18n_1.i18n)('Range date picker'), onClick: onClickCalendar, children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.Calendar }) }) }), isMobile ? ((0, jsx_runtime_1.jsx)("button", { className: b('mobile-trigger', {
+    })) : ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(uikit_1.TextInput, { id: props.id, autoFocus: props.autoFocus, controlRef: ref, value: text, placeholder: props.placeholder, onUpdate: onUpdate, controlProps: Object.assign(Object.assign({ className: b('input', { mobile: isMobile }) }, triggerProps), { disabled: isMobile, onClick }), onKeyDown: onKeyDown, onFocus: onFocus, validationState: validationState, errorMessage: errorMessage, errorPlacement: props.errorPlacement, pin: props.pin, size: props.size, label: props.label, hasClear: props.hasClear, disabled: props.disabled, endContent: (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "flat-secondary", size: (0, getButtonSizeForInput_1.getButtonSizeForInput)(props.size), disabled: props.disabled, "aria-haspopup": "dialog", "aria-expanded": open, "aria-label": (0, i18n_1.i18n)('Range date picker'), onClick: onClickCalendar, tabIndex: -1, children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.Calendar }) }) }), isMobile ? ((0, jsx_runtime_1.jsx)("button", { className: b('mobile-trigger', {
                     'has-clear': Boolean(props.hasClear && state.value),
                     'has-errors': state.isInvalid && props.errorPlacement === 'inside',
                     size: props.size,

package/dist/cjs/components/RelativeRangeDatePicker/components/Control/Control.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Control.js","sourceRoot":"../../../../../../src","sources":["components/RelativeRangeDatePicker/components/Control/Control.tsx"],"names":[],"mappings":";;;;;AAAA,0DAA0B;AAE1B,6CAA2D;AAC3D,6CAA0D;AAE1D,gDAA2C;AAC3C,mFAA2E;AAG3E,0CAA4C;AAE5C,0CAA4B;AAE5B,yBAAwB;~~AAcxB~~,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,oCAAoC,CAAC,CAAC;AAEzC,QAAA,OAAO,GAAG,eAAK,CAAC,UAAU,CACnC,CACI,~~EAAC~~,KAAK,~~EAAE~~,KAAK,~~EAAE~~,IAAI,~~EAAE~~,QAAQ,~~EAAE~~,OAAO,~~EAAE~~,SAAS,~~EAAE~~,OAAO,~~EAAE~~,eAAe,~~EAAE~~,QAAQ,~~EAAC~~,~~EACtF~~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~~YAExB~~,uBAAC,YAAI,IAAC,IAAI,EAAE,gBAAY,GAAI,GACvB,GAEf,EACD,QAAQ,CAAC,CAAC,CAAC,CACR,mCACI,SAAS,EAAE,CAAC,CAAC,gBAAgB,EAAE;oBAC3B,WAAW,EAAE,OAAO,CAAC,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,KAAK,CAAC;oBACnD,YAAY,EAAE,KAAK,CAAC,SAAS,IAAI,KAAK,CAAC,cAAc,KAAK,QAAQ;oBAClE,IAAI,EAAE,KAAK,CAAC,IAAI;iBACnB,CAAC,EACF,OAAO,EAAE,OAAO,GAClB,CACL,CAAC,CAAC,CAAC,IAAI,IACK,CACpB,CAAC;AACN,CAAC,CACJ,CAAC;AAEF,eAAO,CAAC,WAAW,GAAG,SAAS,CAAC","sourcesContent":["import React from 'react';\n\nimport {Calendar as CalendarIcon} from '@gravity-ui/icons';\nimport {Button, Icon, TextInput} from '@gravity-ui/uikit';\n\nimport {block} from '../../../../utils/cn';\nimport {getButtonSizeForInput} from '../../../utils/getButtonSizeForInput';\nimport type {RelativeRangeDatePickerState} from '../../hooks/useRelativeRangeDatePickerState';\nimport type {RelativeRangeDatePickerProps, RelativeRangeDatePickerTriggerProps} from '../../types';\nimport {getDefaultTitle} from '../../utils';\n\nimport {i18n} from './i18n';\n\nimport './Control.scss';\n\nexport type ControlProps = {\n props: RelativeRangeDatePickerProps;\n state: RelativeRangeDatePickerState;\n open: boolean;\n isMobile?: boolean;\n onClick: (e: React.MouseEvent<HTMLElement>) => void;\n onKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n onFocus: (e: React.FocusEvent<HTMLElement>) => void;\n onClickCalendar: (e: React.MouseEvent<HTMLElement>) => void;\n onUpdate: (value: string) => void;\n};\n\nconst b = block('relative-range-date-picker-control');\n\nexport const Control = React.forwardRef<HTMLInputElement, ControlProps>(\n (\n {props, state, open, isMobile, onClick, onKeyDown, onFocus, onClickCalendar, onUpdate},\n ref,\n ) => {\n const {alwaysShowAsAbsolute, presetTabs, getRangeTitle} = props;\n const format = props.format \|\| 'L';\n\n const text = React.useMemo(\n () =>\n typeof getRangeTitle === 'function'\n ? getRangeTitle(state.value, state.timeZone)\n : getDefaultTitle({\n value: state.value,\n timeZone: state.timeZone,\n alwaysShowAsAbsolute,\n format,\n presets: presetTabs?.flatMap(({presets}) => presets),\n }),\n [alwaysShowAsAbsolute, format, getRangeTitle, presetTabs, state.timeZone, state.value],\n );\n\n const validationState = props.validationState \|\| (state.isInvalid ? 'invalid' : undefined);\n const errorMessage = props.errorMessage ?? state.errors.join('\\n');\n\n const triggerProps: RelativeRangeDatePickerTriggerProps = {\n id: props.id,\n role: 'combobox',\n 'aria-haspopup': 'dialog',\n 'aria-expanded': open,\n 'aria-label': props['aria-label'],\n 'aria-labelledby': props['aria-labelledby'],\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details'],\n disabled: props.disabled,\n readOnly: props.readOnly,\n onClick: onClickCalendar,\n onKeyDown,\n };\n\n return props.renderControl ? (\n props.renderControl({\n ref,\n value: state.value,\n title: text,\n validationState,\n errorMessage,\n open,\n triggerProps,\n })\n ) : (\n <React.Fragment>\n <TextInput\n id={props.id}\n autoFocus={props.autoFocus}\n controlRef={ref}\n value={text}\n placeholder={props.placeholder}\n onUpdate={onUpdate}\n controlProps={{\n className: b('input', {mobile: isMobile}),\n ...triggerProps,\n disabled: isMobile,\n onClick,\n }}\n onKeyDown={onKeyDown}\n onFocus={onFocus}\n validationState={validationState}\n errorMessage={errorMessage}\n errorPlacement={props.errorPlacement}\n pin={props.pin}\n size={props.size}\n label={props.label}\n hasClear={props.hasClear}\n disabled={props.disabled}\n endContent={\n <Button\n view=\"flat-secondary\"\n size={getButtonSizeForInput(props.size)}\n disabled={props.disabled}\n aria-haspopup=\"dialog\"\n aria-expanded={open}\n aria-label={i18n('Range date picker')}\n onClick={onClickCalendar}\n >\n <Icon data={CalendarIcon} />\n </Button>\n }\n />\n {isMobile ? (\n <button\n className={b('mobile-trigger', {\n 'has-clear': Boolean(props.hasClear && state.value),\n 'has-errors': state.isInvalid && props.errorPlacement === 'inside',\n size: props.size,\n })}\n onClick={onClick}\n />\n ) : null}\n </React.Fragment>\n );\n },\n);\n\nControl.displayName = 'Control';\n"]}
1	+ {"version":3,"file":"Control.js","sourceRoot":"../../../../../../src","sources":["components/RelativeRangeDatePicker/components/Control/Control.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {Calendar as CalendarIcon} from '@gravity-ui/icons';\nimport {Button, Icon, TextInput} from '@gravity-ui/uikit';\n\nimport {block} from '../../../../utils/cn';\nimport {getButtonSizeForInput} from '../../../utils/getButtonSizeForInput';\nimport type {RelativeRangeDatePickerState} from '../../hooks/useRelativeRangeDatePickerState';\nimport type {RelativeRangeDatePickerProps, RelativeRangeDatePickerTriggerProps} from '../../types';\nimport {getDefaultTitle} from '../../utils';\n\nimport {i18n} from './i18n';\n\nimport './Control.scss';\n\nexport type ControlProps = {\n props: RelativeRangeDatePickerProps;\n state: RelativeRangeDatePickerState;\n open: boolean;\n setOpen: (open: boolean) => void;\n isMobile?: boolean;\n onClick: (e: React.MouseEvent<HTMLElement>) => void;\n onKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n onFocus?: (e: React.FocusEvent<HTMLElement>) => void;\n onClickCalendar: (e: React.MouseEvent<HTMLElement>) => void;\n onUpdate: (value: string) => void;\n};\n\nconst b = block('relative-range-date-picker-control');\n\nexport const Control = React.forwardRef<HTMLInputElement, ControlProps>(\n (\n {\n props,\n state,\n open,\n setOpen,\n isMobile,\n onClick,\n onKeyDown,\n onFocus,\n onClickCalendar,\n onUpdate,\n },\n ref,\n ) => {\n const {alwaysShowAsAbsolute, presetTabs, getRangeTitle} = props;\n const format = props.format \|\| 'L';\n\n const text = React.useMemo(\n () =>\n typeof getRangeTitle === 'function'\n ? getRangeTitle(state.value, state.timeZone)\n : getDefaultTitle({\n value: state.value,\n timeZone: state.timeZone,\n alwaysShowAsAbsolute,\n format,\n presets: presetTabs?.flatMap(({presets}) => presets),\n }),\n [alwaysShowAsAbsolute, format, getRangeTitle, presetTabs, state.timeZone, state.value],\n );\n\n const validationState = props.validationState \|\| (state.isInvalid ? 'invalid' : undefined);\n const errorMessage = props.errorMessage ?? state.errors.join('\\n');\n\n const triggerProps: RelativeRangeDatePickerTriggerProps = {\n id: props.id,\n role: 'combobox',\n 'aria-haspopup': 'dialog',\n 'aria-expanded': open,\n 'aria-label': props['aria-label'],\n 'aria-labelledby': props['aria-labelledby'],\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details'],\n disabled: props.disabled,\n readOnly: props.readOnly,\n onClick: onClickCalendar,\n onKeyDown,\n };\n\n return props.renderControl ? (\n props.renderControl({\n ref,\n value: state.value,\n title: text,\n validationState,\n errorMessage,\n open,\n setOpen,\n triggerProps,\n })\n ) : (\n <React.Fragment>\n <TextInput\n id={props.id}\n autoFocus={props.autoFocus}\n controlRef={ref}\n value={text}\n placeholder={props.placeholder}\n onUpdate={onUpdate}\n controlProps={{\n className: b('input', {mobile: isMobile}),\n ...triggerProps,\n disabled: isMobile,\n onClick,\n }}\n onKeyDown={onKeyDown}\n onFocus={onFocus}\n validationState={validationState}\n errorMessage={errorMessage}\n errorPlacement={props.errorPlacement}\n pin={props.pin}\n size={props.size}\n label={props.label}\n hasClear={props.hasClear}\n disabled={props.disabled}\n endContent={\n <Button\n view=\"flat-secondary\"\n size={getButtonSizeForInput(props.size)}\n disabled={props.disabled}\n aria-haspopup=\"dialog\"\n aria-expanded={open}\n aria-label={i18n('Range date picker')}\n onClick={onClickCalendar}\n tabIndex={-1}\n >\n <Icon data={CalendarIcon} />\n </Button>\n }\n />\n {isMobile ? (\n <button\n className={b('mobile-trigger', {\n 'has-clear': Boolean(props.hasClear && state.value),\n 'has-errors': state.isInvalid && props.errorPlacement === 'inside',\n size: props.size,\n })}\n onClick={onClick}\n />\n ) : null}\n </React.Fragment>\n );\n },\n);\n\nControl.displayName = 'Control';\n"]}

package/dist/cjs/components/RelativeRangeDatePicker/components/PickerDialog/PickerDialog.d.ts CHANGED Viewed

@@ -9,9 +9,13 @@ export interface PickerDialogProps extends PickerFormProps, PopupStyleProps {
     open: boolean;
     /** Handles popup close event */
     onClose: (reason?: Parameters<NonNullable<PopupProps['onOpenChange']>>[2] | 'apply') => void;
+    /** Handles popup remove from DOM event */
+    onRemove?: () => void;
     /** If true `Popup` act like a modal dialog */
     modal?: boolean;
+    /** Element which focus should be returned to */
+    returnFocus?: PopupProps['returnFocus'];
     /** If true `Sheet` is used instead of `Popup`  */
     isMobile?: boolean;
 }
-export declare function PickerDialog({ open, onClose, isMobile, anchor, popupClassName, popupStyle, popupPlacement, popupOffset, modal, ...props }: PickerDialogProps): import("react/jsx-runtime").JSX.Element;
+export declare function PickerDialog({ open, onClose, isMobile, anchor, popupClassName, popupStyle, popupPlacement, popupOffset, modal, returnFocus, onRemove, ...props }: PickerDialogProps): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/RelativeRangeDatePicker/components/PickerDialog/PickerDialog.js CHANGED Viewed

@@ -10,10 +10,13 @@ const PickerForm_1 = require("./PickerForm.js");
 require("./PickerDialog.css");
 const b = (0, cn_1.block)('relative-range-date-picker-dialog');
 function PickerDialog(_a) {
-    var { open, onClose, isMobile, anchor, popupClassName, popupStyle, popupPlacement, popupOffset, modal } = _a, props = tslib_1.__rest(_a, ["open", "onClose", "isMobile", "anchor", "popupClassName", "popupStyle", "popupPlacement", "popupOffset", "modal"]);
+    var { open, onClose, isMobile, anchor, popupClassName, popupStyle, popupPlacement, popupOffset, modal, returnFocus = false, onRemove } = _a, props = tslib_1.__rest(_a, ["open", "onClose", "isMobile", "anchor", "popupClassName", "popupStyle", "popupPlacement", "popupOffset", "modal", "returnFocus", "onRemove"]);
     if (isMobile) {
         return ((0, jsx_runtime_1.jsx)(uikit_1.Sheet, { visible: open, onClose: () => {
                 onClose('outside-press');
+                setTimeout(() => {
+                    onRemove === null || onRemove === void 0 ? void 0 : onRemove();
+                });
             }, contentClassName: b('content', { mobile: true, size: 'xl' }, popupClassName), children: (0, jsx_runtime_1.jsx)(PickerForm_1.PickerForm, Object.assign({}, props, { size: "xl", onApply: () => {
                     onClose('apply');
                 } })) }));
@@ -22,7 +25,7 @@ function PickerDialog(_a) {
             if (!isOpen) {
                 onClose(reason);
             }
-        }, placement: popupPlacement, offset: popupOffset, role: "dialog", anchorElement: anchor, className: b('content', { size: props.size }, popupClassName), style: popupStyle, modal: modal, children: (0, jsx_runtime_1.jsx)(PickerForm_1.PickerForm, Object.assign({}, props, { onApply: () => {
+        }, placement: popupPlacement, offset: popupOffset, role: "dialog", anchorElement: anchor, className: b('content', { size: props.size }, popupClassName), style: popupStyle, modal: modal, returnFocus: returnFocus, onTransitionOutComplete: onRemove, children: (0, jsx_runtime_1.jsx)(PickerForm_1.PickerForm, Object.assign({}, props, { onApply: () => {
                 onClose('apply');
             } })) }));
 }

package/dist/cjs/components/RelativeRangeDatePicker/components/PickerDialog/PickerDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PickerDialog.js","sourceRoot":"../../../../../../src","sources":["components/RelativeRangeDatePicker/components/PickerDialog/PickerDialog.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;~~AA4Bb~~,~~oCAwDC~~;;;~~AAlFD~~,6CAA+C;AAG/C,gDAA2C;AAG3C,gDAAwC;AAGxC,8BAA6B;AAE7B,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,mCAAmC,CAAC,CAAC;~~AAerD~~,SAAgB,YAAY,CAAC,~~EAWT~~;~~QAXS~~,EACzB,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,MAAM,EACN,cAAc,EACd,UAAU,EACV,cAAc,EACd,WAAW,EACX,KAAK,~~OAEW~~,EADb,KAAK,~~sBAViB~~,~~mHAW5B~~,CADW;IAER,IAAI,QAAQ,EAAE,CAAC;QACX,OAAO,CACH,uBAAC,aAAK,IACF,OAAO,EAAE,IAAI,EACb,OAAO,EAAE,GAAG,EAAE;gBACV,OAAO,CAAC,eAAe,CAAC,CAAC;~~YAC7B~~,CAAC,EACD,gBAAgB,EAAE,CAAC,CAAC,SAAS,EAAE,EAAC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,EAAE,cAAc,CAAC,YAE1E,uBAAC,uBAAU,oBACH,KAAK,IACT,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,GAAG,EAAE;oBACV,OAAO,CAAC,OAAO,CAAC,CAAC;gBACrB,CAAC,IACH,GACE,CACX,CAAC;IACN,CAAC;IAED,OAAO,CACH,uBAAC,aAAK,IACF,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE;YACrC,IAAI,CAAC,MAAM,EAAE,CAAC;gBACV,OAAO,CAAC,MAAM,CAAC,CAAC;YACpB,CAAC;QACL,CAAC,EACD,SAAS,EAAE,cAAc,EACzB,MAAM,EAAE,WAAW,EACnB,IAAI,EAAC,QAAQ,EACb,aAAa,EAAE,MAAM,EACrB,SAAS,EAAE,CAAC,CAAC,SAAS,EAAE,EAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAC,EAAE,cAAc,CAAC,EAC3D,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE,KAAK,~~YAEZ~~,uBAAC,uBAAU,oBACH,KAAK,IACT,OAAO,EAAE,GAAG,EAAE;gBACV,OAAO,CAAC,OAAO,CAAC,CAAC;YACrB,CAAC,IACH,GACE,CACX,CAAC;AACN,CAAC","sourcesContent":["'use client';\n\nimport {Popup, Sheet} from '@gravity-ui/uikit';\nimport type {PopupProps} from '@gravity-ui/uikit';\n\nimport {block} from '../../../../utils/cn';\nimport type {PopupStyleProps} from '../../../types';\n\nimport {PickerForm} from './PickerForm';\nimport type {PickerFormProps} from './PickerForm';\n\nimport './PickerDialog.scss';\n\nconst b = block('relative-range-date-picker-dialog');\n\nexport interface PickerDialogProps extends PickerFormProps, PopupStyleProps {\n /** Popup anchor /\n anchor: HTMLElement \| null;\n /* Manages `Popup` visibility /\n open: boolean;\n /* Handles popup close event /\n onClose: (reason?: Parameters<NonNullable<PopupProps['onOpenChange']>>[2] \| 'apply') => void;\n /* If true `Popup` act like a modal dialog /\n modal?: boolean;\n /* If true `Sheet` is used instead of `Popup` */\n isMobile?: boolean;\n}\n\nexport function PickerDialog({\n open,\n onClose,\n isMobile,\n anchor,\n popupClassName,\n popupStyle,\n popupPlacement,\n popupOffset,\n modal,\n ...props\n}: PickerDialogProps) {\n if (isMobile) {\n return (\n <Sheet\n visible={open}\n onClose={() => {\n onClose('outside-press');\n }}\n contentClassName={b('content', {mobile: true, size: 'xl'}, popupClassName)}\n >\n <PickerForm\n {...props}\n size=\"xl\"\n onApply={() => {\n onClose('apply');\n }}\n />\n </Sheet>\n );\n }\n\n return (\n <Popup\n open={open}\n onOpenChange={(isOpen, _event, reason) => {\n if (!isOpen) {\n onClose(reason);\n }\n }}\n placement={popupPlacement}\n offset={popupOffset}\n role=\"dialog\"\n anchorElement={anchor}\n className={b('content', {size: props.size}, popupClassName)}\n style={popupStyle}\n modal={modal}\n >\n <PickerForm\n {...props}\n onApply={() => {\n onClose('apply');\n }}\n />\n </Popup>\n );\n}\n"]}
1	+ {"version":3,"file":"PickerDialog.js","sourceRoot":"../../../../../../src","sources":["components/RelativeRangeDatePicker/components/PickerDialog/PickerDialog.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;AAgCb,oCA+DC;;;AA7FD,6CAA+C;AAG/C,gDAA2C;AAG3C,gDAAwC;AAGxC,8BAA6B;AAE7B,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,mCAAmC,CAAC,CAAC;AAmBrD,SAAgB,YAAY,CAAC,EAaT;QAbS,EACzB,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,MAAM,EACN,cAAc,EACd,UAAU,EACV,cAAc,EACd,WAAW,EACX,KAAK,EACL,WAAW,GAAG,KAAK,EACnB,QAAQ,OAEQ,EADb,KAAK,sBAZiB,8IAa5B,CADW;IAER,IAAI,QAAQ,EAAE,CAAC;QACX,OAAO,CACH,uBAAC,aAAK,IACF,OAAO,EAAE,IAAI,EACb,OAAO,EAAE,GAAG,EAAE;gBACV,OAAO,CAAC,eAAe,CAAC,CAAC;gBACzB,UAAU,CAAC,GAAG,EAAE;oBACZ,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,EAAI,CAAC;gBACjB,CAAC,CAAC,CAAC;YACP,CAAC,EACD,gBAAgB,EAAE,CAAC,CAAC,SAAS,EAAE,EAAC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,EAAE,cAAc,CAAC,YAE1E,uBAAC,uBAAU,oBACH,KAAK,IACT,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,GAAG,EAAE;oBACV,OAAO,CAAC,OAAO,CAAC,CAAC;gBACrB,CAAC,IACH,GACE,CACX,CAAC;IACN,CAAC;IAED,OAAO,CACH,uBAAC,aAAK,IACF,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE;YACrC,IAAI,CAAC,MAAM,EAAE,CAAC;gBACV,OAAO,CAAC,MAAM,CAAC,CAAC;YACpB,CAAC;QACL,CAAC,EACD,SAAS,EAAE,cAAc,EACzB,MAAM,EAAE,WAAW,EACnB,IAAI,EAAC,QAAQ,EACb,aAAa,EAAE,MAAM,EACrB,SAAS,EAAE,CAAC,CAAC,SAAS,EAAE,EAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAC,EAAE,cAAc,CAAC,EAC3D,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,uBAAuB,EAAE,QAAQ,YAEjC,uBAAC,uBAAU,oBACH,KAAK,IACT,OAAO,EAAE,GAAG,EAAE;gBACV,OAAO,CAAC,OAAO,CAAC,CAAC;YACrB,CAAC,IACH,GACE,CACX,CAAC;AACN,CAAC","sourcesContent":["'use client';\n\nimport {Popup, Sheet} from '@gravity-ui/uikit';\nimport type {PopupProps} from '@gravity-ui/uikit';\n\nimport {block} from '../../../../utils/cn';\nimport type {PopupStyleProps} from '../../../types';\n\nimport {PickerForm} from './PickerForm';\nimport type {PickerFormProps} from './PickerForm';\n\nimport './PickerDialog.scss';\n\nconst b = block('relative-range-date-picker-dialog');\n\nexport interface PickerDialogProps extends PickerFormProps, PopupStyleProps {\n /** Popup anchor /\n anchor: HTMLElement \| null;\n /* Manages `Popup` visibility /\n open: boolean;\n /* Handles popup close event /\n onClose: (reason?: Parameters<NonNullable<PopupProps['onOpenChange']>>[2] \| 'apply') => void;\n /* Handles popup remove from DOM event /\n onRemove?: () => void;\n /* If true `Popup` act like a modal dialog /\n modal?: boolean;\n /* Element which focus should be returned to /\n returnFocus?: PopupProps['returnFocus'];\n /* If true `Sheet` is used instead of `Popup` */\n isMobile?: boolean;\n}\n\nexport function PickerDialog({\n open,\n onClose,\n isMobile,\n anchor,\n popupClassName,\n popupStyle,\n popupPlacement,\n popupOffset,\n modal,\n returnFocus = false,\n onRemove,\n ...props\n}: PickerDialogProps) {\n if (isMobile) {\n return (\n <Sheet\n visible={open}\n onClose={() => {\n onClose('outside-press');\n setTimeout(() => {\n onRemove?.();\n });\n }}\n contentClassName={b('content', {mobile: true, size: 'xl'}, popupClassName)}\n >\n <PickerForm\n {...props}\n size=\"xl\"\n onApply={() => {\n onClose('apply');\n }}\n />\n </Sheet>\n );\n }\n\n return (\n <Popup\n open={open}\n onOpenChange={(isOpen, _event, reason) => {\n if (!isOpen) {\n onClose(reason);\n }\n }}\n placement={popupPlacement}\n offset={popupOffset}\n role=\"dialog\"\n anchorElement={anchor}\n className={b('content', {size: props.size}, popupClassName)}\n style={popupStyle}\n modal={modal}\n returnFocus={returnFocus}\n onTransitionOutComplete={onRemove}\n >\n <PickerForm\n {...props}\n onApply={() => {\n onClose('apply');\n }}\n />\n </Popup>\n );\n}\n"]}

package/dist/cjs/components/RelativeRangeDatePicker/types.d.ts CHANGED Viewed

@@ -12,6 +12,7 @@ export interface RelativeRangeDatePickerRenderControlProps {
     errorMessage?: React.ReactNode;
     validationState?: 'invalid';
     open: boolean;
+    setOpen: (open: boolean) => void;
     triggerProps: RelativeRangeDatePickerTriggerProps;
 }
 export interface RelativeRangeDatePickerProps extends RelativeRangeDatePickerStateOptions, DomProps, AccessibilityProps, InputBase, InputDOMProps, TextInputProps, Validation, FocusableProps, StyleProps, PopupStyleProps {

package/dist/cjs/components/RelativeRangeDatePicker/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.js","sourceRoot":"../../../../src","sources":["components/RelativeRangeDatePicker/types.ts"],"names":[],"mappings":"","sourcesContent":["import type {DateTime} from '@gravity-ui/date-utils';\n\nimport type {Value} from '../RelativeDatePicker';\nimport type {\n AccessibilityProps,\n DomProps,\n FocusableProps,\n InputBase,\n InputDOMProps,\n PopupStyleProps,\n RangeValue,\n StyleProps,\n TextInputProps,\n Validation,\n} from '../types';\n\nimport type {Preset} from './components/Presets/defaultPresets';\nimport type {PresetTab} from './components/Presets/utils';\nimport type {\n RelativeRangeDatePickerStateOptions,\n RelativeRangeDatePickerValue,\n} from './hooks/useRelativeRangeDatePickerState';\n\nexport type RelativeRangeDatePickerTriggerProps = Pick<\n React.AllHTMLAttributes<HTMLElement>,\n \| 'id'\n \| 'role'\n \| 'aria-controls'\n \| 'aria-haspopup'\n \| 'aria-expanded'\n \| 'aria-label'\n \| 'aria-labelledby'\n \| 'aria-describedby'\n \| 'aria-details'\n \| 'onClick'\n \| 'onKeyDown'\n \| 'disabled'\n \| 'readOnly'\n>;\n\nexport interface RelativeRangeDatePickerRenderControlProps {\n ref: React.Ref<HTMLElement>;\n value: RelativeRangeDatePickerValue \| null;\n title: string;\n errorMessage?: React.ReactNode;\n validationState?: 'invalid';\n open: boolean;\n triggerProps: RelativeRangeDatePickerTriggerProps;\n}\n\nexport interface RelativeRangeDatePickerProps\n extends RelativeRangeDatePickerStateOptions,\n DomProps,\n AccessibilityProps,\n InputBase,\n InputDOMProps,\n TextInputProps,\n Validation,\n FocusableProps,\n StyleProps,\n PopupStyleProps {\n /** Format of the date when rendered in the input. [Available formats](https://day.js.org/docs/en/display/format) /\n format?: string;\n /* A placeholder date that controls the default values of each segment when the user first interacts with them. Defaults to today's date at midnight. /\n placeholderValue?: DateTime;\n /* Apply changes with button /\n withApplyButton?: boolean;\n /* Show time zone selector /\n withZonesList?: boolean;\n /* Show relative range presets /\n withPresets?: boolean;\n /* Custom preset tabs /\n presetTabs?: PresetTab[];\n /* Custom docs for presets, if empty array docs will be hidden /\n docs?: Preset[];\n /* Show selected relative values as absolute dates /\n alwaysShowAsAbsolute?: boolean;\n /* /\n getRangeTitle?: (value: RangeValue<Value \| null> \| null, timeZone: string) => string;\n /* Handler that is called when the popup's open state changes. /\n onOpenChange?: (open: boolean) => void;\n /* Used to render control. */\n renderControl?: (props: RelativeRangeDatePickerRenderControlProps) => React.ReactElement;\n}\n"]}
1	+ {"version":3,"file":"types.js","sourceRoot":"../../../../src","sources":["components/RelativeRangeDatePicker/types.ts"],"names":[],"mappings":"","sourcesContent":["import type {DateTime} from '@gravity-ui/date-utils';\n\nimport type {Value} from '../RelativeDatePicker';\nimport type {\n AccessibilityProps,\n DomProps,\n FocusableProps,\n InputBase,\n InputDOMProps,\n PopupStyleProps,\n RangeValue,\n StyleProps,\n TextInputProps,\n Validation,\n} from '../types';\n\nimport type {Preset} from './components/Presets/defaultPresets';\nimport type {PresetTab} from './components/Presets/utils';\nimport type {\n RelativeRangeDatePickerStateOptions,\n RelativeRangeDatePickerValue,\n} from './hooks/useRelativeRangeDatePickerState';\n\nexport type RelativeRangeDatePickerTriggerProps = Pick<\n React.AllHTMLAttributes<HTMLElement>,\n \| 'id'\n \| 'role'\n \| 'aria-controls'\n \| 'aria-haspopup'\n \| 'aria-expanded'\n \| 'aria-label'\n \| 'aria-labelledby'\n \| 'aria-describedby'\n \| 'aria-details'\n \| 'onClick'\n \| 'onKeyDown'\n \| 'disabled'\n \| 'readOnly'\n>;\n\nexport interface RelativeRangeDatePickerRenderControlProps {\n ref: React.Ref<HTMLElement>;\n value: RelativeRangeDatePickerValue \| null;\n title: string;\n errorMessage?: React.ReactNode;\n validationState?: 'invalid';\n open: boolean;\n setOpen: (open: boolean) => void;\n triggerProps: RelativeRangeDatePickerTriggerProps;\n}\n\nexport interface RelativeRangeDatePickerProps\n extends RelativeRangeDatePickerStateOptions,\n DomProps,\n AccessibilityProps,\n InputBase,\n InputDOMProps,\n TextInputProps,\n Validation,\n FocusableProps,\n StyleProps,\n PopupStyleProps {\n /** Format of the date when rendered in the input. [Available formats](https://day.js.org/docs/en/display/format) /\n format?: string;\n /* A placeholder date that controls the default values of each segment when the user first interacts with them. Defaults to today's date at midnight. /\n placeholderValue?: DateTime;\n /* Apply changes with button /\n withApplyButton?: boolean;\n /* Show time zone selector /\n withZonesList?: boolean;\n /* Show relative range presets /\n withPresets?: boolean;\n /* Custom preset tabs /\n presetTabs?: PresetTab[];\n /* Custom docs for presets, if empty array docs will be hidden /\n docs?: Preset[];\n /* Show selected relative values as absolute dates /\n alwaysShowAsAbsolute?: boolean;\n /* /\n getRangeTitle?: (value: RangeValue<Value \| null> \| null, timeZone: string) => string;\n /* Handler that is called when the popup's open state changes. /\n onOpenChange?: (open: boolean) => void;\n /* Used to render control. */\n renderControl?: (props: RelativeRangeDatePickerRenderControlProps) => React.ReactElement;\n}\n"]}

package/dist/esm/components/DatePicker/hooks/useDatePickerProps.js CHANGED Viewed

@@ -104,6 +104,7 @@ export function useDatePickerProps(state, _a) {
                     : state.dateFieldState.displayValue.start);
             },
             modal: !props.disableFocusTrap,
+            returnFocus: !props.disableFocusTrap,
             disablePortal: props.disablePortal,
             placement: props.popupPlacement,
             offset: props.popupOffset,

package/dist/esm/components/DatePicker/hooks/useDatePickerProps.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDatePickerProps.js","sourceRoot":"../../../../../src","sources":["components/DatePicker/hooks/useDatePickerProps.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {isDateTime} from '@gravity-ui/date-utils';\nimport type {DateTime} from '@gravity-ui/date-utils';\nimport {useFocusWithin, useForkRef} from '@gravity-ui/uikit';\nimport type {ButtonButtonProps, PopupProps, TextInputProps} from '@gravity-ui/uikit';\n\nimport type {CalendarInstance, CalendarProps} from '../../Calendar';\nimport {useDateFieldProps} from '../../DateField';\nimport type {DateFieldProps} from '../../DateField';\nimport type {RangeValue} from '../../types';\nimport {getButtonSizeForInput} from '../../utils/getButtonSizeForInput';\nimport {mergeProps} from '../../utils/mergeProps';\nimport type {DatePickerProps} from '../DatePicker';\nimport {i18n} from '../i18n';\nimport {getCalendarModes, getDateTimeValue} from '../utils';\n\nimport type {DatePickerState} from './useDatePickerState';\n\ninterface InnerDatePickerProps<T = DateTime> {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n groupProps: React.HTMLAttributes<unknown> & {ref: React.Ref<any>};\n fieldProps: TextInputProps;\n calendarButtonProps: ButtonButtonProps & {ref: React.Ref<HTMLButtonElement>};\n popupProps: PopupProps;\n calendarProps: CalendarProps<T> & {ref: React.Ref<CalendarInstance>};\n timeInputProps: DateFieldProps<T>;\n}\n\nexport function useDatePickerProps<T extends DateTime \| RangeValue<DateTime>>(\n state: DatePickerState<T>,\n {onFocus, onBlur, ...props}: DatePickerProps<T>,\n): InnerDatePickerProps<T> {\n const [isActive, setActive] = React.useState(false);\n\n const [focusedDate, setFocusedDate] = React.useState(\n isDateTime(state.dateFieldState.displayValue)\n ? state.dateFieldState.displayValue\n : state.dateFieldState.displayValue.start,\n );\n const [prevDateValue, setPrevDateValue] = React.useState<any>(\n state.dateFieldState.displayValue,\n );\n\n if (isDateTime(state.dateFieldState.displayValue)) {\n if (!state.dateFieldState.displayValue.isSame(prevDateValue, 'day')) {\n setPrevDateValue(state.dateFieldState.displayValue);\n setFocusedDate(state.dateFieldState.displayValue);\n }\n } else if (!state.dateFieldState.displayValue.start.isSame(prevDateValue.start, 'day')) {\n setPrevDateValue(state.dateFieldState.displayValue);\n setFocusedDate(state.dateFieldState.displayValue.start);\n } else if (!state.dateFieldState.displayValue.end.isSame(prevDateValue.end, 'day')) {\n setPrevDateValue(state.dateFieldState.displayValue);\n setFocusedDate(state.dateFieldState.displayValue.end);\n }\n\n const {focusWithinProps} = useFocusWithin({\n onFocusWithin: onFocus,\n onBlurWithin: onBlur,\n onFocusWithinChange(isFocusWithin) {\n setActive(isFocusWithin);\n if (!isFocusWithin) {\n state.setOpen(false, 'FocusOut');\n }\n },\n });\n\n const {inputProps} = useDateFieldProps(state.dateFieldState, props);\n\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n const handleRef = useForkRef(inputRef, inputProps.controlRef);\n\n const calendarRef = React.useRef<CalendarInstance>(null);\n const calendarButtonRef = React.useRef<HTMLButtonElement>(null);\n const groupRef = React.useRef<HTMLElement>(null);\n\n function focusInput() {\n setTimeout(() => {\n inputRef.current?.focus({preventScroll: true});\n });\n }\n\n const onlyTime = state.formatInfo.hasTime && !state.formatInfo.hasDate;\n const calendarModes = getCalendarModes(state.formatInfo);\n\n return {\n groupProps: {\n ref: groupRef,\n tabIndex: -1,\n role: 'group',\n ...focusWithinProps,\n style: props.style,\n 'aria-disabled': state.disabled \|\| undefined,\n onKeyDown: (e) => {\n if (!onlyTime && e.altKey && (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')) {\n e.preventDefault();\n e.stopPropagation();\n state.setOpen(true, 'ShortcutKeyDown');\n }\n },\n },\n fieldProps: mergeProps(\n inputProps,\n state.dateFieldState.isEmpty && !isActive && props.placeholder\n ? {value: ''}\n : undefined,\n {\n controlRef: handleRef,\n controlProps: {role: 'combobox', 'aria-expanded': state.isOpen},\n },\n ),\n calendarButtonProps: {\n ref: calendarButtonRef,\n size: getButtonSizeForInput(props.size),\n disabled: state.disabled,\n 'aria-label': i18n('Calendar'),\n 'aria-haspopup': 'dialog',\n 'aria-expanded': state.isOpen,\n view: 'flat-secondary',\n onClick: () => {\n setActive(true);\n state.setOpen(!state.isOpen, 'TriggerButtonClick');\n },\n },\n popupProps: {\n open: state.isOpen,\n onOpenChange: (open, e, reason) => {\n if (!open) {\n if (reason === 'escape-key') {\n state.setOpen(false, 'EscapeKeyDown');\n focusInput();\n } else if (reason === 'outside-press') {\n if (!e?.target \|\| !calendarButtonRef.current?.contains(e.target as Node)) {\n state.setOpen(false, 'ClickOutside');\n }\n\n if (e?.target && groupRef.current?.contains(e.target as Node)) {\n focusInput();\n }\n }\n }\n },\n onTransitionOutComplete: () => {\n setFocusedDate(\n isDateTime(state.dateFieldState.displayValue)\n ? state.dateFieldState.displayValue\n : state.dateFieldState.displayValue.start,\n );\n },\n modal: !props.disableFocusTrap,\n disablePortal: props.disablePortal,\n placement: props.popupPlacement,\n offset: props.popupOffset,\n className: props.popupClassName,\n style: props.popupStyle,\n },\n calendarProps: {\n ref: calendarRef,\n autoFocus: true,\n size: props.size === 's' ? 'm' : props.size,\n disabled: props.disabled,\n readOnly: props.readOnly,\n onUpdate: (d) => {\n state.setDateValue(d);\n if (!state.formatInfo.hasTime) {\n focusInput();\n }\n },\n value: state.dateFieldState.displayValue,\n minValue: props.minValue,\n maxValue: props.maxValue,\n isDateUnavailable: props.isDateUnavailable,\n timeZone: state.timeZone,\n focusedValue: focusedDate,\n onFocusUpdate: setFocusedDate,\n modes: calendarModes,\n },\n timeInputProps: {\n value: state.timeValue,\n placeholderValue: getDateTimeValue(state.dateFieldState.displayValue),\n onUpdate: state.setTimeValue,\n format: state.timeFormat,\n readOnly: state.readOnly,\n disabled: state.disabled,\n timeZone: state.timeZone,\n hasClear: props.hasClear,\n size: props.size,\n },\n };\n}\n"]}
1	+ {"version":3,"file":"useDatePickerProps.js","sourceRoot":"../../../../../src","sources":["components/DatePicker/hooks/useDatePickerProps.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {isDateTime} from '@gravity-ui/date-utils';\nimport type {DateTime} from '@gravity-ui/date-utils';\nimport {useFocusWithin, useForkRef} from '@gravity-ui/uikit';\nimport type {ButtonButtonProps, PopupProps, TextInputProps} from '@gravity-ui/uikit';\n\nimport type {CalendarInstance, CalendarProps} from '../../Calendar';\nimport {useDateFieldProps} from '../../DateField';\nimport type {DateFieldProps} from '../../DateField';\nimport type {RangeValue} from '../../types';\nimport {getButtonSizeForInput} from '../../utils/getButtonSizeForInput';\nimport {mergeProps} from '../../utils/mergeProps';\nimport type {DatePickerProps} from '../DatePicker';\nimport {i18n} from '../i18n';\nimport {getCalendarModes, getDateTimeValue} from '../utils';\n\nimport type {DatePickerState} from './useDatePickerState';\n\ninterface InnerDatePickerProps<T = DateTime> {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n groupProps: React.HTMLAttributes<unknown> & {ref: React.Ref<any>};\n fieldProps: TextInputProps;\n calendarButtonProps: ButtonButtonProps & {ref: React.Ref<HTMLButtonElement>};\n popupProps: PopupProps;\n calendarProps: CalendarProps<T> & {ref: React.Ref<CalendarInstance>};\n timeInputProps: DateFieldProps<T>;\n}\n\nexport function useDatePickerProps<T extends DateTime \| RangeValue<DateTime>>(\n state: DatePickerState<T>,\n {onFocus, onBlur, ...props}: DatePickerProps<T>,\n): InnerDatePickerProps<T> {\n const [isActive, setActive] = React.useState(false);\n\n const [focusedDate, setFocusedDate] = React.useState(\n isDateTime(state.dateFieldState.displayValue)\n ? state.dateFieldState.displayValue\n : state.dateFieldState.displayValue.start,\n );\n const [prevDateValue, setPrevDateValue] = React.useState<any>(\n state.dateFieldState.displayValue,\n );\n\n if (isDateTime(state.dateFieldState.displayValue)) {\n if (!state.dateFieldState.displayValue.isSame(prevDateValue, 'day')) {\n setPrevDateValue(state.dateFieldState.displayValue);\n setFocusedDate(state.dateFieldState.displayValue);\n }\n } else if (!state.dateFieldState.displayValue.start.isSame(prevDateValue.start, 'day')) {\n setPrevDateValue(state.dateFieldState.displayValue);\n setFocusedDate(state.dateFieldState.displayValue.start);\n } else if (!state.dateFieldState.displayValue.end.isSame(prevDateValue.end, 'day')) {\n setPrevDateValue(state.dateFieldState.displayValue);\n setFocusedDate(state.dateFieldState.displayValue.end);\n }\n\n const {focusWithinProps} = useFocusWithin({\n onFocusWithin: onFocus,\n onBlurWithin: onBlur,\n onFocusWithinChange(isFocusWithin) {\n setActive(isFocusWithin);\n if (!isFocusWithin) {\n state.setOpen(false, 'FocusOut');\n }\n },\n });\n\n const {inputProps} = useDateFieldProps(state.dateFieldState, props);\n\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n const handleRef = useForkRef(inputRef, inputProps.controlRef);\n\n const calendarRef = React.useRef<CalendarInstance>(null);\n const calendarButtonRef = React.useRef<HTMLButtonElement>(null);\n const groupRef = React.useRef<HTMLElement>(null);\n\n function focusInput() {\n setTimeout(() => {\n inputRef.current?.focus({preventScroll: true});\n });\n }\n\n const onlyTime = state.formatInfo.hasTime && !state.formatInfo.hasDate;\n const calendarModes = getCalendarModes(state.formatInfo);\n\n return {\n groupProps: {\n ref: groupRef,\n tabIndex: -1,\n role: 'group',\n ...focusWithinProps,\n style: props.style,\n 'aria-disabled': state.disabled \|\| undefined,\n onKeyDown: (e) => {\n if (!onlyTime && e.altKey && (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')) {\n e.preventDefault();\n e.stopPropagation();\n state.setOpen(true, 'ShortcutKeyDown');\n }\n },\n },\n fieldProps: mergeProps(\n inputProps,\n state.dateFieldState.isEmpty && !isActive && props.placeholder\n ? {value: ''}\n : undefined,\n {\n controlRef: handleRef,\n controlProps: {role: 'combobox', 'aria-expanded': state.isOpen},\n },\n ),\n calendarButtonProps: {\n ref: calendarButtonRef,\n size: getButtonSizeForInput(props.size),\n disabled: state.disabled,\n 'aria-label': i18n('Calendar'),\n 'aria-haspopup': 'dialog',\n 'aria-expanded': state.isOpen,\n view: 'flat-secondary',\n onClick: () => {\n setActive(true);\n state.setOpen(!state.isOpen, 'TriggerButtonClick');\n },\n },\n popupProps: {\n open: state.isOpen,\n onOpenChange: (open, e, reason) => {\n if (!open) {\n if (reason === 'escape-key') {\n state.setOpen(false, 'EscapeKeyDown');\n focusInput();\n } else if (reason === 'outside-press') {\n if (!e?.target \|\| !calendarButtonRef.current?.contains(e.target as Node)) {\n state.setOpen(false, 'ClickOutside');\n }\n\n if (e?.target && groupRef.current?.contains(e.target as Node)) {\n focusInput();\n }\n }\n }\n },\n onTransitionOutComplete: () => {\n setFocusedDate(\n isDateTime(state.dateFieldState.displayValue)\n ? state.dateFieldState.displayValue\n : state.dateFieldState.displayValue.start,\n );\n },\n modal: !props.disableFocusTrap,\n returnFocus: !props.disableFocusTrap,\n disablePortal: props.disablePortal,\n placement: props.popupPlacement,\n offset: props.popupOffset,\n className: props.popupClassName,\n style: props.popupStyle,\n },\n calendarProps: {\n ref: calendarRef,\n autoFocus: true,\n size: props.size === 's' ? 'm' : props.size,\n disabled: props.disabled,\n readOnly: props.readOnly,\n onUpdate: (d) => {\n state.setDateValue(d);\n if (!state.formatInfo.hasTime) {\n focusInput();\n }\n },\n value: state.dateFieldState.displayValue,\n minValue: props.minValue,\n maxValue: props.maxValue,\n isDateUnavailable: props.isDateUnavailable,\n timeZone: state.timeZone,\n focusedValue: focusedDate,\n onFocusUpdate: setFocusedDate,\n modes: calendarModes,\n },\n timeInputProps: {\n value: state.timeValue,\n placeholderValue: getDateTimeValue(state.dateFieldState.displayValue),\n onUpdate: state.setTimeValue,\n format: state.timeFormat,\n readOnly: state.readOnly,\n disabled: state.disabled,\n timeZone: state.timeZone,\n hasClear: props.hasClear,\n size: props.size,\n },\n };\n}\n"]}

package/dist/esm/components/RelativeDateField/RelativeDateField.js CHANGED Viewed

@@ -16,9 +16,12 @@ export function RelativeDateField(props) {
     const isMobile = useMobile();
     const [anchor, setAnchor] = React.useState(null);
     const [isOpen, setOpen] = React.useState(false);
+    const dialogClosing = React.useRef(false);
     const { focusWithinProps } = useFocusWithin({
         onFocusWithinChange: (isFocusWithin) => {
-            setOpen(isFocusWithin);
+            if (!dialogClosing.current) {
+                setOpen(isFocusWithin);
+            }
         },
         isDisabled: isMobile,
     });
@@ -32,12 +35,19 @@ export function RelativeDateField(props) {
                         e.stopPropagation();
                         setOpen(true);
                     }
-                } })), _jsx(HiddenInput, { name: props.name, value: state.value, onReset: (value) => {
+                }, controlProps: Object.assign(Object.assign({}, inputProps.controlProps), { onClick: () => {
+                        setOpen(true);
+                    } }) })), _jsx(HiddenInput, { name: props.name, value: state.value, onReset: (value) => {
                     state.setValue(value);
-                }, disabled: state.disabled, form: props.form }), !isMobile && (_jsx(Popup, { anchorElement: anchor, open: isOpen, onOpenChange: (_open, _event, reason) => {
-                    if (reason === 'escape-key') {
+                }, disabled: state.disabled, form: props.form }), !isMobile && (_jsx(Popup, { anchorElement: anchor, open: isOpen, onOpenChange: (open) => {
+                    if (!open) {
                         setOpen(false);
                     }
+                    dialogClosing.current = !open;
+                }, onTransitionOutComplete: () => {
+                    setTimeout(() => {
+                        dialogClosing.current = false;
+                    });
                 }, placement: props.popupPlacement, offset: props.popupOffset, className: props.popupClassName, style: props.popupStyle, children: _jsxs("div", { className: b('popup-content'), children: [_jsx(Calendar, Object.assign({}, calendarProps)), props.hasTime ? (_jsx("div", { className: b('time-field-wrapper'), children: _jsx(DateField, Object.assign({ className: b('time-field') }, timeInputProps)) })) : null] }) }))] })));
 }
 //# sourceMappingURL=RelativeDateField.js.map

package/dist/esm/components/RelativeDateField/RelativeDateField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RelativeDateField.js","sourceRoot":"../../../../src","sources":["components/RelativeDateField/RelativeDateField.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,SAAS,EAAC,MAAM,mBAAmB,CAAC;AAE9E,OAAO,EAAC,KAAK,EAAC,0BAAuB;AACrC,OAAO,EAAC,QAAQ,EAAC,6BAAoB;AACrC,OAAO,EAAC,SAAS,EAAC,8BAAqB;AACvC,OAAO,EAAC,WAAW,EAAC,sCAAmC;AAavD,OAAO,EAAC,yBAAyB,EAAC,6CAA0C;AAC5E,OAAO,EAAC,yBAAyB,EAAC,6CAA0C;AAG5E,iCAAkC;AAElC,MAAM,CAAC,GAAG,KAAK,CAAC,qBAAqB,CAAC,CAAC;AAmBvC,MAAM,UAAU,iBAAiB,CAAC,KAA6B;IAC3D,MAAM,KAAK,GAAG,yBAAyB,CAAC,KAAK,CAAC,CAAC;IAC/C,MAAM,EAAC,UAAU,EAAE,aAAa,EAAE,cAAc,EAAC,GAAG,yBAAyB,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;IAE5F,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAE7B,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAqB,IAAI,CAAC,CAAC;IAErE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;~~IAEhD~~,MAAM,EAAC,gBAAgB,EAAC,GAAG,cAAc,CAAC;QACtC,mBAAmB,EAAE,CAAC,aAAa,EAAE,EAAE;YACnC,OAAO,CAAC,aAAa,CAAC,CAAC;~~QAC3B~~,CAAC;QACD,UAAU,EAAE,QAAQ;KACvB,CAAC,CAAC;IAEH,OAAO,CACH,6BACI,IAAI,EAAC,OAAO,EACZ,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC,EACnC,KAAK,EAAE,KAAK,CAAC,KAAK,IACd,gBAAgB,eAEpB,KAAC,SAAS,oBACF,UAAU,IACd,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,EACrB,GAAG,EAAE,SAAS,EACd,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;;oBACb,MAAA,UAAU,CAAC,SAAS,2DAAG,CAAC,CAAC,CAAC;oBAC1B,IACI,CAAC,CAAC,CAAC,gBAAgB;wBACnB,CAAC,CAAC,MAAM;wBACR,CAAC,CAAC,CAAC,GAAG,KAAK,WAAW,IAAI,CAAC,CAAC,GAAG,KAAK,SAAS,CAAC,EAChD,CAAC;wBACC,CAAC,CAAC,cAAc,EAAE,CAAC;wBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;wBACpB,OAAO,CAAC,IAAI,CAAC,CAAC;oBAClB,CAAC;gBACL,CAAC,~~IACH~~,EACF,KAAC,WAAW,IACR,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE;oBACf,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;gBAC1B,CAAC,EACD,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,IAAI,EAAE,KAAK,CAAC,IAAI,GAClB,EACD,CAAC,QAAQ,IAAI,CACV,KAAC,KAAK,IACF,aAAa,EAAE,MAAM,EACrB,IAAI,EAAE,MAAM,EACZ,YAAY,EAAE,CAAC,~~KAAK~~,EAAE,~~MAAM,~~EAAE,~~MAAM~~,EAAE,~~EAAE~~;~~oBACpC~~,~~IAAI~~,~~MAAM~~,KAAK,~~YAAY~~,~~EAAE~~,CAAC;~~wBAC1B~~,OAAO,CAAC,~~KAAK~~,CAAC,CAAC;~~oBACnB~~,CAAC;~~gBACL~~,CAAC,EACD,SAAS,EAAE,KAAK,CAAC,cAAc,EAC/B,MAAM,EAAE,KAAK,CAAC,WAAW,EACzB,SAAS,EAAE,KAAK,CAAC,cAAc,EAC/B,KAAK,EAAE,KAAK,CAAC,UAAU,YAEvB,eAAK,SAAS,EAAE,CAAC,CAAC,eAAe,CAAC,aAC9B,KAAC,QAAQ,oBAAK,aAAa,EAAI,EAC9B,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CACb,cAAK,SAAS,EAAE,CAAC,CAAC,oBAAoB,CAAC,YACnC,KAAC,SAAS,kBAAC,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,IAAM,cAAc,EAAI,GAC3D,CACT,CAAC,CAAC,CAAC,IAAI,IACN,GACF,CACX,KACC,CACT,CAAC;AACN,CAAC","sourcesContent":["'use client';\n\nimport React from 'react';\n\nimport {Popup, TextInput, useFocusWithin, useMobile} from '@gravity-ui/uikit';\n\nimport {block} from '../../utils/cn';\nimport {Calendar} from '../Calendar';\nimport {DateField} from '../DateField';\nimport {HiddenInput} from '../HiddenInput/HiddenInput';\nimport type {\n AccessibilityProps,\n DomProps,\n FocusableProps,\n InputDOMProps,\n KeyboardEvents,\n PopupStyleProps,\n StyleProps,\n TextInputExtendProps,\n TextInputProps,\n} from '../types';\n\nimport {useRelativeDateFieldProps} from './hooks/useRelativeDateFieldProps';\nimport {useRelativeDateFieldState} from './hooks/useRelativeDateFieldState';\nimport type {RelativeDateFieldOptions} from './hooks/useRelativeDateFieldState';\n\nimport './RelativeDateField.scss';\n\nconst b = block('relative-date-field');\n\nexport interface RelativeDateFieldProps\n extends RelativeDateFieldOptions,\n TextInputProps,\n TextInputExtendProps,\n DomProps,\n InputDOMProps,\n StyleProps,\n AccessibilityProps,\n FocusableProps,\n KeyboardEvents,\n PopupStyleProps {\n /*\n Show time field in popup\n * @default false\n */\n hasTime?: boolean;\n}\nexport function RelativeDateField(props: RelativeDateFieldProps) {\n const state = useRelativeDateFieldState(props);\n const {inputProps, calendarProps, timeInputProps} = useRelativeDateFieldProps(state, props);\n\n const isMobile = useMobile();\n\n const [anchor, setAnchor] = React.useState<HTMLElement \| null>(null);\n\n const [isOpen, setOpen] = React.useState(false);\n\n const {focusWithinProps} = useFocusWithin({\n onFocusWithinChange: (isFocusWithin) => {\n setOpen(isFocusWithin);\n },\n isDisabled: isMobile,\n });\n\n return (\n <div\n role=\"group\"\n className={b(null, props.className)}\n style={props.style}\n {...focusWithinProps}\n >\n <TextInput\n {...inputProps}\n className={b('field')}\n ref={setAnchor}\n onBlur={props.onBlur}\n onKeyDown={(e) => {\n inputProps.onKeyDown?.(e);\n if (\n !e.defaultPrevented &&\n e.altKey &&\n (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')\n ) {\n e.preventDefault();\n e.stopPropagation();\n setOpen(true);\n }\n }}\n />\n <HiddenInput\n name={props.name}\n value={state.value}\n onReset={(value) => {\n state.setValue(value);\n }}\n disabled={state.disabled}\n form={props.form}\n />\n {!isMobile && (\n <Popup\n anchorElement={anchor}\n open={isOpen}\n onOpenChange={(~~_open, _event, reason~~) => {\n if (~~reason === 'escape-key'~~) {\n setOpen(false);\n }\n }}\n placement={props.popupPlacement}\n offset={props.popupOffset}\n className={props.popupClassName}\n style={props.popupStyle}\n >\n <div className={b('popup-content')}>\n <Calendar {...calendarProps} />\n {props.hasTime ? (\n <div className={b('time-field-wrapper')}>\n <DateField className={b('time-field')} {...timeInputProps} />\n </div>\n ) : null}\n </div>\n </Popup>\n )}\n </div>\n );\n}\n"]}
1	+ {"version":3,"file":"RelativeDateField.js","sourceRoot":"../../../../src","sources":["components/RelativeDateField/RelativeDateField.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport React from 'react';\n\nimport {Popup, TextInput, useFocusWithin, useMobile} from '@gravity-ui/uikit';\n\nimport {block} from '../../utils/cn';\nimport {Calendar} from '../Calendar';\nimport {DateField} from '../DateField';\nimport {HiddenInput} from '../HiddenInput/HiddenInput';\nimport type {\n AccessibilityProps,\n DomProps,\n FocusableProps,\n InputDOMProps,\n KeyboardEvents,\n PopupStyleProps,\n StyleProps,\n TextInputExtendProps,\n TextInputProps,\n} from '../types';\n\nimport {useRelativeDateFieldProps} from './hooks/useRelativeDateFieldProps';\nimport {useRelativeDateFieldState} from './hooks/useRelativeDateFieldState';\nimport type {RelativeDateFieldOptions} from './hooks/useRelativeDateFieldState';\n\nimport './RelativeDateField.scss';\n\nconst b = block('relative-date-field');\n\nexport interface RelativeDateFieldProps\n extends RelativeDateFieldOptions,\n TextInputProps,\n TextInputExtendProps,\n DomProps,\n InputDOMProps,\n StyleProps,\n AccessibilityProps,\n FocusableProps,\n KeyboardEvents,\n PopupStyleProps {\n /*\n Show time field in popup\n * @default false\n */\n hasTime?: boolean;\n}\nexport function RelativeDateField(props: RelativeDateFieldProps) {\n const state = useRelativeDateFieldState(props);\n const {inputProps, calendarProps, timeInputProps} = useRelativeDateFieldProps(state, props);\n\n const isMobile = useMobile();\n\n const [anchor, setAnchor] = React.useState<HTMLElement \| null>(null);\n\n const [isOpen, setOpen] = React.useState(false);\n const dialogClosing = React.useRef(false);\n\n const {focusWithinProps} = useFocusWithin({\n onFocusWithinChange: (isFocusWithin) => {\n if (!dialogClosing.current) {\n setOpen(isFocusWithin);\n }\n },\n isDisabled: isMobile,\n });\n\n return (\n <div\n role=\"group\"\n className={b(null, props.className)}\n style={props.style}\n {...focusWithinProps}\n >\n <TextInput\n {...inputProps}\n className={b('field')}\n ref={setAnchor}\n onBlur={props.onBlur}\n onKeyDown={(e) => {\n inputProps.onKeyDown?.(e);\n if (\n !e.defaultPrevented &&\n e.altKey &&\n (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')\n ) {\n e.preventDefault();\n e.stopPropagation();\n setOpen(true);\n }\n }}\n controlProps={{\n ...inputProps.controlProps,\n onClick: () => {\n setOpen(true);\n },\n }}\n />\n <HiddenInput\n name={props.name}\n value={state.value}\n onReset={(value) => {\n state.setValue(value);\n }}\n disabled={state.disabled}\n form={props.form}\n />\n {!isMobile && (\n <Popup\n anchorElement={anchor}\n open={isOpen}\n onOpenChange={(open) => {\n if (!open) {\n setOpen(false);\n }\n dialogClosing.current = !open;\n }}\n onTransitionOutComplete={() => {\n setTimeout(() => {\n dialogClosing.current = false;\n });\n }}\n placement={props.popupPlacement}\n offset={props.popupOffset}\n className={props.popupClassName}\n style={props.popupStyle}\n >\n <div className={b('popup-content')}>\n <Calendar {...calendarProps} />\n {props.hasTime ? (\n <div className={b('time-field-wrapper')}>\n <DateField className={b('time-field')} {...timeInputProps} />\n </div>\n ) : null}\n </div>\n </Popup>\n )}\n </div>\n );\n}\n"]}

package/dist/esm/components/RelativeDatePicker/hooks/useRelativeDatePickerProps.js CHANGED Viewed

@@ -157,6 +157,7 @@ export function useRelativeDatePickerProps(state, _a) {
             offset: props.popupOffset,
             className: props.popupClassName,
             style: props.popupStyle,
+            returnFocus: false,
         },
         calendarProps: {
             ref: calendarRef,

package/dist/esm/components/RelativeDatePicker/hooks/useRelativeDatePickerProps.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useRelativeDatePickerProps.js","sourceRoot":"../../../../../src","sources":["components/RelativeDatePicker/hooks/useRelativeDatePickerProps.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {useControlledState, useFocusWithin, useForkRef} from '@gravity-ui/uikit';\nimport type {ButtonButtonProps, PopupProps, TextInputProps} from '@gravity-ui/uikit';\n\nimport type {Calendar, CalendarInstance} from '../../Calendar';\nimport {useDateFieldProps} from '../../DateField';\nimport type {DateFieldProps} from '../../DateField';\nimport {getCalendarModes} from '../../DatePicker/utils';\nimport {useRelativeDateFieldProps} from '../../RelativeDateField';\nimport {getButtonSizeForInput} from '../../utils/getButtonSizeForInput';\nimport {mergeProps} from '../../utils/mergeProps';\nimport type {RelativeDatePickerProps} from '../RelativeDatePicker';\nimport {i18n} from '../i18n';\n\nimport type {RelativeDatePickerState} from './useRelativeDatePickerState';\n\ninterface InnerRelativeDatePickerProps {\n groupProps: React.HTMLAttributes<unknown> & {ref: React.Ref<HTMLElement>};\n fieldProps: TextInputProps;\n modeSwitcherProps: ButtonButtonProps;\n calendarButtonProps: ButtonButtonProps;\n popupProps: PopupProps;\n calendarProps: React.ComponentProps<typeof Calendar>;\n timeInputProps: DateFieldProps;\n}\n\nexport function useRelativeDatePickerProps(\n state: RelativeDatePickerState,\n {onFocus, onBlur, ...props}: RelativeDatePickerProps,\n): InnerRelativeDatePickerProps {\n const {mode, setMode, datePickerState, relativeDateState} = state;\n\n const [focusedDate, setFocusedDate] = React.useState(\n mode === 'relative'\n ? relativeDateState.lastCorrectDate\n : datePickerState.dateFieldState.displayValue,\n );\n\n const [prevCorrectDate, setPrevCorrectDate] = React.useState(relativeDateState.lastCorrectDate);\n if (prevCorrectDate !== relativeDateState.lastCorrectDate) {\n setPrevCorrectDate(relativeDateState.lastCorrectDate);\n setFocusedDate(relativeDateState.lastCorrectDate);\n }\n\n const [prevDateValue, setPrevDateValue] = React.useState(\n datePickerState.dateFieldState.displayValue,\n );\n if (!datePickerState.dateFieldState.displayValue.isSame(prevDateValue, 'day')) {\n setPrevDateValue(datePickerState.dateFieldState.displayValue);\n setFocusedDate(datePickerState.dateFieldState.displayValue);\n }\n const {focusWithinProps} = useFocusWithin({\n onFocusWithin: onFocus,\n onBlurWithin: onBlur,\n onFocusWithinChange(isFocusWithin) {\n if (!isFocusWithin) {\n state.setActive(false);\n }\n },\n });\n\n const [isOpen, setOpen] = useControlledState<boolean>(undefined, false, props.onOpenChange);\n if (!state.isActive && isOpen) {\n setOpen(false);\n }\n\n const commonInputProps: TextInputProps = {\n onFocus: () => {\n if (!state.isActive) {\n state.setActive(true);\n setOpen(true);\n }\n },\n errorMessage: props.errorMessage,\n errorPlacement: props.errorPlacement,\n controlProps: {\n onClick: () => {\n if (state.disabled) {\n return;\n }\n if (!isOpen) {\n state.setActive(true);\n setOpen(true);\n }\n },\n role: 'combobox',\n 'aria-expanded': isOpen,\n },\n };\n\n const {inputProps} = useDateFieldProps(datePickerState.dateFieldState, {\n ...props,\n value: undefined,\n defaultValue: undefined,\n onUpdate: undefined,\n });\n\n const {inputProps: relativeDateProps} = useRelativeDateFieldProps(relativeDateState, {\n ...props,\n value: undefined,\n defaultValue: undefined,\n onUpdate: undefined,\n });\n\n let validationState = props.validationState;\n if (!validationState) {\n validationState =\n mode === 'relative'\n ? relativeDateState.validationState\n : datePickerState.dateFieldState.validationState;\n }\n\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n const handleRef = useForkRef(\n inputRef,\n mode === 'relative' ? relativeDateProps.controlRef : inputProps.controlRef,\n );\n\n const calendarRef = React.useRef<CalendarInstance>(null);\n\n function focusCalendar() {\n setTimeout(() => {\n calendarRef.current?.focus();\n });\n }\n\n function focusInput() {\n setTimeout(() => {\n inputRef.current?.focus({preventScroll: true});\n });\n }\n const groupRef = React.useRef<HTMLElement>(null);\n const calendarModes = getCalendarModes(datePickerState.formatInfo);\n\n return {\n groupProps: {\n ref: groupRef,\n tabIndex: -1,\n role: 'group',\n ...focusWithinProps,\n onKeyDown: (e) => {\n if (e.altKey && (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')) {\n e.preventDefault();\n e.stopPropagation();\n setOpen(true);\n focusCalendar();\n }\n },\n },\n fieldProps: mergeProps(\n commonInputProps,\n mode === 'relative' ? relativeDateProps : inputProps,\n mode === 'absolute' &&\n datePickerState.dateFieldState.isEmpty &&\n !state.isActive &&\n props.placeholder\n ? {value: ''}\n : undefined,\n {controlRef: handleRef, validationState},\n ),\n modeSwitcherProps: {\n size: getButtonSizeForInput(props.size),\n disabled: state.readOnly \|\| state.disabled,\n view: 'flat-secondary',\n style: {zIndex: 2, marginInlineEnd: 2},\n selected: mode === 'relative',\n 'aria-label': i18n('Formula input mode'),\n onClick: () => {\n setMode(mode === 'relative' ? 'absolute' : 'relative');\n if (mode === 'relative') {\n const valueDate = datePickerState.value;\n if (valueDate) {\n setFocusedDate(valueDate);\n }\n } else if (relativeDateState.parsedDate) {\n setFocusedDate(relativeDateState.parsedDate);\n }\n focusInput();\n },\n },\n calendarButtonProps: {\n size: getButtonSizeForInput(props.size),\n disabled: state.disabled,\n 'aria-label': i18n('Calendar'),\n 'aria-haspopup': 'dialog',\n 'aria-expanded': isOpen,\n view: 'flat-secondary',\n onClick: () => {\n state.setActive(true);\n setOpen(!isOpen);\n if (!isOpen) {\n focusCalendar();\n }\n },\n },\n popupProps: {\n open: isOpen,\n onEscapeKeyDown: () => {\n setOpen(false);\n focusInput();\n },\n onOutsideClick: (e) => {\n if (e.target && !groupRef.current?.contains(e.target as Node)) {\n setOpen(false);\n }\n },\n onTransitionOutComplete: () => {\n setFocusedDate(\n mode === 'relative'\n ? relativeDateState.lastCorrectDate\n : datePickerState.dateFieldState.displayValue,\n );\n },\n placement: props.popupPlacement,\n offset: props.popupOffset,\n className: props.popupClassName,\n style: props.popupStyle,\n },\n calendarProps: {\n ref: calendarRef,\n size: props.size === 's' ? 'm' : props.size,\n readOnly: props.readOnly,\n value: state.selectedDate,\n onUpdate: (v) => {\n datePickerState.setDateValue(v);\n if (!state.datePickerState.formatInfo.hasTime) {\n setOpen(false);\n focusInput();\n }\n },\n focusedValue: focusedDate,\n onFocusUpdate: setFocusedDate,\n minValue: props.minValue,\n maxValue: props.maxValue,\n modes: mode === 'absolute' ? calendarModes : undefined,\n },\n timeInputProps: {\n value: datePickerState.timeValue,\n onUpdate: datePickerState.setTimeValue,\n format: datePickerState.timeFormat,\n readOnly: state.readOnly,\n disabled: state.disabled,\n timeZone: props.timeZone,\n hasClear: props.hasClear,\n size: props.size,\n },\n };\n}\n"]}
1	+ {"version":3,"file":"useRelativeDatePickerProps.js","sourceRoot":"../../../../../src","sources":["components/RelativeDatePicker/hooks/useRelativeDatePickerProps.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {useControlledState, useFocusWithin, useForkRef} from '@gravity-ui/uikit';\nimport type {ButtonButtonProps, PopupProps, TextInputProps} from '@gravity-ui/uikit';\n\nimport type {Calendar, CalendarInstance} from '../../Calendar';\nimport {useDateFieldProps} from '../../DateField';\nimport type {DateFieldProps} from '../../DateField';\nimport {getCalendarModes} from '../../DatePicker/utils';\nimport {useRelativeDateFieldProps} from '../../RelativeDateField';\nimport {getButtonSizeForInput} from '../../utils/getButtonSizeForInput';\nimport {mergeProps} from '../../utils/mergeProps';\nimport type {RelativeDatePickerProps} from '../RelativeDatePicker';\nimport {i18n} from '../i18n';\n\nimport type {RelativeDatePickerState} from './useRelativeDatePickerState';\n\ninterface InnerRelativeDatePickerProps {\n groupProps: React.HTMLAttributes<unknown> & {ref: React.Ref<HTMLElement>};\n fieldProps: TextInputProps;\n modeSwitcherProps: ButtonButtonProps;\n calendarButtonProps: ButtonButtonProps;\n popupProps: PopupProps;\n calendarProps: React.ComponentProps<typeof Calendar>;\n timeInputProps: DateFieldProps;\n}\n\nexport function useRelativeDatePickerProps(\n state: RelativeDatePickerState,\n {onFocus, onBlur, ...props}: RelativeDatePickerProps,\n): InnerRelativeDatePickerProps {\n const {mode, setMode, datePickerState, relativeDateState} = state;\n\n const [focusedDate, setFocusedDate] = React.useState(\n mode === 'relative'\n ? relativeDateState.lastCorrectDate\n : datePickerState.dateFieldState.displayValue,\n );\n\n const [prevCorrectDate, setPrevCorrectDate] = React.useState(relativeDateState.lastCorrectDate);\n if (prevCorrectDate !== relativeDateState.lastCorrectDate) {\n setPrevCorrectDate(relativeDateState.lastCorrectDate);\n setFocusedDate(relativeDateState.lastCorrectDate);\n }\n\n const [prevDateValue, setPrevDateValue] = React.useState(\n datePickerState.dateFieldState.displayValue,\n );\n if (!datePickerState.dateFieldState.displayValue.isSame(prevDateValue, 'day')) {\n setPrevDateValue(datePickerState.dateFieldState.displayValue);\n setFocusedDate(datePickerState.dateFieldState.displayValue);\n }\n const {focusWithinProps} = useFocusWithin({\n onFocusWithin: onFocus,\n onBlurWithin: onBlur,\n onFocusWithinChange(isFocusWithin) {\n if (!isFocusWithin) {\n state.setActive(false);\n }\n },\n });\n\n const [isOpen, setOpen] = useControlledState<boolean>(undefined, false, props.onOpenChange);\n if (!state.isActive && isOpen) {\n setOpen(false);\n }\n\n const commonInputProps: TextInputProps = {\n onFocus: () => {\n if (!state.isActive) {\n state.setActive(true);\n setOpen(true);\n }\n },\n errorMessage: props.errorMessage,\n errorPlacement: props.errorPlacement,\n controlProps: {\n onClick: () => {\n if (state.disabled) {\n return;\n }\n if (!isOpen) {\n state.setActive(true);\n setOpen(true);\n }\n },\n role: 'combobox',\n 'aria-expanded': isOpen,\n },\n };\n\n const {inputProps} = useDateFieldProps(datePickerState.dateFieldState, {\n ...props,\n value: undefined,\n defaultValue: undefined,\n onUpdate: undefined,\n });\n\n const {inputProps: relativeDateProps} = useRelativeDateFieldProps(relativeDateState, {\n ...props,\n value: undefined,\n defaultValue: undefined,\n onUpdate: undefined,\n });\n\n let validationState = props.validationState;\n if (!validationState) {\n validationState =\n mode === 'relative'\n ? relativeDateState.validationState\n : datePickerState.dateFieldState.validationState;\n }\n\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n const handleRef = useForkRef(\n inputRef,\n mode === 'relative' ? relativeDateProps.controlRef : inputProps.controlRef,\n );\n\n const calendarRef = React.useRef<CalendarInstance>(null);\n\n function focusCalendar() {\n setTimeout(() => {\n calendarRef.current?.focus();\n });\n }\n\n function focusInput() {\n setTimeout(() => {\n inputRef.current?.focus({preventScroll: true});\n });\n }\n const groupRef = React.useRef<HTMLElement>(null);\n const calendarModes = getCalendarModes(datePickerState.formatInfo);\n\n return {\n groupProps: {\n ref: groupRef,\n tabIndex: -1,\n role: 'group',\n ...focusWithinProps,\n onKeyDown: (e) => {\n if (e.altKey && (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')) {\n e.preventDefault();\n e.stopPropagation();\n setOpen(true);\n focusCalendar();\n }\n },\n },\n fieldProps: mergeProps(\n commonInputProps,\n mode === 'relative' ? relativeDateProps : inputProps,\n mode === 'absolute' &&\n datePickerState.dateFieldState.isEmpty &&\n !state.isActive &&\n props.placeholder\n ? {value: ''}\n : undefined,\n {controlRef: handleRef, validationState},\n ),\n modeSwitcherProps: {\n size: getButtonSizeForInput(props.size),\n disabled: state.readOnly \|\| state.disabled,\n view: 'flat-secondary',\n style: {zIndex: 2, marginInlineEnd: 2},\n selected: mode === 'relative',\n 'aria-label': i18n('Formula input mode'),\n onClick: () => {\n setMode(mode === 'relative' ? 'absolute' : 'relative');\n if (mode === 'relative') {\n const valueDate = datePickerState.value;\n if (valueDate) {\n setFocusedDate(valueDate);\n }\n } else if (relativeDateState.parsedDate) {\n setFocusedDate(relativeDateState.parsedDate);\n }\n focusInput();\n },\n },\n calendarButtonProps: {\n size: getButtonSizeForInput(props.size),\n disabled: state.disabled,\n 'aria-label': i18n('Calendar'),\n 'aria-haspopup': 'dialog',\n 'aria-expanded': isOpen,\n view: 'flat-secondary',\n onClick: () => {\n state.setActive(true);\n setOpen(!isOpen);\n if (!isOpen) {\n focusCalendar();\n }\n },\n },\n popupProps: {\n open: isOpen,\n onEscapeKeyDown: () => {\n setOpen(false);\n focusInput();\n },\n onOutsideClick: (e) => {\n if (e.target && !groupRef.current?.contains(e.target as Node)) {\n setOpen(false);\n }\n },\n onTransitionOutComplete: () => {\n setFocusedDate(\n mode === 'relative'\n ? relativeDateState.lastCorrectDate\n : datePickerState.dateFieldState.displayValue,\n );\n },\n placement: props.popupPlacement,\n offset: props.popupOffset,\n className: props.popupClassName,\n style: props.popupStyle,\n returnFocus: false,\n },\n calendarProps: {\n ref: calendarRef,\n size: props.size === 's' ? 'm' : props.size,\n readOnly: props.readOnly,\n value: state.selectedDate,\n onUpdate: (v) => {\n datePickerState.setDateValue(v);\n if (!state.datePickerState.formatInfo.hasTime) {\n setOpen(false);\n focusInput();\n }\n },\n focusedValue: focusedDate,\n onFocusUpdate: setFocusedDate,\n minValue: props.minValue,\n maxValue: props.maxValue,\n modes: mode === 'absolute' ? calendarModes : undefined,\n },\n timeInputProps: {\n value: datePickerState.timeValue,\n onUpdate: datePickerState.setTimeValue,\n format: datePickerState.timeFormat,\n readOnly: state.readOnly,\n disabled: state.disabled,\n timeZone: props.timeZone,\n hasClear: props.hasClear,\n size: props.size,\n },\n };\n}\n"]}

package/dist/esm/components/RelativeRangeDatePicker/RelativeRangeDatePicker.js CHANGED Viewed

@@ -13,33 +13,27 @@ export function RelativeRangeDatePicker(props) {
     const state = useRelativeRangeDatePickerState(props);
     const isMobile = useMobile();
     const [anchor, setAnchor] = React.useState(null);
-    const inputRef = React.useRef(null);
-    const [isActive, setIsActive] = React.useState(false);
+    const dialogClosing = React.useRef(false);
     const [open, setOpen] = useControlledState(undefined, false, props.onOpenChange);
     const { focusWithinProps } = useFocusWithin({
         isDisabled: props.disabled,
-        onFocusWithin: (e) => {
+        onFocusWithin: props.onFocus,
+        onBlurWithin: props.onBlur,
+        onFocusWithinChange: (isFocusWithin) => {
             var _a;
-            if (!isActive) {
-                (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, e);
-            }
-        },
-        onBlurWithin: (e) => {
-            var _a;
-            if (!open) {
-                setIsActive(false);
-                (_a = props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props, e);
+            if (isFocusWithin &&
+                !dialogClosing.current &&
+                !props.renderControl &&
+                ((_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.tagName) !== 'BUTTON') {
+                setOpen(true);
             }
         },
     });
-    return (_jsxs("div", Object.assign({ ref: setAnchor }, focusWithinProps, { className: b(null, props.className), style: props.style, children: [_jsx(Control, { props: props, state: state, open: open, isMobile: isMobile, ref: inputRef, onClick: () => {
+    return (_jsxs("div", Object.assign({ ref: setAnchor }, focusWithinProps, { className: b(null, props.className), style: props.style, children: [_jsx(Control, { props: props, state: state, open: open, setOpen: setOpen, isMobile: isMobile, onClick: () => {
                     if (props.disabled) {
                         return;
                     }
-                    if (!open) {
-                        setIsActive(true);
-                        setOpen(true);
-                    }
+                    setOpen(true);
                 }, onKeyDown: (e) => {
                     if (props.disabled) {
                         return;
@@ -49,28 +43,21 @@ export function RelativeRangeDatePicker(props) {
                         setOpen(true);
                     }
                 }, onClickCalendar: () => {
-                    setIsActive(true);
                     setOpen(!open);
-                }, onFocus: () => {
-                    if (!isActive) {
-                        setIsActive(true);
-                        setOpen(true);
-                    }
                 }, onUpdate: (v) => {
                     if (!props.readOnly && !v) {
                         state.setValue(null, 'default');
                     }
                 } }), _jsx(HiddenInput, { name: props.name, form: props.form, value: state.value, toStringValue: (v) => { var _a, _b; return (_b = (_a = v === null || v === void 0 ? void 0 : v.start) === null || _a === void 0 ? void 0 : _a.type) !== null && _b !== void 0 ? _b : ''; }, disabled: props.disabled }), _jsx(HiddenInput, { name: props.name, form: props.form, value: state.value, toStringValue: (v) => { var _a; return getNativeValue((_a = v === null || v === void 0 ? void 0 : v.start) !== null && _a !== void 0 ? _a : null); }, disabled: props.disabled }), _jsx(HiddenInput, { name: props.name, form: props.form, value: state.value, toStringValue: (v) => { var _a, _b; return (_b = (_a = v === null || v === void 0 ? void 0 : v.end) === null || _a === void 0 ? void 0 : _a.type) !== null && _b !== void 0 ? _b : ''; }, disabled: props.disabled }), _jsx(HiddenInput, { name: props.name, form: props.form, value: state.value, toStringValue: (v) => { var _a; return getNativeValue((_a = v === null || v === void 0 ? void 0 : v.end) !== null && _a !== void 0 ? _a : null); }, disabled: props.disabled }), _jsx(HiddenInput, { name: props.name, form: props.form, onReset: (v) => {
                     state.setValue(v.value, v.timeZone);
-                }, value: { value: state.value, timeZone: state.timeZone }, toStringValue: (v) => v.timeZone, disabled: props.disabled }), _jsx(PickerDialog, { value: state.value, onUpdate: state.setValue, timeZone: state.timeZone, open: open, onClose: (reason) => {
+                }, value: { value: state.value, timeZone: state.timeZone }, toStringValue: (v) => v.timeZone, disabled: props.disabled }), _jsx(PickerDialog, { value: state.value, onUpdate: state.setValue, timeZone: state.timeZone, open: open, onClose: () => {
                     setOpen(false);
-                    if (reason === 'escape-key') {
-                        setTimeout(() => {
-                            var _a;
-                            (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus({ preventScroll: true });
-                        });
-                    }
-                }, anchor: anchor, modal: true, popupClassName: props.popupClassName, popupStyle: props.popupStyle, popupPlacement: props.popupPlacement, popupOffset: props.popupOffset, isMobile: isMobile, size: props.size, format: props.format, readOnly: props.readOnly, minValue: props.minValue, maxValue: props.maxValue, allowNullableValues: props.allowNullableValues, isDateUnavailable: props.isDateUnavailable, placeholderValue: props.placeholderValue, withPresets: props.withPresets, presetTabs: props.presetTabs, docs: props.docs, withApplyButton: props.withApplyButton, withZonesList: props.withZonesList })] })));
+                    dialogClosing.current = true;
+                }, onRemove: () => {
+                    setTimeout(() => {
+                        dialogClosing.current = false;
+                    });
+                }, anchor: anchor, modal: true, returnFocus: true, popupClassName: props.popupClassName, popupStyle: props.popupStyle, popupPlacement: props.popupPlacement, popupOffset: props.popupOffset, isMobile: isMobile, size: props.size, format: props.format, readOnly: props.readOnly, minValue: props.minValue, maxValue: props.maxValue, allowNullableValues: props.allowNullableValues, isDateUnavailable: props.isDateUnavailable, placeholderValue: props.placeholderValue, withPresets: props.withPresets, presetTabs: props.presetTabs, docs: props.docs, withApplyButton: props.withApplyButton, withZonesList: props.withZonesList })] })));
 }
 function getNativeValue(value) {
     if (!value) {

package/dist/esm/components/RelativeRangeDatePicker/RelativeRangeDatePicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RelativeRangeDatePicker.js","sourceRoot":"../../../../src","sources":["components/RelativeRangeDatePicker/RelativeRangeDatePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport React from 'react';\n\nimport {useControlledState, useFocusWithin, useMobile} from '@gravity-ui/uikit';\n\nimport {block} from '../../utils/cn';\nimport {HiddenInput} from '../HiddenInput/HiddenInput';\nimport type {Value} from '../RelativeDatePicker';\n\nimport {Control} from './components/Control/Control';\nimport {PickerDialog} from './components/PickerDialog/PickerDialog';\nimport {useRelativeRangeDatePickerState} from './hooks/useRelativeRangeDatePickerState';\nimport type {RelativeRangeDatePickerProps} from './types';\n\nimport './RelativeRangeDatePicker.scss';\n\nconst b = block('relative-range-date-picker');\n\nexport function RelativeRangeDatePicker(props: RelativeRangeDatePickerProps) {\n const state = useRelativeRangeDatePickerState(props);\n\n const isMobile = useMobile();\n\n const [anchor, setAnchor] = React.useState<HTMLDivElement \| null>(null);\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n const [isActive, setIsActive] = React.useState(false);\n const [open, setOpen] = useControlledState<boolean>(undefined, false, props.onOpenChange);\n\n const {focusWithinProps} = useFocusWithin({\n isDisabled: props.disabled,\n onFocusWithin: (e) => {\n if (!isActive) {\n props.onFocus?.(e);\n }\n },\n onBlurWithin: (e) => {\n if (!open) {\n setIsActive(false);\n props.onBlur?.(e);\n }\n },\n });\n\n return (\n <div\n ref={setAnchor}\n {...focusWithinProps}\n className={b(null, props.className)}\n style={props.style}\n >\n <Control\n props={props}\n state={state}\n open={open}\n isMobile={isMobile}\n ref={inputRef}\n onClick={() => {\n if (props.disabled) {\n return;\n }\n if (!open) {\n setIsActive(true);\n setOpen(true);\n }\n }}\n onKeyDown={(e) => {\n if (props.disabled) {\n return;\n }\n if (e.altKey && (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')) {\n e.preventDefault();\n setOpen(true);\n }\n }}\n onClickCalendar={() => {\n setIsActive(true);\n setOpen(!open);\n }}\n onFocus={() => {\n if (!isActive) {\n setIsActive(true);\n setOpen(true);\n }\n }}\n onUpdate={(v: string) => {\n if (!props.readOnly && !v) {\n state.setValue(null, 'default');\n }\n }}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => v?.start?.type ?? ''}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => getNativeValue(v?.start ?? null)}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => v?.end?.type ?? ''}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => getNativeValue(v?.end ?? null)}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n onReset={(v) => {\n state.setValue(v.value, v.timeZone);\n }}\n value={{value: state.value, timeZone: state.timeZone}}\n toStringValue={(v) => v.timeZone}\n disabled={props.disabled}\n />\n\n <PickerDialog\n value={state.value}\n onUpdate={state.setValue}\n timeZone={state.timeZone}\n open={open}\n onClose={(reason) => {\n setOpen(false);\n if (reason === 'escape-key') {\n setTimeout(() => {\n inputRef.current?.focus({preventScroll: true});\n });\n }\n }}\n anchor={anchor}\n modal\n popupClassName={props.popupClassName}\n popupStyle={props.popupStyle}\n popupPlacement={props.popupPlacement}\n popupOffset={props.popupOffset}\n isMobile={isMobile}\n size={props.size}\n format={props.format}\n readOnly={props.readOnly}\n minValue={props.minValue}\n maxValue={props.maxValue}\n allowNullableValues={props.allowNullableValues}\n isDateUnavailable={props.isDateUnavailable}\n placeholderValue={props.placeholderValue}\n withPresets={props.withPresets}\n presetTabs={props.presetTabs}\n docs={props.docs}\n withApplyButton={props.withApplyButton}\n withZonesList={props.withZonesList}\n />\n </div>\n );\n}\n\nfunction getNativeValue(value: Value \| null) {\n if (!value) {\n return '';\n }\n if (value.type === 'relative') {\n return value.value;\n }\n return value.value.toISOString();\n}\n"]}
1	+ {"version":3,"file":"RelativeRangeDatePicker.js","sourceRoot":"../../../../src","sources":["components/RelativeRangeDatePicker/RelativeRangeDatePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport React from 'react';\n\nimport {useControlledState, useFocusWithin, useMobile} from '@gravity-ui/uikit';\n\nimport {block} from '../../utils/cn';\nimport {HiddenInput} from '../HiddenInput/HiddenInput';\nimport type {Value} from '../RelativeDatePicker';\n\nimport {Control} from './components/Control/Control';\nimport {PickerDialog} from './components/PickerDialog/PickerDialog';\nimport {useRelativeRangeDatePickerState} from './hooks/useRelativeRangeDatePickerState';\nimport type {RelativeRangeDatePickerProps} from './types';\n\nimport './RelativeRangeDatePicker.scss';\n\nconst b = block('relative-range-date-picker');\n\nexport function RelativeRangeDatePicker(props: RelativeRangeDatePickerProps) {\n const state = useRelativeRangeDatePickerState(props);\n\n const isMobile = useMobile();\n\n const [anchor, setAnchor] = React.useState<HTMLDivElement \| null>(null);\n const dialogClosing = React.useRef(false);\n\n const [open, setOpen] = useControlledState<boolean>(undefined, false, props.onOpenChange);\n\n const {focusWithinProps} = useFocusWithin({\n isDisabled: props.disabled,\n onFocusWithin: props.onFocus,\n onBlurWithin: props.onBlur,\n onFocusWithinChange: (isFocusWithin) => {\n if (\n isFocusWithin &&\n !dialogClosing.current &&\n !props.renderControl &&\n document.activeElement?.tagName !== 'BUTTON'\n ) {\n setOpen(true);\n }\n },\n });\n\n return (\n <div\n ref={setAnchor}\n {...focusWithinProps}\n className={b(null, props.className)}\n style={props.style}\n >\n <Control\n props={props}\n state={state}\n open={open}\n setOpen={setOpen}\n isMobile={isMobile}\n onClick={() => {\n if (props.disabled) {\n return;\n }\n setOpen(true);\n }}\n onKeyDown={(e) => {\n if (props.disabled) {\n return;\n }\n if (e.altKey && (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp')) {\n e.preventDefault();\n setOpen(true);\n }\n }}\n onClickCalendar={() => {\n setOpen(!open);\n }}\n onUpdate={(v: string) => {\n if (!props.readOnly && !v) {\n state.setValue(null, 'default');\n }\n }}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => v?.start?.type ?? ''}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => getNativeValue(v?.start ?? null)}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => v?.end?.type ?? ''}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n value={state.value}\n toStringValue={(v) => getNativeValue(v?.end ?? null)}\n disabled={props.disabled}\n />\n <HiddenInput\n name={props.name}\n form={props.form}\n onReset={(v) => {\n state.setValue(v.value, v.timeZone);\n }}\n value={{value: state.value, timeZone: state.timeZone}}\n toStringValue={(v) => v.timeZone}\n disabled={props.disabled}\n />\n\n <PickerDialog\n value={state.value}\n onUpdate={state.setValue}\n timeZone={state.timeZone}\n open={open}\n onClose={() => {\n setOpen(false);\n dialogClosing.current = true;\n }}\n onRemove={() => {\n setTimeout(() => {\n dialogClosing.current = false;\n });\n }}\n anchor={anchor}\n modal\n returnFocus\n popupClassName={props.popupClassName}\n popupStyle={props.popupStyle}\n popupPlacement={props.popupPlacement}\n popupOffset={props.popupOffset}\n isMobile={isMobile}\n size={props.size}\n format={props.format}\n readOnly={props.readOnly}\n minValue={props.minValue}\n maxValue={props.maxValue}\n allowNullableValues={props.allowNullableValues}\n isDateUnavailable={props.isDateUnavailable}\n placeholderValue={props.placeholderValue}\n withPresets={props.withPresets}\n presetTabs={props.presetTabs}\n docs={props.docs}\n withApplyButton={props.withApplyButton}\n withZonesList={props.withZonesList}\n />\n </div>\n );\n}\n\nfunction getNativeValue(value: Value \| null) {\n if (!value) {\n return '';\n }\n if (value.type === 'relative') {\n return value.value;\n }\n return value.value.toISOString();\n}\n"]}

package/dist/esm/components/RelativeRangeDatePicker/components/Control/Control.d.ts CHANGED Viewed

@@ -6,10 +6,11 @@ export type ControlProps = {
     props: RelativeRangeDatePickerProps;
     state: RelativeRangeDatePickerState;
     open: boolean;
+    setOpen: (open: boolean) => void;
     isMobile?: boolean;
     onClick: (e: React.MouseEvent<HTMLElement>) => void;
     onKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;
-    onFocus: (e: React.FocusEvent<HTMLElement>) => void;
+    onFocus?: (e: React.FocusEvent<HTMLElement>) => void;
     onClickCalendar: (e: React.MouseEvent<HTMLElement>) => void;
     onUpdate: (value: string) => void;
 };

package/dist/esm/components/RelativeRangeDatePicker/components/Control/Control.js CHANGED Viewed

@@ -8,7 +8,7 @@ import { getDefaultTitle } from "../../utils.js";
 import { i18n } from "./i18n/index.js";
 import "./Control.css";
 const b = block('relative-range-date-picker-control');
-export const Control = React.forwardRef(({ props, state, open, isMobile, onClick, onKeyDown, onFocus, onClickCalendar, onUpdate }, ref) => {
+export const Control = React.forwardRef(({ props, state, open, setOpen, isMobile, onClick, onKeyDown, onFocus, onClickCalendar, onUpdate, }, ref) => {
     var _a;
     const { alwaysShowAsAbsolute, presetTabs, getRangeTitle } = props;
     const format = props.format || 'L';
@@ -44,8 +44,9 @@ export const Control = React.forwardRef(({ props, state, open, isMobile, onClick
         validationState,
         errorMessage,
         open,
+        setOpen,
         triggerProps,
-    })) : (_jsxs(React.Fragment, { children: [_jsx(TextInput, { id: props.id, autoFocus: props.autoFocus, controlRef: ref, value: text, placeholder: props.placeholder, onUpdate: onUpdate, controlProps: Object.assign(Object.assign({ className: b('input', { mobile: isMobile }) }, triggerProps), { disabled: isMobile, onClick }), onKeyDown: onKeyDown, onFocus: onFocus, validationState: validationState, errorMessage: errorMessage, errorPlacement: props.errorPlacement, pin: props.pin, size: props.size, label: props.label, hasClear: props.hasClear, disabled: props.disabled, endContent: _jsx(Button, { view: "flat-secondary", size: getButtonSizeForInput(props.size), disabled: props.disabled, "aria-haspopup": "dialog", "aria-expanded": open, "aria-label": i18n('Range date picker'), onClick: onClickCalendar, children: _jsx(Icon, { data: CalendarIcon }) }) }), isMobile ? (_jsx("button", { className: b('mobile-trigger', {
+    })) : (_jsxs(React.Fragment, { children: [_jsx(TextInput, { id: props.id, autoFocus: props.autoFocus, controlRef: ref, value: text, placeholder: props.placeholder, onUpdate: onUpdate, controlProps: Object.assign(Object.assign({ className: b('input', { mobile: isMobile }) }, triggerProps), { disabled: isMobile, onClick }), onKeyDown: onKeyDown, onFocus: onFocus, validationState: validationState, errorMessage: errorMessage, errorPlacement: props.errorPlacement, pin: props.pin, size: props.size, label: props.label, hasClear: props.hasClear, disabled: props.disabled, endContent: _jsx(Button, { view: "flat-secondary", size: getButtonSizeForInput(props.size), disabled: props.disabled, "aria-haspopup": "dialog", "aria-expanded": open, "aria-label": i18n('Range date picker'), onClick: onClickCalendar, tabIndex: -1, children: _jsx(Icon, { data: CalendarIcon }) }) }), isMobile ? (_jsx("button", { className: b('mobile-trigger', {
                     'has-clear': Boolean(props.hasClear && state.value),
                     'has-errors': state.isInvalid && props.errorPlacement === 'inside',
                     size: props.size,

package/dist/esm/components/RelativeRangeDatePicker/components/Control/Control.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Control.js","sourceRoot":"../../../../../../src","sources":["components/RelativeRangeDatePicker/components/Control/Control.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,QAAQ,IAAI,YAAY,EAAC,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAC,MAAM,EAAE,IAAI,EAAE,SAAS,EAAC,MAAM,mBAAmB,CAAC;AAE1D,OAAO,EAAC,KAAK,EAAC,gCAA6B;AAC3C,OAAO,EAAC,qBAAqB,EAAC,gDAA6C;AAG3E,OAAO,EAAC,eAAe,EAAC,uBAAoB;AAE5C,OAAO,EAAC,IAAI,EAAC,wBAAe;AAE5B,uBAAwB;~~AAcxB~~,MAAM,CAAC,GAAG,KAAK,CAAC,oCAAoC,CAAC,CAAC;AAEtD,MAAM,CAAC,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CACnC,CACI,~~EAAC~~,KAAK,~~EAAE~~,KAAK,~~EAAE~~,IAAI,~~EAAE~~,QAAQ,~~EAAE~~,OAAO,~~EAAE~~,SAAS,~~EAAE~~,OAAO,~~EAAE~~,eAAe,~~EAAE~~,QAAQ,~~EAAC~~,~~EACtF~~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~~YAExB~~,KAAC,IAAI,IAAC,IAAI,EAAE,YAAY,GAAI,GACvB,GAEf,EACD,QAAQ,CAAC,CAAC,CAAC,CACR,iBACI,SAAS,EAAE,CAAC,CAAC,gBAAgB,EAAE;oBAC3B,WAAW,EAAE,OAAO,CAAC,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,KAAK,CAAC;oBACnD,YAAY,EAAE,KAAK,CAAC,SAAS,IAAI,KAAK,CAAC,cAAc,KAAK,QAAQ;oBAClE,IAAI,EAAE,KAAK,CAAC,IAAI;iBACnB,CAAC,EACF,OAAO,EAAE,OAAO,GAClB,CACL,CAAC,CAAC,CAAC,IAAI,IACK,CACpB,CAAC;AACN,CAAC,CACJ,CAAC;AAEF,OAAO,CAAC,WAAW,GAAG,SAAS,CAAC","sourcesContent":["import React from 'react';\n\nimport {Calendar as CalendarIcon} from '@gravity-ui/icons';\nimport {Button, Icon, TextInput} from '@gravity-ui/uikit';\n\nimport {block} from '../../../../utils/cn';\nimport {getButtonSizeForInput} from '../../../utils/getButtonSizeForInput';\nimport type {RelativeRangeDatePickerState} from '../../hooks/useRelativeRangeDatePickerState';\nimport type {RelativeRangeDatePickerProps, RelativeRangeDatePickerTriggerProps} from '../../types';\nimport {getDefaultTitle} from '../../utils';\n\nimport {i18n} from './i18n';\n\nimport './Control.scss';\n\nexport type ControlProps = {\n props: RelativeRangeDatePickerProps;\n state: RelativeRangeDatePickerState;\n open: boolean;\n isMobile?: boolean;\n onClick: (e: React.MouseEvent<HTMLElement>) => void;\n onKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n onFocus: (e: React.FocusEvent<HTMLElement>) => void;\n onClickCalendar: (e: React.MouseEvent<HTMLElement>) => void;\n onUpdate: (value: string) => void;\n};\n\nconst b = block('relative-range-date-picker-control');\n\nexport const Control = React.forwardRef<HTMLInputElement, ControlProps>(\n (\n {props, state, open, isMobile, onClick, onKeyDown, onFocus, onClickCalendar, onUpdate},\n ref,\n ) => {\n const {alwaysShowAsAbsolute, presetTabs, getRangeTitle} = props;\n const format = props.format \|\| 'L';\n\n const text = React.useMemo(\n () =>\n typeof getRangeTitle === 'function'\n ? getRangeTitle(state.value, state.timeZone)\n : getDefaultTitle({\n value: state.value,\n timeZone: state.timeZone,\n alwaysShowAsAbsolute,\n format,\n presets: presetTabs?.flatMap(({presets}) => presets),\n }),\n [alwaysShowAsAbsolute, format, getRangeTitle, presetTabs, state.timeZone, state.value],\n );\n\n const validationState = props.validationState \|\| (state.isInvalid ? 'invalid' : undefined);\n const errorMessage = props.errorMessage ?? state.errors.join('\\n');\n\n const triggerProps: RelativeRangeDatePickerTriggerProps = {\n id: props.id,\n role: 'combobox',\n 'aria-haspopup': 'dialog',\n 'aria-expanded': open,\n 'aria-label': props['aria-label'],\n 'aria-labelledby': props['aria-labelledby'],\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details'],\n disabled: props.disabled,\n readOnly: props.readOnly,\n onClick: onClickCalendar,\n onKeyDown,\n };\n\n return props.renderControl ? (\n props.renderControl({\n ref,\n value: state.value,\n title: text,\n validationState,\n errorMessage,\n open,\n triggerProps,\n })\n ) : (\n <React.Fragment>\n <TextInput\n id={props.id}\n autoFocus={props.autoFocus}\n controlRef={ref}\n value={text}\n placeholder={props.placeholder}\n onUpdate={onUpdate}\n controlProps={{\n className: b('input', {mobile: isMobile}),\n ...triggerProps,\n disabled: isMobile,\n onClick,\n }}\n onKeyDown={onKeyDown}\n onFocus={onFocus}\n validationState={validationState}\n errorMessage={errorMessage}\n errorPlacement={props.errorPlacement}\n pin={props.pin}\n size={props.size}\n label={props.label}\n hasClear={props.hasClear}\n disabled={props.disabled}\n endContent={\n <Button\n view=\"flat-secondary\"\n size={getButtonSizeForInput(props.size)}\n disabled={props.disabled}\n aria-haspopup=\"dialog\"\n aria-expanded={open}\n aria-label={i18n('Range date picker')}\n onClick={onClickCalendar}\n >\n <Icon data={CalendarIcon} />\n </Button>\n }\n />\n {isMobile ? (\n <button\n className={b('mobile-trigger', {\n 'has-clear': Boolean(props.hasClear && state.value),\n 'has-errors': state.isInvalid && props.errorPlacement === 'inside',\n size: props.size,\n })}\n onClick={onClick}\n />\n ) : null}\n </React.Fragment>\n );\n },\n);\n\nControl.displayName = 'Control';\n"]}
1	+ {"version":3,"file":"Control.js","sourceRoot":"../../../../../../src","sources":["components/RelativeRangeDatePicker/components/Control/Control.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {Calendar as CalendarIcon} from '@gravity-ui/icons';\nimport {Button, Icon, TextInput} from '@gravity-ui/uikit';\n\nimport {block} from '../../../../utils/cn';\nimport {getButtonSizeForInput} from '../../../utils/getButtonSizeForInput';\nimport type {RelativeRangeDatePickerState} from '../../hooks/useRelativeRangeDatePickerState';\nimport type {RelativeRangeDatePickerProps, RelativeRangeDatePickerTriggerProps} from '../../types';\nimport {getDefaultTitle} from '../../utils';\n\nimport {i18n} from './i18n';\n\nimport './Control.scss';\n\nexport type ControlProps = {\n props: RelativeRangeDatePickerProps;\n state: RelativeRangeDatePickerState;\n open: boolean;\n setOpen: (open: boolean) => void;\n isMobile?: boolean;\n onClick: (e: React.MouseEvent<HTMLElement>) => void;\n onKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n onFocus?: (e: React.FocusEvent<HTMLElement>) => void;\n onClickCalendar: (e: React.MouseEvent<HTMLElement>) => void;\n onUpdate: (value: string) => void;\n};\n\nconst b = block('relative-range-date-picker-control');\n\nexport const Control = React.forwardRef<HTMLInputElement, ControlProps>(\n (\n {\n props,\n state,\n open,\n setOpen,\n isMobile,\n onClick,\n onKeyDown,\n onFocus,\n onClickCalendar,\n onUpdate,\n },\n ref,\n ) => {\n const {alwaysShowAsAbsolute, presetTabs, getRangeTitle} = props;\n const format = props.format \|\| 'L';\n\n const text = React.useMemo(\n () =>\n typeof getRangeTitle === 'function'\n ? getRangeTitle(state.value, state.timeZone)\n : getDefaultTitle({\n value: state.value,\n timeZone: state.timeZone,\n alwaysShowAsAbsolute,\n format,\n presets: presetTabs?.flatMap(({presets}) => presets),\n }),\n [alwaysShowAsAbsolute, format, getRangeTitle, presetTabs, state.timeZone, state.value],\n );\n\n const validationState = props.validationState \|\| (state.isInvalid ? 'invalid' : undefined);\n const errorMessage = props.errorMessage ?? state.errors.join('\\n');\n\n const triggerProps: RelativeRangeDatePickerTriggerProps = {\n id: props.id,\n role: 'combobox',\n 'aria-haspopup': 'dialog',\n 'aria-expanded': open,\n 'aria-label': props['aria-label'],\n 'aria-labelledby': props['aria-labelledby'],\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details'],\n disabled: props.disabled,\n readOnly: props.readOnly,\n onClick: onClickCalendar,\n onKeyDown,\n };\n\n return props.renderControl ? (\n props.renderControl({\n ref,\n value: state.value,\n title: text,\n validationState,\n errorMessage,\n open,\n setOpen,\n triggerProps,\n })\n ) : (\n <React.Fragment>\n <TextInput\n id={props.id}\n autoFocus={props.autoFocus}\n controlRef={ref}\n value={text}\n placeholder={props.placeholder}\n onUpdate={onUpdate}\n controlProps={{\n className: b('input', {mobile: isMobile}),\n ...triggerProps,\n disabled: isMobile,\n onClick,\n }}\n onKeyDown={onKeyDown}\n onFocus={onFocus}\n validationState={validationState}\n errorMessage={errorMessage}\n errorPlacement={props.errorPlacement}\n pin={props.pin}\n size={props.size}\n label={props.label}\n hasClear={props.hasClear}\n disabled={props.disabled}\n endContent={\n <Button\n view=\"flat-secondary\"\n size={getButtonSizeForInput(props.size)}\n disabled={props.disabled}\n aria-haspopup=\"dialog\"\n aria-expanded={open}\n aria-label={i18n('Range date picker')}\n onClick={onClickCalendar}\n tabIndex={-1}\n >\n <Icon data={CalendarIcon} />\n </Button>\n }\n />\n {isMobile ? (\n <button\n className={b('mobile-trigger', {\n 'has-clear': Boolean(props.hasClear && state.value),\n 'has-errors': state.isInvalid && props.errorPlacement === 'inside',\n size: props.size,\n })}\n onClick={onClick}\n />\n ) : null}\n </React.Fragment>\n );\n },\n);\n\nControl.displayName = 'Control';\n"]}

package/dist/esm/components/RelativeRangeDatePicker/components/PickerDialog/PickerDialog.d.ts CHANGED Viewed

@@ -9,9 +9,13 @@ export interface PickerDialogProps extends PickerFormProps, PopupStyleProps {
     open: boolean;
     /** Handles popup close event */
     onClose: (reason?: Parameters<NonNullable<PopupProps['onOpenChange']>>[2] | 'apply') => void;
+    /** Handles popup remove from DOM event */
+    onRemove?: () => void;
     /** If true `Popup` act like a modal dialog */
     modal?: boolean;
+    /** Element which focus should be returned to */
+    returnFocus?: PopupProps['returnFocus'];
     /** If true `Sheet` is used instead of `Popup`  */
     isMobile?: boolean;
 }
-export declare function PickerDialog({ open, onClose, isMobile, anchor, popupClassName, popupStyle, popupPlacement, popupOffset, modal, ...props }: PickerDialogProps): import("react/jsx-runtime").JSX.Element;
+export declare function PickerDialog({ open, onClose, isMobile, anchor, popupClassName, popupStyle, popupPlacement, popupOffset, modal, returnFocus, onRemove, ...props }: PickerDialogProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/RelativeRangeDatePicker/components/PickerDialog/PickerDialog.js CHANGED Viewed

@@ -7,10 +7,13 @@ import { PickerForm } from "./PickerForm.js";
 import "./PickerDialog.css";
 const b = block('relative-range-date-picker-dialog');
 export function PickerDialog(_a) {
-    var { open, onClose, isMobile, anchor, popupClassName, popupStyle, popupPlacement, popupOffset, modal } = _a, props = __rest(_a, ["open", "onClose", "isMobile", "anchor", "popupClassName", "popupStyle", "popupPlacement", "popupOffset", "modal"]);
+    var { open, onClose, isMobile, anchor, popupClassName, popupStyle, popupPlacement, popupOffset, modal, returnFocus = false, onRemove } = _a, props = __rest(_a, ["open", "onClose", "isMobile", "anchor", "popupClassName", "popupStyle", "popupPlacement", "popupOffset", "modal", "returnFocus", "onRemove"]);
     if (isMobile) {
         return (_jsx(Sheet, { visible: open, onClose: () => {
                 onClose('outside-press');
+                setTimeout(() => {
+                    onRemove === null || onRemove === void 0 ? void 0 : onRemove();
+                });
             }, contentClassName: b('content', { mobile: true, size: 'xl' }, popupClassName), children: _jsx(PickerForm, Object.assign({}, props, { size: "xl", onApply: () => {
                     onClose('apply');
                 } })) }));
@@ -19,7 +22,7 @@ export function PickerDialog(_a) {
             if (!isOpen) {
                 onClose(reason);
             }
-        }, placement: popupPlacement, offset: popupOffset, role: "dialog", anchorElement: anchor, className: b('content', { size: props.size }, popupClassName), style: popupStyle, modal: modal, children: _jsx(PickerForm, Object.assign({}, props, { onApply: () => {
+        }, placement: popupPlacement, offset: popupOffset, role: "dialog", anchorElement: anchor, className: b('content', { size: props.size }, popupClassName), style: popupStyle, modal: modal, returnFocus: returnFocus, onTransitionOutComplete: onRemove, children: _jsx(PickerForm, Object.assign({}, props, { onApply: () => {
                 onClose('apply');
             } })) }));
 }

package/dist/esm/components/RelativeRangeDatePicker/components/PickerDialog/PickerDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PickerDialog.js","sourceRoot":"../../../../../../src","sources":["components/RelativeRangeDatePicker/components/PickerDialog/PickerDialog.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;AAEb,OAAO,EAAC,KAAK,EAAE,KAAK,EAAC,MAAM,mBAAmB,CAAC;AAG/C,OAAO,EAAC,KAAK,EAAC,gCAA6B;AAG3C,OAAO,EAAC,UAAU,EAAC,wBAAqB;AAGxC,4BAA6B;AAE7B,MAAM,CAAC,GAAG,KAAK,CAAC,mCAAmC,CAAC,CAAC;~~AAerD~~,MAAM,UAAU,YAAY,CAAC,~~EAWT~~;~~QAXS~~,EACzB,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,MAAM,EACN,cAAc,EACd,UAAU,EACV,cAAc,EACd,WAAW,EACX,KAAK,~~OAEW~~,EADb,KAAK,~~cAViB~~,~~mHAW5B~~,CADW;IAER,IAAI,QAAQ,EAAE,CAAC;QACX,OAAO,CACH,KAAC,KAAK,IACF,OAAO,EAAE,IAAI,EACb,OAAO,EAAE,GAAG,EAAE;gBACV,OAAO,CAAC,eAAe,CAAC,CAAC;~~YAC7B~~,CAAC,EACD,gBAAgB,EAAE,CAAC,CAAC,SAAS,EAAE,EAAC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,EAAE,cAAc,CAAC,YAE1E,KAAC,UAAU,oBACH,KAAK,IACT,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,GAAG,EAAE;oBACV,OAAO,CAAC,OAAO,CAAC,CAAC;gBACrB,CAAC,IACH,GACE,CACX,CAAC;IACN,CAAC;IAED,OAAO,CACH,KAAC,KAAK,IACF,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE;YACrC,IAAI,CAAC,MAAM,EAAE,CAAC;gBACV,OAAO,CAAC,MAAM,CAAC,CAAC;YACpB,CAAC;QACL,CAAC,EACD,SAAS,EAAE,cAAc,EACzB,MAAM,EAAE,WAAW,EACnB,IAAI,EAAC,QAAQ,EACb,aAAa,EAAE,MAAM,EACrB,SAAS,EAAE,CAAC,CAAC,SAAS,EAAE,EAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAC,EAAE,cAAc,CAAC,EAC3D,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE,KAAK,~~YAEZ~~,KAAC,UAAU,oBACH,KAAK,IACT,OAAO,EAAE,GAAG,EAAE;gBACV,OAAO,CAAC,OAAO,CAAC,CAAC;YACrB,CAAC,IACH,GACE,CACX,CAAC;AACN,CAAC","sourcesContent":["'use client';\n\nimport {Popup, Sheet} from '@gravity-ui/uikit';\nimport type {PopupProps} from '@gravity-ui/uikit';\n\nimport {block} from '../../../../utils/cn';\nimport type {PopupStyleProps} from '../../../types';\n\nimport {PickerForm} from './PickerForm';\nimport type {PickerFormProps} from './PickerForm';\n\nimport './PickerDialog.scss';\n\nconst b = block('relative-range-date-picker-dialog');\n\nexport interface PickerDialogProps extends PickerFormProps, PopupStyleProps {\n /** Popup anchor /\n anchor: HTMLElement \| null;\n /* Manages `Popup` visibility /\n open: boolean;\n /* Handles popup close event /\n onClose: (reason?: Parameters<NonNullable<PopupProps['onOpenChange']>>[2] \| 'apply') => void;\n /* If true `Popup` act like a modal dialog /\n modal?: boolean;\n /* If true `Sheet` is used instead of `Popup` */\n isMobile?: boolean;\n}\n\nexport function PickerDialog({\n open,\n onClose,\n isMobile,\n anchor,\n popupClassName,\n popupStyle,\n popupPlacement,\n popupOffset,\n modal,\n ...props\n}: PickerDialogProps) {\n if (isMobile) {\n return (\n <Sheet\n visible={open}\n onClose={() => {\n onClose('outside-press');\n }}\n contentClassName={b('content', {mobile: true, size: 'xl'}, popupClassName)}\n >\n <PickerForm\n {...props}\n size=\"xl\"\n onApply={() => {\n onClose('apply');\n }}\n />\n </Sheet>\n );\n }\n\n return (\n <Popup\n open={open}\n onOpenChange={(isOpen, _event, reason) => {\n if (!isOpen) {\n onClose(reason);\n }\n }}\n placement={popupPlacement}\n offset={popupOffset}\n role=\"dialog\"\n anchorElement={anchor}\n className={b('content', {size: props.size}, popupClassName)}\n style={popupStyle}\n modal={modal}\n >\n <PickerForm\n {...props}\n onApply={() => {\n onClose('apply');\n }}\n />\n </Popup>\n );\n}\n"]}
1	+ {"version":3,"file":"PickerDialog.js","sourceRoot":"../../../../../../src","sources":["components/RelativeRangeDatePicker/components/PickerDialog/PickerDialog.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;AAEb,OAAO,EAAC,KAAK,EAAE,KAAK,EAAC,MAAM,mBAAmB,CAAC;AAG/C,OAAO,EAAC,KAAK,EAAC,gCAA6B;AAG3C,OAAO,EAAC,UAAU,EAAC,wBAAqB;AAGxC,4BAA6B;AAE7B,MAAM,CAAC,GAAG,KAAK,CAAC,mCAAmC,CAAC,CAAC;AAmBrD,MAAM,UAAU,YAAY,CAAC,EAaT;QAbS,EACzB,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,MAAM,EACN,cAAc,EACd,UAAU,EACV,cAAc,EACd,WAAW,EACX,KAAK,EACL,WAAW,GAAG,KAAK,EACnB,QAAQ,OAEQ,EADb,KAAK,cAZiB,8IAa5B,CADW;IAER,IAAI,QAAQ,EAAE,CAAC;QACX,OAAO,CACH,KAAC,KAAK,IACF,OAAO,EAAE,IAAI,EACb,OAAO,EAAE,GAAG,EAAE;gBACV,OAAO,CAAC,eAAe,CAAC,CAAC;gBACzB,UAAU,CAAC,GAAG,EAAE;oBACZ,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,EAAI,CAAC;gBACjB,CAAC,CAAC,CAAC;YACP,CAAC,EACD,gBAAgB,EAAE,CAAC,CAAC,SAAS,EAAE,EAAC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,EAAE,cAAc,CAAC,YAE1E,KAAC,UAAU,oBACH,KAAK,IACT,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,GAAG,EAAE;oBACV,OAAO,CAAC,OAAO,CAAC,CAAC;gBACrB,CAAC,IACH,GACE,CACX,CAAC;IACN,CAAC;IAED,OAAO,CACH,KAAC,KAAK,IACF,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE;YACrC,IAAI,CAAC,MAAM,EAAE,CAAC;gBACV,OAAO,CAAC,MAAM,CAAC,CAAC;YACpB,CAAC;QACL,CAAC,EACD,SAAS,EAAE,cAAc,EACzB,MAAM,EAAE,WAAW,EACnB,IAAI,EAAC,QAAQ,EACb,aAAa,EAAE,MAAM,EACrB,SAAS,EAAE,CAAC,CAAC,SAAS,EAAE,EAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAC,EAAE,cAAc,CAAC,EAC3D,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,uBAAuB,EAAE,QAAQ,YAEjC,KAAC,UAAU,oBACH,KAAK,IACT,OAAO,EAAE,GAAG,EAAE;gBACV,OAAO,CAAC,OAAO,CAAC,CAAC;YACrB,CAAC,IACH,GACE,CACX,CAAC;AACN,CAAC","sourcesContent":["'use client';\n\nimport {Popup, Sheet} from '@gravity-ui/uikit';\nimport type {PopupProps} from '@gravity-ui/uikit';\n\nimport {block} from '../../../../utils/cn';\nimport type {PopupStyleProps} from '../../../types';\n\nimport {PickerForm} from './PickerForm';\nimport type {PickerFormProps} from './PickerForm';\n\nimport './PickerDialog.scss';\n\nconst b = block('relative-range-date-picker-dialog');\n\nexport interface PickerDialogProps extends PickerFormProps, PopupStyleProps {\n /** Popup anchor /\n anchor: HTMLElement \| null;\n /* Manages `Popup` visibility /\n open: boolean;\n /* Handles popup close event /\n onClose: (reason?: Parameters<NonNullable<PopupProps['onOpenChange']>>[2] \| 'apply') => void;\n /* Handles popup remove from DOM event /\n onRemove?: () => void;\n /* If true `Popup` act like a modal dialog /\n modal?: boolean;\n /* Element which focus should be returned to /\n returnFocus?: PopupProps['returnFocus'];\n /* If true `Sheet` is used instead of `Popup` */\n isMobile?: boolean;\n}\n\nexport function PickerDialog({\n open,\n onClose,\n isMobile,\n anchor,\n popupClassName,\n popupStyle,\n popupPlacement,\n popupOffset,\n modal,\n returnFocus = false,\n onRemove,\n ...props\n}: PickerDialogProps) {\n if (isMobile) {\n return (\n <Sheet\n visible={open}\n onClose={() => {\n onClose('outside-press');\n setTimeout(() => {\n onRemove?.();\n });\n }}\n contentClassName={b('content', {mobile: true, size: 'xl'}, popupClassName)}\n >\n <PickerForm\n {...props}\n size=\"xl\"\n onApply={() => {\n onClose('apply');\n }}\n />\n </Sheet>\n );\n }\n\n return (\n <Popup\n open={open}\n onOpenChange={(isOpen, _event, reason) => {\n if (!isOpen) {\n onClose(reason);\n }\n }}\n placement={popupPlacement}\n offset={popupOffset}\n role=\"dialog\"\n anchorElement={anchor}\n className={b('content', {size: props.size}, popupClassName)}\n style={popupStyle}\n modal={modal}\n returnFocus={returnFocus}\n onTransitionOutComplete={onRemove}\n >\n <PickerForm\n {...props}\n onApply={() => {\n onClose('apply');\n }}\n />\n </Popup>\n );\n}\n"]}

package/dist/esm/components/RelativeRangeDatePicker/types.d.ts CHANGED Viewed

@@ -12,6 +12,7 @@ export interface RelativeRangeDatePickerRenderControlProps {
     errorMessage?: React.ReactNode;
     validationState?: 'invalid';
     open: boolean;
+    setOpen: (open: boolean) => void;
     triggerProps: RelativeRangeDatePickerTriggerProps;
 }
 export interface RelativeRangeDatePickerProps extends RelativeRangeDatePickerStateOptions, DomProps, AccessibilityProps, InputBase, InputDOMProps, TextInputProps, Validation, FocusableProps, StyleProps, PopupStyleProps {

package/dist/esm/components/RelativeRangeDatePicker/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.js","sourceRoot":"../../../../src","sources":["components/RelativeRangeDatePicker/types.ts"],"names":[],"mappings":"","sourcesContent":["import type {DateTime} from '@gravity-ui/date-utils';\n\nimport type {Value} from '../RelativeDatePicker';\nimport type {\n AccessibilityProps,\n DomProps,\n FocusableProps,\n InputBase,\n InputDOMProps,\n PopupStyleProps,\n RangeValue,\n StyleProps,\n TextInputProps,\n Validation,\n} from '../types';\n\nimport type {Preset} from './components/Presets/defaultPresets';\nimport type {PresetTab} from './components/Presets/utils';\nimport type {\n RelativeRangeDatePickerStateOptions,\n RelativeRangeDatePickerValue,\n} from './hooks/useRelativeRangeDatePickerState';\n\nexport type RelativeRangeDatePickerTriggerProps = Pick<\n React.AllHTMLAttributes<HTMLElement>,\n \| 'id'\n \| 'role'\n \| 'aria-controls'\n \| 'aria-haspopup'\n \| 'aria-expanded'\n \| 'aria-label'\n \| 'aria-labelledby'\n \| 'aria-describedby'\n \| 'aria-details'\n \| 'onClick'\n \| 'onKeyDown'\n \| 'disabled'\n \| 'readOnly'\n>;\n\nexport interface RelativeRangeDatePickerRenderControlProps {\n ref: React.Ref<HTMLElement>;\n value: RelativeRangeDatePickerValue \| null;\n title: string;\n errorMessage?: React.ReactNode;\n validationState?: 'invalid';\n open: boolean;\n triggerProps: RelativeRangeDatePickerTriggerProps;\n}\n\nexport interface RelativeRangeDatePickerProps\n extends RelativeRangeDatePickerStateOptions,\n DomProps,\n AccessibilityProps,\n InputBase,\n InputDOMProps,\n TextInputProps,\n Validation,\n FocusableProps,\n StyleProps,\n PopupStyleProps {\n /** Format of the date when rendered in the input. [Available formats](https://day.js.org/docs/en/display/format) /\n format?: string;\n /* A placeholder date that controls the default values of each segment when the user first interacts with them. Defaults to today's date at midnight. /\n placeholderValue?: DateTime;\n /* Apply changes with button /\n withApplyButton?: boolean;\n /* Show time zone selector /\n withZonesList?: boolean;\n /* Show relative range presets /\n withPresets?: boolean;\n /* Custom preset tabs /\n presetTabs?: PresetTab[];\n /* Custom docs for presets, if empty array docs will be hidden /\n docs?: Preset[];\n /* Show selected relative values as absolute dates /\n alwaysShowAsAbsolute?: boolean;\n /* /\n getRangeTitle?: (value: RangeValue<Value \| null> \| null, timeZone: string) => string;\n /* Handler that is called when the popup's open state changes. /\n onOpenChange?: (open: boolean) => void;\n /* Used to render control. */\n renderControl?: (props: RelativeRangeDatePickerRenderControlProps) => React.ReactElement;\n}\n"]}
1	+ {"version":3,"file":"types.js","sourceRoot":"../../../../src","sources":["components/RelativeRangeDatePicker/types.ts"],"names":[],"mappings":"","sourcesContent":["import type {DateTime} from '@gravity-ui/date-utils';\n\nimport type {Value} from '../RelativeDatePicker';\nimport type {\n AccessibilityProps,\n DomProps,\n FocusableProps,\n InputBase,\n InputDOMProps,\n PopupStyleProps,\n RangeValue,\n StyleProps,\n TextInputProps,\n Validation,\n} from '../types';\n\nimport type {Preset} from './components/Presets/defaultPresets';\nimport type {PresetTab} from './components/Presets/utils';\nimport type {\n RelativeRangeDatePickerStateOptions,\n RelativeRangeDatePickerValue,\n} from './hooks/useRelativeRangeDatePickerState';\n\nexport type RelativeRangeDatePickerTriggerProps = Pick<\n React.AllHTMLAttributes<HTMLElement>,\n \| 'id'\n \| 'role'\n \| 'aria-controls'\n \| 'aria-haspopup'\n \| 'aria-expanded'\n \| 'aria-label'\n \| 'aria-labelledby'\n \| 'aria-describedby'\n \| 'aria-details'\n \| 'onClick'\n \| 'onKeyDown'\n \| 'disabled'\n \| 'readOnly'\n>;\n\nexport interface RelativeRangeDatePickerRenderControlProps {\n ref: React.Ref<HTMLElement>;\n value: RelativeRangeDatePickerValue \| null;\n title: string;\n errorMessage?: React.ReactNode;\n validationState?: 'invalid';\n open: boolean;\n setOpen: (open: boolean) => void;\n triggerProps: RelativeRangeDatePickerTriggerProps;\n}\n\nexport interface RelativeRangeDatePickerProps\n extends RelativeRangeDatePickerStateOptions,\n DomProps,\n AccessibilityProps,\n InputBase,\n InputDOMProps,\n TextInputProps,\n Validation,\n FocusableProps,\n StyleProps,\n PopupStyleProps {\n /** Format of the date when rendered in the input. [Available formats](https://day.js.org/docs/en/display/format) /\n format?: string;\n /* A placeholder date that controls the default values of each segment when the user first interacts with them. Defaults to today's date at midnight. /\n placeholderValue?: DateTime;\n /* Apply changes with button /\n withApplyButton?: boolean;\n /* Show time zone selector /\n withZonesList?: boolean;\n /* Show relative range presets /\n withPresets?: boolean;\n /* Custom preset tabs /\n presetTabs?: PresetTab[];\n /* Custom docs for presets, if empty array docs will be hidden /\n docs?: Preset[];\n /* Show selected relative values as absolute dates /\n alwaysShowAsAbsolute?: boolean;\n /* /\n getRangeTitle?: (value: RangeValue<Value \| null> \| null, timeZone: string) => string;\n /* Handler that is called when the popup's open state changes. /\n onOpenChange?: (open: boolean) => void;\n /* Used to render control. */\n renderControl?: (props: RelativeRangeDatePickerRenderControlProps) => React.ReactElement;\n}\n"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/date-components",
-  "version": "3.0.2",
+  "version": "3.0.3",
   "description": "",
   "license": "MIT",
   "type": "commonjs",