npm - @vkontakte/vkui - Versions diffs - 7.7.1 → 7.8.0 - Mend

@vkontakte/vkui 7.7.1 → 7.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (77) hide show

package/dist/components/DateRangeInput/DateRangeInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/DateRangeInput/DateRangeInput.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon16Clear, Icon20CalendarOutline } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDateInput } from '../../hooks/useDateInput';\nimport { useCustomEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { type UseFocusTrapProps } from '../../hooks/useFocusTrap';\nimport { dateFormatter, isMatch, parse } from '../../lib/date';\nimport type { PlacementWithAuto } from '../../lib/floating';\nimport type { HasRootRef } from '../../types';\nimport {\n CalendarRange,\n type CalendarRangeProps,\n type CalendarRangeTestsProps,\n type DateRangeType,\n} from '../CalendarRange/CalendarRange';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { FormField, type FormFieldProps } from '../FormField/FormField';\nimport { IconButton } from '../IconButton/IconButton';\nimport { InputLikeDivider } from '../InputLike/InputLikeDivider';\nimport { NumberInputLike } from '../NumberInputLike/NumberInputLike';\nimport { Popper } from '../Popper/Popper';\nimport { Text } from '../Typography/Text/Text';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './DateRangeInput.module.css';\nimport dateInputStyles from '../DateInput/DateInput.module.css';\n\nconst sizeYClassNames = {\n none: styles.sizeYNone,\n compact: styles.sizeYCompact,\n};\n\ntype DateTestsProps = {\n /*\n Передает атрибут `data-testid` для поля ввода дня.\n /\n day?: string;\n /\n Передает атрибут `data-testid` для поля ввода месяца.\n /\n month?: string;\n /\n Передает атрибут `data-testid` для поля ввода года.\n /\n year?: string;\n};\n\nexport type DateRangeInputTestsProps = {\n /\n Передает атрибуты `data-testid` для полей ввода начальной даты.\n /\n startDateTestsProps?: DateTestsProps;\n /\n Передает атрибуты `data-testid` для полей ввода конечной даты.\n /\n endDateTestsProps?: DateTestsProps;\n /\n Передает атрибут `data-testid` для кнопки показа календаря.\n /\n showCalendarButtonTestId?: string;\n /\n Передает атрибут `data-testid` для кнопки очистки даты.\n /\n clearButtonTestId?: string;\n};\n\nexport interface DateRangeInputProps\n extends Omit<React.InputHTMLAttributes<HTMLDivElement>, 'value' \| 'defaultValue' \| 'onChange'>,\n Pick<\n CalendarRangeProps,\n \| 'disablePast'\n \| 'disableFuture'\n \| 'shouldDisableDate'\n \| 'onChange'\n \| 'value'\n \| 'defaultValue'\n \| 'weekStartsOn'\n \| 'disablePickers'\n \| 'prevMonthLabel'\n \| 'nextMonthLabel'\n \| 'changeMonthLabel'\n \| 'changeYearLabel'\n \| 'changeDayLabel'\n \| 'prevMonthIcon'\n \| 'nextMonthIcon'\n \| 'renderDayContent'\n >,\n Pick<UseFocusTrapProps, 'restoreFocus'>,\n HasRootRef<HTMLDivElement>,\n Omit<FormFieldProps, 'maxHeight'>,\n DateRangeInputTestsProps {\n /\n Передает атрибуты `data-testid` для интерактивных элементов в календаре.\n /\n calendarTestsProps?: CalendarRangeTestsProps;\n /\n Расположение календаря относительно поля ввода.\n /\n calendarPlacement?: PlacementWithAuto;\n /\n Автоматически закрывать календарь при изменениях.\n /\n closeOnChange?: boolean;\n /\n Обработчик изменения состояния открытия календаря.\n /\n onCalendarOpenChanged?: (opened: boolean) => void;\n /\n Label для календаря.\n /\n calendarLabel?: string;\n /\n Label для кнопки очистки. Делает доступным для ассистивных технологий.\n /\n clearFieldLabel?: string;\n /\n Label для кнопки открытия календаря. Делает доступным для ассистивных технологий.\n /\n showCalendarLabel?: string;\n /\n Label для ввода дня начальной даты. Делает доступным для ассистивных технологий.\n /\n changeStartDayLabel?: string;\n /\n Label для ввода месяца начальной даты. Делает доступным для ассистивных технологий.\n /\n changeStartMonthLabel?: string;\n /\n Label для ввода года начальной даты. Делает доступным для ассистивных технологий.\n /\n changeStartYearLabel?: string;\n /\n Label для ввода дня конечной даты. Делает доступным для ассистивных технологий.\n /\n changeEndDayLabel?: string;\n /\n Label для ввода месяца конечной даты. Делает доступным для ассистивных технологий.\n /\n changeEndMonthLabel?: string;\n /\n Label для ввода года конечной даты. Делает доступным для ассистивных технологий.\n /\n changeEndYearLabel?: string;\n /\n Отключение открытия календаря.\n /\n disableCalendar?: boolean;\n /\n Позволяет отключить захват фокуса при появлении календаря.\n /\n disableFocusTrap?: UseFocusTrapProps['disabled'];\n /\n Включает режим в котором DateRangeInput доступен\n * для ассистивных технологий.\n * В этом режиме:\n * - календарь больше не открывает при фокусе на DateRangeInput;\n * - иконка календаря видна всегда, чтобы пользователи\n * ассистивных технологий могли открыть календарь по клику на иконку;\n * - календарь при открытии получает фокус, клавиатурный\n * фокус зациклен и не выходит за пределы календаря пока календарь не закрыт.\n /\n accessible?: boolean; // TODO [>=8]: включить по умолчанию.\n}\n\nconst elementsConfig = (index: number) => {\n let length = 2;\n let min = 1;\n let max = 0;\n\n switch (index) {\n case 0:\n case 3:\n max = 31;\n break;\n case 1:\n case 4:\n max = 12;\n break;\n case 2:\n case 5:\n max = 2100;\n min = 1900;\n length = 4;\n break;\n }\n\n return { length, min, max };\n};\n\nconst getInternalValue = (value: CalendarRangeProps['value']) => {\n const newValue = ['', '', '', '', '', ''];\n if (value?.[0]) {\n newValue[0] = String(value[0].getDate()).padStart(2, '0');\n newValue[1] = String(value[0].getMonth() + 1).padStart(2, '0');\n newValue[2] = String(value[0].getFullYear()).padStart(4, '0');\n }\n if (value?.[1]) {\n newValue[3] = String(value[1].getDate()).padStart(2, '0');\n newValue[4] = String(value[1].getMonth() + 1).padStart(2, '0');\n newValue[5] = String(value[1].getFullYear()).padStart(4, '0');\n }\n return newValue;\n};\n\nconst CALENDAR_MUTATION_OBSERVER_OPTIONS: MutationObserverInit = {\n childList: true,\n subtree: true,\n attributes: true,\n attributeFilter: ['tabindex'],\n};\n\n/\n @see https://vkui.io/components/date-range-input\n */\nexport const DateRangeInput = ({\n shouldDisableDate,\n disableFuture,\n disablePast,\n 'value': valueProp,\n defaultValue,\n onChange,\n 'calendarPlacement': calendarPlacementProp = 'bottom-start',\n style,\n className,\n closeOnChange = true,\n disablePickers,\n getRootRef,\n name,\n autoFocus,\n disabled,\n disableFocusTrap,\n restoreFocus,\n calendarLabel = 'Календарь',\n prevMonthLabel = 'Предыдущий месяц',\n nextMonthLabel = 'Следующий месяц',\n changeMonthLabel = 'Месяц',\n changeYearLabel = 'Год',\n changeStartDayLabel = 'День начала',\n changeStartMonthLabel = 'Месяц начала',\n changeStartYearLabel = 'Год начала',\n changeEndDayLabel = 'День окончания',\n changeEndMonthLabel = 'Месяц окончания',\n changeEndYearLabel = 'Год окончания',\n clearFieldLabel = 'Очистить поле',\n showCalendarLabel = 'Показать календарь',\n 'aria-label': ariaLabel = '',\n prevMonthIcon,\n nextMonthIcon,\n onCalendarOpenChanged,\n renderDayContent,\n calendarTestsProps,\n startDateTestsProps,\n endDateTestsProps,\n clearButtonTestId,\n showCalendarButtonTestId,\n id,\n accessible,\n readOnly,\n 'disableCalendar': disableCalendarProp = false,\n ...props\n}: DateRangeInputProps): React.ReactNode => {\n const daysStartRef = React.useRef<HTMLSpanElement>(null);\n const monthsStartRef = React.useRef<HTMLSpanElement>(null);\n const yearsStartRef = React.useRef<HTMLSpanElement>(null);\n const daysEndRef = React.useRef<HTMLSpanElement>(null);\n const monthsEndRef = React.useRef<HTMLSpanElement>(null);\n const yearsEndRef = React.useRef<HTMLSpanElement>(null);\n\n const disableCalendar = readOnly ? true : disableCalendarProp;\n\n const _onChange = React.useCallback(\n (newValue: DateRangeType \| null \| undefined) => onChange?.(newValue \|\| undefined),\n [onChange],\n );\n\n const [value, updateValue] = useCustomEnsuredControl<DateRangeType \| null \| undefined>({\n value: valueProp,\n defaultValue,\n onChange: _onChange,\n });\n\n const onInternalValueChange = React.useCallback(\n (internalValue: string[]) => {\n let isStartValid = true;\n let isEndValid = true;\n for (let i = 0; i <= 2; i += 1) {\n if (internalValue[i].length < elementsConfig(i).length) {\n isStartValid = false;\n }\n }\n for (let i = 3; i <= 5; i += 1) {\n if (internalValue[i].length < elementsConfig(i).length) {\n isEndValid = false;\n }\n }\n const formattedStartValue = `${internalValue[0]}.${internalValue[1]}.${internalValue[2]}`;\n const formattedEndValue = `${internalValue[3]}.${internalValue[4]}.${internalValue[5]}`;\n const mask = 'dd.MM.yyyy';\n\n if (!isMatch(formattedStartValue, mask)) {\n isStartValid = false;\n }\n if (!isMatch(formattedEndValue, mask)) {\n isEndValid = false;\n }\n\n if (!isStartValid && !isEndValid) {\n return;\n }\n\n const valueExists = Array.isArray(value);\n const now = new Date();\n const start = isStartValid\n ? parse(formattedStartValue, mask, (valueExists && value?.[0]) \|\| now)\n : null;\n const end = isEndValid\n ? parse(formattedEndValue, mask, (valueExists && value?.[1]) \|\| now)\n : null;\n if (start && end && end > start) {\n updateValue([start, end]);\n }\n },\n [updateValue, value],\n );\n\n const refs = React.useMemo(\n () => [daysStartRef, monthsStartRef, yearsStartRef, daysEndRef, monthsEndRef, yearsEndRef],\n [daysStartRef, monthsStartRef, yearsStartRef, daysEndRef, monthsEndRef, yearsEndRef],\n );\n\n const onClear = React.useCallback(() => updateValue(undefined), [updateValue]);\n\n const {\n rootRef,\n calendarRef,\n open,\n openCalendar,\n closeCalendar,\n toggleCalendar,\n internalValue,\n handleKeyDown,\n setFocusedElement,\n handleFieldEnter,\n clear,\n removeFocusFromField,\n } = useDateInput({\n maxElement: 5,\n refs,\n autoFocus,\n disabled: disabled \|\| readOnly,\n elementsConfig,\n onClear,\n onInternalValueChange,\n getInternalValue,\n value,\n onCalendarOpenChanged,\n accessible,\n });\n\n const { sizeY = 'none' } = useAdaptivity();\n\n const handleRootRef = useExternRef(rootRef, getRootRef);\n\n const onCalendarChange = React.useCallback(\n (newValue: DateRangeType \| undefined) => {\n updateValue(newValue);\n if (closeOnChange && newValue?.[1] && newValue[1] !== value?.[1]) {\n removeFocusFromField();\n }\n },\n [updateValue, closeOnChange, value, removeFocusFromField],\n );\n\n // при переключении месяцев высота календаря может меняться,\n // чтобы календарь не прыгал при переключении месяцев каждый раз на\n // лучшую позицию мы запоминаем последнюю удачную, чтобы календарь оставался\n // на ней, пока помещается.\n const [calendarPlacement, setCalendarPlacement] =\n React.useState<PlacementWithAuto>(calendarPlacementProp);\n\n const { locale } = useConfigProvider();\n const currentDateLabel = React.useMemo(() => {\n if (!value) {\n return null;\n }\n const [startDate, endDate] = value;\n if (!startDate \|\| !endDate) {\n return null;\n }\n return [\n new Intl.DateTimeFormat(locale, {\n weekday: 'long',\n year: 'numeric',\n month: 'long',\n day: 'numeric',\n }).format(startDate),\n new Intl.DateTimeFormat(locale, {\n weekday: 'long',\n year: 'numeric',\n month: 'long',\n day: 'numeric',\n }).format(endDate),\n ].join(' - ');\n }, [locale, value]);\n\n const currentDateLabelId = React.useId();\n const ariaLabelId = React.useId();\n\n const showCalendarOnInputAreaClick = React.useCallback(() => {\n handleFieldEnter();\n if (accessible) {\n openCalendar();\n }\n }, [handleFieldEnter, openCalendar, accessible]);\n\n return (\n <FormField\n style={style}\n className={classNames(sizeY !== 'regular' && sizeYClassNames[sizeY], className)}\n getRootRef={handleRootRef}\n role=\"group\"\n aria-labelledby={`${ariaLabelId} ${currentDateLabelId}`}\n after={\n <>\n {!disableCalendar && (accessible \|\| (!accessible && !value)) ? (\n <IconButton\n hoverMode=\"opacity\"\n label={showCalendarLabel}\n onClick={toggleCalendar}\n data-testid={showCalendarButtonTestId}\n >\n <Icon20CalendarOutline />\n </IconButton>\n ) : null}\n {value && !readOnly ? (\n <IconButton\n hoverMode=\"opacity\"\n label={clearFieldLabel}\n onClick={clear}\n data-testid={clearButtonTestId}\n >\n <Icon16Clear />\n </IconButton>\n ) : null}\n </>\n }\n disabled={disabled}\n {...props}\n >\n <div className={dateInputStyles.wrapper}>\n {ariaLabel && <VisuallyHidden id={ariaLabelId}>{ariaLabel}</VisuallyHidden>}\n {currentDateLabel && (\n <VisuallyHidden id={currentDateLabelId}>{currentDateLabel}</VisuallyHidden>\n )}\n <VisuallyHidden\n id={id}\n Component=\"input\"\n readOnly\n aria-hidden\n name={name}\n tabIndex={readOnly ? 0 : -1}\n value={\n value\n ? `${value[0] ? dateFormatter.format(value[0]) : ''} - ${\n value[1] ? dateFormatter.format(value[1]) : ''\n }`\n : ''\n }\n onFocus={handleFieldEnter}\n />\n <Text\n className={dateInputStyles.input}\n onClick={showCalendarOnInputAreaClick}\n normalize={false}\n >\n <NumberInputLike\n value={internalValue[0]}\n minValue={1}\n maxValue={31}\n onKeyDown={readOnly ? undefined : handleKeyDown}\n length={2}\n getRootRef={daysStartRef}\n index={0}\n readOnly={readOnly}\n onElementSelect={setFocusedElement}\n label={changeStartDayLabel}\n data-testid={startDateTestsProps?.day}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <NumberInputLike\n value={internalValue[1]}\n minValue={1}\n maxValue={12}\n onKeyDown={handleKeyDown}\n length={2}\n getRootRef={monthsStartRef}\n index={1}\n onElementSelect={setFocusedElement}\n readOnly={readOnly}\n label={changeStartMonthLabel}\n data-testid={startDateTestsProps?.month}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <NumberInputLike\n value={internalValue[2]}\n minValue={1}\n maxValue={275750}\n onKeyDown={handleKeyDown}\n length={4}\n getRootRef={yearsStartRef}\n index={2}\n onElementSelect={setFocusedElement}\n readOnly={readOnly}\n label={changeStartYearLabel}\n data-testid={startDateTestsProps?.year}\n />\n <InputLikeDivider>{' — '}</InputLikeDivider>\n <NumberInputLike\n value={internalValue[3]}\n minValue={1}\n maxValue={31}\n onKeyDown={handleKeyDown}\n length={2}\n getRootRef={daysEndRef}\n index={3}\n onElementSelect={setFocusedElement}\n readOnly={readOnly}\n label={changeEndDayLabel}\n data-testid={endDateTestsProps?.day}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <NumberInputLike\n value={internalValue[4]}\n minValue={1}\n maxValue={12}\n onKeyDown={handleKeyDown}\n length={2}\n getRootRef={monthsEndRef}\n index={4}\n onElementSelect={setFocusedElement}\n readOnly={readOnly}\n label={changeEndMonthLabel}\n data-testid={endDateTestsProps?.month}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <NumberInputLike\n value={internalValue[5]}\n minValue={1}\n maxValue={275750}\n onKeyDown={handleKeyDown}\n length={4}\n getRootRef={yearsEndRef}\n index={5}\n onElementSelect={setFocusedElement}\n readOnly={readOnly}\n label={changeEndYearLabel}\n data-testid={endDateTestsProps?.year}\n />\n </Text>\n </div>\n {open && !disableCalendar && (\n <Popper\n targetRef={rootRef}\n offsetByMainAxis={8}\n placement={calendarPlacement}\n onPlacementChange={setCalendarPlacement}\n >\n <FocusTrap\n onClose={closeCalendar}\n disabled={disableFocusTrap ?? !accessible}\n restoreFocus={restoreFocus ?? Boolean(accessible)}\n captureEscapeKeyboardEvent={false}\n mutationObserverOptions={CALENDAR_MUTATION_OBSERVER_OPTIONS}\n >\n <CalendarRange\n value={value}\n role=\"dialog\"\n onChange={onCalendarChange}\n aria-label={calendarLabel}\n disablePast={disablePast}\n disableFuture={disableFuture}\n shouldDisableDate={shouldDisableDate}\n getRootRef={calendarRef}\n disablePickers={disablePickers}\n prevMonthLabel={prevMonthLabel}\n nextMonthLabel={nextMonthLabel}\n changeMonthLabel={changeMonthLabel}\n changeYearLabel={changeYearLabel}\n prevMonthIcon={prevMonthIcon}\n nextMonthIcon={nextMonthIcon}\n renderDayContent={renderDayContent}\n {...calendarTestsProps}\n />\n </FocusTrap>\n </Popper>\n )}\n </FormField>\n );\n};\n"],"names":["React","Icon16Clear","Icon20CalendarOutline","classNames","useAdaptivity","useDateInput","useCustomEnsuredControl","useExternRef","dateFormatter","isMatch","parse","CalendarRange","useConfigProvider","FocusTrap","FormField","IconButton","InputLikeDivider","NumberInputLike","Popper","Text","VisuallyHidden","sizeYClassNames","none","compact","elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","CALENDAR_MUTATION_OBSERVER_OPTIONS","childList","subtree","attributes","attributeFilter","DateRangeInput","shouldDisableDate","disableFuture","disablePast","valueProp","defaultValue","onChange","calendarPlacementProp","style","className","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","disableFocusTrap","restoreFocus","calendarLabel","prevMonthLabel","nextMonthLabel","changeMonthLabel","changeYearLabel","changeStartDayLabel","changeStartMonthLabel","changeStartYearLabel","changeEndDayLabel","changeEndMonthLabel","changeEndYearLabel","clearFieldLabel","showCalendarLabel","ariaLabel","prevMonthIcon","nextMonthIcon","onCalendarOpenChanged","renderDayContent","calendarTestsProps","startDateTestsProps","endDateTestsProps","clearButtonTestId","showCalendarButtonTestId","id","accessible","readOnly","disableCalendarProp","props","daysStartRef","useRef","monthsStartRef","yearsStartRef","daysEndRef","monthsEndRef","yearsEndRef","disableCalendar","_onChange","useCallback","undefined","updateValue","onInternalValueChange","internalValue","isStartValid","isEndValid","i","formattedStartValue","formattedEndValue","mask","valueExists","Array","isArray","now","Date","start","end","refs","useMemo","onClear","rootRef","calendarRef","open","openCalendar","closeCalendar","toggleCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","maxElement","sizeY","handleRootRef","onCalendarChange","calendarPlacement","setCalendarPlacement","useState","locale","currentDateLabel","startDate","endDate","Intl","DateTimeFormat","weekday","year","month","day","format","join","currentDateLabelId","useId","ariaLabelId","showCalendarOnInputAreaClick","role","aria-labelledby","after","hoverMode","label","onClick","data-testid","div","Component","aria-hidden","tabIndex","onFocus","normalize","minValue","maxValue","onKeyDown","onElementSelect","targetRef","offsetByMainAxis","placement","onPlacementChange","onClose","Boolean","captureEscapeKeyboardEvent","mutationObserverOptions","aria-label"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../src/components/DateRangeInput/DateRangeInput.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon16Clear, Icon20CalendarOutline } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDateInput } from '../../hooks/useDateInput';\nimport { useCustomEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { type UseFocusTrapProps } from '../../hooks/useFocusTrap';\nimport { dateFormatter, isMatch, parse } from '../../lib/date';\nimport type { PlacementWithAuto } from '../../lib/floating';\nimport type { HasRootRef } from '../../types';\nimport {\n CalendarRange,\n type CalendarRangeProps,\n type CalendarRangeTestsProps,\n type DateRangeType,\n} from '../CalendarRange/CalendarRange';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { FormField, type FormFieldProps } from '../FormField/FormField';\nimport { IconButton } from '../IconButton/IconButton';\nimport { InputLikeDivider } from '../InputLike/InputLikeDivider';\nimport { NumberInputLike } from '../NumberInputLike/NumberInputLike';\nimport { Popper } from '../Popper/Popper';\nimport { Text } from '../Typography/Text/Text';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport dateInputStyles from '../DateInput/DateInput.module.css';\n\nconst sizeYClassNames = {\n none: dateInputStyles.sizeYNone,\n compact: dateInputStyles.sizeYCompact,\n};\n\ntype DateTestsProps = {\n /*\n Передает атрибут `data-testid` для поля ввода дня.\n /\n day?: string;\n /\n Передает атрибут `data-testid` для поля ввода месяца.\n /\n month?: string;\n /\n Передает атрибут `data-testid` для поля ввода года.\n /\n year?: string;\n};\n\nexport type DateRangeInputTestsProps = {\n /\n Передает атрибуты `data-testid` для полей ввода начальной даты.\n /\n startDateTestsProps?: DateTestsProps;\n /\n Передает атрибуты `data-testid` для полей ввода конечной даты.\n /\n endDateTestsProps?: DateTestsProps;\n /\n Передает атрибут `data-testid` для кнопки показа календаря.\n /\n showCalendarButtonTestId?: string;\n /\n Передает атрибут `data-testid` для кнопки очистки даты.\n /\n clearButtonTestId?: string;\n};\n\nexport interface DateRangeInputProps\n extends Omit<React.InputHTMLAttributes<HTMLDivElement>, 'value' \| 'defaultValue' \| 'onChange'>,\n Pick<\n CalendarRangeProps,\n \| 'disablePast'\n \| 'disableFuture'\n \| 'shouldDisableDate'\n \| 'onChange'\n \| 'value'\n \| 'defaultValue'\n \| 'weekStartsOn'\n \| 'disablePickers'\n \| 'prevMonthLabel'\n \| 'nextMonthLabel'\n \| 'changeMonthLabel'\n \| 'changeYearLabel'\n \| 'changeDayLabel'\n \| 'prevMonthIcon'\n \| 'nextMonthIcon'\n \| 'renderDayContent'\n >,\n Pick<UseFocusTrapProps, 'restoreFocus'>,\n HasRootRef<HTMLDivElement>,\n Omit<FormFieldProps, 'maxHeight'>,\n DateRangeInputTestsProps {\n /\n Передает атрибуты `data-testid` для интерактивных элементов в календаре.\n /\n calendarTestsProps?: CalendarRangeTestsProps;\n /\n Расположение календаря относительно поля ввода.\n /\n calendarPlacement?: PlacementWithAuto;\n /\n Автоматически закрывать календарь при изменениях.\n /\n closeOnChange?: boolean;\n /\n Обработчик изменения состояния открытия календаря.\n /\n onCalendarOpenChanged?: (opened: boolean) => void;\n /\n Label для календаря.\n /\n calendarLabel?: string;\n /\n Label для кнопки очистки. Делает доступным для ассистивных технологий.\n /\n clearFieldLabel?: string;\n /\n Label для кнопки открытия календаря. Делает доступным для ассистивных технологий.\n /\n showCalendarLabel?: string;\n /\n Label для ввода дня начальной даты. Делает доступным для ассистивных технологий.\n /\n changeStartDayLabel?: string;\n /\n Label для ввода месяца начальной даты. Делает доступным для ассистивных технологий.\n /\n changeStartMonthLabel?: string;\n /\n Label для ввода года начальной даты. Делает доступным для ассистивных технологий.\n /\n changeStartYearLabel?: string;\n /\n Label для ввода дня конечной даты. Делает доступным для ассистивных технологий.\n /\n changeEndDayLabel?: string;\n /\n Label для ввода месяца конечной даты. Делает доступным для ассистивных технологий.\n /\n changeEndMonthLabel?: string;\n /\n Label для ввода года конечной даты. Делает доступным для ассистивных технологий.\n /\n changeEndYearLabel?: string;\n /\n Отключение открытия календаря.\n /\n disableCalendar?: boolean;\n /\n Позволяет отключить захват фокуса при появлении календаря.\n /\n disableFocusTrap?: UseFocusTrapProps['disabled'];\n /\n Включает режим в котором DateRangeInput доступен\n * для ассистивных технологий.\n * В этом режиме:\n * - календарь больше не открывает при фокусе на DateRangeInput;\n * - иконка календаря видна всегда, чтобы пользователи\n * ассистивных технологий могли открыть календарь по клику на иконку;\n * - календарь при открытии получает фокус, клавиатурный\n * фокус зациклен и не выходит за пределы календаря пока календарь не закрыт.\n /\n accessible?: boolean; // TODO [>=8]: включить по умолчанию.\n}\n\nconst elementsConfig = (index: number) => {\n let length = 2;\n let min = 1;\n let max = 0;\n\n switch (index) {\n case 0:\n case 3:\n max = 31;\n break;\n case 1:\n case 4:\n max = 12;\n break;\n case 2:\n case 5:\n max = 2100;\n min = 1900;\n length = 4;\n break;\n }\n\n return { length, min, max };\n};\n\nconst getInternalValue = (value: CalendarRangeProps['value']) => {\n const newValue = ['', '', '', '', '', ''];\n if (value?.[0]) {\n newValue[0] = String(value[0].getDate()).padStart(2, '0');\n newValue[1] = String(value[0].getMonth() + 1).padStart(2, '0');\n newValue[2] = String(value[0].getFullYear()).padStart(4, '0');\n }\n if (value?.[1]) {\n newValue[3] = String(value[1].getDate()).padStart(2, '0');\n newValue[4] = String(value[1].getMonth() + 1).padStart(2, '0');\n newValue[5] = String(value[1].getFullYear()).padStart(4, '0');\n }\n return newValue;\n};\n\nconst CALENDAR_MUTATION_OBSERVER_OPTIONS: MutationObserverInit = {\n childList: true,\n subtree: true,\n attributes: true,\n attributeFilter: ['tabindex'],\n};\n\n/\n @see https://vkui.io/components/date-range-input\n */\nexport const DateRangeInput = ({\n shouldDisableDate,\n disableFuture,\n disablePast,\n 'value': valueProp,\n defaultValue,\n onChange,\n 'calendarPlacement': calendarPlacementProp = 'bottom-start',\n style,\n className,\n closeOnChange = true,\n disablePickers,\n getRootRef,\n name,\n autoFocus,\n disabled,\n disableFocusTrap,\n restoreFocus,\n calendarLabel = 'Календарь',\n prevMonthLabel = 'Предыдущий месяц',\n nextMonthLabel = 'Следующий месяц',\n changeMonthLabel = 'Месяц',\n changeYearLabel = 'Год',\n changeStartDayLabel = 'День начала',\n changeStartMonthLabel = 'Месяц начала',\n changeStartYearLabel = 'Год начала',\n changeEndDayLabel = 'День окончания',\n changeEndMonthLabel = 'Месяц окончания',\n changeEndYearLabel = 'Год окончания',\n clearFieldLabel = 'Очистить поле',\n showCalendarLabel = 'Показать календарь',\n 'aria-label': ariaLabel = '',\n prevMonthIcon,\n nextMonthIcon,\n onCalendarOpenChanged,\n renderDayContent,\n calendarTestsProps,\n startDateTestsProps,\n endDateTestsProps,\n clearButtonTestId,\n showCalendarButtonTestId,\n id,\n accessible,\n readOnly,\n 'disableCalendar': disableCalendarProp = false,\n before,\n ...props\n}: DateRangeInputProps): React.ReactNode => {\n const daysStartRef = React.useRef<HTMLSpanElement>(null);\n const monthsStartRef = React.useRef<HTMLSpanElement>(null);\n const yearsStartRef = React.useRef<HTMLSpanElement>(null);\n const daysEndRef = React.useRef<HTMLSpanElement>(null);\n const monthsEndRef = React.useRef<HTMLSpanElement>(null);\n const yearsEndRef = React.useRef<HTMLSpanElement>(null);\n\n const disableCalendar = readOnly ? true : disableCalendarProp;\n\n const _onChange = React.useCallback(\n (newValue: DateRangeType \| null \| undefined) => onChange?.(newValue \|\| undefined),\n [onChange],\n );\n\n const [value, updateValue] = useCustomEnsuredControl<DateRangeType \| null \| undefined>({\n value: valueProp,\n defaultValue,\n onChange: _onChange,\n });\n\n const onInternalValueChange = React.useCallback(\n (internalValue: string[]) => {\n let isStartValid = true;\n let isEndValid = true;\n for (let i = 0; i <= 2; i += 1) {\n if (internalValue[i].length < elementsConfig(i).length) {\n isStartValid = false;\n }\n }\n for (let i = 3; i <= 5; i += 1) {\n if (internalValue[i].length < elementsConfig(i).length) {\n isEndValid = false;\n }\n }\n const formattedStartValue = `${internalValue[0]}.${internalValue[1]}.${internalValue[2]}`;\n const formattedEndValue = `${internalValue[3]}.${internalValue[4]}.${internalValue[5]}`;\n const mask = 'dd.MM.yyyy';\n\n if (!isMatch(formattedStartValue, mask)) {\n isStartValid = false;\n }\n if (!isMatch(formattedEndValue, mask)) {\n isEndValid = false;\n }\n\n if (!isStartValid && !isEndValid) {\n return;\n }\n\n const valueExists = Array.isArray(value);\n const now = new Date();\n const start = isStartValid\n ? parse(formattedStartValue, mask, (valueExists && value?.[0]) \|\| now)\n : null;\n const end = isEndValid\n ? parse(formattedEndValue, mask, (valueExists && value?.[1]) \|\| now)\n : null;\n if (start && end && end > start) {\n updateValue([start, end]);\n }\n },\n [updateValue, value],\n );\n\n const refs = React.useMemo(\n () => [daysStartRef, monthsStartRef, yearsStartRef, daysEndRef, monthsEndRef, yearsEndRef],\n [daysStartRef, monthsStartRef, yearsStartRef, daysEndRef, monthsEndRef, yearsEndRef],\n );\n\n const onClear = React.useCallback(() => updateValue(undefined), [updateValue]);\n\n const {\n rootRef,\n calendarRef,\n open,\n openCalendar,\n closeCalendar,\n toggleCalendar,\n internalValue,\n handleKeyDown,\n setFocusedElement,\n handleFieldEnter,\n clear,\n removeFocusFromField,\n } = useDateInput({\n maxElement: 5,\n refs,\n autoFocus,\n disabled: disabled \|\| readOnly,\n elementsConfig,\n onClear,\n onInternalValueChange,\n getInternalValue,\n value,\n onCalendarOpenChanged,\n accessible,\n });\n\n const { sizeY = 'none' } = useAdaptivity();\n\n const handleRootRef = useExternRef(rootRef, getRootRef);\n\n const onCalendarChange = React.useCallback(\n (newValue: DateRangeType \| undefined) => {\n updateValue(newValue);\n if (closeOnChange && newValue?.[1] && newValue[1] !== value?.[1]) {\n removeFocusFromField();\n }\n },\n [updateValue, closeOnChange, value, removeFocusFromField],\n );\n\n // при переключении месяцев высота календаря может меняться,\n // чтобы календарь не прыгал при переключении месяцев каждый раз на\n // лучшую позицию мы запоминаем последнюю удачную, чтобы календарь оставался\n // на ней, пока помещается.\n const [calendarPlacement, setCalendarPlacement] =\n React.useState<PlacementWithAuto>(calendarPlacementProp);\n\n const { locale } = useConfigProvider();\n const currentDateLabel = React.useMemo(() => {\n if (!value) {\n return null;\n }\n const [startDate, endDate] = value;\n if (!startDate \|\| !endDate) {\n return null;\n }\n return [\n new Intl.DateTimeFormat(locale, {\n weekday: 'long',\n year: 'numeric',\n month: 'long',\n day: 'numeric',\n }).format(startDate),\n new Intl.DateTimeFormat(locale, {\n weekday: 'long',\n year: 'numeric',\n month: 'long',\n day: 'numeric',\n }).format(endDate),\n ].join(' - ');\n }, [locale, value]);\n\n const currentDateLabelId = React.useId();\n const ariaLabelId = React.useId();\n\n const showCalendarOnInputAreaClick = React.useCallback(() => {\n handleFieldEnter();\n if (accessible) {\n openCalendar();\n }\n }, [handleFieldEnter, openCalendar, accessible]);\n\n const showCalendarButton = !disableCalendar && (accessible \|\| (!accessible && !value));\n const showClearButton = value && !readOnly;\n\n return (\n <FormField\n style={style}\n className={classNames(\n sizeY !== 'regular' && sizeYClassNames[sizeY],\n !!before && dateInputStyles.hasBefore,\n (showCalendarButton \|\| showClearButton) && dateInputStyles.hasAfter,\n className,\n )}\n getRootRef={handleRootRef}\n role=\"group\"\n aria-labelledby={`${ariaLabelId} ${currentDateLabelId}`}\n before={before}\n after={\n <>\n {showCalendarButton ? (\n <IconButton\n hoverMode=\"opacity\"\n label={showCalendarLabel}\n onClick={toggleCalendar}\n data-testid={showCalendarButtonTestId}\n >\n <Icon20CalendarOutline />\n </IconButton>\n ) : null}\n {showClearButton ? (\n <IconButton\n hoverMode=\"opacity\"\n label={clearFieldLabel}\n onClick={clear}\n data-testid={clearButtonTestId}\n >\n <Icon16Clear />\n </IconButton>\n ) : null}\n </>\n }\n disabled={disabled}\n {...props}\n >\n <div className={dateInputStyles.wrapper}>\n {ariaLabel && <VisuallyHidden id={ariaLabelId}>{ariaLabel}</VisuallyHidden>}\n {currentDateLabel && (\n <VisuallyHidden id={currentDateLabelId}>{currentDateLabel}</VisuallyHidden>\n )}\n <VisuallyHidden\n id={id}\n Component=\"input\"\n readOnly\n aria-hidden\n name={name}\n tabIndex={readOnly ? 0 : -1}\n value={\n value\n ? `${value[0] ? dateFormatter.format(value[0]) : ''} - ${\n value[1] ? dateFormatter.format(value[1]) : ''\n }`\n : ''\n }\n onFocus={handleFieldEnter}\n />\n <Text\n className={dateInputStyles.input}\n onClick={showCalendarOnInputAreaClick}\n normalize={false}\n >\n <NumberInputLike\n value={internalValue[0]}\n minValue={1}\n maxValue={31}\n onKeyDown={readOnly ? undefined : handleKeyDown}\n length={2}\n getRootRef={daysStartRef}\n index={0}\n readOnly={readOnly}\n onElementSelect={setFocusedElement}\n label={changeStartDayLabel}\n data-testid={startDateTestsProps?.day}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <NumberInputLike\n value={internalValue[1]}\n minValue={1}\n maxValue={12}\n onKeyDown={handleKeyDown}\n length={2}\n getRootRef={monthsStartRef}\n index={1}\n onElementSelect={setFocusedElement}\n readOnly={readOnly}\n label={changeStartMonthLabel}\n data-testid={startDateTestsProps?.month}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <NumberInputLike\n value={internalValue[2]}\n minValue={1}\n maxValue={275750}\n onKeyDown={handleKeyDown}\n length={4}\n getRootRef={yearsStartRef}\n index={2}\n onElementSelect={setFocusedElement}\n readOnly={readOnly}\n label={changeStartYearLabel}\n data-testid={startDateTestsProps?.year}\n />\n <InputLikeDivider>{' — '}</InputLikeDivider>\n <NumberInputLike\n value={internalValue[3]}\n minValue={1}\n maxValue={31}\n onKeyDown={handleKeyDown}\n length={2}\n getRootRef={daysEndRef}\n index={3}\n onElementSelect={setFocusedElement}\n readOnly={readOnly}\n label={changeEndDayLabel}\n data-testid={endDateTestsProps?.day}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <NumberInputLike\n value={internalValue[4]}\n minValue={1}\n maxValue={12}\n onKeyDown={handleKeyDown}\n length={2}\n getRootRef={monthsEndRef}\n index={4}\n onElementSelect={setFocusedElement}\n readOnly={readOnly}\n label={changeEndMonthLabel}\n data-testid={endDateTestsProps?.month}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <NumberInputLike\n value={internalValue[5]}\n minValue={1}\n maxValue={275750}\n onKeyDown={handleKeyDown}\n length={4}\n getRootRef={yearsEndRef}\n index={5}\n onElementSelect={setFocusedElement}\n readOnly={readOnly}\n label={changeEndYearLabel}\n data-testid={endDateTestsProps?.year}\n />\n </Text>\n </div>\n {open && !disableCalendar && (\n <Popper\n targetRef={rootRef}\n offsetByMainAxis={8}\n placement={calendarPlacement}\n onPlacementChange={setCalendarPlacement}\n >\n <FocusTrap\n onClose={closeCalendar}\n disabled={disableFocusTrap ?? !accessible}\n restoreFocus={restoreFocus ?? Boolean(accessible)}\n captureEscapeKeyboardEvent={false}\n mutationObserverOptions={CALENDAR_MUTATION_OBSERVER_OPTIONS}\n >\n <CalendarRange\n value={value}\n role=\"dialog\"\n onChange={onCalendarChange}\n aria-label={calendarLabel}\n disablePast={disablePast}\n disableFuture={disableFuture}\n shouldDisableDate={shouldDisableDate}\n getRootRef={calendarRef}\n disablePickers={disablePickers}\n prevMonthLabel={prevMonthLabel}\n nextMonthLabel={nextMonthLabel}\n changeMonthLabel={changeMonthLabel}\n changeYearLabel={changeYearLabel}\n prevMonthIcon={prevMonthIcon}\n nextMonthIcon={nextMonthIcon}\n renderDayContent={renderDayContent}\n {...calendarTestsProps}\n />\n </FocusTrap>\n </Popper>\n )}\n </FormField>\n );\n};\n"],"names":["React","Icon16Clear","Icon20CalendarOutline","classNames","useAdaptivity","useDateInput","useCustomEnsuredControl","useExternRef","dateFormatter","isMatch","parse","CalendarRange","useConfigProvider","FocusTrap","FormField","IconButton","InputLikeDivider","NumberInputLike","Popper","Text","VisuallyHidden","sizeYClassNames","none","compact","elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","CALENDAR_MUTATION_OBSERVER_OPTIONS","childList","subtree","attributes","attributeFilter","DateRangeInput","shouldDisableDate","disableFuture","disablePast","valueProp","defaultValue","onChange","calendarPlacementProp","style","className","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","disableFocusTrap","restoreFocus","calendarLabel","prevMonthLabel","nextMonthLabel","changeMonthLabel","changeYearLabel","changeStartDayLabel","changeStartMonthLabel","changeStartYearLabel","changeEndDayLabel","changeEndMonthLabel","changeEndYearLabel","clearFieldLabel","showCalendarLabel","ariaLabel","prevMonthIcon","nextMonthIcon","onCalendarOpenChanged","renderDayContent","calendarTestsProps","startDateTestsProps","endDateTestsProps","clearButtonTestId","showCalendarButtonTestId","id","accessible","readOnly","disableCalendarProp","before","props","daysStartRef","useRef","monthsStartRef","yearsStartRef","daysEndRef","monthsEndRef","yearsEndRef","disableCalendar","_onChange","useCallback","undefined","updateValue","onInternalValueChange","internalValue","isStartValid","isEndValid","i","formattedStartValue","formattedEndValue","mask","valueExists","Array","isArray","now","Date","start","end","refs","useMemo","onClear","rootRef","calendarRef","open","openCalendar","closeCalendar","toggleCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","maxElement","sizeY","handleRootRef","onCalendarChange","calendarPlacement","setCalendarPlacement","useState","locale","currentDateLabel","startDate","endDate","Intl","DateTimeFormat","weekday","year","month","day","format","join","currentDateLabelId","useId","ariaLabelId","showCalendarOnInputAreaClick","showCalendarButton","showClearButton","role","aria-labelledby","after","hoverMode","label","onClick","data-testid","div","Component","aria-hidden","tabIndex","onFocus","normalize","minValue","maxValue","onKeyDown","onElementSelect","targetRef","offsetByMainAxis","placement","onPlacementChange","onClose","Boolean","captureEscapeKeyboardEvent","mutationObserverOptions","aria-label"],"mappings":"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"}

package/dist/components/ModalCard/ModalCardInternal.d.ts CHANGED Viewed

@@ -9,5 +9,5 @@ export interface ModalCardInternalProps extends Omit<ModalCardProps, 'nav' | 'ke
  *
  * @private
  */
-export declare const ModalCardInternal: ({ icon, title, titleComponent, description, descriptionComponent, children, actions, size, open, style: styleProp, className, preventClose, ModalOverlay, modalOverlayTestId, modalDismissButtonTestId, getRootRef, dismissButtonMode, dismissLabel, noFocusToDialog, restoreFocus, onOpen, onOpened, onClose, onClosed, disableFocusTrap, disableModalOverlay, ...restProps }: ModalCardInternalProps) => ReactNode;
+export declare const ModalCardInternal: ({ icon, title, titleComponent, description, descriptionComponent, children, actions, size, open, style: styleProp, className, preventClose, ModalOverlay, modalOverlayTestId, modalDismissButtonTestId, getRootRef, dismissButtonMode, dismissLabel, noFocusToDialog, restoreFocus, onOpen, onOpened, onClose, onClosed, disableFocusTrap, disableModalOverlay, disableOpenAnimation, disableCloseAnimation, ...restProps }: ModalCardInternalProps) => ReactNode;
 //# sourceMappingURL=ModalCardInternal.d.ts.map

package/dist/components/ModalCard/ModalCardInternal.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalCardInternal.d.ts","sourceRoot":"","sources":["../../../src/components/ModalCard/ModalCardInternal.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,aAAa,EAAsB,KAAK,SAAS,EAAe,MAAM,OAAO,CAAC;AAa5F,OAAO,EAEL,KAAK,iBAAiB,EACvB,MAAM,8BAA8B,CAAC;AACtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAoB9C,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,KAAK,GAAG,aAAa,CAAC;IACzF,YAAY,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;CACjD;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,GAAI,~~gXA4B~~/B,sBAAsB,KAAG,~~SA+G3B~~,CAAC"}
1	+ {"version":3,"file":"ModalCardInternal.d.ts","sourceRoot":"","sources":["../../../src/components/ModalCard/ModalCardInternal.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,aAAa,EAAsB,KAAK,SAAS,EAAe,MAAM,OAAO,CAAC;AAa5F,OAAO,EAEL,KAAK,iBAAiB,EACvB,MAAM,8BAA8B,CAAC;AACtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAoB9C,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,KAAK,GAAG,aAAa,CAAC;IACzF,YAAY,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;CACjD;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,GAAI,6ZA8B/B,sBAAsB,KAAG,SAmH3B,CAAC"}

package/dist/components/ModalCard/ModalCardInternal.js CHANGED Viewed

@@ -35,7 +35,7 @@ const transitionStateClassNames = {
  *
  * @private
  */ export const ModalCardInternal = (_param)=>{
-    var { icon, title, titleComponent, description, descriptionComponent, children, actions, size, open, style: styleProp, className, preventClose, ModalOverlay = ModalOverlayDefault, modalOverlayTestId, modalDismissButtonTestId, getRootRef, dismissButtonMode, dismissLabel, noFocusToDialog, restoreFocus, onOpen, onOpened, onClose = noop, onClosed, disableFocusTrap, disableModalOverlay } = _param, restProps = _object_without_properties(_param, [
+    var { icon, title, titleComponent, description, descriptionComponent, children, actions, size, open, style: styleProp, className, preventClose, ModalOverlay = ModalOverlayDefault, modalOverlayTestId, modalDismissButtonTestId, getRootRef, dismissButtonMode, dismissLabel, noFocusToDialog, restoreFocus, onOpen, onOpened, onClose = noop, onClosed, disableFocusTrap, disableModalOverlay, disableOpenAnimation, disableCloseAnimation } = _param, restProps = _object_without_properties(_param, [
         "icon",
         "title",
         "titleComponent",
@@ -61,11 +61,15 @@ const transitionStateClassNames = {
         "onClose",
         "onClosed",
         "disableFocusTrap",
-        "disableModalOverlay"
+        "disableModalOverlay",
+        "disableOpenAnimation",
+        "disableCloseAnimation"
     ]);
     const platform = usePlatform();
     const [transitionState, { ref, onTransitionEnd }] = useCSSTransition(open, {
-        enableAppear: true,
+        enableAppear: !disableOpenAnimation,
+        enableEnter: !disableOpenAnimation,
+        enableExit: !disableCloseAnimation,
         onEnter () {
             onOpen === null || onOpen === void 0 ? void 0 : onOpen();
         },
@@ -99,6 +103,8 @@ const transitionStateClassNames = {
         getRootRef: setBackdropEl,
         "data-testid": modalOverlayTestId,
         visible: open,
+        disableOpenAnimation: disableOpenAnimation,
+        disableCloseAnimation: disableCloseAnimation,
         onClick: closable ? function handleBackdropClick(event) {
             onClose('click-overlay', event);
         } : undefined

package/dist/components/ModalCard/ModalCardInternal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/ModalCard/ModalCardInternal.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc /\n\nimport { type ComponentType, type KeyboardEvent, type ReactNode, useCallback } from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusTrap } from '../../hooks/useFocusTrap';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useVirtualKeyboardState } from '../../hooks/useVirtualKeyboardState';\nimport { Keys, pressedKey } from '../../lib/accessibility';\nimport { useCSSTransition, type UseCSSTransitionState } from '../../lib/animation';\nimport { useBottomSheet } from '../../lib/sheet';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { ModalCardBase } from '../ModalCardBase/ModalCardBase';\nimport { ModalOutlet } from '../ModalOutlet/ModalOutlet';\nimport {\n ModalOverlay as ModalOverlayDefault,\n type ModalOverlayProps,\n} from '../ModalOverlay/ModalOverlay';\nimport type { ModalCardProps } from './types';\nimport styles from './ModalCard.module.css';\n\nconst sizeByPlatformClassNames = {\n vkcom: styles['hostMaxWidthS'],\n ios: styles['hostMaxWidthM'],\n android: styles['hostMaxWidthL'],\n};\n\nconst transitionStateClassNames: Partial<Record<UseCSSTransitionState, string>> = {\n appear: styles['hostStateEnter'],\n appearing: styles['hostStateEntering'],\n\n enter: styles['hostStateEnter'],\n entering: styles['hostStateEntering'],\n\n exiting: styles['hostStateExiting'],\n exited: styles['hostStateExited'],\n};\n\nexport interface ModalCardInternalProps extends Omit<ModalCardProps, 'nav' \| 'keepMounted'> {\n ModalOverlay?: ComponentType<ModalOverlayProps>;\n}\n\n/\n В компоненте заложена вся логика модального окна.\n \n @private\n */\nexport const ModalCardInternal = ({\n icon,\n title,\n titleComponent,\n description,\n descriptionComponent,\n children,\n actions,\n size,\n open,\n style: styleProp,\n className,\n preventClose,\n ModalOverlay = ModalOverlayDefault,\n modalOverlayTestId,\n modalDismissButtonTestId,\n getRootRef,\n dismissButtonMode,\n dismissLabel,\n noFocusToDialog,\n restoreFocus,\n onOpen,\n onOpened,\n onClose = noop,\n onClosed,\n disableFocusTrap,\n disableModalOverlay,\n ...restProps\n}: ModalCardInternalProps): ReactNode => {\n const platform = usePlatform();\n const [transitionState, { ref, onTransitionEnd }] = useCSSTransition<HTMLDivElement>(open, {\n enableAppear: true,\n onEnter() {\n onOpen?.();\n },\n onEntered() {\n onOpened?.();\n },\n onExited() {\n onClosed?.();\n },\n });\n const opened = transitionState === 'appeared' \|\| transitionState === 'entered';\n const hidden = transitionState === 'exited';\n const closable = !preventClose && opened;\n\n const { isDesktop } = useAdaptivityWithJSMediaQueries();\n const bottomSheetEnabled = !isDesktop && !preventClose && transitionState !== 'exited';\n\n const { opened: keyboardOpened } = useVirtualKeyboardState(bottomSheetEnabled);\n const [{ setSheetEl, setBackdropEl }, bottomSheetEventHandlers] = useBottomSheet(\n bottomSheetEnabled,\n {\n blocked: keyboardOpened,\n snapPoint: 'auto',\n sheetCSSProperty: '--vkui_internal_ModalCard--translateY',\n backdropCSSProperty: '--vkui_internal--modal-overlay--opacity',\n onDismiss() {\n onClose?.('swipe-down');\n },\n },\n );\n const handleRef = useExternRef<HTMLDivElement>(setSheetEl, ref, getRootRef);\n const style = keyboardOpened\n ? {\n ...styleProp,\n '--vkui_internal_ModalCard--safeAreaInsetBottom': '0px',\n }\n : styleProp;\n const modalOverlay = !disableModalOverlay && (\n <ModalOverlay\n getRootRef={setBackdropEl}\n data-testid={modalOverlayTestId}\n visible={open}\n onClick={\n closable\n ? function handleBackdropClick(event) {\n onClose('click-overlay', event);\n }\n : undefined\n }\n />\n );\n const handleEscKeyDown = useCallback(\n (event: KeyboardEvent<HTMLElement>) => {\n if (closable && pressedKey(event) === Keys.ESCAPE) {\n onClose('escape-key');\n }\n },\n [closable, onClose],\n );\n\n useScrollLock(!hidden);\n useFocusTrap(ref, {\n autoFocus: !noFocusToDialog,\n disabled: !opened \|\| hidden \|\| disableFocusTrap,\n restoreFocus,\n });\n\n return (\n <ModalOutlet\n hidden={hidden}\n isDesktop={isDesktop}\n onKeyDown={handleEscKeyDown}\n disableModalOverlay={disableModalOverlay}\n >\n {modalOverlay}\n <ModalCardBase\n {...restProps}\n tabIndex={-1}\n role=\"dialog\"\n aria-modal=\"true\"\n getRootRef={handleRef}\n style={style}\n className={classNames(\n styles.host,\n isDesktop ? styles.hostDesktop : styles.hostMobile,\n sizeByPlatformClassNames[platform],\n transitionStateClassNames[transitionState],\n className,\n )}\n onTransitionEnd={onTransitionEnd}\n {...bottomSheetEventHandlers}\n icon={icon}\n title={title}\n titleComponent={titleComponent}\n description={description}\n descriptionComponent={descriptionComponent}\n actions={actions}\n onClose={() => onClose('click-close-button')}\n size={size}\n modalDismissButtonTestId={modalDismissButtonTestId}\n dismissButtonMode={dismissButtonMode}\n dismissLabel={dismissLabel}\n >\n {children}\n </ModalCardBase>\n </ModalOutlet>\n );\n};\n"],"names":["useCallback","classNames","noop","useAdaptivityWithJSMediaQueries","useExternRef","useFocusTrap","usePlatform","useVirtualKeyboardState","Keys","pressedKey","useCSSTransition","useBottomSheet","useScrollLock","ModalCardBase","ModalOutlet","ModalOverlay","ModalOverlayDefault","sizeByPlatformClassNames","vkcom","ios","android","transitionStateClassNames","appear","appearing","enter","entering","exiting","exited","ModalCardInternal","icon","title","titleComponent","description","descriptionComponent","children","actions","size","open","style","styleProp","className","preventClose","modalOverlayTestId","modalDismissButtonTestId","getRootRef","dismissButtonMode","dismissLabel","noFocusToDialog","restoreFocus","onOpen","onOpened","onClose","onClosed","disableFocusTrap","disableModalOverlay","restProps","platform","transitionState","ref","onTransitionEnd","enableAppear","onEnter","onEntered","onExited","opened","hidden","closable","isDesktop","bottomSheetEnabled","keyboardOpened","setSheetEl","setBackdropEl","bottomSheetEventHandlers","blocked","snapPoint","sheetCSSProperty","backdropCSSProperty","onDismiss","handleRef","modalOverlay","data-testid","visible","onClick","handleBackdropClick","event","undefined","handleEscKeyDown","ESCAPE","autoFocus","disabled","onKeyDown","tabIndex","role","aria-modal"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../src/components/ModalCard/ModalCardInternal.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc /\n\nimport { type ComponentType, type KeyboardEvent, type ReactNode, useCallback } from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusTrap } from '../../hooks/useFocusTrap';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useVirtualKeyboardState } from '../../hooks/useVirtualKeyboardState';\nimport { Keys, pressedKey } from '../../lib/accessibility';\nimport { useCSSTransition, type UseCSSTransitionState } from '../../lib/animation';\nimport { useBottomSheet } from '../../lib/sheet';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { ModalCardBase } from '../ModalCardBase/ModalCardBase';\nimport { ModalOutlet } from '../ModalOutlet/ModalOutlet';\nimport {\n ModalOverlay as ModalOverlayDefault,\n type ModalOverlayProps,\n} from '../ModalOverlay/ModalOverlay';\nimport type { ModalCardProps } from './types';\nimport styles from './ModalCard.module.css';\n\nconst sizeByPlatformClassNames = {\n vkcom: styles['hostMaxWidthS'],\n ios: styles['hostMaxWidthM'],\n android: styles['hostMaxWidthL'],\n};\n\nconst transitionStateClassNames: Partial<Record<UseCSSTransitionState, string>> = {\n appear: styles['hostStateEnter'],\n appearing: styles['hostStateEntering'],\n\n enter: styles['hostStateEnter'],\n entering: styles['hostStateEntering'],\n\n exiting: styles['hostStateExiting'],\n exited: styles['hostStateExited'],\n};\n\nexport interface ModalCardInternalProps extends Omit<ModalCardProps, 'nav' \| 'keepMounted'> {\n ModalOverlay?: ComponentType<ModalOverlayProps>;\n}\n\n/\n В компоненте заложена вся логика модального окна.\n \n @private\n */\nexport const ModalCardInternal = ({\n icon,\n title,\n titleComponent,\n description,\n descriptionComponent,\n children,\n actions,\n size,\n open,\n style: styleProp,\n className,\n preventClose,\n ModalOverlay = ModalOverlayDefault,\n modalOverlayTestId,\n modalDismissButtonTestId,\n getRootRef,\n dismissButtonMode,\n dismissLabel,\n noFocusToDialog,\n restoreFocus,\n onOpen,\n onOpened,\n onClose = noop,\n onClosed,\n disableFocusTrap,\n disableModalOverlay,\n disableOpenAnimation,\n disableCloseAnimation,\n ...restProps\n}: ModalCardInternalProps): ReactNode => {\n const platform = usePlatform();\n const [transitionState, { ref, onTransitionEnd }] = useCSSTransition<HTMLDivElement>(open, {\n enableAppear: !disableOpenAnimation,\n enableEnter: !disableOpenAnimation,\n enableExit: !disableCloseAnimation,\n onEnter() {\n onOpen?.();\n },\n onEntered() {\n onOpened?.();\n },\n onExited() {\n onClosed?.();\n },\n });\n const opened = transitionState === 'appeared' \|\| transitionState === 'entered';\n const hidden = transitionState === 'exited';\n const closable = !preventClose && opened;\n\n const { isDesktop } = useAdaptivityWithJSMediaQueries();\n const bottomSheetEnabled = !isDesktop && !preventClose && transitionState !== 'exited';\n\n const { opened: keyboardOpened } = useVirtualKeyboardState(bottomSheetEnabled);\n const [{ setSheetEl, setBackdropEl }, bottomSheetEventHandlers] = useBottomSheet(\n bottomSheetEnabled,\n {\n blocked: keyboardOpened,\n snapPoint: 'auto',\n sheetCSSProperty: '--vkui_internal_ModalCard--translateY',\n backdropCSSProperty: '--vkui_internal--modal-overlay--opacity',\n onDismiss() {\n onClose?.('swipe-down');\n },\n },\n );\n const handleRef = useExternRef<HTMLDivElement>(setSheetEl, ref, getRootRef);\n const style = keyboardOpened\n ? {\n ...styleProp,\n '--vkui_internal_ModalCard--safeAreaInsetBottom': '0px',\n }\n : styleProp;\n const modalOverlay = !disableModalOverlay && (\n <ModalOverlay\n getRootRef={setBackdropEl}\n data-testid={modalOverlayTestId}\n visible={open}\n disableOpenAnimation={disableOpenAnimation}\n disableCloseAnimation={disableCloseAnimation}\n onClick={\n closable\n ? function handleBackdropClick(event) {\n onClose('click-overlay', event);\n }\n : undefined\n }\n />\n );\n const handleEscKeyDown = useCallback(\n (event: KeyboardEvent<HTMLElement>) => {\n if (closable && pressedKey(event) === Keys.ESCAPE) {\n onClose('escape-key');\n }\n },\n [closable, onClose],\n );\n\n useScrollLock(!hidden);\n useFocusTrap(ref, {\n autoFocus: !noFocusToDialog,\n disabled: !opened \|\| hidden \|\| disableFocusTrap,\n restoreFocus,\n });\n\n return (\n <ModalOutlet\n hidden={hidden}\n isDesktop={isDesktop}\n onKeyDown={handleEscKeyDown}\n disableModalOverlay={disableModalOverlay}\n >\n {modalOverlay}\n <ModalCardBase\n {...restProps}\n tabIndex={-1}\n role=\"dialog\"\n aria-modal=\"true\"\n getRootRef={handleRef}\n style={style}\n className={classNames(\n styles.host,\n isDesktop ? styles.hostDesktop : styles.hostMobile,\n sizeByPlatformClassNames[platform],\n transitionStateClassNames[transitionState],\n className,\n )}\n onTransitionEnd={onTransitionEnd}\n {...bottomSheetEventHandlers}\n icon={icon}\n title={title}\n titleComponent={titleComponent}\n description={description}\n descriptionComponent={descriptionComponent}\n actions={actions}\n onClose={() => onClose('click-close-button')}\n size={size}\n modalDismissButtonTestId={modalDismissButtonTestId}\n dismissButtonMode={dismissButtonMode}\n dismissLabel={dismissLabel}\n >\n {children}\n </ModalCardBase>\n </ModalOutlet>\n );\n};\n"],"names":["useCallback","classNames","noop","useAdaptivityWithJSMediaQueries","useExternRef","useFocusTrap","usePlatform","useVirtualKeyboardState","Keys","pressedKey","useCSSTransition","useBottomSheet","useScrollLock","ModalCardBase","ModalOutlet","ModalOverlay","ModalOverlayDefault","sizeByPlatformClassNames","vkcom","ios","android","transitionStateClassNames","appear","appearing","enter","entering","exiting","exited","ModalCardInternal","icon","title","titleComponent","description","descriptionComponent","children","actions","size","open","style","styleProp","className","preventClose","modalOverlayTestId","modalDismissButtonTestId","getRootRef","dismissButtonMode","dismissLabel","noFocusToDialog","restoreFocus","onOpen","onOpened","onClose","onClosed","disableFocusTrap","disableModalOverlay","disableOpenAnimation","disableCloseAnimation","restProps","platform","transitionState","ref","onTransitionEnd","enableAppear","enableEnter","enableExit","onEnter","onEntered","onExited","opened","hidden","closable","isDesktop","bottomSheetEnabled","keyboardOpened","setSheetEl","setBackdropEl","bottomSheetEventHandlers","blocked","snapPoint","sheetCSSProperty","backdropCSSProperty","onDismiss","handleRef","modalOverlay","data-testid","visible","onClick","handleBackdropClick","event","undefined","handleEscKeyDown","ESCAPE","autoFocus","disabled","onKeyDown","tabIndex","role","aria-modal"],"mappings":"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"}

package/dist/components/ModalCard/types.d.ts CHANGED Viewed

@@ -52,8 +52,16 @@ export interface ModalCardProps extends NavIdProps, Omit<ModalCardBaseProps, 'id
     /**
      * Отключает отображение и взаимодействие с фоном модалки.
      * > При использовании `ModalCard` внутри `ModalRoot` есть особенность использования этого свойства.
-     * > Об этом можно почитать на странице документации [`ModalRoot`](/components/modal-root#otklyuchenie-zadnego-fona-u-konkretnogo-modalnogo-okna).
+     * > Об этом можно почитать на странице документации [`ModalRoot`](/components/modal-root#disable-modal-overlay).
      */
     disableModalOverlay?: boolean;
+    /**
+     * Отключает анимацию открытия модалки.
+     */
+    disableOpenAnimation?: boolean;
+    /**
+     * Отключает анимацию закрытия модалки.
+     */
+    disableCloseAnimation?: boolean;
 }
 //# sourceMappingURL=types.d.ts.map

package/dist/components/ModalCard/types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/ModalCard/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACrC,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AAC9D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAEzE,MAAM,MAAM,oBAAoB,GAC5B,eAAe,GACf,oBAAoB,GACpB,YAAY,GACZ,YAAY,CAAC;AAEjB,MAAM,WAAW,cACf,SAAQ,UAAU,EAChB,IAAI,CAAC,kBAAkB,EAAE,IAAI,GAAG,SAAS,GAAG,iBAAiB,GAAG,MAAM,sBAAsB,CAAC,EAC7F,IAAI,CAAC,iBAAiB,EAAE,cAAc,CAAC;IACzC;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,oBAAoB,EAAE,KAAK,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC/E;;OAEG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,iBAAiB,CAAC,UAAU,CAAC,CAAC;IACjD;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;~~CAC~~/B"}
1	+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/ModalCard/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACrC,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AAC9D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAEzE,MAAM,MAAM,oBAAoB,GAC5B,eAAe,GACf,oBAAoB,GACpB,YAAY,GACZ,YAAY,CAAC;AAEjB,MAAM,WAAW,cACf,SAAQ,UAAU,EAChB,IAAI,CAAC,kBAAkB,EAAE,IAAI,GAAG,SAAS,GAAG,iBAAiB,GAAG,MAAM,sBAAsB,CAAC,EAC7F,IAAI,CAAC,iBAAiB,EAAE,cAAc,CAAC;IACzC;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,oBAAoB,EAAE,KAAK,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC/E;;OAEG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,iBAAiB,CAAC,UAAU,CAAC,CAAC;IACjD;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC"}

package/dist/components/ModalCard/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/ModalCard/types.ts"],"sourcesContent":["import type { UIEvent } from 'react';\nimport { type UseFocusTrapProps } from '../../hooks/useFocusTrap';\nimport type { NavIdProps } from '../../lib/getNavId';\nimport type { UseBottomSheetHandlers } from '../../lib/sheet';\nimport type { ModalCardBaseProps } from '../ModalCardBase/ModalCardBase';\n\nexport type ModalCardCloseReason =\n \| 'click-overlay'\n \| 'click-close-button'\n \| 'escape-key'\n \| 'swipe-down';\n\nexport interface ModalCardProps\n extends NavIdProps,\n Omit<ModalCardBaseProps, 'id' \| 'onClose' \| 'onTransitionEnd' \| keyof UseBottomSheetHandlers>,\n Pick<UseFocusTrapProps, 'restoreFocus'> {\n /*\n Состояние видимости.\n \n @default false\n /\n open?: boolean;\n /\n Сохранять ли компонент в DOM при `open={false}`.\n \n @default false\n /\n keepMounted?: boolean;\n /\n Отключает фокус на интерактивный элемент после открытия модалки.\n \n > Важно установить фокус после открытия в любое место модалки используя событие `onOpened`, иначе не будет работать закрытие по нажатию `Esc`.\n /\n noFocusToDialog?: boolean;\n /\n `data-testid` для оверлея.\n /\n modalOverlayTestId?: string;\n /\n Будет вызвано при начале открытия модалки.\n /\n onOpen?: VoidFunction;\n /\n Будет вызвано при окончательном открытии модалки.\n /\n onOpened?: VoidFunction;\n /\n Будет вызвано при начале закрытия модалки.\n /\n onClose?: (reason: ModalCardCloseReason, event?: UIEvent<HTMLElement>) => void;\n /\n Будет вызвано при окончательном закрытии модалки.\n /\n onClosed?: VoidFunction;\n /\n Позволяет отключить захват фокуса.\n \n Нужно использовать, когда поверх одной модалки открывается другая, чтобы два `FocusTrap` не конфликтовали.\n /\n disableFocusTrap?: UseFocusTrapProps['disabled'];\n /\n Отключает отображение и взаимодействие с фоном модалки.\n * > При использовании `ModalCard` внутри `ModalRoot` есть особенность использования этого свойства.\n * > Об этом можно почитать на странице документации [`ModalRoot`](/components/modal-root#~~otklyuchenie~~-~~zadnego~~-~~fona-u-konkretnogo-modalnogo-okna~~).\n */\n disableModalOverlay?: boolean;\n}\n"],"names":[],"mappings":"AAYA,~~WAsDC~~"}
1	+ {"version":3,"sources":["../../../src/components/ModalCard/types.ts"],"sourcesContent":["import type { UIEvent } from 'react';\nimport { type UseFocusTrapProps } from '../../hooks/useFocusTrap';\nimport type { NavIdProps } from '../../lib/getNavId';\nimport type { UseBottomSheetHandlers } from '../../lib/sheet';\nimport type { ModalCardBaseProps } from '../ModalCardBase/ModalCardBase';\n\nexport type ModalCardCloseReason =\n \| 'click-overlay'\n \| 'click-close-button'\n \| 'escape-key'\n \| 'swipe-down';\n\nexport interface ModalCardProps\n extends NavIdProps,\n Omit<ModalCardBaseProps, 'id' \| 'onClose' \| 'onTransitionEnd' \| keyof UseBottomSheetHandlers>,\n Pick<UseFocusTrapProps, 'restoreFocus'> {\n /*\n Состояние видимости.\n \n @default false\n /\n open?: boolean;\n /\n Сохранять ли компонент в DOM при `open={false}`.\n \n @default false\n /\n keepMounted?: boolean;\n /\n Отключает фокус на интерактивный элемент после открытия модалки.\n \n > Важно установить фокус после открытия в любое место модалки используя событие `onOpened`, иначе не будет работать закрытие по нажатию `Esc`.\n /\n noFocusToDialog?: boolean;\n /\n `data-testid` для оверлея.\n /\n modalOverlayTestId?: string;\n /\n Будет вызвано при начале открытия модалки.\n /\n onOpen?: VoidFunction;\n /\n Будет вызвано при окончательном открытии модалки.\n /\n onOpened?: VoidFunction;\n /\n Будет вызвано при начале закрытия модалки.\n /\n onClose?: (reason: ModalCardCloseReason, event?: UIEvent<HTMLElement>) => void;\n /\n Будет вызвано при окончательном закрытии модалки.\n /\n onClosed?: VoidFunction;\n /\n Позволяет отключить захват фокуса.\n \n Нужно использовать, когда поверх одной модалки открывается другая, чтобы два `FocusTrap` не конфликтовали.\n /\n disableFocusTrap?: UseFocusTrapProps['disabled'];\n /\n Отключает отображение и взаимодействие с фоном модалки.\n * > При использовании `ModalCard` внутри `ModalRoot` есть особенность использования этого свойства.\n * > Об этом можно почитать на странице документации [`ModalRoot`](/components/modal-root#disable-modal-overlay).\n /\n disableModalOverlay?: boolean;\n /\n Отключает анимацию открытия модалки.\n /\n disableOpenAnimation?: boolean;\n /\n Отключает анимацию закрытия модалки.\n */\n disableCloseAnimation?: boolean;\n}\n"],"names":[],"mappings":"AAYA,WA8DC"}

package/dist/components/ModalOverlay/ModalOverlay.d.ts CHANGED Viewed

@@ -4,9 +4,11 @@ export interface ModalOverlayProps extends DataHTMLAttributes<HTMLDivElement>, H
     visible?: boolean;
     position?: 'absolute' | 'fixed';
     onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
+    disableOpenAnimation?: boolean;
+    disableCloseAnimation?: boolean;
 }
 /**
  * @private
  */
-export declare const ModalOverlay: ({ visible, position, getRootRef, onClick, ...restProps }: ModalOverlayProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ModalOverlay: ({ visible, position, getRootRef, onClick, disableOpenAnimation, disableCloseAnimation, ...restProps }: ModalOverlayProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ModalOverlay.d.ts.map

package/dist/components/ModalOverlay/ModalOverlay.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalOverlay.d.ts","sourceRoot":"","sources":["../../../src/components/ModalOverlay/ModalOverlay.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,OAAO,CAAC;AAIhD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAoB9C,MAAM,WAAW,iBACf,SAAQ,kBAAkB,CAAC,cAAc,CAAC,EACxC,UAAU,CAAC,cAAc,CAAC;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC;IAChC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;~~CAC7D~~;AAED;;GAEG;AACH,eAAO,MAAM,YAAY,GAAI,~~0DAM1B~~,iBAAiB,~~4CAsBnB~~,CAAC"}
1	+ {"version":3,"file":"ModalOverlay.d.ts","sourceRoot":"","sources":["../../../src/components/ModalOverlay/ModalOverlay.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,OAAO,CAAC;AAIhD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAoB9C,MAAM,WAAW,iBACf,SAAQ,kBAAkB,CAAC,cAAc,CAAC,EACxC,UAAU,CAAC,cAAc,CAAC;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC;IAChC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC5D,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAED;;GAEG;AACH,eAAO,MAAM,YAAY,GAAI,uGAQ1B,iBAAiB,4CAwBnB,CAAC"}

package/dist/components/ModalOverlay/ModalOverlay.js CHANGED Viewed

@@ -24,14 +24,18 @@ const transitionStateClassNames = {
 /**
  * @private
  */ export const ModalOverlay = (_param)=>{
-    var { visible = false, position = 'absolute', getRootRef, onClick } = _param, restProps = _object_without_properties(_param, [
+    var { visible = false, position = 'absolute', getRootRef, onClick, disableOpenAnimation, disableCloseAnimation } = _param, restProps = _object_without_properties(_param, [
         "visible",
         "position",
         "getRootRef",
-        "onClick"
+        "onClick",
+        "disableOpenAnimation",
+        "disableCloseAnimation"
     ]);
     const [transitionState, { ref, onTransitionEnd }] = useCSSTransition(visible, {
-        enableAppear: true
+        enableAppear: !disableOpenAnimation,
+        enableEnter: !disableOpenAnimation,
+        enableExit: !disableCloseAnimation
     });
     const handleRef = useExternRef(getRootRef, ref);
     return /*#__PURE__*/ _jsx("div", _object_spread_props(_object_spread({}, restProps), {

package/dist/components/ModalOverlay/ModalOverlay.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/ModalOverlay/ModalOverlay.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc /\n\nimport type { DataHTMLAttributes } from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useCSSTransition, type UseCSSTransitionState } from '../../lib/animation/useCSSTransition';\nimport type { HasRootRef } from '../../types';\nimport styles from './ModalOverlay.module.css';\n\nconst positionClassNames = {\n absolute: styles.hostPositionAbsolute,\n fixed: styles.hostPositionFixed,\n};\n\nconst transitionStateClassNames: Partial<Record<UseCSSTransitionState, string>> = {\n appear: styles['hostStateEnter'],\n appearing: styles['hostStateEntering'],\n appeared: styles['hostStateEntered'],\n enter: styles['hostStateEnter'],\n entering: styles['hostStateEntering'],\n entered: styles['hostStateEntered'],\n exit: styles['hostStateExit'],\n exiting: styles['hostStateExiting'],\n exited: styles['hostStateExited'],\n};\n\nexport interface ModalOverlayProps\n extends DataHTMLAttributes<HTMLDivElement>,\n HasRootRef<HTMLDivElement> {\n visible?: boolean;\n position?: 'absolute' \| 'fixed';\n onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;\n}\n\n/\n @private\n */\nexport const ModalOverlay = ({\n visible = false,\n position = 'absolute',\n getRootRef,\n onClick,\n ...restProps\n}: ModalOverlayProps) => {\n const [transitionState, { ref, onTransitionEnd }] = useCSSTransition<HTMLDivElement>(visible, {\n enableAppear: ~~true~~,\n });\n const handleRef = useExternRef(getRootRef, ref);\n\n return (\n <div\n {...restProps}\n ref={handleRef}\n aria-hidden=\"true\"\n hidden={transitionState === 'exited'}\n className={classNames(\n styles.host,\n onClick === undefined && styles.nonInteractive,\n positionClassNames[position],\n transitionStateClassNames[transitionState],\n )}\n onClick={onClick}\n onTransitionEnd={onTransitionEnd}\n />\n );\n};\n"],"names":["classNames","useExternRef","useCSSTransition","positionClassNames","absolute","fixed","transitionStateClassNames","appear","appearing","appeared","enter","entering","entered","exit","exiting","exited","ModalOverlay","visible","position","getRootRef","onClick","restProps","transitionState","ref","onTransitionEnd","enableAppear","handleRef","div","aria-hidden","hidden","className","undefined"],"mappings":"AAAA;;;;;AAIA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,gBAAgB,QAAoC,0CAAuC;AAIpG,MAAMC,qBAAqB;IACzBC,QAAQ;IACRC,KAAK;AACP;AAEA,MAAMC,4BAA4E;IAChFC,MAAM;IACNC,SAAS;IACTC,QAAQ;IACRC,KAAK;IACLC,QAAQ;IACRC,OAAO;IACPC,IAAI;IACJC,OAAO;IACPC,MAAM;AACR;~~AAUA~~;;CAEC,GACD,OAAO,MAAMC,eAAe;QAAC,EAC3BC,UAAU,KAAK,EACfC,WAAW,UAAU,EACrBC,UAAU,EACVC,OAAO,~~EAEW~~,WADfC;~~QAJHJ~~;QACAC;QACAC;QACAC;;IAGA,MAAM,CAACE,iBAAiB,EAAEC,GAAG,EAAEC,eAAe,EAAE,CAAC,~~GAAGtB~~,iBAAiCe,SAAS;~~QAC5FQ~~,cAAc;~~IAChB~~;IACA,~~MAAMC~~,~~YAAYzB~~,aAAakB,~~YAAYI~~;IAE3C,qBACE,~~KAACI~~,+~~CACKN~~;QACJE,~~KAAKG~~;QACLE,eAAY;QACZC,~~QAAQP~~,oBAAoB;~~QAC5BQ~~,~~WAAW9B~~,qCAEToB,~~YAAYW~~,~~iDACZ5B~~,kBAAkB,CAACe,SAAS,EAC5BZ,yBAAyB,~~CAACgB~~,gBAAgB;~~QAE5CF~~,SAASA;~~QACTI~~,iBAAiBA;;AAGvB,EAAE"}
1	+ {"version":3,"sources":["../../../src/components/ModalOverlay/ModalOverlay.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc /\n\nimport type { DataHTMLAttributes } from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useCSSTransition, type UseCSSTransitionState } from '../../lib/animation/useCSSTransition';\nimport type { HasRootRef } from '../../types';\nimport styles from './ModalOverlay.module.css';\n\nconst positionClassNames = {\n absolute: styles.hostPositionAbsolute,\n fixed: styles.hostPositionFixed,\n};\n\nconst transitionStateClassNames: Partial<Record<UseCSSTransitionState, string>> = {\n appear: styles['hostStateEnter'],\n appearing: styles['hostStateEntering'],\n appeared: styles['hostStateEntered'],\n enter: styles['hostStateEnter'],\n entering: styles['hostStateEntering'],\n entered: styles['hostStateEntered'],\n exit: styles['hostStateExit'],\n exiting: styles['hostStateExiting'],\n exited: styles['hostStateExited'],\n};\n\nexport interface ModalOverlayProps\n extends DataHTMLAttributes<HTMLDivElement>,\n HasRootRef<HTMLDivElement> {\n visible?: boolean;\n position?: 'absolute' \| 'fixed';\n onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;\n disableOpenAnimation?: boolean;\n disableCloseAnimation?: boolean;\n}\n\n/\n @private\n */\nexport const ModalOverlay = ({\n visible = false,\n position = 'absolute',\n getRootRef,\n onClick,\n disableOpenAnimation,\n disableCloseAnimation,\n ...restProps\n}: ModalOverlayProps) => {\n const [transitionState, { ref, onTransitionEnd }] = useCSSTransition<HTMLDivElement>(visible, {\n enableAppear: !disableOpenAnimation,\n enableEnter: !disableOpenAnimation,\n enableExit: !disableCloseAnimation,\n });\n const handleRef = useExternRef(getRootRef, ref);\n\n return (\n <div\n {...restProps}\n ref={handleRef}\n aria-hidden=\"true\"\n hidden={transitionState === 'exited'}\n className={classNames(\n styles.host,\n onClick === undefined && styles.nonInteractive,\n positionClassNames[position],\n transitionStateClassNames[transitionState],\n )}\n onClick={onClick}\n onTransitionEnd={onTransitionEnd}\n />\n );\n};\n"],"names":["classNames","useExternRef","useCSSTransition","positionClassNames","absolute","fixed","transitionStateClassNames","appear","appearing","appeared","enter","entering","entered","exit","exiting","exited","ModalOverlay","visible","position","getRootRef","onClick","disableOpenAnimation","disableCloseAnimation","restProps","transitionState","ref","onTransitionEnd","enableAppear","enableEnter","enableExit","handleRef","div","aria-hidden","hidden","className","undefined"],"mappings":"AAAA;;;;;AAIA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,gBAAgB,QAAoC,0CAAuC;AAIpG,MAAMC,qBAAqB;IACzBC,QAAQ;IACRC,KAAK;AACP;AAEA,MAAMC,4BAA4E;IAChFC,MAAM;IACNC,SAAS;IACTC,QAAQ;IACRC,KAAK;IACLC,QAAQ;IACRC,OAAO;IACPC,IAAI;IACJC,OAAO;IACPC,MAAM;AACR;AAYA;;CAEC,GACD,OAAO,MAAMC,eAAe;QAAC,EAC3BC,UAAU,KAAK,EACfC,WAAW,UAAU,EACrBC,UAAU,EACVC,OAAO,EACPC,oBAAoB,EACpBC,qBAAqB,EAEH,WADfC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAM,CAACE,iBAAiB,EAAEC,GAAG,EAAEC,eAAe,EAAE,CAAC,GAAGxB,iBAAiCe,SAAS;QAC5FU,cAAc,CAACN;QACfO,aAAa,CAACP;QACdQ,YAAY,CAACP;IACf;IACA,MAAMQ,YAAY7B,aAAakB,YAAYM;IAE3C,qBACE,KAACM,+CACKR;QACJE,KAAKK;QACLE,eAAY;QACZC,QAAQT,oBAAoB;QAC5BU,WAAWlC,qCAEToB,YAAYe,iDACZhC,kBAAkB,CAACe,SAAS,EAC5BZ,yBAAyB,CAACkB,gBAAgB;QAE5CJ,SAASA;QACTM,iBAAiBA;;AAGvB,EAAE"}

package/dist/components/ModalPage/ModalPageInternal.d.ts CHANGED Viewed

@@ -12,5 +12,5 @@ export interface ModalPageInternalProps extends Omit<ModalPageProps, 'nav' | 'ke
  *
  * @private
  */
-export declare const ModalPageInternal: ({ open, header, footer, size: desktopMaxWidth, height, children, className, style, snapPoint, onSnapPointChange, getModalContentRef, ModalOverlay, modalOverlayTestId, modalContentTestId, modalDismissButtonTestId, modalDismissButtonLabel, outsideButtons, noFocusToDialog, hideCloseButton, preventClose, disableContentPanningGesture, restoreFocus, onOpen, onOpened, onClose, onClosed, disableFocusTrap, disableModalOverlay, ...restProps }: ModalPageInternalProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ModalPageInternal: ({ open, header, footer, size: desktopMaxWidth, height, children, className, style, snapPoint, onSnapPointChange, getModalContentRef, ModalOverlay, modalOverlayTestId, modalContentTestId, modalDismissButtonTestId, modalDismissButtonLabel, outsideButtons, noFocusToDialog, hideCloseButton, preventClose, disableContentPanningGesture, restoreFocus, onOpen, onOpened, onClose, onClosed, disableFocusTrap, disableModalOverlay, disableOpenAnimation, disableCloseAnimation, ...restProps }: ModalPageInternalProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ModalPageInternal.d.ts.map

package/dist/components/ModalPage/ModalPageInternal.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalPageInternal.d.ts","sourceRoot":"","sources":["../../../src/components/ModalPage/ModalPageInternal.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,aAAa,EAAmC,MAAM,OAAO,CAAC;AAQ5E,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,eAAe,EAAkB,MAAM,iBAAiB,CAAC;AAMvF,OAAO,EAEL,KAAK,iBAAiB,EACvB,MAAM,8BAA8B,CAAC;AAEtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAc9C,MAAM,WAAW,sBACf,SAAQ,IAAI,CAAC,cAAc,EAAE,KAAK,GAAG,aAAa,GAAG,gBAAgB,GAAG,sBAAsB,CAAC;IAC/F,SAAS,EAAE,SAAS,CAAC;IACrB,YAAY,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAChD,iBAAiB,CAAC,EAAE,eAAe,CAAC;CACrC;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,GAAI,~~sbA8B~~/B,sBAAsB,~~4CA8HxB~~,CAAC"}
1	+ {"version":3,"file":"ModalPageInternal.d.ts","sourceRoot":"","sources":["../../../src/components/ModalPage/ModalPageInternal.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,aAAa,EAAmC,MAAM,OAAO,CAAC;AAQ5E,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,eAAe,EAAkB,MAAM,iBAAiB,CAAC;AAMvF,OAAO,EAEL,KAAK,iBAAiB,EACvB,MAAM,8BAA8B,CAAC;AAEtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAc9C,MAAM,WAAW,sBACf,SAAQ,IAAI,CAAC,cAAc,EAAE,KAAK,GAAG,aAAa,GAAG,gBAAgB,GAAG,sBAAsB,CAAC;IAC/F,SAAS,EAAE,SAAS,CAAC;IACrB,YAAY,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAChD,iBAAiB,CAAC,EAAE,eAAe,CAAC;CACrC;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,GAAI,meAgC/B,sBAAsB,4CAkIxB,CAAC"}

package/dist/components/ModalPage/ModalPageInternal.js CHANGED Viewed

@@ -31,7 +31,7 @@ const transitionStateClassNames = {
  *
  * @private
  */ export const ModalPageInternal = (_param)=>{
-    var { open, header, footer, size: desktopMaxWidth, height, children, className, style, snapPoint, onSnapPointChange, getModalContentRef, ModalOverlay = ModalOverlayDefault, modalOverlayTestId, modalContentTestId, modalDismissButtonTestId, modalDismissButtonLabel = 'Закрыть', outsideButtons, noFocusToDialog, hideCloseButton, preventClose, disableContentPanningGesture, restoreFocus, onOpen, onOpened, onClose = noop, onClosed, disableFocusTrap, disableModalOverlay } = _param, restProps = _object_without_properties(_param, [
+    var { open, header, footer, size: desktopMaxWidth, height, children, className, style, snapPoint, onSnapPointChange, getModalContentRef, ModalOverlay = ModalOverlayDefault, modalOverlayTestId, modalContentTestId, modalDismissButtonTestId, modalDismissButtonLabel = 'Закрыть', outsideButtons, noFocusToDialog, hideCloseButton, preventClose, disableContentPanningGesture, restoreFocus, onOpen, onOpened, onClose = noop, onClosed, disableFocusTrap, disableModalOverlay, disableOpenAnimation = false, disableCloseAnimation = false } = _param, restProps = _object_without_properties(_param, [
         "open",
         "header",
         "footer",
@@ -59,11 +59,15 @@ const transitionStateClassNames = {
         "onClose",
         "onClosed",
         "disableFocusTrap",
-        "disableModalOverlay"
+        "disableModalOverlay",
+        "disableOpenAnimation",
+        "disableCloseAnimation"
     ]);
     const { hasCustomPanelHeaderAfter } = useConfigProvider();
     const [transitionState, { ref, onTransitionEnd }] = useCSSTransition(open, {
-        enableAppear: true,
+        enableAppear: !disableOpenAnimation,
+        enableEnter: !disableOpenAnimation,
+        enableExit: !disableCloseAnimation,
         onEnter () {
             onOpen === null || onOpen === void 0 ? void 0 : onOpen();
         },
@@ -103,6 +107,8 @@ const transitionStateClassNames = {
         getRootRef: setBackdropEl,
         "data-testid": modalOverlayTestId,
         visible: open,
+        disableOpenAnimation: disableOpenAnimation,
+        disableCloseAnimation: disableCloseAnimation,
         onClick: closable ? function handleBackdropClick(event) {
             onClose('click-overlay', event);
         } : undefined

package/dist/components/ModalPage/ModalPageInternal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/ModalPage/ModalPageInternal.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc /\n\nimport { type ComponentType, type KeyboardEvent, useCallback } from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { mergeStyle } from '../../helpers/mergeStyle';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useVirtualKeyboardState } from '../../hooks/useVirtualKeyboardState';\nimport { Keys, pressedKey } from '../../lib/accessibility';\nimport { useCSSTransition, type UseCSSTransitionState } from '../../lib/animation';\nimport { type SnapPoint, type SnapPointChange, useBottomSheet } from '../../lib/sheet';\nimport type { CSSCustomProperties } from '../../types';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { ModalOutlet } from '../ModalOutlet/ModalOutlet';\nimport {\n ModalOverlay as ModalOverlayDefault,\n type ModalOverlayProps,\n} from '../ModalOverlay/ModalOverlay';\nimport { ModalPageBase } from './ModalPageBase';\nimport type { ModalPageProps } from './types';\nimport styles from './ModalPage.module.css';\n\nconst transitionStateClassNames: Partial<Record<UseCSSTransitionState, string>> = {\n appear: styles['documentStateEnter'],\n appearing: styles['documentStateEntering'],\n\n enter: styles['documentStateEnter'],\n entering: styles['documentStateEntering'],\n\n exiting: styles['documentStateExiting'],\n exited: styles['documentStateExited'],\n};\n\nexport interface ModalPageInternalProps\n extends Omit<ModalPageProps, 'nav' \| 'keepMounted' \| 'settlingHeight' \| 'dynamicContentHeight'> {\n snapPoint: SnapPoint;\n ModalOverlay?: ComponentType<ModalOverlayProps>;\n onSnapPointChange?: SnapPointChange;\n}\n\n/\n В компоненте заложена вся логика модального окна.\n \n @private\n */\nexport const ModalPageInternal = ({\n open,\n header,\n footer,\n size: desktopMaxWidth,\n height,\n children,\n className,\n style,\n snapPoint,\n onSnapPointChange,\n getModalContentRef,\n ModalOverlay = ModalOverlayDefault,\n modalOverlayTestId,\n modalContentTestId,\n modalDismissButtonTestId,\n modalDismissButtonLabel = 'Закрыть',\n outsideButtons,\n noFocusToDialog,\n hideCloseButton,\n preventClose,\n disableContentPanningGesture,\n restoreFocus,\n onOpen,\n onOpened,\n onClose = noop,\n onClosed,\n disableFocusTrap,\n disableModalOverlay,\n ...restProps\n}: ModalPageInternalProps) => {\n const { hasCustomPanelHeaderAfter } = useConfigProvider();\n const [transitionState, { ref, onTransitionEnd }] = useCSSTransition<HTMLDivElement>(open, {\n enableAppear: true,\n onEnter() {\n onOpen?.();\n },\n onEntered() {\n onOpened?.();\n },\n onExited() {\n onClosed?.();\n },\n });\n const opened = transitionState === 'appeared' \|\| transitionState === 'entered';\n const hidden = transitionState === 'exited';\n const closable = !preventClose && opened;\n\n const { sizeX, isDesktop } = useAdaptivityWithJSMediaQueries();\n const bottomSheetEnabled = !isDesktop && !preventClose && transitionState !== 'exited';\n const { opened: keyboardOpened } = useVirtualKeyboardState(bottomSheetEnabled);\n\n const [{ initialStyle, setSheetEl, setSheetScrollEl, setBackdropEl }, bottomSheetEventHandlers] =\n useBottomSheet(bottomSheetEnabled, {\n blocked: keyboardOpened,\n snapPoint,\n sheetCSSProperty: '--vkui_internal_ModalPageDocument--snapPoint',\n backdropCSSProperty: '--vkui_internal--modal-overlay--opacity',\n onSnapPointChange,\n onDismiss() {\n onClose('swipe-down');\n },\n });\n const documentStyle = keyboardOpened\n ? {\n '--vkui_internal_ModalPageDocument--safeAreaInsetBottom': '0px',\n ...initialStyle,\n }\n : initialStyle;\n const handleSheetRef = useExternRef<HTMLDivElement>(setSheetEl, ref);\n const handleSheetScrollRef = useExternRef<HTMLDivElement>(setSheetScrollEl, getModalContentRef);\n\n const [desktopMaxWidthClassName, desktopMaxWidthStyle] = isDesktop\n ? resolveDesktopMaxWidth(desktopMaxWidth)\n : [undefined, undefined];\n\n const modalOverlay = !disableModalOverlay && (\n <ModalOverlay\n getRootRef={setBackdropEl}\n data-testid={modalOverlayTestId}\n visible={open}\n onClick={\n closable\n ? function handleBackdropClick(event) {\n onClose('click-overlay', event);\n }\n : undefined\n }\n />\n );\n const handleEscKeyDown = useCallback(\n (event: KeyboardEvent<HTMLElement>) => {\n if (closable && pressedKey(event) === Keys.ESCAPE) {\n onClose('escape-key');\n }\n },\n [closable, onClose],\n );\n\n useScrollLock(!hidden);\n\n return (\n <ModalOutlet\n hidden={hidden}\n isDesktop={isDesktop}\n onKeyDown={handleEscKeyDown}\n disableModalOverlay={disableModalOverlay}\n >\n {modalOverlay}\n <FocusTrap\n {...restProps}\n autoFocus={!noFocusToDialog}\n restoreFocus={restoreFocus}\n role=\"dialog\"\n aria-modal=\"true\"\n disabled={!opened \|\| hidden \|\| disableFocusTrap}\n className={classNames(\n className,\n styles.host,\n isDesktop ? styles.hostDesktop : styles.hostMobile,\n !isDesktop &&\n (hasCustomPanelHeaderAfter\n ? styles.hostMobileSafeAreaInsetTopWithCustomOffset\n : styles.hostMobileSafeAreaInsetTop),\n desktopMaxWidthClassName,\n sizeX === 'regular' && 'vkuiInternalModalPage--sizeX-regular',\n )}\n style={mergeStyle(mergeStyle(desktopMaxWidthStyle, getHeightCSSVariable(height)), style)}\n >\n <ModalPageBase\n {...bottomSheetEventHandlers}\n getRootRef={handleSheetRef}\n getRef={handleSheetScrollRef}\n style={documentStyle}\n className={classNames(\n isDesktop ? styles.documentDesktop : styles.documentMobile,\n transitionStateClassNames[transitionState],\n )}\n onTransitionEnd={onTransitionEnd}\n isDesktop={isDesktop}\n disableContentPanningGesture={disableContentPanningGesture}\n header={header}\n footer={footer}\n outsideButtons={outsideButtons}\n modalContentTestId={modalContentTestId}\n modalDismissButtonTestId={modalDismissButtonTestId}\n modalDismissButtonLabel={modalDismissButtonLabel}\n hideCloseButton={hideCloseButton}\n closable={closable}\n onClose={onClose}\n >\n {children}\n </ModalPageBase>\n </FocusTrap>\n </ModalOutlet>\n );\n};\n\nconst desktopMaxWidthClassNames = {\n s: styles['hostDesktopMaxWidthS'],\n m: styles['hostDesktopMaxWidthM'],\n l: styles['hostDesktopMaxWidthL'],\n};\n\nfunction resolveDesktopMaxWidth(\n desktopMaxWidth: ModalPageInternalProps['size'] = 's',\n): [string \| undefined, CSSCustomProperties \| undefined] {\n if (typeof desktopMaxWidth === 'number') {\n return [undefined, { '--vkui_internal_ModalPage--desktopMaxWidth': `${desktopMaxWidth}px` }];\n }\n\n return desktopMaxWidthClassNames.hasOwnProperty(desktopMaxWidth)\n ? [desktopMaxWidthClassNames[desktopMaxWidth], undefined]\n : [undefined, { '--vkui_internal_ModalPage--desktopMaxWidth': desktopMaxWidth }];\n}\n\nfunction getHeightCSSVariable(height?: number \| string): CSSCustomProperties \| undefined {\n return height !== undefined\n ? {\n '--vkui_internal_ModalPage--userHeight':\n typeof height === 'number' ? `${height}px` : height,\n }\n : undefined;\n}\n"],"names":["useCallback","classNames","noop","mergeStyle","useAdaptivityWithJSMediaQueries","useExternRef","useVirtualKeyboardState","Keys","pressedKey","useCSSTransition","useBottomSheet","useScrollLock","useConfigProvider","FocusTrap","ModalOutlet","ModalOverlay","ModalOverlayDefault","ModalPageBase","transitionStateClassNames","appear","appearing","enter","entering","exiting","exited","ModalPageInternal","open","header","footer","size","desktopMaxWidth","height","children","className","style","snapPoint","onSnapPointChange","getModalContentRef","modalOverlayTestId","modalContentTestId","modalDismissButtonTestId","modalDismissButtonLabel","outsideButtons","noFocusToDialog","hideCloseButton","preventClose","disableContentPanningGesture","restoreFocus","onOpen","onOpened","onClose","onClosed","disableFocusTrap","disableModalOverlay","restProps","hasCustomPanelHeaderAfter","transitionState","ref","onTransitionEnd","enableAppear","onEnter","onEntered","onExited","opened","hidden","closable","sizeX","isDesktop","bottomSheetEnabled","keyboardOpened","initialStyle","setSheetEl","setSheetScrollEl","setBackdropEl","bottomSheetEventHandlers","blocked","sheetCSSProperty","backdropCSSProperty","onDismiss","documentStyle","handleSheetRef","handleSheetScrollRef","desktopMaxWidthClassName","desktopMaxWidthStyle","resolveDesktopMaxWidth","undefined","modalOverlay","getRootRef","data-testid","visible","onClick","handleBackdropClick","event","handleEscKeyDown","ESCAPE","onKeyDown","autoFocus","role","aria-modal","disabled","getHeightCSSVariable","getRef","desktopMaxWidthClassNames","s","m","l","hasOwnProperty"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../src/components/ModalPage/ModalPageInternal.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc /\n\nimport { type ComponentType, type KeyboardEvent, useCallback } from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { mergeStyle } from '../../helpers/mergeStyle';\nimport { useAdaptivityWithJSMediaQueries } from '../../hooks/useAdaptivityWithJSMediaQueries';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useVirtualKeyboardState } from '../../hooks/useVirtualKeyboardState';\nimport { Keys, pressedKey } from '../../lib/accessibility';\nimport { useCSSTransition, type UseCSSTransitionState } from '../../lib/animation';\nimport { type SnapPoint, type SnapPointChange, useBottomSheet } from '../../lib/sheet';\nimport type { CSSCustomProperties } from '../../types';\nimport { useScrollLock } from '../AppRoot/ScrollContext';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { ModalOutlet } from '../ModalOutlet/ModalOutlet';\nimport {\n ModalOverlay as ModalOverlayDefault,\n type ModalOverlayProps,\n} from '../ModalOverlay/ModalOverlay';\nimport { ModalPageBase } from './ModalPageBase';\nimport type { ModalPageProps } from './types';\nimport styles from './ModalPage.module.css';\n\nconst transitionStateClassNames: Partial<Record<UseCSSTransitionState, string>> = {\n appear: styles['documentStateEnter'],\n appearing: styles['documentStateEntering'],\n\n enter: styles['documentStateEnter'],\n entering: styles['documentStateEntering'],\n\n exiting: styles['documentStateExiting'],\n exited: styles['documentStateExited'],\n};\n\nexport interface ModalPageInternalProps\n extends Omit<ModalPageProps, 'nav' \| 'keepMounted' \| 'settlingHeight' \| 'dynamicContentHeight'> {\n snapPoint: SnapPoint;\n ModalOverlay?: ComponentType<ModalOverlayProps>;\n onSnapPointChange?: SnapPointChange;\n}\n\n/\n В компоненте заложена вся логика модального окна.\n \n @private\n */\nexport const ModalPageInternal = ({\n open,\n header,\n footer,\n size: desktopMaxWidth,\n height,\n children,\n className,\n style,\n snapPoint,\n onSnapPointChange,\n getModalContentRef,\n ModalOverlay = ModalOverlayDefault,\n modalOverlayTestId,\n modalContentTestId,\n modalDismissButtonTestId,\n modalDismissButtonLabel = 'Закрыть',\n outsideButtons,\n noFocusToDialog,\n hideCloseButton,\n preventClose,\n disableContentPanningGesture,\n restoreFocus,\n onOpen,\n onOpened,\n onClose = noop,\n onClosed,\n disableFocusTrap,\n disableModalOverlay,\n disableOpenAnimation = false,\n disableCloseAnimation = false,\n ...restProps\n}: ModalPageInternalProps) => {\n const { hasCustomPanelHeaderAfter } = useConfigProvider();\n const [transitionState, { ref, onTransitionEnd }] = useCSSTransition<HTMLDivElement>(open, {\n enableAppear: !disableOpenAnimation,\n enableEnter: !disableOpenAnimation,\n enableExit: !disableCloseAnimation,\n onEnter() {\n onOpen?.();\n },\n onEntered() {\n onOpened?.();\n },\n onExited() {\n onClosed?.();\n },\n });\n const opened = transitionState === 'appeared' \|\| transitionState === 'entered';\n const hidden = transitionState === 'exited';\n const closable = !preventClose && opened;\n\n const { sizeX, isDesktop } = useAdaptivityWithJSMediaQueries();\n const bottomSheetEnabled = !isDesktop && !preventClose && transitionState !== 'exited';\n const { opened: keyboardOpened } = useVirtualKeyboardState(bottomSheetEnabled);\n\n const [{ initialStyle, setSheetEl, setSheetScrollEl, setBackdropEl }, bottomSheetEventHandlers] =\n useBottomSheet(bottomSheetEnabled, {\n blocked: keyboardOpened,\n snapPoint,\n sheetCSSProperty: '--vkui_internal_ModalPageDocument--snapPoint',\n backdropCSSProperty: '--vkui_internal--modal-overlay--opacity',\n onSnapPointChange,\n onDismiss() {\n onClose('swipe-down');\n },\n });\n const documentStyle = keyboardOpened\n ? {\n '--vkui_internal_ModalPageDocument--safeAreaInsetBottom': '0px',\n ...initialStyle,\n }\n : initialStyle;\n const handleSheetRef = useExternRef<HTMLDivElement>(setSheetEl, ref);\n const handleSheetScrollRef = useExternRef<HTMLDivElement>(setSheetScrollEl, getModalContentRef);\n\n const [desktopMaxWidthClassName, desktopMaxWidthStyle] = isDesktop\n ? resolveDesktopMaxWidth(desktopMaxWidth)\n : [undefined, undefined];\n\n const modalOverlay = !disableModalOverlay && (\n <ModalOverlay\n getRootRef={setBackdropEl}\n data-testid={modalOverlayTestId}\n visible={open}\n disableOpenAnimation={disableOpenAnimation}\n disableCloseAnimation={disableCloseAnimation}\n onClick={\n closable\n ? function handleBackdropClick(event) {\n onClose('click-overlay', event);\n }\n : undefined\n }\n />\n );\n const handleEscKeyDown = useCallback(\n (event: KeyboardEvent<HTMLElement>) => {\n if (closable && pressedKey(event) === Keys.ESCAPE) {\n onClose('escape-key');\n }\n },\n [closable, onClose],\n );\n\n useScrollLock(!hidden);\n\n return (\n <ModalOutlet\n hidden={hidden}\n isDesktop={isDesktop}\n onKeyDown={handleEscKeyDown}\n disableModalOverlay={disableModalOverlay}\n >\n {modalOverlay}\n <FocusTrap\n {...restProps}\n autoFocus={!noFocusToDialog}\n restoreFocus={restoreFocus}\n role=\"dialog\"\n aria-modal=\"true\"\n disabled={!opened \|\| hidden \|\| disableFocusTrap}\n className={classNames(\n className,\n styles.host,\n isDesktop ? styles.hostDesktop : styles.hostMobile,\n !isDesktop &&\n (hasCustomPanelHeaderAfter\n ? styles.hostMobileSafeAreaInsetTopWithCustomOffset\n : styles.hostMobileSafeAreaInsetTop),\n desktopMaxWidthClassName,\n sizeX === 'regular' && 'vkuiInternalModalPage--sizeX-regular',\n )}\n style={mergeStyle(mergeStyle(desktopMaxWidthStyle, getHeightCSSVariable(height)), style)}\n >\n <ModalPageBase\n {...bottomSheetEventHandlers}\n getRootRef={handleSheetRef}\n getRef={handleSheetScrollRef}\n style={documentStyle}\n className={classNames(\n isDesktop ? styles.documentDesktop : styles.documentMobile,\n transitionStateClassNames[transitionState],\n )}\n onTransitionEnd={onTransitionEnd}\n isDesktop={isDesktop}\n disableContentPanningGesture={disableContentPanningGesture}\n header={header}\n footer={footer}\n outsideButtons={outsideButtons}\n modalContentTestId={modalContentTestId}\n modalDismissButtonTestId={modalDismissButtonTestId}\n modalDismissButtonLabel={modalDismissButtonLabel}\n hideCloseButton={hideCloseButton}\n closable={closable}\n onClose={onClose}\n >\n {children}\n </ModalPageBase>\n </FocusTrap>\n </ModalOutlet>\n );\n};\n\nconst desktopMaxWidthClassNames = {\n s: styles['hostDesktopMaxWidthS'],\n m: styles['hostDesktopMaxWidthM'],\n l: styles['hostDesktopMaxWidthL'],\n};\n\nfunction resolveDesktopMaxWidth(\n desktopMaxWidth: ModalPageInternalProps['size'] = 's',\n): [string \| undefined, CSSCustomProperties \| undefined] {\n if (typeof desktopMaxWidth === 'number') {\n return [undefined, { '--vkui_internal_ModalPage--desktopMaxWidth': `${desktopMaxWidth}px` }];\n }\n\n return desktopMaxWidthClassNames.hasOwnProperty(desktopMaxWidth)\n ? [desktopMaxWidthClassNames[desktopMaxWidth], undefined]\n : [undefined, { '--vkui_internal_ModalPage--desktopMaxWidth': desktopMaxWidth }];\n}\n\nfunction getHeightCSSVariable(height?: number \| string): CSSCustomProperties \| undefined {\n return height !== undefined\n ? {\n '--vkui_internal_ModalPage--userHeight':\n typeof height === 'number' ? `${height}px` : height,\n }\n : undefined;\n}\n"],"names":["useCallback","classNames","noop","mergeStyle","useAdaptivityWithJSMediaQueries","useExternRef","useVirtualKeyboardState","Keys","pressedKey","useCSSTransition","useBottomSheet","useScrollLock","useConfigProvider","FocusTrap","ModalOutlet","ModalOverlay","ModalOverlayDefault","ModalPageBase","transitionStateClassNames","appear","appearing","enter","entering","exiting","exited","ModalPageInternal","open","header","footer","size","desktopMaxWidth","height","children","className","style","snapPoint","onSnapPointChange","getModalContentRef","modalOverlayTestId","modalContentTestId","modalDismissButtonTestId","modalDismissButtonLabel","outsideButtons","noFocusToDialog","hideCloseButton","preventClose","disableContentPanningGesture","restoreFocus","onOpen","onOpened","onClose","onClosed","disableFocusTrap","disableModalOverlay","disableOpenAnimation","disableCloseAnimation","restProps","hasCustomPanelHeaderAfter","transitionState","ref","onTransitionEnd","enableAppear","enableEnter","enableExit","onEnter","onEntered","onExited","opened","hidden","closable","sizeX","isDesktop","bottomSheetEnabled","keyboardOpened","initialStyle","setSheetEl","setSheetScrollEl","setBackdropEl","bottomSheetEventHandlers","blocked","sheetCSSProperty","backdropCSSProperty","onDismiss","documentStyle","handleSheetRef","handleSheetScrollRef","desktopMaxWidthClassName","desktopMaxWidthStyle","resolveDesktopMaxWidth","undefined","modalOverlay","getRootRef","data-testid","visible","onClick","handleBackdropClick","event","handleEscKeyDown","ESCAPE","onKeyDown","autoFocus","role","aria-modal","disabled","getHeightCSSVariable","getRef","desktopMaxWidthClassNames","s","m","l","hasOwnProperty"],"mappings":"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"}

package/dist/components/ModalPage/types.d.ts CHANGED Viewed

@@ -125,9 +125,17 @@ export interface ModalPageProps extends NavIdProps, Omit<HTMLAttributesWithRootR
     /**
      * Отключает отображение и взаимодействие с фоном модалки.
      * > При использовании `ModalPage` внутри `ModalRoot` есть особенность использования этого свойства.
-     * > Об этом можно почитать на странице документации [`ModalRoot`](/components/modal-root#otklyuchenie-zadnego-fona-u-konkretnogo-modalnogo-okna).
+     * > Об этом можно почитать на странице документации [`ModalRoot`](/components/modal-root#disable-modal-overlay).
      */
     disableModalOverlay?: boolean;
+    /**
+     * Отключает анимацию открытия модалки.
+     */
+    disableOpenAnimation?: boolean;
+    /**
+     * Отключает анимацию закрытия модалки.
+     */
+    disableCloseAnimation?: boolean;
 }
 export {};
 //# sourceMappingURL=types.d.ts.map

package/dist/components/ModalPage/types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/ModalPage/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACpE,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,KAAK,EAAE,yBAAyB,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE3E,MAAM,MAAM,oBAAoB,GAC5B,eAAe,GACf,oBAAoB,GACpB,YAAY,GACZ,YAAY,CAAC;AAEjB,KAAK,qBAAqB,GAAG;IAC3B;;OAEG;IACH,KAAK,CAAC,EAAE,IAAI,CAAC,aAAa,EAAE,QAAQ,GAAG,UAAU,GAAG,WAAW,CAAC,CAAC;CAClE,CAAC;AAEF,MAAM,WAAW,cACf,SAAQ,UAAU,EAChB,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,IAAI,GAAG,OAAO,CAAC,EAC/D,IAAI,CAAC,iBAAiB,EAAE,cAAc,CAAC,EACvC,qBAAqB;IACvB;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,YAAY,CACjB,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,MAAM,GAAG,aAAa,GAAG,aAAa,GAAG,aAAa,EACxE,MAAM,GAAG,MAAM,CAChB,CAAC;IACF;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB;;;;;;;OAOG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,kBAAkB,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IACzC;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC;;OAEG;IACH,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,4BAA4B,CAAC,EAAE,OAAO,CAAC;IACvC;;OAEG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,oBAAoB,EAAE,KAAK,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC/E;;OAEG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB;;;;;OAKG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,iBAAiB,CAAC,UAAU,CAAC,CAAC;IACjD;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;~~CAC~~/B"}
1	+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/ModalPage/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACpE,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,KAAK,EAAE,yBAAyB,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE3E,MAAM,MAAM,oBAAoB,GAC5B,eAAe,GACf,oBAAoB,GACpB,YAAY,GACZ,YAAY,CAAC;AAEjB,KAAK,qBAAqB,GAAG;IAC3B;;OAEG;IACH,KAAK,CAAC,EAAE,IAAI,CAAC,aAAa,EAAE,QAAQ,GAAG,UAAU,GAAG,WAAW,CAAC,CAAC;CAClE,CAAC;AAEF,MAAM,WAAW,cACf,SAAQ,UAAU,EAChB,IAAI,CAAC,yBAAyB,CAAC,cAAc,CAAC,EAAE,IAAI,GAAG,OAAO,CAAC,EAC/D,IAAI,CAAC,iBAAiB,EAAE,cAAc,CAAC,EACvC,qBAAqB;IACvB;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,YAAY,CACjB,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,MAAM,GAAG,aAAa,GAAG,aAAa,GAAG,aAAa,EACxE,MAAM,GAAG,MAAM,CAChB,CAAC;IACF;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB;;;;;;;OAOG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,kBAAkB,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IACzC;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC;;OAEG;IACH,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,4BAA4B,CAAC,EAAE,OAAO,CAAC;IACvC;;OAEG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,oBAAoB,EAAE,KAAK,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC/E;;OAEG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB;;;;;OAKG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,iBAAiB,CAAC,UAAU,CAAC,CAAC;IACjD;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC"}

package/dist/components/ModalPage/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/ModalPage/types.ts"],"sourcesContent":["import type { CSSProperties, ReactNode, Ref, UIEvent } from 'react';\nimport { type UseFocusTrapProps } from '../../hooks/useFocusTrap';\nimport type { NavIdProps } from '../../lib/getNavId';\nimport type { HTMLAttributesWithRootRef, LiteralUnion } from '../../types';\n\nexport type ModalPageCloseReason =\n \| 'click-overlay'\n \| 'click-close-button'\n \| 'escape-key'\n \| 'swipe-down';\n\ntype OmittedStyleAttribute = {\n /*\n Дополнительные стили.\n /\n style?: Omit<CSSProperties, 'height' \| 'maxWidth' \| 'maxHeight'>;\n};\n\nexport interface ModalPageProps\n extends NavIdProps,\n Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'id' \| 'style'>,\n Pick<UseFocusTrapProps, 'restoreFocus'>,\n OmittedStyleAttribute {\n /\n Состояние видимости.\n \n @default false\n /\n open?: boolean;\n /\n Сохранять ли компонент в DOM при `open={false}`.\n \n @default false\n /\n keepMounted?: boolean;\n /\n Шапка модальной страницы, `<ModalPageHeader />`.\n /\n header?: ReactNode;\n /\n Подвал модальной страницы, `<ModalPageFooter />`.\n /\n footer?: ReactNode;\n /\n Задаёт контенту максимальную ширину на десктопе.\n /\n size?: LiteralUnion<\n 's' \| 'm' \| 'l' \| 'auto' \| 'fit-content' \| 'max-content' \| 'min-content',\n string \| number\n >;\n /\n Задаёт модальному окну фиксированную высоту.\n * Можно передать числовое значение в пикселях, а можно строкой, в том числе и в процентах \"50%\".\n * В мобильной версии 'settlingHeight' будет считаться относительно заданного height.\n /\n height?: string \| number;\n /\n Процент, на который изначально будет открыта модальная страница.\n \n > ⚠️ Следует использовать следующие значения: `25`, `50`, `75`, `100`.\n * > При передаче `< 25` значение приведётся к `25`, при передаче `> 75` значение приведётся к `75`.\n \n Игнорируется при включении `dynamicContentHeight`.\n /\n settlingHeight?: number;\n /\n Если высота контента в модальной странице может поменяться, нужно установить это свойство.\n /\n dynamicContentHeight?: boolean;\n /\n Отключает фокус на интерактивный элемент после открытия модалки.\n \n > Важно установить фокус после открытия в любое место модалки используя событие `onOpened`, иначе не будет работать закрытие по нажатию `Esc`.\n /\n noFocusToDialog?: boolean;\n /\n Скрывает кнопку закрытия (актуально для iOS, так как можно отрисовать кнопку закрытия внутри модалки).\n /\n hideCloseButton?: boolean;\n /\n `data-testid` для содержимого модального окна.\n /\n modalContentTestId?: string;\n /\n Возвращает DOM-элемент содержимого модального окна.\n /\n getModalContentRef?: Ref<HTMLDivElement>;\n /\n `data-testid` для оверлея.\n /\n modalOverlayTestId?: string;\n /\n `data-testid` для кнопки закрытия.\n /\n modalDismissButtonTestId?: string;\n /\n Текст для скринридера.\n /\n modalDismissButtonLabel?: string;\n /\n Позволяет отключить возможность закрытия модальной страницы (смахивание, клавиша `ESC`, нажатие на подложку).\n \n ⚠️ ВНИМАНИЕ: использование этой опции негативно сказывается на пользовательском опыте.\n /\n preventClose?: boolean;\n /\n Отключает раскрытие и закрытие панели в мобильном виде.\n /\n disableContentPanningGesture?: boolean;\n /\n Будет вызвано при начале открытия модалки.\n /\n onOpen?: VoidFunction;\n /\n Будет вызвано при окончательном открытии модалки.\n /\n onOpened?: VoidFunction;\n /\n Будет вызвано при начале закрытия модалки.\n /\n onClose?: (reason: ModalPageCloseReason, event?: UIEvent<HTMLElement>) => void;\n /\n Будет вызвано при окончательном закрытии модалки.\n /\n onClosed?: VoidFunction;\n /\n Управляющие элементы под кнопкой закрытия.\n \n Доступно только в `compact`-режиме. Рекомендуется размещать иконки размера 20, обернутые в ModalOutsideButton.\n \n /\n outsideButtons?: React.ReactNode;\n /*\n Позволяет отключить захват фокуса.\n \n Нужно использовать, когда поверх одной модалки открывается другая, чтобы два `FocusTrap` не конфликтовали.\n /\n disableFocusTrap?: UseFocusTrapProps['disabled'];\n /\n Отключает отображение и взаимодействие с фоном модалки.\n * > При использовании `ModalPage` внутри `ModalRoot` есть особенность использования этого свойства.\n * > Об этом можно почитать на странице документации [`ModalRoot`](/components/modal-root#~~otklyuchenie~~-~~zadnego~~-~~fona-u-konkretnogo-modalnogo-okna~~).\n */\n disableModalOverlay?: boolean;\n}\n"],"names":[],"mappings":"AAkBA,~~WA8HC~~"}
1	+ {"version":3,"sources":["../../../src/components/ModalPage/types.ts"],"sourcesContent":["import type { CSSProperties, ReactNode, Ref, UIEvent } from 'react';\nimport { type UseFocusTrapProps } from '../../hooks/useFocusTrap';\nimport type { NavIdProps } from '../../lib/getNavId';\nimport type { HTMLAttributesWithRootRef, LiteralUnion } from '../../types';\n\nexport type ModalPageCloseReason =\n \| 'click-overlay'\n \| 'click-close-button'\n \| 'escape-key'\n \| 'swipe-down';\n\ntype OmittedStyleAttribute = {\n /*\n Дополнительные стили.\n /\n style?: Omit<CSSProperties, 'height' \| 'maxWidth' \| 'maxHeight'>;\n};\n\nexport interface ModalPageProps\n extends NavIdProps,\n Omit<HTMLAttributesWithRootRef<HTMLDivElement>, 'id' \| 'style'>,\n Pick<UseFocusTrapProps, 'restoreFocus'>,\n OmittedStyleAttribute {\n /\n Состояние видимости.\n \n @default false\n /\n open?: boolean;\n /\n Сохранять ли компонент в DOM при `open={false}`.\n \n @default false\n /\n keepMounted?: boolean;\n /\n Шапка модальной страницы, `<ModalPageHeader />`.\n /\n header?: ReactNode;\n /\n Подвал модальной страницы, `<ModalPageFooter />`.\n /\n footer?: ReactNode;\n /\n Задаёт контенту максимальную ширину на десктопе.\n /\n size?: LiteralUnion<\n 's' \| 'm' \| 'l' \| 'auto' \| 'fit-content' \| 'max-content' \| 'min-content',\n string \| number\n >;\n /\n Задаёт модальному окну фиксированную высоту.\n * Можно передать числовое значение в пикселях, а можно строкой, в том числе и в процентах \"50%\".\n * В мобильной версии 'settlingHeight' будет считаться относительно заданного height.\n /\n height?: string \| number;\n /\n Процент, на который изначально будет открыта модальная страница.\n \n > ⚠️ Следует использовать следующие значения: `25`, `50`, `75`, `100`.\n * > При передаче `< 25` значение приведётся к `25`, при передаче `> 75` значение приведётся к `75`.\n \n Игнорируется при включении `dynamicContentHeight`.\n /\n settlingHeight?: number;\n /\n Если высота контента в модальной странице может поменяться, нужно установить это свойство.\n /\n dynamicContentHeight?: boolean;\n /\n Отключает фокус на интерактивный элемент после открытия модалки.\n \n > Важно установить фокус после открытия в любое место модалки используя событие `onOpened`, иначе не будет работать закрытие по нажатию `Esc`.\n /\n noFocusToDialog?: boolean;\n /\n Скрывает кнопку закрытия (актуально для iOS, так как можно отрисовать кнопку закрытия внутри модалки).\n /\n hideCloseButton?: boolean;\n /\n `data-testid` для содержимого модального окна.\n /\n modalContentTestId?: string;\n /\n Возвращает DOM-элемент содержимого модального окна.\n /\n getModalContentRef?: Ref<HTMLDivElement>;\n /\n `data-testid` для оверлея.\n /\n modalOverlayTestId?: string;\n /\n `data-testid` для кнопки закрытия.\n /\n modalDismissButtonTestId?: string;\n /\n Текст для скринридера.\n /\n modalDismissButtonLabel?: string;\n /\n Позволяет отключить возможность закрытия модальной страницы (смахивание, клавиша `ESC`, нажатие на подложку).\n \n ⚠️ ВНИМАНИЕ: использование этой опции негативно сказывается на пользовательском опыте.\n /\n preventClose?: boolean;\n /\n Отключает раскрытие и закрытие панели в мобильном виде.\n /\n disableContentPanningGesture?: boolean;\n /\n Будет вызвано при начале открытия модалки.\n /\n onOpen?: VoidFunction;\n /\n Будет вызвано при окончательном открытии модалки.\n /\n onOpened?: VoidFunction;\n /\n Будет вызвано при начале закрытия модалки.\n /\n onClose?: (reason: ModalPageCloseReason, event?: UIEvent<HTMLElement>) => void;\n /\n Будет вызвано при окончательном закрытии модалки.\n /\n onClosed?: VoidFunction;\n /\n Управляющие элементы под кнопкой закрытия.\n \n Доступно только в `compact`-режиме. Рекомендуется размещать иконки размера 20, обернутые в ModalOutsideButton.\n \n /\n outsideButtons?: React.ReactNode;\n /*\n Позволяет отключить захват фокуса.\n \n Нужно использовать, когда поверх одной модалки открывается другая, чтобы два `FocusTrap` не конфликтовали.\n /\n disableFocusTrap?: UseFocusTrapProps['disabled'];\n /\n Отключает отображение и взаимодействие с фоном модалки.\n * > При использовании `ModalPage` внутри `ModalRoot` есть особенность использования этого свойства.\n * > Об этом можно почитать на странице документации [`ModalRoot`](/components/modal-root#disable-modal-overlay).\n /\n disableModalOverlay?: boolean;\n /\n Отключает анимацию открытия модалки.\n /\n disableOpenAnimation?: boolean;\n /\n Отключает анимацию закрытия модалки.\n */\n disableCloseAnimation?: boolean;\n}\n"],"names":[],"mappings":"AAkBA,WAsIC"}