@deepnoid/ui 0.1.206 → 0.1.207
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/.turbo/turbo-build.log +494 -484
- package/dist/chunk-3FOLYC6R.mjs +285 -0
- package/dist/chunk-3IBJXQTJ.mjs +42 -0
- package/dist/chunk-I4YRN4UE.mjs +79 -0
- package/dist/{chunk-BTO7MP5N.mjs → chunk-JPNMYMDN.mjs} +4 -4
- package/dist/chunk-QBWQHWNV.mjs +81 -0
- package/dist/components/breadcrumb/breadcrumb.mjs +1 -1
- package/dist/components/breadcrumb/index.mjs +1 -1
- package/dist/components/button/button.mjs +1 -1
- package/dist/components/button/icon-button.mjs +1 -1
- package/dist/components/button/index.mjs +1 -1
- package/dist/components/chip/chip.mjs +1 -1
- package/dist/components/chip/index.mjs +1 -1
- package/dist/components/fileUpload/fileUpload.mjs +1 -1
- package/dist/components/fileUpload/index.mjs +1 -1
- package/dist/components/input/index.mjs +1 -1
- package/dist/components/input/input.mjs +1 -1
- package/dist/components/list/index.mjs +3 -3
- package/dist/components/list/listItem.mjs +3 -3
- package/dist/components/modal/index.mjs +4 -4
- package/dist/components/modal/modal.mjs +4 -4
- package/dist/components/pagination/index.mjs +1 -1
- package/dist/components/pagination/pagination.mjs +1 -1
- package/dist/components/picker/datePicker.mjs +3 -3
- package/dist/components/picker/index.d.mts +1 -1
- package/dist/components/picker/index.d.ts +1 -1
- package/dist/components/picker/index.js +266 -679
- package/dist/components/picker/index.mjs +8 -8
- package/dist/components/picker/timePicker/Panel.d.mts +11 -0
- package/dist/components/picker/timePicker/Panel.d.ts +11 -0
- package/dist/components/picker/timePicker/Panel.js +740 -0
- package/dist/components/picker/timePicker/Panel.mjs +26 -0
- package/dist/components/picker/timePicker/WheelColumn.d.mts +10 -0
- package/dist/components/picker/timePicker/WheelColumn.d.ts +10 -0
- package/dist/components/picker/timePicker/WheelColumn.js +98 -0
- package/dist/components/picker/timePicker/WheelColumn.mjs +8 -0
- package/dist/components/picker/{timePicker.d.ts → timePicker/index.d.mts} +41 -52
- package/dist/components/picker/{timePicker.d.mts → timePicker/index.d.ts} +41 -52
- package/dist/components/picker/{timePicker.js → timePicker/index.js} +702 -1003
- package/dist/components/picker/timePicker/index.mjs +29 -0
- package/dist/components/picker/utils.d.mts +11 -1
- package/dist/components/picker/utils.d.ts +11 -1
- package/dist/components/picker/utils.js +28 -2
- package/dist/components/picker/utils.mjs +7 -3
- package/dist/components/select/index.mjs +1 -1
- package/dist/components/select/select.mjs +1 -1
- package/dist/components/starRating/index.mjs +1 -1
- package/dist/components/starRating/starRating.mjs +1 -1
- package/dist/components/table/index.mjs +1 -1
- package/dist/components/table/table-body.mjs +1 -1
- package/dist/components/table/table-head.mjs +1 -1
- package/dist/components/table/table.mjs +1 -1
- package/dist/components/timePicker/calendar.mjs +2 -2
- package/dist/components/timePicker/useDateTimePicker.mjs +1 -1
- package/dist/components/toast/index.mjs +1 -1
- package/dist/components/toast/toast.mjs +1 -1
- package/dist/components/toast/use-toast.mjs +1 -1
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +479 -397
- package/dist/index.mjs +41 -39
- package/package.json +1 -1
- package/dist/chunk-COGGK5Q6.mjs +0 -365
- package/dist/chunk-FWFEKWWD.mjs +0 -18
- package/dist/components/picker/timePicker.mjs +0 -26
- package/dist/{chunk-IG7QEXDU.mjs → chunk-D72ILS4A.mjs} +3 -3
- package/dist/{chunk-YO4PZXCM.mjs → chunk-K3M3QEEV.mjs} +3 -3
|
@@ -0,0 +1,285 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import {
|
|
3
|
+
Panel_default
|
|
4
|
+
} from "./chunk-QBWQHWNV.mjs";
|
|
5
|
+
import {
|
|
6
|
+
convert24To12
|
|
7
|
+
} from "./chunk-3IBJXQTJ.mjs";
|
|
8
|
+
import {
|
|
9
|
+
input_default
|
|
10
|
+
} from "./chunk-3RTVVQA3.mjs";
|
|
11
|
+
import {
|
|
12
|
+
Icon_default
|
|
13
|
+
} from "./chunk-YEYUS6DW.mjs";
|
|
14
|
+
import {
|
|
15
|
+
mapPropsVariants
|
|
16
|
+
} from "./chunk-E3G5QXSH.mjs";
|
|
17
|
+
import {
|
|
18
|
+
tv
|
|
19
|
+
} from "./chunk-U4DJHAM5.mjs";
|
|
20
|
+
|
|
21
|
+
// src/components/picker/timePicker/index.tsx
|
|
22
|
+
import { forwardRef, useCallback, useMemo, useState, useRef, useEffect } from "react";
|
|
23
|
+
import { createPortal } from "react-dom";
|
|
24
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
25
|
+
var TimePicker = forwardRef((originalProps, ref) => {
|
|
26
|
+
const [props, variantProps] = mapPropsVariants(originalProps, timePickerStyle.variantKeys);
|
|
27
|
+
const {
|
|
28
|
+
classNames,
|
|
29
|
+
label,
|
|
30
|
+
errorMessage,
|
|
31
|
+
value,
|
|
32
|
+
onChange,
|
|
33
|
+
size = "md",
|
|
34
|
+
variant = "solid",
|
|
35
|
+
full = false,
|
|
36
|
+
disabled = false,
|
|
37
|
+
placeholder = "",
|
|
38
|
+
nowTitle,
|
|
39
|
+
confirmTitle,
|
|
40
|
+
...inputProps
|
|
41
|
+
} = { ...props, ...variantProps };
|
|
42
|
+
const slots = useMemo(() => timePickerStyle({ ...variantProps }), [variantProps]);
|
|
43
|
+
const [isPanelOpen, setIsPanelOpen] = useState(false);
|
|
44
|
+
const inputWrapperRef = useRef(null);
|
|
45
|
+
const panelWrapperRef = useRef(null);
|
|
46
|
+
const [panelPos, setPanelPos] = useState({
|
|
47
|
+
top: -9999,
|
|
48
|
+
left: -9999
|
|
49
|
+
});
|
|
50
|
+
const displayValue = useMemo(() => {
|
|
51
|
+
if (!value) return "";
|
|
52
|
+
const { hour, minute, meridiem } = convert24To12(value);
|
|
53
|
+
return `${hour}:${minute} ${meridiem}`;
|
|
54
|
+
}, [value]);
|
|
55
|
+
const calculatePosition = useCallback(() => {
|
|
56
|
+
if (inputWrapperRef.current) {
|
|
57
|
+
const rect = inputWrapperRef.current.getBoundingClientRect();
|
|
58
|
+
setPanelPos({
|
|
59
|
+
top: rect.bottom + window.scrollY + 6,
|
|
60
|
+
left: rect.left + window.scrollX
|
|
61
|
+
});
|
|
62
|
+
}
|
|
63
|
+
}, []);
|
|
64
|
+
const openPanel = () => {
|
|
65
|
+
calculatePosition();
|
|
66
|
+
setIsPanelOpen(true);
|
|
67
|
+
};
|
|
68
|
+
const handleInputFocus = () => {
|
|
69
|
+
openPanel();
|
|
70
|
+
};
|
|
71
|
+
const handleInputKeyDown = (e) => {
|
|
72
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
73
|
+
e.preventDefault();
|
|
74
|
+
calculatePosition();
|
|
75
|
+
setIsPanelOpen((prev) => !prev);
|
|
76
|
+
} else if (e.key === "Escape") setIsPanelOpen(false);
|
|
77
|
+
};
|
|
78
|
+
const handleChange = (time) => {
|
|
79
|
+
onChange(time);
|
|
80
|
+
setIsPanelOpen(false);
|
|
81
|
+
};
|
|
82
|
+
useEffect(() => {
|
|
83
|
+
const handleClickOutside = (e) => {
|
|
84
|
+
var _a, _b;
|
|
85
|
+
const target = e.target;
|
|
86
|
+
if ((_a = inputWrapperRef.current) == null ? void 0 : _a.contains(target)) return;
|
|
87
|
+
if ((_b = panelWrapperRef.current) == null ? void 0 : _b.contains(target)) return;
|
|
88
|
+
setIsPanelOpen(false);
|
|
89
|
+
};
|
|
90
|
+
document.addEventListener("mousedown", handleClickOutside);
|
|
91
|
+
return () => document.removeEventListener("mousedown", handleClickOutside);
|
|
92
|
+
}, []);
|
|
93
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
94
|
+
/* @__PURE__ */ jsx("div", { ref: inputWrapperRef, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), onClick: openPanel, children: /* @__PURE__ */ jsx(
|
|
95
|
+
input_default,
|
|
96
|
+
{
|
|
97
|
+
...inputProps,
|
|
98
|
+
autoComplete: "off",
|
|
99
|
+
ref,
|
|
100
|
+
label,
|
|
101
|
+
value: displayValue,
|
|
102
|
+
placeholder,
|
|
103
|
+
errorMessage,
|
|
104
|
+
size,
|
|
105
|
+
variant,
|
|
106
|
+
full,
|
|
107
|
+
disabled,
|
|
108
|
+
endContent: /* @__PURE__ */ jsx(Icon_default, { name: "clock", size, className: "cursor-pointer" }),
|
|
109
|
+
onFocus: handleInputFocus,
|
|
110
|
+
onKeyDown: handleInputKeyDown,
|
|
111
|
+
onChange: () => {
|
|
112
|
+
},
|
|
113
|
+
classNames: {
|
|
114
|
+
inputWrapper: classNames == null ? void 0 : classNames.inputWrapper,
|
|
115
|
+
input: classNames == null ? void 0 : classNames.input,
|
|
116
|
+
label: classNames == null ? void 0 : classNames.label,
|
|
117
|
+
errorMessage: classNames == null ? void 0 : classNames.errorMessage
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
) }),
|
|
121
|
+
isPanelOpen && createPortal(
|
|
122
|
+
/* @__PURE__ */ jsx(
|
|
123
|
+
"div",
|
|
124
|
+
{
|
|
125
|
+
ref: panelWrapperRef,
|
|
126
|
+
onMouseDown: (e) => e.preventDefault(),
|
|
127
|
+
className: slots.portalWrapper({ class: classNames == null ? void 0 : classNames.portalWrapper }),
|
|
128
|
+
style: {
|
|
129
|
+
position: "absolute",
|
|
130
|
+
top: panelPos.top,
|
|
131
|
+
left: panelPos.left
|
|
132
|
+
},
|
|
133
|
+
children: /* @__PURE__ */ jsx(Panel_default, { nowTitle, confirmTitle, value, onChange: handleChange })
|
|
134
|
+
}
|
|
135
|
+
),
|
|
136
|
+
document.body
|
|
137
|
+
)
|
|
138
|
+
] });
|
|
139
|
+
});
|
|
140
|
+
TimePicker.displayName = "TimePicker";
|
|
141
|
+
var timePicker_default = TimePicker;
|
|
142
|
+
var timePickerStyle = tv({
|
|
143
|
+
slots: {
|
|
144
|
+
base: ["group/timepicker", "flex", "flex-col"],
|
|
145
|
+
label: ["flex", "items-center", "font-bold", "text-body-foreground", "min-w-[80px]"],
|
|
146
|
+
wrapper: ["flex", "flex-col"],
|
|
147
|
+
inputWrapper: [
|
|
148
|
+
"flex",
|
|
149
|
+
"items-center",
|
|
150
|
+
"justify-between",
|
|
151
|
+
"border",
|
|
152
|
+
"cursor-pointer",
|
|
153
|
+
"text-neutral-main",
|
|
154
|
+
"hover:bg-trans-soft",
|
|
155
|
+
"group-has-[p.error]/timepicker:border-danger-main",
|
|
156
|
+
"group-has-[p.error]/timepicker:bg-danger-soft",
|
|
157
|
+
"group-has-[p.error]/timepicker:text-danger-main",
|
|
158
|
+
"group-has-[p.error]/timepicker:hover:bg-danger-soft"
|
|
159
|
+
],
|
|
160
|
+
input: [
|
|
161
|
+
"bg-transparent",
|
|
162
|
+
"w-full",
|
|
163
|
+
"outline-none",
|
|
164
|
+
"placeholder:text-neutral-main",
|
|
165
|
+
"text-body-foreground",
|
|
166
|
+
"group-has-[p.error]/timepicker:text-danger-main",
|
|
167
|
+
"group-has-[p.error]/timepicker:placeholder:text-danger-main",
|
|
168
|
+
"cursor-pointer"
|
|
169
|
+
],
|
|
170
|
+
portalWrapper: [
|
|
171
|
+
"rounded-[10px]",
|
|
172
|
+
"bg-body-background",
|
|
173
|
+
"shadow-drop-md",
|
|
174
|
+
"overflow-auto",
|
|
175
|
+
"p-[10px]",
|
|
176
|
+
"w-[165px]",
|
|
177
|
+
"h-[137px]",
|
|
178
|
+
"flex",
|
|
179
|
+
"flex-col",
|
|
180
|
+
"gap-[5px]"
|
|
181
|
+
],
|
|
182
|
+
errorMessage: ["text-danger-main", "text-sm"]
|
|
183
|
+
},
|
|
184
|
+
variants: {
|
|
185
|
+
variant: {
|
|
186
|
+
solid: {
|
|
187
|
+
inputWrapper: ["border-transparent", "bg-trans-soft"],
|
|
188
|
+
readonlyWrapper: ["!bg-trans-light"]
|
|
189
|
+
},
|
|
190
|
+
outline: {
|
|
191
|
+
inputWrapper: [
|
|
192
|
+
"border-neutral-light",
|
|
193
|
+
"group-has-[:hover:not(:read-only):not(:focus)]/input:bg-trans-soft",
|
|
194
|
+
"group-has-[:focus:not(:read-only)]/input:bg-body-background",
|
|
195
|
+
"group-has-[p.error]/input:border-danger-main"
|
|
196
|
+
],
|
|
197
|
+
readonlyWrapper: ["!bg-trans-soft"]
|
|
198
|
+
},
|
|
199
|
+
underline: {
|
|
200
|
+
inputWrapper: [
|
|
201
|
+
"bg-transparent",
|
|
202
|
+
"rounded-none",
|
|
203
|
+
"group-has-[:hover:not(:read-only):not(:focus)]/input:bg-trans-soft",
|
|
204
|
+
"group-has-[:focus:not(:read-only)]/input:bg-body-background",
|
|
205
|
+
"group-has-[p.error]/input:border-danger-main"
|
|
206
|
+
],
|
|
207
|
+
readonlyWrapper: ["!bg-trans-soft"]
|
|
208
|
+
}
|
|
209
|
+
},
|
|
210
|
+
size: {
|
|
211
|
+
sm: {
|
|
212
|
+
base: ["text-sm", "gap-[4px]"],
|
|
213
|
+
label: ["text-sm"],
|
|
214
|
+
wrapper: ["gap-[4px]"],
|
|
215
|
+
inputWrapper: ["w-[240px]", "h-[24px]", "rounded-sm", "px-[4px]"],
|
|
216
|
+
input: ["text-sm"],
|
|
217
|
+
errorMessage: ["text-sm"]
|
|
218
|
+
},
|
|
219
|
+
md: {
|
|
220
|
+
base: ["text-md", "gap-[6px]"],
|
|
221
|
+
label: ["text-md"],
|
|
222
|
+
wrapper: ["gap-[6px]"],
|
|
223
|
+
inputWrapper: ["w-[240px]", "h-[32px]", "rounded-md", "px-[6px]"],
|
|
224
|
+
input: ["text-md"],
|
|
225
|
+
errorMessage: ["text-sm"]
|
|
226
|
+
},
|
|
227
|
+
lg: {
|
|
228
|
+
base: ["text-lg", "gap-[8px]"],
|
|
229
|
+
label: ["text-lg"],
|
|
230
|
+
wrapper: ["gap-[8px]"],
|
|
231
|
+
inputWrapper: ["w-[240px]", "h-[40px]", "rounded-lg", "px-[8px]"],
|
|
232
|
+
input: ["text-lg"],
|
|
233
|
+
errorMessage: ["text-md"]
|
|
234
|
+
},
|
|
235
|
+
xl: {
|
|
236
|
+
base: ["text-xl", "gap-[10px]"],
|
|
237
|
+
label: ["text-xl"],
|
|
238
|
+
wrapper: ["gap-[10px]"],
|
|
239
|
+
inputWrapper: ["w-[240px]", "h-[50px]", "rounded-lg", "px-[10px]"],
|
|
240
|
+
input: ["text-xl"],
|
|
241
|
+
errorMessage: ["text-md"]
|
|
242
|
+
}
|
|
243
|
+
},
|
|
244
|
+
full: {
|
|
245
|
+
true: {
|
|
246
|
+
base: ["w-full"],
|
|
247
|
+
wrapper: ["w-full"],
|
|
248
|
+
inputWrapper: ["w-full"]
|
|
249
|
+
}
|
|
250
|
+
},
|
|
251
|
+
disabled: {
|
|
252
|
+
true: {
|
|
253
|
+
base: ["pointer-events-none"],
|
|
254
|
+
label: ["text-neutral-light"],
|
|
255
|
+
inputWrapper: [
|
|
256
|
+
"bg-neutral-soft",
|
|
257
|
+
"border-neutral-light",
|
|
258
|
+
"group-has-[p.error]/timepicker:text-danger-light",
|
|
259
|
+
"group-has-[p.error]/timepicker:bg-danger-soft",
|
|
260
|
+
"group-has-[p.error]/timepicker:border-danger-light",
|
|
261
|
+
"cursor-not-allowed"
|
|
262
|
+
],
|
|
263
|
+
input: [
|
|
264
|
+
"text-neutral-light",
|
|
265
|
+
"placeholder:text-neutral-light",
|
|
266
|
+
"group-has-[p.error]/timepicker:text-danger-light",
|
|
267
|
+
"group-has-[p.error]/timepicker:placeholder:text-danger-light",
|
|
268
|
+
"cursor-not-allowed"
|
|
269
|
+
],
|
|
270
|
+
errorMessage: ["text-danger-light"]
|
|
271
|
+
}
|
|
272
|
+
}
|
|
273
|
+
},
|
|
274
|
+
defaultVariants: {
|
|
275
|
+
color: "primary",
|
|
276
|
+
size: "md",
|
|
277
|
+
full: false,
|
|
278
|
+
disabled: false
|
|
279
|
+
}
|
|
280
|
+
});
|
|
281
|
+
|
|
282
|
+
export {
|
|
283
|
+
timePicker_default,
|
|
284
|
+
timePickerStyle
|
|
285
|
+
};
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
// src/components/picker/utils.ts
|
|
4
|
+
var formatDateToString = (date) => {
|
|
5
|
+
const year = date.getFullYear();
|
|
6
|
+
const month = String(date.getMonth() + 1).padStart(2, "0");
|
|
7
|
+
const day = String(date.getDate()).padStart(2, "0");
|
|
8
|
+
return `${year}-${month}-${day}`;
|
|
9
|
+
};
|
|
10
|
+
var formatStringToDate = (date) => {
|
|
11
|
+
const formattedDate = new Date(date);
|
|
12
|
+
return formattedDate;
|
|
13
|
+
};
|
|
14
|
+
var convert24To12 = (time24) => {
|
|
15
|
+
const [HH, MM] = time24.split(":");
|
|
16
|
+
let h = Number(HH);
|
|
17
|
+
const minute = MM || "";
|
|
18
|
+
const meridiem = h >= 12 ? "PM" : "AM";
|
|
19
|
+
let hour12 = h % 12;
|
|
20
|
+
if (hour12 === 0) hour12 = 12;
|
|
21
|
+
const hour = String(hour12).padStart(2, "0");
|
|
22
|
+
return { hour, minute, meridiem };
|
|
23
|
+
};
|
|
24
|
+
var getCurrent12Hour = () => {
|
|
25
|
+
const now = /* @__PURE__ */ new Date();
|
|
26
|
+
let hour = now.getHours();
|
|
27
|
+
const minute = String(now.getMinutes()).padStart(2, "0");
|
|
28
|
+
const meridiem = hour >= 12 ? "PM" : "AM";
|
|
29
|
+
hour = hour % 12 || 12;
|
|
30
|
+
return {
|
|
31
|
+
hour: String(hour).padStart(2, "0"),
|
|
32
|
+
minute,
|
|
33
|
+
meridiem
|
|
34
|
+
};
|
|
35
|
+
};
|
|
36
|
+
|
|
37
|
+
export {
|
|
38
|
+
formatDateToString,
|
|
39
|
+
formatStringToDate,
|
|
40
|
+
convert24To12,
|
|
41
|
+
getCurrent12Hour
|
|
42
|
+
};
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
// src/components/picker/timePicker/WheelColumn.tsx
|
|
4
|
+
import { useEffect, useRef, useState } from "react";
|
|
5
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
|
+
var ITEM_HEIGHT = 30;
|
|
7
|
+
var ACTIVE_HEIGHT = 34;
|
|
8
|
+
function WheelColumn({ list, value, onChange }) {
|
|
9
|
+
const ref = useRef(null);
|
|
10
|
+
const internalChangeRef = useRef(false);
|
|
11
|
+
const [currentIndex, setCurrentIndex] = useState(0);
|
|
12
|
+
const scrollToIndex = (index, behavior = "smooth") => {
|
|
13
|
+
if (!ref.current) return;
|
|
14
|
+
const diff = ACTIVE_HEIGHT - ITEM_HEIGHT;
|
|
15
|
+
let centerOffset = index > 0 && behavior === "auto" ? diff : 0;
|
|
16
|
+
if (behavior === "auto" && currentIndex !== 0) centerOffset -= 4;
|
|
17
|
+
const top = index * ITEM_HEIGHT + centerOffset;
|
|
18
|
+
ref.current.scrollTo({ top, behavior });
|
|
19
|
+
};
|
|
20
|
+
const finalizeScroll = (index) => {
|
|
21
|
+
internalChangeRef.current = true;
|
|
22
|
+
const v = list[index];
|
|
23
|
+
setCurrentIndex(index);
|
|
24
|
+
scrollToIndex(index, "smooth");
|
|
25
|
+
if (v) onChange(v);
|
|
26
|
+
};
|
|
27
|
+
const handleClick = (index) => finalizeScroll(index);
|
|
28
|
+
useEffect(() => {
|
|
29
|
+
if (!ref.current || !value) return;
|
|
30
|
+
const idx = list.indexOf(value);
|
|
31
|
+
if (idx < 0) return;
|
|
32
|
+
if (internalChangeRef.current) {
|
|
33
|
+
internalChangeRef.current = false;
|
|
34
|
+
return;
|
|
35
|
+
}
|
|
36
|
+
setCurrentIndex(idx);
|
|
37
|
+
scrollToIndex(idx, "auto");
|
|
38
|
+
}, [value]);
|
|
39
|
+
useEffect(() => {
|
|
40
|
+
const el = ref.current;
|
|
41
|
+
if (!el) return;
|
|
42
|
+
const handleWheel = (e) => {
|
|
43
|
+
e.preventDefault();
|
|
44
|
+
let newIndex = currentIndex;
|
|
45
|
+
if (e.deltaY > 0) {
|
|
46
|
+
newIndex = Math.min(currentIndex + 1, list.length - 1);
|
|
47
|
+
} else if (e.deltaY < 0) {
|
|
48
|
+
newIndex = Math.max(currentIndex - 1, 0);
|
|
49
|
+
}
|
|
50
|
+
finalizeScroll(newIndex);
|
|
51
|
+
};
|
|
52
|
+
el.addEventListener("wheel", handleWheel, { passive: false });
|
|
53
|
+
return () => el.removeEventListener("wheel", handleWheel);
|
|
54
|
+
}, [currentIndex, list, onChange]);
|
|
55
|
+
return /* @__PURE__ */ jsxs("div", { className: "relative h-[94px] w-[40px]", children: [
|
|
56
|
+
/* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute left-1/2 top-[30px] h-[34px] w-[40px] -translate-x-1/2 rounded-[10px] shadow-[inset_0_0_0_1.5px_var(--dn-primary-light)]" }),
|
|
57
|
+
/* @__PURE__ */ jsxs("div", { ref, className: "scrollbar-none relative h-full select-none overflow-y-scroll py-[0]", children: [
|
|
58
|
+
/* @__PURE__ */ jsx("div", { style: { height: ITEM_HEIGHT } }),
|
|
59
|
+
list.map((v, i) => {
|
|
60
|
+
const isActive = i === currentIndex;
|
|
61
|
+
return /* @__PURE__ */ jsx(
|
|
62
|
+
"div",
|
|
63
|
+
{
|
|
64
|
+
onClick: () => handleClick(i),
|
|
65
|
+
className: `flex items-center justify-center text-sm font-bold transition-all ${isActive ? "text-body-foreground" : "text-neutral-light"}`,
|
|
66
|
+
style: { height: isActive ? ACTIVE_HEIGHT : ITEM_HEIGHT },
|
|
67
|
+
children: v
|
|
68
|
+
},
|
|
69
|
+
i
|
|
70
|
+
);
|
|
71
|
+
}),
|
|
72
|
+
/* @__PURE__ */ jsx("div", { style: { height: list.length >= 3 ? ITEM_HEIGHT + 4 : ITEM_HEIGHT } })
|
|
73
|
+
] })
|
|
74
|
+
] });
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
export {
|
|
78
|
+
WheelColumn
|
|
79
|
+
};
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import {
|
|
3
|
-
formatDateToString,
|
|
4
|
-
formatStringToDate
|
|
5
|
-
} from "./chunk-FWFEKWWD.mjs";
|
|
6
2
|
import {
|
|
7
3
|
day_default
|
|
8
4
|
} from "./chunk-XZYQFBCT.mjs";
|
|
5
|
+
import {
|
|
6
|
+
formatDateToString,
|
|
7
|
+
formatStringToDate
|
|
8
|
+
} from "./chunk-3IBJXQTJ.mjs";
|
|
9
9
|
import {
|
|
10
10
|
input_default
|
|
11
11
|
} from "./chunk-3RTVVQA3.mjs";
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import {
|
|
3
|
+
WheelColumn
|
|
4
|
+
} from "./chunk-I4YRN4UE.mjs";
|
|
5
|
+
import {
|
|
6
|
+
convert24To12,
|
|
7
|
+
getCurrent12Hour
|
|
8
|
+
} from "./chunk-3IBJXQTJ.mjs";
|
|
9
|
+
import {
|
|
10
|
+
text_button_default
|
|
11
|
+
} from "./chunk-4LUASWAN.mjs";
|
|
12
|
+
|
|
13
|
+
// src/components/picker/timePicker/Panel.tsx
|
|
14
|
+
import { forwardRef, useEffect, useState } from "react";
|
|
15
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
16
|
+
var hours = [...Array(12)].map((_, i) => String(i + 1).padStart(2, "0"));
|
|
17
|
+
var minutes = [...Array(60)].map((_, i) => String(i).padStart(2, "0"));
|
|
18
|
+
var meridiemList = ["AM", "PM"];
|
|
19
|
+
var TimePickerPanel = forwardRef(
|
|
20
|
+
({ value, onChange, nowTitle, confirmTitle }, ref) => {
|
|
21
|
+
const [time, setTime] = useState({ hour: "", minute: "", meridiem: "" });
|
|
22
|
+
const handleNow = () => {
|
|
23
|
+
setTime(getCurrent12Hour());
|
|
24
|
+
};
|
|
25
|
+
const handleConfirm = (time2) => {
|
|
26
|
+
const { hour, minute, meridiem } = time2;
|
|
27
|
+
let h = Number(hour);
|
|
28
|
+
if (meridiem === "AM") {
|
|
29
|
+
if (h === 12) h = 0;
|
|
30
|
+
} else {
|
|
31
|
+
if (h !== 12) h += 12;
|
|
32
|
+
}
|
|
33
|
+
const HH = String(h).padStart(2, "0");
|
|
34
|
+
const MM = minute.padStart(2, "0");
|
|
35
|
+
const SS = "00";
|
|
36
|
+
onChange(`${HH}:${MM}:${SS}`);
|
|
37
|
+
};
|
|
38
|
+
useEffect(() => {
|
|
39
|
+
setTime(value ? convert24To12(value) : getCurrent12Hour());
|
|
40
|
+
}, [value]);
|
|
41
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
42
|
+
/* @__PURE__ */ jsxs("div", { ref, className: "flex gap-[10px]", children: [
|
|
43
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-[5px]", children: [
|
|
44
|
+
/* @__PURE__ */ jsx(WheelColumn, { list: hours, value: time.hour, onChange: (v) => setTime({ ...time, hour: v }) }),
|
|
45
|
+
/* @__PURE__ */ jsx("span", { className: "w-[5px] text-sm font-bold", children: ":" }),
|
|
46
|
+
/* @__PURE__ */ jsx(WheelColumn, { list: minutes, value: time.minute, onChange: (v) => setTime({ ...time, minute: v }) })
|
|
47
|
+
] }),
|
|
48
|
+
/* @__PURE__ */ jsx(WheelColumn, { list: meridiemList, value: time.meridiem, onChange: (v) => setTime({ ...time, meridiem: v }) })
|
|
49
|
+
] }),
|
|
50
|
+
/* @__PURE__ */ jsxs("div", { className: "flex justify-between px-1 text-sm", children: [
|
|
51
|
+
/* @__PURE__ */ jsx(
|
|
52
|
+
text_button_default,
|
|
53
|
+
{
|
|
54
|
+
variant: "underline",
|
|
55
|
+
color: "neutral",
|
|
56
|
+
size: "sm",
|
|
57
|
+
classNames: { base: "font-bold" },
|
|
58
|
+
onClick: handleNow,
|
|
59
|
+
children: nowTitle
|
|
60
|
+
}
|
|
61
|
+
),
|
|
62
|
+
/* @__PURE__ */ jsx(
|
|
63
|
+
text_button_default,
|
|
64
|
+
{
|
|
65
|
+
variant: "underline",
|
|
66
|
+
size: "sm",
|
|
67
|
+
classNames: { base: "font-bold" },
|
|
68
|
+
onClick: () => handleConfirm(time),
|
|
69
|
+
children: confirmTitle
|
|
70
|
+
}
|
|
71
|
+
)
|
|
72
|
+
] })
|
|
73
|
+
] });
|
|
74
|
+
}
|
|
75
|
+
);
|
|
76
|
+
var Panel_default = TimePickerPanel;
|
|
77
|
+
|
|
78
|
+
export {
|
|
79
|
+
TimePickerPanel,
|
|
80
|
+
Panel_default
|
|
81
|
+
};
|
|
@@ -12,8 +12,8 @@ import "../../chunk-LXHUO6VM.mjs";
|
|
|
12
12
|
import "../../chunk-SZL743JC.mjs";
|
|
13
13
|
import "../../chunk-ZYIIXWVY.mjs";
|
|
14
14
|
import "../../chunk-YEYUS6DW.mjs";
|
|
15
|
-
import "../../chunk-5BT37SLM.mjs";
|
|
16
15
|
import "../../chunk-E3G5QXSH.mjs";
|
|
16
|
+
import "../../chunk-5BT37SLM.mjs";
|
|
17
17
|
import "../../chunk-U4DJHAM5.mjs";
|
|
18
18
|
import "../../chunk-27Y6K5NK.mjs";
|
|
19
19
|
import "../../chunk-AC6TWLRT.mjs";
|
|
@@ -13,8 +13,8 @@ import "../../chunk-LXHUO6VM.mjs";
|
|
|
13
13
|
import "../../chunk-SZL743JC.mjs";
|
|
14
14
|
import "../../chunk-ZYIIXWVY.mjs";
|
|
15
15
|
import "../../chunk-YEYUS6DW.mjs";
|
|
16
|
-
import "../../chunk-5BT37SLM.mjs";
|
|
17
16
|
import "../../chunk-E3G5QXSH.mjs";
|
|
17
|
+
import "../../chunk-5BT37SLM.mjs";
|
|
18
18
|
import "../../chunk-U4DJHAM5.mjs";
|
|
19
19
|
import "../../chunk-27Y6K5NK.mjs";
|
|
20
20
|
import "../../chunk-AC6TWLRT.mjs";
|
|
@@ -7,8 +7,8 @@ import "../../chunk-LXHUO6VM.mjs";
|
|
|
7
7
|
import "../../chunk-SZL743JC.mjs";
|
|
8
8
|
import "../../chunk-ZYIIXWVY.mjs";
|
|
9
9
|
import "../../chunk-YEYUS6DW.mjs";
|
|
10
|
-
import "../../chunk-5BT37SLM.mjs";
|
|
11
10
|
import "../../chunk-E3G5QXSH.mjs";
|
|
11
|
+
import "../../chunk-5BT37SLM.mjs";
|
|
12
12
|
import "../../chunk-U4DJHAM5.mjs";
|
|
13
13
|
import "../../chunk-AC6TWLRT.mjs";
|
|
14
14
|
export {
|
|
@@ -7,8 +7,8 @@ import "../../chunk-LXHUO6VM.mjs";
|
|
|
7
7
|
import "../../chunk-SZL743JC.mjs";
|
|
8
8
|
import "../../chunk-ZYIIXWVY.mjs";
|
|
9
9
|
import "../../chunk-YEYUS6DW.mjs";
|
|
10
|
-
import "../../chunk-5BT37SLM.mjs";
|
|
11
10
|
import "../../chunk-E3G5QXSH.mjs";
|
|
11
|
+
import "../../chunk-5BT37SLM.mjs";
|
|
12
12
|
import "../../chunk-U4DJHAM5.mjs";
|
|
13
13
|
import "../../chunk-AC6TWLRT.mjs";
|
|
14
14
|
export {
|
|
@@ -17,8 +17,8 @@ import "../../chunk-LXHUO6VM.mjs";
|
|
|
17
17
|
import "../../chunk-SZL743JC.mjs";
|
|
18
18
|
import "../../chunk-ZYIIXWVY.mjs";
|
|
19
19
|
import "../../chunk-YEYUS6DW.mjs";
|
|
20
|
-
import "../../chunk-5BT37SLM.mjs";
|
|
21
20
|
import "../../chunk-E3G5QXSH.mjs";
|
|
21
|
+
import "../../chunk-5BT37SLM.mjs";
|
|
22
22
|
import "../../chunk-U4DJHAM5.mjs";
|
|
23
23
|
import "../../chunk-27Y6K5NK.mjs";
|
|
24
24
|
import "../../chunk-AC6TWLRT.mjs";
|
|
@@ -4,8 +4,8 @@ import {
|
|
|
4
4
|
} from "../../chunk-XPFBM2RK.mjs";
|
|
5
5
|
import "../../chunk-ZYIIXWVY.mjs";
|
|
6
6
|
import "../../chunk-YEYUS6DW.mjs";
|
|
7
|
-
import "../../chunk-5BT37SLM.mjs";
|
|
8
7
|
import "../../chunk-E3G5QXSH.mjs";
|
|
8
|
+
import "../../chunk-5BT37SLM.mjs";
|
|
9
9
|
import "../../chunk-U4DJHAM5.mjs";
|
|
10
10
|
import "../../chunk-AC6TWLRT.mjs";
|
|
11
11
|
export {
|
|
@@ -5,8 +5,8 @@ import {
|
|
|
5
5
|
} from "../../chunk-XPFBM2RK.mjs";
|
|
6
6
|
import "../../chunk-ZYIIXWVY.mjs";
|
|
7
7
|
import "../../chunk-YEYUS6DW.mjs";
|
|
8
|
-
import "../../chunk-5BT37SLM.mjs";
|
|
9
8
|
import "../../chunk-E3G5QXSH.mjs";
|
|
9
|
+
import "../../chunk-5BT37SLM.mjs";
|
|
10
10
|
import "../../chunk-U4DJHAM5.mjs";
|
|
11
11
|
import "../../chunk-AC6TWLRT.mjs";
|
|
12
12
|
export {
|
|
@@ -18,8 +18,8 @@ import "../../chunk-LXHUO6VM.mjs";
|
|
|
18
18
|
import "../../chunk-SZL743JC.mjs";
|
|
19
19
|
import "../../chunk-ZYIIXWVY.mjs";
|
|
20
20
|
import "../../chunk-YEYUS6DW.mjs";
|
|
21
|
-
import "../../chunk-5BT37SLM.mjs";
|
|
22
21
|
import "../../chunk-E3G5QXSH.mjs";
|
|
22
|
+
import "../../chunk-5BT37SLM.mjs";
|
|
23
23
|
import "../../chunk-U4DJHAM5.mjs";
|
|
24
24
|
import "../../chunk-3V4HT2K5.mjs";
|
|
25
25
|
import "../../chunk-27Y6K5NK.mjs";
|
|
@@ -17,8 +17,8 @@ import "../../chunk-LXHUO6VM.mjs";
|
|
|
17
17
|
import "../../chunk-SZL743JC.mjs";
|
|
18
18
|
import "../../chunk-ZYIIXWVY.mjs";
|
|
19
19
|
import "../../chunk-YEYUS6DW.mjs";
|
|
20
|
-
import "../../chunk-5BT37SLM.mjs";
|
|
21
20
|
import "../../chunk-E3G5QXSH.mjs";
|
|
21
|
+
import "../../chunk-5BT37SLM.mjs";
|
|
22
22
|
import "../../chunk-U4DJHAM5.mjs";
|
|
23
23
|
import "../../chunk-3V4HT2K5.mjs";
|
|
24
24
|
import "../../chunk-27Y6K5NK.mjs";
|
|
@@ -5,8 +5,8 @@ import {
|
|
|
5
5
|
} from "../../chunk-3RTVVQA3.mjs";
|
|
6
6
|
import "../../chunk-ZYIIXWVY.mjs";
|
|
7
7
|
import "../../chunk-YEYUS6DW.mjs";
|
|
8
|
-
import "../../chunk-5BT37SLM.mjs";
|
|
9
8
|
import "../../chunk-E3G5QXSH.mjs";
|
|
9
|
+
import "../../chunk-5BT37SLM.mjs";
|
|
10
10
|
import "../../chunk-U4DJHAM5.mjs";
|
|
11
11
|
import "../../chunk-27Y6K5NK.mjs";
|
|
12
12
|
import "../../chunk-AC6TWLRT.mjs";
|
|
@@ -5,8 +5,8 @@ import {
|
|
|
5
5
|
} from "../../chunk-3RTVVQA3.mjs";
|
|
6
6
|
import "../../chunk-ZYIIXWVY.mjs";
|
|
7
7
|
import "../../chunk-YEYUS6DW.mjs";
|
|
8
|
-
import "../../chunk-5BT37SLM.mjs";
|
|
9
8
|
import "../../chunk-E3G5QXSH.mjs";
|
|
9
|
+
import "../../chunk-5BT37SLM.mjs";
|
|
10
10
|
import "../../chunk-U4DJHAM5.mjs";
|
|
11
11
|
import "../../chunk-27Y6K5NK.mjs";
|
|
12
12
|
import "../../chunk-AC6TWLRT.mjs";
|
|
@@ -5,12 +5,12 @@ import {
|
|
|
5
5
|
} from "../../chunk-NGRGAY42.mjs";
|
|
6
6
|
import {
|
|
7
7
|
listItem_default
|
|
8
|
-
} from "../../chunk-
|
|
9
|
-
import "../../chunk-JQ5C2U5I.mjs";
|
|
8
|
+
} from "../../chunk-K3M3QEEV.mjs";
|
|
10
9
|
import "../../chunk-ZYIIXWVY.mjs";
|
|
11
10
|
import "../../chunk-YEYUS6DW.mjs";
|
|
12
|
-
import "../../chunk-5BT37SLM.mjs";
|
|
13
11
|
import "../../chunk-E3G5QXSH.mjs";
|
|
12
|
+
import "../../chunk-JQ5C2U5I.mjs";
|
|
13
|
+
import "../../chunk-5BT37SLM.mjs";
|
|
14
14
|
import "../../chunk-U4DJHAM5.mjs";
|
|
15
15
|
import "../../chunk-AC6TWLRT.mjs";
|
|
16
16
|
export {
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import {
|
|
3
3
|
listItem_default
|
|
4
|
-
} from "../../chunk-
|
|
5
|
-
import "../../chunk-JQ5C2U5I.mjs";
|
|
4
|
+
} from "../../chunk-K3M3QEEV.mjs";
|
|
6
5
|
import "../../chunk-ZYIIXWVY.mjs";
|
|
7
6
|
import "../../chunk-YEYUS6DW.mjs";
|
|
8
|
-
import "../../chunk-5BT37SLM.mjs";
|
|
9
7
|
import "../../chunk-E3G5QXSH.mjs";
|
|
8
|
+
import "../../chunk-JQ5C2U5I.mjs";
|
|
9
|
+
import "../../chunk-5BT37SLM.mjs";
|
|
10
10
|
import "../../chunk-U4DJHAM5.mjs";
|
|
11
11
|
import "../../chunk-AC6TWLRT.mjs";
|
|
12
12
|
export {
|