@owp/core 2.5.20 → 2.5.22
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/dayjs.d.ts +4 -0
- package/dayjs.js +2 -0
- package/dist/_virtual/isBetween.js +8 -0
- package/dist/_virtual/isBetween.js.map +1 -0
- package/dist/_virtual/isBetween2.js +5 -0
- package/dist/_virtual/isBetween2.js.map +1 -0
- package/dist/components/OwpCommonCode/OwpCommonCodeQuerySelector.js +26 -26
- package/dist/components/OwpCommonCode/OwpCommonCodeQuerySelector.js.map +1 -1
- package/dist/components/OwpCommonCode/OwpCommonCodeSelector.js +29 -29
- package/dist/components/OwpCommonCode/OwpCommonCodeSelector.js.map +1 -1
- package/dist/components/OwpMrtTable/OwpMrtTable.js +144 -141
- package/dist/components/OwpMrtTable/OwpMrtTable.js.map +1 -1
- package/dist/components/OwpOptionSelector/OwpOptionSelector.js +20 -20
- package/dist/components/OwpOptionSelector/OwpOptionSelector.js.map +1 -1
- package/dist/components/OwpPageContent/OwpPageContent.js +20 -19
- package/dist/components/OwpPageContent/OwpPageContent.js.map +1 -1
- package/dist/components/OwpPicker/OwpDatePicker.js +216 -235
- package/dist/components/OwpPicker/OwpDatePicker.js.map +1 -1
- package/dist/components/OwpPicker/OwpDateRangePicker.js +21 -21
- package/dist/components/OwpPicker/OwpDateRangePicker.js.map +1 -1
- package/dist/components/OwpPicker/OwpTimePicker.js +310 -340
- package/dist/components/OwpPicker/OwpTimePicker.js.map +1 -1
- package/dist/components/OwpPicker/OwpWeekDatePicker.js +28 -29
- package/dist/components/OwpPicker/OwpWeekDatePicker.js.map +1 -1
- package/dist/components/OwpPicker/OwpYearRangePicker.js +1 -1
- package/dist/components/OwpPicker/OwpYearRangePicker.js.map +1 -1
- package/dist/components/OwpPicker/constants/index.js +21 -6
- package/dist/components/OwpPicker/constants/index.js.map +1 -1
- package/dist/components/OwpPicker/internal/DatePickerInput.js +5 -5
- package/dist/components/OwpPicker/internal/DatePickerInput.js.map +1 -1
- package/dist/components/OwpPicker/utils/index.js +22 -0
- package/dist/components/OwpPicker/utils/index.js.map +1 -0
- package/dist/components/OwpQuerySelector/OwpQuerySelector.js +218 -205
- package/dist/components/OwpQuerySelector/OwpQuerySelector.js.map +1 -1
- package/dist/components/OwpSection/OwpSection.js +118 -111
- package/dist/components/OwpSection/OwpSection.js.map +1 -1
- package/dist/components/OwpSelectorBase/OwpSelectorAutocomplete.js +59 -59
- package/dist/components/OwpSelectorBase/OwpSelectorAutocomplete.js.map +1 -1
- package/dist/components/OwpSelectorBase/OwpSelectorSelect.js +88 -85
- package/dist/components/OwpSelectorBase/OwpSelectorSelect.js.map +1 -1
- package/dist/components/OwpSelectorBase/hooks/useOwpSelectorBase.js +93 -93
- package/dist/components/OwpSelectorBase/hooks/useOwpSelectorBase.js.map +1 -1
- package/dist/components/OwpTable/OwpDataTable.js +329 -317
- package/dist/components/OwpTable/OwpDataTable.js.map +1 -1
- package/dist/components/OwpTable/OwpFieldTable.js +77 -74
- package/dist/components/OwpTable/OwpFieldTable.js.map +1 -1
- package/dist/components/OwpTable/OwpTable.js +66 -219
- package/dist/components/OwpTable/OwpTable.js.map +1 -1
- package/dist/components/OwpTable/internal/OwpTableBase.js +195 -0
- package/dist/components/OwpTable/internal/OwpTableBase.js.map +1 -0
- package/dist/components/OwpTable/internal/OwpTableTotalCount.js +23 -0
- package/dist/components/OwpTable/internal/OwpTableTotalCount.js.map +1 -0
- package/dist/components/OwpTable/internal/defaultTableStyle.js +10 -10
- package/dist/components/OwpTable/internal/defaultTableStyle.js.map +1 -1
- package/dist/components/OwpTable/utils/tableSx.js +9 -0
- package/dist/components/OwpTable/utils/tableSx.js.map +1 -0
- package/dist/components/OwpTextField/OwpTextMaskField.js +95 -86
- package/dist/components/OwpTextField/OwpTextMaskField.js.map +1 -1
- package/dist/components/OwpTreeGrid/OwpTreeGrid.js +1 -1
- package/dist/components/OwpTreeGrid/OwpTreeGrid.js.map +1 -1
- package/dist/components/OwpTreeGrid/internal/hooks/useOwpTreeGridDatePickerEditor.js +164 -179
- package/dist/components/OwpTreeGrid/internal/hooks/useOwpTreeGridDatePickerEditor.js.map +1 -1
- package/dist/components/OwpTreeGrid/internal/treeGridTheme.js +10 -10
- package/dist/components/OwpTreeGrid/internal/treeGridTheme.js.map +1 -1
- package/dist/components/OwpYesNoSelector/OwpYesNoSelector.js.map +1 -1
- package/dist/dayjs.js +18 -0
- package/dist/dayjs.js.map +1 -0
- package/dist/features/themePreview/components/ThemePreviewCanvas.js +22 -22
- package/dist/features/themePreview/components/ThemePreviewCanvas.js.map +1 -1
- package/dist/features/themePreview/configs/table.js +4 -4
- package/dist/features/themePreview/configs/table.js.map +1 -1
- package/dist/features/themePreview/hooks/useThemePreview.js +16 -16
- package/dist/features/themePreview/hooks/useThemePreview.js.map +1 -1
- package/dist/hooks/{useInitCommonCodes.js → internal/useInitCommonCodes.js} +6 -6
- package/dist/hooks/internal/useInitCommonCodes.js.map +1 -0
- package/dist/hooks/internal/useMinimumVisibleState.js +31 -0
- package/dist/hooks/internal/useMinimumVisibleState.js.map +1 -0
- package/dist/hooks/useInitApp.js +17 -14
- package/dist/hooks/useInitApp.js.map +1 -1
- package/dist/hooks.js +49 -51
- package/dist/hooks.js.map +1 -1
- package/dist/index.js +91 -94
- package/dist/node_modules/.pnpm/dayjs@1.11.18/node_modules/dayjs/plugin/isBetween.js +23 -0
- package/dist/node_modules/.pnpm/dayjs@1.11.18/node_modules/dayjs/plugin/isBetween.js.map +1 -0
- package/dist/node_modules/.pnpm/jsbarcode@3.12.1/node_modules/jsbarcode/bin/barcodes/CODE93/constants.js +1 -1
- package/dist/node_modules/.pnpm/jsbarcode@3.12.1/node_modules/jsbarcode/bin/barcodes/EAN_UPC/constants.js +1 -1
- package/dist/node_modules/.pnpm/jsbarcode@3.12.1/node_modules/jsbarcode/bin/barcodes/ITF/constants.js +1 -1
- package/dist/types/components/OwpCommonCode/OwpCommonCodeQuerySelector.d.ts +3 -3
- package/dist/types/components/OwpCommonCode/OwpCommonCodeSelector.d.ts +3 -3
- package/dist/types/components/OwpMrtTable/OwpMrtTable.d.ts +1 -0
- package/dist/types/components/OwpOptionSelector/OwpOptionSelector.d.ts +2 -2
- package/dist/types/components/OwpPicker/OwpDatePicker.d.ts +1 -1
- package/dist/types/components/OwpPicker/OwpTimePicker.d.ts +2 -2
- package/dist/types/components/OwpPicker/constants/index.d.ts +15 -0
- package/dist/types/components/OwpPicker/utils/index.d.ts +6 -0
- package/dist/types/components/OwpQuerySelector/OwpQuerySelector.d.ts +1 -1
- package/dist/types/components/OwpQuerySelector/types/types.d.ts +1 -0
- package/dist/types/components/OwpSection/OwpSection.d.ts +9 -3
- package/dist/types/components/OwpSelectorBase/hooks/useOwpSelectorBase.d.ts +1 -1
- package/dist/types/components/OwpSelectorBase/types/types.d.ts +1 -1
- package/dist/types/components/OwpTable/OwpDataTable.d.ts +5 -1
- package/dist/types/components/OwpTable/OwpFieldTable.d.ts +7 -1
- package/dist/types/components/OwpTable/OwpTable.d.ts +6 -38
- package/dist/types/components/OwpTable/internal/OwpTableBase.d.ts +34 -0
- package/dist/types/components/OwpTable/internal/OwpTableTotalCount.d.ts +9 -0
- package/dist/types/components/OwpTable/internal/defaultTableStyle.d.ts +4 -2
- package/dist/types/components/OwpTable/utils/tableSx.d.ts +11 -0
- package/dist/types/components/OwpTextField/OwpTextMaskField.d.ts +3 -3
- package/dist/types/components/OwpYesNoSelector/OwpYesNoSelector.d.ts +1 -1
- package/dist/types/dayjs.d.ts +18 -0
- package/dist/types/hooks/index.d.ts +0 -1
- package/dist/types/hooks/internal/useMinimumVisibleState.d.ts +7 -0
- package/dist/types/utils/dayjsBrowser.d.ts +1 -7
- package/dist/types/utils/formatDateToYmd.d.ts +1 -1
- package/dist/utils/formatDateToYmd.js +3 -3
- package/dist/utils/formatDateToYmd.js.map +1 -1
- package/dist/utils/treeGridExportExcelUtil.js +1 -1
- package/dist/utils/treeGridExportExcelUtil.js.map +1 -1
- package/dist/utils/zipUtil.js +3 -3
- package/dist/utils/zipUtil.js.map +1 -1
- package/package.json +3 -1
- package/dist/hooks/useInitCommonCodes.js.map +0 -1
- package/dist/utils/dayjsBrowser.js +0 -16
- package/dist/utils/dayjsBrowser.js.map +0 -1
- /package/dist/types/hooks/{useInitCommonCodes.d.ts → internal/useInitCommonCodes.d.ts} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OwpDatePicker.js","sources":["../../../src/components/OwpPicker/OwpDatePicker.tsx"],"sourcesContent":["import { useOwpTranslation } from '@/hooks/useOwpTranslation';\nimport { ensureDayjsBrowserSetup } from '@/utils/dayjsBrowser';\nimport ClearIcon from '@mui/icons-material/Clear';\nimport { IconButton, InputAdornment, Paper, TextField, TextFieldProps } from '@mui/material';\nimport clsx from 'clsx';\nimport { enUS } from 'date-fns/locale/en-US';\nimport { ko } from 'date-fns/locale/ko';\nimport dayjs from 'dayjs';\nimport {\n type ChangeEvent,\n type HTMLAttributes,\n type KeyboardEvent as ReactKeyboardEvent,\n type ReactNode,\n useMemo,\n useEffect,\n useRef,\n useState,\n} from 'react';\nimport ReactDatePicker, {\n CalendarContainer as ReactDatePickerCalendarContainer,\n DatePickerProps,\n registerLocale,\n setDefaultLocale,\n} from 'react-datepicker';\nimport { AnimatedCalendarContainer } from './internal/AnimatedCalendarContainer';\nimport { CalendarContainer } from './internal/CalendarContainer';\nimport { DatePickerInput } from './internal/DatePickerInput';\nimport {\n PICKER_INVALID_INPUT_MESSAGE_KEY,\n VALUE_DATE_FORMATTER,\n VALUE_MONTH_FORMATTER,\n VALUE_TIME_FORMATTER,\n VALUE_YEAR_FORMATTER,\n} from './constants';\n\nregisterLocale('ko', ko);\nregisterLocale('en', enUS);\nsetDefaultLocale('ko');\nensureDayjsBrowserSetup();\n\nexport type DatePickerValue = string | Date;\ntype DatePickerCalendarContainerProps = HTMLAttributes<HTMLDivElement> & {\n showTime?: boolean;\n showTimeSelectOnly?: boolean;\n};\ntype OwpDatePickerTextFieldFocusEvent = Parameters<NonNullable<TextFieldProps['onFocus']>>[0];\ntype OwpDatePickerTextFieldKeyDownEvent = Parameters<NonNullable<TextFieldProps['onKeyDown']>>[0];\n\n/** focus 가능 요소 여부 */\nconst isFocusableElement = (element: Element): element is HTMLElement => {\n if (!(element instanceof HTMLElement)) {\n return false;\n }\n\n if (element.hasAttribute('disabled') || element.getAttribute('aria-disabled') === 'true') {\n return false;\n }\n\n if (element.tabIndex < 0 || !element.getClientRects().length) {\n return false;\n }\n\n return true;\n};\n\n/** 루트 기준 인접 focus 요소 */\nconst getAdjacentFocusableElement = (rootElement: HTMLElement, isBackward?: boolean) => {\n const focusableElements = Array.from(\n document.querySelectorAll(\n 'a[href],button,input,select,textarea,[tabindex]:not([tabindex=\"-1\"])',\n ),\n ).filter(\n (element): element is HTMLElement =>\n isFocusableElement(element) && !rootElement.contains(element),\n );\n\n if (isBackward) {\n return focusableElements\n .reverse()\n .find((element) =>\n Boolean(rootElement.compareDocumentPosition(element) & Node.DOCUMENT_POSITION_PRECEDING),\n );\n }\n\n return focusableElements.find((element) =>\n Boolean(rootElement.compareDocumentPosition(element) & Node.DOCUMENT_POSITION_FOLLOWING),\n );\n};\n\n/** DatePicker 외부 입력에서 피커 open 처리할 키 여부 */\nconst isDatePickerOpenKey = (event: OwpDatePickerTextFieldKeyDownEvent) => {\n if (\n event.ctrlKey ||\n event.altKey ||\n event.metaKey ||\n event.key === 'Escape' ||\n event.key === 'Enter' ||\n event.key === 'Tab'\n ) {\n return false;\n }\n\n return true;\n};\n\n/** DatePicker 상단 입력 문자열 마스크 */\nconst formatDatePickerInput = (value: string, valueFormatter: string) => {\n const digitLimit =\n valueFormatter === VALUE_YEAR_FORMATTER ? 4 : valueFormatter === VALUE_MONTH_FORMATTER ? 6 : 8;\n const digits = value.replace(/\\D/g, '').slice(0, digitLimit);\n const year = digits.slice(0, 4);\n const month = digits.slice(4, 6);\n const date = digits.slice(6, 8);\n\n if (valueFormatter === VALUE_YEAR_FORMATTER) {\n return year;\n }\n\n if (valueFormatter === VALUE_MONTH_FORMATTER) {\n return [year, month].filter(Boolean).join('-');\n }\n\n return [year, month, date].filter(Boolean).join('-');\n};\n\n/** DatePicker 상단 입력 값 파싱 */\nconst parseDatePickerInput = (value: string, valueFormatter: string) => {\n const normalizedValue = value.trim();\n\n if (valueFormatter === VALUE_YEAR_FORMATTER) {\n const normalizedDateValue = `${normalizedValue}-01-01`;\n const parsedValue = dayjs(normalizedDateValue, VALUE_DATE_FORMATTER, true);\n return parsedValue.isValid() && parsedValue.format(VALUE_DATE_FORMATTER) === normalizedDateValue\n ? parsedValue\n : null;\n }\n\n if (valueFormatter === VALUE_MONTH_FORMATTER) {\n const normalizedDateValue = `${normalizedValue}-01`;\n const parsedValue = dayjs(normalizedDateValue, VALUE_DATE_FORMATTER, true);\n return parsedValue.isValid() && parsedValue.format(VALUE_DATE_FORMATTER) === normalizedDateValue\n ? parsedValue\n : null;\n }\n\n const parsedValue = dayjs(normalizedValue, VALUE_DATE_FORMATTER, true);\n return parsedValue.isValid() && parsedValue.format(VALUE_DATE_FORMATTER) === normalizedValue\n ? parsedValue\n : null;\n};\n\ninterface OwnProps {\n className?: string;\n label?: string;\n variant?: TextFieldProps['variant'];\n sx?: TextFieldProps['sx'];\n value?: DatePickerValue;\n useAmPm?: boolean;\n disabledClearButton?: boolean;\n disabledFutureDates?: boolean;\n showMonthPicker?: boolean;\n fullWidth?: boolean;\n onChange?: (value?: DatePickerValue) => void;\n textFieldProps?: Omit<TextFieldProps, 'value' | 'defaultValue' | 'onChange'>;\n}\n\ntype OwpDatePickerProps = OwnProps & DatePickerProps;\n\n/**\n * OwpDatePicker 컴포넌트\n * @param className CSS 클래스명\n * @param label 입력 라벨\n * @param variant variant 값\n * @param sx sx 값\n * @param value 현재 값\n * @param useAmPm 오전/오후 포맷 사용 여부\n * @param onChange onChange 핸들러\n */\nconst OwpDatePicker = ({\n className,\n label,\n variant = 'standard',\n sx,\n value,\n useAmPm,\n onChange,\n fullWidth,\n showYearPicker,\n showMonthPicker,\n showTimeSelect,\n showTimeSelectOnly,\n showTimeInput,\n textFieldProps,\n disabledClearButton,\n disabledFutureDates,\n popperClassName: popperClassNameProp,\n popperContainer: popperContainerProp,\n ...datePickerProps\n}: OwpDatePickerProps) => {\n const {\n selectsMultiple,\n selectsRange,\n selected,\n startDate,\n endDate,\n calendarContainer: calendarContainerProp,\n open: openProp,\n onCalendarOpen,\n onCalendarClose,\n onClickOutside,\n onInputClick,\n preventOpenOnFocus,\n ...resolvedDatePickerProps\n } = datePickerProps;\n void [selectsMultiple, selectsRange, selected, startDate, endDate];\n const { t, i18n } = useOwpTranslation();\n const [popperPlacement, setPopperPlacement] =\n useState<NonNullable<DatePickerProps['popperPlacement']>>('bottom-start');\n const [isCalendarOpen, setIsCalendarOpen] = useState(false);\n const [inputDraftValue, setInputDraftValue] = useState('');\n const [hasPickerInputCommitError, setHasPickerInputCommitError] = useState(false);\n const rootRef = useRef<HTMLDivElement | null>(null);\n const externalInputRef = useRef<HTMLInputElement | null>(null);\n const pickerInputRef = useRef<HTMLInputElement | null>(null);\n const datePickerRef = useRef<ReactDatePicker | null>(null);\n const suppressOpenUntilRef = useRef(0);\n const languageId = i18n.resolvedLanguage ?? i18n.language ?? 'kr';\n const datePickerLocale = languageId === 'kr' ? 'ko' : 'en';\n\n const valueFormatter = useMemo(() => {\n if (showYearPicker) {\n return VALUE_YEAR_FORMATTER;\n }\n\n if (showMonthPicker) {\n return VALUE_MONTH_FORMATTER;\n }\n\n if (showTimeSelectOnly) {\n return VALUE_TIME_FORMATTER;\n }\n\n if (showTimeInput || showTimeSelect) {\n return `${VALUE_DATE_FORMATTER} ${VALUE_TIME_FORMATTER}`;\n }\n return VALUE_DATE_FORMATTER;\n }, [showYearPicker, showMonthPicker, showTimeInput, showTimeSelect, showTimeSelectOnly]);\n\n const selectedValue = useMemo(() => {\n if (!value) return null;\n\n if (showTimeSelectOnly && typeof value === 'string') {\n const [hoursText = '', minutesText = ''] = value.split(':');\n const hours = Number(hoursText);\n const minutes = Number(minutesText);\n\n if (Number.isNaN(hours) || Number.isNaN(minutes)) {\n return null;\n }\n\n const selectedDate = new Date();\n selectedDate.setHours(hours, minutes, 0, 0);\n\n return selectedDate;\n }\n\n return new Date(value);\n }, [showTimeSelectOnly, value]);\n\n const selectedInputValue = useMemo(() => {\n if (!value || typeof value !== 'string') {\n return value ? dayjs(value).format(valueFormatter) : '';\n }\n\n const parsedValue = parseDatePickerInput(value, valueFormatter);\n\n return parsedValue?.isValid() ? parsedValue.format(valueFormatter) : value;\n }, [value, valueFormatter]);\n const allowPickerInput = !showTimeSelectOnly && !showTimeInput && !showTimeSelect;\n const selectedPickerValue = useMemo(() => {\n if (!allowPickerInput || !inputDraftValue) {\n return selectedValue;\n }\n\n const parsedInputDraftValue = parseDatePickerInput(inputDraftValue, valueFormatter);\n\n return parsedInputDraftValue?.isValid() ? parsedInputDraftValue.toDate() : selectedValue;\n }, [allowPickerInput, inputDraftValue, selectedValue, valueFormatter]);\n\n const handleSelect = (dateValue?: Date | null) => {\n const nextValue = dateValue ? dayjs(dateValue).format(valueFormatter) : undefined;\n\n setInputDraftValue(nextValue ?? '');\n setHasPickerInputCommitError(false);\n onChange?.(nextValue);\n\n if (allowPickerInput) {\n suppressOpenUntilRef.current = Date.now() + 200;\n focusExternalInput();\n }\n };\n\n const openPicker = () => {\n if (Date.now() < suppressOpenUntilRef.current) {\n return;\n }\n\n if (allowPickerInput) {\n setIsCalendarOpen(true);\n setInputDraftValue(selectedInputValue);\n setHasPickerInputCommitError(false);\n }\n };\n\n const closePicker = (skipSetBlur?: boolean) => {\n if (allowPickerInput) {\n setIsCalendarOpen(false);\n }\n\n datePickerRef.current?.setOpen(false, skipSetBlur);\n };\n\n const focusAdjacentElement = (isBackward?: boolean) => {\n const rootElement = rootRef.current;\n\n if (!rootElement) {\n return;\n }\n\n window.requestAnimationFrame(() => {\n getAdjacentFocusableElement(rootElement, isBackward)?.focus();\n });\n };\n\n const focusExternalInput = () => {\n window.requestAnimationFrame(() => {\n externalInputRef.current?.focus();\n });\n };\n\n const commitInputDraftValue = (showError?: boolean) => {\n if (!inputDraftValue) {\n setHasPickerInputCommitError(false);\n onChange?.('');\n\n return true;\n }\n\n const parsedInput = parseDatePickerInput(inputDraftValue, valueFormatter);\n\n if (!parsedInput?.isValid()) {\n if (showError && inputDraftValue) {\n setHasPickerInputCommitError(true);\n }\n\n return false;\n }\n\n const nextValue = parsedInput.format(valueFormatter);\n setInputDraftValue(nextValue);\n setHasPickerInputCommitError(false);\n onChange?.(nextValue);\n\n return true;\n };\n\n const handleCalendarOpen = () => {\n setIsCalendarOpen(true);\n setInputDraftValue(selectedInputValue);\n setHasPickerInputCommitError(false);\n onCalendarOpen?.();\n };\n\n const handleCalendarClose = () => {\n setIsCalendarOpen(false);\n setHasPickerInputCommitError(false);\n onCalendarClose?.();\n };\n\n const handleInputClick = () => {\n openPicker();\n onInputClick?.();\n };\n\n const handleExternalInputFocus = (event: OwpDatePickerTextFieldFocusEvent) => {\n textFieldProps?.onFocus?.(event);\n\n if (event.defaultPrevented || !allowPickerInput) {\n return;\n }\n\n openPicker();\n };\n\n const handleExternalInputKeyDown = (event: OwpDatePickerTextFieldKeyDownEvent) => {\n textFieldProps?.onKeyDown?.(event);\n\n if (event.defaultPrevented || !isDatePickerOpenKey(event)) {\n return;\n }\n\n openPicker();\n };\n\n const handleClickOutside: NonNullable<DatePickerProps['onClickOutside']> = (event) => {\n commitInputDraftValue();\n closePicker();\n onClickOutside?.(event);\n };\n\n const handlePickerInputChange = (event: ChangeEvent<HTMLInputElement>) => {\n setInputDraftValue(formatDatePickerInput(event.target.value, valueFormatter));\n setHasPickerInputCommitError(false);\n };\n\n const handlePickerInputKeyDown = (event: ReactKeyboardEvent<HTMLInputElement>) => {\n event.stopPropagation();\n event.nativeEvent.stopImmediatePropagation();\n\n if (event.key === 'Escape') {\n event.preventDefault();\n setInputDraftValue(selectedInputValue);\n setHasPickerInputCommitError(false);\n suppressOpenUntilRef.current = Date.now() + 200;\n closePicker(true);\n focusExternalInput();\n return;\n }\n\n if (event.key !== 'Enter' && event.key !== 'Tab') {\n return;\n }\n\n event.preventDefault();\n\n if (!commitInputDraftValue(true)) {\n return;\n }\n\n if (event.key === 'Tab') {\n suppressOpenUntilRef.current = Date.now() + 200;\n closePicker(true);\n focusAdjacentElement(event.shiftKey);\n return;\n }\n\n suppressOpenUntilRef.current = Date.now() + 200;\n closePicker(true);\n focusExternalInput();\n };\n\n const handlePickerInputClear = () => {\n setInputDraftValue('');\n setHasPickerInputCommitError(false);\n onChange?.('');\n };\n\n const handleInputAreaClick = () => {\n if (!showTimeSelectOnly) {\n return;\n }\n\n setPopperPlacement('bottom-start');\n };\n\n const handleIconClick = () => {\n if (!showTimeSelectOnly) {\n return;\n }\n\n setPopperPlacement('bottom-end');\n };\n\n useEffect(() => {\n if (!allowPickerInput || !isCalendarOpen) {\n return undefined;\n }\n\n const animationFrameId = window.requestAnimationFrame(() => {\n pickerInputRef.current?.focus();\n });\n const focusTimerId = window.setTimeout(() => {\n pickerInputRef.current?.focus();\n });\n\n return () => {\n window.cancelAnimationFrame(animationFrameId);\n window.clearTimeout(focusTimerId);\n };\n }, [allowPickerInput, isCalendarOpen]);\n\n const PopperContainer = ({ children }: { children?: ReactNode }) => (\n <AnimatedCalendarContainer container={popperContainerProp ?? CalendarContainer}>\n {children}\n </AnimatedCalendarContainer>\n );\n\n const DatePickerCalendarContainer = ({\n children,\n className: calendarContainerClassName,\n ...calendarContainerProps\n }: DatePickerCalendarContainerProps) => {\n if (!allowPickerInput) {\n const ContainerComponent = calendarContainerProp ?? ReactDatePickerCalendarContainer;\n\n return (\n <ContainerComponent className={calendarContainerClassName} {...calendarContainerProps}>\n {children}\n </ContainerComponent>\n );\n }\n\n return (\n <Paper\n className=\"OwpDatePickerCalendarEditor\"\n elevation={8}\n sx={{\n borderRadius: 1,\n lineHeight: 0,\n overflow: 'hidden',\n width: 'auto',\n '& .react-datepicker': {\n border: 0,\n display: 'block',\n lineHeight: 'normal',\n },\n '& .react-datepicker__month-container': {\n float: 'none',\n },\n '& .react-datepicker__month': {\n marginBottom: 0,\n },\n }}\n >\n <TextField\n autoFocus\n inputRef={pickerInputRef}\n fullWidth\n size=\"small\"\n value={inputDraftValue}\n error={hasPickerInputCommitError}\n helperText={hasPickerInputCommitError ? t(PICKER_INVALID_INPUT_MESSAGE_KEY) : undefined}\n placeholder={valueFormatter}\n onChange={handlePickerInputChange}\n onKeyDown={handlePickerInputKeyDown}\n slotProps={{\n htmlInput: {\n inputMode: 'numeric',\n 'aria-label': valueFormatter,\n },\n input: {\n sx: {\n paddingRight: 0.5,\n },\n endAdornment: (\n <InputAdornment\n position=\"end\"\n sx={{\n marginLeft: 0,\n }}\n >\n <IconButton\n size=\"small\"\n tabIndex={-1}\n aria-label={t('Button.초기화')}\n disabled={!inputDraftValue}\n onClick={handlePickerInputClear}\n onMouseDown={(event) => {\n event.preventDefault();\n event.stopPropagation();\n }}\n sx={{\n margin: 0,\n padding: 0.25,\n }}\n >\n <ClearIcon fontSize=\"small\" />\n </IconButton>\n </InputAdornment>\n ),\n },\n }}\n sx={{\n boxSizing: 'border-box',\n width: '100%',\n px: 1,\n py: 1,\n '& .MuiOutlinedInput-root': {\n borderRadius: 0.75,\n fontSize: 13,\n },\n }}\n />\n <div\n className={calendarContainerClassName}\n {...calendarContainerProps}\n style={{\n ...calendarContainerProps.style,\n border: 0,\n display: 'block',\n lineHeight: 'normal',\n position: 'relative',\n }}\n >\n {children}\n </div>\n </Paper>\n );\n };\n\n return (\n <div ref={rootRef} className={clsx(fullWidth && 'w-full')}>\n <ReactDatePicker\n ref={datePickerRef}\n locale={datePickerLocale}\n calendarContainer={DatePickerCalendarContainer}\n popperPlacement={showTimeSelectOnly ? popperPlacement : 'bottom-start'}\n popperContainer={PopperContainer}\n popperClassName={clsx('owp-animated-datepicker-popper', popperClassNameProp)}\n className={clsx(fullWidth && 'w-full')}\n wrapperClassName={clsx(fullWidth && 'w-full', datePickerProps?.wrapperClassName)}\n maxDate={disabledFutureDates ? new Date() : undefined}\n showYearPicker={showYearPicker}\n showMonthYearPicker={showMonthPicker}\n showTimeSelect={showTimeSelect}\n showTimeSelectOnly={showTimeSelectOnly}\n showTimeInput={showTimeInput}\n showPopperArrow={false}\n open={allowPickerInput ? isCalendarOpen : openProp}\n preventOpenOnFocus={allowPickerInput ? true : preventOpenOnFocus}\n selected={selectedPickerValue}\n onChange={handleSelect}\n onCalendarOpen={handleCalendarOpen}\n onCalendarClose={handleCalendarClose}\n onClickOutside={handleClickOutside}\n onInputClick={handleInputClick}\n dateFormat={showTimeSelectOnly ? (useAmPm ? 'aa hh:mm' : VALUE_TIME_FORMATTER) : 'Pp'}\n timeFormat={showTimeSelectOnly ? (useAmPm ? 'aa hh:mm' : VALUE_TIME_FORMATTER) : undefined}\n customInput={\n <DatePickerInput\n className={clsx(\n showYearPicker && 'w-[140px]',\n showMonthPicker && 'w-[160px]',\n !showYearPicker && !showMonthPicker && 'w-[172px]',\n (showTimeInput || showTimeSelect) && 'w-[200px]',\n showTimeSelectOnly && !useAmPm && 'w-[140px]',\n showTimeSelectOnly && useAmPm && 'w-[170px]',\n className,\n )}\n label={label}\n variant={variant}\n sx={sx}\n {...textFieldProps}\n inputElementRef={externalInputRef}\n onInputFocus={handleExternalInputFocus}\n onInputKeyDown={handleExternalInputKeyDown}\n reset={() => onChange?.('')}\n fullWidth={fullWidth}\n disabledClearButton={disabledClearButton}\n valueFormatter={valueFormatter}\n showTimeSelect={showTimeSelect}\n showTimeSelectOnly={showTimeSelectOnly}\n onInputAreaClick={handleInputAreaClick}\n onIconClick={handleIconClick}\n />\n }\n timeCaption={showTimeSelectOnly ? `${t('Common.시간')}: ` : undefined}\n timeInputLabel={`${t('Common.시간')}: `}\n {...resolvedDatePickerProps}\n />\n </div>\n );\n};\n\nexport { OwpDatePicker };\n"],"names":["registerLocale","ko","enUS","setDefaultLocale","ensureDayjsBrowserSetup","isFocusableElement","__name","element","getAdjacentFocusableElement","rootElement","isBackward","focusableElements","isDatePickerOpenKey","event","formatDatePickerInput","value","valueFormatter","digitLimit","VALUE_YEAR_FORMATTER","VALUE_MONTH_FORMATTER","digits","year","month","date","parseDatePickerInput","normalizedValue","normalizedDateValue","parsedValue","dayjs","VALUE_DATE_FORMATTER","OwpDatePicker","className","label","variant","sx","useAmPm","onChange","fullWidth","showYearPicker","showMonthPicker","showTimeSelect","showTimeSelectOnly","showTimeInput","textFieldProps","disabledClearButton","disabledFutureDates","popperClassNameProp","popperContainerProp","datePickerProps","selectsMultiple","selectsRange","selected","startDate","endDate","calendarContainerProp","openProp","onCalendarOpen","onCalendarClose","onClickOutside","onInputClick","preventOpenOnFocus","resolvedDatePickerProps","t","i18n","useOwpTranslation","popperPlacement","setPopperPlacement","useState","isCalendarOpen","setIsCalendarOpen","inputDraftValue","setInputDraftValue","hasPickerInputCommitError","setHasPickerInputCommitError","rootRef","useRef","externalInputRef","pickerInputRef","datePickerRef","suppressOpenUntilRef","datePickerLocale","useMemo","VALUE_TIME_FORMATTER","selectedValue","hoursText","minutesText","hours","minutes","selectedDate","selectedInputValue","allowPickerInput","selectedPickerValue","parsedInputDraftValue","handleSelect","dateValue","nextValue","focusExternalInput","openPicker","closePicker","skipSetBlur","_a","focusAdjacentElement","commitInputDraftValue","showError","parsedInput","handleCalendarOpen","handleCalendarClose","handleInputClick","handleExternalInputFocus","handleExternalInputKeyDown","handleClickOutside","handlePickerInputChange","handlePickerInputKeyDown","handlePickerInputClear","handleInputAreaClick","handleIconClick","useEffect","animationFrameId","focusTimerId","PopperContainer","children","AnimatedCalendarContainer","CalendarContainer","DatePickerCalendarContainer","calendarContainerClassName","calendarContainerProps","jsxs","Paper","jsx","TextField","PICKER_INVALID_INPUT_MESSAGE_KEY","InputAdornment","IconButton","ClearIcon","ReactDatePickerCalendarContainer","clsx","ReactDatePicker","DatePickerInput"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"OwpDatePicker.js","sources":["../../../src/components/OwpPicker/OwpDatePicker.tsx"],"sourcesContent":["import { useOwpTranslation } from '@/hooks/useOwpTranslation';\nimport { ensureDayjsBrowserSetup } from '@/utils/dayjsBrowser';\nimport ClearIcon from '@mui/icons-material/Clear';\nimport { IconButton, InputAdornment, Paper, type TextFieldProps } from '@mui/material';\nimport clsx from 'clsx';\nimport { enUS } from 'date-fns/locale/en-US';\nimport { ko } from 'date-fns/locale/ko';\nimport dayjs from '@/dayjs';\nimport {\n type HTMLAttributes,\n type KeyboardEvent as ReactKeyboardEvent,\n type ReactNode,\n useMemo,\n useEffect,\n useRef,\n useState,\n} from 'react';\nimport ReactDatePicker, {\n CalendarContainer as ReactDatePickerCalendarContainer,\n DatePickerProps,\n registerLocale,\n setDefaultLocale,\n} from 'react-datepicker';\nimport { AnimatedCalendarContainer } from './internal/AnimatedCalendarContainer';\nimport { CalendarContainer } from './internal/CalendarContainer';\nimport { DatePickerInput } from './internal/DatePickerInput';\nimport { OwpTextMaskField, type OwpTextMaskFieldChangeEvent } from '../OwpTextField';\nimport {\n PICKER_INVALID_INPUT_MESSAGE_KEY,\n VALUE_DATE_FORMATTER,\n VALUE_MONTH_FORMATTER,\n VALUE_TIME_FORMATTER,\n VALUE_YEAR_FORMATTER,\n} from './constants';\nimport { getAdjacentFocusableElement, getPickerInputMask } from './utils';\n\nregisterLocale('ko', ko);\nregisterLocale('en', enUS);\nsetDefaultLocale('ko');\nensureDayjsBrowserSetup();\n\nexport type DatePickerValue = string | Date;\ntype DatePickerCalendarContainerProps = HTMLAttributes<HTMLDivElement> & {\n showTime?: boolean;\n showTimeSelectOnly?: boolean;\n};\ntype OwpDatePickerTextFieldFocusEvent = Parameters<NonNullable<TextFieldProps['onFocus']>>[0];\ntype OwpDatePickerTextFieldKeyDownEvent = Parameters<NonNullable<TextFieldProps['onKeyDown']>>[0];\n\n/** DatePicker 외부 입력에서 피커 open 처리할 키 여부 */\nconst isDatePickerOpenKey = (event: OwpDatePickerTextFieldKeyDownEvent) => {\n if (\n event.ctrlKey ||\n event.altKey ||\n event.metaKey ||\n event.key === 'Escape' ||\n event.key === 'Enter' ||\n event.key === 'Tab'\n ) {\n return false;\n }\n\n return true;\n};\n\n/** DatePicker 상단 입력 값 파싱 */\nconst parseDatePickerInput = (value: string, valueFormatter: string) => {\n const normalizedValue = value.trim();\n\n if (valueFormatter === VALUE_YEAR_FORMATTER) {\n const normalizedDateValue = `${normalizedValue}-01-01`;\n const parsedValue = dayjs(normalizedDateValue, VALUE_DATE_FORMATTER, true);\n return parsedValue.isValid() && parsedValue.format(VALUE_DATE_FORMATTER) === normalizedDateValue\n ? parsedValue\n : null;\n }\n\n if (valueFormatter === VALUE_MONTH_FORMATTER) {\n const normalizedDateValue = `${normalizedValue}-01`;\n const parsedValue = dayjs(normalizedDateValue, VALUE_DATE_FORMATTER, true);\n return parsedValue.isValid() && parsedValue.format(VALUE_DATE_FORMATTER) === normalizedDateValue\n ? parsedValue\n : null;\n }\n\n const parsedValue = dayjs(normalizedValue, VALUE_DATE_FORMATTER, true);\n return parsedValue.isValid() && parsedValue.format(VALUE_DATE_FORMATTER) === normalizedValue\n ? parsedValue\n : null;\n};\n\ninterface OwnProps {\n className?: string;\n label?: string;\n variant?: TextFieldProps['variant'];\n sx?: TextFieldProps['sx'];\n value?: DatePickerValue;\n useAmPm?: boolean;\n disabledClearButton?: boolean;\n disabledFutureDates?: boolean;\n showMonthPicker?: boolean;\n fullWidth?: boolean;\n onChange?: (value?: DatePickerValue) => void;\n textFieldProps?: Omit<TextFieldProps, 'value' | 'defaultValue' | 'onChange'>;\n}\n\ntype OwpDatePickerProps = OwnProps & DatePickerProps;\n\n/**\n * OwpDatePicker 컴포넌트\n * @param className CSS 클래스명\n * @param label 입력 라벨\n * @param variant variant 값\n * @param sx sx 값\n * @param value 현재 값\n * @param useAmPm 오전/오후 포맷 사용 여부\n * @param onChange onChange 핸들러\n */\nconst OwpDatePicker = ({\n className,\n label,\n variant = 'standard',\n sx,\n value,\n useAmPm,\n onChange,\n fullWidth,\n showYearPicker,\n showMonthPicker,\n showTimeSelect,\n showTimeSelectOnly,\n showTimeInput,\n textFieldProps,\n disabledClearButton,\n disabledFutureDates,\n popperClassName: popperClassNameProp,\n popperContainer: popperContainerProp,\n ...datePickerProps\n}: OwpDatePickerProps) => {\n const {\n selectsMultiple,\n selectsRange,\n selected,\n startDate,\n endDate,\n calendarContainer: calendarContainerProp,\n open: openProp,\n onCalendarOpen,\n onCalendarClose,\n onClickOutside,\n onInputClick,\n preventOpenOnFocus,\n ...resolvedDatePickerProps\n } = datePickerProps;\n void [selectsMultiple, selectsRange, selected, startDate, endDate];\n const { t, i18n } = useOwpTranslation();\n const [popperPlacement, setPopperPlacement] =\n useState<NonNullable<DatePickerProps['popperPlacement']>>('bottom-start');\n const [isCalendarOpen, setIsCalendarOpen] = useState(false);\n const [inputDraftValue, setInputDraftValue] = useState('');\n const [hasPickerInputCommitError, setHasPickerInputCommitError] = useState(false);\n const rootRef = useRef<HTMLDivElement | null>(null);\n const externalInputRef = useRef<HTMLInputElement | null>(null);\n const pickerInputRef = useRef<HTMLInputElement | null>(null);\n const datePickerRef = useRef<ReactDatePicker | null>(null);\n const suppressOpenUntilRef = useRef(0);\n const languageId = i18n.resolvedLanguage ?? i18n.language ?? 'kr';\n const datePickerLocale = languageId === 'kr' ? 'ko' : 'en';\n\n const valueFormatter = useMemo(() => {\n if (showYearPicker) {\n return VALUE_YEAR_FORMATTER;\n }\n\n if (showMonthPicker) {\n return VALUE_MONTH_FORMATTER;\n }\n\n if (showTimeSelectOnly) {\n return VALUE_TIME_FORMATTER;\n }\n\n if (showTimeInput || showTimeSelect) {\n return `${VALUE_DATE_FORMATTER} ${VALUE_TIME_FORMATTER}`;\n }\n return VALUE_DATE_FORMATTER;\n }, [showYearPicker, showMonthPicker, showTimeInput, showTimeSelect, showTimeSelectOnly]);\n\n const selectedValue = useMemo(() => {\n if (!value) return null;\n\n if (showTimeSelectOnly && typeof value === 'string') {\n const [hoursText = '', minutesText = ''] = value.split(':');\n const hours = Number(hoursText);\n const minutes = Number(minutesText);\n\n if (Number.isNaN(hours) || Number.isNaN(minutes)) {\n return null;\n }\n\n const selectedDate = new Date();\n selectedDate.setHours(hours, minutes, 0, 0);\n\n return selectedDate;\n }\n\n return new Date(value);\n }, [showTimeSelectOnly, value]);\n\n const selectedInputValue = useMemo(() => {\n if (!value || typeof value !== 'string') {\n return value ? dayjs(value).format(valueFormatter) : '';\n }\n\n const parsedValue = parseDatePickerInput(value, valueFormatter);\n\n return parsedValue?.isValid() ? parsedValue.format(valueFormatter) : value;\n }, [value, valueFormatter]);\n const allowPickerInput = !showTimeSelectOnly && !showTimeInput && !showTimeSelect;\n const selectedPickerValue = useMemo(() => {\n if (!allowPickerInput || !inputDraftValue) {\n return selectedValue;\n }\n\n const parsedInputDraftValue = parseDatePickerInput(inputDraftValue, valueFormatter);\n\n return parsedInputDraftValue?.isValid() ? parsedInputDraftValue.toDate() : selectedValue;\n }, [allowPickerInput, inputDraftValue, selectedValue, valueFormatter]);\n\n const handleSelect = (dateValue?: Date | null) => {\n const nextValue = dateValue ? dayjs(dateValue).format(valueFormatter) : undefined;\n\n setInputDraftValue(nextValue ?? '');\n setHasPickerInputCommitError(false);\n onChange?.(nextValue);\n\n if (allowPickerInput) {\n suppressOpenUntilRef.current = Date.now() + 200;\n focusExternalInput();\n }\n };\n\n const openPicker = () => {\n if (Date.now() < suppressOpenUntilRef.current) {\n return;\n }\n\n if (allowPickerInput) {\n setIsCalendarOpen(true);\n setInputDraftValue(selectedInputValue);\n setHasPickerInputCommitError(false);\n }\n };\n\n const closePicker = (skipSetBlur?: boolean) => {\n if (allowPickerInput) {\n setIsCalendarOpen(false);\n }\n\n datePickerRef.current?.setOpen(false, skipSetBlur);\n };\n\n const focusAdjacentElement = (isBackward?: boolean) => {\n const rootElement = rootRef.current;\n\n if (!rootElement) {\n return;\n }\n\n window.requestAnimationFrame(() => {\n getAdjacentFocusableElement(rootElement, isBackward)?.focus();\n });\n };\n\n const focusExternalInput = () => {\n window.requestAnimationFrame(() => {\n externalInputRef.current?.focus();\n });\n };\n\n const commitInputDraftValue = (showError?: boolean) => {\n if (!inputDraftValue) {\n setHasPickerInputCommitError(false);\n onChange?.('');\n\n return true;\n }\n\n const parsedInput = parseDatePickerInput(inputDraftValue, valueFormatter);\n\n if (!parsedInput?.isValid()) {\n if (showError && inputDraftValue) {\n setHasPickerInputCommitError(true);\n }\n\n return false;\n }\n\n const nextValue = parsedInput.format(valueFormatter);\n setInputDraftValue(nextValue);\n setHasPickerInputCommitError(false);\n onChange?.(nextValue);\n\n return true;\n };\n\n const handleCalendarOpen = () => {\n setIsCalendarOpen(true);\n setInputDraftValue(selectedInputValue);\n setHasPickerInputCommitError(false);\n onCalendarOpen?.();\n };\n\n const handleCalendarClose = () => {\n setIsCalendarOpen(false);\n setHasPickerInputCommitError(false);\n onCalendarClose?.();\n };\n\n const handleInputClick = () => {\n openPicker();\n onInputClick?.();\n };\n\n const handleExternalInputFocus = (event: OwpDatePickerTextFieldFocusEvent) => {\n textFieldProps?.onFocus?.(event);\n\n if (event.defaultPrevented || !allowPickerInput) {\n return;\n }\n\n openPicker();\n };\n\n const handleExternalInputKeyDown = (event: OwpDatePickerTextFieldKeyDownEvent) => {\n textFieldProps?.onKeyDown?.(event);\n\n if (event.defaultPrevented || !isDatePickerOpenKey(event)) {\n return;\n }\n\n openPicker();\n };\n\n const handleClickOutside: NonNullable<DatePickerProps['onClickOutside']> = (event) => {\n commitInputDraftValue();\n closePicker();\n onClickOutside?.(event);\n };\n\n const handlePickerInputChange = (event: OwpTextMaskFieldChangeEvent) => {\n setInputDraftValue(event.target.value);\n setHasPickerInputCommitError(false);\n };\n\n const handlePickerInputKeyDown = (event: ReactKeyboardEvent<HTMLInputElement>) => {\n event.stopPropagation();\n event.nativeEvent.stopImmediatePropagation();\n\n if (event.key === 'Escape') {\n event.preventDefault();\n setInputDraftValue(selectedInputValue);\n setHasPickerInputCommitError(false);\n suppressOpenUntilRef.current = Date.now() + 200;\n closePicker(true);\n focusExternalInput();\n return;\n }\n\n if (event.key !== 'Enter' && event.key !== 'Tab') {\n return;\n }\n\n event.preventDefault();\n\n if (!commitInputDraftValue(true)) {\n return;\n }\n\n if (event.key === 'Tab') {\n suppressOpenUntilRef.current = Date.now() + 200;\n closePicker(true);\n focusAdjacentElement(event.shiftKey);\n return;\n }\n\n suppressOpenUntilRef.current = Date.now() + 200;\n closePicker(true);\n focusExternalInput();\n };\n\n const handlePickerInputClear = () => {\n setInputDraftValue('');\n setHasPickerInputCommitError(false);\n onChange?.('');\n };\n\n const handleInputAreaClick = () => {\n if (!showTimeSelectOnly) {\n return;\n }\n\n setPopperPlacement('bottom-start');\n };\n\n const handleIconClick = () => {\n if (!showTimeSelectOnly) {\n return;\n }\n\n setPopperPlacement('bottom-end');\n };\n\n useEffect(() => {\n if (!allowPickerInput || !isCalendarOpen) {\n return undefined;\n }\n\n const animationFrameId = window.requestAnimationFrame(() => {\n pickerInputRef.current?.focus();\n });\n const focusTimerId = window.setTimeout(() => {\n pickerInputRef.current?.focus();\n });\n\n return () => {\n window.cancelAnimationFrame(animationFrameId);\n window.clearTimeout(focusTimerId);\n };\n }, [allowPickerInput, isCalendarOpen]);\n\n const PopperContainer = ({ children }: { children?: ReactNode }) => (\n <AnimatedCalendarContainer container={popperContainerProp ?? CalendarContainer}>\n {children}\n </AnimatedCalendarContainer>\n );\n\n const DatePickerCalendarContainer = ({\n children,\n className: calendarContainerClassName,\n ...calendarContainerProps\n }: DatePickerCalendarContainerProps) => {\n if (!allowPickerInput) {\n const ContainerComponent = calendarContainerProp ?? ReactDatePickerCalendarContainer;\n\n return (\n <ContainerComponent className={calendarContainerClassName} {...calendarContainerProps}>\n {children}\n </ContainerComponent>\n );\n }\n\n return (\n <Paper\n className=\"OwpDatePickerCalendarEditor\"\n elevation={8}\n sx={{\n borderRadius: 1,\n lineHeight: 0,\n overflow: 'hidden',\n width: 'auto',\n '& .react-datepicker': {\n border: 0,\n display: 'block',\n lineHeight: 'normal',\n },\n '& .react-datepicker__month-container': {\n float: 'none',\n },\n '& .react-datepicker__month': {\n marginBottom: 0,\n },\n }}\n >\n <OwpTextMaskField\n autoFocus\n inputRef={pickerInputRef}\n fullWidth\n size=\"small\"\n variant=\"outlined\"\n value={inputDraftValue}\n error={hasPickerInputCommitError}\n helperText={hasPickerInputCommitError ? t(PICKER_INVALID_INPUT_MESSAGE_KEY) : undefined}\n mask={getPickerInputMask(valueFormatter)}\n placeholder={valueFormatter}\n onChange={handlePickerInputChange}\n onKeyDown={handlePickerInputKeyDown}\n inputProps={{\n inputMode: 'numeric',\n 'aria-label': valueFormatter,\n }}\n endAdornment={\n <InputAdornment\n position=\"end\"\n sx={{\n marginLeft: 0,\n }}\n >\n <IconButton\n size=\"small\"\n tabIndex={-1}\n aria-label={t('Button.초기화')}\n disabled={!inputDraftValue}\n onClick={handlePickerInputClear}\n onMouseDown={(event) => {\n event.preventDefault();\n event.stopPropagation();\n }}\n sx={{\n margin: 0,\n padding: 0.25,\n }}\n >\n <ClearIcon fontSize=\"small\" />\n </IconButton>\n </InputAdornment>\n }\n sx={{\n boxSizing: 'border-box',\n width: '100%',\n px: 1,\n py: 1,\n '& .MuiOutlinedInput-root': {\n borderRadius: 0.75,\n fontSize: 13,\n paddingRight: 0.5,\n },\n }}\n />\n <div\n className={calendarContainerClassName}\n {...calendarContainerProps}\n style={{\n ...calendarContainerProps.style,\n border: 0,\n display: 'block',\n lineHeight: 'normal',\n position: 'relative',\n }}\n >\n {children}\n </div>\n </Paper>\n );\n };\n\n return (\n <div ref={rootRef} className={clsx(fullWidth && 'w-full')}>\n <ReactDatePicker\n ref={datePickerRef}\n locale={datePickerLocale}\n calendarContainer={DatePickerCalendarContainer}\n popperPlacement={showTimeSelectOnly ? popperPlacement : 'bottom-start'}\n popperContainer={PopperContainer}\n popperClassName={clsx('owp-animated-datepicker-popper', popperClassNameProp)}\n className={clsx(fullWidth && 'w-full')}\n wrapperClassName={clsx(fullWidth && 'w-full', datePickerProps?.wrapperClassName)}\n maxDate={disabledFutureDates ? new Date() : undefined}\n showYearPicker={showYearPicker}\n showMonthYearPicker={showMonthPicker}\n showTimeSelect={showTimeSelect}\n showTimeSelectOnly={showTimeSelectOnly}\n showTimeInput={showTimeInput}\n showPopperArrow={false}\n open={allowPickerInput ? isCalendarOpen : openProp}\n preventOpenOnFocus={allowPickerInput ? true : preventOpenOnFocus}\n selected={selectedPickerValue}\n onChange={handleSelect}\n onCalendarOpen={handleCalendarOpen}\n onCalendarClose={handleCalendarClose}\n onClickOutside={handleClickOutside}\n onInputClick={handleInputClick}\n dateFormat={showTimeSelectOnly ? (useAmPm ? 'aa hh:mm' : VALUE_TIME_FORMATTER) : 'Pp'}\n timeFormat={showTimeSelectOnly ? (useAmPm ? 'aa hh:mm' : VALUE_TIME_FORMATTER) : undefined}\n customInput={\n <DatePickerInput\n className={clsx(\n showYearPicker && 'w-[140px]',\n showMonthPicker && 'w-[160px]',\n !showYearPicker && !showMonthPicker && 'w-[172px]',\n (showTimeInput || showTimeSelect) && 'w-[200px]',\n showTimeSelectOnly && !useAmPm && 'w-[140px]',\n showTimeSelectOnly && useAmPm && 'w-[170px]',\n className,\n )}\n label={label}\n variant={variant}\n sx={sx}\n {...textFieldProps}\n inputElementRef={externalInputRef}\n onInputFocus={handleExternalInputFocus}\n onInputKeyDown={handleExternalInputKeyDown}\n reset={() => onChange?.('')}\n fullWidth={fullWidth}\n disabledClearButton={disabledClearButton}\n valueFormatter={valueFormatter}\n showTimeSelect={showTimeSelect}\n showTimeSelectOnly={showTimeSelectOnly}\n onInputAreaClick={handleInputAreaClick}\n onIconClick={handleIconClick}\n />\n }\n timeCaption={showTimeSelectOnly ? `${t('Common.시간')}: ` : undefined}\n timeInputLabel={`${t('Common.시간')}: `}\n {...resolvedDatePickerProps}\n />\n </div>\n );\n};\n\nexport { OwpDatePicker };\n"],"names":["registerLocale","ko","enUS","setDefaultLocale","ensureDayjsBrowserSetup","isDatePickerOpenKey","__name","event","parseDatePickerInput","value","valueFormatter","normalizedValue","VALUE_YEAR_FORMATTER","normalizedDateValue","parsedValue","dayjs","VALUE_DATE_FORMATTER","VALUE_MONTH_FORMATTER","OwpDatePicker","className","label","variant","sx","useAmPm","onChange","fullWidth","showYearPicker","showMonthPicker","showTimeSelect","showTimeSelectOnly","showTimeInput","textFieldProps","disabledClearButton","disabledFutureDates","popperClassNameProp","popperContainerProp","datePickerProps","selectsMultiple","selectsRange","selected","startDate","endDate","calendarContainerProp","openProp","onCalendarOpen","onCalendarClose","onClickOutside","onInputClick","preventOpenOnFocus","resolvedDatePickerProps","t","i18n","useOwpTranslation","popperPlacement","setPopperPlacement","useState","isCalendarOpen","setIsCalendarOpen","inputDraftValue","setInputDraftValue","hasPickerInputCommitError","setHasPickerInputCommitError","rootRef","useRef","externalInputRef","pickerInputRef","datePickerRef","suppressOpenUntilRef","datePickerLocale","useMemo","VALUE_TIME_FORMATTER","selectedValue","hoursText","minutesText","hours","minutes","selectedDate","selectedInputValue","allowPickerInput","selectedPickerValue","parsedInputDraftValue","handleSelect","dateValue","nextValue","focusExternalInput","openPicker","closePicker","skipSetBlur","_a","focusAdjacentElement","isBackward","rootElement","getAdjacentFocusableElement","commitInputDraftValue","showError","parsedInput","handleCalendarOpen","handleCalendarClose","handleInputClick","handleExternalInputFocus","handleExternalInputKeyDown","handleClickOutside","handlePickerInputChange","handlePickerInputKeyDown","handlePickerInputClear","handleInputAreaClick","handleIconClick","useEffect","animationFrameId","focusTimerId","PopperContainer","children","AnimatedCalendarContainer","CalendarContainer","DatePickerCalendarContainer","calendarContainerClassName","calendarContainerProps","jsxs","Paper","jsx","OwpTextMaskField","PICKER_INVALID_INPUT_MESSAGE_KEY","getPickerInputMask","InputAdornment","IconButton","ClearIcon","ReactDatePickerCalendarContainer","clsx","ReactDatePicker","DatePickerInput"],"mappings":";;;;;;;;;;;;;;;;;;AAoCAA,GAAe,MAAMC,EAAE;AACvBD,GAAe,MAAME,EAAI;AACzBC,GAAiB,IAAI;AACrBC,GAAA;AAWA,MAAMC,KAAsB,gBAAAC,EAAA,CAACC,MAEzB,EAAAA,EAAM,WACNA,EAAM,UACNA,EAAM,WACNA,EAAM,QAAQ,YACdA,EAAM,QAAQ,WACdA,EAAM,QAAQ,QAPU,wBAgBtBC,IAAuB,gBAAAF,EAAA,CAACG,GAAeC,MAA2B;AACtE,QAAMC,IAAkBF,EAAM,KAAA;AAE9B,MAAIC,MAAmBE,IAAsB;AAC3C,UAAMC,IAAsB,GAAGF,CAAe,UACxCG,IAAcC,EAAMF,GAAqBG,GAAsB,EAAI;AACzE,WAAOF,EAAY,aAAaA,EAAY,OAAOE,CAAoB,MAAMH,IACzEC,IACA;AAAA,EACN;AAEA,MAAIJ,MAAmBO,IAAuB;AAC5C,UAAMJ,IAAsB,GAAGF,CAAe,OACxCG,IAAcC,EAAMF,GAAqBG,GAAsB,EAAI;AACzE,WAAOF,EAAY,aAAaA,EAAY,OAAOE,CAAoB,MAAMH,IACzEC,IACA;AAAA,EACN;AAEA,QAAMA,IAAcC,EAAMJ,GAAiBK,GAAsB,EAAI;AACrE,SAAOF,EAAY,aAAaA,EAAY,OAAOE,CAAoB,MAAML,IACzEG,IACA;AACN,GAvB6B,yBAoDvBI,KAAgB,gBAAAZ,EAAA,CAAC;AAAA,EACrB,WAAAa;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,IAAAC;AAAA,EACA,OAAAb;AAAA,EACA,SAAAc;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,iBAAiBC;AAAA,EACjB,iBAAiBC;AAAA,EACjB,GAAGC;AACL,MAA0B;AACxB,QAAM;AAAA,IACJ,iBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,SAAAC;AAAA,IACA,mBAAmBC;AAAA,IACnB,MAAMC;AAAA,IACN,gBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDb,GAEE,EAAE,GAAAc,GAAG,MAAAC,EAAA,IAASC,GAAA,GACd,CAACC,IAAiBC,CAAkB,IACxCC,EAA0D,cAAc,GACpE,CAACC,GAAgBC,CAAiB,IAAIF,EAAS,EAAK,GACpD,CAACG,GAAiBC,CAAkB,IAAIJ,EAAS,EAAE,GACnD,CAACK,GAA2BC,CAA4B,IAAIN,EAAS,EAAK,GAC1EO,IAAUC,EAA8B,IAAI,GAC5CC,IAAmBD,EAAgC,IAAI,GACvDE,IAAiBF,EAAgC,IAAI,GACrDG,IAAgBH,EAA+B,IAAI,GACnDI,IAAuBJ,EAAO,CAAC,GAE/BK,MADajB,EAAK,oBAAoBA,EAAK,YAAY,UACrB,OAAO,OAAO,MAEhDzC,IAAiB2D,EAAQ,MACzB3C,IACKd,KAGLe,IACKV,KAGLY,IACKyC,IAGLxC,KAAiBF,IACZ,GAAGZ,CAAoB,IAAIsD,CAAoB,KAEjDtD,GACN,CAACU,GAAgBC,GAAiBG,GAAeF,GAAgBC,CAAkB,CAAC,GAEjF0C,IAAgBF,EAAQ,MAAM;AAClC,QAAI,CAAC5D,EAAO,QAAO;AAEnB,QAAIoB,KAAsB,OAAOpB,KAAU,UAAU;AACnD,YAAM,CAAC+D,IAAY,IAAIC,IAAc,EAAE,IAAIhE,EAAM,MAAM,GAAG,GACpDiE,IAAQ,OAAOF,CAAS,GACxBG,IAAU,OAAOF,CAAW;AAElC,UAAI,OAAO,MAAMC,CAAK,KAAK,OAAO,MAAMC,CAAO;AAC7C,eAAO;AAGT,YAAMC,yBAAmB,KAAA;AACzB,aAAAA,GAAa,SAASF,GAAOC,GAAS,GAAG,CAAC,GAEnCC;AAAA,IACT;AAEA,WAAO,IAAI,KAAKnE,CAAK;AAAA,EACvB,GAAG,CAACoB,GAAoBpB,CAAK,CAAC,GAExBoE,IAAqBR,EAAQ,MAAM;AACvC,QAAI,CAAC5D,KAAS,OAAOA,KAAU;AAC7B,aAAOA,IAAQM,EAAMN,CAAK,EAAE,OAAOC,CAAc,IAAI;AAGvD,UAAMI,IAAcN,EAAqBC,GAAOC,CAAc;AAE9D,WAAOI,KAAA,QAAAA,EAAa,YAAYA,EAAY,OAAOJ,CAAc,IAAID;AAAA,EACvE,GAAG,CAACA,GAAOC,CAAc,CAAC,GACpBoE,IAAmB,CAACjD,KAAsB,CAACC,KAAiB,CAACF,GAC7DmD,KAAsBV,EAAQ,MAAM;AACxC,QAAI,CAACS,KAAoB,CAACpB;AACxB,aAAOa;AAGT,UAAMS,IAAwBxE,EAAqBkD,GAAiBhD,CAAc;AAElF,WAAOsE,KAAA,QAAAA,EAAuB,YAAYA,EAAsB,WAAWT;AAAA,EAC7E,GAAG,CAACO,GAAkBpB,GAAiBa,GAAe7D,CAAc,CAAC,GAE/DuE,KAAe,gBAAA3E,EAAA,CAAC4E,MAA4B;AAChD,UAAMC,IAAYD,IAAYnE,EAAMmE,CAAS,EAAE,OAAOxE,CAAc,IAAI;AAExE,IAAAiD,EAAmBwB,KAAa,EAAE,GAClCtB,EAA6B,EAAK,GAClCrC,KAAA,QAAAA,EAAW2D,IAEPL,MACFX,EAAqB,UAAU,KAAK,IAAA,IAAQ,KAC5CiB,EAAA;AAAA,EAEJ,GAXqB,iBAafC,IAAa,gBAAA/E,EAAA,MAAM;AACvB,IAAI,KAAK,QAAQ6D,EAAqB,WAIlCW,MACFrB,EAAkB,EAAI,GACtBE,EAAmBkB,CAAkB,GACrChB,EAA6B,EAAK;AAAA,EAEtC,GAVmB,eAYbyB,IAAc,gBAAAhF,EAAA,CAACiF,MAA0B;;AAC7C,IAAIT,KACFrB,EAAkB,EAAK,IAGzB+B,IAAAtB,EAAc,YAAd,QAAAsB,EAAuB,QAAQ,IAAOD;AAAA,EACxC,GANoB,gBAQdE,KAAuB,gBAAAnF,EAAA,CAACoF,MAAyB;AACrD,UAAMC,IAAc7B,EAAQ;AAE5B,IAAK6B,KAIL,OAAO,sBAAsB,MAAM;;AACjC,OAAAH,IAAAI,GAA4BD,GAAaD,CAAU,MAAnD,QAAAF,EAAsD;AAAA,IACxD,CAAC;AAAA,EACH,GAV6B,yBAYvBJ,IAAqB,gBAAA9E,EAAA,MAAM;AAC/B,WAAO,sBAAsB,MAAM;;AACjC,OAAAkF,IAAAxB,EAAiB,YAAjB,QAAAwB,EAA0B;AAAA,IAC5B,CAAC;AAAA,EACH,GAJ2B,uBAMrBK,KAAwB,gBAAAvF,EAAA,CAACwF,MAAwB;AACrD,QAAI,CAACpC;AACH,aAAAG,EAA6B,EAAK,GAClCrC,KAAA,QAAAA,EAAW,KAEJ;AAGT,UAAMuE,IAAcvF,EAAqBkD,GAAiBhD,CAAc;AAExE,QAAI,EAACqF,KAAA,QAAAA,EAAa;AAChB,aAAID,KAAapC,KACfG,EAA6B,EAAI,GAG5B;AAGT,UAAMsB,IAAYY,EAAY,OAAOrF,CAAc;AACnD,WAAAiD,EAAmBwB,CAAS,GAC5BtB,EAA6B,EAAK,GAClCrC,KAAA,QAAAA,EAAW2D,IAEJ;AAAA,EACT,GAxB8B,0BA0BxBa,KAAqB,gBAAA1F,EAAA,MAAM;AAC/B,IAAAmD,EAAkB,EAAI,GACtBE,EAAmBkB,CAAkB,GACrChB,EAA6B,EAAK,GAClCjB,KAAA,QAAAA;AAAA,EACF,GAL2B,uBAOrBqD,KAAsB,gBAAA3F,EAAA,MAAM;AAChC,IAAAmD,EAAkB,EAAK,GACvBI,EAA6B,EAAK,GAClChB,KAAA,QAAAA;AAAA,EACF,GAJ4B,wBAMtBqD,KAAmB,gBAAA5F,EAAA,MAAM;AAC7B,IAAA+E,EAAA,GACAtC,KAAA,QAAAA;AAAA,EACF,GAHyB,qBAKnBoD,KAA2B,gBAAA7F,EAAA,CAACC,MAA4C;;AAG5E,KAFAiF,IAAAzD,KAAA,gBAAAA,EAAgB,YAAhB,QAAAyD,EAAA,KAAAzD,GAA0BxB,IAEtB,EAAAA,EAAM,oBAAoB,CAACuE,MAI/BO,EAAA;AAAA,EACF,GARiC,6BAU3Be,KAA6B,gBAAA9F,EAAA,CAACC,MAA8C;;AAGhF,KAFAiF,IAAAzD,KAAA,gBAAAA,EAAgB,cAAhB,QAAAyD,EAAA,KAAAzD,GAA4BxB,IAExB,EAAAA,EAAM,oBAAoB,CAACF,GAAoBE,CAAK,MAIxD8E,EAAA;AAAA,EACF,GARmC,+BAU7BgB,KAAqE,gBAAA/F,EAAA,CAACC,MAAU;AACpF,IAAAsF,GAAA,GACAP,EAAA,GACAxC,KAAA,QAAAA,EAAiBvC;AAAA,EACnB,GAJ2E,uBAMrE+F,KAA0B,gBAAAhG,EAAA,CAACC,MAAuC;AACtE,IAAAoD,EAAmBpD,EAAM,OAAO,KAAK,GACrCsD,EAA6B,EAAK;AAAA,EACpC,GAHgC,4BAK1B0C,KAA2B,gBAAAjG,EAAA,CAACC,MAAgD;AAIhF,QAHAA,EAAM,gBAAA,GACNA,EAAM,YAAY,yBAAA,GAEdA,EAAM,QAAQ,UAAU;AAC1B,MAAAA,EAAM,eAAA,GACNoD,EAAmBkB,CAAkB,GACrChB,EAA6B,EAAK,GAClCM,EAAqB,UAAU,KAAK,IAAA,IAAQ,KAC5CmB,EAAY,EAAI,GAChBF,EAAA;AACA;AAAA,IACF;AAEA,QAAI,EAAA7E,EAAM,QAAQ,WAAWA,EAAM,QAAQ,WAI3CA,EAAM,eAAA,GAEF,EAACsF,GAAsB,EAAI,IAI/B;AAAA,UAAItF,EAAM,QAAQ,OAAO;AACvB,QAAA4D,EAAqB,UAAU,KAAK,IAAA,IAAQ,KAC5CmB,EAAY,EAAI,GAChBG,GAAqBlF,EAAM,QAAQ;AACnC;AAAA,MACF;AAEA,MAAA4D,EAAqB,UAAU,KAAK,IAAA,IAAQ,KAC5CmB,EAAY,EAAI,GAChBF,EAAA;AAAA;AAAA,EACF,GAlCiC,6BAoC3BoB,KAAyB,gBAAAlG,EAAA,MAAM;AACnC,IAAAqD,EAAmB,EAAE,GACrBE,EAA6B,EAAK,GAClCrC,KAAA,QAAAA,EAAW;AAAA,EACb,GAJ+B,2BAMzBiF,KAAuB,gBAAAnG,EAAA,MAAM;AACjC,IAAKuB,KAILyB,EAAmB,cAAc;AAAA,EACnC,GAN6B,yBAQvBoD,KAAkB,gBAAApG,EAAA,MAAM;AAC5B,IAAKuB,KAILyB,EAAmB,YAAY;AAAA,EACjC,GANwB;AAQxB,EAAAqD,GAAU,MAAM;AACd,QAAI,CAAC7B,KAAoB,CAACtB;AACxB;AAGF,UAAMoD,IAAmB,OAAO,sBAAsB,MAAM;;AAC1D,OAAApB,IAAAvB,EAAe,YAAf,QAAAuB,EAAwB;AAAA,IAC1B,CAAC,GACKqB,IAAe,OAAO,WAAW,MAAM;;AAC3C,OAAArB,IAAAvB,EAAe,YAAf,QAAAuB,EAAwB;AAAA,IAC1B,CAAC;AAED,WAAO,MAAM;AACX,aAAO,qBAAqBoB,CAAgB,GAC5C,OAAO,aAAaC,CAAY;AAAA,IAClC;AAAA,EACF,GAAG,CAAC/B,GAAkBtB,CAAc,CAAC;AAErC,QAAMsD,KAAkB,gBAAAxG,EAAA,CAAC,EAAE,UAAAyG,EAAA,wBACxBC,IAAA,EAA0B,WAAW7E,MAAuB8E,IAC1D,UAAAF,EAAA,CACH,GAHsB,oBAMlBG,KAA8B,gBAAA5G,EAAA,CAAC;AAAA,IACnC,UAAAyG;AAAA,IACA,WAAWI;AAAA,IACX,GAAGC;AAAA,EAAA,MAEEtC,IAWH,gBAAAuC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,WAAW;AAAA,MACX,IAAI;AAAA,QACF,cAAc;AAAA,QACd,YAAY;AAAA,QACZ,UAAU;AAAA,QACV,OAAO;AAAA,QACP,uBAAuB;AAAA,UACrB,QAAQ;AAAA,UACR,SAAS;AAAA,UACT,YAAY;AAAA,QAAA;AAAA,QAEd,wCAAwC;AAAA,UACtC,OAAO;AAAA,QAAA;AAAA,QAET,8BAA8B;AAAA,UAC5B,cAAc;AAAA,QAAA;AAAA,MAChB;AAAA,MAGF,UAAA;AAAA,QAAA,gBAAAC;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,WAAS;AAAA,YACT,UAAUvD;AAAA,YACV,WAAS;AAAA,YACT,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,OAAOP;AAAA,YACP,OAAOE;AAAA,YACP,YAAYA,IAA4BV,EAAEuE,EAAgC,IAAI;AAAA,YAC9E,MAAMC,GAAmBhH,CAAc;AAAA,YACvC,aAAaA;AAAA,YACb,UAAU4F;AAAA,YACV,WAAWC;AAAA,YACX,YAAY;AAAA,cACV,WAAW;AAAA,cACX,cAAc7F;AAAA,YAAA;AAAA,YAEhB,cACE,gBAAA6G;AAAA,cAACI;AAAA,cAAA;AAAA,gBACC,UAAS;AAAA,gBACT,IAAI;AAAA,kBACF,YAAY;AAAA,gBAAA;AAAA,gBAGd,UAAA,gBAAAJ;AAAA,kBAACK;AAAA,kBAAA;AAAA,oBACC,MAAK;AAAA,oBACL,UAAU;AAAA,oBACV,cAAY1E,EAAE,YAAY;AAAA,oBAC1B,UAAU,CAACQ;AAAA,oBACX,SAAS8C;AAAA,oBACT,aAAa,gBAAAlG,EAAA,CAACC,MAAU;AACtB,sBAAAA,EAAM,eAAA,GACNA,EAAM,gBAAA;AAAA,oBACR,GAHa;AAAA,oBAIb,IAAI;AAAA,sBACF,QAAQ;AAAA,sBACR,SAAS;AAAA,oBAAA;AAAA,oBAGX,UAAA,gBAAAgH,EAACM,IAAA,EAAU,UAAS,QAAA,CAAQ;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAC9B;AAAA,YAAA;AAAA,YAGJ,IAAI;AAAA,cACF,WAAW;AAAA,cACX,OAAO;AAAA,cACP,IAAI;AAAA,cACJ,IAAI;AAAA,cACJ,4BAA4B;AAAA,gBAC1B,cAAc;AAAA,gBACd,UAAU;AAAA,gBACV,cAAc;AAAA,cAAA;AAAA,YAChB;AAAA,UACF;AAAA,QAAA;AAAA,QAEF,gBAAAN;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWJ;AAAA,YACV,GAAGC;AAAA,YACJ,OAAO;AAAA,cACL,GAAGA,EAAuB;AAAA,cAC1B,QAAQ;AAAA,cACR,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,UAAU;AAAA,YAAA;AAAA,YAGX,UAAAL;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA,sBAlGyBrE,MAAyBoF,IAGjD,EAAmB,WAAWX,GAA6B,GAAGC,GAC5D,UAAAL,GACH,GAX8B;AA6GpC,SACE,gBAAAQ,EAAC,SAAI,KAAKzD,GAAS,WAAWiE,EAAKtG,KAAa,QAAQ,GACtD,UAAA,gBAAA8F;AAAA,IAACS;AAAAA,IAAA;AAAA,MACC,KAAK9D;AAAA,MACL,QAAQE;AAAA,MACR,mBAAmB8C;AAAA,MACnB,iBAAiBrF,IAAqBwB,KAAkB;AAAA,MACxD,iBAAiByD;AAAA,MACjB,iBAAiBiB,EAAK,kCAAkC7F,EAAmB;AAAA,MAC3E,WAAW6F,EAAKtG,KAAa,QAAQ;AAAA,MACrC,kBAAkBsG,EAAKtG,KAAa,UAAUW,KAAA,gBAAAA,EAAiB,gBAAgB;AAAA,MAC/E,SAASH,KAAsB,oBAAI,KAAA,IAAS;AAAA,MAC5C,gBAAAP;AAAA,MACA,qBAAqBC;AAAA,MACrB,gBAAAC;AAAA,MACA,oBAAAC;AAAA,MACA,eAAAC;AAAA,MACA,iBAAiB;AAAA,MACjB,MAAMgD,IAAmBtB,IAAiBb;AAAA,MAC1C,oBAAoBmC,IAAmB,KAAO9B;AAAA,MAC9C,UAAU+B;AAAA,MACV,UAAUE;AAAA,MACV,gBAAgBe;AAAA,MAChB,iBAAiBC;AAAA,MACjB,gBAAgBI;AAAA,MAChB,cAAcH;AAAA,MACd,YAAYrE,IAAsBN,IAAU,aAAa+C,IAAwB;AAAA,MACjF,YAAYzC,IAAsBN,IAAU,aAAa+C,IAAwB;AAAA,MACjF,aACE,gBAAAiD;AAAA,QAACU;AAAA,QAAA;AAAA,UACC,WAAWF;AAAA,YACTrG,KAAkB;AAAA,YAClBC,KAAmB;AAAA,YACnB,CAACD,KAAkB,CAACC,KAAmB;AAAA,aACtCG,KAAiBF,MAAmB;AAAA,YACrCC,KAAsB,CAACN,KAAW;AAAA,YAClCM,KAAsBN,KAAW;AAAA,YACjCJ;AAAA,UAAA;AAAA,UAEF,OAAAC;AAAA,UACA,SAAAC;AAAA,UACA,IAAAC;AAAA,UACC,GAAGS;AAAA,UACJ,iBAAiBiC;AAAA,UACjB,cAAcmC;AAAA,UACd,gBAAgBC;AAAA,UAChB,OAAO,gBAAA9F,EAAA,MAAMkB,KAAA,gBAAAA,EAAW,KAAjB;AAAA,UACP,WAAAC;AAAA,UACA,qBAAAO;AAAA,UACA,gBAAAtB;AAAA,UACA,gBAAAkB;AAAA,UACA,oBAAAC;AAAA,UACA,kBAAkB4E;AAAA,UAClB,aAAaC;AAAA,QAAA;AAAA,MAAA;AAAA,MAGjB,aAAa7E,IAAqB,GAAGqB,EAAE,WAAW,CAAC,OAAO;AAAA,MAC1D,gBAAgB,GAAGA,EAAE,WAAW,CAAC;AAAA,MAChC,GAAGD;AAAA,IAAA;AAAA,EAAA,GAER;AAEJ,GA1esB;"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
var B = Object.defineProperty;
|
|
2
2
|
var a = (e, u) => B(e, "name", { value: u, configurable: !0 });
|
|
3
|
-
import { jsx as
|
|
3
|
+
import { jsx as T } from "../../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
|
|
4
4
|
import { useOwpTranslation as G } from "../../hooks/useOwpTranslation.js";
|
|
5
5
|
import { clsx as i } from "../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js";
|
|
6
6
|
import { enUS as J } from "../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/locale/en-US.js";
|
|
7
7
|
import { ko as Q } from "../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/locale/ko.js";
|
|
8
|
-
import A from "dayjs";
|
|
8
|
+
import { owpDayjs as A } from "../../dayjs.js";
|
|
9
9
|
import { useRef as X, useMemo as O } from "react";
|
|
10
10
|
import { DatePicker as Z, registerLocale as L, setDefaultLocale as $ } from "../../node_modules/.pnpm/react-datepicker@8.7.0_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-datepicker/dist/index.es.js";
|
|
11
11
|
import { CalendarContainer as x } from "./internal/CalendarContainer.js";
|
|
@@ -20,11 +20,11 @@ $("ko");
|
|
|
20
20
|
const K = /* @__PURE__ */ a((e) => v(e) && D(e), "isNill"), h = /* @__PURE__ */ a((e) => !(e.ctrlKey || e.altKey || e.metaKey || e.key === "Escape" || e.key === "Enter" || e.key === "Tab"), "isDateRangePickerOpenKey"), Ae = /* @__PURE__ */ a(({
|
|
21
21
|
className: e,
|
|
22
22
|
label: u,
|
|
23
|
-
variant:
|
|
24
|
-
sx:
|
|
23
|
+
variant: I = "standard",
|
|
24
|
+
sx: _,
|
|
25
25
|
value: f,
|
|
26
26
|
fullWidth: R,
|
|
27
|
-
disabledClearButton:
|
|
27
|
+
disabledClearButton: d,
|
|
28
28
|
disabledFutureDates: j,
|
|
29
29
|
onChange: t,
|
|
30
30
|
minDate: k,
|
|
@@ -32,7 +32,7 @@ const K = /* @__PURE__ */ a((e) => v(e) && D(e), "isNill"), h = /* @__PURE__ */
|
|
|
32
32
|
minTime: M,
|
|
33
33
|
maxTime: S,
|
|
34
34
|
showYearPicker: l,
|
|
35
|
-
showMonthPicker:
|
|
35
|
+
showMonthPicker: o,
|
|
36
36
|
textFieldProps: m,
|
|
37
37
|
popperClassName: V,
|
|
38
38
|
popperContainer: b,
|
|
@@ -45,15 +45,15 @@ const K = /* @__PURE__ */ a((e) => v(e) && D(e), "isNill"), h = /* @__PURE__ */
|
|
|
45
45
|
startDate: ae,
|
|
46
46
|
endDate: me,
|
|
47
47
|
...g
|
|
48
|
-
} = n, { i18n: E } = G(), y = X(null), H = (E.resolvedLanguage ?? E.language ?? "kr") === "kr" ? "ko" : "en", c = O(() => l ? Y :
|
|
48
|
+
} = n, { i18n: E } = G(), y = X(null), H = (E.resolvedLanguage ?? E.language ?? "kr") === "kr" ? "ko" : "en", c = O(() => l ? Y : o ? C : F, [l, o]), [s, w] = O(() => f ? f.split(",").map((r) => !r || K(r) ? null : new Date(r)) : [null, null], [f]), q = /* @__PURE__ */ a((r) => {
|
|
49
49
|
t == null || t(
|
|
50
50
|
P(r) ? void 0 : [...r].map((p) => K(p) ? "" : A(p).format(c)).join(",")
|
|
51
51
|
);
|
|
52
52
|
}, "handleSelect"), z = /* @__PURE__ */ a((r) => {
|
|
53
|
-
var p,
|
|
54
|
-
(p = m == null ? void 0 : m.onKeyDown) == null || p.call(m, r), !(r.defaultPrevented || !h(r)) && ((
|
|
53
|
+
var p, N;
|
|
54
|
+
(p = m == null ? void 0 : m.onKeyDown) == null || p.call(m, r), !(r.defaultPrevented || !h(r)) && ((N = y.current) == null || N.setOpen(!0));
|
|
55
55
|
}, "handleExternalInputKeyDown");
|
|
56
|
-
return /* @__PURE__ */
|
|
56
|
+
return /* @__PURE__ */ T(
|
|
57
57
|
Z,
|
|
58
58
|
{
|
|
59
59
|
ref: y,
|
|
@@ -69,33 +69,33 @@ const K = /* @__PURE__ */ a((e) => v(e) && D(e), "isNill"), h = /* @__PURE__ */
|
|
|
69
69
|
minTime: M,
|
|
70
70
|
maxTime: S,
|
|
71
71
|
showYearPicker: l,
|
|
72
|
-
showMonthYearPicker:
|
|
72
|
+
showMonthYearPicker: o,
|
|
73
73
|
showPopperArrow: !1,
|
|
74
74
|
popperPlacement: "bottom-start",
|
|
75
|
-
selected:
|
|
75
|
+
selected: s,
|
|
76
76
|
onChange: q,
|
|
77
77
|
onCalendarClose: /* @__PURE__ */ a(() => {
|
|
78
|
-
!D(
|
|
78
|
+
!D(s) && D(w) && (t == null || t([s, s].map((r) => A(r).format(c)).join(",")));
|
|
79
79
|
}, "onCalendarClose"),
|
|
80
|
-
startDate:
|
|
81
|
-
endDate:
|
|
82
|
-
customInput: /* @__PURE__ */
|
|
80
|
+
startDate: s,
|
|
81
|
+
endDate: w,
|
|
82
|
+
customInput: /* @__PURE__ */ T(
|
|
83
83
|
W,
|
|
84
84
|
{
|
|
85
85
|
className: i(
|
|
86
86
|
l && "w-[180px]",
|
|
87
|
-
|
|
88
|
-
!l && !
|
|
87
|
+
o && "w-[220px]",
|
|
88
|
+
!l && !o && "w-[260px]",
|
|
89
89
|
e
|
|
90
90
|
),
|
|
91
91
|
label: u,
|
|
92
|
-
variant:
|
|
93
|
-
sx:
|
|
92
|
+
variant: I,
|
|
93
|
+
sx: _,
|
|
94
94
|
...m,
|
|
95
95
|
onInputKeyDown: z,
|
|
96
96
|
reset: /* @__PURE__ */ a(() => t == null ? void 0 : t(""), "reset"),
|
|
97
97
|
useRange: !0,
|
|
98
|
-
disabledClearButton:
|
|
98
|
+
disabledClearButton: d,
|
|
99
99
|
valueFormatter: c
|
|
100
100
|
}
|
|
101
101
|
)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OwpDateRangePicker.js","sources":["../../../src/components/OwpPicker/OwpDateRangePicker.tsx"],"sourcesContent":["import { useOwpTranslation } from '@/hooks/useOwpTranslation';\nimport { TextFieldProps } from '@mui/material';\nimport clsx from 'clsx';\nimport { enUS } from 'date-fns/locale/en-US';\nimport { ko } from 'date-fns/locale/ko';\nimport dayjs from 'dayjs';\nimport { isEmpty, isNil, isNull } from 'es-toolkit/compat';\nimport { useMemo, useRef } from 'react';\nimport ReactDatePicker, {\n DatePickerProps,\n registerLocale,\n setDefaultLocale,\n} from 'react-datepicker';\nimport { CalendarContainer } from './internal/CalendarContainer';\nimport { DatePickerInput } from './internal/DatePickerInput';\nimport { VALUE_DATE_FORMATTER, VALUE_MONTH_FORMATTER, VALUE_YEAR_FORMATTER } from './constants';\n\nregisterLocale('ko', ko);\nregisterLocale('en', enUS);\nsetDefaultLocale('ko');\n\nconst isNill = (v: Date | string | number | undefined | null) => isNull(v) && isNil(v);\n\ntype DatePickerValue = string | Date;\ntype OwpDateRangePickerTextFieldKeyDownEvent = Parameters<\n NonNullable<TextFieldProps['onKeyDown']>\n>[0];\n\n/** DateRangePicker 외부 입력에서 피커 open 처리할 키 여부 */\nconst isDateRangePickerOpenKey = (event: OwpDateRangePickerTextFieldKeyDownEvent) => {\n if (\n event.ctrlKey ||\n event.altKey ||\n event.metaKey ||\n event.key === 'Escape' ||\n event.key === 'Enter' ||\n event.key === 'Tab'\n ) {\n return false;\n }\n\n return true;\n};\n\ninterface OwnProps {\n className?: string;\n label?: string;\n variant?: TextFieldProps['variant'];\n sx?: TextFieldProps['sx'];\n value?: DatePickerValue;\n fullWidth?: boolean;\n disabledClearButton?: boolean;\n disabledFutureDates?: boolean;\n onChange?: (value?: DatePickerValue) => void;\n showYearPicker?: boolean;\n showMonthPicker?: boolean;\n textFieldProps?: Omit<TextFieldProps, 'value' | 'defaultValue' | 'onChange'>;\n}\n\ntype OwpDatePickerProps = OwnProps & DatePickerProps;\n\n/**\n * OwpDateRangePicker 컴포넌트\n * @param className CSS 클래스명\n * @param label 입력 라벨\n * @param variant variant 값\n * @param sx sx 값\n * @param value 현재 값\n * @param fullWidth 전체 너비 사용 여부\n */\nconst OwpDateRangePicker = ({\n className,\n label,\n variant = 'standard',\n sx,\n value,\n fullWidth,\n disabledClearButton,\n disabledFutureDates,\n onChange,\n minDate,\n maxDate,\n minTime,\n maxTime,\n showYearPicker,\n showMonthPicker,\n textFieldProps,\n popperClassName: popperClassNameProp,\n popperContainer: popperContainerProp,\n ...datePickerProps\n}: OwpDatePickerProps) => {\n const {\n selectsMultiple,\n selectsRange,\n selected,\n startDate: passedStartDate,\n endDate: passedEndDate,\n ...resolvedDatePickerProps\n } = datePickerProps;\n void [selectsMultiple, selectsRange, selected, passedStartDate, passedEndDate];\n const { i18n } = useOwpTranslation();\n const datePickerRef = useRef<ReactDatePicker | null>(null);\n const languageId = i18n.resolvedLanguage ?? i18n.language ?? 'kr';\n const datePickerLocale = languageId === 'kr' ? 'ko' : 'en';\n const valueFormatter = useMemo(() => {\n if (showYearPicker) {\n return VALUE_YEAR_FORMATTER;\n }\n\n if (showMonthPicker) {\n return VALUE_MONTH_FORMATTER;\n }\n return VALUE_DATE_FORMATTER;\n }, [showYearPicker, showMonthPicker]);\n\n const [startDate, endDate] = useMemo(() => {\n if (!value) return [null, null];\n return value.split(',').map((v: string) => (!v || isNill(v) ? null : new Date(v)));\n }, [value]);\n\n const handleSelect = (dates?: [Date, Date]) => {\n onChange?.(\n !isEmpty(dates)\n ? [...dates].map((d: Date) => (isNill(d) ? '' : dayjs(d).format(valueFormatter))).join(',')\n : undefined,\n );\n };\n\n const handleExternalInputKeyDown = (event: OwpDateRangePickerTextFieldKeyDownEvent) => {\n textFieldProps?.onKeyDown?.(event);\n\n if (event.defaultPrevented || !isDateRangePickerOpenKey(event)) {\n return;\n }\n\n datePickerRef.current?.setOpen(true);\n };\n\n return (\n <ReactDatePicker\n ref={datePickerRef}\n {...resolvedDatePickerProps}\n locale={datePickerLocale}\n popperContainer={popperContainerProp ?? CalendarContainer}\n popperClassName={popperClassNameProp}\n className={clsx(fullWidth && 'w-full')}\n wrapperClassName={clsx(fullWidth && 'w-full', datePickerProps?.wrapperClassName)}\n selectsRange\n minDate={minDate}\n maxDate={disabledFutureDates ? new Date() : maxDate}\n minTime={minTime}\n maxTime={maxTime}\n showYearPicker={showYearPicker}\n showMonthYearPicker={showMonthPicker}\n showPopperArrow={false}\n popperPlacement=\"bottom-start\"\n selected={startDate}\n onChange={handleSelect}\n onCalendarClose={() => {\n if (!isNil(startDate) && isNil(endDate)) {\n onChange?.([startDate, startDate].map((d) => dayjs(d).format(valueFormatter)).join(','));\n }\n }}\n startDate={startDate}\n endDate={endDate}\n customInput={\n <DatePickerInput\n className={clsx(\n showYearPicker && 'w-[180px]',\n showMonthPicker && 'w-[220px]',\n !showYearPicker && !showMonthPicker && 'w-[260px]',\n className,\n )}\n label={label}\n variant={variant}\n sx={sx}\n {...textFieldProps}\n onInputKeyDown={handleExternalInputKeyDown}\n reset={() => onChange?.('')}\n useRange\n disabledClearButton={disabledClearButton}\n valueFormatter={valueFormatter}\n />\n }\n />\n );\n};\n\nexport { OwpDateRangePicker };\n"],"names":["registerLocale","ko","enUS","setDefaultLocale","isNill","__name","v","isNull","isNil","isDateRangePickerOpenKey","event","OwpDateRangePicker","className","label","variant","sx","value","fullWidth","disabledClearButton","disabledFutureDates","onChange","minDate","maxDate","minTime","maxTime","showYearPicker","showMonthPicker","textFieldProps","popperClassNameProp","popperContainerProp","datePickerProps","selectsMultiple","selectsRange","selected","passedStartDate","passedEndDate","resolvedDatePickerProps","i18n","useOwpTranslation","datePickerRef","useRef","datePickerLocale","valueFormatter","useMemo","VALUE_YEAR_FORMATTER","VALUE_MONTH_FORMATTER","VALUE_DATE_FORMATTER","startDate","endDate","handleSelect","dates","isEmpty","d","dayjs","handleExternalInputKeyDown","_a","_b","jsx","ReactDatePicker","CalendarContainer","clsx","DatePickerInput"],"mappings":";;;;;;;;;;;;;;;;AAiBAA,EAAe,MAAMC,CAAE;AACvBD,EAAe,MAAME,CAAI;AACzBC,EAAiB,IAAI;AAErB,MAAMC,IAAS,gBAAAC,EAAA,CAACC,MAAiDC,EAAOD,CAAC,KAAKE,EAAMF,CAAC,GAAtE,WAQTG,IAA2B,gBAAAJ,EAAA,CAACK,MAE9B,EAAAA,EAAM,WACNA,EAAM,UACNA,EAAM,WACNA,EAAM,QAAQ,YACdA,EAAM,QAAQ,WACdA,EAAM,QAAQ,QAPe,6BAyC3BC,KAAqB,gBAAAN,EAAA,CAAC;AAAA,EAC1B,WAAAO;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,SAAAC;AAAA,EACA,SAAAC;AAAA,EACA,SAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,iBAAiBC;AAAA,EACjB,iBAAiBC;AAAA,EACjB,GAAGC;AACL,MAA0B;AACxB,QAAM;AAAA,IACJ,iBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAWC;AAAA,IACX,SAASC;AAAA,IACT,GAAGC;AAAA,EAAA,IACDN,GAEE,EAAE,MAAAO,EAAA,IAASC,EAAA,GACXC,IAAgBC,EAA+B,IAAI,GAEnDC,KADaJ,EAAK,oBAAoBA,EAAK,YAAY,UACrB,OAAO,OAAO,MAChDK,IAAiBC,EAAQ,MACzBlB,IACKmB,IAGLlB,IACKmB,IAEFC,GACN,CAACrB,GAAgBC,CAAe,CAAC,GAE9B,CAACqB,GAAWC,CAAO,IAAIL,EAAQ,MAC9B3B,IACEA,EAAM,MAAM,GAAG,EAAE,IAAI,CAACV,MAAe,CAACA,KAAKF,EAAOE,CAAC,IAAI,OAAO,IAAI,KAAKA,CAAC,CAAE,IAD9D,CAAC,MAAM,IAAI,GAE7B,CAACU,CAAK,CAAC,GAEJiC,IAAe,gBAAA5C,EAAA,CAAC6C,MAAyB;AAC7C,IAAA9B,KAAA,QAAAA;AAAA,MACG+B,EAAQD,CAAK,IAEV,SADA,CAAC,GAAGA,CAAK,EAAE,IAAI,CAACE,MAAahD,EAAOgD,CAAC,IAAI,KAAKC,EAAMD,CAAC,EAAE,OAAOV,CAAc,CAAE,EAAE,KAAK,GAAG;AAAA;AAAA,EAGhG,GANqB,iBAQfY,IAA6B,gBAAAjD,EAAA,CAACK,MAAmD;;AAGrF,KAFA6C,IAAA5B,KAAA,gBAAAA,EAAgB,cAAhB,QAAA4B,EAAA,KAAA5B,GAA4BjB,IAExB,EAAAA,EAAM,oBAAoB,CAACD,EAAyBC,CAAK,QAI7D8C,IAAAjB,EAAc,YAAd,QAAAiB,EAAuB,QAAQ;AAAA,EACjC,GARmC;AAUnC,SACE,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,KAAKnB;AAAA,MACJ,GAAGH;AAAA,MACJ,QAAQK;AAAA,MACR,iBAAiBZ,KAAuB8B;AAAA,MACxC,iBAAiB/B;AAAA,MACjB,WAAWgC,EAAK3C,KAAa,QAAQ;AAAA,MACrC,kBAAkB2C,EAAK3C,KAAa,UAAUa,KAAA,gBAAAA,EAAiB,gBAAgB;AAAA,MAC/E,cAAY;AAAA,MACZ,SAAAT;AAAA,MACA,SAASF,IAAsB,oBAAI,KAAA,IAASG;AAAA,MAC5C,SAAAC;AAAA,MACA,SAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,qBAAqBC;AAAA,MACrB,iBAAiB;AAAA,MACjB,iBAAgB;AAAA,MAChB,UAAUqB;AAAA,MACV,UAAUE;AAAA,MACV,iBAAiB,gBAAA5C,EAAA,MAAM;AACrB,QAAI,CAACG,EAAMuC,CAAS,KAAKvC,EAAMwC,CAAO,MACpC5B,KAAA,QAAAA,EAAW,CAAC2B,GAAWA,CAAS,EAAE,IAAI,CAACK,MAAMC,EAAMD,CAAC,EAAE,OAAOV,CAAc,CAAC,EAAE,KAAK,GAAG;AAAA,MAE1F,GAJiB;AAAA,MAKjB,WAAAK;AAAA,MACA,SAAAC;AAAA,MACA,aACE,gBAAAS;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,WAAWD;AAAA,YACTnC,KAAkB;AAAA,YAClBC,KAAmB;AAAA,YACnB,CAACD,KAAkB,CAACC,KAAmB;AAAA,YACvCd;AAAA,UAAA;AAAA,UAEF,OAAAC;AAAA,UACA,SAAAC;AAAA,UACA,IAAAC;AAAA,UACC,GAAGY;AAAA,UACJ,gBAAgB2B;AAAA,UAChB,OAAO,gBAAAjD,EAAA,MAAMe,KAAA,gBAAAA,EAAW,KAAjB;AAAA,UACP,UAAQ;AAAA,UACR,qBAAAF;AAAA,UACA,gBAAAwB;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAIR,GApH2B;"}
|
|
1
|
+
{"version":3,"file":"OwpDateRangePicker.js","sources":["../../../src/components/OwpPicker/OwpDateRangePicker.tsx"],"sourcesContent":["import { useOwpTranslation } from '@/hooks/useOwpTranslation';\nimport { TextFieldProps } from '@mui/material';\nimport clsx from 'clsx';\nimport { enUS } from 'date-fns/locale/en-US';\nimport { ko } from 'date-fns/locale/ko';\nimport dayjs from '@/dayjs';\nimport { isEmpty, isNil, isNull } from 'es-toolkit/compat';\nimport { useMemo, useRef } from 'react';\nimport ReactDatePicker, {\n DatePickerProps,\n registerLocale,\n setDefaultLocale,\n} from 'react-datepicker';\nimport { CalendarContainer } from './internal/CalendarContainer';\nimport { DatePickerInput } from './internal/DatePickerInput';\nimport { VALUE_DATE_FORMATTER, VALUE_MONTH_FORMATTER, VALUE_YEAR_FORMATTER } from './constants';\n\nregisterLocale('ko', ko);\nregisterLocale('en', enUS);\nsetDefaultLocale('ko');\n\nconst isNill = (v: Date | string | number | undefined | null) => isNull(v) && isNil(v);\n\ntype DatePickerValue = string | Date;\ntype OwpDateRangePickerTextFieldKeyDownEvent = Parameters<\n NonNullable<TextFieldProps['onKeyDown']>\n>[0];\n\n/** DateRangePicker 외부 입력에서 피커 open 처리할 키 여부 */\nconst isDateRangePickerOpenKey = (event: OwpDateRangePickerTextFieldKeyDownEvent) => {\n if (\n event.ctrlKey ||\n event.altKey ||\n event.metaKey ||\n event.key === 'Escape' ||\n event.key === 'Enter' ||\n event.key === 'Tab'\n ) {\n return false;\n }\n\n return true;\n};\n\ninterface OwnProps {\n className?: string;\n label?: string;\n variant?: TextFieldProps['variant'];\n sx?: TextFieldProps['sx'];\n value?: DatePickerValue;\n fullWidth?: boolean;\n disabledClearButton?: boolean;\n disabledFutureDates?: boolean;\n onChange?: (value?: DatePickerValue) => void;\n showYearPicker?: boolean;\n showMonthPicker?: boolean;\n textFieldProps?: Omit<TextFieldProps, 'value' | 'defaultValue' | 'onChange'>;\n}\n\ntype OwpDatePickerProps = OwnProps & DatePickerProps;\n\n/**\n * OwpDateRangePicker 컴포넌트\n * @param className CSS 클래스명\n * @param label 입력 라벨\n * @param variant variant 값\n * @param sx sx 값\n * @param value 현재 값\n * @param fullWidth 전체 너비 사용 여부\n */\nconst OwpDateRangePicker = ({\n className,\n label,\n variant = 'standard',\n sx,\n value,\n fullWidth,\n disabledClearButton,\n disabledFutureDates,\n onChange,\n minDate,\n maxDate,\n minTime,\n maxTime,\n showYearPicker,\n showMonthPicker,\n textFieldProps,\n popperClassName: popperClassNameProp,\n popperContainer: popperContainerProp,\n ...datePickerProps\n}: OwpDatePickerProps) => {\n const {\n selectsMultiple,\n selectsRange,\n selected,\n startDate: passedStartDate,\n endDate: passedEndDate,\n ...resolvedDatePickerProps\n } = datePickerProps;\n void [selectsMultiple, selectsRange, selected, passedStartDate, passedEndDate];\n const { i18n } = useOwpTranslation();\n const datePickerRef = useRef<ReactDatePicker | null>(null);\n const languageId = i18n.resolvedLanguage ?? i18n.language ?? 'kr';\n const datePickerLocale = languageId === 'kr' ? 'ko' : 'en';\n const valueFormatter = useMemo(() => {\n if (showYearPicker) {\n return VALUE_YEAR_FORMATTER;\n }\n\n if (showMonthPicker) {\n return VALUE_MONTH_FORMATTER;\n }\n return VALUE_DATE_FORMATTER;\n }, [showYearPicker, showMonthPicker]);\n\n const [startDate, endDate] = useMemo(() => {\n if (!value) return [null, null];\n return value.split(',').map((v: string) => (!v || isNill(v) ? null : new Date(v)));\n }, [value]);\n\n const handleSelect = (dates?: [Date, Date]) => {\n onChange?.(\n !isEmpty(dates)\n ? [...dates].map((d: Date) => (isNill(d) ? '' : dayjs(d).format(valueFormatter))).join(',')\n : undefined,\n );\n };\n\n const handleExternalInputKeyDown = (event: OwpDateRangePickerTextFieldKeyDownEvent) => {\n textFieldProps?.onKeyDown?.(event);\n\n if (event.defaultPrevented || !isDateRangePickerOpenKey(event)) {\n return;\n }\n\n datePickerRef.current?.setOpen(true);\n };\n\n return (\n <ReactDatePicker\n ref={datePickerRef}\n {...resolvedDatePickerProps}\n locale={datePickerLocale}\n popperContainer={popperContainerProp ?? CalendarContainer}\n popperClassName={popperClassNameProp}\n className={clsx(fullWidth && 'w-full')}\n wrapperClassName={clsx(fullWidth && 'w-full', datePickerProps?.wrapperClassName)}\n selectsRange\n minDate={minDate}\n maxDate={disabledFutureDates ? new Date() : maxDate}\n minTime={minTime}\n maxTime={maxTime}\n showYearPicker={showYearPicker}\n showMonthYearPicker={showMonthPicker}\n showPopperArrow={false}\n popperPlacement=\"bottom-start\"\n selected={startDate}\n onChange={handleSelect}\n onCalendarClose={() => {\n if (!isNil(startDate) && isNil(endDate)) {\n onChange?.([startDate, startDate].map((d) => dayjs(d).format(valueFormatter)).join(','));\n }\n }}\n startDate={startDate}\n endDate={endDate}\n customInput={\n <DatePickerInput\n className={clsx(\n showYearPicker && 'w-[180px]',\n showMonthPicker && 'w-[220px]',\n !showYearPicker && !showMonthPicker && 'w-[260px]',\n className,\n )}\n label={label}\n variant={variant}\n sx={sx}\n {...textFieldProps}\n onInputKeyDown={handleExternalInputKeyDown}\n reset={() => onChange?.('')}\n useRange\n disabledClearButton={disabledClearButton}\n valueFormatter={valueFormatter}\n />\n }\n />\n );\n};\n\nexport { OwpDateRangePicker };\n"],"names":["registerLocale","ko","enUS","setDefaultLocale","isNill","__name","v","isNull","isNil","isDateRangePickerOpenKey","event","OwpDateRangePicker","className","label","variant","sx","value","fullWidth","disabledClearButton","disabledFutureDates","onChange","minDate","maxDate","minTime","maxTime","showYearPicker","showMonthPicker","textFieldProps","popperClassNameProp","popperContainerProp","datePickerProps","selectsMultiple","selectsRange","selected","passedStartDate","passedEndDate","resolvedDatePickerProps","i18n","useOwpTranslation","datePickerRef","useRef","datePickerLocale","valueFormatter","useMemo","VALUE_YEAR_FORMATTER","VALUE_MONTH_FORMATTER","VALUE_DATE_FORMATTER","startDate","endDate","handleSelect","dates","isEmpty","d","dayjs","handleExternalInputKeyDown","_a","_b","jsx","ReactDatePicker","CalendarContainer","clsx","DatePickerInput"],"mappings":"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"}
|