@gravity-ui/date-components 2.11.0 → 2.12.0

package/dist/esm/components/DatePicker/DatePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePicker.js","sourceRoot":"../../../../src","sources":["components/DatePicker/DatePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport React from 'react';\n\nimport type {DateTime} from '@gravity-ui/date-utils';\nimport {Calendar as CalendarIcon, Clock as ClockIcon} from '@gravity-ui/icons';\nimport {Button, Icon, Popup, TextInput, useMobile} from '@gravity-ui/uikit';\n\nimport {Calendar} from '../Calendar';\nimport type {CalendarProps} from '../Calendar';\nimport {DateField} from '../DateField';\nimport {HiddenInput} from '../HiddenInput/HiddenInput';\nimport type {\n    AccessibilityProps,\n    DomProps,\n    FocusableProps,\n    InputDOMProps,\n    KeyboardEvents,\n    StyleProps,\n    TextInputProps,\n} from '../types';\n\nimport {MobileCalendar} from './MobileCalendar';\nimport {StubButton} from './StubButton';\nimport type {DatePickerStateOptions} from './hooks/datePickerStateFactory';\nimport {useDatePickerProps} from './hooks/useDatePickerProps';\nimport {useDatePickerState} from './hooks/useDatePickerState';\nimport {b} from './utils';\n\nimport './DatePicker.scss';\n\nexport interface DatePickerProps<T = DateTime>\n    extends DatePickerStateOptions<T>,\n        TextInputProps,\n        FocusableProps,\n        KeyboardEvents,\n        DomProps,\n        InputDOMProps,\n        StyleProps,\n        AccessibilityProps {\n    children?: (props: CalendarProps<T>) => React.ReactNode;\n    disablePortal?: boolean;\n    disableFocusTrap?: boolean;\n}\n\nexport function DatePicker({className, ...props}: DatePickerProps) {\n    const anchorRef = React.useRef<HTMLDivElement>(null);\n\n    const state = useDatePickerState(props);\n\n    const {groupProps, fieldProps, calendarButtonProps, popupProps, calendarProps, timeInputProps} =\n        useDatePickerProps(state, props);\n\n    const isMobile = useMobile();\n    const isOnlyTime = state.formatInfo.hasTime && !state.formatInfo.hasDate;\n\n    return (\n        <div className={b(null, className)} {...groupProps}>\n            {isMobile ? (\n                <MobileCalendar props={props} state={state} />\n            ) : (\n                !isOnlyTime && (\n                    <div ref={anchorRef} className={b('popup-anchor')}>\n                        <Popup anchorRef={anchorRef} {...popupProps}>\n                            <div className={b('popup-content')}>\n                                {typeof props.children === 'function' ? (\n                                    props.children(calendarProps)\n                                ) : (\n                                    <Calendar {...calendarProps} />\n                                )}\n                                {state.formatInfo.hasTime && (\n                                    <div className={b('time-field-wrapper')}>\n                                        <DateField {...timeInputProps} />\n                                    </div>\n                                )}\n                            </div>\n                        </Popup>\n                    </div>\n                )\n            )}\n            <TextInput\n                {...fieldProps}\n                className={b('field', {mobile: isMobile})}\n                hasClear={!isMobile && fieldProps.hasClear}\n                endContent={\n                    <React.Fragment>\n                        {!isMobile && !isOnlyTime && (\n                            <Button {...calendarButtonProps}>\n                                <Icon data={CalendarIcon} />\n                            </Button>\n                        )}\n                        {!isMobile && isOnlyTime && (\n                            <StubButton size={calendarButtonProps.size} icon={ClockIcon} />\n                        )}\n                        {isMobile && (\n                            <StubButton\n                                size={calendarButtonProps.size}\n                                icon={isOnlyTime ? ClockIcon : CalendarIcon}\n                            />\n                        )}\n                    </React.Fragment>\n                }\n            />\n            <HiddenInput\n                name={props.name}\n                value={state.value}\n                toStringValue={(value) => value?.toISOString() ?? ''}\n                onReset={(value) => {\n                    state.setValue(value);\n                }}\n                disabled={state.disabled}\n                form={props.form}\n            />\n        </div>\n    );\n}\n"]}

package/dist/esm/components/DatePicker/MobileCalendar.css

@@ -21,4 +21,5 @@
   margin: 0;
   padding: 0;
   cursor: pointer;
-}
+}
+/*# sourceMappingURL=MobileCalendar.css.map */

package/dist/esm/components/DatePicker/MobileCalendar.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["components/DatePicker/data:;charset=utf-8,@use%20'../variables';%0A%0A$block:%20'.%23%7Bvariables.$ns%7Dmobile-calendar';%0A%0A%23%7B$block%7D%20%7B%0A%20%20%20%20position:%20absolute;%0A%20%20%20%20z-index:%201;%0A%20%20%20%20inset-block-start:%200;%0A%20%20%20%20inset-inline-start:%200;%0A%0A%20%20%20%20box-sizing:%20border-box;%0A%20%20%20%20/%20width:%20100%25%20does%20not%20work%20in%20mobile%20Safari%0A%20%20%20%20min-width:%20100%25;%0A%20%20%20%20height:%20100%25;%0A%20%20%20%20margin:%200;%0A%20%20%20%20padding:%200;%0A%0A%20%20%20%20cursor:%20pointer;%0A%0A%20%20%20%20opacity:%200;%0A%20%20%20%20border:%20none;%0A%0A%20%20%20%20&::-webkit-calendar-picker-indicator%20%7B%0A%20%20%20%20%20%20%20%20position:%20absolute;%0A%20%20%20%20%20%20%20%20inset-block-start:%200;%0A%20%20%20%20%20%20%20%20inset-inline-start:%200;%0A%0A%20%20%20%20%20%20%20%20min-width:%20100%25;%0A%20%20%20%20%20%20%20%20height:%20100%25;%0A%20%20%20%20%20%20%20%20margin:%200;%0A%20%20%20%20%20%20%20%20padding:%200;%0A%0A%20%20%20%20%20%20%20%20cursor:%20pointer;%0A%20%20%20%20%7D%0A%7D%0A"],"names":[],"mappings":"AAIA;EACI;EACA;EACA;EACA;EAEA;EAEA;EACA;EACA;EACA;EAEA;EAEA;EACA;;AAEA;EACI;EACA;EACA;EAEA;EACA;EACA;EACA;EAEA","sourcesContent":["@use '../variables';\n\n$block: '.#{variables.$ns}mobile-calendar';\n\n#{$block} {\n    position: absolute;\n    z-index: 1;\n    inset-block-start: 0;\n    inset-inline-start: 0;\n\n    box-sizing: border-box;\n    // width: 100% does not work in mobile Safari\n    min-width: 100%;\n    height: 100%;\n    margin: 0;\n    padding: 0;\n\n    cursor: pointer;\n\n    opacity: 0;\n    border: none;\n\n    &::-webkit-calendar-picker-indicator {\n        position: absolute;\n        inset-block-start: 0;\n        inset-inline-start: 0;\n\n        min-width: 100%;\n        height: 100%;\n        margin: 0;\n        padding: 0;\n\n        cursor: pointer;\n    }\n}\n"],"file":"MobileCalendar.css"}

package/dist/esm/components/DatePicker/MobileCalendar.d.ts

