@ncds/ui-admin 1.7.0 → 1.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/assets/scripts/baseBox.js +54 -56
- package/dist/cjs/assets/scripts/comboBox.js +54 -105
- package/dist/cjs/assets/scripts/datePicker.js +289 -324
- package/dist/cjs/assets/scripts/featuredIcon.js +41 -49
- package/dist/cjs/assets/scripts/fileInput/const/classNames.js +4 -10
- package/dist/cjs/assets/scripts/fileInput/fileInput.js +33 -34
- package/dist/cjs/assets/scripts/fileInput/fileInputModel.js +27 -35
- package/dist/cjs/assets/scripts/fileInput/fileInputView.js +53 -48
- package/dist/cjs/assets/scripts/imageFileInput/ImageFileInput.js +61 -64
- package/dist/cjs/assets/scripts/imageFileInput/ImageFileInputModel.js +79 -112
- package/dist/cjs/assets/scripts/imageFileInput/ImageFileInputView.js +107 -105
- package/dist/cjs/assets/scripts/imageFileInput/const/classNames.js +6 -16
- package/dist/cjs/assets/scripts/index.js +2 -0
- package/dist/cjs/assets/scripts/modal/Modal.js +43 -55
- package/dist/cjs/assets/scripts/modal/ModalActions.js +40 -52
- package/dist/cjs/assets/scripts/modal/ModalContent.js +22 -22
- package/dist/cjs/assets/scripts/modal/ModalHeader.js +37 -48
- package/dist/cjs/assets/scripts/modal/const/classNames.js +5 -13
- package/dist/cjs/assets/scripts/modal/utils/contentUtils.js +1 -1
- package/dist/cjs/assets/scripts/notification/FloatingNotification.js +91 -93
- package/dist/cjs/assets/scripts/notification/FullWidthNotification.js +92 -80
- package/dist/cjs/assets/scripts/notification/MessageNotification.js +92 -79
- package/dist/cjs/assets/scripts/notification/Notification.js +50 -65
- package/dist/cjs/assets/scripts/notification/const/classNames.js +1 -1
- package/dist/cjs/assets/scripts/notification/const/icons.js +11 -25
- package/dist/cjs/assets/scripts/notification/const/sizes.js +11 -19
- package/dist/cjs/assets/scripts/notification/const/types.js +1 -1
- package/dist/cjs/assets/scripts/notification/utils.js +28 -23
- package/dist/cjs/assets/scripts/progress-bar/ProgressBar.js +140 -141
- package/dist/cjs/assets/scripts/selectBox.js +72 -132
- package/dist/cjs/assets/scripts/shared/ButtonCloseX.js +18 -19
- package/dist/cjs/assets/scripts/slider.js +104 -122
- package/dist/cjs/assets/scripts/tab.js +8 -8
- package/dist/cjs/assets/scripts/table/Table.js +377 -0
- package/dist/cjs/assets/scripts/table/const/classNames.js +33 -0
- package/dist/cjs/assets/scripts/table/const/index.js +27 -0
- package/dist/cjs/assets/scripts/table/const/types.js +5 -0
- package/dist/cjs/assets/scripts/table/index.js +43 -0
- package/dist/cjs/assets/scripts/tag/Tag.js +108 -115
- package/dist/cjs/assets/scripts/tag/const/classNames.js +3 -7
- package/dist/cjs/assets/scripts/tag/const/sizes.js +4 -4
- package/dist/cjs/assets/scripts/tooltip/Tooltip.js +155 -182
- package/dist/cjs/assets/scripts/tooltip/TooltipLayerManager.js +23 -25
- package/dist/cjs/assets/scripts/tooltip/const/classNames.js +1 -1
- package/dist/cjs/assets/scripts/tooltip/const/constants.js +14 -14
- package/dist/cjs/assets/scripts/tooltip/const/icons.js +7 -7
- package/dist/cjs/assets/scripts/tooltip/const/templates.js +42 -25
- package/dist/cjs/assets/scripts/tooltip/utils.js +17 -18
- package/dist/cjs/assets/scripts/utils/debounce.js +7 -8
- package/dist/cjs/assets/scripts/utils/unifiedBox/domRenderer.js +102 -116
- package/dist/cjs/assets/scripts/utils/unifiedBox/dropdownModel.js +103 -144
- package/dist/cjs/assets/scripts/utils/unifiedBox/unifiedBoxController.js +180 -207
- package/dist/cjs/assets/scripts/utils/unifiedBox/unifiedBoxManager.js +166 -362
- package/dist/cjs/constant/color.js +1 -1
- package/dist/cjs/index.js +0 -297
- package/dist/cjs/src/components/badge/Badge.js +17 -30
- package/dist/cjs/src/components/badge/index.js +0 -11
- package/dist/cjs/src/components/badge/utils.js +11 -10
- package/dist/cjs/src/components/badge-group/BadgeGroup.js +42 -0
- package/dist/cjs/src/components/badge-group/index.js +16 -0
- package/dist/cjs/src/components/bread-crumb/BreadCrumb.js +55 -0
- package/dist/cjs/src/components/button/Button.js +37 -58
- package/dist/cjs/src/components/button/ButtonCloseX.js +12 -22
- package/dist/cjs/src/components/button/ButtonStepper.js +9 -7
- package/dist/cjs/src/components/button/index.js +0 -11
- package/dist/cjs/src/components/button-group/ButtonGroup.js +97 -0
- package/dist/cjs/src/components/button-group/index.js +16 -0
- package/dist/cjs/src/components/carousel-arrow/CarouselArrow.js +34 -0
- package/dist/cjs/src/components/carousel-arrow/index.js +16 -0
- package/dist/cjs/src/components/carousel-number-group/CarouselNumberGroup.js +33 -0
- package/dist/cjs/src/components/{carousel → carousel-number-group}/index.js +0 -11
- package/dist/cjs/src/components/checkbox/Checkbox.js +28 -49
- package/dist/cjs/src/components/checkbox/CheckboxInput.js +23 -42
- package/dist/cjs/src/components/combo-box/ComboBox.js +290 -0
- package/dist/cjs/src/components/data-grid/DataGrid.js +182 -0
- package/dist/cjs/src/components/data-grid/DataGrid.types.js +5 -0
- package/dist/cjs/src/components/data-grid/index.js +27 -0
- package/dist/cjs/src/components/date-picker/CustomInput.js +16 -32
- package/dist/cjs/src/components/date-picker/DatePicker.js +416 -256
- package/dist/cjs/src/components/date-picker/index.js +0 -22
- package/dist/cjs/src/components/date-picker/utils.js +2 -4
- package/dist/cjs/src/components/divider/Divider.js +14 -25
- package/dist/cjs/src/components/dot/Dot.js +11 -28
- package/dist/cjs/src/components/dropdown/Dropdown.js +90 -132
- package/dist/cjs/src/components/empty-state/EmptyState.js +28 -45
- package/dist/cjs/src/components/featured-icon/FeaturedIcon.js +14 -33
- package/dist/cjs/src/components/file-input/FileInput.js +102 -148
- package/dist/cjs/src/components/horizontal-tab/HorizontalTab.js +53 -0
- package/dist/cjs/src/components/horizontal-tab/index.js +16 -0
- package/dist/cjs/src/components/image-file-input/ImageFileInput.js +109 -170
- package/dist/cjs/src/components/image-file-input/components/ImagePreview.js +8 -17
- package/dist/cjs/src/components/index.js +156 -24
- package/dist/cjs/src/components/input-base/InputBase.js +195 -0
- package/dist/cjs/src/components/input-base/index.js +16 -0
- package/dist/cjs/src/components/modal/Modal.js +76 -105
- package/dist/cjs/src/components/notification/FloatingNotification.js +52 -80
- package/dist/cjs/src/components/notification/FullWidthNotification.js +67 -101
- package/dist/cjs/src/components/notification/MessageNotification.js +60 -89
- package/dist/cjs/src/components/notification/Notification.js +18 -36
- package/dist/cjs/src/components/number-input/NumberInput.js +112 -0
- package/dist/cjs/src/components/number-input/index.js +16 -0
- package/dist/cjs/src/components/pagination/NavButton.js +28 -42
- package/dist/cjs/src/components/pagination/Pagination.js +58 -97
- package/dist/cjs/src/components/password-input/PasswordInput.js +55 -0
- package/dist/cjs/src/components/password-input/index.js +16 -0
- package/dist/cjs/src/components/progress-bar/ProgressBar.js +45 -60
- package/dist/cjs/src/components/progress-bar/components/SegmentBar.js +11 -9
- package/dist/cjs/src/components/progress-bar/components/SegmentLabels.js +32 -43
- package/dist/cjs/src/components/progress-bar/hooks/useProgressBar.js +59 -78
- package/dist/cjs/src/components/progress-bar/utils.js +8 -8
- package/dist/cjs/src/components/progress-circle/ProgressCircle.js +49 -72
- package/dist/cjs/src/components/radio/Radio.js +24 -43
- package/dist/cjs/src/components/radio/RadioInput.js +18 -36
- package/dist/cjs/src/components/range-date-picker/RangeDatePicker.js +147 -0
- package/dist/cjs/src/components/range-date-picker/index.js +16 -0
- package/dist/cjs/src/components/range-date-picker-with-buttons/RangeDatePickerWithButtons.js +81 -0
- package/dist/cjs/src/components/range-date-picker-with-buttons/index.js +16 -0
- package/dist/cjs/src/components/select/Select.js +36 -63
- package/dist/cjs/src/components/select-box/SelectBox.js +260 -0
- package/dist/cjs/src/components/select-dropdown/SelectDropdown.js +64 -100
- package/dist/cjs/src/components/shared/hintText/HintText.js +13 -30
- package/dist/cjs/src/components/shared/label/Label.js +12 -29
- package/dist/cjs/src/components/slider/Slider.js +25 -28
- package/dist/cjs/src/components/spinner/Spinner.js +25 -39
- package/dist/cjs/src/components/switch/Switch.js +44 -69
- package/dist/cjs/src/components/tab/TabButton.js +41 -61
- package/dist/cjs/src/components/tab/index.js +0 -22
- package/dist/cjs/src/components/table/Table.js +269 -0
- package/dist/cjs/src/components/table/index.js +16 -0
- package/dist/cjs/src/components/table/types.js +5 -0
- package/dist/cjs/src/components/tag/Tag.js +65 -85
- package/dist/cjs/src/components/textarea/Textarea.js +79 -0
- package/dist/cjs/src/components/textarea/index.js +16 -0
- package/dist/cjs/src/components/toggle/Toggle.js +28 -52
- package/dist/cjs/src/components/tooltip/Tooltip.js +75 -108
- package/dist/cjs/src/components/vertical-tab/VerticalTab.js +48 -0
- package/dist/cjs/src/components/vertical-tab/index.js +16 -0
- package/dist/cjs/src/constant/breakpoint.js +3 -3
- package/dist/cjs/src/constant/date-picker.js +1 -1
- package/dist/cjs/src/constant/size.js +1 -1
- package/dist/cjs/src/hooks/dropdown/useDropdown.js +58 -60
- package/dist/cjs/src/hooks/dropdown/useDropdownKeyboard.js +37 -40
- package/dist/cjs/src/hooks/dropdown/useDropdownPosition.js +7 -9
- package/dist/cjs/src/hooks/dropdown/useOutsideClick.js +11 -11
- package/dist/cjs/src/hooks/dropdown/useScrollLock.js +23 -19
- package/dist/cjs/src/hooks/dropdown/useWindowResize.js +12 -13
- package/dist/cjs/src/hooks/useCallbackRef.js +2 -2
- package/dist/cjs/src/hooks/useMediaQuery.js +8 -11
- package/dist/cjs/src/hooks/useMergeRefs.js +2 -2
- package/dist/cjs/src/utils/date-picker.js +29 -30
- package/dist/cjs/src/utils/dropdown/dropdownUtils.js +39 -35
- package/dist/cjs/src/utils/dropdown/multiSelect.js +25 -45
- package/dist/esm/assets/scripts/baseBox.js +53 -57
- package/dist/esm/assets/scripts/comboBox.js +54 -107
- package/dist/esm/assets/scripts/datePicker.js +288 -324
- package/dist/esm/assets/scripts/featuredIcon.js +40 -50
- package/dist/esm/assets/scripts/fileInput/const/classNames.js +4 -10
- package/dist/esm/assets/scripts/fileInput/fileInput.js +32 -35
- package/dist/esm/assets/scripts/fileInput/fileInputModel.js +26 -36
- package/dist/esm/assets/scripts/fileInput/fileInputView.js +52 -49
- package/dist/esm/assets/scripts/imageFileInput/ImageFileInput.js +60 -65
- package/dist/esm/assets/scripts/imageFileInput/ImageFileInputModel.js +78 -113
- package/dist/esm/assets/scripts/imageFileInput/ImageFileInputView.js +106 -106
- package/dist/esm/assets/scripts/imageFileInput/const/classNames.js +6 -16
- package/dist/esm/assets/scripts/index.js +2 -0
- package/dist/esm/assets/scripts/modal/Modal.js +43 -55
- package/dist/esm/assets/scripts/modal/ModalActions.js +39 -53
- package/dist/esm/assets/scripts/modal/ModalContent.js +21 -23
- package/dist/esm/assets/scripts/modal/ModalHeader.js +36 -49
- package/dist/esm/assets/scripts/modal/const/classNames.js +5 -13
- package/dist/esm/assets/scripts/modal/utils/contentUtils.js +1 -1
- package/dist/esm/assets/scripts/notification/FloatingNotification.js +90 -94
- package/dist/esm/assets/scripts/notification/FullWidthNotification.js +91 -81
- package/dist/esm/assets/scripts/notification/MessageNotification.js +91 -80
- package/dist/esm/assets/scripts/notification/Notification.js +49 -66
- package/dist/esm/assets/scripts/notification/const/classNames.js +1 -1
- package/dist/esm/assets/scripts/notification/const/icons.js +11 -25
- package/dist/esm/assets/scripts/notification/const/sizes.js +11 -19
- package/dist/esm/assets/scripts/notification/const/types.js +1 -1
- package/dist/esm/assets/scripts/notification/utils.js +28 -23
- package/dist/esm/assets/scripts/progress-bar/ProgressBar.js +139 -142
- package/dist/esm/assets/scripts/selectBox.js +71 -133
- package/dist/esm/assets/scripts/shared/ButtonCloseX.js +18 -19
- package/dist/esm/assets/scripts/slider.js +103 -123
- package/dist/esm/assets/scripts/tab.js +7 -9
- package/dist/esm/assets/scripts/table/Table.js +370 -0
- package/dist/esm/assets/scripts/table/const/classNames.js +27 -0
- package/dist/esm/assets/scripts/table/const/index.js +2 -0
- package/dist/esm/assets/scripts/table/const/types.js +1 -0
- package/dist/esm/assets/scripts/table/index.js +8 -0
- package/dist/esm/assets/scripts/tag/Tag.js +107 -116
- package/dist/esm/assets/scripts/tag/const/classNames.js +3 -7
- package/dist/esm/assets/scripts/tag/const/sizes.js +4 -4
- package/dist/esm/assets/scripts/tooltip/Tooltip.js +154 -183
- package/dist/esm/assets/scripts/tooltip/TooltipLayerManager.js +22 -26
- package/dist/esm/assets/scripts/tooltip/const/classNames.js +1 -1
- package/dist/esm/assets/scripts/tooltip/const/constants.js +14 -14
- package/dist/esm/assets/scripts/tooltip/const/icons.js +7 -7
- package/dist/esm/assets/scripts/tooltip/const/templates.js +42 -25
- package/dist/esm/assets/scripts/tooltip/utils.js +17 -18
- package/dist/esm/assets/scripts/utils/debounce.js +7 -8
- package/dist/esm/assets/scripts/utils/unifiedBox/domRenderer.js +101 -117
- package/dist/esm/assets/scripts/utils/unifiedBox/dropdownModel.js +103 -144
- package/dist/esm/assets/scripts/utils/unifiedBox/unifiedBoxController.js +179 -208
- package/dist/esm/assets/scripts/utils/unifiedBox/unifiedBoxManager.js +165 -363
- package/dist/esm/constant/color.js +1 -1
- package/dist/esm/index.js +0 -27
- package/dist/esm/src/components/badge/Badge.js +17 -30
- package/dist/esm/src/components/badge/index.js +1 -2
- package/dist/esm/src/components/badge/utils.js +11 -10
- package/dist/esm/src/components/badge-group/BadgeGroup.js +35 -0
- package/dist/esm/src/components/badge-group/index.js +1 -0
- package/dist/esm/src/components/bread-crumb/BreadCrumb.js +48 -0
- package/dist/esm/src/components/button/Button.js +37 -58
- package/dist/esm/src/components/button/ButtonCloseX.js +12 -22
- package/dist/esm/src/components/button/ButtonStepper.js +9 -7
- package/dist/esm/src/components/button/index.js +0 -1
- package/dist/esm/src/components/button-group/ButtonGroup.js +89 -0
- package/dist/esm/src/components/button-group/index.js +1 -0
- package/dist/esm/src/components/carousel-arrow/CarouselArrow.js +26 -0
- package/dist/esm/src/components/carousel-arrow/index.js +1 -0
- package/dist/esm/src/components/carousel-number-group/CarouselNumberGroup.js +25 -0
- package/dist/esm/src/components/carousel-number-group/index.js +1 -0
- package/dist/esm/src/components/checkbox/Checkbox.js +28 -49
- package/dist/esm/src/components/checkbox/CheckboxInput.js +23 -42
- package/dist/esm/src/components/combo-box/ComboBox.js +284 -0
- package/dist/esm/src/components/data-grid/DataGrid.js +175 -0
- package/dist/esm/src/components/data-grid/DataGrid.types.js +1 -0
- package/dist/esm/src/components/data-grid/index.js +2 -0
- package/dist/esm/src/components/date-picker/CustomInput.js +16 -32
- package/dist/esm/src/components/date-picker/DatePicker.js +421 -260
- package/dist/esm/src/components/date-picker/index.js +0 -2
- package/dist/esm/src/components/date-picker/utils.js +2 -4
- package/dist/esm/src/components/divider/Divider.js +14 -25
- package/dist/esm/src/components/dot/Dot.js +11 -28
- package/dist/esm/src/components/dropdown/Dropdown.js +90 -132
- package/dist/esm/src/components/empty-state/EmptyState.js +28 -45
- package/dist/esm/src/components/featured-icon/FeaturedIcon.js +14 -33
- package/dist/esm/src/components/file-input/FileInput.js +102 -148
- package/dist/esm/src/components/horizontal-tab/HorizontalTab.js +46 -0
- package/dist/esm/src/components/horizontal-tab/index.js +1 -0
- package/dist/esm/src/components/image-file-input/ImageFileInput.js +109 -170
- package/dist/esm/src/components/image-file-input/components/ImagePreview.js +8 -17
- package/dist/esm/src/components/index.js +18 -6
- package/dist/esm/src/components/input-base/InputBase.js +189 -0
- package/dist/esm/src/components/input-base/index.js +1 -0
- package/dist/esm/src/components/modal/Modal.js +76 -105
- package/dist/esm/src/components/notification/FloatingNotification.js +52 -80
- package/dist/esm/src/components/notification/FullWidthNotification.js +67 -101
- package/dist/esm/src/components/notification/MessageNotification.js +60 -89
- package/dist/esm/src/components/notification/Notification.js +18 -36
- package/dist/esm/src/components/{input → number-input}/NumberInput.js +34 -54
- package/dist/esm/src/components/number-input/index.js +1 -0
- package/dist/esm/src/components/pagination/NavButton.js +28 -42
- package/dist/esm/src/components/pagination/Pagination.js +58 -97
- package/dist/esm/src/components/password-input/PasswordInput.js +48 -0
- package/dist/esm/src/components/password-input/index.js +1 -0
- package/dist/esm/src/components/progress-bar/ProgressBar.js +45 -60
- package/dist/esm/src/components/progress-bar/components/SegmentBar.js +11 -9
- package/dist/esm/src/components/progress-bar/components/SegmentLabels.js +32 -43
- package/dist/esm/src/components/progress-bar/hooks/useProgressBar.js +59 -78
- package/dist/esm/src/components/progress-bar/utils.js +8 -8
- package/dist/esm/src/components/progress-circle/ProgressCircle.js +49 -72
- package/dist/esm/src/components/radio/Radio.js +24 -43
- package/dist/esm/src/components/radio/RadioInput.js +18 -36
- package/dist/esm/src/components/range-date-picker/RangeDatePicker.js +141 -0
- package/dist/esm/src/components/range-date-picker/index.js +1 -0
- package/dist/esm/src/components/range-date-picker-with-buttons/RangeDatePickerWithButtons.js +75 -0
- package/dist/esm/src/components/range-date-picker-with-buttons/index.js +1 -0
- package/dist/esm/src/components/select/Select.js +36 -63
- package/dist/esm/src/components/select-box/SelectBox.js +254 -0
- package/dist/esm/src/components/select-dropdown/SelectDropdown.js +64 -100
- package/dist/esm/src/components/shared/hintText/HintText.js +13 -30
- package/dist/esm/src/components/shared/label/Label.js +12 -29
- package/dist/esm/src/components/slider/Slider.js +25 -28
- package/dist/esm/src/components/spinner/Spinner.js +25 -39
- package/dist/esm/src/components/switch/Switch.js +44 -69
- package/dist/esm/src/components/tab/TabButton.js +41 -61
- package/dist/esm/src/components/tab/index.js +1 -3
- package/dist/esm/src/components/table/Table.js +262 -0
- package/dist/esm/src/components/table/index.js +1 -0
- package/dist/esm/src/components/table/types.js +1 -0
- package/dist/esm/src/components/tag/Tag.js +65 -85
- package/dist/esm/src/components/textarea/Textarea.js +72 -0
- package/dist/esm/src/components/textarea/index.js +1 -0
- package/dist/esm/src/components/toggle/Toggle.js +28 -52
- package/dist/esm/src/components/tooltip/Tooltip.js +75 -108
- package/dist/esm/src/components/vertical-tab/VerticalTab.js +40 -0
- package/dist/esm/src/components/vertical-tab/index.js +1 -0
- package/dist/esm/src/constant/breakpoint.js +3 -3
- package/dist/esm/src/constant/date-picker.js +1 -1
- package/dist/esm/src/constant/size.js +1 -1
- package/dist/esm/src/hooks/dropdown/useDropdown.js +58 -60
- package/dist/esm/src/hooks/dropdown/useDropdownKeyboard.js +37 -40
- package/dist/esm/src/hooks/dropdown/useDropdownPosition.js +7 -9
- package/dist/esm/src/hooks/dropdown/useOutsideClick.js +11 -11
- package/dist/esm/src/hooks/dropdown/useScrollLock.js +23 -19
- package/dist/esm/src/hooks/dropdown/useWindowResize.js +12 -13
- package/dist/esm/src/hooks/useCallbackRef.js +2 -2
- package/dist/esm/src/hooks/useMediaQuery.js +8 -11
- package/dist/esm/src/hooks/useMergeRefs.js +2 -2
- package/dist/esm/src/utils/date-picker.js +29 -30
- package/dist/esm/src/utils/dropdown/dropdownUtils.js +39 -35
- package/dist/esm/src/utils/dropdown/multiSelect.js +25 -45
- package/dist/temp/assets/scripts/baseBox.js +53 -57
- package/dist/temp/assets/scripts/comboBox.js +62 -93
- package/dist/temp/assets/scripts/datePicker.js +286 -293
- package/dist/temp/assets/scripts/featuredIcon.js +40 -47
- package/dist/temp/assets/scripts/fileInput/const/classNames.js +4 -8
- package/dist/temp/assets/scripts/fileInput/fileInput.js +29 -33
- package/dist/temp/assets/scripts/fileInput/fileInputModel.js +24 -32
- package/dist/temp/assets/scripts/fileInput/fileInputView.js +52 -49
- package/dist/temp/assets/scripts/imageFileInput/ImageFileInput.js +57 -63
- package/dist/temp/assets/scripts/imageFileInput/ImageFileInputModel.js +79 -99
- package/dist/temp/assets/scripts/imageFileInput/ImageFileInputView.js +106 -104
- package/dist/temp/assets/scripts/imageFileInput/const/classNames.js +6 -10
- package/dist/temp/assets/scripts/index.d.ts +2 -0
- package/dist/temp/assets/scripts/index.js +2 -0
- package/dist/temp/assets/scripts/modal/Modal.js +46 -52
- package/dist/temp/assets/scripts/modal/ModalActions.js +42 -50
- package/dist/temp/assets/scripts/modal/ModalContent.js +21 -23
- package/dist/temp/assets/scripts/modal/ModalHeader.js +40 -46
- package/dist/temp/assets/scripts/modal/const/classNames.js +5 -5
- package/dist/temp/assets/scripts/modal/utils/contentUtils.js +1 -1
- package/dist/temp/assets/scripts/notification/FloatingNotification.js +80 -77
- package/dist/temp/assets/scripts/notification/FullWidthNotification.js +78 -62
- package/dist/temp/assets/scripts/notification/MessageNotification.js +81 -64
- package/dist/temp/assets/scripts/notification/Notification.js +48 -62
- package/dist/temp/assets/scripts/notification/const/classNames.js +1 -1
- package/dist/temp/assets/scripts/notification/const/icons.js +11 -25
- package/dist/temp/assets/scripts/notification/const/sizes.js +11 -11
- package/dist/temp/assets/scripts/notification/const/types.js +1 -1
- package/dist/temp/assets/scripts/notification/utils.js +31 -26
- package/dist/temp/assets/scripts/progress-bar/ProgressBar.js +124 -119
- package/dist/temp/assets/scripts/selectBox.js +81 -105
- package/dist/temp/assets/scripts/shared/ButtonCloseX.js +14 -13
- package/dist/temp/assets/scripts/slider.js +105 -113
- package/dist/temp/assets/scripts/tab.js +7 -9
- package/dist/temp/assets/scripts/table/Table.d.ts +41 -0
- package/dist/temp/assets/scripts/table/Table.js +378 -0
- package/dist/temp/assets/scripts/table/const/classNames.d.ts +27 -0
- package/dist/temp/assets/scripts/table/const/classNames.js +27 -0
- package/dist/temp/assets/scripts/table/const/index.d.ts +2 -0
- package/dist/temp/assets/scripts/table/const/index.js +2 -0
- package/dist/temp/assets/scripts/table/const/types.d.ts +23 -0
- package/dist/temp/assets/scripts/table/const/types.js +1 -0
- package/dist/temp/assets/scripts/table/index.d.ts +3 -0
- package/dist/temp/assets/scripts/table/index.js +8 -0
- package/dist/temp/assets/scripts/tag/Tag.js +104 -112
- package/dist/temp/assets/scripts/tag/const/classNames.js +3 -3
- package/dist/temp/assets/scripts/tag/const/sizes.js +4 -4
- package/dist/temp/assets/scripts/tooltip/Tooltip.js +125 -150
- package/dist/temp/assets/scripts/tooltip/TooltipLayerManager.js +20 -23
- package/dist/temp/assets/scripts/tooltip/const/classNames.js +1 -1
- package/dist/temp/assets/scripts/tooltip/const/constants.d.ts +1 -1
- package/dist/temp/assets/scripts/tooltip/const/constants.js +14 -14
- package/dist/temp/assets/scripts/tooltip/const/icons.js +7 -7
- package/dist/temp/assets/scripts/tooltip/const/templates.js +42 -13
- package/dist/temp/assets/scripts/tooltip/utils.js +13 -15
- package/dist/temp/assets/scripts/utils/debounce.js +5 -9
- package/dist/temp/assets/scripts/utils/unifiedBox/domRenderer.js +96 -105
- package/dist/temp/assets/scripts/utils/unifiedBox/dropdownModel.js +96 -121
- package/dist/temp/assets/scripts/utils/unifiedBox/unifiedBoxController.js +170 -193
- package/dist/temp/assets/scripts/utils/unifiedBox/unifiedBoxManager.js +173 -250
- package/dist/temp/constant/color.js +1 -1
- package/dist/temp/index.d.ts +0 -27
- package/dist/temp/index.js +0 -27
- package/dist/temp/src/components/badge/Badge.js +3 -15
- package/dist/temp/src/components/badge/index.d.ts +0 -1
- package/dist/temp/src/components/badge/index.js +0 -1
- package/dist/temp/src/components/badge/utils.js +5 -7
- package/dist/{types/src/components/badge → temp/src/components/badge-group}/BadgeGroup.d.ts +1 -1
- package/dist/temp/src/components/badge-group/BadgeGroup.js +13 -0
- package/dist/temp/src/components/badge-group/index.d.ts +1 -0
- package/dist/temp/src/components/badge-group/index.js +1 -0
- package/dist/temp/src/components/bread-crumb/BreadCrumb.js +20 -0
- package/dist/temp/src/components/button/Button.js +21 -38
- package/dist/temp/src/components/button/ButtonCloseX.js +3 -15
- package/dist/temp/src/components/button/ButtonStepper.js +2 -3
- package/dist/temp/src/components/button/index.d.ts +0 -1
- package/dist/temp/src/components/button/index.js +0 -1
- package/dist/{types/src/components/button → temp/src/components/button-group}/ButtonGroup.d.ts +5 -4
- package/dist/temp/src/components/button-group/ButtonGroup.js +51 -0
- package/dist/temp/src/components/button-group/index.d.ts +1 -0
- package/dist/temp/src/components/button-group/index.js +1 -0
- package/dist/temp/src/components/carousel-arrow/CarouselArrow.js +9 -0
- package/dist/temp/src/components/carousel-arrow/index.d.ts +1 -0
- package/dist/temp/src/components/carousel-arrow/index.js +1 -0
- package/dist/temp/src/components/carousel-number-group/CarouselNumberGroup.js +10 -0
- package/dist/{types/src/components/carousel → temp/src/components/carousel-number-group}/index.d.ts +0 -1
- package/dist/temp/src/components/{carousel → carousel-number-group}/index.js +0 -1
- package/dist/temp/src/components/checkbox/Checkbox.js +2 -25
- package/dist/temp/src/components/checkbox/CheckboxInput.js +6 -29
- package/dist/temp/src/components/combo-box/ComboBox.js +165 -0
- package/dist/temp/src/components/data-grid/DataGrid.d.ts +28 -0
- package/dist/temp/src/components/data-grid/DataGrid.js +88 -0
- package/dist/temp/src/components/data-grid/DataGrid.types.d.ts +35 -0
- package/dist/temp/src/components/data-grid/DataGrid.types.js +1 -0
- package/dist/temp/src/components/data-grid/index.d.ts +2 -0
- package/dist/temp/src/components/data-grid/index.js +2 -0
- package/dist/temp/src/components/date-picker/CustomInput.js +5 -28
- package/dist/temp/src/components/date-picker/DatePicker.d.ts +11 -7
- package/dist/temp/src/components/date-picker/DatePicker.js +394 -221
- package/dist/temp/src/components/date-picker/index.d.ts +0 -2
- package/dist/temp/src/components/date-picker/index.js +0 -2
- package/dist/temp/src/components/date-picker/utils.js +1 -2
- package/dist/temp/src/components/divider/Divider.js +1 -15
- package/dist/temp/src/components/dot/Dot.js +2 -25
- package/dist/temp/src/components/dropdown/Dropdown.js +23 -39
- package/dist/temp/src/components/empty-state/EmptyState.js +3 -29
- package/dist/temp/src/components/featured-icon/FeaturedIcon.js +3 -26
- package/dist/temp/src/components/file-input/FileInput.d.ts +1 -1
- package/dist/temp/src/components/file-input/FileInput.js +33 -69
- package/dist/{types/src/components/tab → temp/src/components/horizontal-tab}/HorizontalTab.d.ts +1 -1
- package/dist/temp/src/components/horizontal-tab/HorizontalTab.js +24 -0
- package/dist/temp/src/components/horizontal-tab/index.d.ts +1 -0
- package/dist/temp/src/components/horizontal-tab/index.js +1 -0
- package/dist/temp/src/components/image-file-input/ImageFileInput.d.ts +1 -1
- package/dist/temp/src/components/image-file-input/ImageFileInput.js +45 -73
- package/dist/temp/src/components/image-file-input/components/ImagePreview.js +2 -14
- package/dist/temp/src/components/index.d.ts +17 -5
- package/dist/temp/src/components/index.js +17 -5
- package/dist/temp/src/components/{input → input-base}/InputBase.d.ts +1 -0
- package/dist/temp/src/components/input-base/InputBase.js +96 -0
- package/dist/temp/src/components/input-base/index.d.ts +1 -0
- package/dist/temp/src/components/input-base/index.js +1 -0
- package/dist/temp/src/components/modal/Modal.js +15 -41
- package/dist/temp/src/components/notification/FloatingNotification.js +11 -34
- package/dist/temp/src/components/notification/FullWidthNotification.js +12 -35
- package/dist/temp/src/components/notification/MessageNotification.js +8 -31
- package/dist/temp/src/components/notification/Notification.js +4 -27
- package/dist/{types/src/components/input → temp/src/components/number-input}/NumberInput.d.ts +1 -1
- package/dist/temp/src/components/number-input/NumberInput.js +68 -0
- package/dist/temp/src/components/number-input/index.d.ts +1 -0
- package/dist/temp/src/components/number-input/index.js +1 -0
- package/dist/temp/src/components/pagination/NavButton.js +19 -31
- package/dist/temp/src/components/pagination/Pagination.js +33 -60
- package/dist/temp/src/components/{input → password-input}/PasswordInput.d.ts +1 -1
- package/dist/temp/src/components/password-input/PasswordInput.js +28 -0
- package/dist/temp/src/components/password-input/index.d.ts +1 -0
- package/dist/temp/src/components/password-input/index.js +1 -0
- package/dist/temp/src/components/progress-bar/ProgressBar.js +10 -22
- package/dist/temp/src/components/progress-bar/components/SegmentBar.js +5 -6
- package/dist/temp/src/components/progress-bar/components/SegmentLabels.js +11 -24
- package/dist/temp/src/components/progress-bar/hooks/useProgressBar.js +36 -45
- package/dist/temp/src/components/progress-bar/utils.js +8 -8
- package/dist/temp/src/components/progress-circle/ProgressCircle.js +5 -17
- package/dist/temp/src/components/radio/Radio.js +2 -25
- package/dist/temp/src/components/radio/RadioInput.js +2 -25
- package/dist/{types/src/components/date-picker → temp/src/components/range-date-picker}/RangeDatePicker.d.ts +1 -1
- package/dist/temp/src/components/range-date-picker/RangeDatePicker.js +104 -0
- package/dist/temp/src/components/range-date-picker/index.d.ts +1 -0
- package/dist/temp/src/components/range-date-picker/index.js +1 -0
- package/dist/{types/src/components/date-picker → temp/src/components/range-date-picker-with-buttons}/RangeDatePickerWithButtons.d.ts +1 -1
- package/dist/temp/src/components/range-date-picker-with-buttons/RangeDatePickerWithButtons.js +43 -0
- package/dist/temp/src/components/range-date-picker-with-buttons/index.d.ts +1 -0
- package/dist/temp/src/components/range-date-picker-with-buttons/index.js +1 -0
- package/dist/temp/src/components/select/Select.js +3 -26
- package/dist/temp/src/components/select-box/SelectBox.js +130 -0
- package/dist/temp/src/components/select-dropdown/SelectDropdown.js +11 -34
- package/dist/temp/src/components/shared/hintText/HintText.js +2 -25
- package/dist/temp/src/components/shared/label/Label.js +2 -25
- package/dist/temp/src/components/slider/Slider.js +15 -16
- package/dist/temp/src/components/spinner/Spinner.js +4 -17
- package/dist/temp/src/components/switch/Switch.js +17 -30
- package/dist/temp/src/components/tab/TabButton.js +6 -29
- package/dist/temp/src/components/tab/index.d.ts +0 -2
- package/dist/temp/src/components/tab/index.js +0 -2
- package/dist/temp/src/components/table/Table.d.ts +46 -0
- package/dist/temp/src/components/table/Table.js +115 -0
- package/dist/temp/src/components/table/index.d.ts +1 -0
- package/dist/temp/src/components/table/index.js +1 -0
- package/dist/temp/src/components/table/types.d.ts +45 -0
- package/dist/temp/src/components/table/types.js +1 -0
- package/dist/temp/src/components/tag/Tag.js +39 -53
- package/dist/temp/src/components/textarea/Textarea.js +34 -0
- package/dist/temp/src/components/textarea/index.d.ts +1 -0
- package/dist/temp/src/components/textarea/index.js +1 -0
- package/dist/temp/src/components/toggle/Toggle.js +3 -26
- package/dist/temp/src/components/tooltip/Tooltip.js +49 -67
- package/dist/temp/src/components/{tab → vertical-tab}/VerticalTab.d.ts +1 -1
- package/dist/temp/src/components/vertical-tab/VerticalTab.js +20 -0
- package/dist/temp/src/components/vertical-tab/index.d.ts +1 -0
- package/dist/temp/src/components/vertical-tab/index.js +1 -0
- package/dist/temp/src/constant/breakpoint.js +3 -3
- package/dist/temp/src/constant/date-picker.js +1 -1
- package/dist/temp/src/constant/size.js +1 -1
- package/dist/temp/src/hooks/dropdown/useDropdown.js +37 -37
- package/dist/temp/src/hooks/dropdown/useDropdownKeyboard.js +26 -27
- package/dist/temp/src/hooks/dropdown/useDropdownPosition.js +7 -7
- package/dist/temp/src/hooks/dropdown/useOutsideClick.js +7 -7
- package/dist/temp/src/hooks/dropdown/useScrollLock.js +17 -17
- package/dist/temp/src/hooks/dropdown/useWindowResize.js +10 -11
- package/dist/temp/src/hooks/useCallbackRef.js +2 -2
- package/dist/temp/src/hooks/useMediaQuery.js +8 -9
- package/dist/temp/src/hooks/useMergeRefs.js +2 -2
- package/dist/temp/src/utils/date-picker.js +23 -25
- package/dist/temp/src/utils/dropdown/dropdownUtils.js +26 -27
- package/dist/temp/src/utils/dropdown/multiSelect.js +23 -25
- package/dist/types/assets/scripts/index.d.ts +2 -0
- package/dist/types/assets/scripts/table/Table.d.ts +41 -0
- package/dist/types/assets/scripts/table/const/classNames.d.ts +27 -0
- package/dist/types/assets/scripts/table/const/index.d.ts +2 -0
- package/dist/types/assets/scripts/table/const/types.d.ts +23 -0
- package/dist/types/assets/scripts/table/index.d.ts +3 -0
- package/dist/types/assets/scripts/tooltip/const/constants.d.ts +1 -1
- package/dist/types/index.d.ts +0 -27
- package/dist/types/src/components/badge/index.d.ts +0 -1
- package/dist/{temp/src/components/badge → types/src/components/badge-group}/BadgeGroup.d.ts +1 -1
- package/dist/types/src/components/badge-group/index.d.ts +1 -0
- package/dist/types/src/components/button/index.d.ts +0 -1
- package/dist/{temp/src/components/button → types/src/components/button-group}/ButtonGroup.d.ts +5 -4
- package/dist/types/src/components/button-group/index.d.ts +1 -0
- package/dist/types/src/components/carousel-arrow/index.d.ts +1 -0
- package/dist/{temp/src/components/carousel → types/src/components/carousel-number-group}/index.d.ts +0 -1
- package/dist/types/src/components/data-grid/DataGrid.d.ts +28 -0
- package/dist/types/src/components/data-grid/DataGrid.types.d.ts +35 -0
- package/dist/types/src/components/data-grid/index.d.ts +2 -0
- package/dist/types/src/components/date-picker/DatePicker.d.ts +11 -7
- package/dist/types/src/components/date-picker/index.d.ts +0 -2
- package/dist/types/src/components/file-input/FileInput.d.ts +1 -1
- package/dist/{temp/src/components/tab → types/src/components/horizontal-tab}/HorizontalTab.d.ts +1 -1
- package/dist/types/src/components/horizontal-tab/index.d.ts +1 -0
- package/dist/types/src/components/image-file-input/ImageFileInput.d.ts +1 -1
- package/dist/types/src/components/index.d.ts +17 -5
- package/dist/types/src/components/{input → input-base}/InputBase.d.ts +1 -0
- package/dist/types/src/components/input-base/index.d.ts +1 -0
- package/dist/{temp/src/components/input → types/src/components/number-input}/NumberInput.d.ts +1 -1
- package/dist/types/src/components/number-input/index.d.ts +1 -0
- package/dist/types/src/components/{input → password-input}/PasswordInput.d.ts +1 -1
- package/dist/types/src/components/password-input/index.d.ts +1 -0
- package/dist/{temp/src/components/date-picker → types/src/components/range-date-picker}/RangeDatePicker.d.ts +1 -1
- package/dist/types/src/components/range-date-picker/index.d.ts +1 -0
- package/dist/{temp/src/components/date-picker → types/src/components/range-date-picker-with-buttons}/RangeDatePickerWithButtons.d.ts +1 -1
- package/dist/types/src/components/range-date-picker-with-buttons/index.d.ts +1 -0
- package/dist/types/src/components/tab/index.d.ts +0 -2
- package/dist/types/src/components/table/Table.d.ts +46 -0
- package/dist/types/src/components/table/index.d.ts +1 -0
- package/dist/types/src/components/table/types.d.ts +45 -0
- package/dist/types/src/components/textarea/index.d.ts +1 -0
- package/dist/types/src/components/{tab → vertical-tab}/VerticalTab.d.ts +1 -1
- package/dist/types/src/components/vertical-tab/index.d.ts +1 -0
- package/dist/ui-admin/assets/styles/style.css +625 -165
- package/package.json +2 -1
- package/dist/cjs/src/components/badge/BadgeGroup.js +0 -62
- package/dist/cjs/src/components/breadcrumb/BreadCrumb.js +0 -66
- package/dist/cjs/src/components/button/ButtonGroup.js +0 -116
- package/dist/cjs/src/components/carousel/CarouselArrow.js +0 -41
- package/dist/cjs/src/components/carousel/CarouselNumberGroup.js +0 -45
- package/dist/cjs/src/components/combobox/ComboBox.js +0 -349
- package/dist/cjs/src/components/date-picker/RangeDatePicker.js +0 -154
- package/dist/cjs/src/components/date-picker/RangeDatePickerWithButtons.js +0 -99
- package/dist/cjs/src/components/input/InputBase.js +0 -229
- package/dist/cjs/src/components/input/NumberInput.js +0 -132
- package/dist/cjs/src/components/input/PasswordInput.js +0 -72
- package/dist/cjs/src/components/input/Textarea.js +0 -107
- package/dist/cjs/src/components/input/index.js +0 -49
- package/dist/cjs/src/components/selectbox/SelectBox.js +0 -318
- package/dist/cjs/src/components/tab/HorizontalTab.js +0 -68
- package/dist/cjs/src/components/tab/VerticalTab.js +0 -60
- package/dist/esm/src/components/badge/BadgeGroup.js +0 -55
- package/dist/esm/src/components/breadcrumb/BreadCrumb.js +0 -59
- package/dist/esm/src/components/button/ButtonGroup.js +0 -108
- package/dist/esm/src/components/carousel/CarouselArrow.js +0 -33
- package/dist/esm/src/components/carousel/CarouselNumberGroup.js +0 -37
- package/dist/esm/src/components/carousel/index.js +0 -2
- package/dist/esm/src/components/combobox/ComboBox.js +0 -343
- package/dist/esm/src/components/date-picker/RangeDatePicker.js +0 -148
- package/dist/esm/src/components/date-picker/RangeDatePickerWithButtons.js +0 -93
- package/dist/esm/src/components/input/InputBase.js +0 -223
- package/dist/esm/src/components/input/PasswordInput.js +0 -65
- package/dist/esm/src/components/input/Textarea.js +0 -100
- package/dist/esm/src/components/input/index.js +0 -4
- package/dist/esm/src/components/selectbox/SelectBox.js +0 -312
- package/dist/esm/src/components/tab/HorizontalTab.js +0 -61
- package/dist/esm/src/components/tab/VerticalTab.js +0 -52
- package/dist/temp/src/components/badge/BadgeGroup.js +0 -36
- package/dist/temp/src/components/breadcrumb/BreadCrumb.js +0 -33
- package/dist/temp/src/components/button/ButtonGroup.js +0 -72
- package/dist/temp/src/components/carousel/CarouselArrow.js +0 -24
- package/dist/temp/src/components/carousel/CarouselNumberGroup.js +0 -24
- package/dist/temp/src/components/combobox/ComboBox.js +0 -199
- package/dist/temp/src/components/date-picker/RangeDatePicker.js +0 -117
- package/dist/temp/src/components/date-picker/RangeDatePickerWithButtons.js +0 -55
- package/dist/temp/src/components/input/InputBase.js +0 -121
- package/dist/temp/src/components/input/NumberInput.js +0 -93
- package/dist/temp/src/components/input/PasswordInput.js +0 -51
- package/dist/temp/src/components/input/Textarea.js +0 -60
- package/dist/temp/src/components/input/index.d.ts +0 -4
- package/dist/temp/src/components/input/index.js +0 -4
- package/dist/temp/src/components/selectbox/SelectBox.js +0 -163
- package/dist/temp/src/components/tab/HorizontalTab.js +0 -37
- package/dist/temp/src/components/tab/VerticalTab.js +0 -32
- package/dist/types/src/components/input/index.d.ts +0 -4
- /package/dist/cjs/src/components/{breadcrumb → bread-crumb}/index.js +0 -0
- /package/dist/cjs/src/components/{combobox → combo-box}/index.js +0 -0
- /package/dist/cjs/src/components/{selectbox → select-box}/index.js +0 -0
- /package/dist/esm/src/components/{breadcrumb → bread-crumb}/index.js +0 -0
- /package/dist/esm/src/components/{combobox → combo-box}/index.js +0 -0
- /package/dist/esm/src/components/{selectbox → select-box}/index.js +0 -0
- /package/dist/temp/src/components/{breadcrumb → bread-crumb}/BreadCrumb.d.ts +0 -0
- /package/dist/temp/src/components/{breadcrumb → bread-crumb}/index.d.ts +0 -0
- /package/dist/temp/src/components/{breadcrumb → bread-crumb}/index.js +0 -0
- /package/dist/temp/src/components/{carousel → carousel-arrow}/CarouselArrow.d.ts +0 -0
- /package/dist/temp/src/components/{carousel → carousel-number-group}/CarouselNumberGroup.d.ts +0 -0
- /package/dist/temp/src/components/{combobox → combo-box}/ComboBox.d.ts +0 -0
- /package/dist/temp/src/components/{combobox → combo-box}/index.d.ts +0 -0
- /package/dist/temp/src/components/{combobox → combo-box}/index.js +0 -0
- /package/dist/temp/src/components/{selectbox → select-box}/SelectBox.d.ts +0 -0
- /package/dist/temp/src/components/{selectbox → select-box}/index.d.ts +0 -0
- /package/dist/temp/src/components/{selectbox → select-box}/index.js +0 -0
- /package/dist/temp/src/components/{input → textarea}/Textarea.d.ts +0 -0
- /package/dist/types/src/components/{breadcrumb → bread-crumb}/BreadCrumb.d.ts +0 -0
- /package/dist/types/src/components/{breadcrumb → bread-crumb}/index.d.ts +0 -0
- /package/dist/types/src/components/{carousel → carousel-arrow}/CarouselArrow.d.ts +0 -0
- /package/dist/types/src/components/{carousel → carousel-number-group}/CarouselNumberGroup.d.ts +0 -0
- /package/dist/types/src/components/{combobox → combo-box}/ComboBox.d.ts +0 -0
- /package/dist/types/src/components/{combobox → combo-box}/index.d.ts +0 -0
- /package/dist/types/src/components/{selectbox → select-box}/SelectBox.d.ts +0 -0
- /package/dist/types/src/components/{selectbox → select-box}/index.d.ts +0 -0
- /package/dist/types/src/components/{input → textarea}/Textarea.d.ts +0 -0
|
@@ -1,20 +1,9 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
1
|
import { formatDateInput, formatHourInput, formatMinuteInput } from '../../src/utils/date-picker';
|
|
13
2
|
import flatpickr from 'flatpickr';
|
|
14
3
|
import { Korean } from 'flatpickr/dist/l10n/ko';
|
|
15
4
|
import moment from 'moment';
|
|
16
5
|
// Constants
|
|
17
|
-
|
|
6
|
+
const CONSTANTS = {
|
|
18
7
|
ICON_SIZES: {
|
|
19
8
|
xs: '14',
|
|
20
9
|
sm: '16',
|
|
@@ -39,14 +28,13 @@ var CONSTANTS = {
|
|
|
39
28
|
MOMENT_NOT_LOADED: 'moment 라이브러리가 로드되지 않았습니다.',
|
|
40
29
|
},
|
|
41
30
|
};
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
var _a, _b;
|
|
31
|
+
class DatePicker {
|
|
32
|
+
constructor(wrapper, options) {
|
|
45
33
|
this.flatpickrInstances = [];
|
|
46
34
|
this.currentButton = null;
|
|
47
|
-
|
|
35
|
+
const { buttons = [], size, autoComplete = 'off', datePickerOptions, onValidationError } = options;
|
|
48
36
|
this.validateWrapper(wrapper);
|
|
49
|
-
this.validationDependencies(
|
|
37
|
+
this.validationDependencies(buttons?.length > 0);
|
|
50
38
|
this.instanceId = DatePicker.instanceCounter++;
|
|
51
39
|
this.contentWrapper = wrapper;
|
|
52
40
|
this.datePickerOptions = datePickerOptions;
|
|
@@ -58,240 +46,251 @@ export var DatePicker = /** @class */ (function () {
|
|
|
58
46
|
this.onValidationError = onValidationError;
|
|
59
47
|
this.init();
|
|
60
48
|
}
|
|
61
|
-
|
|
49
|
+
validateWrapper(wrapper) {
|
|
62
50
|
if (DatePicker.usedWrappers.has(wrapper)) {
|
|
63
|
-
throw new Error(
|
|
64
|
-
|
|
65
|
-
|
|
51
|
+
throw new Error(`이미 사용 중인 DOM 요소입니다. ` +
|
|
52
|
+
`같은 DOM 요소에는 하나의 DatePicker 인스턴스만 생성할 수 있습니다. ` +
|
|
53
|
+
`다른 DOM 요소를 사용하거나 기존 인스턴스를 먼저 제거해주세요.`);
|
|
66
54
|
}
|
|
67
55
|
DatePicker.usedWrappers.add(wrapper);
|
|
68
|
-
}
|
|
69
|
-
|
|
56
|
+
}
|
|
57
|
+
init() {
|
|
70
58
|
this.contentWrapper.innerHTML = '';
|
|
71
59
|
this.initializeWrapper();
|
|
72
60
|
this.initButtonGroup();
|
|
73
61
|
this.initDatePicker();
|
|
74
|
-
}
|
|
75
|
-
|
|
62
|
+
}
|
|
63
|
+
validationDependencies(hasButtons) {
|
|
76
64
|
if (typeof flatpickr === 'undefined') {
|
|
77
65
|
throw new Error(CONSTANTS.ERROR_MESSAGES.FLATPICKR_NOT_LOADED);
|
|
78
66
|
}
|
|
79
67
|
if (hasButtons && typeof moment === 'undefined') {
|
|
80
68
|
throw new Error(CONSTANTS.ERROR_MESSAGES.MOMENT_NOT_LOADED);
|
|
81
69
|
}
|
|
82
|
-
}
|
|
83
|
-
|
|
70
|
+
}
|
|
71
|
+
initializeWrapper() {
|
|
84
72
|
if (this.datePickerOptions.length < 2)
|
|
85
73
|
return;
|
|
86
74
|
this.contentWrapper.classList.add(CONSTANTS.CLASS_NAMES.RANGE_WRAPPER);
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
var _this = this;
|
|
75
|
+
}
|
|
76
|
+
initButtonGroup() {
|
|
90
77
|
if (this.buttons.length === 0)
|
|
91
78
|
return;
|
|
92
79
|
if (this.contentWrapper.classList.contains(CONSTANTS.CLASS_NAMES.RANGE_WRAPPER)) {
|
|
93
80
|
this.contentWrapper.classList.replace(CONSTANTS.CLASS_NAMES.RANGE_WRAPPER, CONSTANTS.CLASS_NAMES.RANGE_WITH_BUTTONS);
|
|
94
81
|
}
|
|
95
82
|
this.contentWrapper.classList.add(CONSTANTS.CLASS_NAMES.RANGE_WITH_BUTTONS);
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
wrapper.className =
|
|
83
|
+
const createButtonWrapperElement = () => {
|
|
84
|
+
const wrapper = document.createElement('div');
|
|
85
|
+
wrapper.className = `${CONSTANTS.CLASS_NAMES.BUTTON_GROUP} ${CONSTANTS.CLASS_NAMES.BUTTON_GROUP_HAS_BORDER} ${CONSTANTS.CLASS_NAMES.BUTTON_GROUP}--${this.size}`;
|
|
99
86
|
return wrapper;
|
|
100
87
|
};
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
88
|
+
const appendButtons = (wrapper) => {
|
|
89
|
+
this.buttons.forEach((button) => {
|
|
90
|
+
const buttonElement = this.createButtonElement(button);
|
|
104
91
|
wrapper.appendChild(buttonElement);
|
|
105
92
|
});
|
|
106
93
|
};
|
|
107
|
-
|
|
94
|
+
const wrapper = createButtonWrapperElement();
|
|
108
95
|
appendButtons(wrapper);
|
|
109
96
|
wrapper.addEventListener('click', this.updateDateWithButton.bind(this));
|
|
110
97
|
this.contentWrapper.appendChild(wrapper);
|
|
111
|
-
}
|
|
112
|
-
|
|
98
|
+
}
|
|
99
|
+
createButtonElement(button) {
|
|
113
100
|
if (button.isCurrent) {
|
|
114
101
|
this.currentButton = button;
|
|
115
102
|
}
|
|
116
|
-
|
|
117
|
-
buttonElement.className =
|
|
103
|
+
const buttonElement = document.createElement('button');
|
|
104
|
+
buttonElement.className = `${CONSTANTS.CLASS_NAMES.BUTTON} ${button.isCurrent ? 'is-current' : ''}`;
|
|
118
105
|
buttonElement.textContent = button.text;
|
|
119
106
|
buttonElement.type = 'button';
|
|
120
107
|
return buttonElement;
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
var buttonGroup = this.contentWrapper.querySelector(".".concat(CONSTANTS.CLASS_NAMES.BUTTON_GROUP));
|
|
108
|
+
}
|
|
109
|
+
reRenderButtonGroup(buttons) {
|
|
110
|
+
const buttonGroup = this.contentWrapper.querySelector(`.${CONSTANTS.CLASS_NAMES.BUTTON_GROUP}`);
|
|
125
111
|
if (!buttonGroup)
|
|
126
112
|
return;
|
|
127
113
|
buttonGroup.innerHTML = '';
|
|
128
|
-
buttons.forEach(
|
|
114
|
+
buttons.forEach((button) => {
|
|
129
115
|
if (button.isCurrent) {
|
|
130
|
-
|
|
116
|
+
this.currentButton = button;
|
|
131
117
|
}
|
|
132
|
-
buttonGroup.appendChild(
|
|
118
|
+
buttonGroup.appendChild(this.createButtonElement(button));
|
|
133
119
|
});
|
|
134
120
|
this.buttons = buttons;
|
|
135
|
-
}
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
wrapper.className = "".concat(CONSTANTS.CLASS_NAMES.DATE_PICKER, " ").concat(CONSTANTS.CLASS_NAMES.DATE_PICKER, "--").concat(size, " ").concat(_this.datePickerOptions.some(function (option) { return option.options.enableTime; }) ? CONSTANTS.CLASS_NAMES.HAS_TIME : '');
|
|
121
|
+
}
|
|
122
|
+
initDatePicker() {
|
|
123
|
+
const datePickerOptions = this.datePickerOptions;
|
|
124
|
+
const createInputWrapperElement = (size) => {
|
|
125
|
+
const wrapper = document.createElement('div');
|
|
126
|
+
wrapper.className = `${CONSTANTS.CLASS_NAMES.DATE_PICKER} ${CONSTANTS.CLASS_NAMES.DATE_PICKER}--${size} ${this.datePickerOptions.some((option) => option.options.enableTime) ? CONSTANTS.CLASS_NAMES.HAS_TIME : ''}`;
|
|
142
127
|
return wrapper;
|
|
143
128
|
};
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
var defaultPlaceHolder = datePickerOption.options.enableTime
|
|
129
|
+
const createInput = (datePickerOption, index) => {
|
|
130
|
+
const defaultPlaceHolder = datePickerOption.options.enableTime
|
|
147
131
|
? CONSTANTS.FORMATS.DATE_TIME
|
|
148
132
|
: CONSTANTS.FORMATS.DATE;
|
|
149
|
-
|
|
133
|
+
const input = document.createElement('input');
|
|
150
134
|
input.type = 'text';
|
|
151
|
-
input.placeholder =
|
|
152
|
-
input.name =
|
|
153
|
-
input.id =
|
|
135
|
+
input.placeholder = datePickerOption.placeholder ?? defaultPlaceHolder;
|
|
136
|
+
input.name = datePickerOption.attrName ?? '';
|
|
137
|
+
input.id = `datepicker-${this.instanceId}-${datePickerOption.element}-${index}`;
|
|
154
138
|
input.className = CONSTANTS.CLASS_NAMES.DATE_PICKER_INPUT;
|
|
155
|
-
input.autocomplete =
|
|
139
|
+
input.autocomplete = this.autoComplete;
|
|
156
140
|
return input;
|
|
157
141
|
};
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
return
|
|
142
|
+
const createIcon = (size, elementId, index) => {
|
|
143
|
+
const getCalendarIconSvg = (size) => {
|
|
144
|
+
return `
|
|
145
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="${size}" height="${size}" viewBox="0 0 16 16" fill="none">
|
|
146
|
+
<path
|
|
147
|
+
d="M14 6.66671H2M10.6667 1.33337V4.00004M5.33333 1.33337V4.00004M5.2 14.6667H10.8C11.9201 14.6667 12.4802 14.6667 12.908 14.4487C13.2843 14.257 13.5903 13.951 13.782 13.5747C14 13.1469 14 12.5868 14 11.4667V5.86671C14 4.7466 14 4.18655 13.782 3.75873C13.5903 3.3824 13.2843 3.07644 12.908 2.88469C12.4802 2.66671 11.9201 2.66671 10.8 2.66671H5.2C4.0799 2.66671 3.51984 2.66671 3.09202 2.88469C2.71569 3.07644 2.40973 3.3824 2.21799 3.75873C2 4.18655 2 4.7466 2 5.86671V11.4667C2 12.5868 2 13.1469 2.21799 13.5747C2.40973 13.951 2.71569 14.257 3.09202 14.4487C3.51984 14.6667 4.0799 14.6667 5.2 14.6667Z"
|
|
148
|
+
stroke="black"
|
|
149
|
+
stroke-width="1.33333"
|
|
150
|
+
stroke-linecap="round"
|
|
151
|
+
stroke-linejoin="round"
|
|
152
|
+
></path>
|
|
153
|
+
</svg>`;
|
|
161
154
|
};
|
|
162
|
-
|
|
163
|
-
ico.htmlFor =
|
|
155
|
+
const ico = document.createElement('label');
|
|
156
|
+
ico.htmlFor = `datepicker-${this.instanceId}-${elementId}-${index}`;
|
|
164
157
|
ico.className = CONSTANTS.CLASS_NAMES.DATE_PICKER_ICO;
|
|
165
158
|
ico.innerHTML = getCalendarIconSvg(CONSTANTS.ICON_SIZES[size]);
|
|
166
159
|
return ico;
|
|
167
160
|
};
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
span.textContent =
|
|
171
|
-
|
|
161
|
+
const insertSeparator = () => {
|
|
162
|
+
const span = document.createElement('span');
|
|
163
|
+
span.textContent = this.separator;
|
|
164
|
+
this.contentWrapper.insertBefore(span, this.contentWrapper.querySelectorAll(`.${CONSTANTS.CLASS_NAMES.DATE_PICKER}`)[1]);
|
|
172
165
|
};
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
166
|
+
const createDatePickerElement = (datePickerOption, index) => {
|
|
167
|
+
const inputWrapper = createInputWrapperElement(this.size);
|
|
168
|
+
const input = createInput(datePickerOption, index);
|
|
176
169
|
inputWrapper.appendChild(input);
|
|
177
|
-
inputWrapper.appendChild(createIcon(
|
|
178
|
-
inputWrapper.addEventListener('click',
|
|
170
|
+
inputWrapper.appendChild(createIcon(this.size, datePickerOption.element, index));
|
|
171
|
+
inputWrapper.addEventListener('click', () => {
|
|
179
172
|
// biome-ignore lint/suspicious/noAssignInExpressions: <explanation>
|
|
180
173
|
// biome-ignore lint/suspicious/useIterableCallbackReturn: <explanation>
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
174
|
+
this.buttons.forEach((button) => (button.isCurrent = false));
|
|
175
|
+
this.currentButton = null;
|
|
176
|
+
this.reRenderButtonGroup(this.buttons);
|
|
184
177
|
});
|
|
185
|
-
|
|
178
|
+
this.contentWrapper.appendChild(inputWrapper);
|
|
186
179
|
if (index > 0) {
|
|
187
180
|
insertSeparator();
|
|
188
181
|
}
|
|
189
|
-
return
|
|
182
|
+
return this.initializeFlatpickr(input, datePickerOption.options, inputWrapper);
|
|
190
183
|
};
|
|
191
|
-
|
|
192
|
-
return datePickerOptions.map(
|
|
184
|
+
const createFlatpickrInstances = (datePickerOptions) => {
|
|
185
|
+
return datePickerOptions.map((datePickerOption, index) => createDatePickerElement(datePickerOption, index));
|
|
193
186
|
};
|
|
194
|
-
|
|
195
|
-
if (
|
|
196
|
-
|
|
187
|
+
const calcInitDates = (datePickerOptions) => {
|
|
188
|
+
if (this.buttons.length > 0) {
|
|
189
|
+
const currentButton = this.buttons.find((button) => button.isCurrent);
|
|
197
190
|
if (!currentButton) {
|
|
198
|
-
return datePickerOptions.map(
|
|
191
|
+
return datePickerOptions.map(() => '');
|
|
199
192
|
}
|
|
200
|
-
return
|
|
193
|
+
return this.calculateDatesFromButton(currentButton);
|
|
201
194
|
}
|
|
202
|
-
return datePickerOptions.map(
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
return moment(datePickerOption.options.defaultDate.toString()).format(_this.dateFormat);
|
|
195
|
+
return datePickerOptions.map((datePickerOption) => {
|
|
196
|
+
if (datePickerOption.options?.defaultDate) {
|
|
197
|
+
return moment(datePickerOption.options.defaultDate.toString()).format(this.dateFormat);
|
|
206
198
|
}
|
|
207
199
|
return '';
|
|
208
200
|
});
|
|
209
201
|
};
|
|
210
202
|
this.flatpickrInstances = createFlatpickrInstances(this.datePickerOptions);
|
|
211
|
-
|
|
203
|
+
const dates = calcInitDates(datePickerOptions);
|
|
212
204
|
this.setMultipleDates(dates);
|
|
213
|
-
}
|
|
214
|
-
|
|
215
|
-
var _this = this;
|
|
216
|
-
var _a;
|
|
205
|
+
}
|
|
206
|
+
initializeFlatpickr(input, options, wrapper) {
|
|
217
207
|
// flatpickr locale 설정 확인
|
|
218
|
-
|
|
208
|
+
const locale = typeof options.locale === 'string' ? options.locale : 'ko';
|
|
219
209
|
this.setupFlatpickrLocale(locale, options);
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
210
|
+
const onInputHandler = this.createInputHandler();
|
|
211
|
+
const onHourInputHandler = this.createHourInputHandler();
|
|
212
|
+
const onMinuteInputHandler = this.createMinuteInputHandler();
|
|
213
|
+
const onMouseDown = this.createMouseDownHandler(wrapper);
|
|
224
214
|
// onBlur 핸들러 추가하여 입력 전 날짜 저장
|
|
225
|
-
|
|
215
|
+
const onBlurHandler = this.createBlurHandler();
|
|
226
216
|
document.addEventListener('mousedown', onMouseDown, true);
|
|
227
|
-
return flatpickr(input,
|
|
217
|
+
return flatpickr(input, {
|
|
218
|
+
...options,
|
|
219
|
+
allowInput: options.allowInput ?? true,
|
|
220
|
+
appendTo: wrapper,
|
|
221
|
+
time_24hr: true,
|
|
222
|
+
defaultHour: options.defaultHour || 0,
|
|
223
|
+
defaultMinute: options.defaultMinute || 0,
|
|
224
|
+
locale,
|
|
225
|
+
formatDate: (date, format, locale) => {
|
|
228
226
|
try {
|
|
229
227
|
// 유효한 날짜인지 확인
|
|
230
228
|
if (!date || !(date instanceof Date) || isNaN(date.getTime())) {
|
|
231
229
|
return '';
|
|
232
230
|
}
|
|
233
231
|
// moment로 포맷팅
|
|
234
|
-
|
|
232
|
+
const momentDate = moment(date);
|
|
235
233
|
if (!momentDate.isValid()) {
|
|
236
234
|
return '';
|
|
237
235
|
}
|
|
238
236
|
// format을 moment 형식으로 변환
|
|
239
|
-
|
|
237
|
+
const momentFormat = this.convertFlatpickrFormatToMoment(format);
|
|
240
238
|
return momentDate.format(momentFormat);
|
|
241
239
|
}
|
|
242
240
|
catch (error) {
|
|
243
241
|
// 오류 발생 시 빈 문자열 반환 (232-23 같은 잘못된 날짜 처리)
|
|
244
242
|
return '';
|
|
245
243
|
}
|
|
246
|
-
},
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
244
|
+
},
|
|
245
|
+
onChange: this.createOnChangeHandler(options),
|
|
246
|
+
onReady: this.createOnReadyHandler(onInputHandler, onHourInputHandler, onMinuteInputHandler, onBlurHandler),
|
|
247
|
+
onDestroy: this.createOnDestroyHandler(onInputHandler, onHourInputHandler, onMinuteInputHandler, onMouseDown, onBlurHandler),
|
|
248
|
+
});
|
|
249
|
+
}
|
|
250
|
+
createBlurHandler() {
|
|
251
|
+
return (e) => {
|
|
252
|
+
const target = e.target;
|
|
253
|
+
const inputIndex = this.findFlatpickrInstanceIndexByInput(target);
|
|
253
254
|
if (inputIndex < 0)
|
|
254
255
|
return;
|
|
255
256
|
// blur 시점에 현재 selectedDates를 저장 (입력 전 상태)
|
|
256
|
-
|
|
257
|
+
const instance = this.flatpickrInstances[inputIndex];
|
|
257
258
|
if (instance && instance.selectedDates.length > 0) {
|
|
258
259
|
// 이전 날짜를 별도로 저장 (onChange에서 사용)
|
|
259
260
|
instance._previousDateBeforeInput = instance.selectedDates[0];
|
|
260
261
|
}
|
|
261
262
|
};
|
|
262
|
-
}
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
if ((_a = flatpickr === null || flatpickr === void 0 ? void 0 : flatpickr.l10ns) === null || _a === void 0 ? void 0 : _a[locale]) {
|
|
263
|
+
}
|
|
264
|
+
setupFlatpickrLocale(locale, options) {
|
|
265
|
+
if (flatpickr?.l10ns?.[locale]) {
|
|
266
266
|
return;
|
|
267
267
|
}
|
|
268
|
-
console.warn(
|
|
268
|
+
console.warn(`flatpickr locale '${locale}' is not loaded. Available locales:`, Object.keys(flatpickr?.l10ns || {}));
|
|
269
269
|
if (locale === 'ko') {
|
|
270
270
|
flatpickr.l10ns.ko = Korean;
|
|
271
271
|
}
|
|
272
272
|
else {
|
|
273
273
|
options.locale = undefined;
|
|
274
274
|
}
|
|
275
|
-
}
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
var instance = _this.findFlatpickrInstanceByInput(target);
|
|
275
|
+
}
|
|
276
|
+
createInputHandler() {
|
|
277
|
+
return (e) => {
|
|
278
|
+
const target = e.target;
|
|
279
|
+
const input = target.value;
|
|
280
|
+
const instance = this.findFlatpickrInstanceByInput(target);
|
|
282
281
|
if (!instance)
|
|
283
282
|
return;
|
|
284
283
|
// 빈 입력 처리
|
|
285
284
|
if (!input || input.trim() === '') {
|
|
286
|
-
|
|
285
|
+
this.clearInputValue(target, instance);
|
|
287
286
|
return;
|
|
288
287
|
}
|
|
289
288
|
// 숫자나 하이픈이 없는 경우 처리
|
|
290
289
|
if (!/[0-9]/.test(input)) {
|
|
291
|
-
|
|
290
|
+
this.restorePreviousDate(target, instance);
|
|
292
291
|
return;
|
|
293
292
|
}
|
|
294
|
-
|
|
293
|
+
const formattedInput = formatDateInput(input);
|
|
295
294
|
// 포맷팅만 수행
|
|
296
295
|
if (formattedInput !== input) {
|
|
297
296
|
target.value = formattedInput;
|
|
@@ -299,29 +298,29 @@ export var DatePicker = /** @class */ (function () {
|
|
|
299
298
|
}
|
|
300
299
|
// 완전한 날짜 형식이지만 유효하지 않은 경우 처리
|
|
301
300
|
if (formattedInput && formattedInput.length >= 10) {
|
|
302
|
-
|
|
301
|
+
const parsedDate = moment(formattedInput);
|
|
303
302
|
if (!parsedDate.isValid()) {
|
|
304
|
-
|
|
303
|
+
this.restorePreviousDate(target, instance);
|
|
305
304
|
}
|
|
306
305
|
}
|
|
307
306
|
};
|
|
308
|
-
}
|
|
309
|
-
|
|
310
|
-
|
|
307
|
+
}
|
|
308
|
+
findFlatpickrInstanceByInput(input) {
|
|
309
|
+
const index = this.findFlatpickrInstanceIndexByInput(input);
|
|
311
310
|
return index >= 0 ? this.flatpickrInstances[index] : null;
|
|
312
|
-
}
|
|
313
|
-
|
|
311
|
+
}
|
|
312
|
+
clearInputValue(target, instance) {
|
|
314
313
|
target.value = '';
|
|
315
314
|
instance.setDate('', false);
|
|
316
|
-
}
|
|
317
|
-
|
|
318
|
-
|
|
315
|
+
}
|
|
316
|
+
restorePreviousDate(target, instance) {
|
|
317
|
+
const hasPreviousDate = instance.selectedDates.length > 0;
|
|
319
318
|
if (!hasPreviousDate) {
|
|
320
319
|
this.clearInputValue(target, instance);
|
|
321
320
|
return;
|
|
322
321
|
}
|
|
323
|
-
|
|
324
|
-
|
|
322
|
+
const previousDate = instance.selectedDates[0];
|
|
323
|
+
const isValidDate = previousDate instanceof Date && !isNaN(previousDate.getTime());
|
|
325
324
|
if (isValidDate) {
|
|
326
325
|
target.value = moment(previousDate).format(this.dateFormat);
|
|
327
326
|
instance.setDate(previousDate, false);
|
|
@@ -329,59 +328,58 @@ export var DatePicker = /** @class */ (function () {
|
|
|
329
328
|
else {
|
|
330
329
|
this.clearInputValue(target, instance);
|
|
331
330
|
}
|
|
332
|
-
}
|
|
333
|
-
|
|
334
|
-
return
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
331
|
+
}
|
|
332
|
+
createHourInputHandler() {
|
|
333
|
+
return (e) => {
|
|
334
|
+
const target = e.target;
|
|
335
|
+
const input = target.value;
|
|
336
|
+
const formattedInput = formatHourInput(input);
|
|
338
337
|
if (formattedInput === input)
|
|
339
338
|
return;
|
|
340
339
|
target.value = formattedInput;
|
|
341
340
|
};
|
|
342
|
-
}
|
|
343
|
-
|
|
344
|
-
return
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
341
|
+
}
|
|
342
|
+
createMinuteInputHandler() {
|
|
343
|
+
return (e) => {
|
|
344
|
+
const target = e.target;
|
|
345
|
+
const input = target.value;
|
|
346
|
+
const formattedInput = formatMinuteInput(input);
|
|
348
347
|
if (formattedInput === input)
|
|
349
348
|
return;
|
|
350
349
|
target.value = formattedInput;
|
|
351
350
|
};
|
|
352
|
-
}
|
|
353
|
-
|
|
354
|
-
return
|
|
355
|
-
|
|
351
|
+
}
|
|
352
|
+
createMouseDownHandler(wrapper) {
|
|
353
|
+
return (e) => {
|
|
354
|
+
const flatpickrCalendar = wrapper.querySelector('.flatpickr-calendar.open');
|
|
356
355
|
if (!flatpickrCalendar)
|
|
357
356
|
return;
|
|
358
357
|
if (flatpickrCalendar.contains(e.target))
|
|
359
358
|
return;
|
|
360
|
-
|
|
361
|
-
timeInputs.forEach(
|
|
359
|
+
const timeInputs = flatpickrCalendar.querySelectorAll('.flatpickr-time input');
|
|
360
|
+
timeInputs.forEach((input) => {
|
|
362
361
|
if (document.activeElement === input) {
|
|
363
362
|
input.blur();
|
|
364
363
|
}
|
|
365
364
|
});
|
|
366
365
|
};
|
|
367
|
-
}
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
return function (selectedDates, dateStr, instance) {
|
|
366
|
+
}
|
|
367
|
+
createOnChangeHandler(options) {
|
|
368
|
+
return (selectedDates, dateStr, instance) => {
|
|
371
369
|
try {
|
|
372
|
-
|
|
370
|
+
const inputIndex = this.findFlatpickrInstanceIndexByInput(instance.input);
|
|
373
371
|
if (inputIndex < 0)
|
|
374
372
|
return;
|
|
375
373
|
// blur 시 저장한 이전 날짜 사용
|
|
376
|
-
|
|
374
|
+
const previousDate = instance._previousDateBeforeInput;
|
|
377
375
|
// selectedDates가 비어있거나 첫 번째 날짜가 유효하지 않은 경우 처리
|
|
378
376
|
if (!selectedDates ||
|
|
379
377
|
selectedDates.length === 0 ||
|
|
380
378
|
!selectedDates[0] ||
|
|
381
379
|
!(selectedDates[0] instanceof Date) ||
|
|
382
|
-
!
|
|
380
|
+
!this.isValidDate(selectedDates[0])) {
|
|
383
381
|
// 유효하지 않은 날짜는 이전 값으로 복원하거나 빈 값으로 처리
|
|
384
|
-
if (previousDate &&
|
|
382
|
+
if (previousDate && this.isValidDate(previousDate)) {
|
|
385
383
|
// 이전 값이 있으면 이전 값으로 복원
|
|
386
384
|
instance.selectedDates = [previousDate];
|
|
387
385
|
instance.setDate(previousDate, false);
|
|
@@ -395,47 +393,47 @@ export var DatePicker = /** @class */ (function () {
|
|
|
395
393
|
return;
|
|
396
394
|
}
|
|
397
395
|
// 유효한 날짜인 경우에만 원본 onChange 호출
|
|
398
|
-
|
|
399
|
-
|
|
396
|
+
this.invokeOriginalOnChange(options.onChange, selectedDates, dateStr, instance);
|
|
397
|
+
const selectedDate = selectedDates[0];
|
|
400
398
|
// minDate/maxDate 검증
|
|
401
|
-
|
|
399
|
+
this.validateAndRestoreIfNeeded(selectedDate, instance, inputIndex, previousDate);
|
|
402
400
|
// 검증 후 현재 날짜를 이전 날짜로 업데이트
|
|
403
|
-
if (
|
|
401
|
+
if (this.isValidDate(selectedDate)) {
|
|
404
402
|
instance._previousDateBeforeInput = selectedDate;
|
|
405
|
-
|
|
403
|
+
this.flatpickrInstances[inputIndex].selectedDates = [selectedDate];
|
|
406
404
|
}
|
|
407
405
|
}
|
|
408
406
|
catch (error) {
|
|
409
407
|
// 오류 발생 시 이전 값으로 복원
|
|
410
|
-
|
|
411
|
-
if (previousDate &&
|
|
408
|
+
const previousDate = instance._previousDateBeforeInput;
|
|
409
|
+
if (previousDate && this.isValidDate(previousDate)) {
|
|
412
410
|
instance.selectedDates = [previousDate];
|
|
413
411
|
}
|
|
414
412
|
else {
|
|
415
413
|
instance.selectedDates = [];
|
|
416
414
|
}
|
|
417
|
-
|
|
415
|
+
this.restoreDateToInstance(instance, previousDate);
|
|
418
416
|
}
|
|
419
417
|
};
|
|
420
|
-
}
|
|
421
|
-
|
|
418
|
+
}
|
|
419
|
+
invokeOriginalOnChange(onChange, selectedDates, dateStr, instance) {
|
|
422
420
|
if (!onChange)
|
|
423
421
|
return;
|
|
424
422
|
if (Array.isArray(onChange)) {
|
|
425
|
-
onChange.forEach(
|
|
423
|
+
onChange.forEach((hook) => {
|
|
426
424
|
void hook(selectedDates, dateStr, instance);
|
|
427
425
|
});
|
|
428
426
|
}
|
|
429
427
|
else {
|
|
430
428
|
onChange(selectedDates, dateStr, instance);
|
|
431
429
|
}
|
|
432
|
-
}
|
|
433
|
-
|
|
430
|
+
}
|
|
431
|
+
isValidDate(date) {
|
|
434
432
|
return date instanceof Date && !isNaN(date.getTime());
|
|
435
|
-
}
|
|
436
|
-
|
|
433
|
+
}
|
|
434
|
+
validateAndRestoreIfNeeded(selectedDate, instance, inputIndex, previousDate) {
|
|
437
435
|
try {
|
|
438
|
-
|
|
436
|
+
const isValid = this.validateDate(selectedDate, inputIndex, previousDate);
|
|
439
437
|
if (!isValid) {
|
|
440
438
|
this.restoreDateToInstance(instance, previousDate);
|
|
441
439
|
}
|
|
@@ -449,11 +447,11 @@ export var DatePicker = /** @class */ (function () {
|
|
|
449
447
|
// 오류 발생 시 이전 값으로 복원
|
|
450
448
|
this.restoreDateToInstance(instance, previousDate);
|
|
451
449
|
}
|
|
452
|
-
}
|
|
453
|
-
|
|
454
|
-
return this.flatpickrInstances.findIndex(
|
|
455
|
-
}
|
|
456
|
-
|
|
450
|
+
}
|
|
451
|
+
findFlatpickrInstanceIndexByInput(input) {
|
|
452
|
+
return this.flatpickrInstances.findIndex((inst) => inst.input === input);
|
|
453
|
+
}
|
|
454
|
+
restoreDateToInstance(instance, previousDate) {
|
|
457
455
|
try {
|
|
458
456
|
// setDate 호출 전에 날짜 유효성 확인
|
|
459
457
|
if (previousDate && this.isValidDate(previousDate)) {
|
|
@@ -473,43 +471,41 @@ export var DatePicker = /** @class */ (function () {
|
|
|
473
471
|
instance.selectedDates = [];
|
|
474
472
|
instance.setDate('', false);
|
|
475
473
|
}
|
|
476
|
-
catch
|
|
474
|
+
catch {
|
|
477
475
|
// 최종 실패 시 무시
|
|
478
476
|
}
|
|
479
477
|
}
|
|
480
|
-
}
|
|
481
|
-
|
|
482
|
-
return
|
|
483
|
-
|
|
484
|
-
var input = instance.input;
|
|
478
|
+
}
|
|
479
|
+
createOnReadyHandler(onInputHandler, onHourInputHandler, onMinuteInputHandler, onBlurHandler) {
|
|
480
|
+
return (selectedDates, dateStr, instance) => {
|
|
481
|
+
const input = instance.input;
|
|
485
482
|
if (!input)
|
|
486
483
|
return;
|
|
487
484
|
input.addEventListener('input', onInputHandler);
|
|
488
485
|
input.addEventListener('blur', onBlurHandler);
|
|
489
|
-
|
|
486
|
+
const timeInputWrapper = input.parentElement?.querySelector('.flatpickr-time');
|
|
490
487
|
if (!timeInputWrapper)
|
|
491
488
|
return;
|
|
492
|
-
|
|
493
|
-
|
|
489
|
+
const hourInput = timeInputWrapper.querySelector('.flatpickr-hour');
|
|
490
|
+
const minuteInput = timeInputWrapper.querySelector('.flatpickr-minute');
|
|
494
491
|
if (!hourInput || !minuteInput)
|
|
495
492
|
return;
|
|
496
493
|
hourInput.addEventListener('input', onHourInputHandler);
|
|
497
494
|
minuteInput.addEventListener('input', onMinuteInputHandler);
|
|
498
495
|
};
|
|
499
|
-
}
|
|
500
|
-
|
|
501
|
-
return
|
|
502
|
-
|
|
503
|
-
var input = instance.input;
|
|
496
|
+
}
|
|
497
|
+
createOnDestroyHandler(onInputHandler, onHourInputHandler, onMinuteInputHandler, onMouseDown, onBlurHandler) {
|
|
498
|
+
return (selectedDates, dateStr, instance) => {
|
|
499
|
+
const input = instance.input;
|
|
504
500
|
if (!input)
|
|
505
501
|
return;
|
|
506
502
|
input.removeEventListener('input', onInputHandler);
|
|
507
503
|
input.removeEventListener('blur', onBlurHandler);
|
|
508
504
|
// hourInput과 minuteInput에서 이벤트 리스너 제거 (input이 아님)
|
|
509
|
-
|
|
505
|
+
const timeInputWrapper = input.parentElement?.querySelector('.flatpickr-time');
|
|
510
506
|
if (timeInputWrapper) {
|
|
511
|
-
|
|
512
|
-
|
|
507
|
+
const hourInput = timeInputWrapper.querySelector('.flatpickr-hour');
|
|
508
|
+
const minuteInput = timeInputWrapper.querySelector('.flatpickr-minute');
|
|
513
509
|
if (hourInput) {
|
|
514
510
|
hourInput.removeEventListener('input', onHourInputHandler);
|
|
515
511
|
}
|
|
@@ -519,8 +515,8 @@ export var DatePicker = /** @class */ (function () {
|
|
|
519
515
|
}
|
|
520
516
|
document.removeEventListener('mousedown', onMouseDown, true);
|
|
521
517
|
};
|
|
522
|
-
}
|
|
523
|
-
|
|
518
|
+
}
|
|
519
|
+
convertDateOption(dateOption) {
|
|
524
520
|
if (!dateOption)
|
|
525
521
|
return undefined;
|
|
526
522
|
if (typeof dateOption === 'string' || dateOption instanceof Date) {
|
|
@@ -533,84 +529,81 @@ export var DatePicker = /** @class */ (function () {
|
|
|
533
529
|
return dateOption[0] instanceof Date ? dateOption[0] : new Date(dateOption[0]);
|
|
534
530
|
}
|
|
535
531
|
return undefined;
|
|
536
|
-
}
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
var option = this.datePickerOptions[index];
|
|
532
|
+
}
|
|
533
|
+
validateDate(date, index, previousDate) {
|
|
534
|
+
const option = this.datePickerOptions[index];
|
|
540
535
|
if (!option)
|
|
541
536
|
return true;
|
|
542
|
-
|
|
537
|
+
const { minDate, maxDate } = option.options;
|
|
543
538
|
if (!minDate && !maxDate)
|
|
544
539
|
return true;
|
|
545
|
-
|
|
540
|
+
const inputDate = moment(date);
|
|
546
541
|
if (!inputDate.isValid())
|
|
547
542
|
return true;
|
|
548
|
-
|
|
543
|
+
const violations = this.checkDateViolations(inputDate, minDate, maxDate);
|
|
549
544
|
if (violations.length === 0)
|
|
550
545
|
return true;
|
|
551
546
|
if (this.onValidationError) {
|
|
552
|
-
|
|
553
|
-
index
|
|
554
|
-
date
|
|
547
|
+
const error = {
|
|
548
|
+
index,
|
|
549
|
+
date,
|
|
555
550
|
minDate: this.convertDateOption(minDate),
|
|
556
551
|
maxDate: this.convertDateOption(maxDate),
|
|
557
|
-
violations
|
|
558
|
-
previousDate
|
|
552
|
+
violations,
|
|
553
|
+
previousDate,
|
|
559
554
|
};
|
|
560
555
|
this.onValidationError(error);
|
|
561
556
|
}
|
|
562
557
|
return false;
|
|
563
|
-
}
|
|
564
|
-
|
|
565
|
-
|
|
558
|
+
}
|
|
559
|
+
checkDateViolations(inputDate, minDate, maxDate) {
|
|
560
|
+
const violations = [];
|
|
566
561
|
if (minDate) {
|
|
567
|
-
|
|
562
|
+
const min = moment(minDate);
|
|
568
563
|
if (min.isValid() && inputDate.isBefore(min, 'day')) {
|
|
569
564
|
violations.push('minDate');
|
|
570
565
|
}
|
|
571
566
|
}
|
|
572
567
|
if (maxDate) {
|
|
573
|
-
|
|
568
|
+
const max = moment(maxDate);
|
|
574
569
|
if (max.isValid() && inputDate.isAfter(max, 'day')) {
|
|
575
570
|
violations.push('maxDate');
|
|
576
571
|
}
|
|
577
572
|
}
|
|
578
573
|
return violations;
|
|
579
|
-
}
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
return _this.formatDateForOption(date, option, index);
|
|
574
|
+
}
|
|
575
|
+
setDate(dates) {
|
|
576
|
+
const [startDate, endDate] = dates;
|
|
577
|
+
const datesToSet = this.datePickerOptions.map((option, index) => {
|
|
578
|
+
const date = index === 0 ? startDate : endDate;
|
|
579
|
+
return this.formatDateForOption(date, option, index);
|
|
586
580
|
});
|
|
587
|
-
|
|
581
|
+
const period = this.calculatePeriod(datesToSet);
|
|
588
582
|
this.updateButtonsByPeriod(period);
|
|
589
583
|
this.setMultipleDates(datesToSet);
|
|
590
|
-
}
|
|
591
|
-
|
|
592
|
-
var _a, _b;
|
|
584
|
+
}
|
|
585
|
+
formatDateForOption(date, option, index) {
|
|
593
586
|
if (!date || date === '0000-00-00')
|
|
594
587
|
return '';
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
588
|
+
const hasTime = option.options?.enableTime;
|
|
589
|
+
const flatpickrFormat = option.options?.dateFormat || (hasTime ? 'Y-m-d H:i' : 'Y-m-d');
|
|
590
|
+
const momentFormat = this.convertFlatpickrFormatToMoment(flatpickrFormat);
|
|
591
|
+
const momentDate = this.parseDateWithMultipleFormats(date, hasTime, momentFormat);
|
|
599
592
|
if (!momentDate || !momentDate.isValid())
|
|
600
593
|
return '';
|
|
601
|
-
|
|
594
|
+
const isValid = this.validateDate(momentDate.toDate(), index);
|
|
602
595
|
if (!isValid)
|
|
603
596
|
return '';
|
|
604
597
|
return this.formatMomentDate(momentDate, date, hasTime, index, momentFormat);
|
|
605
|
-
}
|
|
606
|
-
|
|
598
|
+
}
|
|
599
|
+
parseDateWithMultipleFormats(date, hasTime, momentFormat) {
|
|
607
600
|
// hasTime이 true인 경우 (시간 포함 여부와 무관하게 moment로 파싱)
|
|
608
601
|
if (hasTime) {
|
|
609
|
-
|
|
610
|
-
return
|
|
602
|
+
const momentDate = moment(date);
|
|
603
|
+
return momentDate.isValid() ? momentDate : null;
|
|
611
604
|
}
|
|
612
605
|
// hasTime이 false인 경우 - 여러 형식으로 시도
|
|
613
|
-
|
|
606
|
+
let momentDate = moment(date);
|
|
614
607
|
if (momentDate.isValid()) {
|
|
615
608
|
return momentDate;
|
|
616
609
|
}
|
|
@@ -620,8 +613,8 @@ export var DatePicker = /** @class */ (function () {
|
|
|
620
613
|
}
|
|
621
614
|
momentDate = moment(date, [momentFormat, 'YYYY-MM-DD', 'YYYY/MM/DD', 'MM/DD/YYYY'], true);
|
|
622
615
|
return momentDate.isValid() ? momentDate : null;
|
|
623
|
-
}
|
|
624
|
-
|
|
616
|
+
}
|
|
617
|
+
formatMomentDate(momentDate, originalDate, hasTime, index, momentFormat) {
|
|
625
618
|
// hasTime이 true이고 원본 날짜에 시간이 없는 경우
|
|
626
619
|
if (hasTime && !originalDate.includes(':')) {
|
|
627
620
|
return index === 0
|
|
@@ -629,56 +622,57 @@ export var DatePicker = /** @class */ (function () {
|
|
|
629
622
|
: momentDate.endOf('day').format(momentFormat);
|
|
630
623
|
}
|
|
631
624
|
return momentDate.format(momentFormat);
|
|
632
|
-
}
|
|
633
|
-
|
|
625
|
+
}
|
|
626
|
+
calculatePeriod(datesToSet) {
|
|
634
627
|
if (!datesToSet[0] || !datesToSet[1])
|
|
635
628
|
return null;
|
|
636
629
|
return moment(datesToSet[1]).diff(moment(datesToSet[0]), 'days');
|
|
637
|
-
}
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
var target = e.target;
|
|
630
|
+
}
|
|
631
|
+
updateDateWithButton(e) {
|
|
632
|
+
const target = e.target;
|
|
641
633
|
if (!target.classList.contains(CONSTANTS.CLASS_NAMES.BUTTON))
|
|
642
634
|
return;
|
|
643
|
-
|
|
635
|
+
const clickedButton = this.buttons.find((button) => button.text === target.textContent);
|
|
644
636
|
if (!clickedButton || clickedButton === this.currentButton)
|
|
645
637
|
return;
|
|
646
|
-
|
|
647
|
-
return
|
|
638
|
+
const updateButtonState = () => {
|
|
639
|
+
return this.buttons.map((button) => ({
|
|
640
|
+
...button,
|
|
641
|
+
isCurrent: button.text === clickedButton?.text,
|
|
642
|
+
}));
|
|
648
643
|
};
|
|
649
644
|
this.currentButton = clickedButton;
|
|
650
645
|
this.reRenderButtonGroup(updateButtonState());
|
|
651
646
|
this.setMultipleDates(this.calculateDatesFromButton(clickedButton));
|
|
652
|
-
}
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
(_a = _this.flatpickrInstances[index]) === null || _a === void 0 ? void 0 : _a.setDate(date, shouldTriggerChange);
|
|
659
|
-
(_b = _this.flatpickrInstances[index]) === null || _b === void 0 ? void 0 : _b.redraw();
|
|
647
|
+
}
|
|
648
|
+
setMultipleDates(dates) {
|
|
649
|
+
dates.forEach((date, index) => {
|
|
650
|
+
const shouldTriggerChange = index === dates.length - 1;
|
|
651
|
+
this.flatpickrInstances[index]?.setDate(date, shouldTriggerChange);
|
|
652
|
+
this.flatpickrInstances[index]?.redraw();
|
|
660
653
|
});
|
|
661
|
-
}
|
|
662
|
-
|
|
663
|
-
|
|
654
|
+
}
|
|
655
|
+
updateButtonsByPeriod(period) {
|
|
656
|
+
const newButtons = this.buttons.map((button) => ({
|
|
657
|
+
...button,
|
|
658
|
+
isCurrent: period !== null && button.period === period,
|
|
659
|
+
}));
|
|
664
660
|
this.reRenderButtonGroup(newButtons);
|
|
665
|
-
}
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
|
|
669
|
-
|
|
670
|
-
var _a;
|
|
671
|
-
var hasTime = (_a = option.options) === null || _a === void 0 ? void 0 : _a.enableTime;
|
|
661
|
+
}
|
|
662
|
+
calculateDatesFromButton(button) {
|
|
663
|
+
const { period, unit } = button;
|
|
664
|
+
return this.datePickerOptions.map((option, index) => {
|
|
665
|
+
const hasTime = option.options?.enableTime;
|
|
672
666
|
if (index === 0) {
|
|
673
|
-
|
|
674
|
-
return hasTime ? startMoment.startOf('day').format(
|
|
667
|
+
const startMoment = period ? moment().subtract(period, unit) : moment();
|
|
668
|
+
return hasTime ? startMoment.startOf('day').format(this.dateFormat) : startMoment.format(this.dateFormat);
|
|
675
669
|
}
|
|
676
|
-
return hasTime ? moment().endOf('day').format(
|
|
670
|
+
return hasTime ? moment().endOf('day').format(this.dateFormat) : moment().format(this.dateFormat);
|
|
677
671
|
});
|
|
678
|
-
}
|
|
672
|
+
}
|
|
679
673
|
// flatpickr 형식을 moment 형식으로 변환하는 헬퍼 메서드
|
|
680
|
-
|
|
681
|
-
|
|
674
|
+
convertFlatpickrFormatToMoment(flatpickrFormat) {
|
|
675
|
+
const map = {
|
|
682
676
|
Y: 'YYYY',
|
|
683
677
|
y: 'YY',
|
|
684
678
|
m: 'MM',
|
|
@@ -687,20 +681,19 @@ export var DatePicker = /** @class */ (function () {
|
|
|
687
681
|
i: 'mm',
|
|
688
682
|
S: 'ss',
|
|
689
683
|
};
|
|
690
|
-
return flatpickrFormat.replace(/[YymdHiS]/g,
|
|
691
|
-
}
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
var selectedDates = instance.selectedDates;
|
|
684
|
+
return flatpickrFormat.replace(/[YymdHiS]/g, (matched) => map[matched] || matched);
|
|
685
|
+
}
|
|
686
|
+
getDates() {
|
|
687
|
+
return this.flatpickrInstances.map((instance) => {
|
|
688
|
+
const selectedDates = instance.selectedDates;
|
|
696
689
|
if (selectedDates.length > 0) {
|
|
697
|
-
return moment(selectedDates[0]).format(
|
|
690
|
+
return moment(selectedDates[0]).format(this.dateFormat);
|
|
698
691
|
}
|
|
699
692
|
return '';
|
|
700
693
|
});
|
|
701
|
-
}
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
}
|
|
694
|
+
}
|
|
695
|
+
}
|
|
696
|
+
DatePicker.instanceCounter = 0;
|
|
697
|
+
DatePicker.usedWrappers = new Set(); // 사용된 wrapper 요소 추적용
|
|
698
|
+
export { DatePicker };
|
|
706
699
|
window.DatePicker = DatePicker;
|