@epilot/volt-ui-experimental-griffel 0.2.3 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/ADOPTING.md +416 -0
- package/README.md +32 -31
- package/dist/_virtual/jsx-dev-runtime.js +5 -0
- package/dist/_virtual/jsx-dev-runtime.js.map +1 -0
- package/dist/_virtual/react-jsx-dev-runtime.development.js +5 -0
- package/dist/_virtual/react-jsx-dev-runtime.development.js.map +1 -0
- package/dist/_virtual/react-jsx-dev-runtime.production.js +5 -0
- package/dist/_virtual/react-jsx-dev-runtime.production.js.map +1 -0
- package/dist/components/accordion/accordion.js +126 -66
- package/dist/components/accordion/accordion.js.map +1 -1
- package/dist/components/alert-dialog/alert-dialog.js +239 -137
- package/dist/components/alert-dialog/alert-dialog.js.map +1 -1
- package/dist/components/avatar/avatar-group.js +102 -47
- package/dist/components/avatar/avatar-group.js.map +1 -1
- package/dist/components/avatar/avatar.js +97 -73
- package/dist/components/avatar/avatar.js.map +1 -1
- package/dist/components/badge/badge.js +53 -37
- package/dist/components/badge/badge.js.map +1 -1
- package/dist/components/breadcrumb/breadcrumb.js +97 -49
- package/dist/components/breadcrumb/breadcrumb.js.map +1 -1
- package/dist/components/button/button.js +88 -77
- package/dist/components/button/button.js.map +1 -1
- package/dist/components/button-group/button-group.js +55 -31
- package/dist/components/button-group/button-group.js.map +1 -1
- package/dist/components/callout/callout.js +288 -164
- package/dist/components/callout/callout.js.map +1 -1
- package/dist/components/card/card.js +137 -81
- package/dist/components/card/card.js.map +1 -1
- package/dist/components/checkbox/checkbox.js +100 -49
- package/dist/components/checkbox/checkbox.js.map +1 -1
- package/dist/components/collapsible-sidebar/collapsible-sidebar.js +155 -107
- package/dist/components/collapsible-sidebar/collapsible-sidebar.js.map +1 -1
- package/dist/components/command/command.js +297 -158
- package/dist/components/command/command.js.map +1 -1
- package/dist/components/data-table/data-table-body.js +114 -54
- package/dist/components/data-table/data-table-body.js.map +1 -1
- package/dist/components/data-table/data-table-column-header.js +117 -45
- package/dist/components/data-table/data-table-column-header.js.map +1 -1
- package/dist/components/data-table/data-table-column-visibility.js +98 -39
- package/dist/components/data-table/data-table-column-visibility.js.map +1 -1
- package/dist/components/data-table/data-table-content.js +90 -58
- package/dist/components/data-table/data-table-content.js.map +1 -1
- package/dist/components/data-table/data-table-error.js +83 -39
- package/dist/components/data-table/data-table-error.js.map +1 -1
- package/dist/components/data-table/data-table-header.js +88 -54
- package/dist/components/data-table/data-table-header.js.map +1 -1
- package/dist/components/data-table/data-table-loading.js +27 -15
- package/dist/components/data-table/data-table-loading.js.map +1 -1
- package/dist/components/data-table/data-table-pagination.js +27 -19
- package/dist/components/data-table/data-table-pagination.js.map +1 -1
- package/dist/components/data-table/data-table-row.js +87 -64
- package/dist/components/data-table/data-table-row.js.map +1 -1
- package/dist/components/data-table/data-table-toolbar.js +24 -16
- package/dist/components/data-table/data-table-toolbar.js.map +1 -1
- package/dist/components/data-table/data-table.js +182 -145
- package/dist/components/data-table/data-table.js.map +1 -1
- package/dist/components/date-range-picker/date-range-picker.js +342 -214
- package/dist/components/date-range-picker/date-range-picker.js.map +1 -1
- package/dist/components/date-range-picker/range-calendar.js +132 -92
- package/dist/components/date-range-picker/range-calendar.js.map +1 -1
- package/dist/components/date-time-picker/calendar.js +501 -317
- package/dist/components/date-time-picker/calendar.js.map +1 -1
- package/dist/components/date-time-picker/date-time-picker-context.js +64 -60
- package/dist/components/date-time-picker/date-time-picker-context.js.map +1 -1
- package/dist/components/date-time-picker/date-time-picker-input.js +249 -149
- package/dist/components/date-time-picker/date-time-picker-input.js.map +1 -1
- package/dist/components/date-time-picker/date-time-picker-panel.js +273 -165
- package/dist/components/date-time-picker/date-time-picker-panel.js.map +1 -1
- package/dist/components/date-time-picker/date-time-picker-popover.js +22 -14
- package/dist/components/date-time-picker/date-time-picker-popover.js.map +1 -1
- package/dist/components/date-time-picker/date-time-picker.js +134 -90
- package/dist/components/date-time-picker/date-time-picker.js.map +1 -1
- package/dist/components/date-time-picker/time-picker.js +198 -132
- package/dist/components/date-time-picker/time-picker.js.map +1 -1
- package/dist/components/density-provider/density-provider.js +48 -0
- package/dist/components/density-provider/density-provider.js.map +1 -0
- package/dist/components/dialog/dialog.js +280 -150
- package/dist/components/dialog/dialog.js.map +1 -1
- package/dist/components/drawer/drawer.js +273 -163
- package/dist/components/drawer/drawer.js.map +1 -1
- package/dist/components/dropdown-menu/dropdown-menu.js +378 -195
- package/dist/components/dropdown-menu/dropdown-menu.js.map +1 -1
- package/dist/components/field/field-combobox.js +447 -240
- package/dist/components/field/field-combobox.js.map +1 -1
- package/dist/components/field/field-select.js +23 -19
- package/dist/components/field/field-select.js.map +1 -1
- package/dist/components/field/field.js +318 -209
- package/dist/components/field/field.js.map +1 -1
- package/dist/components/label/label.js +27 -19
- package/dist/components/label/label.js.map +1 -1
- package/dist/components/list/list.js +623 -369
- package/dist/components/list/list.js.map +1 -1
- package/dist/components/option-card/option-card.js +323 -159
- package/dist/components/option-card/option-card.js.map +1 -1
- package/dist/components/pill/pill.js +82 -64
- package/dist/components/pill/pill.js.map +1 -1
- package/dist/components/popover/popover.js +101 -56
- package/dist/components/popover/popover.js.map +1 -1
- package/dist/components/radio/radio.js +94 -51
- package/dist/components/radio/radio.js.map +1 -1
- package/dist/components/scroll-overflow/scroll-overflow.js +350 -198
- package/dist/components/scroll-overflow/scroll-overflow.js.map +1 -1
- package/dist/components/segmented-control/segmented-control.js +141 -97
- package/dist/components/segmented-control/segmented-control.js.map +1 -1
- package/dist/components/select/select.js +452 -227
- package/dist/components/select/select.js.map +1 -1
- package/dist/components/separator/separator.js +24 -16
- package/dist/components/separator/separator.js.map +1 -1
- package/dist/components/skeleton/skeleton.js +83 -43
- package/dist/components/skeleton/skeleton.js.map +1 -1
- package/dist/components/spinner/spinner.js +44 -20
- package/dist/components/spinner/spinner.js.map +1 -1
- package/dist/components/switch/switch.js +163 -86
- package/dist/components/switch/switch.js.map +1 -1
- package/dist/components/table/table-pagination.js +465 -205
- package/dist/components/table/table-pagination.js.map +1 -1
- package/dist/components/table/table.js +212 -144
- package/dist/components/table/table.js.map +1 -1
- package/dist/components/tabs/tabs.js +94 -58
- package/dist/components/tabs/tabs.js.map +1 -1
- package/dist/components/text/text.js +40 -32
- package/dist/components/text/text.js.map +1 -1
- package/dist/components/toast/toast.js +187 -111
- package/dist/components/toast/toast.js.map +1 -1
- package/dist/components/toggle/toggle-group.js +40 -24
- package/dist/components/toggle/toggle-group.js.map +1 -1
- package/dist/components/toggle/toggle.js +48 -40
- package/dist/components/toggle/toggle.js.map +1 -1
- package/dist/components/tooltip/tooltip.js +101 -55
- package/dist/components/tooltip/tooltip.js.map +1 -1
- package/dist/index.d.ts +600 -427
- package/dist/index.js +215 -212
- package/dist/index.js.map +1 -1
- package/dist/lib/clear-button.js +27 -15
- package/dist/lib/clear-button.js.map +1 -1
- package/dist/lib/icons.js +18 -6
- package/dist/lib/icons.js.map +1 -1
- package/dist/packages/volt-runtime/dist/sheet.js +27 -10
- package/dist/packages/volt-runtime/dist/sheet.js.map +1 -1
- package/dist/packages/volt-runtime/dist/styles/recipe.js +76 -0
- package/dist/packages/volt-runtime/dist/styles/recipe.js.map +1 -0
- package/dist/styles/document-context.js +12 -0
- package/dist/styles/document-context.js.map +1 -0
- package/dist/styles/make-styles.js +18 -10
- package/dist/styles/make-styles.js.map +1 -1
- package/dist/tokens/core.generated.js +1238 -1166
- package/dist/tokens/core.generated.js.map +1 -1
- package/dist/tokens/index.d.ts +442 -415
- package/dist/tokens/index.js +1105 -1078
- package/dist/tokens/index.js.map +1 -1
- package/dist/tokens/install.js +9 -5
- package/dist/tokens/install.js.map +1 -1
- package/dist/tokens/use-palette-tokens.js +20 -0
- package/dist/tokens/use-palette-tokens.js.map +1 -0
- package/dist/tokens.json +83 -2
- package/dist/vendor/react/cjs/react-jsx-dev-runtime.development.js +236 -0
- package/dist/vendor/react/cjs/react-jsx-dev-runtime.development.js.map +1 -0
- package/dist/vendor/react/cjs/react-jsx-dev-runtime.production.js +21 -0
- package/dist/vendor/react/cjs/react-jsx-dev-runtime.production.js.map +1 -0
- package/dist/vendor/react/jsx-dev-runtime.js +9 -0
- package/dist/vendor/react/jsx-dev-runtime.js.map +1 -0
- package/package.json +13 -5
- package/scripts/migration-diagnostics-core.mjs +859 -0
- package/scripts/migration-diagnostics.mjs +353 -0
- package/scripts/migration-sweep.mjs +179 -0
- package/AGENTS.md +0 -153
- package/AUTHORING.md +0 -292
- package/dist/packages/volt-runtime/dist/styles/make-styles.js +0 -22
- package/dist/packages/volt-runtime/dist/styles/make-styles.js.map +0 -1
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import * as
|
|
3
|
-
import { useRifm as
|
|
4
|
-
import { SLOT_ATTR as
|
|
5
|
-
import { mergeClasses as
|
|
6
|
-
import { Button as
|
|
7
|
-
import { FieldInputGroup as
|
|
8
|
-
import { PopoverTrigger as
|
|
9
|
-
import { makeVoltStyles as
|
|
10
|
-
import { useDateTimePickerContext as
|
|
11
|
-
import { formatDateTimeDisplay as
|
|
12
|
-
const
|
|
1
|
+
import { j as r } from "../../vendor/react/jsx-dev-runtime.js";
|
|
2
|
+
import * as l from "react";
|
|
3
|
+
import { useRifm as L } from "../../vendor/rifm/dist/rifm.esm.js";
|
|
4
|
+
import { SLOT_ATTR as H } from "../../packages/volt-runtime/dist/renderer/contract.js";
|
|
5
|
+
import { mergeClasses as T } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/mergeClasses.js";
|
|
6
|
+
import { Button as O } from "../button/button.js";
|
|
7
|
+
import { FieldInputGroup as B, FieldInput as _, FieldGroupAddon as G } from "../field/field.js";
|
|
8
|
+
import { PopoverTrigger as K, PopoverAnchor as ee } from "../popover/popover.js";
|
|
9
|
+
import { makeVoltStyles as te } from "../../styles/make-styles.js";
|
|
10
|
+
import { useDateTimePickerContext as ie } from "./date-time-picker-context.js";
|
|
11
|
+
import { formatDateTimeDisplay as Z, parseDateTimeInput as re } from "./date-time-picker-utils.js";
|
|
12
|
+
const ae = (f) => /* @__PURE__ */ r.jsxDEV(
|
|
13
13
|
"svg",
|
|
14
14
|
{
|
|
15
15
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -18,16 +18,28 @@ const re = (f) => /* @__PURE__ */ s(
|
|
|
18
18
|
width: "18px",
|
|
19
19
|
fill: "currentColor",
|
|
20
20
|
...f,
|
|
21
|
-
children: /* @__PURE__ */
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
21
|
+
children: /* @__PURE__ */ r.jsxDEV("path", { d: "M200-80q-33 0-56.5-23.5T120-160v-560q0-33 23.5-56.5T200-800h40v-80h80v80h320v-80h80v80h40q33 0 56.5 23.5T840-720v560q0 33-23.5 56.5T760-80H200Zm0-80h560v-400H200v400Zm0-480h560v-80H200v80Zm0 0v-80 80Zm280 240q-17 0-28.5-11.5T440-440q0-17 11.5-28.5T480-480q17 0 28.5 11.5T520-440q0 17-11.5 28.5T480-400Zm-160 0q-17 0-28.5-11.5T280-440q0-17 11.5-28.5T320-480q17 0 28.5 11.5T360-440q0 17-11.5 28.5T320-400Zm320 0q-17 0-28.5-11.5T600-440q0-17 11.5-28.5T640-480q17 0 28.5 11.5T680-440q0 17-11.5 28.5T640-400ZM480-240q-17 0-28.5-11.5T440-280q0-17 11.5-28.5T480-320q17 0 28.5 11.5T520-280q0 17-11.5 28.5T480-240Zm-160 0q-17 0-28.5-11.5T280-280q0-17 11.5-28.5T320-320q17 0 28.5 11.5T360-280q0 17-11.5 28.5T320-240Zm320 0q-17 0-28.5-11.5T600-280q0-17 11.5-28.5T640-320q17 0 28.5 11.5T680-280q0 17-11.5 28.5T640-240Z" }, void 0, !1, {
|
|
22
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
23
|
+
lineNumber: 26,
|
|
24
|
+
columnNumber: 5
|
|
25
|
+
}, void 0)
|
|
26
|
+
},
|
|
27
|
+
void 0,
|
|
28
|
+
!1,
|
|
29
|
+
{
|
|
30
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
31
|
+
lineNumber: 18,
|
|
32
|
+
columnNumber: 3
|
|
33
|
+
},
|
|
34
|
+
void 0
|
|
35
|
+
), le = /\d/g, se = "dd.MM.yyyy", ne = "dd.MM.yyyy HH:mm", oe = (f) => {
|
|
36
|
+
const h = f ? 12 : 8;
|
|
37
|
+
return (n) => {
|
|
38
|
+
const i = n.replace(/\D/g, "").slice(0, h);
|
|
27
39
|
let t = "", e = 0;
|
|
28
|
-
return t += (
|
|
40
|
+
return t += (i[e++] || "_") + (i[e++] || "_"), t += ".", t += (i[e++] || "_") + (i[e++] || "_"), t += ".", t += (i[e++] || "_") + (i[e++] || "_") + (i[e++] || "_") + (i[e++] || "_"), f && (t += " ", t += (i[e++] || "_") + (i[e++] || "_"), t += ":", t += (i[e++] || "_") + (i[e++] || "_")), t;
|
|
29
41
|
};
|
|
30
|
-
},
|
|
42
|
+
}, P = te({
|
|
31
43
|
group: {
|
|
32
44
|
width: "100%"
|
|
33
45
|
},
|
|
@@ -39,191 +51,279 @@ const re = (f) => /* @__PURE__ */ s(
|
|
|
39
51
|
flexShrink: 1,
|
|
40
52
|
flexBasis: "0%"
|
|
41
53
|
}
|
|
42
|
-
}),
|
|
54
|
+
}), me = l.forwardRef(
|
|
43
55
|
function({
|
|
44
|
-
ctx:
|
|
45
|
-
disabled:
|
|
46
|
-
icon:
|
|
56
|
+
ctx: h,
|
|
57
|
+
disabled: n,
|
|
58
|
+
icon: i,
|
|
47
59
|
iconPosition: t,
|
|
48
60
|
inputAriaLabel: e,
|
|
49
|
-
openPickerAriaLabel:
|
|
61
|
+
openPickerAriaLabel: D,
|
|
50
62
|
testId: v,
|
|
51
|
-
className:
|
|
52
|
-
},
|
|
53
|
-
const
|
|
54
|
-
value:
|
|
55
|
-
format:
|
|
56
|
-
locale:
|
|
57
|
-
onChange:
|
|
58
|
-
onBlur:
|
|
59
|
-
setTempValue:
|
|
60
|
-
setInputValue:
|
|
61
|
-
} =
|
|
62
|
-
() =>
|
|
63
|
-
[
|
|
64
|
-
),
|
|
65
|
-
if (
|
|
63
|
+
className: b
|
|
64
|
+
}, q) {
|
|
65
|
+
const c = P(), {
|
|
66
|
+
value: k,
|
|
67
|
+
format: s,
|
|
68
|
+
locale: u,
|
|
69
|
+
onChange: x,
|
|
70
|
+
onBlur: d,
|
|
71
|
+
setTempValue: w,
|
|
72
|
+
setInputValue: y
|
|
73
|
+
} = h, C = s.includes("HH:mm"), N = l.useMemo(
|
|
74
|
+
() => oe(C),
|
|
75
|
+
[C]
|
|
76
|
+
), j = C ? ne : se, E = k ? Z(k, s, u) : "", [z, F] = l.useState(""), [J, M] = l.useState(!1), U = l.useRef(null), Q = l.useCallback((a) => {
|
|
77
|
+
if (U.current = a, !a) return;
|
|
66
78
|
a.focus();
|
|
67
|
-
const
|
|
68
|
-
|
|
69
|
-
}, []),
|
|
79
|
+
const p = a.value.indexOf("_");
|
|
80
|
+
p !== -1 && a.setSelectionRange(p, p);
|
|
81
|
+
}, []), V = l.useCallback(
|
|
70
82
|
(a) => {
|
|
71
|
-
if (
|
|
72
|
-
const g =
|
|
83
|
+
if (F(a), requestAnimationFrame(() => {
|
|
84
|
+
const g = U.current;
|
|
73
85
|
if (!g) return;
|
|
74
|
-
const
|
|
75
|
-
g.setSelectionRange(
|
|
86
|
+
const m = g.value.indexOf("_"), A = m === -1 ? g.value.length : m;
|
|
87
|
+
g.setSelectionRange(A, A);
|
|
76
88
|
}), a.replace(/\D/g, "").length === 0) {
|
|
77
|
-
|
|
89
|
+
x(null), w(null), y("");
|
|
78
90
|
return;
|
|
79
91
|
}
|
|
80
|
-
const
|
|
81
|
-
|
|
92
|
+
const o = re(a, j, u);
|
|
93
|
+
o && (x(o), w(o), y(Z(o, s, u)));
|
|
82
94
|
},
|
|
83
|
-
[
|
|
84
|
-
),
|
|
95
|
+
[x, w, y, j, s, u]
|
|
96
|
+
), R = L({
|
|
85
97
|
accept: le,
|
|
86
|
-
format:
|
|
98
|
+
format: N,
|
|
87
99
|
mask: !0,
|
|
88
|
-
onChange:
|
|
89
|
-
value:
|
|
90
|
-
}),
|
|
91
|
-
|
|
92
|
-
}, [
|
|
93
|
-
|
|
94
|
-
}, [
|
|
100
|
+
onChange: V,
|
|
101
|
+
value: z
|
|
102
|
+
}), I = l.useCallback(() => {
|
|
103
|
+
F(N(E)), M(!0);
|
|
104
|
+
}, [E, N]), W = l.useCallback(() => {
|
|
105
|
+
M(!1), d == null || d();
|
|
106
|
+
}, [d]), X = l.useCallback(
|
|
95
107
|
(a) => {
|
|
96
|
-
a.preventDefault(),
|
|
108
|
+
a.preventDefault(), V(N(a.clipboardData.getData("text")));
|
|
97
109
|
},
|
|
98
|
-
[
|
|
99
|
-
),
|
|
110
|
+
[V, N]
|
|
111
|
+
), Y = l.useCallback(
|
|
100
112
|
(a) => {
|
|
101
113
|
if (a.key !== "Backspace") return;
|
|
102
|
-
const
|
|
103
|
-
if (
|
|
104
|
-
let
|
|
105
|
-
for (;
|
|
106
|
-
|
|
107
|
-
|
|
114
|
+
const p = a.currentTarget, { selectionStart: o, selectionEnd: g } = p;
|
|
115
|
+
if (o === null || o !== g) return;
|
|
116
|
+
let m = o;
|
|
117
|
+
for (; m > 0 && !/[\d_]/.test(p.value[m - 1]); )
|
|
118
|
+
m--;
|
|
119
|
+
m !== o && p.setSelectionRange(m, m);
|
|
108
120
|
},
|
|
109
121
|
[]
|
|
110
|
-
),
|
|
111
|
-
|
|
122
|
+
), S = /* @__PURE__ */ r.jsxDEV(G, { align: t, children: /* @__PURE__ */ r.jsxDEV(K, { asChild: !0, children: /* @__PURE__ */ r.jsxDEV(
|
|
123
|
+
O,
|
|
112
124
|
{
|
|
113
|
-
"aria-label":
|
|
114
|
-
disabled:
|
|
125
|
+
"aria-label": D,
|
|
126
|
+
disabled: n,
|
|
115
127
|
size: "icon-sm",
|
|
116
128
|
variant: "tertiary",
|
|
117
|
-
children:
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
|
|
129
|
+
children: i
|
|
130
|
+
},
|
|
131
|
+
void 0,
|
|
132
|
+
!1,
|
|
133
|
+
{
|
|
134
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
135
|
+
lineNumber: 245,
|
|
136
|
+
columnNumber: 11
|
|
137
|
+
},
|
|
138
|
+
this
|
|
139
|
+
) }, void 0, !1, {
|
|
140
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
141
|
+
lineNumber: 244,
|
|
142
|
+
columnNumber: 9
|
|
143
|
+
}, this) }, void 0, !1, {
|
|
144
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
145
|
+
lineNumber: 243,
|
|
146
|
+
columnNumber: 7
|
|
147
|
+
}, this), $ = J ? /* @__PURE__ */ r.jsxDEV(
|
|
148
|
+
_,
|
|
121
149
|
{
|
|
122
150
|
"aria-label": e,
|
|
123
|
-
className:
|
|
151
|
+
className: T(c.inputFlex, c.input),
|
|
124
152
|
"data-testid": v,
|
|
125
|
-
disabled:
|
|
126
|
-
onBlur:
|
|
127
|
-
onChange:
|
|
128
|
-
onFocus:
|
|
129
|
-
onKeyDown:
|
|
130
|
-
onPaste:
|
|
131
|
-
ref:
|
|
132
|
-
value:
|
|
133
|
-
}
|
|
134
|
-
|
|
135
|
-
|
|
153
|
+
disabled: n,
|
|
154
|
+
onBlur: W,
|
|
155
|
+
onChange: R.onChange,
|
|
156
|
+
onFocus: I,
|
|
157
|
+
onKeyDown: Y,
|
|
158
|
+
onPaste: X,
|
|
159
|
+
ref: Q,
|
|
160
|
+
value: R.value
|
|
161
|
+
},
|
|
162
|
+
void 0,
|
|
163
|
+
!1,
|
|
164
|
+
{
|
|
165
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
166
|
+
lineNumber: 258,
|
|
167
|
+
columnNumber: 7
|
|
168
|
+
},
|
|
169
|
+
this
|
|
170
|
+
) : /* @__PURE__ */ r.jsxDEV(
|
|
171
|
+
_,
|
|
136
172
|
{
|
|
137
173
|
"aria-label": e,
|
|
138
|
-
className:
|
|
174
|
+
className: T(c.inputFlex, c.input),
|
|
139
175
|
"data-testid": v,
|
|
140
|
-
disabled:
|
|
141
|
-
onFocus:
|
|
176
|
+
disabled: n,
|
|
177
|
+
onFocus: I,
|
|
142
178
|
readOnly: !0,
|
|
143
|
-
value:
|
|
144
|
-
}
|
|
179
|
+
value: E
|
|
180
|
+
},
|
|
181
|
+
void 0,
|
|
182
|
+
!1,
|
|
183
|
+
{
|
|
184
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
185
|
+
lineNumber: 272,
|
|
186
|
+
columnNumber: 7
|
|
187
|
+
},
|
|
188
|
+
this
|
|
145
189
|
);
|
|
146
|
-
return /* @__PURE__ */
|
|
147
|
-
|
|
190
|
+
return /* @__PURE__ */ r.jsxDEV(ee, { asChild: !0, children: /* @__PURE__ */ r.jsxDEV(
|
|
191
|
+
B,
|
|
148
192
|
{
|
|
149
|
-
className:
|
|
193
|
+
className: T(c.group, b),
|
|
150
194
|
"data-slot": "datetimepicker-input",
|
|
151
|
-
[
|
|
152
|
-
ref:
|
|
195
|
+
[H]: "datetimepicker-input",
|
|
196
|
+
ref: q,
|
|
153
197
|
children: [
|
|
154
|
-
t === "start" &&
|
|
155
|
-
|
|
156
|
-
t === "end" &&
|
|
198
|
+
t === "start" && S,
|
|
199
|
+
$,
|
|
200
|
+
t === "end" && S
|
|
157
201
|
]
|
|
158
|
-
}
|
|
159
|
-
|
|
202
|
+
},
|
|
203
|
+
void 0,
|
|
204
|
+
!0,
|
|
205
|
+
{
|
|
206
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
207
|
+
lineNumber: 285,
|
|
208
|
+
columnNumber: 9
|
|
209
|
+
},
|
|
210
|
+
this
|
|
211
|
+
) }, void 0, !1, {
|
|
212
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
213
|
+
lineNumber: 284,
|
|
214
|
+
columnNumber: 7
|
|
215
|
+
}, this);
|
|
160
216
|
}
|
|
161
|
-
),
|
|
162
|
-
editable:
|
|
163
|
-
iconPosition:
|
|
164
|
-
placeholder:
|
|
217
|
+
), Ne = l.forwardRef(function({
|
|
218
|
+
editable: h = !1,
|
|
219
|
+
iconPosition: n = "end",
|
|
220
|
+
placeholder: i = "dd/MM/yyyy HH:mm",
|
|
165
221
|
inputAriaLabel: t = "change date and time",
|
|
166
222
|
openPickerAriaLabel: e = "Open date picker",
|
|
167
|
-
keyboardIcon:
|
|
223
|
+
keyboardIcon: D,
|
|
168
224
|
testId: v,
|
|
169
|
-
className:
|
|
170
|
-
disabled:
|
|
171
|
-
},
|
|
172
|
-
const
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
225
|
+
className: b,
|
|
226
|
+
disabled: q
|
|
227
|
+
}, c) {
|
|
228
|
+
const k = P(), s = ie(), u = q ?? s.disabled, x = D || /* @__PURE__ */ r.jsxDEV(ae, {}, void 0, !1, {
|
|
229
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
230
|
+
lineNumber: 321,
|
|
231
|
+
columnNumber: 41
|
|
232
|
+
}, this);
|
|
233
|
+
if (h)
|
|
234
|
+
return /* @__PURE__ */ r.jsxDEV(
|
|
235
|
+
me,
|
|
176
236
|
{
|
|
177
|
-
className:
|
|
178
|
-
ctx:
|
|
179
|
-
disabled:
|
|
180
|
-
icon:
|
|
181
|
-
iconPosition:
|
|
237
|
+
className: b,
|
|
238
|
+
ctx: s,
|
|
239
|
+
disabled: u,
|
|
240
|
+
icon: x,
|
|
241
|
+
iconPosition: n,
|
|
182
242
|
inputAriaLabel: t,
|
|
183
243
|
openPickerAriaLabel: e,
|
|
184
|
-
ref:
|
|
244
|
+
ref: c,
|
|
185
245
|
testId: v
|
|
186
|
-
}
|
|
246
|
+
},
|
|
247
|
+
void 0,
|
|
248
|
+
!1,
|
|
249
|
+
{
|
|
250
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
251
|
+
lineNumber: 325,
|
|
252
|
+
columnNumber: 7
|
|
253
|
+
},
|
|
254
|
+
this
|
|
187
255
|
);
|
|
188
|
-
const
|
|
189
|
-
|
|
256
|
+
const d = /* @__PURE__ */ r.jsxDEV(G, { align: n, children: /* @__PURE__ */ r.jsxDEV(
|
|
257
|
+
O,
|
|
190
258
|
{
|
|
191
259
|
"aria-label": e,
|
|
192
|
-
disabled:
|
|
193
|
-
onClick: () =>
|
|
260
|
+
disabled: u,
|
|
261
|
+
onClick: () => s.setIsOpen(!0),
|
|
194
262
|
size: "icon-sm",
|
|
195
263
|
variant: "tertiary",
|
|
196
|
-
children:
|
|
197
|
-
}
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
264
|
+
children: x
|
|
265
|
+
},
|
|
266
|
+
void 0,
|
|
267
|
+
!1,
|
|
268
|
+
{
|
|
269
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
270
|
+
lineNumber: 341,
|
|
271
|
+
columnNumber: 7
|
|
272
|
+
},
|
|
273
|
+
this
|
|
274
|
+
) }, void 0, !1, {
|
|
275
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
276
|
+
lineNumber: 340,
|
|
277
|
+
columnNumber: 5
|
|
278
|
+
}, this);
|
|
279
|
+
return /* @__PURE__ */ r.jsxDEV(
|
|
280
|
+
B,
|
|
201
281
|
{
|
|
202
|
-
className:
|
|
282
|
+
className: T(k.group, b),
|
|
203
283
|
"data-slot": "datetimepicker-input",
|
|
204
|
-
[
|
|
205
|
-
ref:
|
|
284
|
+
[H]: "datetimepicker-input",
|
|
285
|
+
ref: c,
|
|
206
286
|
children: [
|
|
207
|
-
|
|
208
|
-
/* @__PURE__ */
|
|
209
|
-
|
|
287
|
+
n === "start" && d,
|
|
288
|
+
/* @__PURE__ */ r.jsxDEV(K, { asChild: !0, children: /* @__PURE__ */ r.jsxDEV(
|
|
289
|
+
_,
|
|
210
290
|
{
|
|
211
291
|
"aria-label": t,
|
|
212
|
-
className:
|
|
292
|
+
className: T(k.inputFlex, k.input),
|
|
213
293
|
"data-testid": v,
|
|
214
|
-
disabled:
|
|
215
|
-
onBlur:
|
|
216
|
-
onChange:
|
|
217
|
-
placeholder:
|
|
218
|
-
value:
|
|
219
|
-
}
|
|
220
|
-
|
|
221
|
-
|
|
294
|
+
disabled: u,
|
|
295
|
+
onBlur: s.handleInputBlur,
|
|
296
|
+
onChange: s.handleInputChange,
|
|
297
|
+
placeholder: i,
|
|
298
|
+
value: s.inputValue
|
|
299
|
+
},
|
|
300
|
+
void 0,
|
|
301
|
+
!1,
|
|
302
|
+
{
|
|
303
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
304
|
+
lineNumber: 362,
|
|
305
|
+
columnNumber: 9
|
|
306
|
+
},
|
|
307
|
+
this
|
|
308
|
+
) }, void 0, !1, {
|
|
309
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
310
|
+
lineNumber: 361,
|
|
311
|
+
columnNumber: 7
|
|
312
|
+
}, this),
|
|
313
|
+
n === "end" && d
|
|
222
314
|
]
|
|
223
|
-
}
|
|
315
|
+
},
|
|
316
|
+
void 0,
|
|
317
|
+
!0,
|
|
318
|
+
{
|
|
319
|
+
fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-time-picker/date-time-picker-input.tsx",
|
|
320
|
+
lineNumber: 354,
|
|
321
|
+
columnNumber: 5
|
|
322
|
+
},
|
|
323
|
+
this
|
|
224
324
|
);
|
|
225
325
|
});
|
|
226
326
|
export {
|
|
227
|
-
|
|
327
|
+
Ne as DateTimePickerInput
|
|
228
328
|
};
|
|
229
329
|
//# sourceMappingURL=date-time-picker-input.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-time-picker-input.js","sources":["../../../src/components/date-time-picker/date-time-picker-input.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { useRifm } from \"rifm\"\nimport { mergeClasses } from \"@epilot/volt-ui-runtime\"\n\nimport { Button } from \"../button/button\"\nimport { FieldGroupAddon, FieldInput, FieldInputGroup } from \"../field/field\"\nimport { PopoverAnchor, PopoverTrigger } from \"../popover/popover\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\n\nimport { useDateTimePickerContext } from \"./date-time-picker-context\"\nimport {\n formatDateTimeDisplay,\n parseDateTimeInput,\n} from \"./date-time-picker-utils\"\n\nconst CalendarIcon = (props: React.SVGProps<SVGSVGElement>) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"18px\"\n viewBox=\"0 -960 960 960\"\n width=\"18px\"\n fill=\"currentColor\"\n {...props}\n >\n <path d=\"M200-80q-33 0-56.5-23.5T120-160v-560q0-33 23.5-56.5T200-800h40v-80h80v80h320v-80h80v80h40q33 0 56.5 23.5T840-720v560q0 33-23.5 56.5T760-80H200Zm0-80h560v-400H200v400Zm0-480h560v-80H200v80Zm0 0v-80 80Zm280 240q-17 0-28.5-11.5T440-440q0-17 11.5-28.5T480-480q17 0 28.5 11.5T520-440q0 17-11.5 28.5T480-400Zm-160 0q-17 0-28.5-11.5T280-440q0-17 11.5-28.5T320-480q17 0 28.5 11.5T360-440q0 17-11.5 28.5T320-400Zm320 0q-17 0-28.5-11.5T600-440q0-17 11.5-28.5T640-480q17 0 28.5 11.5T680-440q0 17-11.5 28.5T640-400ZM480-240q-17 0-28.5-11.5T440-280q0-17 11.5-28.5T480-320q17 0 28.5 11.5T520-280q0 17-11.5 28.5T480-240Zm-160 0q-17 0-28.5-11.5T280-280q0-17 11.5-28.5T320-320q17 0 28.5 11.5T360-280q0 17-11.5 28.5T320-240Zm320 0q-17 0-28.5-11.5T600-280q0-17 11.5-28.5T640-320q17 0 28.5 11.5T680-280q0 17-11.5 28.5T640-240Z\" />\n </svg>\n)\n\nconst ACCEPT_DIGITS = /\\d/g\n\n// The mask always uses dots and colons regardless of the context format\nconst MASK_FORMAT_DATE = \"dd.MM.yyyy\"\nconst MASK_FORMAT_DATETIME = \"dd.MM.yyyy HH:mm\"\n\nconst createMaskFormatter = (isDateTime: boolean) => {\n const maxDigits = isDateTime ? 12 : 8\n\n return (str: string): string => {\n const digits = str.replace(/\\D/g, \"\").slice(0, maxDigits)\n let result = \"\"\n let di = 0\n\n result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n result += \".\"\n result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n result += \".\"\n result +=\n (digits[di++] || \"_\") +\n (digits[di++] || \"_\") +\n (digits[di++] || \"_\") +\n (digits[di++] || \"_\")\n\n if (isDateTime) {\n result += \" \"\n result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n result += \":\"\n result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n }\n\n return result\n }\n}\n\nexport type DateTimePickerInputProps = {\n editable?: boolean\n iconPosition?: \"start\" | \"end\"\n placeholder?: string\n inputAriaLabel?: string\n openPickerAriaLabel?: string\n keyboardIcon?: React.ReactNode\n testId?: string\n className?: string\n disabled?: boolean\n}\n\nconst useStyles = makeVoltStyles({\n group: {\n width: \"100%\",\n },\n input: {\n textAlign: \"left\",\n },\n inputFlex: {\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: \"0%\",\n },\n})\n\n// Editable input with rifm masking — manages its own display value\ntype EditableInputProps = {\n ctx: ReturnType<typeof useDateTimePickerContext>\n disabled: boolean\n icon: React.ReactNode\n iconPosition: \"start\" | \"end\"\n inputAriaLabel: string\n openPickerAriaLabel: string\n testId?: string\n className?: string\n}\n\nconst EditableInput = React.forwardRef<HTMLDivElement, EditableInputProps>(\n function EditableInput(\n {\n ctx,\n disabled,\n icon,\n iconPosition,\n inputAriaLabel,\n openPickerAriaLabel,\n testId,\n className,\n },\n ref\n ) {\n const styles = useStyles()\n const {\n value,\n format,\n locale,\n onChange,\n onBlur,\n setTempValue,\n setInputValue,\n } = ctx\n\n const isDateTime = format.includes(\"HH:mm\")\n const maskFormat = React.useMemo(\n () => createMaskFormatter(isDateTime),\n [isDateTime]\n )\n const maskParseFormat = isDateTime ? MASK_FORMAT_DATETIME : MASK_FORMAT_DATE\n\n const displayValue = value\n ? formatDateTimeDisplay(value, format, locale)\n : \"\"\n\n const [maskedValue, setMaskedValue] = React.useState(\"\")\n const [focused, setFocused] = React.useState(false)\n const inputRef = React.useRef<HTMLInputElement>(null)\n\n // Callback ref: focus + position cursor when the Rifm input mounts\n const rifmRefCallback = React.useCallback((el: HTMLInputElement | null) => {\n inputRef.current = el\n if (!el) return\n\n el.focus()\n const pos = el.value.indexOf(\"_\")\n\n if (pos !== -1) {\n el.setSelectionRange(pos, pos)\n }\n }, [])\n\n const handleRifmChange = React.useCallback(\n (val: string) => {\n setMaskedValue(val)\n\n // Position cursor at next empty placeholder after Rifm processes\n requestAnimationFrame(() => {\n const el = inputRef.current\n if (!el) return\n\n const pos = el.value.indexOf(\"_\")\n const cursor = pos === -1 ? el.value.length : pos\n\n el.setSelectionRange(cursor, cursor)\n })\n\n const digits = val.replace(/\\D/g, \"\")\n\n if (digits.length === 0) {\n onChange(null)\n setTempValue(null)\n setInputValue(\"\")\n\n return\n }\n\n const parsed = parseDateTimeInput(val, maskParseFormat, locale)\n\n if (parsed) {\n onChange(parsed)\n setTempValue(parsed)\n setInputValue(formatDateTimeDisplay(parsed, format, locale))\n }\n },\n [onChange, setTempValue, setInputValue, maskParseFormat, format, locale]\n )\n\n const rifm = useRifm({\n accept: ACCEPT_DIGITS,\n format: maskFormat,\n mask: true,\n onChange: handleRifmChange,\n value: maskedValue,\n })\n\n const handleFocus = React.useCallback(() => {\n setMaskedValue(maskFormat(displayValue))\n setFocused(true)\n }, [displayValue, maskFormat])\n\n const handleBlur = React.useCallback(() => {\n setFocused(false)\n onBlur?.()\n }, [onBlur])\n\n const handlePaste = React.useCallback(\n (e: React.ClipboardEvent<HTMLInputElement>) => {\n // Always paste a date from the beginning, ignoring caret position.\n e.preventDefault()\n handleRifmChange(maskFormat(e.clipboardData.getData(\"text\")))\n },\n [handleRifmChange, maskFormat]\n )\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLInputElement>) => {\n // On Backspace, skip the caret back over mask separators (\".\", \":\", \" \")\n if (e.key !== \"Backspace\") return\n\n const el = e.currentTarget\n const { selectionStart, selectionEnd } = el\n\n if (selectionStart === null || selectionStart !== selectionEnd) return\n\n let pos = selectionStart\n\n while (pos > 0 && !/[\\d_]/.test(el.value[pos - 1])) {\n pos--\n }\n\n if (pos !== selectionStart) {\n el.setSelectionRange(pos, pos)\n }\n },\n []\n )\n\n const iconAddon = (\n <FieldGroupAddon align={iconPosition}>\n <PopoverTrigger asChild>\n <Button\n aria-label={openPickerAriaLabel}\n disabled={disabled}\n size=\"icon-sm\"\n variant=\"tertiary\"\n >\n {icon}\n </Button>\n </PopoverTrigger>\n </FieldGroupAddon>\n )\n\n const input = focused ? (\n <FieldInput\n aria-label={inputAriaLabel}\n className={mergeClasses(styles.inputFlex, styles.input)}\n data-testid={testId}\n disabled={disabled}\n onBlur={handleBlur}\n onChange={rifm.onChange}\n onFocus={handleFocus}\n onKeyDown={handleKeyDown}\n onPaste={handlePaste}\n ref={rifmRefCallback}\n value={rifm.value}\n />\n ) : (\n <FieldInput\n aria-label={inputAriaLabel}\n className={mergeClasses(styles.inputFlex, styles.input)}\n data-testid={testId}\n disabled={disabled}\n onFocus={handleFocus}\n readOnly\n value={displayValue}\n />\n )\n\n return (\n <PopoverAnchor asChild>\n <FieldInputGroup\n className={mergeClasses(styles.group, className)}\n data-slot=\"datetimepicker-input\"\n {...{ [SLOT_ATTR]: \"datetimepicker-input\" }}\n ref={ref}\n >\n {iconPosition === \"start\" && iconAddon}\n {input}\n {iconPosition === \"end\" && iconAddon}\n </FieldInputGroup>\n </PopoverAnchor>\n )\n }\n)\n\nexport const DateTimePickerInput = React.forwardRef<\n HTMLDivElement,\n DateTimePickerInputProps\n>(function DateTimePickerInput(\n {\n editable = false,\n iconPosition = \"end\",\n placeholder = \"dd/MM/yyyy HH:mm\",\n inputAriaLabel = \"change date and time\",\n openPickerAriaLabel = \"Open date picker\",\n keyboardIcon,\n testId,\n className,\n disabled: disabledProp,\n },\n ref\n) {\n const styles = useStyles()\n const ctx = useDateTimePickerContext()\n const disabled = disabledProp ?? ctx.disabled\n\n const IconComponent = keyboardIcon || <CalendarIcon />\n\n if (editable) {\n return (\n <EditableInput\n className={className}\n ctx={ctx}\n disabled={disabled}\n icon={IconComponent}\n iconPosition={iconPosition}\n inputAriaLabel={inputAriaLabel}\n openPickerAriaLabel={openPickerAriaLabel}\n ref={ref}\n testId={testId}\n />\n )\n }\n\n const iconAddon = (\n <FieldGroupAddon align={iconPosition}>\n <Button\n aria-label={openPickerAriaLabel}\n disabled={disabled}\n onClick={() => ctx.setIsOpen(true)}\n size=\"icon-sm\"\n variant=\"tertiary\"\n >\n {IconComponent}\n </Button>\n </FieldGroupAddon>\n )\n\n return (\n <FieldInputGroup\n className={mergeClasses(styles.group, className)}\n data-slot=\"datetimepicker-input\"\n {...{ [SLOT_ATTR]: \"datetimepicker-input\" }}\n ref={ref}\n >\n {iconPosition === \"start\" && iconAddon}\n <PopoverTrigger asChild>\n <FieldInput\n aria-label={inputAriaLabel}\n className={mergeClasses(styles.inputFlex, styles.input)}\n data-testid={testId}\n disabled={disabled}\n onBlur={ctx.handleInputBlur}\n onChange={ctx.handleInputChange}\n placeholder={placeholder}\n value={ctx.inputValue}\n />\n </PopoverTrigger>\n {iconPosition === \"end\" && iconAddon}\n </FieldInputGroup>\n )\n})\n"],"names":["CalendarIcon","props","jsx","ACCEPT_DIGITS","MASK_FORMAT_DATE","MASK_FORMAT_DATETIME","createMaskFormatter","isDateTime","maxDigits","str","digits","result","di","useStyles","makeVoltStyles","EditableInput","React","ctx","disabled","icon","iconPosition","inputAriaLabel","openPickerAriaLabel","testId","className","ref","styles","value","format","locale","onChange","onBlur","setTempValue","setInputValue","maskFormat","maskParseFormat","displayValue","formatDateTimeDisplay","maskedValue","setMaskedValue","focused","setFocused","inputRef","rifmRefCallback","el","pos","handleRifmChange","val","cursor","parsed","parseDateTimeInput","rifm","useRifm","handleFocus","handleBlur","handlePaste","e","handleKeyDown","selectionStart","selectionEnd","iconAddon","FieldGroupAddon","PopoverTrigger","Button","input","FieldInput","mergeClasses","PopoverAnchor","jsxs","FieldInputGroup","SLOT_ATTR","DateTimePickerInput","editable","placeholder","keyboardIcon","disabledProp","useDateTimePickerContext","IconComponent"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"date-time-picker-input.js","sources":["../../../src/components/date-time-picker/date-time-picker-input.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { useRifm } from \"rifm\"\nimport { mergeClasses } from \"@epilot/volt-ui-runtime\"\n\nimport { Button } from \"../button/button\"\nimport { FieldGroupAddon, FieldInput, FieldInputGroup } from \"../field/field\"\nimport { PopoverAnchor, PopoverTrigger } from \"../popover/popover\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\n\nimport { useDateTimePickerContext } from \"./date-time-picker-context\"\nimport {\n formatDateTimeDisplay,\n parseDateTimeInput,\n} from \"./date-time-picker-utils\"\n\nconst CalendarIcon = (props: React.SVGProps<SVGSVGElement>) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"18px\"\n viewBox=\"0 -960 960 960\"\n width=\"18px\"\n fill=\"currentColor\"\n {...props}\n >\n <path d=\"M200-80q-33 0-56.5-23.5T120-160v-560q0-33 23.5-56.5T200-800h40v-80h80v80h320v-80h80v80h40q33 0 56.5 23.5T840-720v560q0 33-23.5 56.5T760-80H200Zm0-80h560v-400H200v400Zm0-480h560v-80H200v80Zm0 0v-80 80Zm280 240q-17 0-28.5-11.5T440-440q0-17 11.5-28.5T480-480q17 0 28.5 11.5T520-440q0 17-11.5 28.5T480-400Zm-160 0q-17 0-28.5-11.5T280-440q0-17 11.5-28.5T320-480q17 0 28.5 11.5T360-440q0 17-11.5 28.5T320-400Zm320 0q-17 0-28.5-11.5T600-440q0-17 11.5-28.5T640-480q17 0 28.5 11.5T680-440q0 17-11.5 28.5T640-400ZM480-240q-17 0-28.5-11.5T440-280q0-17 11.5-28.5T480-320q17 0 28.5 11.5T520-280q0 17-11.5 28.5T480-240Zm-160 0q-17 0-28.5-11.5T280-280q0-17 11.5-28.5T320-320q17 0 28.5 11.5T360-280q0 17-11.5 28.5T320-240Zm320 0q-17 0-28.5-11.5T600-280q0-17 11.5-28.5T640-320q17 0 28.5 11.5T680-280q0 17-11.5 28.5T640-240Z\" />\n </svg>\n)\n\nconst ACCEPT_DIGITS = /\\d/g\n\n// The mask always uses dots and colons regardless of the context format\nconst MASK_FORMAT_DATE = \"dd.MM.yyyy\"\nconst MASK_FORMAT_DATETIME = \"dd.MM.yyyy HH:mm\"\n\nconst createMaskFormatter = (isDateTime: boolean) => {\n const maxDigits = isDateTime ? 12 : 8\n\n return (str: string): string => {\n const digits = str.replace(/\\D/g, \"\").slice(0, maxDigits)\n let result = \"\"\n let di = 0\n\n result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n result += \".\"\n result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n result += \".\"\n result +=\n (digits[di++] || \"_\") +\n (digits[di++] || \"_\") +\n (digits[di++] || \"_\") +\n (digits[di++] || \"_\")\n\n if (isDateTime) {\n result += \" \"\n result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n result += \":\"\n result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n }\n\n return result\n }\n}\n\nexport type DateTimePickerInputProps = {\n editable?: boolean\n iconPosition?: \"start\" | \"end\"\n placeholder?: string\n inputAriaLabel?: string\n openPickerAriaLabel?: string\n keyboardIcon?: React.ReactNode\n testId?: string\n className?: string\n disabled?: boolean\n}\n\nconst useStyles = makeVoltStyles({\n group: {\n width: \"100%\",\n },\n input: {\n textAlign: \"left\",\n },\n inputFlex: {\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: \"0%\",\n },\n})\n\n// Editable input with rifm masking — manages its own display value\ntype EditableInputProps = {\n ctx: ReturnType<typeof useDateTimePickerContext>\n disabled: boolean\n icon: React.ReactNode\n iconPosition: \"start\" | \"end\"\n inputAriaLabel: string\n openPickerAriaLabel: string\n testId?: string\n className?: string\n}\n\nconst EditableInput = React.forwardRef<HTMLDivElement, EditableInputProps>(\n function EditableInput(\n {\n ctx,\n disabled,\n icon,\n iconPosition,\n inputAriaLabel,\n openPickerAriaLabel,\n testId,\n className,\n },\n ref\n ) {\n const styles = useStyles()\n const {\n value,\n format,\n locale,\n onChange,\n onBlur,\n setTempValue,\n setInputValue,\n } = ctx\n\n const isDateTime = format.includes(\"HH:mm\")\n const maskFormat = React.useMemo(\n () => createMaskFormatter(isDateTime),\n [isDateTime]\n )\n const maskParseFormat = isDateTime ? MASK_FORMAT_DATETIME : MASK_FORMAT_DATE\n\n const displayValue = value\n ? formatDateTimeDisplay(value, format, locale)\n : \"\"\n\n const [maskedValue, setMaskedValue] = React.useState(\"\")\n const [focused, setFocused] = React.useState(false)\n const inputRef = React.useRef<HTMLInputElement>(null)\n\n // Callback ref: focus + position cursor when the Rifm input mounts\n const rifmRefCallback = React.useCallback((el: HTMLInputElement | null) => {\n inputRef.current = el\n if (!el) return\n\n el.focus()\n const pos = el.value.indexOf(\"_\")\n\n if (pos !== -1) {\n el.setSelectionRange(pos, pos)\n }\n }, [])\n\n const handleRifmChange = React.useCallback(\n (val: string) => {\n setMaskedValue(val)\n\n // Position cursor at next empty placeholder after Rifm processes\n requestAnimationFrame(() => {\n const el = inputRef.current\n if (!el) return\n\n const pos = el.value.indexOf(\"_\")\n const cursor = pos === -1 ? el.value.length : pos\n\n el.setSelectionRange(cursor, cursor)\n })\n\n const digits = val.replace(/\\D/g, \"\")\n\n if (digits.length === 0) {\n onChange(null)\n setTempValue(null)\n setInputValue(\"\")\n\n return\n }\n\n const parsed = parseDateTimeInput(val, maskParseFormat, locale)\n\n if (parsed) {\n onChange(parsed)\n setTempValue(parsed)\n setInputValue(formatDateTimeDisplay(parsed, format, locale))\n }\n },\n [onChange, setTempValue, setInputValue, maskParseFormat, format, locale]\n )\n\n const rifm = useRifm({\n accept: ACCEPT_DIGITS,\n format: maskFormat,\n mask: true,\n onChange: handleRifmChange,\n value: maskedValue,\n })\n\n const handleFocus = React.useCallback(() => {\n setMaskedValue(maskFormat(displayValue))\n setFocused(true)\n }, [displayValue, maskFormat])\n\n const handleBlur = React.useCallback(() => {\n setFocused(false)\n onBlur?.()\n }, [onBlur])\n\n const handlePaste = React.useCallback(\n (e: React.ClipboardEvent<HTMLInputElement>) => {\n // Always paste a date from the beginning, ignoring caret position.\n e.preventDefault()\n handleRifmChange(maskFormat(e.clipboardData.getData(\"text\")))\n },\n [handleRifmChange, maskFormat]\n )\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLInputElement>) => {\n // On Backspace, skip the caret back over mask separators (\".\", \":\", \" \")\n if (e.key !== \"Backspace\") return\n\n const el = e.currentTarget\n const { selectionStart, selectionEnd } = el\n\n if (selectionStart === null || selectionStart !== selectionEnd) return\n\n let pos = selectionStart\n\n while (pos > 0 && !/[\\d_]/.test(el.value[pos - 1])) {\n pos--\n }\n\n if (pos !== selectionStart) {\n el.setSelectionRange(pos, pos)\n }\n },\n []\n )\n\n const iconAddon = (\n <FieldGroupAddon align={iconPosition}>\n <PopoverTrigger asChild>\n <Button\n aria-label={openPickerAriaLabel}\n disabled={disabled}\n size=\"icon-sm\"\n variant=\"tertiary\"\n >\n {icon}\n </Button>\n </PopoverTrigger>\n </FieldGroupAddon>\n )\n\n const input = focused ? (\n <FieldInput\n aria-label={inputAriaLabel}\n className={mergeClasses(styles.inputFlex, styles.input)}\n data-testid={testId}\n disabled={disabled}\n onBlur={handleBlur}\n onChange={rifm.onChange}\n onFocus={handleFocus}\n onKeyDown={handleKeyDown}\n onPaste={handlePaste}\n ref={rifmRefCallback}\n value={rifm.value}\n />\n ) : (\n <FieldInput\n aria-label={inputAriaLabel}\n className={mergeClasses(styles.inputFlex, styles.input)}\n data-testid={testId}\n disabled={disabled}\n onFocus={handleFocus}\n readOnly\n value={displayValue}\n />\n )\n\n return (\n <PopoverAnchor asChild>\n <FieldInputGroup\n className={mergeClasses(styles.group, className)}\n data-slot=\"datetimepicker-input\"\n {...{ [SLOT_ATTR]: \"datetimepicker-input\" }}\n ref={ref}\n >\n {iconPosition === \"start\" && iconAddon}\n {input}\n {iconPosition === \"end\" && iconAddon}\n </FieldInputGroup>\n </PopoverAnchor>\n )\n }\n)\n\nexport const DateTimePickerInput = React.forwardRef<\n HTMLDivElement,\n DateTimePickerInputProps\n>(function DateTimePickerInput(\n {\n editable = false,\n iconPosition = \"end\",\n placeholder = \"dd/MM/yyyy HH:mm\",\n inputAriaLabel = \"change date and time\",\n openPickerAriaLabel = \"Open date picker\",\n keyboardIcon,\n testId,\n className,\n disabled: disabledProp,\n },\n ref\n) {\n const styles = useStyles()\n const ctx = useDateTimePickerContext()\n const disabled = disabledProp ?? ctx.disabled\n\n const IconComponent = keyboardIcon || <CalendarIcon />\n\n if (editable) {\n return (\n <EditableInput\n className={className}\n ctx={ctx}\n disabled={disabled}\n icon={IconComponent}\n iconPosition={iconPosition}\n inputAriaLabel={inputAriaLabel}\n openPickerAriaLabel={openPickerAriaLabel}\n ref={ref}\n testId={testId}\n />\n )\n }\n\n const iconAddon = (\n <FieldGroupAddon align={iconPosition}>\n <Button\n aria-label={openPickerAriaLabel}\n disabled={disabled}\n onClick={() => ctx.setIsOpen(true)}\n size=\"icon-sm\"\n variant=\"tertiary\"\n >\n {IconComponent}\n </Button>\n </FieldGroupAddon>\n )\n\n return (\n <FieldInputGroup\n className={mergeClasses(styles.group, className)}\n data-slot=\"datetimepicker-input\"\n {...{ [SLOT_ATTR]: \"datetimepicker-input\" }}\n ref={ref}\n >\n {iconPosition === \"start\" && iconAddon}\n <PopoverTrigger asChild>\n <FieldInput\n aria-label={inputAriaLabel}\n className={mergeClasses(styles.inputFlex, styles.input)}\n data-testid={testId}\n disabled={disabled}\n onBlur={ctx.handleInputBlur}\n onChange={ctx.handleInputChange}\n placeholder={placeholder}\n value={ctx.inputValue}\n />\n </PopoverTrigger>\n {iconPosition === \"end\" && iconAddon}\n </FieldInputGroup>\n )\n})\n"],"names":["CalendarIcon","props","jsxDEV","this","ACCEPT_DIGITS","MASK_FORMAT_DATE","MASK_FORMAT_DATETIME","createMaskFormatter","isDateTime","maxDigits","str","digits","result","di","useStyles","makeVoltStyles","EditableInput","React","ctx","disabled","icon","iconPosition","inputAriaLabel","openPickerAriaLabel","testId","className","ref","styles","value","format","locale","onChange","onBlur","setTempValue","setInputValue","maskFormat","maskParseFormat","displayValue","formatDateTimeDisplay","maskedValue","setMaskedValue","focused","setFocused","inputRef","rifmRefCallback","el","pos","handleRifmChange","val","cursor","parsed","parseDateTimeInput","rifm","useRifm","handleFocus","handleBlur","handlePaste","e","handleKeyDown","selectionStart","selectionEnd","iconAddon","FieldGroupAddon","PopoverTrigger","Button","input","FieldInput","mergeClasses","PopoverAnchor","FieldInputGroup","SLOT_ATTR","DateTimePickerInput","editable","placeholder","keyboardIcon","disabledProp","useDateTimePickerContext","IconComponent"],"mappings":"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"}
|