@owp/core 2.5.21 → 2.5.23
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/OwpMrtTable/OwpMrtTable.js +21 -21
- package/dist/components/OwpMrtTable/OwpMrtTable.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 +31 -32
- 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 +29 -30
- 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/internal/DatePickerInput.js +5 -5
- package/dist/components/OwpPicker/internal/DatePickerInput.js.map +1 -1
- package/dist/components/OwpSection/OwpSection.js +118 -111
- package/dist/components/OwpSection/OwpSection.js.map +1 -1
- package/dist/components/OwpTable/OwpDataTable.js +13 -12
- package/dist/components/OwpTable/OwpDataTable.js.map +1 -1
- package/dist/components/OwpTable/OwpFieldTable.js +82 -99
- package/dist/components/OwpTable/OwpFieldTable.js.map +1 -1
- package/dist/components/OwpTable/OwpTable.js +56 -55
- package/dist/components/OwpTable/OwpTable.js.map +1 -1
- package/dist/components/OwpTable/internal/OwpTableBase.js +84 -58
- package/dist/components/OwpTable/internal/OwpTableBase.js.map +1 -1
- package/dist/components/OwpTable/internal/defaultTableStyle.js +6 -7
- package/dist/components/OwpTable/internal/defaultTableStyle.js.map +1 -1
- package/dist/components/OwpTable/utils/tableSx.js +16 -6
- package/dist/components/OwpTable/utils/tableSx.js.map +1 -1
- package/dist/components/OwpTreeGrid/OwpTreeGrid.js +104 -103
- package/dist/components/OwpTreeGrid/OwpTreeGrid.js.map +1 -1
- package/dist/components/OwpTreeGrid/internal/hooks/useOwpTreeGridDatePickerEditor.js +21 -22
- package/dist/components/OwpTreeGrid/internal/hooks/useOwpTreeGridDatePickerEditor.js.map +1 -1
- package/dist/components/OwpTreeGrid/internal/treeGridTheme.js +253 -252
- package/dist/components/OwpTreeGrid/internal/treeGridTheme.js.map +1 -1
- package/dist/constants/table.js +5 -0
- package/dist/constants/table.js.map +1 -0
- package/dist/constants.js +25 -23
- package/dist/constants.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/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/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/OwpPicker/OwpTimePicker.d.ts +1 -1
- package/dist/types/components/OwpSection/OwpSection.d.ts +9 -3
- package/dist/types/components/OwpTable/internal/defaultTableStyle.d.ts +0 -1
- package/dist/types/components/OwpTable/utils/tableSx.d.ts +15 -0
- package/dist/types/constants/index.d.ts +1 -0
- package/dist/types/constants/table.d.ts +1 -0
- 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
|
@@ -2,19 +2,18 @@ var Mt = Object.defineProperty;
|
|
|
2
2
|
var e = (u, I) => Mt(u, "name", { value: I, configurable: !0 });
|
|
3
3
|
import { jsx as m, jsxs as zt } 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 gt } from "../../hooks/useOwpTranslation.js";
|
|
5
|
-
import { ensureDayjsBrowserSetup as Ot } from "../../
|
|
5
|
+
import { owpDayjs as K, ensureDayjsBrowserSetup as Ot } from "../../dayjs.js";
|
|
6
6
|
import Ut from "../../node_modules/.pnpm/@mui_icons-material@7.3.9_@mui_material@7.3.9_@emotion_react@11.14.0_@types_react@19.2._dc2be6bc014bebdac88a574e3e02c144/node_modules/@mui/icons-material/esm/Clear.js";
|
|
7
7
|
import { InputAdornment as $t, IconButton as jt, Paper as Ht } from "@mui/material";
|
|
8
8
|
import { clsx as _ } from "../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js";
|
|
9
9
|
import { enUS as Bt } from "../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/locale/en-US.js";
|
|
10
10
|
import { ko as qt } from "../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/locale/ko.js";
|
|
11
|
-
import K from "dayjs";
|
|
12
11
|
import { useState as O, useRef as y, useMemo as U, useEffect as Ft } from "react";
|
|
13
12
|
import { DatePicker as Gt, CalendarContainer as Jt, registerLocale as et, setDefaultLocale as Qt } 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";
|
|
14
13
|
import { AnimatedCalendarContainer as Tt } from "./internal/AnimatedCalendarContainer.js";
|
|
15
14
|
import { CalendarContainer as Xt } from "./internal/CalendarContainer.js";
|
|
16
15
|
import { DatePickerInput as Zt } from "./internal/DatePickerInput.js";
|
|
17
|
-
import { VALUE_YEAR_FORMATTER as nt, VALUE_MONTH_FORMATTER as at, VALUE_TIME_FORMATTER as $, VALUE_DATE_FORMATTER as
|
|
16
|
+
import { VALUE_YEAR_FORMATTER as nt, VALUE_MONTH_FORMATTER as at, VALUE_TIME_FORMATTER as $, VALUE_DATE_FORMATTER as D, PICKER_INVALID_INPUT_MESSAGE_KEY as Pt } from "./constants/index.js";
|
|
18
17
|
import { getPickerInputMask as Yt, getAdjacentFocusableElement as Wt } from "./utils/index.js";
|
|
19
18
|
import { OwpTextMaskField as vt } from "../OwpTextField/OwpTextMaskField.js";
|
|
20
19
|
et("ko", qt);
|
|
@@ -24,16 +23,16 @@ Ot();
|
|
|
24
23
|
const St = /* @__PURE__ */ e((u) => !(u.ctrlKey || u.altKey || u.metaKey || u.key === "Escape" || u.key === "Enter" || u.key === "Tab"), "isDatePickerOpenKey"), Z = /* @__PURE__ */ e((u, I) => {
|
|
25
24
|
const E = u.trim();
|
|
26
25
|
if (I === nt) {
|
|
27
|
-
const n = `${E}-01-01`, c = K(n,
|
|
28
|
-
return c.isValid() && c.format(
|
|
26
|
+
const n = `${E}-01-01`, c = K(n, D, !0);
|
|
27
|
+
return c.isValid() && c.format(D) === n ? c : null;
|
|
29
28
|
}
|
|
30
29
|
if (I === at) {
|
|
31
|
-
const n = `${E}-01`, c = K(n,
|
|
32
|
-
return c.isValid() && c.format(
|
|
30
|
+
const n = `${E}-01`, c = K(n, D, !0);
|
|
31
|
+
return c.isValid() && c.format(D) === n ? c : null;
|
|
33
32
|
}
|
|
34
|
-
const V = K(E,
|
|
35
|
-
return V.isValid() && V.format(
|
|
36
|
-
}, "parseDatePickerInput"),
|
|
33
|
+
const V = K(E, D, !0);
|
|
34
|
+
return V.isValid() && V.format(D) === E ? V : null;
|
|
35
|
+
}, "parseDatePickerInput"), Ar = /* @__PURE__ */ e(({
|
|
37
36
|
className: u,
|
|
38
37
|
label: I,
|
|
39
38
|
variant: E = "standard",
|
|
@@ -46,7 +45,7 @@ const St = /* @__PURE__ */ e((u) => !(u.ctrlKey || u.altKey || u.metaKey || u.ke
|
|
|
46
45
|
showMonthPicker: N,
|
|
47
46
|
showTimeSelect: b,
|
|
48
47
|
showTimeSelectOnly: i,
|
|
49
|
-
showTimeInput:
|
|
48
|
+
showTimeInput: w,
|
|
50
49
|
textFieldProps: l,
|
|
51
50
|
disabledClearButton: ot,
|
|
52
51
|
disabledFutureDates: it,
|
|
@@ -68,7 +67,7 @@ const St = /* @__PURE__ */ e((u) => !(u.ctrlKey || u.altKey || u.metaKey || u.ke
|
|
|
68
67
|
onInputClick: q,
|
|
69
68
|
preventOpenOnFocus: pt,
|
|
70
69
|
...ft
|
|
71
|
-
} = L, { t: M, i18n: P } = gt(), [mt, Y] = O("bottom-start"), [F, z] = O(!1), [d,
|
|
70
|
+
} = L, { t: M, i18n: P } = gt(), [mt, Y] = O("bottom-start"), [F, z] = O(!1), [d, k] = O(""), [W, f] = O(!1), v = y(null), S = y(null), G = y(null), h = y(null), C = y(0), dt = (P.resolvedLanguage ?? P.language ?? "kr") === "kr" ? "ko" : "en", s = U(() => A ? nt : N ? at : i ? $ : w || b ? `${D} ${$}` : D, [A, N, w, b, i]), J = U(() => {
|
|
72
71
|
if (!n) return null;
|
|
73
72
|
if (i && typeof n == "string") {
|
|
74
73
|
const [t = "", r = ""] = n.split(":"), a = Number(t), R = Number(r);
|
|
@@ -83,16 +82,16 @@ const St = /* @__PURE__ */ e((u) => !(u.ctrlKey || u.altKey || u.metaKey || u.ke
|
|
|
83
82
|
return n ? K(n).format(s) : "";
|
|
84
83
|
const t = Z(n, s);
|
|
85
84
|
return t != null && t.isValid() ? t.format(s) : n;
|
|
86
|
-
}, [n, s]), p = !i && !
|
|
85
|
+
}, [n, s]), p = !i && !w && !b, Dt = U(() => {
|
|
87
86
|
if (!p || !d)
|
|
88
87
|
return J;
|
|
89
88
|
const t = Z(d, s);
|
|
90
89
|
return t != null && t.isValid() ? t.toDate() : J;
|
|
91
|
-
}, [p, d, J, s]),
|
|
90
|
+
}, [p, d, J, s]), kt = /* @__PURE__ */ e((t) => {
|
|
92
91
|
const r = t ? K(t).format(s) : void 0;
|
|
93
|
-
|
|
92
|
+
k(r ?? ""), f(!1), o == null || o(r), p && (C.current = Date.now() + 200, X());
|
|
94
93
|
}, "handleSelect"), T = /* @__PURE__ */ e(() => {
|
|
95
|
-
Date.now() <
|
|
94
|
+
Date.now() < C.current || p && (z(!0), k(Q), f(!1));
|
|
96
95
|
}, "openPicker"), g = /* @__PURE__ */ e((t) => {
|
|
97
96
|
var r;
|
|
98
97
|
p && z(!1), (r = h.current) == null || r.setOpen(!1, t);
|
|
@@ -114,9 +113,9 @@ const St = /* @__PURE__ */ e((u) => !(u.ctrlKey || u.altKey || u.metaKey || u.ke
|
|
|
114
113
|
if (!(r != null && r.isValid()))
|
|
115
114
|
return t && d && f(!0), !1;
|
|
116
115
|
const a = r.format(s);
|
|
117
|
-
return
|
|
116
|
+
return k(a), f(!1), o == null || o(a), !0;
|
|
118
117
|
}, "commitInputDraftValue"), Et = /* @__PURE__ */ e(() => {
|
|
119
|
-
z(!0),
|
|
118
|
+
z(!0), k(Q), f(!1), j == null || j();
|
|
120
119
|
}, "handleCalendarOpen"), bt = /* @__PURE__ */ e(() => {
|
|
121
120
|
z(!1), f(!1), H == null || H();
|
|
122
121
|
}, "handleCalendarClose"), Rt = /* @__PURE__ */ e(() => {
|
|
@@ -129,22 +128,22 @@ const St = /* @__PURE__ */ e((u) => !(u.ctrlKey || u.altKey || u.metaKey || u.ke
|
|
|
129
128
|
(r = l == null ? void 0 : l.onKeyDown) == null || r.call(l, t), !(t.defaultPrevented || !St(t)) && T();
|
|
130
129
|
}, "handleExternalInputKeyDown"), Nt = /* @__PURE__ */ e((t) => {
|
|
131
130
|
tt(), g(), B == null || B(t);
|
|
132
|
-
}, "handleClickOutside"),
|
|
133
|
-
|
|
134
|
-
}, "handlePickerInputChange"),
|
|
131
|
+
}, "handleClickOutside"), wt = /* @__PURE__ */ e((t) => {
|
|
132
|
+
k(t.target.value), f(!1);
|
|
133
|
+
}, "handlePickerInputChange"), Ct = /* @__PURE__ */ e((t) => {
|
|
135
134
|
if (t.stopPropagation(), t.nativeEvent.stopImmediatePropagation(), t.key === "Escape") {
|
|
136
|
-
t.preventDefault(),
|
|
135
|
+
t.preventDefault(), k(Q), f(!1), C.current = Date.now() + 200, g(!0), X();
|
|
137
136
|
return;
|
|
138
137
|
}
|
|
139
138
|
if (!(t.key !== "Enter" && t.key !== "Tab") && (t.preventDefault(), !!tt(!0))) {
|
|
140
139
|
if (t.key === "Tab") {
|
|
141
|
-
|
|
140
|
+
C.current = Date.now() + 200, g(!0), It(t.shiftKey);
|
|
142
141
|
return;
|
|
143
142
|
}
|
|
144
|
-
|
|
143
|
+
C.current = Date.now() + 200, g(!0), X();
|
|
145
144
|
}
|
|
146
145
|
}, "handlePickerInputKeyDown"), _t = /* @__PURE__ */ e(() => {
|
|
147
|
-
|
|
146
|
+
k(""), f(!1), o == null || o("");
|
|
148
147
|
}, "handlePickerInputClear"), yt = /* @__PURE__ */ e(() => {
|
|
149
148
|
i && Y("bottom-start");
|
|
150
149
|
}, "handleInputAreaClick"), Kt = /* @__PURE__ */ e(() => {
|
|
@@ -204,8 +203,8 @@ const St = /* @__PURE__ */ e((u) => !(u.ctrlKey || u.altKey || u.metaKey || u.ke
|
|
|
204
203
|
helperText: W ? M(Pt) : void 0,
|
|
205
204
|
mask: Yt(s),
|
|
206
205
|
placeholder: s,
|
|
207
|
-
onChange:
|
|
208
|
-
onKeyDown:
|
|
206
|
+
onChange: wt,
|
|
207
|
+
onKeyDown: Ct,
|
|
209
208
|
inputProps: {
|
|
210
209
|
inputMode: "numeric",
|
|
211
210
|
"aria-label": s
|
|
@@ -284,12 +283,12 @@ const St = /* @__PURE__ */ e((u) => !(u.ctrlKey || u.altKey || u.metaKey || u.ke
|
|
|
284
283
|
showMonthYearPicker: N,
|
|
285
284
|
showTimeSelect: b,
|
|
286
285
|
showTimeSelectOnly: i,
|
|
287
|
-
showTimeInput:
|
|
286
|
+
showTimeInput: w,
|
|
288
287
|
showPopperArrow: !1,
|
|
289
288
|
open: p ? F : lt,
|
|
290
289
|
preventOpenOnFocus: p ? !0 : pt,
|
|
291
|
-
selected:
|
|
292
|
-
onChange:
|
|
290
|
+
selected: Dt,
|
|
291
|
+
onChange: kt,
|
|
293
292
|
onCalendarOpen: Et,
|
|
294
293
|
onCalendarClose: bt,
|
|
295
294
|
onClickOutside: Nt,
|
|
@@ -303,7 +302,7 @@ const St = /* @__PURE__ */ e((u) => !(u.ctrlKey || u.altKey || u.metaKey || u.ke
|
|
|
303
302
|
A && "w-[140px]",
|
|
304
303
|
N && "w-[160px]",
|
|
305
304
|
!A && !N && "w-[172px]",
|
|
306
|
-
(
|
|
305
|
+
(w || b) && "w-[200px]",
|
|
307
306
|
i && !c && "w-[140px]",
|
|
308
307
|
i && c && "w-[170px]",
|
|
309
308
|
u
|
|
@@ -332,6 +331,6 @@ const St = /* @__PURE__ */ e((u) => !(u.ctrlKey || u.altKey || u.metaKey || u.ke
|
|
|
332
331
|
) });
|
|
333
332
|
}, "OwpDatePicker");
|
|
334
333
|
export {
|
|
335
|
-
|
|
334
|
+
Ar as OwpDatePicker
|
|
336
335
|
};
|
|
337
336
|
//# sourceMappingURL=OwpDatePicker.js.map
|
|
@@ -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, 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":"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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":"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"}
|
|
@@ -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":"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"}
|
|
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;"}
|