@@ -1,6 +1,6 @@
-import type { DatePickerProps } from './DatePicker';
-import type { DatePickerState } from './hooks/useDatePickerState';
-import './MobileCalendar.css';
+import type { DatePickerProps } from "./DatePicker.js";
+import type { DatePickerState } from "./hooks/useDatePickerState.js";
+import "./MobileCalendar.css";
 interface MobileCalendarProps {
     props: DatePickerProps;
     state: DatePickerState;

package/dist/esm/components/DatePicker/MobileCalendar.js

@@ -1,17 +1,17 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { dateTime } from '@gravity-ui/date-utils';
-import { block } from '../../utils/cn';
-import { createPlaceholderValue, mergeDateTime } from '../utils/dates';
-import './MobileCalendar.css';
+import { block } from "../../utils/cn.js";
+import { createPlaceholderValue, mergeDateTime } from "../utils/dates.js";
+import "./MobileCalendar.css";
 const b = block('mobile-calendar');
 export function MobileCalendar({ props, state }) {
     var _a, _b;
     let type = 'date';
-    if (state.hasTime && state.hasDate) {
+    if (state.formatInfo.hasTime && state.formatInfo.hasDate) {
         type = 'datetime-local';
     }
-    else if (state.hasTime) {
+    else if (state.formatInfo.hasTime) {
         type = 'time';
     }
     return (_jsx("input", { className: b(), disabled: props.disabled, type: type, value: formatNative(state.dateFieldState.value, type), id: props.id, min: formatNative((_a = props.minValue) === null || _a === void 0 ? void 0 : _a.timeZone(state.timeZone), type), max: formatNative((_b = props.maxValue) === null || _b === void 0 ? void 0 : _b.timeZone(state.timeZone), type), tabIndex: -1, onChange: (e) => {
@@ -26,13 +26,13 @@ export function MobileCalendar({ props, state }) {
                     format: getDateFormat(type),
                     timeZone: 'system',
                 }).timeZone(state.timeZone, true);
-                let newDate = state.hasDate
+                let newDate = state.formatInfo.hasDate
                     ? localDate
                     : createPlaceholderValue({
                         placeholderValue: (_a = props.placeholderValue) === null || _a === void 0 ? void 0 : _a.timeZone(state.timeZone),
                         timeZone: state.timeZone,
                     });
-                if (state.hasTime) {
+                if (state.formatInfo.hasTime) {
                     newDate = mergeDateTime(newDate, localDate);
                 }
                 else if (state.value) {
@@ -71,3 +71,4 @@ function formatNative(date, type) {
     const format = getDateFormat(type);
     return date.format(format);
 }
+//# sourceMappingURL=MobileCalendar.js.map

package/dist/esm/components/DatePicker/MobileCalendar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MobileCalendar.js","sourceRoot":"../../../../src","sources":["components/DatePicker/MobileCalendar.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAC,QAAQ,EAAC,MAAM,wBAAwB,CAAC;AAGhD,OAAO,EAAC,KAAK,EAAC,0BAAuB;AACrC,OAAO,EAAC,sBAAsB,EAAE,aAAa,EAAC,0BAAuB;AAKrE,8BAA+B;AAE/B,MAAM,CAAC,GAAG,KAAK,CAAC,iBAAiB,CAAC,CAAC;AAQnC,MAAM,UAAU,cAAc,CAAC,EAAC,KAAK,EAAE,KAAK,EAAsB;;IAC9D,IAAI,IAAI,GAAkB,MAAM,CAAC;IACjC,IAAI,KAAK,CAAC,UAAU,CAAC,OAAO,IAAI,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,CAAC;QACvD,IAAI,GAAG,gBAAgB,CAAC;IAC5B,CAAC;SAAM,IAAI,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,CAAC;QAClC,IAAI,GAAG,MAAM,CAAC;IAClB,CAAC;IAED,OAAO,CACH,gBACI,SAAS,EAAE,CAAC,EAAE,EACd,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,EAAE,IAAI,CAAC,EACrD,EAAE,EAAE,KAAK,CAAC,EAAE,EACZ,GAAG,EAAE,YAAY,CAAC,MAAA,KAAK,CAAC,QAAQ,0CAAE,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,EACjE,GAAG,EAAE,YAAY,CAAC,MAAA,KAAK,CAAC,QAAQ,0CAAE,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,EACjE,QAAQ,EAAE,CAAC,CAAC,EACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;;YACZ,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;gBACjB,OAAO;YACX,CAAC;YACD,MAAM,QAAQ,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;YAChC,IAAI,QAAQ,EAAE,CAAC;gBACX,MAAM,SAAS,GAAG,QAAQ,CAAC;oBACvB,KAAK,EAAE,QAAQ;oBACf,MAAM,EAAE,aAAa,CAAC,IAAI,CAAC;oBAC3B,QAAQ,EAAE,QAAQ;iBACrB,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC;gBAClC,IAAI,OAAO,GAAG,KAAK,CAAC,UAAU,CAAC,OAAO;oBAClC,CAAC,CAAC,SAAS;oBACX,CAAC,CAAC,sBAAsB,CAAC;wBACnB,gBAAgB,EAAE,MAAA,KAAK,CAAC,gBAAgB,0CAAE,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC;wBAClE,QAAQ,EAAE,KAAK,CAAC,QAAQ;qBAC3B,CAAC,CAAC;gBACT,IAAI,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,CAAC;oBAC3B,OAAO,GAAG,aAAa,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;gBAChD,CAAC;qBAAM,IAAI,KAAK,CAAC,KAAK,EAAE,CAAC;oBACrB,OAAO,GAAG,aAAa,CAAC,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;gBAC3E,CAAC;qBAAM,CAAC;oBACJ,OAAO,GAAG,aAAa,CACnB,OAAO,EACP,sBAAsB,CAAC;wBACnB,gBAAgB,EAAE,MAAA,KAAK,CAAC,gBAAgB,0CAAE,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC;wBAClE,QAAQ,EAAE,KAAK,CAAC,QAAQ;qBAC3B,CAAC,CACL,CAAC;gBACN,CAAC;gBACD,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;YAC5B,CAAC;iBAAM,CAAC;gBACJ,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;YACzB,CAAC;QACL,CAAC,GACH,CACL,CAAC;AACN,CAAC;AAED,SAAS,aAAa,CAAC,IAAmB;IACtC,QAAQ,IAAI,EAAE,CAAC;QACX,KAAK,MAAM,CAAC,CAAC,CAAC;YACV,OAAO,OAAO,CAAC;QACnB,CAAC;QACD,KAAK,gBAAgB,CAAC,CAAC,CAAC;YACpB,OAAO,kBAAkB,CAAC;QAC9B,CAAC;QACD,OAAO,CAAC,CAAC,CAAC;YACN,OAAO,YAAY,CAAC;QACxB,CAAC;IACL,CAAC;AACL,CAAC;AACD,SAAS,YAAY,CAAC,IAAiC,EAAE,IAAmB;IACxE,IAAI,CAAC,IAAI,EAAE,CAAC;QACR,OAAO,EAAE,CAAC;IACd,CAAC;IAED,MAAM,MAAM,GAAG,aAAa,CAAC,IAAI,CAAC,CAAC;IACnC,OAAO,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;AAC/B,CAAC","sourcesContent":["'use client';\n\nimport {dateTime} from '@gravity-ui/date-utils';\nimport type {DateTime} from '@gravity-ui/date-utils';\n\nimport {block} from '../../utils/cn';\nimport {createPlaceholderValue, mergeDateTime} from '../utils/dates';\n\nimport type {DatePickerProps} from './DatePicker';\nimport type {DatePickerState} from './hooks/useDatePickerState';\n\nimport './MobileCalendar.scss';\n\nconst b = block('mobile-calendar');\n\ntype InputDateType = 'date' | 'time' | 'datetime-local';\n\ninterface MobileCalendarProps {\n    props: DatePickerProps;\n    state: DatePickerState;\n}\nexport function MobileCalendar({props, state}: MobileCalendarProps) {\n    let type: InputDateType = 'date';\n    if (state.formatInfo.hasTime && state.formatInfo.hasDate) {\n        type = 'datetime-local';\n    } else if (state.formatInfo.hasTime) {\n        type = 'time';\n    }\n\n    return (\n        <input\n            className={b()}\n            disabled={props.disabled}\n            type={type}\n            value={formatNative(state.dateFieldState.value, type)}\n            id={props.id}\n            min={formatNative(props.minValue?.timeZone(state.timeZone), type)}\n            max={formatNative(props.maxValue?.timeZone(state.timeZone), type)}\n            tabIndex={-1}\n            onChange={(e) => {\n                if (props.readOnly) {\n                    return;\n                }\n                const newValue = e.target.value;\n                if (newValue) {\n                    const localDate = dateTime({\n                        input: newValue,\n                        format: getDateFormat(type),\n                        timeZone: 'system',\n                    }).timeZone(state.timeZone, true);\n                    let newDate = state.formatInfo.hasDate\n                        ? localDate\n                        : createPlaceholderValue({\n                              placeholderValue: props.placeholderValue?.timeZone(state.timeZone),\n                              timeZone: state.timeZone,\n                          });\n                    if (state.formatInfo.hasTime) {\n                        newDate = mergeDateTime(newDate, localDate);\n                    } else if (state.value) {\n                        newDate = mergeDateTime(newDate, state.value.timeZone(state.timeZone));\n                    } else {\n                        newDate = mergeDateTime(\n                            newDate,\n                            createPlaceholderValue({\n                                placeholderValue: props.placeholderValue?.timeZone(state.timeZone),\n                                timeZone: state.timeZone,\n                            }),\n                        );\n                    }\n                    state.setValue(newDate);\n                } else {\n                    state.setValue(null);\n                }\n            }}\n        />\n    );\n}\n\nfunction getDateFormat(type: InputDateType) {\n    switch (type) {\n        case 'time': {\n            return 'HH:mm';\n        }\n        case 'datetime-local': {\n            return 'YYYY-MM-DDTHH:mm';\n        }\n        default: {\n            return 'YYYY-MM-DD';\n        }\n    }\n}\nfunction formatNative(date: DateTime | null | undefined, type: InputDateType) {\n    if (!date) {\n        return '';\n    }\n\n    const format = getDateFormat(type);\n    return date.format(format);\n}\n"]}

package/dist/esm/components/DatePicker/StubButton.css

@@ -23,4 +23,5 @@
   justify-content: center;
   align-items: center;
   color: var(--g-color-text-secondary);
-}
+}
+/*# sourceMappingURL=StubButton.css.map */

package/dist/esm/components/DatePicker/StubButton.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["components/DatePicker/data:;charset=utf-8,@use%20'../variables';%0A%0A$block:%20'.%23%7Bvariables.$ns%7Dstub-button';%0A%0A%23%7B$block%7D%20%7B%0A%20%20%20%20position:%20relative;%0A%0A%20%20%20%20display:%20inline-block;%0A%0A%20%20%20%20width:%2024px;%0A%20%20%20%20height:%2024px;%0A%0A%20%20%20%20&_size_xs%20%7B%0A%20%20%20%20%20%20%20%20width:%2020px;%0A%20%20%20%20%20%20%20%20height:%2020px;%0A%20%20%20%20%7D%0A%0A%20%20%20%20&_size_m%20%7B%0A%20%20%20%20%20%20%20%20width:%2028px;%0A%20%20%20%20%20%20%20%20height:%2028px;%0A%20%20%20%20%7D%0A%0A%20%20%20%20&_size_l%20%7B%0A%20%20%20%20%20%20%20%20width:%2036px;%0A%20%20%20%20%20%20%20%20height:%2036px;%0A%20%20%20%20%7D%0A%0A%20%20%20%20&__icon%20%7B%0A%20%20%20%20%20%20%20%20position:%20absolute;%0A%20%20%20%20%20%20%20%20inset:%200;%0A%0A%20%20%20%20%20%20%20%20display:%20flex;%0A%20%20%20%20%20%20%20%20justify-content:%20center;%0A%20%20%20%20%20%20%20%20align-items:%20center;%0A%0A%20%20%20%20%20%20%20%20color:%20var(--g-color-text-secondary);%0A%20%20%20%20%7D%0A%7D%0A"],"names":[],"mappings":"AAIA;EACI;EAEA;EAEA;EACA;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;EAEA;EACA;EACA;EAEA","sourcesContent":["@use '../variables';\n\n$block: '.#{variables.$ns}stub-button';\n\n#{$block} {\n    position: relative;\n\n    display: inline-block;\n\n    width: 24px;\n    height: 24px;\n\n    &_size_xs {\n        width: 20px;\n        height: 20px;\n    }\n\n    &_size_m {\n        width: 28px;\n        height: 28px;\n    }\n\n    &_size_l {\n        width: 36px;\n        height: 36px;\n    }\n\n    &__icon {\n        position: absolute;\n        inset: 0;\n\n        display: flex;\n        justify-content: center;\n        align-items: center;\n\n        color: var(--g-color-text-secondary);\n    }\n}\n"],"file":"StubButton.css"}

package/dist/esm/components/DatePicker/StubButton.d.ts

@@ -1,5 +1,5 @@
 import type { ButtonSize, IconData } from '@gravity-ui/uikit';
-import './StubButton.css';
+import "./StubButton.css";
 interface StubButtonProps {
     size?: ButtonSize;
     icon: IconData;

package/dist/esm/components/DatePicker/StubButton.js

@@ -1,8 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Icon } from '@gravity-ui/uikit';
-import { block } from '../../utils/cn';
-import './StubButton.css';
+import { block } from "../../utils/cn.js";
+import "./StubButton.css";
 const b = block('stub-button');
 export function StubButton({ size, icon }) {
     return (_jsx("span", { className: b({ size }), children: _jsx("span", { className: b('icon'), children: _jsx(Icon, { data: icon }) }) }));
 }
+//# sourceMappingURL=StubButton.js.map

package/dist/esm/components/DatePicker/StubButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StubButton.js","sourceRoot":"../../../../src","sources":["components/DatePicker/StubButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,mBAAmB,CAAC;AAGvC,OAAO,EAAC,KAAK,EAAC,0BAAuB;AAErC,0BAA2B;AAE3B,MAAM,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC;AAM/B,MAAM,UAAU,UAAU,CAAC,EAAC,IAAI,EAAE,IAAI,EAAkB;IACpD,OAAO,CACH,eAAM,SAAS,EAAE,CAAC,CAAC,EAAC,IAAI,EAAC,CAAC,YACtB,eAAM,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YACtB,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,GAAI,GACjB,GACJ,CACV,CAAC;AACN,CAAC","sourcesContent":["import {Icon} from '@gravity-ui/uikit';\nimport type {ButtonSize, IconData} from '@gravity-ui/uikit';\n\nimport {block} from '../../utils/cn';\n\nimport './StubButton.scss';\n\nconst b = block('stub-button');\n\ninterface StubButtonProps {\n    size?: ButtonSize;\n    icon: IconData;\n}\nexport function StubButton({size, icon}: StubButtonProps) {\n    return (\n        <span className={b({size})}>\n            <span className={b('icon')}>\n                <Icon data={icon} />\n            </span>\n        </span>\n    );\n}\n"]}

package/dist/esm/components/DatePicker/hooks/datePickerStateFactory.d.ts

@@ -1,6 +1,7 @@
 import type { DateTime } from '@gravity-ui/date-utils';
-import type { DateFieldState } from '../../DateField';
-import type { DateFieldBase, PopupTriggerProps } from '../../types';
+import type { DateFieldState } from "../../DateField/index.js";
+import type { FormatInfo } from "../../DateField/types.js";
+import type { DateFieldBase, PopupTriggerProps } from "../../types/index.js";
 type OpenChangeReason = 'EscapeKeyDown' | 'FocusOut' | 'ClickOutside' | 'ValueSelected' | 'TriggerButtonClick' | 'ShortcutKeyDown';
 export interface DatePickerState<T = DateTime> {
     /** The currently selected date. */
@@ -27,9 +28,17 @@ export interface DatePickerState<T = DateTime> {
     disabled?: boolean;
     /** Format of the date when rendered in the input. */
     format: string;
-    /** Whether the date picker supports selecting a date. */
+    /** Format info */
+    formatInfo: FormatInfo;
+    /**
+     * @deprecated use formatInfo.hasDate instead
+     * Whether the date picker supports selecting a date.
+     */
     hasDate: boolean;
-    /** Whether the date picker supports selecting a time. */
+    /**
+     * @deprecated use formatInfo.hasTime instead
+     * Whether the date picker supports selecting a time.
+     */
     hasTime: boolean;
     /** Format of the time when rendered in the input. */
     timeFormat?: string;
@@ -46,8 +55,9 @@ export interface DatePickerStateFactoryOptions<T, O extends DateFieldBase<T>> {
     setTimezone: (date: T, timeZone: string) => T;
     getDateTime: (date: T | null | undefined) => DateTime | undefined;
     useDateFieldState: (props: O) => DateFieldState<T>;
+    adjustDateToFormat: (date: T, info: FormatInfo) => T;
 }
 export interface DatePickerStateOptions<T> extends DateFieldBase<T>, PopupTriggerProps<[OpenChangeReason]> {
 }
-export declare function datePickerStateFactory<T, O extends DatePickerStateOptions<T>>({ getPlaceholderTime, mergeDateTime, setTimezone, getDateTime, useDateFieldState, }: DatePickerStateFactoryOptions<T, O>): (props: O) => DatePickerState<T>;
+export declare function datePickerStateFactory<T, O extends DatePickerStateOptions<T>>({ getPlaceholderTime, mergeDateTime, setTimezone, getDateTime, useDateFieldState, adjustDateToFormat, }: DatePickerStateFactoryOptions<T, O>): (props: O) => DatePickerState<T>;
 export {};

package/dist/esm/components/DatePicker/hooks/datePickerStateFactory.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { useControlledState } from '@gravity-ui/uikit';
-import { useDefaultTimeZone } from '../../utils/useDefaultTimeZone';
-export function datePickerStateFactory({ getPlaceholderTime, mergeDateTime, setTimezone, getDateTime, useDateFieldState, }) {
+import { useDefaultTimeZone } from "../../utils/useDefaultTimeZone.js";
+export function datePickerStateFactory({ getPlaceholderTime, mergeDateTime, setTimezone, getDateTime, useDateFieldState, adjustDateToFormat, }) {
     return function useDatePickerState(props) {
         var _a, _b;
         const { disabled, readOnly } = props;
@@ -35,7 +35,7 @@ export function datePickerStateFactory({ getPlaceholderTime, mergeDateTime, setT
             disabled,
             readOnly, validationState: props.validationState, minValue: props.minValue, maxValue: props.maxValue, isDateUnavailable: props.isDateUnavailable, format, placeholderValue: props.placeholderValue, timeZone }));
         const timeFormat = React.useMemo(() => {
-            if (!dateFieldState.hasTime) {
+            if (!dateFieldState.formatInfo.hasTime) {
                 return undefined;
             }
             const timeFormatParts = [];
@@ -53,11 +53,11 @@ export function datePickerStateFactory({ getPlaceholderTime, mergeDateTime, setT
             }
             const dayPeriod = dateFieldState.sections.find((s) => s.type === 'dayPeriod');
             return timeFormatParts.join(':') + (dayPeriod ? ` ${dayPeriod.format}` : '');
-        }, [dateFieldState.hasTime, dateFieldState.sections]);
+        }, [dateFieldState.formatInfo.hasTime, dateFieldState.sections]);
         if (value) {
             selectedDate = setTimezone(value, timeZone);
-            if (dateFieldState.hasTime) {
-                selectedTime = setTimezone(value, timeZone);
+            if (dateFieldState.formatInfo.hasTime) {
+                selectedTime = selectedDate;
             }
         }
         // Intercept setValue to make sure the Time section is not changed by date selection in Calendar
@@ -65,17 +65,18 @@ export function datePickerStateFactory({ getPlaceholderTime, mergeDateTime, setT
             if (disabled || readOnly) {
                 return;
             }
-            const shouldClose = !dateFieldState.hasTime;
-            if (dateFieldState.hasTime) {
+            const newDate = adjustDateToFormat(newValue, dateFieldState.formatInfo);
+            const shouldClose = !dateFieldState.formatInfo.hasTime;
+            if (dateFieldState.formatInfo.hasTime) {
                 if (selectedTime || shouldClose) {
-                    commitValue(newValue, selectedTime || newValue);
+                    commitValue(newDate, selectedTime || newDate);
                 }
                 else {
-                    setSelectedDate(newValue);
+                    setSelectedDate(newDate);
                 }
             }
             else {
-                commitValue(newValue, newValue);
+                commitValue(newDate, newDate);
             }
             if (shouldClose) {
                 setOpen(false, 'ValueSelected');
@@ -85,7 +86,7 @@ export function datePickerStateFactory({ getPlaceholderTime, mergeDateTime, setT
             if (disabled || readOnly) {
                 return;
             }
-            const newTime = newValue !== null && newValue !== void 0 ? newValue : getPlaceholderTime(props.placeholderValue, timeZone);
+            const newTime = adjustDateToFormat(newValue !== null && newValue !== void 0 ? newValue : getPlaceholderTime(props.placeholderValue, timeZone), dateFieldState.formatInfo);
             if (selectedDate) {
                 commitValue(selectedDate, newTime);
             }
@@ -93,7 +94,7 @@ export function datePickerStateFactory({ getPlaceholderTime, mergeDateTime, setT
                 setSelectedTime(newTime);
             }
         };
-        if (dateFieldState.hasTime && !selectedTime) {
+        if (dateFieldState.formatInfo.hasTime && !selectedTime) {
             selectedTime = dateFieldState.displayValue;
         }
         return {
@@ -116,13 +117,14 @@ export function datePickerStateFactory({ getPlaceholderTime, mergeDateTime, setT
             disabled,
             readOnly,
             format,
-            hasDate: dateFieldState.hasDate,
-            hasTime: dateFieldState.hasTime,
+            formatInfo: dateFieldState.formatInfo,
+            hasDate: dateFieldState.formatInfo.hasDate,
+            hasTime: dateFieldState.formatInfo.hasTime,
             timeFormat,
             timeZone,
             isOpen,
             setOpen(newIsOpen, reason) {
-                if (!newIsOpen && !value && selectedDate && dateFieldState.hasTime) {
+                if (!newIsOpen && !value && selectedDate && dateFieldState.formatInfo.hasTime) {
                     commitValue(selectedDate, selectedTime || getPlaceholderTime(props.placeholderValue, props.timeZone));
                 }
                 setOpen(newIsOpen, reason);
@@ -131,3 +133,4 @@ export function datePickerStateFactory({ getPlaceholderTime, mergeDateTime, setT
         };
     };
 }
+//# sourceMappingURL=datePickerStateFactory.js.map

package/dist/esm/components/DatePicker/hooks/datePickerStateFactory.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datePickerStateFactory.js","sourceRoot":"../../../../../src","sources":["components/DatePicker/hooks/datePickerStateFactory.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport type {DateTime} from '@gravity-ui/date-utils';\nimport {useControlledState} from '@gravity-ui/uikit';\n\nimport type {DateFieldState} from '../../DateField';\nimport type {FormatInfo} from '../../DateField/types';\nimport type {DateFieldBase, PopupTriggerProps} from '../../types';\nimport {useDefaultTimeZone} from '../../utils/useDefaultTimeZone';\n\ntype OpenChangeReason =\n    | 'EscapeKeyDown'\n    | 'FocusOut'\n    | 'ClickOutside'\n    | 'ValueSelected'\n    | 'TriggerButtonClick'\n    | 'ShortcutKeyDown';\n\nexport interface DatePickerState<T = DateTime> {\n    /** The currently selected date. */\n    value: T | null;\n    /** Sets the selected date. */\n    setValue: (value: T | null) => void;\n    /**\n     * The date portion of the value. This may be set prior to `value` if the user has\n     * selected a date but has not yet selected a time.\n     */\n    dateValue: T | null;\n    /** Sets the date portion of the value. */\n    setDateValue: (value: T) => void;\n    /**\n     * The time portion of the value. This may be set prior to `value` if the user has\n     * selected a time but has not yet selected a date.\n     */\n    timeValue: T | null;\n    /** Sets the time portion of the value. */\n    setTimeValue: (value: T | null) => void;\n    /** Whether the field is read only. */\n    readOnly?: boolean;\n    /** Whether the field is disabled. */\n    disabled?: boolean;\n    /** Format of the date when rendered in the input. */\n    format: string;\n    /** Format info */\n    formatInfo: FormatInfo;\n    /**\n     * @deprecated use formatInfo.hasDate instead\n     * Whether the date picker supports selecting a date.\n     */\n    hasDate: boolean;\n    /**\n     * @deprecated use formatInfo.hasTime instead\n     * Whether the date picker supports selecting a time.\n     */\n    hasTime: boolean;\n    /** Format of the time when rendered in the input. */\n    timeFormat?: string;\n    timeZone: string;\n    /** Whether the calendar popover is currently open. */\n    isOpen: boolean;\n    /** Sets whether the calendar popover is open. */\n    setOpen: (isOpen: boolean, reason: OpenChangeReason) => void;\n    dateFieldState: DateFieldState<T>;\n}\n\nexport interface DatePickerStateFactoryOptions<T, O extends DateFieldBase<T>> {\n    getPlaceholderTime: (placeholderValue: DateTime | undefined, timeZone?: string) => T;\n    mergeDateTime: (date: T, time: T) => T;\n    setTimezone: (date: T, timeZone: string) => T;\n    getDateTime: (date: T | null | undefined) => DateTime | undefined;\n    useDateFieldState: (props: O) => DateFieldState<T>;\n    adjustDateToFormat: (date: T, info: FormatInfo) => T;\n}\n\nexport interface DatePickerStateOptions<T>\n    extends DateFieldBase<T>,\n        PopupTriggerProps<[OpenChangeReason]> {}\n\nexport function datePickerStateFactory<T, O extends DatePickerStateOptions<T>>({\n    getPlaceholderTime,\n    mergeDateTime,\n    setTimezone,\n    getDateTime,\n    useDateFieldState,\n    adjustDateToFormat,\n}: DatePickerStateFactoryOptions<T, O>) {\n    return function useDatePickerState(props: O): DatePickerState<T> {\n        const {disabled, readOnly} = props;\n        const [isOpen, _setOpen] = useControlledState(\n            props.open,\n            props.defaultOpen ?? false,\n            props.onOpenChange,\n        );\n\n        const setOpen: NonNullable<typeof props.onOpenChange> = _setOpen;\n\n        const [value, setValue] = useControlledState(\n            props.value as never,\n            props.defaultValue ?? null,\n            props.onUpdate,\n        );\n        const [selectedDateInner, setSelectedDate] = React.useState<T | null>(null);\n        const [selectedTimeInner, setSelectedTime] = React.useState<T | null>(null);\n\n        const inputTimeZone = useDefaultTimeZone(\n            getDateTime(props.value) || getDateTime(props.defaultValue) || props.placeholderValue,\n        );\n        const timeZone = props.timeZone || inputTimeZone;\n\n        let selectedDate = selectedDateInner;\n        let selectedTime = selectedTimeInner;\n\n        const format = props.format || 'L';\n\n        const commitValue = (date: T, time: T) => {\n            if (disabled || readOnly) {\n                return;\n            }\n\n            setValue(setTimezone(mergeDateTime(date, time), inputTimeZone));\n            setSelectedDate(null);\n            setSelectedTime(null);\n        };\n\n        const dateFieldState = useDateFieldState({\n            ...props,\n            value,\n            onUpdate(date: T | null) {\n                if (date) {\n                    commitValue(date, date);\n                } else {\n                    setValue(null);\n                }\n            },\n            disabled,\n            readOnly,\n            validationState: props.validationState,\n            minValue: props.minValue,\n            maxValue: props.maxValue,\n            isDateUnavailable: props.isDateUnavailable,\n            format,\n            placeholderValue: props.placeholderValue,\n            timeZone,\n        });\n\n        const timeFormat = React.useMemo(() => {\n            if (!dateFieldState.formatInfo.hasTime) {\n                return undefined;\n            }\n            const timeFormatParts: string[] = [];\n            const hours = dateFieldState.sections.find((s) => s.type === 'hour');\n            if (hours) {\n                timeFormatParts.push(hours.format);\n            }\n            const minutes = dateFieldState.sections.find((s) => s.type === 'minute');\n            if (minutes) {\n                timeFormatParts.push(minutes.format);\n            }\n            const seconds = dateFieldState.sections.find((s) => s.type === 'second');\n            if (seconds) {\n                timeFormatParts.push(seconds.format);\n            }\n            const dayPeriod = dateFieldState.sections.find((s) => s.type === 'dayPeriod');\n            return timeFormatParts.join(':') + (dayPeriod ? ` ${dayPeriod.format}` : '');\n        }, [dateFieldState.formatInfo.hasTime, dateFieldState.sections]);\n\n        if (value) {\n            selectedDate = setTimezone(value, timeZone);\n            if (dateFieldState.formatInfo.hasTime) {\n                selectedTime = selectedDate;\n            }\n        }\n\n        // Intercept setValue to make sure the Time section is not changed by date selection in Calendar\n        const selectDate = (newValue: T) => {\n            if (disabled || readOnly) {\n                return;\n            }\n\n            const newDate = adjustDateToFormat(newValue, dateFieldState.formatInfo);\n            const shouldClose = !dateFieldState.formatInfo.hasTime;\n            if (dateFieldState.formatInfo.hasTime) {\n                if (selectedTime || shouldClose) {\n                    commitValue(newDate, selectedTime || newDate);\n                } else {\n                    setSelectedDate(newDate);\n                }\n            } else {\n                commitValue(newDate, newDate);\n            }\n\n            if (shouldClose) {\n                setOpen(false, 'ValueSelected');\n            }\n        };\n\n        const selectTime = (newValue: T | null) => {\n            if (disabled || readOnly) {\n                return;\n            }\n\n            const newTime = adjustDateToFormat(\n                newValue ?? getPlaceholderTime(props.placeholderValue, timeZone),\n                dateFieldState.formatInfo,\n            );\n\n            if (selectedDate) {\n                commitValue(selectedDate, newTime);\n            } else {\n                setSelectedTime(newTime);\n            }\n        };\n\n        if (dateFieldState.formatInfo.hasTime && !selectedTime) {\n            selectedTime = dateFieldState.displayValue;\n        }\n\n        return {\n            value,\n            setValue(newDate: T | null) {\n                if (props.readOnly || props.disabled) {\n                    return;\n                }\n\n                if (newDate) {\n                    setValue(setTimezone(newDate, inputTimeZone));\n                } else {\n                    setValue(null);\n                }\n            },\n            dateValue: selectedDate,\n            timeValue: selectedTime,\n            setDateValue: selectDate,\n            setTimeValue: selectTime,\n            disabled,\n            readOnly,\n            format,\n            formatInfo: dateFieldState.formatInfo,\n            hasDate: dateFieldState.formatInfo.hasDate,\n            hasTime: dateFieldState.formatInfo.hasTime,\n            timeFormat,\n            timeZone,\n            isOpen,\n            setOpen(newIsOpen, reason) {\n                if (!newIsOpen && !value && selectedDate && dateFieldState.formatInfo.hasTime) {\n                    commitValue(\n                        selectedDate,\n                        selectedTime || getPlaceholderTime(props.placeholderValue, props.timeZone),\n                    );\n                }\n\n                setOpen(newIsOpen, reason);\n            },\n            dateFieldState,\n        };\n    };\n}\n"]}

package/dist/esm/components/DatePicker/hooks/useDatePickerProps.d.ts

@@ -1,11 +1,11 @@
 import React from 'react';
 import type { DateTime } from '@gravity-ui/date-utils';
 import type { ButtonProps, PopupProps, TextInputProps } from '@gravity-ui/uikit';
-import type { CalendarInstance, CalendarProps } from '../../Calendar';
-import type { DateFieldProps } from '../../DateField';
-import type { RangeValue } from '../../types';
-import type { DatePickerProps } from '../DatePicker';
-import type { DatePickerState } from './useDatePickerState';
+import type { CalendarInstance, CalendarProps } from "../../Calendar/index.js";
+import type { DateFieldProps } from "../../DateField/index.js";
+import type { RangeValue } from "../../types/index.js";
+import type { DatePickerProps } from "../DatePicker.js";
+import type { DatePickerState } from "./useDatePickerState.js";
 interface InnerDatePickerProps<T = DateTime> {
     groupProps: React.HTMLAttributes<unknown> & {
         ref: React.Ref<any>;

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

@@ -2,11 +2,11 @@ import { __rest } from "tslib";
 import React from 'react';
 import { isDateTime } from '@gravity-ui/date-utils';
 import { useFocusWithin, useForkRef } from '@gravity-ui/uikit';
-import { useDateFieldProps } from '../../DateField';
-import { getButtonSizeForInput } from '../../utils/getButtonSizeForInput';
-import { mergeProps } from '../../utils/mergeProps';
-import { i18n } from '../i18n';
-import { getDateTimeValue } from '../utils';
+import { useDateFieldProps } from "../../DateField/index.js";
+import { getButtonSizeForInput } from "../../utils/getButtonSizeForInput.js";
+import { mergeProps } from "../../utils/mergeProps.js";
+import { i18n } from "../i18n/index.js";
+import { getCalendarModes, getDateTimeValue } from "../utils/index.js";
 export function useDatePickerProps(state, _a) {
     var { onFocus, onBlur } = _a, props = __rest(_a, ["onFocus", "onBlur"]);
     const [isActive, setActive] = React.useState(false);
@@ -50,7 +50,8 @@ export function useDatePickerProps(state, _a) {
             (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus({ preventScroll: true });
         });
     }
-    const onlyTime = state.hasTime && !state.hasDate;
+    const onlyTime = state.formatInfo.hasTime && !state.formatInfo.hasDate;
+    const calendarModes = getCalendarModes(state.formatInfo);
     return {
         groupProps: Object.assign(Object.assign({ ref: groupRef, tabIndex: -1, role: 'group' }, focusWithinProps), { style: props.style, 'aria-disabled': state.disabled || undefined, onKeyDown: (e) => {
                 if (!onlyTime && e.altKey && (e.key === 'ArrowDown' || e.key === 'ArrowUp')) {
@@ -111,7 +112,7 @@ export function useDatePickerProps(state, _a) {
             readOnly: props.readOnly,
             onUpdate: (d) => {
                 state.setDateValue(d);
-                if (!state.hasTime) {
+                if (!state.formatInfo.hasTime) {
                     focusInput();
                 }
             },
@@ -122,6 +123,7 @@ export function useDatePickerProps(state, _a) {
             timeZone: state.timeZone,
             focusedValue: focusedDate,
             onFocusUpdate: setFocusedDate,
+            modes: calendarModes,
         },
         timeInputProps: {
             value: state.timeValue,
@@ -136,3 +138,4 @@ export function useDatePickerProps(state, _a) {
         },
     };
 }
+//# sourceMappingURL=useDatePickerProps.js.map

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

@@ -0,0 +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 {ButtonProps, 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: ButtonProps & {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            extraProps: {\n                'aria-label': i18n('Calendar'),\n                'aria-haspopup': 'dialog',\n                'aria-expanded': state.isOpen,\n            },\n            view: 'flat-secondary',\n            onClick: () => {\n                setActive(true);\n                state.setOpen(!state.isOpen, 'TriggerButtonClick');\n            },\n        },\n        popupProps: {\n            open: state.isOpen,\n            onEscapeKeyDown: () => {\n                state.setOpen(false, 'EscapeKeyDown');\n                focusInput();\n            },\n            onOutsideClick: (e) => {\n                if (e.target !== calendarButtonRef.current) {\n                    state.setOpen(false, 'ClickOutside');\n                }\n                if (e.target && groupRef.current?.contains(e.target as Node)) {\n                    focusInput();\n                }\n            },\n            onTransitionExited: () => {\n                setFocusedDate(\n                    isDateTime(state.dateFieldState.displayValue)\n                        ? state.dateFieldState.displayValue\n                        : state.dateFieldState.displayValue.start,\n                );\n            },\n            focusTrap: !props.disableFocusTrap,\n            disablePortal: props.disablePortal,\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/DatePicker/hooks/useDatePickerState.d.ts

@@ -1,6 +1,6 @@
 import type { DateTime } from '@gravity-ui/date-utils';
-import type { DateFieldBase } from '../../types';
-export type { DatePickerState } from './datePickerStateFactory';
+import type { DateFieldBase } from "../../types/index.js";
+export type { DatePickerState } from "./datePickerStateFactory.js";
 export interface DatePickerStateOptions extends DateFieldBase {
 }
-export declare const useDatePickerState: (props: import("../../DateField").DateFieldStateOptions) => import("./datePickerStateFactory").DatePickerState<DateTime>;
+export declare const useDatePickerState: (props: import("../../index.js").DateFieldStateOptions) => import("./datePickerStateFactory.js").DatePickerState<DateTime>;

package/dist/esm/components/DatePicker/hooks/useDatePickerState.js

@@ -1,14 +1,17 @@
-import { useDateFieldState } from '../../DateField';
-import { createPlaceholderValue, mergeDateTime } from '../../utils/dates';
-import { getDateTimeValue } from '../utils';
-import { datePickerStateFactory } from './datePickerStateFactory';
+import { useDateFieldState } from "../../DateField/index.js";
+import { adjustDateToFormat } from "../../DateField/utils.js";
+import { createPlaceholderValue, mergeDateTime } from "../../utils/dates.js";
+import { getDateTimeValue } from "../utils/index.js";
+import { datePickerStateFactory } from "./datePickerStateFactory.js";
 export const useDatePickerState = datePickerStateFactory({
     getPlaceholderTime,
     mergeDateTime,
     setTimezone: (date, timeZone) => date.timeZone(timeZone),
     getDateTime: getDateTimeValue,
     useDateFieldState,
+    adjustDateToFormat,
 });
 function getPlaceholderTime(placeholderValue, timeZone) {
     return createPlaceholderValue({ placeholderValue, timeZone });
 }
+//# sourceMappingURL=useDatePickerState.js.map

package/dist/esm/components/DatePicker/hooks/useDatePickerState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDatePickerState.js","sourceRoot":"../../../../../src","sources":["components/DatePicker/hooks/useDatePickerState.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,iBAAiB,EAAC,iCAAwB;AAClD,OAAO,EAAC,kBAAkB,EAAC,iCAA8B;AAEzD,OAAO,EAAC,sBAAsB,EAAE,aAAa,EAAC,6BAA0B;AACxE,OAAO,EAAC,gBAAgB,EAAC,0BAAiB;AAE1C,OAAO,EAAC,sBAAsB,EAAC,oCAAiC;AAMhE,MAAM,CAAC,MAAM,kBAAkB,GAAG,sBAAsB,CAAC;IACrD,kBAAkB;IAClB,aAAa;IACb,WAAW,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC;IACxD,WAAW,EAAE,gBAAgB;IAC7B,iBAAiB;IACjB,kBAAkB;CACrB,CAAC,CAAC;AAEH,SAAS,kBAAkB,CAAC,gBAAsC,EAAE,QAAiB;IACjF,OAAO,sBAAsB,CAAC,EAAC,gBAAgB,EAAE,QAAQ,EAAC,CAAC,CAAC;AAChE,CAAC","sourcesContent":["import type {DateTime} from '@gravity-ui/date-utils';\n\nimport {useDateFieldState} from '../../DateField';\nimport {adjustDateToFormat} from '../../DateField/utils';\nimport type {DateFieldBase} from '../../types';\nimport {createPlaceholderValue, mergeDateTime} from '../../utils/dates';\nimport {getDateTimeValue} from '../utils';\n\nimport {datePickerStateFactory} from './datePickerStateFactory';\n\nexport type {DatePickerState} from './datePickerStateFactory';\n\nexport interface DatePickerStateOptions extends DateFieldBase {}\n\nexport const useDatePickerState = datePickerStateFactory({\n    getPlaceholderTime,\n    mergeDateTime,\n    setTimezone: (date, timeZone) => date.timeZone(timeZone),\n    getDateTime: getDateTimeValue,\n    useDateFieldState,\n    adjustDateToFormat,\n});\n\nfunction getPlaceholderTime(placeholderValue: DateTime | undefined, timeZone?: string) {\n    return createPlaceholderValue({placeholderValue, timeZone});\n}\n"]}

package/dist/esm/components/DatePicker/i18n/index.js

@@ -1,5 +1,6 @@
 import { addComponentKeysets } from '@gravity-ui/uikit/i18n';
-import { NAMESPACE } from '../../../utils/cn';
-import en from './en.json';
-import ru from './ru.json';
+import { NAMESPACE } from "../../../utils/cn.js";
+import en from "./en.json";
+import ru from "./ru.json";
 export const i18n = addComponentKeysets({ en, ru }, `${NAMESPACE}date-picker`);
+//# sourceMappingURL=index.js.map

package/dist/esm/components/DatePicker/i18n/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../../src","sources":["components/DatePicker/i18n/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,mBAAmB,EAAC,MAAM,wBAAwB,CAAC;AAE3D,OAAO,EAAC,SAAS,EAAC,6BAA0B;AAE5C,OAAO,EAAE,kBAAkB;AAC3B,OAAO,EAAE,kBAAkB;AAE3B,MAAM,CAAC,MAAM,IAAI,GAAG,mBAAmB,CAAC,EAAC,EAAE,EAAE,EAAE,EAAC,EAAE,GAAG,SAAS,aAAa,CAAC,CAAC","sourcesContent":["import {addComponentKeysets} from '@gravity-ui/uikit/i18n';\n\nimport {NAMESPACE} from '../../../utils/cn';\n\nimport en from './en.json';\nimport ru from './ru.json';\n\nexport const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}date-picker`);\n"]}

package/dist/esm/components/DatePicker/index.d.ts

@@ -1,3 +1,3 @@
-export * from './DatePicker';
-export * from './hooks/useDatePickerState';
-export * from './hooks/useDatePickerProps';
+export * from "./DatePicker.js";
+export * from "./hooks/useDatePickerState.js";
+export * from "./hooks/useDatePickerProps.js";

package/dist/esm/components/DatePicker/index.js

@@ -1,3 +1,4 @@
-export * from './DatePicker';
-export * from './hooks/useDatePickerState';
-export * from './hooks/useDatePickerProps';
+export * from "./DatePicker.js";
+export * from "./hooks/useDatePickerState.js";
+export * from "./hooks/useDatePickerProps.js";
+//# sourceMappingURL=index.js.map

package/dist/esm/components/DatePicker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../src","sources":["components/DatePicker/index.ts"],"names":[],"mappings":"AAAA,gCAA6B;AAE7B,8CAA2C;AAC3C,8CAA2C","sourcesContent":["export * from './DatePicker';\n\nexport * from './hooks/useDatePickerState';\nexport * from './hooks/useDatePickerProps';\n"]}

package/dist/esm/components/DatePicker/utils/cn.js

@@ -1,2 +1,3 @@
-import { block } from '../../../utils/cn';
+import { block } from "../../../utils/cn.js";
 export const b = block('date-picker');
+//# sourceMappingURL=cn.js.map

package/dist/esm/components/DatePicker/utils/cn.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cn.js","sourceRoot":"../../../../../src","sources":["components/DatePicker/utils/cn.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,KAAK,EAAC,6BAA0B;AAExC,MAAM,CAAC,MAAM,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC","sourcesContent":["import {block} from '../../../utils/cn';\n\nexport const b = block('date-picker');\n"]}

package/dist/esm/components/DatePicker/utils/getCalendarModes.d.ts

@@ -0,0 +1,5 @@
+import type { CalendarLayout } from "../../CalendarView/hooks/types.js";
+import type { FormatInfo } from "../../DateField/types.js";
+type LayoutModes = Partial<Record<CalendarLayout, boolean>>;
+export declare function getCalendarModes(formatInfo: FormatInfo): LayoutModes | undefined;
+export {};

package/dist/esm/components/DatePicker/utils/getCalendarModes.js

@@ -0,0 +1,18 @@
+export function getCalendarModes(formatInfo) {
+    if (!formatInfo.hasDate) {
+        return undefined;
+    }
+    const modes = { years: true };
+    if (formatInfo.availableUnits.day) {
+        modes.days = true;
+        modes.months = true;
+    }
+    if (formatInfo.availableUnits.month) {
+        modes.months = true;
+    }
+    if (formatInfo.availableUnits.quarter && !modes.months) {
+        modes.quarters = true;
+    }
+    return modes;
+}
+//# sourceMappingURL=getCalendarModes.js.map

package/dist/esm/components/DatePicker/utils/getCalendarModes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getCalendarModes.js","sourceRoot":"../../../../../src","sources":["components/DatePicker/utils/getCalendarModes.ts"],"names":[],"mappings":"AAKA,MAAM,UAAU,gBAAgB,CAAC,UAAsB;IACnD,IAAI,CAAC,UAAU,CAAC,OAAO,EAAE,CAAC;QACtB,OAAO,SAAS,CAAC;IACrB,CAAC;IAED,MAAM,KAAK,GAAgB,EAAC,KAAK,EAAE,IAAI,EAAC,CAAC;IACzC,IAAI,UAAU,CAAC,cAAc,CAAC,GAAG,EAAE,CAAC;QAChC,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC;QAClB,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC;IACxB,CAAC;IAED,IAAI,UAAU,CAAC,cAAc,CAAC,KAAK,EAAE,CAAC;QAClC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC;IACxB,CAAC;IAED,IAAI,UAAU,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC;QACrD,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAC;IAC1B,CAAC;IAED,OAAO,KAAK,CAAC;AACjB,CAAC","sourcesContent":["import type {CalendarLayout} from '../../CalendarView/hooks/types';\nimport type {FormatInfo} from '../../DateField/types';\n\ntype LayoutModes = Partial<Record<CalendarLayout, boolean>>;\n\nexport function getCalendarModes(formatInfo: FormatInfo): LayoutModes | undefined {\n    if (!formatInfo.hasDate) {\n        return undefined;\n    }\n\n    const modes: LayoutModes = {years: true};\n    if (formatInfo.availableUnits.day) {\n        modes.days = true;\n        modes.months = true;\n    }\n\n    if (formatInfo.availableUnits.month) {\n        modes.months = true;\n    }\n\n    if (formatInfo.availableUnits.quarter && !modes.months) {\n        modes.quarters = true;\n    }\n\n    return modes;\n}\n"]}

package/dist/esm/components/DatePicker/utils/getDateTimeValue.d.ts

@@ -1,3 +1,3 @@
 import type { DateTime } from '@gravity-ui/date-utils';
-import type { RangeValue } from '../../types';
+import type { RangeValue } from "../../types/index.js";
 export declare function getDateTimeValue(value: DateTime | RangeValue<DateTime> | null | undefined): DateTime | undefined;

package/dist/esm/components/DatePicker/utils/getDateTimeValue.js

@@ -4,3 +4,4 @@ export function getDateTimeValue(value) {
     }
     return 'start' in value && 'end' in value ? value.start : value;
 }
+//# sourceMappingURL=getDateTimeValue.js.map

package/dist/esm/components/DatePicker/utils/getDateTimeValue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getDateTimeValue.js","sourceRoot":"../../../../../src","sources":["components/DatePicker/utils/getDateTimeValue.ts"],"names":[],"mappings":"AAIA,MAAM,UAAU,gBAAgB,CAC5B,KAAyD;IAEzD,IAAI,CAAC,KAAK,EAAE,CAAC;QACT,OAAO,SAAS,CAAC;IACrB,CAAC;IAED,OAAO,OAAO,IAAI,KAAK,IAAI,KAAK,IAAI,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC;AACpE,CAAC","sourcesContent":["import type {DateTime} from '@gravity-ui/date-utils';\n\nimport type {RangeValue} from '../../types';\n\nexport function getDateTimeValue(\n    value: DateTime | RangeValue<DateTime> | null | undefined,\n): DateTime | undefined {\n    if (!value) {\n        return undefined;\n    }\n\n    return 'start' in value && 'end' in value ? value.start : value;\n}\n"]}

package/dist/esm/components/DatePicker/utils/index.d.ts

@@ -1,2 +1,3 @@
-export * from './cn';
-export * from './getDateTimeValue';
+export * from "./cn.js";
+export * from "./getDateTimeValue.js";
+export * from "./getCalendarModes.js";

package/dist/esm/components/DatePicker/utils/index.js

@@ -1,2 +1,4 @@
-export * from './cn';
-export * from './getDateTimeValue';
+export * from "./cn.js";
+export * from "./getDateTimeValue.js";
+export * from "./getCalendarModes.js";
+//# sourceMappingURL=index.js.map

package/dist/esm/components/DatePicker/utils/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../../src","sources":["components/DatePicker/utils/index.ts"],"names":[],"mappings":"AAAA,wBAAqB;AACrB,sCAAmC;AACnC,sCAAmC","sourcesContent":["export * from './cn';\nexport * from './getDateTimeValue';\nexport * from './getCalendarModes';\n"]}

package/dist/esm/components/HiddenInput/HiddenInput.js

@@ -29,3 +29,4 @@ export function useFormResetHandler({ initialValue, onReset, }) {
     }, []);
     return ref;
 }
+//# sourceMappingURL=HiddenInput.js.map

package/dist/esm/components/HiddenInput/HiddenInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HiddenInput.js","sourceRoot":"../../../../src","sources":["components/HiddenInput/HiddenInput.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,MAAM,UAAU,WAAW,CAAI,EAC3B,IAAI,EACJ,KAAK,EACL,OAAO,EACP,IAAI,EACJ,QAAQ,EACR,aAAa,GACK;IAClB,MAAM,GAAG,GAAG,mBAAmB,CAAI,EAAC,YAAY,EAAE,KAAK,EAAE,OAAO,EAAC,CAAC,CAAC;IAEnE,IAAI,CAAC,IAAI,EAAE,CAAC;QACR,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,MAAM,CAAC,GAAG,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,EAAE,EAAE,CAAC;IAClE,OAAO,gBAAO,GAAG,EAAE,GAAG,EAAE,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,GAAI,CAAC;AACnG,CAAC;AAED,MAAM,UAAU,mBAAmB,CAAI,EACnC,YAAY,EACZ,OAAO,GAIV;IACG,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAyB,IAAI,CAAC,CAAC;IAEnF,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;IAE9C,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,IAAI,CAAC,WAAW,IAAI,CAAC,OAAO,EAAE,CAAC;YAC3B,OAAO,SAAS,CAAC;QACrB,CAAC;QAED,MAAM,WAAW,GAAG,GAAG,EAAE;YACrB,OAAO,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;QAChC,CAAC,CAAC;QAEF,WAAW,CAAC,gBAAgB,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QACnD,OAAO,GAAG,EAAE;YACR,WAAW,CAAC,mBAAmB,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QAC1D,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC,CAAC;IAE3B,MAAM,GAAG,GAAG,KAAK,CAAC,WAAW,CACzB,CAAC,IAAuE,EAAE,EAAE;;QACxE,cAAc,CAAC,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,IAAI,mCAAI,IAAI,CAAC,CAAC;IACvC,CAAC,EACD,EAAE,CACL,CAAC;IAEF,OAAO,GAAG,CAAC;AACf,CAAC","sourcesContent":["import React from 'react';\n\ninterface HiddenInputProps<T> {\n    value: T;\n    onReset?: (value: T) => void;\n    toStringValue?: (value: T) => string;\n    name?: string;\n    disabled?: boolean;\n    form?: string;\n}\nexport function HiddenInput<T>({\n    name,\n    value,\n    onReset,\n    form,\n    disabled,\n    toStringValue,\n}: HiddenInputProps<T>) {\n    const ref = useFormResetHandler<T>({initialValue: value, onReset});\n\n    if (!name) {\n        return null;\n    }\n\n    const v = toStringValue ? toStringValue(value) : `${value ?? ''}`;\n    return <input ref={ref} type=\"hidden\" name={name} value={v} disabled={disabled} form={form} />;\n}\n\nexport function useFormResetHandler<T>({\n    initialValue,\n    onReset,\n}: {\n    initialValue: T;\n    onReset?: (value: T) => void;\n}) {\n    const [formElement, setFormElement] = React.useState<HTMLFormElement | null>(null);\n\n    const resetValue = React.useRef(initialValue);\n\n    React.useEffect(() => {\n        if (!formElement || !onReset) {\n            return undefined;\n        }\n\n        const handleReset = () => {\n            onReset(resetValue.current);\n        };\n\n        formElement.addEventListener('reset', handleReset);\n        return () => {\n            formElement.removeEventListener('reset', handleReset);\n        };\n    }, [formElement, onReset]);\n\n    const ref = React.useCallback(\n        (node: HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement | null) => {\n            setFormElement(node?.form ?? null);\n        },\n        [],\n    );\n\n    return ref;\n}\n"]}