@vkontakte/vkui 4.29.0 → 4.31.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.cache/.eslintcache +1 -1
- package/.cache/.stylelintcache +1 -1
- package/.cache/.tsbuildinfo +111 -84
- package/.cache/ts/src/components/Alert/Alert.d.ts +4 -1
- package/.cache/ts/src/components/AppRoot/ScrollContext.d.ts +6 -14
- package/.cache/ts/src/components/Calendar/Calendar.d.ts +10 -1
- package/.cache/ts/src/components/CalendarHeader/CalendarHeader.d.ts +8 -0
- package/.cache/ts/src/components/CalendarRange/CalendarRange.d.ts +1 -1
- package/.cache/ts/src/components/ChipsSelect/ChipsSelect.d.ts +1 -1
- package/.cache/ts/src/components/CustomSelect/CustomSelect.d.ts +1 -1
- package/.cache/ts/src/components/DateInput/DateInput.d.ts +1 -1
- package/.cache/ts/src/components/DateRangeInput/DateRangeInput.d.ts +1 -1
- package/.cache/ts/src/components/FormField/FormField.d.ts +15 -1
- package/.cache/ts/src/components/Input/Input.d.ts +1 -1
- package/.cache/ts/src/components/NativeSelect/NativeSelect.d.ts +1 -2
- package/.cache/ts/src/components/Select/Select.d.ts +1 -1
- package/.cache/ts/src/components/SelectMimicry/SelectMimicry.d.ts +3 -3
- package/.cache/ts/src/components/TabbarItem/TabbarItem.d.ts +1 -1
- package/.cache/ts/src/hooks/useAdaptivity.d.ts +1 -0
- package/.cache/ts/src/hooks/useCalendar.d.ts +4 -3
- package/.cache/ts/src/index.d.ts +2 -1
- package/dist/cjs/components/ActionSheet/ActionSheet.js +6 -10
- package/dist/cjs/components/ActionSheet/ActionSheet.js.map +1 -1
- package/dist/cjs/components/ActionSheet/ActionSheetDropdownDesktop.js +1 -1
- package/dist/cjs/components/ActionSheet/ActionSheetDropdownDesktop.js.map +1 -1
- package/dist/cjs/components/Alert/Alert.d.ts +4 -1
- package/dist/cjs/components/Alert/Alert.js +20 -2
- package/dist/cjs/components/Alert/Alert.js.map +1 -1
- package/dist/cjs/components/AppRoot/AppRoot.js +18 -2
- package/dist/cjs/components/AppRoot/AppRoot.js.map +1 -1
- package/dist/cjs/components/AppRoot/ScrollContext.d.ts +6 -14
- package/dist/cjs/components/AppRoot/ScrollContext.js +94 -2
- package/dist/cjs/components/AppRoot/ScrollContext.js.map +1 -1
- package/dist/cjs/components/Calendar/Calendar.d.ts +10 -1
- package/dist/cjs/components/Calendar/Calendar.js +16 -5
- package/dist/cjs/components/Calendar/Calendar.js.map +1 -1
- package/dist/cjs/components/CalendarHeader/CalendarHeader.d.ts +8 -0
- package/dist/cjs/components/CalendarHeader/CalendarHeader.js +15 -9
- package/dist/cjs/components/CalendarHeader/CalendarHeader.js.map +1 -1
- package/dist/cjs/components/CalendarRange/CalendarRange.d.ts +1 -1
- package/dist/cjs/components/CalendarRange/CalendarRange.js +7 -3
- package/dist/cjs/components/CalendarRange/CalendarRange.js.map +1 -1
- package/dist/cjs/components/ChipsInput/ChipsInput.js +3 -1
- package/dist/cjs/components/ChipsInput/ChipsInput.js.map +1 -1
- package/dist/cjs/components/ChipsSelect/ChipsSelect.d.ts +1 -1
- package/dist/cjs/components/ConfigProvider/ConfigProvider.js +1 -1
- package/dist/cjs/components/ConfigProvider/ConfigProvider.js.map +1 -1
- package/dist/cjs/components/CustomSelect/CustomSelect.d.ts +1 -1
- package/dist/cjs/components/CustomSelect/CustomSelect.js +6 -3
- package/dist/cjs/components/CustomSelect/CustomSelect.js.map +1 -1
- package/dist/cjs/components/DateInput/DateInput.d.ts +1 -1
- package/dist/cjs/components/DateInput/DateInput.js +14 -2
- package/dist/cjs/components/DateInput/DateInput.js.map +1 -1
- package/dist/cjs/components/DateRangeInput/DateRangeInput.d.ts +1 -1
- package/dist/cjs/components/DateRangeInput/DateRangeInput.js +6 -2
- package/dist/cjs/components/DateRangeInput/DateRangeInput.js.map +1 -1
- package/dist/cjs/components/Epic/Epic.js +1 -1
- package/dist/cjs/components/Epic/Epic.js.map +1 -1
- package/dist/cjs/components/FormField/FormField.d.ts +15 -1
- package/dist/cjs/components/FormField/FormField.js +6 -2
- package/dist/cjs/components/FormField/FormField.js.map +1 -1
- package/dist/cjs/components/HorizontalScroll/HorizontalScroll.js +12 -3
- package/dist/cjs/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
- package/dist/cjs/components/Input/Input.d.ts +1 -1
- package/dist/cjs/components/Input/Input.js +3 -1
- package/dist/cjs/components/Input/Input.js.map +1 -1
- package/dist/cjs/components/ModalCard/ModalCard.js +3 -1
- package/dist/cjs/components/ModalCard/ModalCard.js.map +1 -1
- package/dist/cjs/components/ModalCardBase/ModalCardBase.js +4 -2
- package/dist/cjs/components/ModalCardBase/ModalCardBase.js.map +1 -1
- package/dist/cjs/components/ModalPage/ModalPage.js +6 -2
- package/dist/cjs/components/ModalPage/ModalPage.js.map +1 -1
- package/dist/cjs/components/ModalPageHeader/ModalPageHeader.js +2 -10
- package/dist/cjs/components/ModalPageHeader/ModalPageHeader.js.map +1 -1
- package/dist/cjs/components/ModalRoot/ModalRoot.js +2 -2
- package/dist/cjs/components/ModalRoot/ModalRoot.js.map +1 -1
- package/dist/cjs/components/ModalRoot/ModalRootAdaptive.js +6 -4
- package/dist/cjs/components/ModalRoot/ModalRootAdaptive.js.map +1 -1
- package/dist/cjs/components/ModalRoot/useModalManager.js +1 -1
- package/dist/cjs/components/ModalRoot/useModalManager.js.map +1 -1
- package/dist/cjs/components/NativeSelect/NativeSelect.d.ts +1 -2
- package/dist/cjs/components/NativeSelect/NativeSelect.js +5 -7
- package/dist/cjs/components/NativeSelect/NativeSelect.js.map +1 -1
- package/dist/cjs/components/PanelHeader/PanelHeader.js +6 -4
- package/dist/cjs/components/PanelHeader/PanelHeader.js.map +1 -1
- package/dist/cjs/components/PanelHeaderContext/PanelHeaderContext.js +4 -1
- package/dist/cjs/components/PanelHeaderContext/PanelHeaderContext.js.map +1 -1
- package/dist/cjs/components/PopoutRoot/PopoutRoot.js +3 -1
- package/dist/cjs/components/PopoutRoot/PopoutRoot.js.map +1 -1
- package/dist/cjs/components/ScreenSpinner/ScreenSpinner.js +3 -0
- package/dist/cjs/components/ScreenSpinner/ScreenSpinner.js.map +1 -1
- package/dist/cjs/components/Select/Select.d.ts +1 -1
- package/dist/cjs/components/Select/Select.js +2 -2
- package/dist/cjs/components/Select/Select.js.map +1 -1
- package/dist/cjs/components/SelectMimicry/SelectMimicry.d.ts +3 -3
- package/dist/cjs/components/SelectMimicry/SelectMimicry.js +3 -1
- package/dist/cjs/components/SelectMimicry/SelectMimicry.js.map +1 -1
- package/dist/cjs/components/TabbarItem/TabbarItem.d.ts +1 -1
- package/dist/cjs/components/TabbarItem/TabbarItem.js.map +1 -1
- package/dist/cjs/components/Tooltip/Tooltip.js +1 -1
- package/dist/cjs/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/cjs/components/Typography/Text/Text.js +1 -1
- package/dist/cjs/components/Typography/Text/Text.js.map +1 -1
- package/dist/cjs/hooks/useAdaptivity.d.ts +1 -0
- package/dist/cjs/hooks/useAdaptivity.js +18 -1
- package/dist/cjs/hooks/useAdaptivity.js.map +1 -1
- package/dist/cjs/hooks/useCalendar.d.ts +4 -3
- package/dist/cjs/hooks/useCalendar.js +15 -6
- package/dist/cjs/hooks/useCalendar.js.map +1 -1
- package/dist/cjs/index.d.ts +2 -1
- package/dist/cjs/index.js +10 -2
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/lib/getNavId.js +1 -1
- package/dist/cjs/lib/getNavId.js.map +1 -1
- package/dist/cjs/lib/platform.js +29 -0
- package/dist/cjs/lib/platform.js.map +1 -1
- package/dist/components/ActionSheet/ActionSheet.js +5 -9
- package/dist/components/ActionSheet/ActionSheet.js.map +1 -1
- package/dist/components/ActionSheet/ActionSheetDropdownDesktop.js +1 -1
- package/dist/components/ActionSheet/ActionSheetDropdownDesktop.js.map +1 -1
- package/dist/components/Alert/Alert.d.ts +4 -1
- package/dist/components/Alert/Alert.js +18 -2
- package/dist/components/Alert/Alert.js.map +1 -1
- package/dist/components/AppRoot/AppRoot.js +17 -2
- package/dist/components/AppRoot/AppRoot.js.map +1 -1
- package/dist/components/AppRoot/ScrollContext.d.ts +6 -14
- package/dist/components/AppRoot/ScrollContext.js +87 -1
- package/dist/components/AppRoot/ScrollContext.js.map +1 -1
- package/dist/components/Calendar/Calendar.d.ts +10 -1
- package/dist/components/Calendar/Calendar.js +16 -5
- package/dist/components/Calendar/Calendar.js.map +1 -1
- package/dist/components/CalendarHeader/CalendarHeader.d.ts +8 -0
- package/dist/components/CalendarHeader/CalendarHeader.js +15 -9
- package/dist/components/CalendarHeader/CalendarHeader.js.map +1 -1
- package/dist/components/CalendarRange/CalendarRange.d.ts +1 -1
- package/dist/components/CalendarRange/CalendarRange.js +7 -3
- package/dist/components/CalendarRange/CalendarRange.js.map +1 -1
- package/dist/components/ChipsInput/ChipsInput.js +3 -1
- package/dist/components/ChipsInput/ChipsInput.js.map +1 -1
- package/dist/components/ChipsSelect/ChipsSelect.d.ts +1 -1
- package/dist/components/ConfigProvider/ConfigProvider.js +1 -1
- package/dist/components/ConfigProvider/ConfigProvider.js.map +1 -1
- package/dist/components/CustomSelect/CustomSelect.d.ts +1 -1
- package/dist/components/CustomSelect/CustomSelect.js +6 -3
- package/dist/components/CustomSelect/CustomSelect.js.map +1 -1
- package/dist/components/DateInput/DateInput.d.ts +1 -1
- package/dist/components/DateInput/DateInput.js +14 -2
- package/dist/components/DateInput/DateInput.js.map +1 -1
- package/dist/components/DateRangeInput/DateRangeInput.d.ts +1 -1
- package/dist/components/DateRangeInput/DateRangeInput.js +6 -2
- package/dist/components/DateRangeInput/DateRangeInput.js.map +1 -1
- package/dist/components/Epic/Epic.js +1 -1
- package/dist/components/Epic/Epic.js.map +1 -1
- package/dist/components/FormField/FormField.d.ts +15 -1
- package/dist/components/FormField/FormField.js +6 -2
- package/dist/components/FormField/FormField.js.map +1 -1
- package/dist/components/HorizontalScroll/HorizontalScroll.js +12 -3
- package/dist/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
- package/dist/components/Input/Input.d.ts +1 -1
- package/dist/components/Input/Input.js +3 -1
- package/dist/components/Input/Input.js.map +1 -1
- package/dist/components/ModalCard/ModalCard.js +3 -2
- package/dist/components/ModalCard/ModalCard.js.map +1 -1
- package/dist/components/ModalCardBase/ModalCardBase.js +5 -4
- package/dist/components/ModalCardBase/ModalCardBase.js.map +1 -1
- package/dist/components/ModalPage/ModalPage.js +5 -3
- package/dist/components/ModalPage/ModalPage.js.map +1 -1
- package/dist/components/ModalPageHeader/ModalPageHeader.js +2 -9
- package/dist/components/ModalPageHeader/ModalPageHeader.js.map +1 -1
- package/dist/components/ModalRoot/ModalRoot.js +2 -2
- package/dist/components/ModalRoot/ModalRoot.js.map +1 -1
- package/dist/components/ModalRoot/ModalRootAdaptive.js +5 -5
- package/dist/components/ModalRoot/ModalRootAdaptive.js.map +1 -1
- package/dist/components/ModalRoot/useModalManager.js +1 -1
- package/dist/components/ModalRoot/useModalManager.js.map +1 -1
- package/dist/components/NativeSelect/NativeSelect.d.ts +1 -2
- package/dist/components/NativeSelect/NativeSelect.js +3 -4
- package/dist/components/NativeSelect/NativeSelect.js.map +1 -1
- package/dist/components/PanelHeader/PanelHeader.js +6 -4
- package/dist/components/PanelHeader/PanelHeader.js.map +1 -1
- package/dist/components/PanelHeaderContext/PanelHeaderContext.js +3 -1
- package/dist/components/PanelHeaderContext/PanelHeaderContext.js.map +1 -1
- package/dist/components/PopoutRoot/PopoutRoot.js +3 -2
- package/dist/components/PopoutRoot/PopoutRoot.js.map +1 -1
- package/dist/components/ScreenSpinner/ScreenSpinner.js +2 -0
- package/dist/components/ScreenSpinner/ScreenSpinner.js.map +1 -1
- package/dist/components/Select/Select.d.ts +1 -1
- package/dist/components/Select/Select.js +1 -1
- package/dist/components/Select/Select.js.map +1 -1
- package/dist/components/SelectMimicry/SelectMimicry.d.ts +3 -3
- package/dist/components/SelectMimicry/SelectMimicry.js +3 -1
- package/dist/components/SelectMimicry/SelectMimicry.js.map +1 -1
- package/dist/components/TabbarItem/TabbarItem.d.ts +1 -1
- package/dist/components/TabbarItem/TabbarItem.js.map +1 -1
- package/dist/components/Tooltip/Tooltip.js +1 -1
- package/dist/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/components/Typography/Text/Text.js +1 -1
- package/dist/components/Typography/Text/Text.js.map +1 -1
- package/dist/components.css +18 -18
- package/dist/components.css.map +1 -1
- package/dist/cssm/components/ActionSheet/ActionSheet.js +5 -9
- package/dist/cssm/components/ActionSheet/ActionSheet.js.map +1 -1
- package/dist/cssm/components/ActionSheet/ActionSheetDropdownDesktop.js +1 -1
- package/dist/cssm/components/ActionSheet/ActionSheetDropdownDesktop.js.map +1 -1
- package/dist/cssm/components/Alert/Alert.d.ts +4 -1
- package/dist/cssm/components/Alert/Alert.js +18 -2
- package/dist/cssm/components/Alert/Alert.js.map +1 -1
- package/dist/cssm/components/AppRoot/AppRoot.js +17 -2
- package/dist/cssm/components/AppRoot/AppRoot.js.map +1 -1
- package/dist/cssm/components/AppRoot/ScrollContext.d.ts +6 -14
- package/dist/cssm/components/AppRoot/ScrollContext.js +87 -1
- package/dist/cssm/components/AppRoot/ScrollContext.js.map +1 -1
- package/dist/cssm/components/Button/Button.css +9 -9
- package/dist/cssm/components/ButtonGroup/ButtonGroup.css +1 -1
- package/dist/cssm/components/Calendar/Calendar.css +1 -1
- package/dist/cssm/components/Calendar/Calendar.d.ts +10 -1
- package/dist/cssm/components/Calendar/Calendar.js +16 -5
- package/dist/cssm/components/Calendar/Calendar.js.map +1 -1
- package/dist/cssm/components/CalendarDay/CalendarDay.css +1 -1
- package/dist/cssm/components/CalendarDays/CalendarDays.css +1 -1
- package/dist/cssm/components/CalendarHeader/CalendarHeader.css +1 -1
- package/dist/cssm/components/CalendarHeader/CalendarHeader.d.ts +8 -0
- package/dist/cssm/components/CalendarHeader/CalendarHeader.js +15 -9
- package/dist/cssm/components/CalendarHeader/CalendarHeader.js.map +1 -1
- package/dist/cssm/components/CalendarRange/CalendarRange.css +1 -1
- package/dist/cssm/components/CalendarRange/CalendarRange.d.ts +1 -1
- package/dist/cssm/components/CalendarRange/CalendarRange.js +7 -3
- package/dist/cssm/components/CalendarRange/CalendarRange.js.map +1 -1
- package/dist/cssm/components/CalendarTime/CalendarTime.css +1 -1
- package/dist/cssm/components/Card/Card.css +2 -2
- package/dist/cssm/components/CardScroll/CardScroll.css +1 -1
- package/dist/cssm/components/Cell/Cell.css +1 -1
- package/dist/cssm/components/CellButton/CellButton.css +1 -1
- package/dist/cssm/components/Checkbox/Checkbox.css +1 -1
- package/dist/cssm/components/ChipsInput/ChipsInput.css +1 -1
- package/dist/cssm/components/ChipsInput/ChipsInput.js +3 -1
- package/dist/cssm/components/ChipsInput/ChipsInput.js.map +1 -1
- package/dist/cssm/components/ChipsSelect/ChipsSelect.d.ts +1 -1
- package/dist/cssm/components/ConfigProvider/ConfigProvider.js +1 -1
- package/dist/cssm/components/ConfigProvider/ConfigProvider.js.map +1 -1
- package/dist/cssm/components/CustomSelect/CustomSelect.d.ts +1 -1
- package/dist/cssm/components/CustomSelect/CustomSelect.js +6 -3
- package/dist/cssm/components/CustomSelect/CustomSelect.js.map +1 -1
- package/dist/cssm/components/CustomSelectDropdown/CustomSelectDropdown.css +1 -1
- package/dist/cssm/components/CustomSelectOption/CustomSelectOption.css +1 -1
- package/dist/cssm/components/DateInput/DateInput.d.ts +1 -1
- package/dist/cssm/components/DateInput/DateInput.js +14 -2
- package/dist/cssm/components/DateInput/DateInput.js.map +1 -1
- package/dist/cssm/components/DateRangeInput/DateRangeInput.d.ts +1 -1
- package/dist/cssm/components/DateRangeInput/DateRangeInput.js +6 -2
- package/dist/cssm/components/DateRangeInput/DateRangeInput.js.map +1 -1
- package/dist/cssm/components/Epic/Epic.js +1 -1
- package/dist/cssm/components/Epic/Epic.js.map +1 -1
- package/dist/cssm/components/FormField/FormField.css +3 -3
- package/dist/cssm/components/FormField/FormField.d.ts +15 -1
- package/dist/cssm/components/FormField/FormField.js +6 -2
- package/dist/cssm/components/FormField/FormField.js.map +1 -1
- package/dist/cssm/components/FormLayoutGroup/FormLayoutGroup.css +1 -1
- package/dist/cssm/components/Gradient/Gradient.css +1 -1
- package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js +12 -3
- package/dist/cssm/components/HorizontalScroll/HorizontalScroll.js.map +1 -1
- package/dist/cssm/components/HorizontalScroll/HorizontalScrollArrow.css +1 -1
- package/dist/cssm/components/Input/Input.css +1 -1
- package/dist/cssm/components/Input/Input.d.ts +1 -1
- package/dist/cssm/components/Input/Input.js +3 -1
- package/dist/cssm/components/Input/Input.js.map +1 -1
- package/dist/cssm/components/InputLike/InputLike.css +1 -1
- package/dist/cssm/components/InputLike/InputLikeDivider.css +1 -1
- package/dist/cssm/components/ModalCard/ModalCard.css +1 -1
- package/dist/cssm/components/ModalCard/ModalCard.js +3 -2
- package/dist/cssm/components/ModalCard/ModalCard.js.map +1 -1
- package/dist/cssm/components/ModalCardBase/ModalCardBase.js +5 -4
- package/dist/cssm/components/ModalCardBase/ModalCardBase.js.map +1 -1
- package/dist/cssm/components/ModalPage/ModalPage.js +5 -3
- package/dist/cssm/components/ModalPage/ModalPage.js.map +1 -1
- package/dist/cssm/components/ModalPageHeader/ModalPageHeader.js +2 -9
- package/dist/cssm/components/ModalPageHeader/ModalPageHeader.js.map +1 -1
- package/dist/cssm/components/ModalRoot/ModalRoot.css +1 -1
- package/dist/cssm/components/ModalRoot/ModalRoot.js +2 -2
- package/dist/cssm/components/ModalRoot/ModalRoot.js.map +1 -1
- package/dist/cssm/components/ModalRoot/ModalRootAdaptive.js +5 -5
- package/dist/cssm/components/ModalRoot/ModalRootAdaptive.js.map +1 -1
- package/dist/cssm/components/ModalRoot/useModalManager.js +1 -1
- package/dist/cssm/components/ModalRoot/useModalManager.js.map +1 -1
- package/dist/cssm/components/NativeSelect/NativeSelect.d.ts +1 -2
- package/dist/cssm/components/NativeSelect/NativeSelect.js +3 -4
- package/dist/cssm/components/NativeSelect/NativeSelect.js.map +1 -1
- package/dist/cssm/components/Pagination/Pagination.css +1 -1
- package/dist/cssm/components/PanelHeader/PanelHeader.css +1 -1
- package/dist/cssm/components/PanelHeader/PanelHeader.js +6 -4
- package/dist/cssm/components/PanelHeader/PanelHeader.js.map +1 -1
- package/dist/cssm/components/PanelHeaderContext/PanelHeaderContext.js +3 -1
- package/dist/cssm/components/PanelHeaderContext/PanelHeaderContext.js.map +1 -1
- package/dist/cssm/components/PopoutRoot/PopoutRoot.js +3 -2
- package/dist/cssm/components/PopoutRoot/PopoutRoot.js.map +1 -1
- package/dist/cssm/components/Popper/Popper.css +1 -1
- package/dist/cssm/components/Radio/Radio.css +1 -1
- package/dist/cssm/components/RadioGroup/RadioGroup.css +1 -1
- package/dist/cssm/components/Removable/Removable.css +1 -1
- package/dist/cssm/components/RichCell/RichCell.css +1 -1
- package/dist/cssm/components/ScreenSpinner/ScreenSpinner.js +2 -0
- package/dist/cssm/components/ScreenSpinner/ScreenSpinner.js.map +1 -1
- package/dist/cssm/components/SegmentedControl/SegmentedControl.css +1 -1
- package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.css +1 -1
- package/dist/cssm/components/Select/Select.d.ts +1 -1
- package/dist/cssm/components/Select/Select.js +1 -1
- package/dist/cssm/components/Select/Select.js.map +1 -1
- package/dist/cssm/components/SelectMimicry/SelectMimicry.d.ts +3 -3
- package/dist/cssm/components/SelectMimicry/SelectMimicry.js +3 -1
- package/dist/cssm/components/SelectMimicry/SelectMimicry.js.map +1 -1
- package/dist/cssm/components/SimpleCell/SimpleCell.css +1 -1
- package/dist/cssm/components/Snackbar/Snackbar.css +1 -1
- package/dist/cssm/components/SplitLayout/SplitLayout.css +1 -1
- package/dist/cssm/components/TabbarItem/TabbarItem.d.ts +1 -1
- package/dist/cssm/components/TabbarItem/TabbarItem.js.map +1 -1
- package/dist/cssm/components/Tooltip/Tooltip.js +1 -1
- package/dist/cssm/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/cssm/components/Typography/Caption/Caption.css +1 -1
- package/dist/cssm/components/Typography/Paragraph/Paragraph.css +1 -1
- package/dist/cssm/components/Typography/Subhead/Subhead.css +1 -1
- package/dist/cssm/components/Typography/Text/Text.js +1 -1
- package/dist/cssm/components/Typography/Text/Text.js.map +1 -1
- package/dist/cssm/components/Typography/Title/Title.css +1 -1
- package/dist/cssm/hooks/useAdaptivity.d.ts +1 -0
- package/dist/cssm/hooks/useAdaptivity.js +13 -1
- package/dist/cssm/hooks/useAdaptivity.js.map +1 -1
- package/dist/cssm/hooks/useCalendar.d.ts +4 -3
- package/dist/cssm/hooks/useCalendar.js +15 -6
- package/dist/cssm/hooks/useCalendar.js.map +1 -1
- package/dist/cssm/index.d.ts +2 -1
- package/dist/cssm/index.js +2 -1
- package/dist/cssm/index.js.map +1 -1
- package/dist/cssm/lib/getNavId.js +1 -1
- package/dist/cssm/lib/getNavId.js.map +1 -1
- package/dist/cssm/lib/platform.js +26 -0
- package/dist/cssm/lib/platform.js.map +1 -1
- package/dist/cssm/styles/bright_light.css +1 -1
- package/dist/cssm/styles/components.css +18 -18
- package/dist/cssm/styles/constants.css +1 -1
- package/dist/cssm/styles/space_gray.css +1 -1
- package/dist/cssm/styles/themes.css +3 -3
- package/dist/cssm/styles/vkcom_dark.css +2 -2
- package/dist/cssm/styles/vkcom_light.css +1 -1
- package/dist/default_scheme.css +1 -1
- package/dist/default_scheme.css.map +1 -1
- package/dist/hooks/useAdaptivity.d.ts +1 -0
- package/dist/hooks/useAdaptivity.js +13 -1
- package/dist/hooks/useAdaptivity.js.map +1 -1
- package/dist/hooks/useCalendar.d.ts +4 -3
- package/dist/hooks/useCalendar.js +15 -6
- package/dist/hooks/useCalendar.js.map +1 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +2 -1
- package/dist/index.js.map +1 -1
- package/dist/lib/getNavId.js +1 -1
- package/dist/lib/getNavId.js.map +1 -1
- package/dist/lib/platform.js +26 -0
- package/dist/lib/platform.js.map +1 -1
- package/dist/vkui.css +21 -21
- package/dist/vkui.css.map +1 -1
- package/jest.unit.config.js +1 -0
- package/package.json +5 -3
- package/postcss-custom-properties-fallback/__tests__/custom_properties.css +5 -0
- package/postcss-custom-properties-fallback/index.js +83 -0
- package/postcss-plugin-vk-sans/index.js +34 -27
- package/src/components/ActionSheet/ActionSheet.tsx +9 -7
- package/src/components/ActionSheet/ActionSheetDropdownDesktop.tsx +1 -1
- package/src/components/ActionSheet/Readme.md +1 -0
- package/src/components/Alert/Alert.tsx +23 -4
- package/src/components/AppRoot/AppRoot.tsx +17 -2
- package/src/components/AppRoot/ScrollContext.ts +90 -2
- package/src/components/Button/Button.css +2 -0
- package/src/components/Calendar/Calendar.tsx +32 -3
- package/src/components/CalendarHeader/CalendarHeader.css +3 -0
- package/src/components/CalendarHeader/CalendarHeader.tsx +24 -2
- package/src/components/CalendarRange/CalendarRange.tsx +6 -0
- package/src/components/Card/Card.css +2 -1
- package/src/components/Cell/Cell.css +1 -1
- package/src/components/CellButton/CellButton.css +1 -1
- package/src/components/Checkbox/Checkbox.css +1 -1
- package/src/components/ChipsInput/ChipsInput.tsx +2 -0
- package/src/components/ConfigProvider/ConfigProvider.tsx +1 -1
- package/src/components/CustomSelect/CustomSelect.tsx +6 -3
- package/src/components/DateInput/DateInput.tsx +18 -0
- package/src/components/DateRangeInput/DateRangeInput.tsx +6 -0
- package/src/components/Epic/Epic.tsx +3 -1
- package/src/components/FixedLayout/FixedLayout.css +10 -0
- package/src/components/FormField/FormField.css +10 -0
- package/src/components/FormField/FormField.tsx +21 -1
- package/src/components/FormField/Readme.md +85 -19
- package/src/components/FormItem/FormItem.css +1 -0
- package/src/components/FormLayoutGroup/FormLayoutGroup.css +2 -1
- package/src/components/Gradient/Gradient.css +4 -2
- package/src/components/HorizontalScroll/HorizontalScroll.tsx +9 -3
- package/src/components/Input/Input.tsx +2 -0
- package/src/components/ModalCard/ModalCard.css +1 -1
- package/src/components/ModalCard/ModalCard.tsx +3 -8
- package/src/components/ModalCardBase/ModalCardBase.tsx +6 -10
- package/src/components/ModalPage/ModalPage.tsx +6 -9
- package/src/components/ModalPageHeader/ModalPageHeader.tsx +2 -6
- package/src/components/ModalRoot/ModalRoot.css +3 -2
- package/src/components/ModalRoot/ModalRoot.tsx +6 -2
- package/src/components/ModalRoot/ModalRootAdaptive.tsx +6 -9
- package/src/components/ModalRoot/Readme.md +1 -1
- package/src/components/ModalRoot/useModalManager.tsx +4 -1
- package/src/components/NativeSelect/NativeSelect.tsx +2 -3
- package/src/components/PanelHeader/PanelHeader.css +13 -13
- package/src/components/PanelHeader/PanelHeader.tsx +18 -17
- package/src/components/PanelHeader/Readme.md +2 -2
- package/src/components/PanelHeaderContext/PanelHeaderContext.tsx +3 -0
- package/src/components/PopoutRoot/PopoutRoot.tsx +3 -8
- package/src/components/Popper/Popper.css +14 -2
- package/src/components/Radio/Radio.css +1 -1
- package/src/components/RadioGroup/RadioGroup.css +1 -1
- package/src/components/Removable/Removable.css +2 -2
- package/src/components/RichCell/RichCell.css +1 -1
- package/src/components/ScreenSpinner/ScreenSpinner.tsx +3 -0
- package/src/components/Select/Select.tsx +1 -1
- package/src/components/SelectMimicry/SelectMimicry.tsx +5 -3
- package/src/components/SimpleCell/SimpleCell.css +1 -1
- package/src/components/Snackbar/Snackbar.css +6 -3
- package/src/components/SplitLayout/SplitLayout.css +3 -1
- package/src/components/Switch/Readme.md +12 -36
- package/src/components/TabbarItem/TabbarItem.tsx +1 -1
- package/src/components/Tooltip/Readme.md +35 -47
- package/src/components/Tooltip/Tooltip.tsx +2 -2
- package/src/components/Typography/Text/Text.tsx +4 -1
- package/src/hooks/useAdaptivity.ts +15 -0
- package/src/hooks/useCalendar.ts +25 -9
- package/src/index.ts +2 -1
- package/src/lib/getNavId.ts +1 -1
- package/src/lib/platform.ts +34 -0
- package/src/styles/bright_light.css +2 -0
- package/src/styles/constants.css +3 -2
- package/src/styles/space_gray.css +10 -8
- package/src/styles/vkcom_dark.css +6 -4
- package/src/styles/vkcom_light.css +4 -2
- package/src/testing/utils.tsx +5 -1
- package/tsconfig.json +1 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/DateInput/DateInput.tsx"],"names":["elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","getHours","getMinutes","DateInput","enableTime","shouldDisableDate","disableFuture","disablePast","onChange","calendarPlacement","style","className","doneButtonText","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","onClick","onFocus","prevMonthAriaLabel","nextMonthAriaLabel","showNeighboringMonth","size","changeMonthAriaLabel","changeYearAriaLabel","changeDayAriaLabel","changeHoursAriaLabel","changeMinutesAriaLabel","clearFieldAriaLabel","showCalendarAriaLabel","props","daysRef","React","useRef","monthsRef","yearsRef","hoursRef","minutesRef","maxElement","onInternalValueChange","useCallback","internalValue","i","formattedValue","mask","Date","refs","useMemo","rootRef","calendarRef","open","openCalendar","closeCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","sizeY","onCalendarChange"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { format, isMatch, parse } from \"../../lib/date\";\nimport { Icon16Clear, Icon20CalendarOutline } from \"@vkontakte/icons\";\nimport { Calendar, CalendarProps } from \"../Calendar/Calendar\";\nimport { Popper, Placement } from \"../Popper/Popper\";\nimport { multiRef } from \"../../lib/utils\";\nimport IconButton from \"../IconButton/IconButton\";\nimport { classNames } from \"../../lib/classNames\";\nimport { FormField } from \"../FormField/FormField\";\nimport { HasRootRef } from \"../../types\";\nimport { useDateInput } from \"../../hooks/useDateInput\";\nimport { InputLike } from \"../InputLike/InputLike\";\nimport { InputLikeDivider } from \"../InputLike/InputLikeDivider\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { callMultiple } from \"../../lib/callMultiple\";\nimport \"./DateInput.css\";\n\nexport interface DateInputProps\n extends Omit<\n React.InputHTMLAttributes<HTMLDivElement>,\n \"value\" | \"onChange\" | \"size\"\n >,\n Pick<\n CalendarProps,\n | \"disablePast\"\n | \"disableFuture\"\n | \"enableTime\"\n | \"shouldDisableDate\"\n | \"onChange\"\n | \"value\"\n | \"doneButtonText\"\n | \"weekStartsOn\"\n | \"disablePickers\"\n | \"changeHoursAriaLabel\"\n | \"changeMinutesAriaLabel\"\n | \"prevMonthAriaLabel\"\n | \"nextMonthAriaLabel\"\n | \"changeMonthAriaLabel\"\n | \"changeYearAriaLabel\"\n | \"changeDayAriaLabel\"\n | \"showNeighboringMonth\"\n | \"size\"\n >,\n HasRootRef<HTMLDivElement> {\n calendarPlacement?: Placement;\n closeOnChange?: boolean;\n clearFieldAriaLabel?: string;\n showCalendarAriaLabel?: string;\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 max = 31;\n break;\n case 1:\n max = 12;\n break;\n case 2:\n max = 2100;\n min = 1900;\n length = 4;\n break;\n case 3:\n max = 23;\n break;\n case 4:\n max = 59;\n break;\n }\n\n return { length, min, max };\n};\n\nconst getInternalValue = (value: CalendarProps[\"value\"]) => {\n const newValue = [\"\", \"\", \"\", \"\", \"\"];\n if (value) {\n newValue[0] = String(value.getDate()).padStart(2, \"0\");\n newValue[1] = String(value.getMonth() + 1).padStart(2, \"0\");\n newValue[2] = String(value.getFullYear()).padStart(4, \"0\");\n newValue[3] = String(value.getHours()).padStart(2, \"0\");\n newValue[4] = String(value.getMinutes()).padStart(2, \"0\");\n }\n return newValue;\n};\n\nexport const DateInput: React.FC<DateInputProps> = ({\n enableTime,\n shouldDisableDate,\n disableFuture,\n disablePast,\n value,\n onChange,\n calendarPlacement = \"bottom-start\",\n style,\n className,\n doneButtonText,\n closeOnChange = true,\n disablePickers,\n getRootRef,\n name,\n autoFocus,\n disabled,\n onClick,\n onFocus,\n prevMonthAriaLabel,\n nextMonthAriaLabel,\n showNeighboringMonth,\n size,\n changeMonthAriaLabel = \"Изменить месяц\",\n changeYearAriaLabel = \"Изменить год\",\n changeDayAriaLabel = \"Изменить день\",\n changeHoursAriaLabel = \"Изменить час\",\n changeMinutesAriaLabel = \"Изменить минуту\",\n clearFieldAriaLabel = \"Очистить поле\",\n showCalendarAriaLabel = \"Показать календарь\",\n ...props\n}) => {\n const daysRef = React.useRef<HTMLSpanElement>(null);\n const monthsRef = React.useRef<HTMLSpanElement>(null);\n const yearsRef = React.useRef<HTMLSpanElement>(null);\n const hoursRef = React.useRef<HTMLSpanElement>(null);\n const minutesRef = React.useRef<HTMLSpanElement>(null);\n\n const maxElement = enableTime ? 4 : 2;\n\n const onInternalValueChange = React.useCallback(\n (internalValue: string[]) => {\n for (let i = 0; i <= maxElement; i += 1) {\n if (internalValue[i].length < elementsConfig(i).length) {\n return;\n }\n }\n\n let formattedValue = `${internalValue[0]}.${internalValue[1]}.${internalValue[2]}`;\n let mask = \"DD.MM.YYYY\";\n if (enableTime) {\n formattedValue += ` ${internalValue[3]}:${internalValue[4]}`;\n mask += \" HH:mm\";\n }\n\n if (isMatch(formattedValue, mask)) {\n onChange?.(parse(formattedValue, mask, value ?? new Date()));\n }\n },\n [enableTime, maxElement, onChange, value]\n );\n\n const refs = React.useMemo(\n () => [daysRef, monthsRef, yearsRef, hoursRef, minutesRef],\n [daysRef, monthsRef, yearsRef, hoursRef, minutesRef]\n );\n\n const {\n rootRef,\n calendarRef,\n open,\n openCalendar,\n closeCalendar,\n internalValue,\n handleKeyDown,\n setFocusedElement,\n handleFieldEnter,\n clear,\n removeFocusFromField,\n } = useDateInput({\n maxElement,\n refs,\n autoFocus,\n disabled,\n elementsConfig,\n onChange,\n onInternalValueChange,\n getInternalValue,\n value,\n });\n\n const { sizeY } = useAdaptivity();\n\n const onCalendarChange = React.useCallback(\n (value?: Date | undefined) => {\n onChange?.(value);\n if (closeOnChange && !enableTime) {\n removeFocusFromField();\n }\n },\n [onChange, removeFocusFromField, closeOnChange, enableTime]\n );\n\n return (\n <FormField\n vkuiClass={classNames(\"DateInput\", `DateInput--sizeY-${sizeY}`)}\n style={style}\n className={className}\n getRootRef={multiRef(rootRef, getRootRef)}\n after={\n value ? (\n <IconButton\n hoverMode=\"opacity\"\n aria-label={clearFieldAriaLabel}\n onClick={clear}\n >\n <Icon16Clear />\n </IconButton>\n ) : (\n <IconButton\n hoverMode=\"opacity\"\n aria-label={showCalendarAriaLabel}\n onClick={openCalendar}\n >\n <Icon20CalendarOutline />\n </IconButton>\n )\n }\n disabled={disabled}\n onClick={callMultiple(handleFieldEnter, onClick)}\n onFocus={callMultiple(handleFieldEnter, onFocus)}\n {...props}\n >\n <input\n type=\"hidden\"\n name={name}\n value={\n value\n ? format(value, enableTime ? \"DD.MM.YYYYTHH:mm\" : \"DD.MM.YYYY\")\n : \"\"\n }\n />\n <span vkuiClass=\"DateInput__input\" onKeyDown={handleKeyDown}>\n <InputLike\n tabIndex={1}\n length={2}\n getRootRef={daysRef}\n index={0}\n onElementSelect={setFocusedElement}\n value={internalValue[0]}\n aria-label={changeDayAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={monthsRef}\n index={1}\n onElementSelect={setFocusedElement}\n value={internalValue[1]}\n aria-label={changeMonthAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={4}\n getRootRef={yearsRef}\n index={2}\n onElementSelect={setFocusedElement}\n value={internalValue[2]}\n aria-label={changeYearAriaLabel}\n />\n {enableTime && (\n <React.Fragment>\n <InputLikeDivider vkuiClass=\"DateInput__input-time-divider\">\n {\" \"}\n </InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={hoursRef}\n index={3}\n onElementSelect={setFocusedElement}\n value={internalValue[3]}\n aria-label={changeHoursAriaLabel}\n />\n <InputLikeDivider>:</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={minutesRef}\n index={4}\n onElementSelect={setFocusedElement}\n value={internalValue[4]}\n aria-label={changeMinutesAriaLabel}\n />\n </React.Fragment>\n )}\n </span>\n {open && (\n <Popper\n targetRef={rootRef}\n offsetDistance={8}\n placement={calendarPlacement}\n >\n <Calendar\n value={value}\n onChange={onCalendarChange}\n enableTime={enableTime}\n disablePast={disablePast}\n disableFuture={disableFuture}\n shouldDisableDate={shouldDisableDate}\n onClose={closeCalendar}\n getRootRef={calendarRef}\n doneButtonText={doneButtonText}\n disablePickers={disablePickers}\n changeHoursAriaLabel={changeHoursAriaLabel}\n changeMinutesAriaLabel={changeMinutesAriaLabel}\n prevMonthAriaLabel={prevMonthAriaLabel}\n nextMonthAriaLabel={nextMonthAriaLabel}\n changeMonthAriaLabel={changeMonthAriaLabel}\n changeYearAriaLabel={changeYearAriaLabel}\n changeDayAriaLabel={changeDayAriaLabel}\n showNeighboringMonth={showNeighboringMonth}\n size={size}\n />\n </Popper>\n )}\n </FormField>\n );\n};\n"],"file":"DateInput.js"}
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/DateInput/DateInput.tsx"],"names":["elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","getHours","getMinutes","DateInput","enableTime","shouldDisableDate","disableFuture","disablePast","onChange","calendarPlacement","style","className","doneButtonText","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","onClick","onFocus","prevMonthAriaLabel","nextMonthAriaLabel","showNeighboringMonth","size","changeMonthAriaLabel","changeYearAriaLabel","changeDayAriaLabel","changeHoursAriaLabel","changeMinutesAriaLabel","clearFieldAriaLabel","showCalendarAriaLabel","viewDate","onHeaderChange","onNextMonth","onPrevMonth","prevMonthIcon","nextMonthIcon","props","daysRef","React","useRef","monthsRef","yearsRef","hoursRef","minutesRef","maxElement","onInternalValueChange","useCallback","internalValue","i","formattedValue","mask","Date","refs","useMemo","rootRef","calendarRef","open","openCalendar","closeCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","sizeY","onCalendarChange"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { format, isMatch, parse } from \"../../lib/date\";\nimport { Icon16Clear, Icon20CalendarOutline } from \"@vkontakte/icons\";\nimport { Calendar, CalendarProps } from \"../Calendar/Calendar\";\nimport { Popper, Placement } from \"../Popper/Popper\";\nimport { multiRef } from \"../../lib/utils\";\nimport IconButton from \"../IconButton/IconButton\";\nimport { classNames } from \"../../lib/classNames\";\nimport { FormField } from \"../FormField/FormField\";\nimport { HasRootRef } from \"../../types\";\nimport { useDateInput } from \"../../hooks/useDateInput\";\nimport { InputLike } from \"../InputLike/InputLike\";\nimport { InputLikeDivider } from \"../InputLike/InputLikeDivider\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { callMultiple } from \"../../lib/callMultiple\";\nimport \"./DateInput.css\";\n\nexport interface DateInputProps\n extends Omit<\n React.InputHTMLAttributes<HTMLDivElement>,\n \"value\" | \"onChange\" | \"size\"\n >,\n Pick<\n CalendarProps,\n | \"disablePast\"\n | \"disableFuture\"\n | \"enableTime\"\n | \"shouldDisableDate\"\n | \"onChange\"\n | \"value\"\n | \"doneButtonText\"\n | \"weekStartsOn\"\n | \"disablePickers\"\n | \"changeHoursAriaLabel\"\n | \"changeMinutesAriaLabel\"\n | \"prevMonthAriaLabel\"\n | \"nextMonthAriaLabel\"\n | \"changeMonthAriaLabel\"\n | \"changeYearAriaLabel\"\n | \"changeDayAriaLabel\"\n | \"showNeighboringMonth\"\n | \"size\"\n | \"viewDate\"\n | \"onHeaderChange\"\n | \"onNextMonth\"\n | \"onPrevMonth\"\n | \"prevMonthIcon\"\n | \"nextMonthIcon\"\n >,\n HasRootRef<HTMLDivElement> {\n calendarPlacement?: Placement;\n closeOnChange?: boolean;\n clearFieldAriaLabel?: string;\n showCalendarAriaLabel?: string;\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 max = 31;\n break;\n case 1:\n max = 12;\n break;\n case 2:\n max = 2100;\n min = 1900;\n length = 4;\n break;\n case 3:\n max = 23;\n break;\n case 4:\n max = 59;\n break;\n }\n\n return { length, min, max };\n};\n\nconst getInternalValue = (value: CalendarProps[\"value\"]) => {\n const newValue = [\"\", \"\", \"\", \"\", \"\"];\n if (value) {\n newValue[0] = String(value.getDate()).padStart(2, \"0\");\n newValue[1] = String(value.getMonth() + 1).padStart(2, \"0\");\n newValue[2] = String(value.getFullYear()).padStart(4, \"0\");\n newValue[3] = String(value.getHours()).padStart(2, \"0\");\n newValue[4] = String(value.getMinutes()).padStart(2, \"0\");\n }\n return newValue;\n};\n\nexport const DateInput: React.FC<DateInputProps> = ({\n enableTime,\n shouldDisableDate,\n disableFuture,\n disablePast,\n value,\n onChange,\n calendarPlacement = \"bottom-start\",\n style,\n className,\n doneButtonText,\n closeOnChange = true,\n disablePickers,\n getRootRef,\n name,\n autoFocus,\n disabled,\n onClick,\n onFocus,\n prevMonthAriaLabel,\n nextMonthAriaLabel,\n showNeighboringMonth,\n size,\n changeMonthAriaLabel = \"Изменить месяц\",\n changeYearAriaLabel = \"Изменить год\",\n changeDayAriaLabel = \"Изменить день\",\n changeHoursAriaLabel = \"Изменить час\",\n changeMinutesAriaLabel = \"Изменить минуту\",\n clearFieldAriaLabel = \"Очистить поле\",\n showCalendarAriaLabel = \"Показать календарь\",\n viewDate,\n onHeaderChange,\n onNextMonth,\n onPrevMonth,\n prevMonthIcon,\n nextMonthIcon,\n ...props\n}) => {\n const daysRef = React.useRef<HTMLSpanElement>(null);\n const monthsRef = React.useRef<HTMLSpanElement>(null);\n const yearsRef = React.useRef<HTMLSpanElement>(null);\n const hoursRef = React.useRef<HTMLSpanElement>(null);\n const minutesRef = React.useRef<HTMLSpanElement>(null);\n\n const maxElement = enableTime ? 4 : 2;\n\n const onInternalValueChange = React.useCallback(\n (internalValue: string[]) => {\n for (let i = 0; i <= maxElement; i += 1) {\n if (internalValue[i].length < elementsConfig(i).length) {\n return;\n }\n }\n\n let formattedValue = `${internalValue[0]}.${internalValue[1]}.${internalValue[2]}`;\n let mask = \"DD.MM.YYYY\";\n if (enableTime) {\n formattedValue += ` ${internalValue[3]}:${internalValue[4]}`;\n mask += \" HH:mm\";\n }\n\n if (isMatch(formattedValue, mask)) {\n onChange?.(parse(formattedValue, mask, value ?? new Date()));\n }\n },\n [enableTime, maxElement, onChange, value]\n );\n\n const refs = React.useMemo(\n () => [daysRef, monthsRef, yearsRef, hoursRef, minutesRef],\n [daysRef, monthsRef, yearsRef, hoursRef, minutesRef]\n );\n\n const {\n rootRef,\n calendarRef,\n open,\n openCalendar,\n closeCalendar,\n internalValue,\n handleKeyDown,\n setFocusedElement,\n handleFieldEnter,\n clear,\n removeFocusFromField,\n } = useDateInput({\n maxElement,\n refs,\n autoFocus,\n disabled,\n elementsConfig,\n onChange,\n onInternalValueChange,\n getInternalValue,\n value,\n });\n\n const { sizeY } = useAdaptivity();\n\n const onCalendarChange = React.useCallback(\n (value?: Date | undefined) => {\n onChange?.(value);\n if (closeOnChange && !enableTime) {\n removeFocusFromField();\n }\n },\n [onChange, removeFocusFromField, closeOnChange, enableTime]\n );\n\n return (\n <FormField\n vkuiClass={classNames(\"DateInput\", `DateInput--sizeY-${sizeY}`)}\n style={style}\n className={className}\n getRootRef={multiRef(rootRef, getRootRef)}\n after={\n value ? (\n <IconButton\n hoverMode=\"opacity\"\n aria-label={clearFieldAriaLabel}\n onClick={clear}\n >\n <Icon16Clear />\n </IconButton>\n ) : (\n <IconButton\n hoverMode=\"opacity\"\n aria-label={showCalendarAriaLabel}\n onClick={openCalendar}\n >\n <Icon20CalendarOutline />\n </IconButton>\n )\n }\n disabled={disabled}\n onClick={callMultiple(handleFieldEnter, onClick)}\n onFocus={callMultiple(handleFieldEnter, onFocus)}\n {...props}\n >\n <input\n type=\"hidden\"\n name={name}\n value={\n value\n ? format(value, enableTime ? \"DD.MM.YYYYTHH:mm\" : \"DD.MM.YYYY\")\n : \"\"\n }\n />\n <span vkuiClass=\"DateInput__input\" onKeyDown={handleKeyDown}>\n <InputLike\n tabIndex={1}\n length={2}\n getRootRef={daysRef}\n index={0}\n onElementSelect={setFocusedElement}\n value={internalValue[0]}\n aria-label={changeDayAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={monthsRef}\n index={1}\n onElementSelect={setFocusedElement}\n value={internalValue[1]}\n aria-label={changeMonthAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={4}\n getRootRef={yearsRef}\n index={2}\n onElementSelect={setFocusedElement}\n value={internalValue[2]}\n aria-label={changeYearAriaLabel}\n />\n {enableTime && (\n <React.Fragment>\n <InputLikeDivider vkuiClass=\"DateInput__input-time-divider\">\n {\" \"}\n </InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={hoursRef}\n index={3}\n onElementSelect={setFocusedElement}\n value={internalValue[3]}\n aria-label={changeHoursAriaLabel}\n />\n <InputLikeDivider>:</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={minutesRef}\n index={4}\n onElementSelect={setFocusedElement}\n value={internalValue[4]}\n aria-label={changeMinutesAriaLabel}\n />\n </React.Fragment>\n )}\n </span>\n {open && (\n <Popper\n targetRef={rootRef}\n offsetDistance={8}\n placement={calendarPlacement}\n >\n <Calendar\n value={value}\n onChange={onCalendarChange}\n enableTime={enableTime}\n disablePast={disablePast}\n disableFuture={disableFuture}\n shouldDisableDate={shouldDisableDate}\n onClose={closeCalendar}\n getRootRef={calendarRef}\n doneButtonText={doneButtonText}\n disablePickers={disablePickers}\n changeHoursAriaLabel={changeHoursAriaLabel}\n changeMinutesAriaLabel={changeMinutesAriaLabel}\n prevMonthAriaLabel={prevMonthAriaLabel}\n nextMonthAriaLabel={nextMonthAriaLabel}\n changeMonthAriaLabel={changeMonthAriaLabel}\n changeYearAriaLabel={changeYearAriaLabel}\n changeDayAriaLabel={changeDayAriaLabel}\n showNeighboringMonth={showNeighboringMonth}\n size={size}\n viewDate={viewDate}\n onHeaderChange={onHeaderChange}\n onNextMonth={onNextMonth}\n onPrevMonth={onPrevMonth}\n prevMonthIcon={prevMonthIcon}\n nextMonthIcon={nextMonthIcon}\n />\n </Popper>\n )}\n </FormField>\n );\n};\n"],"file":"DateInput.js"}
|
|
@@ -3,7 +3,7 @@ import { CalendarRangeProps } from "../CalendarRange/CalendarRange";
|
|
|
3
3
|
import { Placement } from "../Popper/Popper";
|
|
4
4
|
import { HasRootRef } from "../../types";
|
|
5
5
|
import "./DateRangeInput.css";
|
|
6
|
-
export interface DateRangeInputProps extends Omit<React.InputHTMLAttributes<HTMLDivElement>, "value" | "onChange">, Pick<CalendarRangeProps, "disablePast" | "disableFuture" | "shouldDisableDate" | "onChange" | "value" | "weekStartsOn" | "disablePickers" | "prevMonthAriaLabel" | "nextMonthAriaLabel" | "changeMonthAriaLabel" | "changeYearAriaLabel" | "changeDayAriaLabel">, HasRootRef<HTMLDivElement> {
|
|
6
|
+
export interface DateRangeInputProps extends Omit<React.InputHTMLAttributes<HTMLDivElement>, "value" | "onChange">, Pick<CalendarRangeProps, "disablePast" | "disableFuture" | "shouldDisableDate" | "onChange" | "value" | "weekStartsOn" | "disablePickers" | "prevMonthAriaLabel" | "nextMonthAriaLabel" | "changeMonthAriaLabel" | "changeYearAriaLabel" | "changeDayAriaLabel" | "prevMonthIcon" | "nextMonthIcon">, HasRootRef<HTMLDivElement> {
|
|
7
7
|
calendarPlacement?: Placement;
|
|
8
8
|
closeOnChange?: boolean;
|
|
9
9
|
clearFieldAriaLabel?: string;
|
|
@@ -43,7 +43,7 @@ var _InputLikeDivider = require("../InputLike/InputLikeDivider");
|
|
|
43
43
|
|
|
44
44
|
var _callMultiple = require("../../lib/callMultiple");
|
|
45
45
|
|
|
46
|
-
var _excluded = ["shouldDisableDate", "disableFuture", "disablePast", "value", "onChange", "calendarPlacement", "style", "className", "closeOnChange", "disablePickers", "getRootRef", "name", "autoFocus", "disabled", "onClick", "onFocus", "prevMonthAriaLabel", "nextMonthAriaLabel", "changeDayAriaLabel", "changeMonthAriaLabel", "changeYearAriaLabel", "changeStartDayAriaLabel", "changeStartMonthAriaLabel", "changeStartYearAriaLabel", "changeEndDayAriaLabel", "changeEndMonthAriaLabel", "changeEndYearAriaLabel", "clearFieldAriaLabel", "showCalendarAriaLabel"];
|
|
46
|
+
var _excluded = ["shouldDisableDate", "disableFuture", "disablePast", "value", "onChange", "calendarPlacement", "style", "className", "closeOnChange", "disablePickers", "getRootRef", "name", "autoFocus", "disabled", "onClick", "onFocus", "prevMonthAriaLabel", "nextMonthAriaLabel", "changeDayAriaLabel", "changeMonthAriaLabel", "changeYearAriaLabel", "changeStartDayAriaLabel", "changeStartMonthAriaLabel", "changeStartYearAriaLabel", "changeEndDayAriaLabel", "changeEndMonthAriaLabel", "changeEndYearAriaLabel", "clearFieldAriaLabel", "showCalendarAriaLabel", "prevMonthIcon", "nextMonthIcon"];
|
|
47
47
|
|
|
48
48
|
var elementsConfig = function elementsConfig(index) {
|
|
49
49
|
var length = 2;
|
|
@@ -134,6 +134,8 @@ var DateRangeInput = function DateRangeInput(_ref) {
|
|
|
134
134
|
clearFieldAriaLabel = _ref$clearFieldAriaLa === void 0 ? "Очистить поле" : _ref$clearFieldAriaLa,
|
|
135
135
|
_ref$showCalendarAria = _ref.showCalendarAriaLabel,
|
|
136
136
|
showCalendarAriaLabel = _ref$showCalendarAria === void 0 ? "Показать календарь" : _ref$showCalendarAria,
|
|
137
|
+
prevMonthIcon = _ref.prevMonthIcon,
|
|
138
|
+
nextMonthIcon = _ref.nextMonthIcon,
|
|
137
139
|
props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
138
140
|
var daysStartRef = React.useRef(null);
|
|
139
141
|
var monthsStartRef = React.useRef(null);
|
|
@@ -302,7 +304,9 @@ var DateRangeInput = function DateRangeInput(_ref) {
|
|
|
302
304
|
nextMonthAriaLabel: nextMonthAriaLabel,
|
|
303
305
|
changeMonthAriaLabel: changeMonthAriaLabel,
|
|
304
306
|
changeYearAriaLabel: changeYearAriaLabel,
|
|
305
|
-
changeDayAriaLabel: changeDayAriaLabel
|
|
307
|
+
changeDayAriaLabel: changeDayAriaLabel,
|
|
308
|
+
prevMonthIcon: prevMonthIcon,
|
|
309
|
+
nextMonthIcon: nextMonthIcon
|
|
306
310
|
})));
|
|
307
311
|
};
|
|
308
312
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/DateRangeInput/DateRangeInput.tsx"],"names":["elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","DateRangeInput","shouldDisableDate","disableFuture","disablePast","onChange","calendarPlacement","style","className","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","onClick","onFocus","prevMonthAriaLabel","nextMonthAriaLabel","changeDayAriaLabel","changeMonthAriaLabel","changeYearAriaLabel","changeStartDayAriaLabel","changeStartMonthAriaLabel","changeStartYearAriaLabel","changeEndDayAriaLabel","changeEndMonthAriaLabel","changeEndYearAriaLabel","clearFieldAriaLabel","showCalendarAriaLabel","props","daysStartRef","React","useRef","monthsStartRef","yearsStartRef","daysEndRef","monthsEndRef","yearsEndRef","onInternalValueChange","useCallback","internalValue","isStartValid","isEndValid","i","formattedStartValue","formattedEndValue","mask","valueExists","Array","isArray","now","Date","start","end","refs","useMemo","maxElement","rootRef","calendarRef","open","openCalendar","closeCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","sizeY","onCalendarChange"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { format, isMatch, parse, isAfter } from \"../../lib/date\";\nimport { Icon16Clear, Icon20CalendarOutline } from \"@vkontakte/icons\";\nimport {\n CalendarRange,\n CalendarRangeProps,\n} from \"../CalendarRange/CalendarRange\";\nimport { Popper, Placement } from \"../Popper/Popper\";\nimport IconButton from \"../IconButton/IconButton\";\nimport { HasRootRef } from \"../../types\";\nimport { useDateInput } from \"../../hooks/useDateInput\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { classNames } from \"../../lib/classNames\";\nimport { multiRef } from \"../../lib/utils\";\nimport { FormField } from \"../FormField/FormField\";\nimport { InputLike } from \"../InputLike/InputLike\";\nimport { InputLikeDivider } from \"../InputLike/InputLikeDivider\";\nimport { callMultiple } from \"../../lib/callMultiple\";\nimport \"./DateRangeInput.css\";\n\nexport interface DateRangeInputProps\n extends Omit<React.InputHTMLAttributes<HTMLDivElement>, \"value\" | \"onChange\">,\n Pick<\n CalendarRangeProps,\n | \"disablePast\"\n | \"disableFuture\"\n | \"shouldDisableDate\"\n | \"onChange\"\n | \"value\"\n | \"weekStartsOn\"\n | \"disablePickers\"\n | \"prevMonthAriaLabel\"\n | \"nextMonthAriaLabel\"\n | \"changeMonthAriaLabel\"\n | \"changeYearAriaLabel\"\n | \"changeDayAriaLabel\"\n >,\n HasRootRef<HTMLDivElement> {\n calendarPlacement?: Placement;\n closeOnChange?: boolean;\n clearFieldAriaLabel?: string;\n showCalendarAriaLabel?: string;\n changeStartDayAriaLabel?: string;\n changeStartMonthAriaLabel?: string;\n changeStartYearAriaLabel?: string;\n changeEndDayAriaLabel?: string;\n changeEndMonthAriaLabel?: string;\n changeEndYearAriaLabel?: string;\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\nexport const DateRangeInput: React.FC<DateRangeInputProps> = ({\n shouldDisableDate,\n disableFuture,\n disablePast,\n value,\n onChange,\n calendarPlacement = \"bottom-start\",\n style,\n className,\n closeOnChange = true,\n disablePickers,\n getRootRef,\n name,\n autoFocus,\n disabled,\n onClick,\n onFocus,\n prevMonthAriaLabel,\n nextMonthAriaLabel,\n changeDayAriaLabel,\n changeMonthAriaLabel,\n changeYearAriaLabel,\n changeStartDayAriaLabel = \"Изменить день начала\",\n changeStartMonthAriaLabel = \"Изменить месяц начала\",\n changeStartYearAriaLabel = \"Изменить год начала\",\n changeEndDayAriaLabel = \"Изменить день окончания\",\n changeEndMonthAriaLabel = \"Изменить месяц окончания\",\n changeEndYearAriaLabel = \"Изменить год окончания\",\n clearFieldAriaLabel = \"Очистить поле\",\n showCalendarAriaLabel = \"Показать календарь\",\n ...props\n}) => {\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 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 && isAfter(end, start)) {\n onChange?.([start, end]);\n }\n },\n [onChange, value]\n );\n\n const refs = React.useMemo(\n () => [\n daysStartRef,\n monthsStartRef,\n yearsStartRef,\n daysEndRef,\n monthsEndRef,\n yearsEndRef,\n ],\n [\n daysStartRef,\n monthsStartRef,\n yearsStartRef,\n daysEndRef,\n monthsEndRef,\n yearsEndRef,\n ]\n );\n\n const {\n rootRef,\n calendarRef,\n open,\n openCalendar,\n closeCalendar,\n internalValue,\n handleKeyDown,\n setFocusedElement,\n handleFieldEnter,\n clear,\n removeFocusFromField,\n } = useDateInput({\n maxElement: 5,\n refs,\n autoFocus,\n disabled,\n elementsConfig,\n onChange,\n onInternalValueChange,\n getInternalValue,\n value,\n });\n\n const { sizeY } = useAdaptivity();\n\n const onCalendarChange = React.useCallback(\n (newValue?: Array<Date | null> | undefined) => {\n onChange?.(newValue);\n if (closeOnChange && newValue?.[1] && newValue[1] !== value?.[1]) {\n removeFocusFromField();\n }\n },\n [onChange, closeOnChange, value, removeFocusFromField]\n );\n\n return (\n <FormField\n vkuiClass={classNames(\"DateRangeInput\", `DateRangeInput--sizeY-${sizeY}`)}\n style={style}\n className={className}\n getRootRef={multiRef(rootRef, getRootRef)}\n after={\n value ? (\n <IconButton\n hoverMode=\"opacity\"\n aria-label={clearFieldAriaLabel}\n onClick={clear}\n >\n <Icon16Clear />\n </IconButton>\n ) : (\n <IconButton\n hoverMode=\"opacity\"\n aria-label={showCalendarAriaLabel}\n onClick={openCalendar}\n >\n <Icon20CalendarOutline />\n </IconButton>\n )\n }\n disabled={disabled}\n onClick={callMultiple(handleFieldEnter, onClick)}\n onFocus={callMultiple(handleFieldEnter, onFocus)}\n {...props}\n >\n <input\n type=\"hidden\"\n name={name}\n value={\n value\n ? `${value[0] ? format(value[0], \"DD.MM.YYYY\") : \"\"} - ${\n value[1] ? format(value[1], \"DD.MM.YYYY\") : \"\"\n }`\n : \"\"\n }\n />\n <span vkuiClass=\"DateInput__input\" onKeyDown={handleKeyDown}>\n <InputLike\n length={2}\n getRootRef={daysStartRef}\n index={0}\n onElementSelect={setFocusedElement}\n value={internalValue[0]}\n aria-label={changeStartDayAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={monthsStartRef}\n index={1}\n onElementSelect={setFocusedElement}\n value={internalValue[1]}\n aria-label={changeStartMonthAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={4}\n getRootRef={yearsStartRef}\n index={2}\n onElementSelect={setFocusedElement}\n value={internalValue[2]}\n aria-label={changeStartYearAriaLabel}\n />\n <InputLikeDivider>{\" — \"}</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={daysEndRef}\n index={3}\n onElementSelect={setFocusedElement}\n value={internalValue[3]}\n aria-label={changeEndDayAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={monthsEndRef}\n index={4}\n onElementSelect={setFocusedElement}\n value={internalValue[4]}\n aria-label={changeEndMonthAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={4}\n getRootRef={yearsEndRef}\n index={5}\n onElementSelect={setFocusedElement}\n value={internalValue[5]}\n aria-label={changeEndYearAriaLabel}\n />\n </span>\n {open && (\n <Popper\n targetRef={rootRef}\n offsetDistance={8}\n placement={calendarPlacement}\n >\n <CalendarRange\n value={value}\n onChange={onCalendarChange}\n disablePast={disablePast}\n disableFuture={disableFuture}\n shouldDisableDate={shouldDisableDate}\n onClose={closeCalendar}\n getRootRef={calendarRef}\n disablePickers={disablePickers}\n prevMonthAriaLabel={prevMonthAriaLabel}\n nextMonthAriaLabel={nextMonthAriaLabel}\n changeMonthAriaLabel={changeMonthAriaLabel}\n changeYearAriaLabel={changeYearAriaLabel}\n changeDayAriaLabel={changeDayAriaLabel}\n />\n </Popper>\n )}\n </FormField>\n );\n};\n"],"file":"DateRangeInput.js"}
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/DateRangeInput/DateRangeInput.tsx"],"names":["elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","DateRangeInput","shouldDisableDate","disableFuture","disablePast","onChange","calendarPlacement","style","className","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","onClick","onFocus","prevMonthAriaLabel","nextMonthAriaLabel","changeDayAriaLabel","changeMonthAriaLabel","changeYearAriaLabel","changeStartDayAriaLabel","changeStartMonthAriaLabel","changeStartYearAriaLabel","changeEndDayAriaLabel","changeEndMonthAriaLabel","changeEndYearAriaLabel","clearFieldAriaLabel","showCalendarAriaLabel","prevMonthIcon","nextMonthIcon","props","daysStartRef","React","useRef","monthsStartRef","yearsStartRef","daysEndRef","monthsEndRef","yearsEndRef","onInternalValueChange","useCallback","internalValue","isStartValid","isEndValid","i","formattedStartValue","formattedEndValue","mask","valueExists","Array","isArray","now","Date","start","end","refs","useMemo","maxElement","rootRef","calendarRef","open","openCalendar","closeCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","sizeY","onCalendarChange"],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAIA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAmCA,IAAMA,cAAc,GAAG,SAAjBA,cAAiB,CAACC,KAAD,EAAmB;AACxC,MAAIC,MAAM,GAAG,CAAb;AACA,MAAIC,GAAG,GAAG,CAAV;AACA,MAAIC,GAAG,GAAG,CAAV;;AAEA,UAAQH,KAAR;AACE,SAAK,CAAL;AACA,SAAK,CAAL;AACEG,MAAAA,GAAG,GAAG,EAAN;AACA;;AACF,SAAK,CAAL;AACA,SAAK,CAAL;AACEA,MAAAA,GAAG,GAAG,EAAN;AACA;;AACF,SAAK,CAAL;AACA,SAAK,CAAL;AACEA,MAAAA,GAAG,GAAG,IAAN;AACAD,MAAAA,GAAG,GAAG,IAAN;AACAD,MAAAA,MAAM,GAAG,CAAT;AACA;AAdJ;;AAiBA,SAAO;AAAEA,IAAAA,MAAM,EAANA,MAAF;AAAUC,IAAAA,GAAG,EAAHA,GAAV;AAAeC,IAAAA,GAAG,EAAHA;AAAf,GAAP;AACD,CAvBD;;AAyBA,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,KAAD,EAAwC;AAC/D,MAAMC,QAAQ,GAAG,CAAC,EAAD,EAAK,EAAL,EAAS,EAAT,EAAa,EAAb,EAAiB,EAAjB,EAAqB,EAArB,CAAjB;;AACA,MAAID,KAAJ,aAAIA,KAAJ,eAAIA,KAAK,CAAG,CAAH,CAAT,EAAgB;AACdC,IAAAA,QAAQ,CAAC,CAAD,CAAR,GAAcC,MAAM,CAACF,KAAK,CAAC,CAAD,CAAL,CAASG,OAAT,EAAD,CAAN,CAA2BC,QAA3B,CAAoC,CAApC,EAAuC,GAAvC,CAAd;AACAH,IAAAA,QAAQ,CAAC,CAAD,CAAR,GAAcC,MAAM,CAACF,KAAK,CAAC,CAAD,CAAL,CAASK,QAAT,KAAsB,CAAvB,CAAN,CAAgCD,QAAhC,CAAyC,CAAzC,EAA4C,GAA5C,CAAd;AACAH,IAAAA,QAAQ,CAAC,CAAD,CAAR,GAAcC,MAAM,CAACF,KAAK,CAAC,CAAD,CAAL,CAASM,WAAT,EAAD,CAAN,CAA+BF,QAA/B,CAAwC,CAAxC,EAA2C,GAA3C,CAAd;AACD;;AACD,MAAIJ,KAAJ,aAAIA,KAAJ,eAAIA,KAAK,CAAG,CAAH,CAAT,EAAgB;AACdC,IAAAA,QAAQ,CAAC,CAAD,CAAR,GAAcC,MAAM,CAACF,KAAK,CAAC,CAAD,CAAL,CAASG,OAAT,EAAD,CAAN,CAA2BC,QAA3B,CAAoC,CAApC,EAAuC,GAAvC,CAAd;AACAH,IAAAA,QAAQ,CAAC,CAAD,CAAR,GAAcC,MAAM,CAACF,KAAK,CAAC,CAAD,CAAL,CAASK,QAAT,KAAsB,CAAvB,CAAN,CAAgCD,QAAhC,CAAyC,CAAzC,EAA4C,GAA5C,CAAd;AACAH,IAAAA,QAAQ,CAAC,CAAD,CAAR,GAAcC,MAAM,CAACF,KAAK,CAAC,CAAD,CAAL,CAASM,WAAT,EAAD,CAAN,CAA+BF,QAA/B,CAAwC,CAAxC,EAA2C,GAA3C,CAAd;AACD;;AACD,SAAOH,QAAP;AACD,CAbD;;AAeO,IAAMM,cAA6C,GAAG,SAAhDA,cAAgD,OAiCvD;AAAA,MAhCJC,iBAgCI,QAhCJA,iBAgCI;AAAA,MA/BJC,aA+BI,QA/BJA,aA+BI;AAAA,MA9BJC,WA8BI,QA9BJA,WA8BI;AAAA,MA7BJV,KA6BI,QA7BJA,KA6BI;AAAA,MA5BJW,QA4BI,QA5BJA,QA4BI;AAAA,mCA3BJC,iBA2BI;AAAA,MA3BJA,iBA2BI,sCA3BgB,cA2BhB;AAAA,MA1BJC,KA0BI,QA1BJA,KA0BI;AAAA,MAzBJC,SAyBI,QAzBJA,SAyBI;AAAA,gCAxBJC,aAwBI;AAAA,MAxBJA,aAwBI,mCAxBY,IAwBZ;AAAA,MAvBJC,cAuBI,QAvBJA,cAuBI;AAAA,MAtBJC,UAsBI,QAtBJA,UAsBI;AAAA,MArBJC,IAqBI,QArBJA,IAqBI;AAAA,MApBJC,SAoBI,QApBJA,SAoBI;AAAA,MAnBJC,QAmBI,QAnBJA,QAmBI;AAAA,MAlBJC,OAkBI,QAlBJA,OAkBI;AAAA,MAjBJC,OAiBI,QAjBJA,OAiBI;AAAA,MAhBJC,kBAgBI,QAhBJA,kBAgBI;AAAA,MAfJC,kBAeI,QAfJA,kBAeI;AAAA,MAdJC,kBAcI,QAdJA,kBAcI;AAAA,MAbJC,oBAaI,QAbJA,oBAaI;AAAA,MAZJC,mBAYI,QAZJA,mBAYI;AAAA,mCAXJC,uBAWI;AAAA,MAXJA,uBAWI,sCAXsB,sBAWtB;AAAA,mCAVJC,yBAUI;AAAA,MAVJA,yBAUI,sCAVwB,uBAUxB;AAAA,mCATJC,wBASI;AAAA,MATJA,wBASI,sCATuB,qBASvB;AAAA,mCARJC,qBAQI;AAAA,MARJA,qBAQI,sCARoB,yBAQpB;AAAA,mCAPJC,uBAOI;AAAA,MAPJA,uBAOI,sCAPsB,0BAOtB;AAAA,mCANJC,sBAMI;AAAA,MANJA,sBAMI,sCANqB,wBAMrB;AAAA,mCALJC,mBAKI;AAAA,MALJA,mBAKI,sCALkB,eAKlB;AAAA,mCAJJC,qBAII;AAAA,MAJJA,qBAII,sCAJoB,oBAIpB;AAAA,MAHJC,aAGI,QAHJA,aAGI;AAAA,MAFJC,aAEI,QAFJA,aAEI;AAAA,MADDC,KACC;AACJ,MAAMC,YAAY,GAAGC,KAAK,CAACC,MAAN,CAA8B,IAA9B,CAArB;AACA,MAAMC,cAAc,GAAGF,KAAK,CAACC,MAAN,CAA8B,IAA9B,CAAvB;AACA,MAAME,aAAa,GAAGH,KAAK,CAACC,MAAN,CAA8B,IAA9B,CAAtB;AACA,MAAMG,UAAU,GAAGJ,KAAK,CAACC,MAAN,CAA8B,IAA9B,CAAnB;AACA,MAAMI,YAAY,GAAGL,KAAK,CAACC,MAAN,CAA8B,IAA9B,CAArB;AACA,MAAMK,WAAW,GAAGN,KAAK,CAACC,MAAN,CAA8B,IAA9B,CAApB;AAEA,MAAMM,qBAAqB,GAAGP,KAAK,CAACQ,WAAN,CAC5B,UAACC,aAAD,EAA6B;AAC3B,QAAIC,YAAY,GAAG,IAAnB;AACA,QAAIC,UAAU,GAAG,IAAjB;;AACA,SAAK,IAAIC,CAAC,GAAG,CAAb,EAAgBA,CAAC,IAAI,CAArB,EAAwBA,CAAC,IAAI,CAA7B,EAAgC;AAC9B,UAAIH,aAAa,CAACG,CAAD,CAAb,CAAiBxD,MAAjB,GAA0BF,cAAc,CAAC0D,CAAD,CAAd,CAAkBxD,MAAhD,EAAwD;AACtDsD,QAAAA,YAAY,GAAG,KAAf;AACD;AACF;;AACD,SAAK,IAAIE,EAAC,GAAG,CAAb,EAAgBA,EAAC,IAAI,CAArB,EAAwBA,EAAC,IAAI,CAA7B,EAAgC;AAC9B,UAAIH,aAAa,CAACG,EAAD,CAAb,CAAiBxD,MAAjB,GAA0BF,cAAc,CAAC0D,EAAD,CAAd,CAAkBxD,MAAhD,EAAwD;AACtDuD,QAAAA,UAAU,GAAG,KAAb;AACD;AACF;;AACD,QAAME,mBAAmB,aAAMJ,aAAa,CAAC,CAAD,CAAnB,cAA0BA,aAAa,CAAC,CAAD,CAAvC,cAA8CA,aAAa,CAAC,CAAD,CAA3D,CAAzB;AACA,QAAMK,iBAAiB,aAAML,aAAa,CAAC,CAAD,CAAnB,cAA0BA,aAAa,CAAC,CAAD,CAAvC,cAA8CA,aAAa,CAAC,CAAD,CAA3D,CAAvB;AACA,QAAMM,IAAI,GAAG,YAAb;;AAEA,QAAI,CAAC,mBAAQF,mBAAR,EAA6BE,IAA7B,CAAL,EAAyC;AACvCL,MAAAA,YAAY,GAAG,KAAf;AACD;;AACD,QAAI,CAAC,mBAAQI,iBAAR,EAA2BC,IAA3B,CAAL,EAAuC;AACrCJ,MAAAA,UAAU,GAAG,KAAb;AACD;;AAED,QAAI,CAACD,YAAD,IAAiB,CAACC,UAAtB,EAAkC;AAChC;AACD;;AAED,QAAMK,WAAW,GAAGC,KAAK,CAACC,OAAN,CAAc1D,KAAd,CAApB;AACA,QAAM2D,GAAG,GAAG,IAAIC,IAAJ,EAAZ;AACA,QAAMC,KAAK,GAAGX,YAAY,GACtB,iBAAMG,mBAAN,EAA2BE,IAA3B,EAAkCC,WAAW,KAAIxD,KAAJ,aAAIA,KAAJ,uBAAIA,KAAK,CAAG,CAAH,CAAT,CAAZ,IAA+B2D,GAAhE,CADsB,GAEtB,IAFJ;AAGA,QAAMG,GAAG,GAAGX,UAAU,GAClB,iBAAMG,iBAAN,EAAyBC,IAAzB,EAAgCC,WAAW,KAAIxD,KAAJ,aAAIA,KAAJ,uBAAIA,KAAK,CAAG,CAAH,CAAT,CAAZ,IAA+B2D,GAA9D,CADkB,GAElB,IAFJ;;AAGA,QAAIE,KAAK,IAAIC,GAAT,IAAgB,mBAAQA,GAAR,EAAaD,KAAb,CAApB,EAAyC;AACvClD,MAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAG,CAACkD,KAAD,EAAQC,GAAR,CAAH,CAAR;AACD;AACF,GAxC2B,EAyC5B,CAACnD,QAAD,EAAWX,KAAX,CAzC4B,CAA9B;AA4CA,MAAM+D,IAAI,GAAGvB,KAAK,CAACwB,OAAN,CACX;AAAA,WAAM,CACJzB,YADI,EAEJG,cAFI,EAGJC,aAHI,EAIJC,UAJI,EAKJC,YALI,EAMJC,WANI,CAAN;AAAA,GADW,EASX,CACEP,YADF,EAEEG,cAFF,EAGEC,aAHF,EAIEC,UAJF,EAKEC,YALF,EAMEC,WANF,CATW,CAAb;;AAmBA,sBAYI,iCAAa;AACfmB,IAAAA,UAAU,EAAE,CADG;AAEfF,IAAAA,IAAI,EAAJA,IAFe;AAGf5C,IAAAA,SAAS,EAATA,SAHe;AAIfC,IAAAA,QAAQ,EAARA,QAJe;AAKf1B,IAAAA,cAAc,EAAdA,cALe;AAMfiB,IAAAA,QAAQ,EAARA,QANe;AAOfoC,IAAAA,qBAAqB,EAArBA,qBAPe;AAQfhD,IAAAA,gBAAgB,EAAhBA,gBARe;AASfC,IAAAA,KAAK,EAALA;AATe,GAAb,CAZJ;AAAA,MACEkE,OADF,iBACEA,OADF;AAAA,MAEEC,WAFF,iBAEEA,WAFF;AAAA,MAGEC,IAHF,iBAGEA,IAHF;AAAA,MAIEC,YAJF,iBAIEA,YAJF;AAAA,MAKEC,aALF,iBAKEA,aALF;AAAA,MAMErB,aANF,iBAMEA,aANF;AAAA,MAOEsB,aAPF,iBAOEA,aAPF;AAAA,MAQEC,iBARF,iBAQEA,iBARF;AAAA,MASEC,gBATF,iBASEA,gBATF;AAAA,MAUEC,KAVF,iBAUEA,KAVF;AAAA,MAWEC,oBAXF,iBAWEA,oBAXF;;AAwBA,uBAAkB,oCAAlB;AAAA,MAAQC,KAAR,kBAAQA,KAAR;;AAEA,MAAMC,gBAAgB,GAAGrC,KAAK,CAACQ,WAAN,CACvB,UAAC/C,QAAD,EAA+C;AAC7CU,IAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGV,QAAH,CAAR;;AACA,QAAIc,aAAa,IAAId,QAAJ,aAAIA,QAAJ,eAAIA,QAAQ,CAAG,CAAH,CAAzB,IAAkCA,QAAQ,CAAC,CAAD,CAAR,MAAgBD,KAAhB,aAAgBA,KAAhB,uBAAgBA,KAAK,CAAG,CAAH,CAArB,CAAtC,EAAkE;AAChE2E,MAAAA,oBAAoB;AACrB;AACF,GANsB,EAOvB,CAAChE,QAAD,EAAWI,aAAX,EAA0Bf,KAA1B,EAAiC2E,oBAAjC,CAPuB,CAAzB;AAUA,SACE,qCAAC,oBAAD;AACE,IAAA,SAAS,EAAE,4BAAW,gBAAX,kCAAsDC,KAAtD,EADb;AAEE,IAAA,KAAK,EAAE/D,KAFT;AAGE,IAAA,SAAS,EAAEC,SAHb;AAIE,IAAA,UAAU,EAAE,qBAASoD,OAAT,EAAkBjD,UAAlB,CAJd;AAKE,IAAA,KAAK,EACHjB,KAAK,GACH,qCAAC,mBAAD;AACE,MAAA,SAAS,EAAC,SADZ;AAEE,oBAAYkC,mBAFd;AAGE,MAAA,OAAO,EAAEwC;AAHX,OAKE,qCAAC,kBAAD,OALF,CADG,GASH,qCAAC,mBAAD;AACE,MAAA,SAAS,EAAC,SADZ;AAEE,oBAAYvC,qBAFd;AAGE,MAAA,OAAO,EAAEkC;AAHX,OAKE,qCAAC,4BAAD,OALF,CAfN;AAwBE,IAAA,QAAQ,EAAEjD,QAxBZ;AAyBE,IAAA,OAAO,EAAE,gCAAaqD,gBAAb,EAA+BpD,OAA/B,CAzBX;AA0BE,IAAA,OAAO,EAAE,gCAAaoD,gBAAb,EAA+BnD,OAA/B;AA1BX,KA2BMgB,KA3BN,GA6BE;AACE,IAAA,IAAI,EAAC,QADP;AAEE,IAAA,IAAI,EAAEpB,IAFR;AAGE,IAAA,KAAK,EACHlB,KAAK,aACEA,KAAK,CAAC,CAAD,CAAL,GAAW,kBAAOA,KAAK,CAAC,CAAD,CAAZ,EAAiB,YAAjB,CAAX,GAA4C,EAD9C,gBAECA,KAAK,CAAC,CAAD,CAAL,GAAW,kBAAOA,KAAK,CAAC,CAAD,CAAZ,EAAiB,YAAjB,CAAX,GAA4C,EAF7C,IAID;AARR,IA7BF,EAwCE;AAAM,IAAA,SAAS,EAAC,kBAAhB;AAAmC,IAAA,SAAS,EAAEuE;AAA9C,KACE,qCAAC,oBAAD;AACE,IAAA,MAAM,EAAE,CADV;AAEE,IAAA,UAAU,EAAEhC,YAFd;AAGE,IAAA,KAAK,EAAE,CAHT;AAIE,IAAA,eAAe,EAAEiC,iBAJnB;AAKE,IAAA,KAAK,EAAEvB,aAAa,CAAC,CAAD,CALtB;AAME,kBAAYrB;AANd,IADF,EASE,qCAAC,kCAAD,YATF,EAUE,qCAAC,oBAAD;AACE,IAAA,MAAM,EAAE,CADV;AAEE,IAAA,UAAU,EAAEc,cAFd;AAGE,IAAA,KAAK,EAAE,CAHT;AAIE,IAAA,eAAe,EAAE8B,iBAJnB;AAKE,IAAA,KAAK,EAAEvB,aAAa,CAAC,CAAD,CALtB;AAME,kBAAYpB;AANd,IAVF,EAkBE,qCAAC,kCAAD,YAlBF,EAmBE,qCAAC,oBAAD;AACE,IAAA,MAAM,EAAE,CADV;AAEE,IAAA,UAAU,EAAEc,aAFd;AAGE,IAAA,KAAK,EAAE,CAHT;AAIE,IAAA,eAAe,EAAE6B,iBAJnB;AAKE,IAAA,KAAK,EAAEvB,aAAa,CAAC,CAAD,CALtB;AAME,kBAAYnB;AANd,IAnBF,EA2BE,qCAAC,kCAAD,QAAmB,KAAnB,CA3BF,EA4BE,qCAAC,oBAAD;AACE,IAAA,MAAM,EAAE,CADV;AAEE,IAAA,UAAU,EAAEc,UAFd;AAGE,IAAA,KAAK,EAAE,CAHT;AAIE,IAAA,eAAe,EAAE4B,iBAJnB;AAKE,IAAA,KAAK,EAAEvB,aAAa,CAAC,CAAD,CALtB;AAME,kBAAYlB;AANd,IA5BF,EAoCE,qCAAC,kCAAD,YApCF,EAqCE,qCAAC,oBAAD;AACE,IAAA,MAAM,EAAE,CADV;AAEE,IAAA,UAAU,EAAEc,YAFd;AAGE,IAAA,KAAK,EAAE,CAHT;AAIE,IAAA,eAAe,EAAE2B,iBAJnB;AAKE,IAAA,KAAK,EAAEvB,aAAa,CAAC,CAAD,CALtB;AAME,kBAAYjB;AANd,IArCF,EA6CE,qCAAC,kCAAD,YA7CF,EA8CE,qCAAC,oBAAD;AACE,IAAA,MAAM,EAAE,CADV;AAEE,IAAA,UAAU,EAAEc,WAFd;AAGE,IAAA,KAAK,EAAE,CAHT;AAIE,IAAA,eAAe,EAAE0B,iBAJnB;AAKE,IAAA,KAAK,EAAEvB,aAAa,CAAC,CAAD,CALtB;AAME,kBAAYhB;AANd,IA9CF,CAxCF,EA+FGmC,IAAI,IACH,qCAAC,cAAD;AACE,IAAA,SAAS,EAAEF,OADb;AAEE,IAAA,cAAc,EAAE,CAFlB;AAGE,IAAA,SAAS,EAAEtD;AAHb,KAKE,qCAAC,4BAAD;AACE,IAAA,KAAK,EAAEZ,KADT;AAEE,IAAA,QAAQ,EAAE6E,gBAFZ;AAGE,IAAA,WAAW,EAAEnE,WAHf;AAIE,IAAA,aAAa,EAAED,aAJjB;AAKE,IAAA,iBAAiB,EAAED,iBALrB;AAME,IAAA,OAAO,EAAE8D,aANX;AAOE,IAAA,UAAU,EAAEH,WAPd;AAQE,IAAA,cAAc,EAAEnD,cARlB;AASE,IAAA,kBAAkB,EAAEO,kBATtB;AAUE,IAAA,kBAAkB,EAAEC,kBAVtB;AAWE,IAAA,oBAAoB,EAAEE,oBAXxB;AAYE,IAAA,mBAAmB,EAAEC,mBAZvB;AAaE,IAAA,kBAAkB,EAAEF,kBAbtB;AAcE,IAAA,aAAa,EAAEW,aAdjB;AAeE,IAAA,aAAa,EAAEC;AAfjB,IALF,CAhGJ,CADF;AA2HD,CAvQM","sourcesContent":["import * as React from \"react\";\nimport { format, isMatch, parse, isAfter } from \"../../lib/date\";\nimport { Icon16Clear, Icon20CalendarOutline } from \"@vkontakte/icons\";\nimport {\n CalendarRange,\n CalendarRangeProps,\n} from \"../CalendarRange/CalendarRange\";\nimport { Popper, Placement } from \"../Popper/Popper\";\nimport IconButton from \"../IconButton/IconButton\";\nimport { HasRootRef } from \"../../types\";\nimport { useDateInput } from \"../../hooks/useDateInput\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { classNames } from \"../../lib/classNames\";\nimport { multiRef } from \"../../lib/utils\";\nimport { FormField } from \"../FormField/FormField\";\nimport { InputLike } from \"../InputLike/InputLike\";\nimport { InputLikeDivider } from \"../InputLike/InputLikeDivider\";\nimport { callMultiple } from \"../../lib/callMultiple\";\nimport \"./DateRangeInput.css\";\n\nexport interface DateRangeInputProps\n extends Omit<React.InputHTMLAttributes<HTMLDivElement>, \"value\" | \"onChange\">,\n Pick<\n CalendarRangeProps,\n | \"disablePast\"\n | \"disableFuture\"\n | \"shouldDisableDate\"\n | \"onChange\"\n | \"value\"\n | \"weekStartsOn\"\n | \"disablePickers\"\n | \"prevMonthAriaLabel\"\n | \"nextMonthAriaLabel\"\n | \"changeMonthAriaLabel\"\n | \"changeYearAriaLabel\"\n | \"changeDayAriaLabel\"\n | \"prevMonthIcon\"\n | \"nextMonthIcon\"\n >,\n HasRootRef<HTMLDivElement> {\n calendarPlacement?: Placement;\n closeOnChange?: boolean;\n clearFieldAriaLabel?: string;\n showCalendarAriaLabel?: string;\n changeStartDayAriaLabel?: string;\n changeStartMonthAriaLabel?: string;\n changeStartYearAriaLabel?: string;\n changeEndDayAriaLabel?: string;\n changeEndMonthAriaLabel?: string;\n changeEndYearAriaLabel?: string;\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\nexport const DateRangeInput: React.FC<DateRangeInputProps> = ({\n shouldDisableDate,\n disableFuture,\n disablePast,\n value,\n onChange,\n calendarPlacement = \"bottom-start\",\n style,\n className,\n closeOnChange = true,\n disablePickers,\n getRootRef,\n name,\n autoFocus,\n disabled,\n onClick,\n onFocus,\n prevMonthAriaLabel,\n nextMonthAriaLabel,\n changeDayAriaLabel,\n changeMonthAriaLabel,\n changeYearAriaLabel,\n changeStartDayAriaLabel = \"Изменить день начала\",\n changeStartMonthAriaLabel = \"Изменить месяц начала\",\n changeStartYearAriaLabel = \"Изменить год начала\",\n changeEndDayAriaLabel = \"Изменить день окончания\",\n changeEndMonthAriaLabel = \"Изменить месяц окончания\",\n changeEndYearAriaLabel = \"Изменить год окончания\",\n clearFieldAriaLabel = \"Очистить поле\",\n showCalendarAriaLabel = \"Показать календарь\",\n prevMonthIcon,\n nextMonthIcon,\n ...props\n}) => {\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 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 && isAfter(end, start)) {\n onChange?.([start, end]);\n }\n },\n [onChange, value]\n );\n\n const refs = React.useMemo(\n () => [\n daysStartRef,\n monthsStartRef,\n yearsStartRef,\n daysEndRef,\n monthsEndRef,\n yearsEndRef,\n ],\n [\n daysStartRef,\n monthsStartRef,\n yearsStartRef,\n daysEndRef,\n monthsEndRef,\n yearsEndRef,\n ]\n );\n\n const {\n rootRef,\n calendarRef,\n open,\n openCalendar,\n closeCalendar,\n internalValue,\n handleKeyDown,\n setFocusedElement,\n handleFieldEnter,\n clear,\n removeFocusFromField,\n } = useDateInput({\n maxElement: 5,\n refs,\n autoFocus,\n disabled,\n elementsConfig,\n onChange,\n onInternalValueChange,\n getInternalValue,\n value,\n });\n\n const { sizeY } = useAdaptivity();\n\n const onCalendarChange = React.useCallback(\n (newValue?: Array<Date | null> | undefined) => {\n onChange?.(newValue);\n if (closeOnChange && newValue?.[1] && newValue[1] !== value?.[1]) {\n removeFocusFromField();\n }\n },\n [onChange, closeOnChange, value, removeFocusFromField]\n );\n\n return (\n <FormField\n vkuiClass={classNames(\"DateRangeInput\", `DateRangeInput--sizeY-${sizeY}`)}\n style={style}\n className={className}\n getRootRef={multiRef(rootRef, getRootRef)}\n after={\n value ? (\n <IconButton\n hoverMode=\"opacity\"\n aria-label={clearFieldAriaLabel}\n onClick={clear}\n >\n <Icon16Clear />\n </IconButton>\n ) : (\n <IconButton\n hoverMode=\"opacity\"\n aria-label={showCalendarAriaLabel}\n onClick={openCalendar}\n >\n <Icon20CalendarOutline />\n </IconButton>\n )\n }\n disabled={disabled}\n onClick={callMultiple(handleFieldEnter, onClick)}\n onFocus={callMultiple(handleFieldEnter, onFocus)}\n {...props}\n >\n <input\n type=\"hidden\"\n name={name}\n value={\n value\n ? `${value[0] ? format(value[0], \"DD.MM.YYYY\") : \"\"} - ${\n value[1] ? format(value[1], \"DD.MM.YYYY\") : \"\"\n }`\n : \"\"\n }\n />\n <span vkuiClass=\"DateInput__input\" onKeyDown={handleKeyDown}>\n <InputLike\n length={2}\n getRootRef={daysStartRef}\n index={0}\n onElementSelect={setFocusedElement}\n value={internalValue[0]}\n aria-label={changeStartDayAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={monthsStartRef}\n index={1}\n onElementSelect={setFocusedElement}\n value={internalValue[1]}\n aria-label={changeStartMonthAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={4}\n getRootRef={yearsStartRef}\n index={2}\n onElementSelect={setFocusedElement}\n value={internalValue[2]}\n aria-label={changeStartYearAriaLabel}\n />\n <InputLikeDivider>{\" — \"}</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={daysEndRef}\n index={3}\n onElementSelect={setFocusedElement}\n value={internalValue[3]}\n aria-label={changeEndDayAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={monthsEndRef}\n index={4}\n onElementSelect={setFocusedElement}\n value={internalValue[4]}\n aria-label={changeEndMonthAriaLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={4}\n getRootRef={yearsEndRef}\n index={5}\n onElementSelect={setFocusedElement}\n value={internalValue[5]}\n aria-label={changeEndYearAriaLabel}\n />\n </span>\n {open && (\n <Popper\n targetRef={rootRef}\n offsetDistance={8}\n placement={calendarPlacement}\n >\n <CalendarRange\n value={value}\n onChange={onCalendarChange}\n disablePast={disablePast}\n disableFuture={disableFuture}\n shouldDisableDate={shouldDisableDate}\n onClose={closeCalendar}\n getRootRef={calendarRef}\n disablePickers={disablePickers}\n prevMonthAriaLabel={prevMonthAriaLabel}\n nextMonthAriaLabel={nextMonthAriaLabel}\n changeMonthAriaLabel={changeMonthAriaLabel}\n changeYearAriaLabel={changeYearAriaLabel}\n changeDayAriaLabel={changeDayAriaLabel}\n prevMonthIcon={prevMonthIcon}\n nextMonthIcon={nextMonthIcon}\n />\n </Popper>\n )}\n </FormField>\n );\n};\n"],"file":"DateRangeInput.js"}
|
|
@@ -44,7 +44,7 @@ var Epic = function Epic(props) {
|
|
|
44
44
|
restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
|
|
45
45
|
|
|
46
46
|
if (process.env.NODE_ENV === "development" && !tabbar && viewWidth < _withAdaptivity.ViewWidth.SMALL_TABLET) {
|
|
47
|
-
warn("
|
|
47
|
+
warn("\u041D\u0435 \u0440\u0435\u043A\u043E\u043C\u0435\u043D\u0434\u0443\u0435\u0442\u0441\u044F \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u044C Epic \u0431\u0435\u0437 Tabbar \u043F\u0440\u0438 \u0448\u0438\u0440\u0438\u043D\u0435 \u043E\u043A\u043D\u0430 \u043C\u0435\u043D\u044C\u0448\u0435 ".concat(_withAdaptivity.ViewWidth.SMALL_TABLET, "px"));
|
|
48
48
|
}
|
|
49
49
|
|
|
50
50
|
var story = (_ref = React.Children.toArray(children).find(function (story) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Epic/Epic.tsx"],"names":["warn","Epic","props","platform","scroll","React","useRef","current","activeStory","tabbar","children","viewWidth","restProps","process","env","NODE_ENV","ViewWidth","SMALL_TABLET","story","Children","toArray","find","isValidElement","value"],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;AAcA,IAAMA,IAAI,GAAG,wBAAS,MAAT,CAAb;;AAEO,IAAMC,IAAsD,GAAG,SAAzDA,IAAyD,CACpEC,KADoE,EAEjE;AAAA;;AACH,MAAMC,QAAQ,GAAG,+BAAjB;AACA,MAAMC,MAAM,GAAGC,KAAK,CAACC,MAAN,CAAwC,EAAxC,EAA4CC,OAA3D;AACA,MAAQC,WAAR,GAAmEN,KAAnE,CAAQM,WAAR;AAAA,MAAqBC,MAArB,GAAmEP,KAAnE,CAAqBO,MAArB;AAAA,MAA6BC,QAA7B,GAAmER,KAAnE,CAA6BQ,QAA7B;AAAA,MAAuCC,SAAvC,GAAmET,KAAnE,CAAuCS,SAAvC;AAAA,MAAqDC,SAArD,0CAAmEV,KAAnE;;AAEA,MACEW,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,aAAzB,IACA,CAACN,MADD,IAEAE,SAAS,GAAGK,0BAAUC,YAHxB,EAIE;AACAjB,IAAAA,IAAI,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Epic/Epic.tsx"],"names":["warn","Epic","props","platform","scroll","React","useRef","current","activeStory","tabbar","children","viewWidth","restProps","process","env","NODE_ENV","ViewWidth","SMALL_TABLET","story","Children","toArray","find","isValidElement","value"],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;AAcA,IAAMA,IAAI,GAAG,wBAAS,MAAT,CAAb;;AAEO,IAAMC,IAAsD,GAAG,SAAzDA,IAAyD,CACpEC,KADoE,EAEjE;AAAA;;AACH,MAAMC,QAAQ,GAAG,+BAAjB;AACA,MAAMC,MAAM,GAAGC,KAAK,CAACC,MAAN,CAAwC,EAAxC,EAA4CC,OAA3D;AACA,MAAQC,WAAR,GAAmEN,KAAnE,CAAQM,WAAR;AAAA,MAAqBC,MAArB,GAAmEP,KAAnE,CAAqBO,MAArB;AAAA,MAA6BC,QAA7B,GAAmER,KAAnE,CAA6BQ,QAA7B;AAAA,MAAuCC,SAAvC,GAAmET,KAAnE,CAAuCS,SAAvC;AAAA,MAAqDC,SAArD,0CAAmEV,KAAnE;;AAEA,MACEW,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,aAAzB,IACA,CAACN,MADD,IAEAE,SAAS,GAAGK,0BAAUC,YAHxB,EAIE;AACAjB,IAAAA,IAAI,qUACsEgB,0BAAUC,YADhF,QAAJ;AAGD;;AACD,MAAMC,KAAK,WACRb,KAAK,CAACc,QAAN,CAAeC,OAAf,CAAuBV,QAAvB,EAAiCW,IAAjC,CACC,UAACH,KAAD;AAAA,WACE,aAAAb,KAAK,CAACiB,cAAN,CAAqBJ,KAArB,KACA,wBAASA,KAAK,CAAChB,KAAf,EAAsBF,IAAtB,MAAgCQ,WAFlC;AAAA,GADD,CADQ,uCAK+B,IAL1C;AAOA,SACE,uEAASI,SAAT;AAAoB,IAAA,SAAS,EAAE,gCAAa,MAAb,EAAqBT,QAArB;AAA/B,MACE,qCAAC,wBAAD;AACE,IAAA,GAAG,EAAEK,WADP;AAEE,IAAA,aAAa,EAAEJ,MAAM,CAACI,WAAD,CAAN,IAAuB,CAFxC;AAGE,IAAA,UAAU,EAAE,oBAACe,KAAD;AAAA,aAAYnB,MAAM,CAACI,WAAD,CAAN,GAAsBe,KAAlC;AAAA;AAHd,KAKGL,KALH,CADF,EAQGT,MARH,CADF;AAYD,CAnCM,C,CAqCP;;;;;eACe,oCAAeR,IAAf,EAAqB;AAClCU,EAAAA,SAAS,EAAE;AADuB,CAArB,C","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { withAdaptivity, ViewWidth } from \"../../hoc/withAdaptivity\";\nimport { ScrollSaver } from \"./ScrollSaver\";\nimport { getNavId } from \"../../lib/getNavId\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport {\n AdaptivityContextInterface,\n AdaptivityProps,\n} from \"../AdaptivityProvider/AdaptivityContext\";\nimport \"./Epic.css\";\n\nexport interface EpicProps\n extends React.HTMLAttributes<HTMLDivElement>,\n AdaptivityProps {\n tabbar?: React.ReactNode;\n activeStory: string;\n}\n\nconst warn = warnOnce(\"Epic\");\n\nexport const Epic: React.FC<EpicProps & AdaptivityContextInterface> = (\n props\n) => {\n const platform = usePlatform();\n const scroll = React.useRef<{ [key: string]: number }>({}).current;\n const { activeStory, tabbar, children, viewWidth, ...restProps } = props;\n\n if (\n process.env.NODE_ENV === \"development\" &&\n !tabbar &&\n viewWidth < ViewWidth.SMALL_TABLET\n ) {\n warn(\n `Не рекомендуется использовать Epic без Tabbar при ширине окна меньше ${ViewWidth.SMALL_TABLET}px`\n );\n }\n const story =\n (React.Children.toArray(children).find(\n (story) =>\n React.isValidElement(story) &&\n getNavId(story.props, warn) === activeStory\n ) as React.ReactElement | undefined) ?? null;\n\n return (\n <div {...restProps} vkuiClass={getClassName(\"Epic\", platform)}>\n <ScrollSaver\n key={activeStory}\n initialScroll={scroll[activeStory] || 0}\n saveScroll={(value) => (scroll[activeStory] = value)}\n >\n {story}\n </ScrollSaver>\n {tabbar}\n </div>\n );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default withAdaptivity(Epic, {\n viewWidth: true,\n});\n"],"file":"Epic.js"}
|
|
@@ -3,7 +3,21 @@ import { HasComponent, HasRootRef } from "../../types";
|
|
|
3
3
|
import "./FormField.css";
|
|
4
4
|
export interface FormFieldProps {
|
|
5
5
|
/**
|
|
6
|
-
*
|
|
6
|
+
* Добавляет иконку слева.
|
|
7
|
+
*
|
|
8
|
+
* Рекомендации:
|
|
9
|
+
*
|
|
10
|
+
* - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.
|
|
11
|
+
* - Используйте [IconButton](#/IconButton), если вам нужна кликабельная иконка.
|
|
12
|
+
*/
|
|
13
|
+
before?: React.ReactNode;
|
|
14
|
+
/**
|
|
15
|
+
* Добавляет иконку справа.
|
|
16
|
+
*
|
|
17
|
+
* Рекомендации:
|
|
18
|
+
*
|
|
19
|
+
* - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.
|
|
20
|
+
* - Используйте [IconButton](#/IconButton), если вам нужна кликабельная иконка.
|
|
7
21
|
*/
|
|
8
22
|
after?: React.ReactNode;
|
|
9
23
|
}
|
|
@@ -29,13 +29,14 @@ var _utils = require("../../lib/utils");
|
|
|
29
29
|
|
|
30
30
|
var _useAdaptivity2 = require("../../hooks/useAdaptivity");
|
|
31
31
|
|
|
32
|
-
var _excluded = ["Component", "children", "getRootRef", "after", "disabled"];
|
|
32
|
+
var _excluded = ["Component", "children", "getRootRef", "before", "after", "disabled"];
|
|
33
33
|
|
|
34
34
|
var FormField = function FormField(_ref) {
|
|
35
35
|
var _ref$Component = _ref.Component,
|
|
36
36
|
Component = _ref$Component === void 0 ? "div" : _ref$Component,
|
|
37
37
|
children = _ref.children,
|
|
38
38
|
getRootRef = _ref.getRootRef,
|
|
39
|
+
before = _ref.before,
|
|
39
40
|
after = _ref.after,
|
|
40
41
|
disabled = _ref.disabled,
|
|
41
42
|
restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
@@ -66,7 +67,10 @@ var FormField = function FormField(_ref) {
|
|
|
66
67
|
onMouseEnter: handleMouseEnter,
|
|
67
68
|
onMouseLeave: handleMouseLeave,
|
|
68
69
|
vkuiClass: (0, _classNames.classNames)((0, _getClassName.getClassName)("FormField", platform), "FormField--sizeY-".concat(sizeY), disabled && "FormField--disabled")
|
|
69
|
-
}),
|
|
70
|
+
}), (0, _utils.hasReactNode)(before) && (0, _jsxRuntime.createScopedElement)("div", {
|
|
71
|
+
role: "presentation",
|
|
72
|
+
vkuiClass: "FormField__before"
|
|
73
|
+
}, before), children, (0, _utils.hasReactNode)(after) && (0, _jsxRuntime.createScopedElement)("div", {
|
|
70
74
|
role: "presentation",
|
|
71
75
|
vkuiClass: "FormField__after"
|
|
72
76
|
}, after), (0, _jsxRuntime.createScopedElement)("div", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/FormField/FormField.tsx"],"names":["FormField","Component","children","getRootRef","after","disabled","restProps","platform","sizeY","React","useState","hover","setHover","handleMouseEnter","e","stopPropagation","handleMouseLeave"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;AACA;;;;
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/FormField/FormField.tsx"],"names":["FormField","Component","children","getRootRef","before","after","disabled","restProps","platform","sizeY","React","useState","hover","setHover","handleMouseEnter","e","stopPropagation","handleMouseLeave"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;AACA;;;;AAgCO,IAAMA,SAAsC,GAAG,SAAzCA,SAAyC,OAQ7B;AAAA,4BAPvBC,SAOuB;AAAA,MAPvBA,SAOuB,+BAPX,KAOW;AAAA,MANvBC,QAMuB,QANvBA,QAMuB;AAAA,MALvBC,UAKuB,QALvBA,UAKuB;AAAA,MAJvBC,MAIuB,QAJvBA,MAIuB;AAAA,MAHvBC,KAGuB,QAHvBA,KAGuB;AAAA,MAFvBC,QAEuB,QAFvBA,QAEuB;AAAA,MADpBC,SACoB;AACvB,MAAMC,QAAQ,GAAG,+BAAjB;;AACA,uBAAkB,oCAAlB;AAAA,MAAQC,KAAR,kBAAQA,KAAR;;AACA,wBAA0BC,KAAK,CAACC,QAAN,CAAe,KAAf,CAA1B;AAAA;AAAA,MAAOC,KAAP;AAAA,MAAcC,QAAd;;AAEA,MAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,CAAD,EAAmB;AAC1CA,IAAAA,CAAC,CAACC,eAAF;AACAH,IAAAA,QAAQ,CAAC,IAAD,CAAR;AACD,GAHD;;AAKA,MAAMI,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACF,CAAD,EAAmB;AAC1CA,IAAAA,CAAC,CAACC,eAAF;AACAH,IAAAA,QAAQ,CAAC,KAAD,CAAR;AACD,GAHD;;AAKA,SACE,qCAAC,SAAD;AACE,IAAA,IAAI,EAAC;AADP,KAEMN,SAFN;AAGE,IAAA,GAAG,EAAEJ,UAHP;AAIE,IAAA,YAAY,EAAEW,gBAJhB;AAKE,IAAA,YAAY,EAAEG,gBALhB;AAME,IAAA,SAAS,EAAE,4BACT,gCAAa,WAAb,EAA0BT,QAA1B,CADS,6BAEWC,KAFX,GAGTH,QAAQ,IAAI,qBAHH;AANb,MAYG,yBAAaF,MAAb,KACC;AAAK,IAAA,IAAI,EAAC,cAAV;AAAyB,IAAA,SAAS,EAAC;AAAnC,KACGA,MADH,CAbJ,EAiBGF,QAjBH,EAkBG,yBAAaG,KAAb,KACC;AAAK,IAAA,IAAI,EAAC,cAAV;AAAyB,IAAA,SAAS,EAAC;AAAnC,KACGA,KADH,CAnBJ,EAuBE;AACE,IAAA,IAAI,EAAC,cADP;AAEE,IAAA,SAAS,EAAE,4BACT,mBADS,EAET,CAACC,QAAD,IAAaM,KAAb,IAAsB,0BAFb;AAFb,IAvBF,CADF;AAiCD,CAxDM","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { HasComponent, HasRootRef } from \"../../types\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport \"./FormField.css\";\n\nexport interface FormFieldProps {\n /**\n * Добавляет иконку слева.\n *\n * Рекомендации:\n *\n * - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.\n * - Используйте [IconButton](#/IconButton), если вам нужна кликабельная иконка.\n */\n before?: React.ReactNode;\n /**\n * Добавляет иконку справа.\n *\n * Рекомендации:\n *\n * - Используйте следующие размеры иконок `12` | `16` | `20` | `24` | `28`.\n * - Используйте [IconButton](#/IconButton), если вам нужна кликабельная иконка.\n */\n after?: React.ReactNode;\n}\n\ninterface FormFieldOwnProps\n extends React.AllHTMLAttributes<HTMLElement>,\n HasRootRef<HTMLElement>,\n HasComponent,\n FormFieldProps {\n disabled?: boolean;\n}\n\nexport const FormField: React.FC<FormFieldOwnProps> = ({\n Component = \"div\",\n children,\n getRootRef,\n before,\n after,\n disabled,\n ...restProps\n}: FormFieldOwnProps) => {\n const platform = usePlatform();\n const { sizeY } = useAdaptivity();\n const [hover, setHover] = React.useState(false);\n\n const handleMouseEnter = (e: MouseEvent) => {\n e.stopPropagation();\n setHover(true);\n };\n\n const handleMouseLeave = (e: MouseEvent) => {\n e.stopPropagation();\n setHover(false);\n };\n\n return (\n <Component\n role=\"presentation\"\n {...restProps}\n ref={getRootRef}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n vkuiClass={classNames(\n getClassName(\"FormField\", platform),\n `FormField--sizeY-${sizeY}`,\n disabled && \"FormField--disabled\"\n )}\n >\n {hasReactNode(before) && (\n <div role=\"presentation\" vkuiClass=\"FormField__before\">\n {before}\n </div>\n )}\n {children}\n {hasReactNode(after) && (\n <div role=\"presentation\" vkuiClass=\"FormField__after\">\n {after}\n </div>\n )}\n <div\n role=\"presentation\"\n vkuiClass={classNames(\n \"FormField__border\",\n !disabled && hover && \"FormField__border--hover\"\n )}\n />\n </Component>\n );\n};\n"],"file":"FormField.js"}
|
|
@@ -41,6 +41,15 @@ var _excluded = ["children", "getScrollToLeft", "getScrollToRight", "showArrows"
|
|
|
41
41
|
function now() {
|
|
42
42
|
return performance && performance.now ? performance.now() : Date.now();
|
|
43
43
|
}
|
|
44
|
+
/**
|
|
45
|
+
* Округляем el.scrollLeft
|
|
46
|
+
* https://github.com/VKCOM/VKUI/pull/2445
|
|
47
|
+
*/
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
var roundUpElementScrollLeft = function roundUpElementScrollLeft(el) {
|
|
51
|
+
return Math.ceil(el.scrollLeft);
|
|
52
|
+
};
|
|
44
53
|
/**
|
|
45
54
|
* Код анимации скрола, на основе полифила: https://github.com/iamdustan/smoothscroll
|
|
46
55
|
* Константа взята из полифила (468), на дизайн-ревью уточнили до 250
|
|
@@ -70,7 +79,7 @@ function doScroll(_ref) {
|
|
|
70
79
|
|
|
71
80
|
|
|
72
81
|
var maxLeft = initialScrollWidth - scrollElement.offsetWidth;
|
|
73
|
-
var startLeft = scrollElement
|
|
82
|
+
var startLeft = roundUpElementScrollLeft(scrollElement);
|
|
74
83
|
var endLeft = getScrollPosition(startLeft);
|
|
75
84
|
onScrollStart();
|
|
76
85
|
|
|
@@ -93,7 +102,7 @@ function doScroll(_ref) {
|
|
|
93
102
|
var currentLeft = startLeft + (endLeft - startLeft) * value;
|
|
94
103
|
scrollElement.scrollLeft = Math.ceil(currentLeft);
|
|
95
104
|
|
|
96
|
-
if (scrollElement
|
|
105
|
+
if (roundUpElementScrollLeft(scrollElement) !== Math.max(0, endLeft)) {
|
|
97
106
|
requestAnimationFrame(scroll);
|
|
98
107
|
return;
|
|
99
108
|
}
|
|
@@ -175,7 +184,7 @@ var HorizontalScrollComponent = function HorizontalScrollComponent(_ref2) {
|
|
|
175
184
|
if (showArrows && hasMouse && scrollerRef.current && !isCustomScrollingRef.current) {
|
|
176
185
|
var scrollElement = scrollerRef.current;
|
|
177
186
|
setCanScrollLeft(scrollElement.scrollLeft > 0);
|
|
178
|
-
setCanScrollRight(scrollElement
|
|
187
|
+
setCanScrollRight(roundUpElementScrollLeft(scrollElement) + scrollElement.offsetWidth < scrollElement.scrollWidth);
|
|
179
188
|
}
|
|
180
189
|
}, [hasMouse, scrollerRef, showArrows]);
|
|
181
190
|
var scrollEvent = (0, _useEventListener.useEventListener)("scroll", onscroll);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"names":["now","performance","Date","SCROLL_ONE_FRAME_TIME","doScroll","scrollElement","getScrollPosition","animationQueue","onScrollToRightBorder","onScrollEnd","onScrollStart","initialScrollWidth","scrollAnimationDuration","maxLeft","offsetWidth","startLeft","scrollLeft","endLeft","startTime","scroll","time","elapsed","Math","min","value","currentLeft","ceil","max","requestAnimationFrame","shift","length","HorizontalScrollComponent","children","getScrollToLeft","getScrollToRight","showArrows","hasMouse","getRef","restProps","React","useState","canScrollLeft","setCanScrollLeft","canScrollRight","setCanScrollRight","isCustomScrollingRef","useRef","scrollerRef","scrollTo","useCallback","current","push","firstElementChild","scrollWidth","scrollToLeft","i","scrollToRight","onscroll","scrollEvent","useEffect","add","HorizontalScroll"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { withAdaptivity, AdaptivityProps } from \"../../hoc/withAdaptivity\";\nimport HorizontalScrollArrow from \"./HorizontalScrollArrow\";\nimport { easeInOutSine } from \"../../lib/fx\";\nimport { useEventListener } from \"../../hooks/useEventListener\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { HasRef } from \"../../types\";\nimport { classNames } from \"../../lib/classNames\";\nimport \"./HorizontalScroll.css\";\n\ninterface ScrollContext {\n scrollElement: HTMLElement | null;\n scrollAnimationDuration: number;\n animationQueue: VoidFunction[];\n getScrollPosition: (currentPosition: number) => number;\n onScrollToRightBorder: VoidFunction;\n onScrollEnd: VoidFunction;\n onScrollStart: VoidFunction;\n /**\n * Начальная ширина прокрутки.\n * В некоторых случаях может отличаться от текущей ширины прокрутки из-за transforms: translate\n */\n initialScrollWidth: number;\n}\n\nexport type ScrollPositionHandler = (currentPosition: number) => number;\n\nexport interface HorizontalScrollProps\n extends React.HTMLAttributes<HTMLDivElement>,\n AdaptivityProps,\n HasRef<HTMLDivElement> {\n /**\n * Функция для расчета величины прокрутки при клике на левую стрелку.\n */\n getScrollToLeft?: ScrollPositionHandler;\n /**\n * Функция для расчета величины прокрутки при клике на правую стрелку.\n */\n getScrollToRight?: ScrollPositionHandler;\n showArrows?: boolean | \"always\";\n scrollAnimationDuration?: number;\n}\n\n/**\n * timing method\n */\nfunction now() {\n return performance && performance.now ? performance.now() : Date.now();\n}\n\n/**\n * Код анимации скрола, на основе полифила: https://github.com/iamdustan/smoothscroll\n * Константа взята из полифила (468), на дизайн-ревью уточнили до 250\n * @var {number} SCROLL_ONE_FRAME_TIME время анимации скролла\n */\nconst SCROLL_ONE_FRAME_TIME = 250;\n\nfunction doScroll({\n scrollElement,\n getScrollPosition,\n animationQueue,\n onScrollToRightBorder,\n onScrollEnd,\n onScrollStart,\n initialScrollWidth,\n scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n}: ScrollContext) {\n if (!scrollElement || !getScrollPosition) {\n return;\n }\n\n /**\n * максимальное значение сдвига влево\n */\n const maxLeft = initialScrollWidth - scrollElement.offsetWidth;\n\n let startLeft = scrollElement.scrollLeft;\n let endLeft = getScrollPosition(startLeft);\n\n onScrollStart();\n\n if (endLeft >= maxLeft) {\n onScrollToRightBorder();\n endLeft = maxLeft;\n }\n\n const startTime = now();\n\n (function scroll() {\n if (!scrollElement) {\n onScrollEnd();\n return;\n }\n\n const time = now();\n const elapsed = Math.min((time - startTime) / scrollAnimationDuration, 1);\n\n const value = easeInOutSine(elapsed);\n\n const currentLeft = startLeft + (endLeft - startLeft) * value;\n scrollElement.scrollLeft = Math.ceil(currentLeft);\n\n if (scrollElement.scrollLeft !== Math.max(0, endLeft)) {\n requestAnimationFrame(scroll);\n return;\n }\n\n onScrollEnd();\n animationQueue.shift();\n if (animationQueue.length > 0) {\n animationQueue[0]();\n }\n })();\n}\n\nconst HorizontalScrollComponent: React.FC<HorizontalScrollProps> = ({\n children,\n getScrollToLeft,\n getScrollToRight,\n showArrows = true,\n scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n hasMouse,\n getRef,\n ...restProps\n}) => {\n const [canScrollLeft, setCanScrollLeft] = React.useState(false);\n const [canScrollRight, setCanScrollRight] = React.useState(false);\n\n const isCustomScrollingRef = React.useRef(false);\n\n const scrollerRef = useExternRef(getRef);\n\n const animationQueue = React.useRef<VoidFunction[]>([]);\n\n const scrollTo = React.useCallback(\n (getScrollPosition: ScrollPositionHandler) => {\n const scrollElement = scrollerRef.current;\n\n animationQueue.current.push(() =>\n doScroll({\n scrollElement,\n getScrollPosition,\n animationQueue: animationQueue.current,\n onScrollToRightBorder: () => setCanScrollRight(false),\n onScrollEnd: () => (isCustomScrollingRef.current = false),\n onScrollStart: () => (isCustomScrollingRef.current = true),\n initialScrollWidth:\n scrollElement?.firstElementChild?.scrollWidth || 0,\n scrollAnimationDuration,\n })\n );\n if (animationQueue.current.length === 1) {\n animationQueue.current[0]();\n }\n },\n [scrollAnimationDuration, scrollerRef]\n );\n\n const scrollToLeft = React.useCallback(() => {\n const getScrollPosition =\n getScrollToLeft ?? ((i: number) => i - scrollerRef.current!.offsetWidth);\n scrollTo(getScrollPosition);\n }, [getScrollToLeft, scrollTo, scrollerRef]);\n\n const scrollToRight = React.useCallback(() => {\n const getScrollPosition =\n getScrollToRight ?? ((i: number) => i + scrollerRef.current!.offsetWidth);\n scrollTo(getScrollPosition);\n }, [getScrollToRight, scrollTo, scrollerRef]);\n\n const onscroll = React.useCallback(() => {\n if (\n showArrows &&\n hasMouse &&\n scrollerRef.current &&\n !isCustomScrollingRef.current\n ) {\n const scrollElement = scrollerRef.current;\n\n setCanScrollLeft(scrollElement.scrollLeft > 0);\n setCanScrollRight(\n scrollElement.scrollLeft + scrollElement.offsetWidth <\n scrollElement.scrollWidth\n );\n }\n }, [hasMouse, scrollerRef, showArrows]);\n\n const scrollEvent = useEventListener(\"scroll\", onscroll);\n React.useEffect(() => {\n if (scrollerRef.current) {\n scrollEvent.add(scrollerRef.current);\n }\n }, [scrollEvent, scrollerRef]);\n React.useEffect(onscroll, [scrollerRef, children, onscroll]);\n\n return (\n <div\n {...restProps}\n // eslint-disable-next-line vkui/no-object-expression-in-arguments\n vkuiClass={classNames(\"HorizontalScroll\", {\n [\"HorizontalScroll--withConstArrows\"]: showArrows === \"always\",\n })}\n >\n {showArrows && hasMouse && canScrollLeft && (\n <HorizontalScrollArrow direction=\"left\" onClick={scrollToLeft} />\n )}\n {showArrows && hasMouse && canScrollRight && (\n <HorizontalScrollArrow direction=\"right\" onClick={scrollToRight} />\n )}\n <div vkuiClass=\"HorizontalScroll__in\" ref={scrollerRef}>\n <div vkuiClass=\"HorizontalScroll__in-wrapper\">{children}</div>\n </div>\n </div>\n );\n};\n\nexport const HorizontalScroll = withAdaptivity(HorizontalScrollComponent, {\n hasMouse: true,\n});\n"],"file":"HorizontalScroll.js"}
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/HorizontalScroll/HorizontalScroll.tsx"],"names":["now","performance","Date","roundUpElementScrollLeft","el","Math","ceil","scrollLeft","SCROLL_ONE_FRAME_TIME","doScroll","scrollElement","getScrollPosition","animationQueue","onScrollToRightBorder","onScrollEnd","onScrollStart","initialScrollWidth","scrollAnimationDuration","maxLeft","offsetWidth","startLeft","endLeft","startTime","scroll","time","elapsed","min","value","currentLeft","max","requestAnimationFrame","shift","length","HorizontalScrollComponent","children","getScrollToLeft","getScrollToRight","showArrows","hasMouse","getRef","restProps","React","useState","canScrollLeft","setCanScrollLeft","canScrollRight","setCanScrollRight","isCustomScrollingRef","useRef","scrollerRef","scrollTo","useCallback","current","push","firstElementChild","scrollWidth","scrollToLeft","i","scrollToRight","onscroll","scrollEvent","useEffect","add","HorizontalScroll"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { withAdaptivity, AdaptivityProps } from \"../../hoc/withAdaptivity\";\nimport HorizontalScrollArrow from \"./HorizontalScrollArrow\";\nimport { easeInOutSine } from \"../../lib/fx\";\nimport { useEventListener } from \"../../hooks/useEventListener\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { HasRef } from \"../../types\";\nimport { classNames } from \"../../lib/classNames\";\nimport \"./HorizontalScroll.css\";\n\ninterface ScrollContext {\n scrollElement: HTMLElement | null;\n scrollAnimationDuration: number;\n animationQueue: VoidFunction[];\n getScrollPosition: (currentPosition: number) => number;\n onScrollToRightBorder: VoidFunction;\n onScrollEnd: VoidFunction;\n onScrollStart: VoidFunction;\n /**\n * Начальная ширина прокрутки.\n * В некоторых случаях может отличаться от текущей ширины прокрутки из-за transforms: translate\n */\n initialScrollWidth: number;\n}\n\nexport type ScrollPositionHandler = (currentPosition: number) => number;\n\nexport interface HorizontalScrollProps\n extends React.HTMLAttributes<HTMLDivElement>,\n AdaptivityProps,\n HasRef<HTMLDivElement> {\n /**\n * Функция для расчета величины прокрутки при клике на левую стрелку.\n */\n getScrollToLeft?: ScrollPositionHandler;\n /**\n * Функция для расчета величины прокрутки при клике на правую стрелку.\n */\n getScrollToRight?: ScrollPositionHandler;\n showArrows?: boolean | \"always\";\n scrollAnimationDuration?: number;\n}\n\n/**\n * timing method\n */\nfunction now() {\n return performance && performance.now ? performance.now() : Date.now();\n}\n\n/**\n * Округляем el.scrollLeft\n * https://github.com/VKCOM/VKUI/pull/2445\n */\nconst roundUpElementScrollLeft = (el: HTMLElement) => Math.ceil(el.scrollLeft);\n\n/**\n * Код анимации скрола, на основе полифила: https://github.com/iamdustan/smoothscroll\n * Константа взята из полифила (468), на дизайн-ревью уточнили до 250\n * @var {number} SCROLL_ONE_FRAME_TIME время анимации скролла\n */\nconst SCROLL_ONE_FRAME_TIME = 250;\n\nfunction doScroll({\n scrollElement,\n getScrollPosition,\n animationQueue,\n onScrollToRightBorder,\n onScrollEnd,\n onScrollStart,\n initialScrollWidth,\n scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n}: ScrollContext) {\n if (!scrollElement || !getScrollPosition) {\n return;\n }\n\n /**\n * максимальное значение сдвига влево\n */\n const maxLeft = initialScrollWidth - scrollElement.offsetWidth;\n\n let startLeft = roundUpElementScrollLeft(scrollElement);\n let endLeft = getScrollPosition(startLeft);\n\n onScrollStart();\n\n if (endLeft >= maxLeft) {\n onScrollToRightBorder();\n endLeft = maxLeft;\n }\n\n const startTime = now();\n\n (function scroll() {\n if (!scrollElement) {\n onScrollEnd();\n return;\n }\n\n const time = now();\n const elapsed = Math.min((time - startTime) / scrollAnimationDuration, 1);\n\n const value = easeInOutSine(elapsed);\n\n const currentLeft = startLeft + (endLeft - startLeft) * value;\n scrollElement.scrollLeft = Math.ceil(currentLeft);\n\n if (roundUpElementScrollLeft(scrollElement) !== Math.max(0, endLeft)) {\n requestAnimationFrame(scroll);\n return;\n }\n\n onScrollEnd();\n animationQueue.shift();\n if (animationQueue.length > 0) {\n animationQueue[0]();\n }\n })();\n}\n\nconst HorizontalScrollComponent: React.FC<HorizontalScrollProps> = ({\n children,\n getScrollToLeft,\n getScrollToRight,\n showArrows = true,\n scrollAnimationDuration = SCROLL_ONE_FRAME_TIME,\n hasMouse,\n getRef,\n ...restProps\n}) => {\n const [canScrollLeft, setCanScrollLeft] = React.useState(false);\n const [canScrollRight, setCanScrollRight] = React.useState(false);\n\n const isCustomScrollingRef = React.useRef(false);\n\n const scrollerRef = useExternRef(getRef);\n\n const animationQueue = React.useRef<VoidFunction[]>([]);\n\n const scrollTo = React.useCallback(\n (getScrollPosition: ScrollPositionHandler) => {\n const scrollElement = scrollerRef.current;\n\n animationQueue.current.push(() =>\n doScroll({\n scrollElement,\n getScrollPosition,\n animationQueue: animationQueue.current,\n onScrollToRightBorder: () => setCanScrollRight(false),\n onScrollEnd: () => (isCustomScrollingRef.current = false),\n onScrollStart: () => (isCustomScrollingRef.current = true),\n initialScrollWidth:\n scrollElement?.firstElementChild?.scrollWidth || 0,\n scrollAnimationDuration,\n })\n );\n if (animationQueue.current.length === 1) {\n animationQueue.current[0]();\n }\n },\n [scrollAnimationDuration, scrollerRef]\n );\n\n const scrollToLeft = React.useCallback(() => {\n const getScrollPosition =\n getScrollToLeft ?? ((i: number) => i - scrollerRef.current!.offsetWidth);\n scrollTo(getScrollPosition);\n }, [getScrollToLeft, scrollTo, scrollerRef]);\n\n const scrollToRight = React.useCallback(() => {\n const getScrollPosition =\n getScrollToRight ?? ((i: number) => i + scrollerRef.current!.offsetWidth);\n scrollTo(getScrollPosition);\n }, [getScrollToRight, scrollTo, scrollerRef]);\n\n const onscroll = React.useCallback(() => {\n if (\n showArrows &&\n hasMouse &&\n scrollerRef.current &&\n !isCustomScrollingRef.current\n ) {\n const scrollElement = scrollerRef.current;\n\n setCanScrollLeft(scrollElement.scrollLeft > 0);\n setCanScrollRight(\n roundUpElementScrollLeft(scrollElement) + scrollElement.offsetWidth <\n scrollElement.scrollWidth\n );\n }\n }, [hasMouse, scrollerRef, showArrows]);\n\n const scrollEvent = useEventListener(\"scroll\", onscroll);\n React.useEffect(() => {\n if (scrollerRef.current) {\n scrollEvent.add(scrollerRef.current);\n }\n }, [scrollEvent, scrollerRef]);\n React.useEffect(onscroll, [scrollerRef, children, onscroll]);\n\n return (\n <div\n {...restProps}\n // eslint-disable-next-line vkui/no-object-expression-in-arguments\n vkuiClass={classNames(\"HorizontalScroll\", {\n [\"HorizontalScroll--withConstArrows\"]: showArrows === \"always\",\n })}\n >\n {showArrows && hasMouse && canScrollLeft && (\n <HorizontalScrollArrow direction=\"left\" onClick={scrollToLeft} />\n )}\n {showArrows && hasMouse && canScrollRight && (\n <HorizontalScrollArrow direction=\"right\" onClick={scrollToRight} />\n )}\n <div vkuiClass=\"HorizontalScroll__in\" ref={scrollerRef}>\n <div vkuiClass=\"HorizontalScroll__in-wrapper\">{children}</div>\n </div>\n </div>\n );\n};\n\nexport const HorizontalScroll = withAdaptivity(HorizontalScrollComponent, {\n hasMouse: true,\n});\n"],"file":"HorizontalScroll.js"}
|
|
@@ -5,4 +5,4 @@ import { AdaptivityProps } from "../../hoc/withAdaptivity";
|
|
|
5
5
|
import "./Input.css";
|
|
6
6
|
export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>, HasRef<HTMLInputElement>, HasRootRef<HTMLDivElement>, HasAlign, AdaptivityProps, FormFieldProps {
|
|
7
7
|
}
|
|
8
|
-
export declare const Input: React.FC<Pick<InputProps, "max" | "required" | "disabled" | "hidden" | "dir" | "form" | "slot" | "style" | "title" | "pattern" | "color" | "size" | "after" | "multiple" | "height" | "translate" | "width" | "prefix" | "src" | "children" | "className" | "id" | "lang" | "min" | "name" | "type" | "role" | "tabIndex" | "crossOrigin" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "list" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "value" | "alt" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "autoComplete" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "step" | "align" | "getRootRef" | "getRef"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
|
|
8
|
+
export declare const Input: React.FC<Pick<InputProps, "max" | "required" | "disabled" | "hidden" | "dir" | "form" | "slot" | "style" | "title" | "pattern" | "color" | "size" | "after" | "multiple" | "height" | "translate" | "width" | "prefix" | "src" | "children" | "className" | "id" | "lang" | "min" | "name" | "type" | "role" | "tabIndex" | "crossOrigin" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "list" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "value" | "alt" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "autoComplete" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "step" | "align" | "getRootRef" | "getRef" | "before"> & import("../AdaptivityProvider/AdaptivityContext").SizeProps>;
|
|
@@ -23,7 +23,7 @@ var _withAdaptivity = require("../../hoc/withAdaptivity");
|
|
|
23
23
|
|
|
24
24
|
var _usePlatform = require("../../hooks/usePlatform");
|
|
25
25
|
|
|
26
|
-
var _excluded = ["type", "align", "getRef", "className", "getRootRef", "sizeY", "style", "after"];
|
|
26
|
+
var _excluded = ["type", "align", "getRef", "className", "getRootRef", "sizeY", "style", "before", "after"];
|
|
27
27
|
|
|
28
28
|
var InputComponent = function InputComponent(_ref) {
|
|
29
29
|
var _ref$type = _ref.type,
|
|
@@ -34,6 +34,7 @@ var InputComponent = function InputComponent(_ref) {
|
|
|
34
34
|
getRootRef = _ref.getRootRef,
|
|
35
35
|
sizeY = _ref.sizeY,
|
|
36
36
|
style = _ref.style,
|
|
37
|
+
before = _ref.before,
|
|
37
38
|
after = _ref.after,
|
|
38
39
|
restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
39
40
|
var platform = (0, _usePlatform.usePlatform)();
|
|
@@ -42,6 +43,7 @@ var InputComponent = function InputComponent(_ref) {
|
|
|
42
43
|
style: style,
|
|
43
44
|
className: className,
|
|
44
45
|
getRootRef: getRootRef,
|
|
46
|
+
before: before,
|
|
45
47
|
after: after,
|
|
46
48
|
disabled: restProps.disabled
|
|
47
49
|
}, (0, _jsxRuntime.createScopedElement)("input", (0, _extends2.default)({}, restProps, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Input/Input.tsx"],"names":["InputComponent","type","align","getRef","className","getRootRef","sizeY","style","after","restProps","platform","disabled","Input"],"mappings":";;;;;;;;;;;;;;;AACA;;AACA;;AACA;;AAEA;;AACA;;;;AAWA,IAAMA,cAAmD,GAAG,SAAtDA,cAAsD,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Input/Input.tsx"],"names":["InputComponent","type","align","getRef","className","getRootRef","sizeY","style","before","after","restProps","platform","disabled","Input"],"mappings":";;;;;;;;;;;;;;;AACA;;AACA;;AACA;;AAEA;;AACA;;;;AAWA,IAAMA,cAAmD,GAAG,SAAtDA,cAAsD,OAW1C;AAAA,uBAVhBC,IAUgB;AAAA,MAVhBA,IAUgB,0BAVT,MAUS;AAAA,MAThBC,KASgB,QAThBA,KASgB;AAAA,MARhBC,MAQgB,QARhBA,MAQgB;AAAA,MAPhBC,SAOgB,QAPhBA,SAOgB;AAAA,MANhBC,UAMgB,QANhBA,UAMgB;AAAA,MALhBC,KAKgB,QALhBA,KAKgB;AAAA,MAJhBC,KAIgB,QAJhBA,KAIgB;AAAA,MAHhBC,MAGgB,QAHhBA,MAGgB;AAAA,MAFhBC,KAEgB,QAFhBA,KAEgB;AAAA,MADbC,SACa;AAChB,MAAMC,QAAQ,GAAG,+BAAjB;AACA,SACE,qCAAC,oBAAD;AACE,IAAA,SAAS,EAAE,4BACT,gCAAa,OAAb,EAAsBA,QAAtB,CADS,EAET,CAAC,CAACT,KAAF,qBAAqBA,KAArB,CAFS,yBAGOI,KAHP,EADb;AAME,IAAA,KAAK,EAAEC,KANT;AAOE,IAAA,SAAS,EAAEH,SAPb;AAQE,IAAA,UAAU,EAAEC,UARd;AASE,IAAA,MAAM,EAAEG,MATV;AAUE,IAAA,KAAK,EAAEC,KAVT;AAWE,IAAA,QAAQ,EAAEC,SAAS,CAACE;AAXtB,KAaE,yEAAWF,SAAX;AAAsB,IAAA,IAAI,EAAET,IAA5B;AAAkC,IAAA,SAAS,EAAC,WAA5C;AAAwD,IAAA,GAAG,EAAEE;AAA7D,KAbF,CADF;AAiBD,CA9BD;;AAgCO,IAAMU,KAAK,GAAG,oCAAeb,cAAf,EAA+B;AAClDM,EAAAA,KAAK,EAAE;AAD2C,CAA/B,CAAd","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { FormField, FormFieldProps } from \"../FormField/FormField\";\nimport { HasAlign, HasRef, HasRootRef } from \"../../types\";\nimport { withAdaptivity, AdaptivityProps } from \"../../hoc/withAdaptivity\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport \"./Input.css\";\n\nexport interface InputProps\n extends React.InputHTMLAttributes<HTMLInputElement>,\n HasRef<HTMLInputElement>,\n HasRootRef<HTMLDivElement>,\n HasAlign,\n AdaptivityProps,\n FormFieldProps {}\n\nconst InputComponent: React.FunctionComponent<InputProps> = ({\n type = \"text\",\n align,\n getRef,\n className,\n getRootRef,\n sizeY,\n style,\n before,\n after,\n ...restProps\n}: InputProps) => {\n const platform = usePlatform();\n return (\n <FormField\n vkuiClass={classNames(\n getClassName(\"Input\", platform),\n !!align && `Input--${align}`,\n `Input--sizeY-${sizeY}`\n )}\n style={style}\n className={className}\n getRootRef={getRootRef}\n before={before}\n after={after}\n disabled={restProps.disabled}\n >\n <input {...restProps} type={type} vkuiClass=\"Input__el\" ref={getRef} />\n </FormField>\n );\n};\n\nexport const Input = withAdaptivity(InputComponent, {\n sizeY: true,\n});\n"],"file":"Input.js"}
|
|
@@ -35,6 +35,8 @@ var _warnOnce = require("../../lib/warnOnce");
|
|
|
35
35
|
|
|
36
36
|
var _ModalCardBase = require("../ModalCardBase/ModalCardBase");
|
|
37
37
|
|
|
38
|
+
var _useAdaptivity = require("../../hooks/useAdaptivity");
|
|
39
|
+
|
|
38
40
|
var _excluded = ["icon", "header", "subheader", "children", "actions", "actionsLayout", "onClose", "platform", "viewWidth", "viewHeight", "hasMouse", "nav"];
|
|
39
41
|
var warn = (0, _warnOnce.warnOnce)("ModalCard");
|
|
40
42
|
|
|
@@ -52,7 +54,7 @@ var ModalCard = function ModalCard(props) {
|
|
|
52
54
|
hasMouse = props.hasMouse,
|
|
53
55
|
nav = props.nav,
|
|
54
56
|
restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
|
|
55
|
-
var isDesktop =
|
|
57
|
+
var isDesktop = (0, _useAdaptivity.useAdaptivityIsDesktop)();
|
|
56
58
|
var modalContext = React.useContext(_ModalRootContext.default);
|
|
57
59
|
|
|
58
60
|
var _useModalRegistry = (0, _ModalRootContext.useModalRegistry)((0, _getNavId.getNavId)(props, warn), _types.ModalType.CARD),
|