@vielzeug/refine 1.4.0 → 1.5.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.
Files changed (56) hide show
  1. package/dist/custom-elements.json +6131 -6085
  2. package/dist/date-picker.cjs +42 -40
  3. package/dist/date-picker.cjs.map +1 -1
  4. package/dist/date-picker.js +96 -88
  5. package/dist/date-picker.js.map +1 -1
  6. package/dist/feedback/toast/toast.d.ts +1 -0
  7. package/dist/feedback/toast/toast.d.ts.map +1 -1
  8. package/dist/headless/positioner.cjs +1 -1
  9. package/dist/headless/positioner.cjs.map +1 -1
  10. package/dist/headless/positioner.d.ts +12 -2
  11. package/dist/headless/positioner.d.ts.map +1 -1
  12. package/dist/headless/positioner.js +28 -23
  13. package/dist/headless/positioner.js.map +1 -1
  14. package/dist/inputs/combobox/combobox.css.cjs +1 -1
  15. package/dist/inputs/combobox/combobox.css.cjs.map +1 -1
  16. package/dist/inputs/combobox/combobox.css.js +1 -1
  17. package/dist/inputs/combobox/combobox.css.js.map +1 -1
  18. package/dist/inputs/date-picker/date-picker.css.cjs +1 -1
  19. package/dist/inputs/date-picker/date-picker.css.cjs.map +1 -1
  20. package/dist/inputs/date-picker/date-picker.css.js +1 -1
  21. package/dist/inputs/date-picker/date-picker.css.js.map +1 -1
  22. package/dist/inputs/date-picker/date-picker.d.ts.map +1 -1
  23. package/dist/inputs/input/input.css.cjs +1 -1
  24. package/dist/inputs/input/input.css.cjs.map +1 -1
  25. package/dist/inputs/input/input.css.js +1 -1
  26. package/dist/inputs/input/input.css.js.map +1 -1
  27. package/dist/inputs/number-input/number-input.css.cjs +1 -1
  28. package/dist/inputs/number-input/number-input.css.cjs.map +1 -1
  29. package/dist/inputs/number-input/number-input.css.js +1 -1
  30. package/dist/inputs/number-input/number-input.css.js.map +1 -1
  31. package/dist/inputs/select/select.css.cjs +1 -1
  32. package/dist/inputs/select/select.css.cjs.map +1 -1
  33. package/dist/inputs/select/select.css.js +1 -1
  34. package/dist/inputs/select/select.css.js.map +1 -1
  35. package/dist/layout/navbar/navbar.css.cjs +1 -1
  36. package/dist/layout/navbar/navbar.css.cjs.map +1 -1
  37. package/dist/layout/navbar/navbar.css.js +1 -1
  38. package/dist/layout/navbar/navbar.css.js.map +1 -1
  39. package/dist/number-input.cjs +22 -21
  40. package/dist/number-input.cjs.map +1 -1
  41. package/dist/number-input.js +22 -21
  42. package/dist/number-input.js.map +1 -1
  43. package/dist/overlay/shared/use-dialog.cjs +1 -1
  44. package/dist/overlay/shared/use-dialog.cjs.map +1 -1
  45. package/dist/overlay/shared/use-dialog.d.ts.map +1 -1
  46. package/dist/overlay/shared/use-dialog.js +5 -4
  47. package/dist/overlay/shared/use-dialog.js.map +1 -1
  48. package/dist/refine.cjs +139 -136
  49. package/dist/refine.cjs.map +1 -1
  50. package/dist/refine.iife.js +139 -136
  51. package/dist/refine.iife.js.map +1 -1
  52. package/dist/refine.js +195 -192
  53. package/dist/refine.js.map +1 -1
  54. package/dist/toast.cjs.map +1 -1
  55. package/dist/toast.js.map +1 -1
  56. package/package.json +12 -8
@@ -1,51 +1,52 @@
1
1
  import { reducedMotionMixin as e } from "./styles/mixins/accessibility.css.js";
2
2
  import { colorThemeMixin as t } from "./styles/mixins/theme.css.js";
3
3
  import { disablableBundle as n, roundableBundle as r, sizableBundle as i, themableBundle as a } from "./shared/prop-bundles.js";
4
- import { createDatePickerControl as o, formatDisplayDate as s, parseIso as c, toIsoString as l } from "./headless/date-picker.js";
5
- import { useField as u } from "./ore/dist/forms/field.js";
4
+ import { createDropdownPositioner as o } from "./headless/positioner.js";
5
+ import { createDatePickerControl as s, formatDisplayDate as c, parseIso as l, toIsoString as u } from "./headless/date-picker.js";
6
+ import { useField as d } from "./ore/dist/forms/field.js";
6
7
  import "./ore/dist/forms.js";
7
- import { FORM_CTX as d, useFormContext as f } from "./inputs/shared/form-context.js";
8
+ import { FORM_CTX as f, useFormContext as ee } from "./inputs/shared/form-context.js";
8
9
  import p from "./inputs/date-picker/date-picker.css.js";
9
- import { bind as m, define as h, getHost as g, html as _, inject as v, onMounted as y, prop as b, useEmit as x } from "@vielzeug/ore";
10
+ import { bind as te, define as m, getHost as h, html as g, inject as _, onMounted as v, prop as y, ref as b, useEmit as x } from "@vielzeug/ore";
10
11
  import { computed as S, signal as C } from "@vielzeug/ripple";
11
12
  import { Temporal as w, format as T } from "@vielzeug/tempo";
12
13
  //#region src/inputs/date-picker/date-picker.ts
13
14
  var E = "ore-date-picker";
14
- h(E, {
15
+ m(E, {
15
16
  formAssociated: !0,
16
17
  props: {
17
18
  ...a,
18
19
  ...i,
19
20
  ...n,
20
21
  ...r,
21
- error: b.string(),
22
- fullwidth: b.bool(!1),
23
- helper: b.string(),
24
- label: b.string(),
25
- "label-placement": b.oneOf(["inset", "outside"], "inset"),
26
- locale: b.string(),
27
- max: b.string(),
28
- min: b.string(),
29
- name: b.string(),
30
- placeholder: b.string(),
31
- required: b.bool(!1),
32
- value: b.string(),
33
- variant: b.string(),
34
- "weekend-days": b.json([])
22
+ error: y.string(),
23
+ fullwidth: y.bool(!1),
24
+ helper: y.string(),
25
+ label: y.string(),
26
+ "label-placement": y.oneOf(["inset", "outside"], "inset"),
27
+ locale: y.string(),
28
+ max: y.string(),
29
+ min: y.string(),
30
+ name: y.string(),
31
+ placeholder: y.string(),
32
+ required: y.bool(!1),
33
+ value: y.string(),
34
+ variant: y.string(),
35
+ "weekend-days": y.json([])
35
36
  },
36
37
  setup(e) {
37
- let t = g(), n = x(), r = C(!1), i = C(void 0), a = S(() => i.value === void 0 ? c(e.value.value) : i.value), p = f(e, v(d)), h = p.disabled, b = S(() => e.locale.value || (typeof navigator < "u" ? navigator.language : "en")), E = o({
38
+ let t = h(), n = x(), r = C(!1), i = C(void 0), a = S(() => i.value === void 0 ? l(e.value.value) : i.value), p = ee(e, _(f)), m = p.disabled, y = S(() => e.locale.value || (typeof navigator < "u" ? navigator.language : "en")), E = s({
38
39
  get locale() {
39
- return b.value;
40
+ return y.value;
40
41
  },
41
42
  get max() {
42
- return c(e.max.value);
43
+ return l(e.max.value);
43
44
  },
44
45
  get min() {
45
- return c(e.min.value);
46
+ return l(e.min.value);
46
47
  },
47
48
  onChange(e) {
48
- i.value = e, r.value = !1, E.setView("day"), D.value = "day", O.value = E.displayYear(), k.value = E.displayMonth(), n("change", { isoValue: l(e) });
49
+ i.value = e, r.value = !1, E.setView("day"), D.value = "day", O.value = E.displayYear(), k.value = E.displayMonth(), n("change", { isoValue: u(e) });
49
50
  },
50
51
  get value() {
51
52
  return a.value;
@@ -54,27 +55,32 @@ h(E, {
54
55
  return e["weekend-days"].value ?? [];
55
56
  }
56
57
  }), D = C("day"), O = C(E.displayYear()), k = C(E.displayMonth());
57
- u({
58
- disabled: h,
58
+ d({
59
+ disabled: m,
59
60
  toFormValue: (e) => e || null,
60
- value: S(() => l(a.value) ?? "")
61
+ value: S(() => u(a.value) ?? "")
61
62
  });
62
- let A = `date-picker-${Math.random().toString(36).slice(2, 9)}-calendar`, j = S(() => a.value ? s(a.value, b.value) : e.placeholder.value || ""), M = S(() => T(w.PlainDate.from({
63
+ let A = `date-picker-${Math.random().toString(36).slice(2, 9)}-calendar`, j = b(), M = b(), N = o({
64
+ getFloating: () => M.value ?? null,
65
+ getReference: () => j.value ?? null,
66
+ matchWidth: !1,
67
+ offsetPx: 4
68
+ }), P = null, ne = S(() => a.value ? c(a.value, y.value) : e.placeholder.value || ""), F = S(() => T(w.PlainDate.from({
63
69
  day: 1,
64
70
  month: k.value,
65
71
  year: O.value
66
72
  }), {
67
73
  intl: { month: "long" },
68
- locale: b.value,
74
+ locale: y.value,
69
75
  tz: "UTC"
70
- })), N = S(() => String(O.value)), P = S(() => `${M.value} ${N.value}`), F = S(() => (O.value, k.value, a.value, E.dayCells())), I = S(() => (O.value, E.monthCells())), L = S(() => (O.value, E.yearCells())), R = S(() => E.weekdayLabels()), z = () => h.value ? "-1" : "0";
71
- function B() {
76
+ })), I = S(() => String(O.value)), L = S(() => `${F.value} ${I.value}`), R = S(() => (O.value, k.value, a.value, E.dayCells())), z = S(() => (O.value, E.monthCells())), B = S(() => (O.value, E.yearCells())), V = S(() => E.weekdayLabels()), H = () => m.value ? "-1" : "0";
77
+ function U() {
72
78
  D.value === "day" ? E.prevMonth() : E.prevYear(), O.value = E.displayYear(), k.value = E.displayMonth();
73
79
  }
74
- function V() {
80
+ function W() {
75
81
  D.value === "day" ? E.nextMonth() : E.nextYear(), O.value = E.displayYear(), k.value = E.displayMonth();
76
82
  }
77
- function H() {
83
+ function G() {
78
84
  let e = [
79
85
  "day",
80
86
  "month",
@@ -82,24 +88,24 @@ h(E, {
82
88
  ], t = e[(e.indexOf(D.value) + 1) % e.length];
83
89
  E.setView(t), D.value = t;
84
90
  }
85
- function U(e) {
91
+ function K(e) {
86
92
  E.goTo(E.displayYear(), e), E.setView("day"), O.value = E.displayYear(), k.value = E.displayMonth(), D.value = "day";
87
93
  }
88
- function W(e) {
94
+ function q(e) {
89
95
  E.goTo(e, E.displayMonth()), E.setView("month"), O.value = E.displayYear(), D.value = "month";
90
96
  }
91
- function G(e) {
92
- let t = c(e);
97
+ function J(e) {
98
+ let t = l(e);
93
99
  t && E.select(t);
94
100
  }
95
- function K(e) {
101
+ function Y(e) {
96
102
  let t = e.currentTarget, n = t.closest(".cal-grid-days");
97
103
  if (!n) return;
98
104
  let r = Array.from(n.querySelectorAll(".cal-cell-day")), i = r.indexOf(t);
99
105
  if (i === -1) return;
100
106
  let a;
101
107
  if (e.key === "Enter" || e.key === " ") {
102
- e.preventDefault(), G(t.dataset.iso ?? "");
108
+ e.preventDefault(), J(t.dataset.iso ?? "");
103
109
  return;
104
110
  } else if (e.key === "ArrowRight") a = r[i + 1];
105
111
  else if (e.key === "ArrowLeft") a = r[i - 1];
@@ -110,7 +116,7 @@ h(E, {
110
116
  else return;
111
117
  e.preventDefault(), a?.focus();
112
118
  }
113
- function q(e, t, n, r) {
119
+ function X(e, t, n, r) {
114
120
  let i = e.currentTarget, a = i.closest(".cal-grid");
115
121
  if (!a) return;
116
122
  let o = Array.from(a.querySelectorAll(t)), s = o.indexOf(i);
@@ -128,41 +134,42 @@ h(E, {
128
134
  else return;
129
135
  e.preventDefault(), c?.focus();
130
136
  }
131
- function J() {
132
- if (h.value) return;
137
+ function re() {
138
+ if (m.value) return;
133
139
  r.value = !0, E.setView("day"), D.value = "day";
134
140
  let e = a.value;
135
- e && (E.goTo(e.year, e.month), O.value = E.displayYear(), k.value = E.displayMonth());
141
+ e && (E.goTo(e.year, e.month), O.value = E.displayYear(), k.value = E.displayMonth()), N.update(), P = N.startAutoUpdate?.() ?? null;
136
142
  }
137
- function Y() {
138
- r.value = !1, E.setView("day"), D.value = "day";
143
+ function Z() {
144
+ r.value = !1, E.setView("day"), D.value = "day", P?.(), P = null;
139
145
  }
140
- function X() {
141
- r.value ? Y() : J();
146
+ function Q() {
147
+ r.value ? Z() : re();
142
148
  }
143
- function Z(e) {
144
- h.value || (e.key === "Enter" || e.key === " " ? (e.preventDefault(), X()) : e.key === "Escape" && r.value && (e.preventDefault(), Y()));
149
+ function ie(e) {
150
+ m.value || (e.key === "Enter" || e.key === " " ? (e.preventDefault(), Q()) : e.key === "Escape" && r.value && (e.preventDefault(), Z()));
145
151
  }
146
- function Q(e) {
147
- e.key === "Escape" && (e.preventDefault(), Y());
152
+ function ae(e) {
153
+ e.key === "Escape" && (e.preventDefault(), Z());
148
154
  }
149
155
  function $(e) {
150
- r.value && (e.composedPath().includes(t) || Y());
156
+ r.value && (e.composedPath().includes(t) || Z());
151
157
  }
152
- return y(() => (document.addEventListener("pointerdown", $, { capture: !0 }), () => {
153
- document.removeEventListener("pointerdown", $, { capture: !0 });
154
- })), m({ attr: { open: () => r.value ? !0 : void 0 } }), _`
158
+ return v(() => (document.addEventListener("pointerdown", $, { capture: !0 }), () => {
159
+ document.removeEventListener("pointerdown", $, { capture: !0 }), P?.(), P = null;
160
+ })), te({ attr: { open: () => r.value ? !0 : void 0 } }), g`
155
161
  <!-- Trigger: ore-input in readonly display mode -->
156
162
  <ore-input
157
163
  class="trigger"
164
+ ref="${j}"
158
165
  readonly
159
- tabindex="${z}"
166
+ tabindex="${H}"
160
167
  role="combobox"
161
168
  aria-haspopup="dialog"
162
169
  aria-controls="${A}"
163
170
  :aria-expanded="${() => String(r.value)}"
164
- :aria-disabled="${() => h.value ? "true" : null}"
165
- :value="${() => j.value}"
171
+ :aria-disabled="${() => m.value ? "true" : null}"
172
+ :value="${() => ne.value}"
166
173
  :label="${() => e.label.value ?? ""}"
167
174
  :placeholder="${() => e.placeholder.value ?? ""}"
168
175
  :label-placement="${() => e["label-placement"].value ?? "inset"}"
@@ -172,37 +179,38 @@ h(E, {
172
179
  :rounded="${() => e.rounded?.value ?? void 0}"
173
180
  :helper="${() => e.helper.value ?? ""}"
174
181
  :error="${() => e.error.value ?? ""}"
175
- ?disabled="${() => h.value ? !0 : void 0}"
182
+ ?disabled="${() => m.value ? !0 : void 0}"
176
183
  ?required="${() => e.required.value ? !0 : void 0}"
177
184
  ?fullwidth="${() => e.fullwidth.value ? !0 : void 0}"
178
- @click="${X}"
179
- @keydown="${Z}">
185
+ @click="${Q}"
186
+ @keydown="${ie}">
180
187
  <ore-icon slot="suffix" name="calendar" size="16" stroke-width="1.75" aria-hidden="true"></ore-icon>
181
188
  </ore-input>
182
189
 
183
190
  <!-- Calendar popup -->
184
191
  <div
185
192
  class="calendar"
193
+ ref="${M}"
186
194
  id="${A}"
187
195
  role="dialog"
188
196
  aria-modal="true"
189
- :aria-label="${() => `Choose date — ${P.value}`}"
197
+ :aria-label="${() => `Choose date — ${L.value}`}"
190
198
  ?data-open="${r}"
191
- @keydown="${Q}">
199
+ @keydown="${ae}">
192
200
  <!-- Calendar header -->
193
201
  <div class="cal-header" part="header">
194
- <button class="nav-btn" type="button" aria-label="Previous" @click="${B}">
202
+ <button class="nav-btn" type="button" aria-label="Previous" @click="${U}">
195
203
  <ore-icon name="chevron-left" size="16" stroke-width="2" aria-hidden="true"></ore-icon>
196
204
  </button>
197
205
  <button
198
206
  class="cal-label-btn"
199
207
  type="button"
200
208
  :aria-label="${() => `Switch to ${D.value === "day" ? "month" : D.value === "month" ? "year" : "day"} view`}"
201
- @click="${H}">
202
- <span class="cal-label-month">${M}</span><span class="cal-label-sep" aria-hidden="true">/</span
203
- ><span class="cal-label-year">${N}</span>
209
+ @click="${G}">
210
+ <span class="cal-label-month">${F}</span><span class="cal-label-sep" aria-hidden="true">/</span
211
+ ><span class="cal-label-year">${I}</span>
204
212
  </button>
205
- <button class="nav-btn" type="button" aria-label="Next" @click="${V}">
213
+ <button class="nav-btn" type="button" aria-label="Next" @click="${W}">
206
214
  <ore-icon name="chevron-right" size="16" stroke-width="2" aria-hidden="true"></ore-icon>
207
215
  </button>
208
216
  </div>
@@ -212,16 +220,16 @@ h(E, {
212
220
  class="cal-grid cal-grid-days"
213
221
  role="grid"
214
222
  part="grid"
215
- :aria-label="${() => P.value}"
223
+ :aria-label="${() => L.value}"
216
224
  ?hidden="${() => D.value !== "day"}">
217
225
  <div role="row" class="cal-grid-row">
218
- ${() => R.value.map((e) => _`<div class="cal-cell cal-cell-head" role="columnheader" aria-label="${e}">${e}</div>`)}
226
+ ${() => V.value.map((e) => g`<div class="cal-cell cal-cell-head" role="columnheader" aria-label="${e}">${e}</div>`)}
219
227
  </div>
220
228
  ${() => {
221
- let e = F.value, t = [];
229
+ let e = R.value, t = [];
222
230
  for (let n = 0; n < e.length; n += 7) t.push(e.slice(n, n + 7));
223
- return t.map((e) => _`<div role="row" class="cal-grid-row">
224
- ${e.map((e) => _`<div
231
+ return t.map((e) => g`<div role="row" class="cal-grid-row">
232
+ ${e.map((e) => g`<div
225
233
  class="cal-cell cal-cell-day"
226
234
  role="gridcell"
227
235
  part="day"
@@ -234,8 +242,8 @@ h(E, {
234
242
  ?data-disabled="${() => e.isDisabled}"
235
243
  data-iso="${e.iso}"
236
244
  tabindex="${() => e.isDisabled ? "-1" : "0"}"
237
- @click="${() => G(e.iso)}"
238
- @keydown="${K}">
245
+ @click="${() => J(e.iso)}"
246
+ @keydown="${Y}">
239
247
  ${String(e.day)}
240
248
  </div>`)}
241
249
  </div>`);
@@ -246,13 +254,13 @@ h(E, {
246
254
  <div
247
255
  class="cal-grid cal-grid-months"
248
256
  role="grid"
249
- :aria-label="${() => N.value}"
257
+ :aria-label="${() => I.value}"
250
258
  ?hidden="${() => D.value !== "month"}">
251
259
  ${() => {
252
- let e = I.value, t = [];
260
+ let e = z.value, t = [];
253
261
  for (let n = 0; n < e.length; n += 4) t.push(e.slice(n, n + 4));
254
- return t.map((e) => _`<div role="row">
255
- ${e.map((e) => _`<div
262
+ return t.map((e) => g`<div role="row">
263
+ ${e.map((e) => g`<div
256
264
  class="cal-cell cal-cell-month"
257
265
  role="gridcell"
258
266
  :aria-selected="${() => String(e.isSelected)}"
@@ -261,10 +269,10 @@ h(E, {
261
269
  ?data-disabled="${() => e.isDisabled}"
262
270
  tabindex="${() => e.isDisabled ? "-1" : "0"}"
263
271
  @click="${() => {
264
- e.isDisabled || U(e.month);
272
+ e.isDisabled || K(e.month);
265
273
  }}"
266
- @keydown="${(t) => q(t, ".cal-cell-month", 4, () => {
267
- e.isDisabled || U(e.month);
274
+ @keydown="${(t) => X(t, ".cal-cell-month", 4, () => {
275
+ e.isDisabled || K(e.month);
268
276
  })}">
269
277
  ${e.shortLabel}
270
278
  </div>`)}
@@ -279,10 +287,10 @@ h(E, {
279
287
  aria-label="Select year"
280
288
  ?hidden="${() => D.value !== "year"}">
281
289
  ${() => {
282
- let e = L.value, t = [];
290
+ let e = B.value, t = [];
283
291
  for (let n = 0; n < e.length; n += 4) t.push(e.slice(n, n + 4));
284
- return t.map((e) => _`<div role="row">
285
- ${e.map((e) => _`<div
292
+ return t.map((e) => g`<div role="row">
293
+ ${e.map((e) => g`<div
286
294
  class="cal-cell cal-cell-year"
287
295
  role="gridcell"
288
296
  :aria-selected="${() => String(e.isSelected)}"
@@ -291,10 +299,10 @@ h(E, {
291
299
  ?data-disabled="${() => e.isDisabled}"
292
300
  tabindex="${() => e.isDisabled ? "-1" : "0"}"
293
301
  @click="${() => {
294
- e.isDisabled || W(e.year);
302
+ e.isDisabled || q(e.year);
295
303
  }}"
296
- @keydown="${(t) => q(t, ".cal-cell-year", 4, () => {
297
- e.isDisabled || W(e.year);
304
+ @keydown="${(t) => X(t, ".cal-cell-year", 4, () => {
305
+ e.isDisabled || q(e.year);
298
306
  })}">
299
307
  ${String(e.year)}
300
308
  </div>`)}
@@ -1 +1 @@
1
- {"version":3,"file":"date-picker.js","names":[],"sources":["../src/inputs/date-picker/date-picker.ts"],"sourcesContent":["import { define, html, inject, prop, bind, getHost, onMounted, useEmit } from '@vielzeug/ore';\nimport { useField } from '@vielzeug/ore/forms';\nimport { computed, signal } from '@vielzeug/ripple';\nimport { Temporal, format } from '@vielzeug/tempo';\n\nimport type { ComponentSize, RoundedSize, ThemeColor, VisualVariant } from '../../shared';\n\nimport { createDatePickerControl, formatDisplayDate, parseIso, toIsoString, type DatePickerView } from '../../headless';\nimport '../../content/icon/icon';\nimport '../input/input';\nimport { disablableBundle, roundableBundle, sizableBundle, themableBundle } from '../../shared';\nimport { colorThemeMixin, reducedMotionMixin } from '../../styles';\nimport { FORM_CTX, useFormContext } from '../shared/form-context';\nimport componentStyles from './date-picker.css?inline';\n\n// ── Types ─────────────────────────────────────────────────────────────────────\n\nexport type OreDatePickerEvents = {\n change: { isoValue: string | null };\n};\n\nexport type OreDatePickerProps = {\n /** Theme color */\n color?: ThemeColor;\n /** Disable the picker */\n disabled?: boolean;\n /** Validation error message */\n error?: string;\n /** Expand to container width */\n fullwidth?: boolean;\n /** Helper text below the field */\n helper?: string;\n /** Visible label */\n label?: string;\n /** Label placement */\n 'label-placement'?: 'inset' | 'outside';\n /** Locale for day/month names (default: browser locale) */\n locale?: string;\n /** Latest selectable date in ISO 8601 format (yyyy-MM-dd) */\n max?: string;\n /** Earliest selectable date in ISO 8601 format (yyyy-MM-dd) */\n min?: string;\n /** Form field name */\n name?: string;\n /** Placeholder shown in the text trigger */\n placeholder?: string;\n /** Mark field as required */\n required?: boolean;\n /** Border radius */\n rounded?: RoundedSize;\n /** Component size */\n size?: ComponentSize;\n /**\n * Selected date in ISO 8601 format (yyyy-MM-dd).\n * @example '2025-06-15'\n */\n value?: string;\n /** Visual variant */\n variant?: Exclude<VisualVariant, 'text' | 'frost'>;\n /**\n * Day-of-week indices to disable (0 = Sunday … 6 = Saturday).\n * Pass as a JSON array attribute or a JS property.\n * @example\n * ```html\n * <ore-date-picker weekend-days=\"[0,6]\"></ore-date-picker>\n * ```\n */\n 'weekend-days'?: number[];\n};\n\n/**\n * An accessible, keyboard-navigable date picker with an inline calendar popup.\n * Supports min/max bounds, disabled weekend days, and form association.\n *\n * @element ore-date-picker\n *\n * @attr {string} value - Selected date in ISO 8601 format (yyyy-MM-dd)\n * @attr {string} min - Minimum selectable date (yyyy-MM-dd)\n * @attr {string} max - Maximum selectable date (yyyy-MM-dd)\n * @attr {string} label - Label text\n * @attr {string} label-placement - 'inset' | 'outside'\n * @attr {string} placeholder - Trigger placeholder\n * @attr {boolean} disabled - Disable the picker\n * @attr {boolean} required - Required field\n * @attr {string} name - Form field name\n * @attr {string} error - Error message\n * @attr {string} helper - Helper text\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} size - Component size: 'sm' | 'md' | 'lg'\n * @attr {string} variant - Visual variant: 'solid' | 'flat' | 'bordered' | 'outline' | 'ghost'\n * @attr {string} rounded - Border radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'\n * @attr {string} locale - BCP 47 locale string\n * @attr {string} weekend-days - Comma-separated day indices to disable\n *\n * @fires change - Fired when a date is selected. detail: { isoValue: string | null }\n *\n * @slot label - Custom label for the trigger field\n * @slot prefix - Content before the trigger text (e.g. icon)\n * @slot helper - Custom helper text\n * @slot error - Custom error content\n *\n * @cssprop --date-picker-bg - Calendar background\n * @cssprop --date-picker-border-color - Calendar border color\n * @cssprop --date-picker-radius - Calendar border radius\n * @cssprop --date-picker-day-selected-bg - Background of selected day\n * @cssprop --date-picker-day-today-color - Color of today's date number\n * @cssprop --date-picker-day-outside-opacity - Opacity of days outside visible month\n *\n * @part field - The trigger button/field\n * @part calendar - The floating calendar panel\n * @part header - Calendar header (nav + label)\n * @part grid - Day grid\n * @part day - Individual day cell\n *\n * @example\n * ```html\n * <!-- Single date with constraints -->\n * <ore-date-picker label=\"Appointment date\" name=\"date\" min=\"2025-01-01\" max=\"2025-12-31\" color=\"primary\"></ore-date-picker>\n *\n *\n * <!-- Outside label, bordered variant -->\n * <ore-date-picker label=\"Start date\" label-placement=\"outside\" variant=\"bordered\"></ore-date-picker>\n * ```\n */\nexport const DATE_PICKER_TAG = 'ore-date-picker' as const;\n\ndefine<OreDatePickerProps>(DATE_PICKER_TAG, {\n formAssociated: true,\n props: {\n ...themableBundle,\n ...sizableBundle,\n ...disablableBundle,\n ...roundableBundle,\n error: prop.string(),\n fullwidth: prop.bool(false),\n helper: prop.string(),\n label: prop.string(),\n 'label-placement': prop.oneOf(['inset', 'outside'] as const, 'inset'),\n locale: prop.string(),\n max: prop.string(),\n min: prop.string(),\n name: prop.string(),\n placeholder: prop.string(),\n required: prop.bool(false),\n value: prop.string(),\n variant: prop.string<'flat' | 'solid' | 'bordered' | 'outline' | 'ghost'>(),\n 'weekend-days': prop.json([] as number[]),\n },\n\n setup(props) {\n const el = getHost();\n const emit = useEmit<OreDatePickerEvents>();\n\n // ── Signals ─────────────────────────────────────────────────────────────\n\n const isOpen = signal(false);\n\n // ── Selected date: local-override pattern ──────────────────────────────\n // localSelection holds a user-initiated pick (or undefined = no override).\n // selectedDate falls back to the value prop reactively — no setInterval needed.\n\n const localSelection = signal<Temporal.PlainDate | null | undefined>(undefined);\n\n const selectedDate = computed(() =>\n localSelection.value !== undefined ? localSelection.value : parseIso(props.value.value),\n );\n\n // ── Form context ────────────────────────────────────────────────────────\n\n const formCtx = inject(FORM_CTX);\n const fCtxProps = useFormContext(props, formCtx);\n\n const isDisabled = fCtxProps.disabled;\n const locale = computed(() => props.locale.value || (typeof navigator !== 'undefined' ? navigator.language : 'en'));\n\n // ── Date-picker control ─────────────────────────────────────────────────\n\n const ctrl = createDatePickerControl({\n get locale() {\n return locale.value;\n },\n get max() {\n return parseIso(props.max.value);\n },\n get min() {\n return parseIso(props.min.value);\n },\n onChange(date) {\n localSelection.value = date;\n isOpen.value = false;\n ctrl.setView('day');\n currentView.value = 'day';\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n emit('change', { isoValue: toIsoString(date) });\n },\n get value() {\n return selectedDate.value;\n },\n get weekendDays() {\n return props['weekend-days'].value ?? [];\n },\n });\n\n // ── Reactive display state ────────────────────────────────────────────\n // Three separate primitive signals — the proven pattern.\n\n const currentView = signal<DatePickerView>('day');\n const displayYear = signal(ctrl.displayYear());\n const displayMonth = signal(ctrl.displayMonth()); // 1-indexed (Temporal)\n\n // ── Form value (host is formAssociated) ──────────────────────────────────\n\n useField<string>({\n disabled: isDisabled,\n toFormValue: (v) => v || null,\n value: computed(() => toIsoString(selectedDate.value) ?? ''),\n });\n\n const dialogId = `date-picker-${Math.random().toString(36).slice(2, 9)}-calendar`;\n\n // ── Derived display values ───────────────────────────────────────────────\n\n const triggerText = computed(() => {\n if (selectedDate.value) return formatDisplayDate(selectedDate.value, locale.value);\n\n return props.placeholder.value || '';\n });\n\n const displayMonth_ = computed(() => {\n const d = Temporal.PlainDate.from({ day: 1, month: displayMonth.value, year: displayYear.value });\n\n return format(d, { intl: { month: 'long' }, locale: locale.value, tz: 'UTC' });\n });\n\n const displayYear_ = computed(() => String(displayYear.value));\n const displayLabel = computed(() => `${displayMonth_.value} ${displayYear_.value}`);\n\n const dayCells = computed(() => {\n void displayYear.value;\n void displayMonth.value;\n void selectedDate.value; // re-run when selection changes to refresh isSelected flags\n\n return ctrl.dayCells();\n });\n const monthCells = computed(() => {\n void displayYear.value;\n\n return ctrl.monthCells();\n });\n const yearCells = computed(() => {\n void displayYear.value;\n\n return ctrl.yearCells();\n });\n const weekdayLabels = computed(() => ctrl.weekdayLabels());\n const tabIndex = () => (isDisabled.value ? '-1' : '0');\n\n // ── Navigation handlers ──────────────────────────────────────────────────\n // In year/month views navigate by year; in day view navigate by month.\n\n function handlePrev(): void {\n if (currentView.value === 'day') ctrl.prevMonth();\n else ctrl.prevYear();\n\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n function handleNext(): void {\n if (currentView.value === 'day') ctrl.nextMonth();\n else ctrl.nextYear();\n\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n function handleHeaderClick(): void {\n const views: DatePickerView[] = ['day', 'month', 'year'];\n const next = views[(views.indexOf(currentView.value) + 1) % views.length];\n\n ctrl.setView(next);\n currentView.value = next;\n }\n\n function handleSelectMonth(month: number): void {\n ctrl.goTo(ctrl.displayYear(), month);\n ctrl.setView('day');\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n currentView.value = 'day';\n }\n\n function handleSelectYear(year: number): void {\n ctrl.goTo(year, ctrl.displayMonth());\n ctrl.setView('month');\n displayYear.value = ctrl.displayYear();\n currentView.value = 'month';\n }\n\n function handleSelectDay(isoStr: string): void {\n const date = parseIso(isoStr);\n\n if (!date) return;\n\n ctrl.select(date);\n }\n\n function handleDayKeydown(e: KeyboardEvent): void {\n const cell = e.currentTarget as HTMLElement;\n const grid = cell.closest('.cal-grid-days');\n\n if (!grid) return;\n\n const allCells = Array.from(grid.querySelectorAll<HTMLElement>('.cal-cell-day'));\n const idx = allCells.indexOf(cell);\n\n if (idx === -1) return;\n\n let target: HTMLElement | undefined;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleSelectDay(cell.dataset.iso ?? '');\n\n return;\n } else if (e.key === 'ArrowRight') {\n target = allCells[idx + 1];\n } else if (e.key === 'ArrowLeft') {\n target = allCells[idx - 1];\n } else if (e.key === 'ArrowDown') {\n target = allCells[idx + 7];\n } else if (e.key === 'ArrowUp') {\n target = allCells[idx - 7];\n } else if (e.key === 'Home') {\n target = allCells[Math.floor(idx / 7) * 7];\n } else if (e.key === 'End') {\n target = allCells[Math.floor(idx / 7) * 7 + 6];\n } else {\n return;\n }\n\n e.preventDefault();\n target?.focus();\n }\n\n // ── Month/year-cell keyboard navigation (fixed 4-column grid) ─────────────\n\n function handleGridKeydown(e: KeyboardEvent, cellSelector: string, columns: number, onSelect: () => void): void {\n const cell = e.currentTarget as HTMLElement;\n const grid = cell.closest('.cal-grid');\n\n if (!grid) return;\n\n const allCells = Array.from(grid.querySelectorAll<HTMLElement>(cellSelector));\n const idx = allCells.indexOf(cell);\n\n if (idx === -1) return;\n\n let target: HTMLElement | undefined;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n onSelect();\n\n return;\n } else if (e.key === 'ArrowRight') {\n target = allCells[idx + 1];\n } else if (e.key === 'ArrowLeft') {\n target = allCells[idx - 1];\n } else if (e.key === 'ArrowDown') {\n target = allCells[idx + columns];\n } else if (e.key === 'ArrowUp') {\n target = allCells[idx - columns];\n } else if (e.key === 'Home') {\n target = allCells[Math.floor(idx / columns) * columns];\n } else if (e.key === 'End') {\n target = allCells[Math.min(Math.floor(idx / columns) * columns + columns - 1, allCells.length - 1)];\n } else {\n return;\n }\n\n e.preventDefault();\n target?.focus();\n }\n\n // ── Open / close ─────────────────────────────────────────────────────────\n\n function openPicker(): void {\n if (isDisabled.value) return;\n\n isOpen.value = true;\n ctrl.setView('day');\n currentView.value = 'day';\n\n const sel = selectedDate.value;\n\n if (sel) {\n ctrl.goTo(sel.year, sel.month);\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n }\n\n function closePicker(): void {\n isOpen.value = false;\n ctrl.setView('day');\n currentView.value = 'day';\n }\n\n function handleTriggerClick(): void {\n if (isOpen.value) closePicker();\n else openPicker();\n }\n\n // ── Keyboard handlers ────────────────────────────────────────────────────\n\n function handleTriggerKeydown(e: KeyboardEvent): void {\n if (isDisabled.value) return;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleTriggerClick();\n } else if (e.key === 'Escape' && isOpen.value) {\n e.preventDefault();\n closePicker();\n }\n }\n\n function handleCalendarKeydown(e: KeyboardEvent): void {\n if (e.key === 'Escape') {\n e.preventDefault();\n closePicker();\n }\n }\n\n function handleOutsideClick(e: PointerEvent | MouseEvent): void {\n if (!isOpen.value) return;\n\n const path = e.composedPath();\n\n if (!path.includes(el)) closePicker();\n }\n\n // ── Lifecycle ────────────────────────────────────────────────────────────\n\n onMounted(() => {\n document.addEventListener('pointerdown', handleOutsideClick, { capture: true });\n\n return () => {\n document.removeEventListener('pointerdown', handleOutsideClick, { capture: true });\n };\n });\n\n // ── Host bindings ────────────────────────────────────────────────────────\n\n bind({\n attr: {\n open: () => (isOpen.value ? true : undefined),\n },\n });\n\n // ── Template ─────────────────────────────────────────────────────────────\n\n const inputValue = () => triggerText.value;\n const inputLabel = () => props.label.value ?? '';\n const inputPlaceholder = () => props.placeholder.value ?? '';\n const inputLabelPlacement = () => props['label-placement'].value ?? 'inset';\n const inputColor = () => props.color?.value ?? undefined;\n const inputSize = () => fCtxProps.size?.value ?? undefined;\n const inputVariant = () => fCtxProps.variant?.value ?? undefined;\n const inputRounded = () => props.rounded?.value ?? undefined;\n const inputHelper = () => props.helper.value ?? '';\n const inputError = () => props.error.value ?? '';\n const inputDisabled = () => (isDisabled.value ? true : undefined);\n const inputRequired = () => (props.required.value ? true : undefined);\n const inputFullwidth = () => (props.fullwidth.value ? true : undefined);\n\n return html`\n <!-- Trigger: ore-input in readonly display mode -->\n <ore-input\n class=\"trigger\"\n readonly\n tabindex=\"${tabIndex}\"\n role=\"combobox\"\n aria-haspopup=\"dialog\"\n aria-controls=\"${dialogId}\"\n :aria-expanded=\"${() => String(isOpen.value)}\"\n :aria-disabled=\"${() => (isDisabled.value ? 'true' : null)}\"\n :value=\"${inputValue}\"\n :label=\"${inputLabel}\"\n :placeholder=\"${inputPlaceholder}\"\n :label-placement=\"${inputLabelPlacement}\"\n :color=\"${inputColor}\"\n :size=\"${inputSize}\"\n :variant=\"${inputVariant}\"\n :rounded=\"${inputRounded}\"\n :helper=\"${inputHelper}\"\n :error=\"${inputError}\"\n ?disabled=\"${inputDisabled}\"\n ?required=\"${inputRequired}\"\n ?fullwidth=\"${inputFullwidth}\"\n @click=\"${handleTriggerClick}\"\n @keydown=\"${handleTriggerKeydown}\">\n <ore-icon slot=\"suffix\" name=\"calendar\" size=\"16\" stroke-width=\"1.75\" aria-hidden=\"true\"></ore-icon>\n </ore-input>\n\n <!-- Calendar popup -->\n <div\n class=\"calendar\"\n id=\"${dialogId}\"\n role=\"dialog\"\n aria-modal=\"true\"\n :aria-label=\"${() => `Choose date — ${displayLabel.value}`}\"\n ?data-open=\"${isOpen}\"\n @keydown=\"${handleCalendarKeydown}\">\n <!-- Calendar header -->\n <div class=\"cal-header\" part=\"header\">\n <button class=\"nav-btn\" type=\"button\" aria-label=\"Previous\" @click=\"${handlePrev}\">\n <ore-icon name=\"chevron-left\" size=\"16\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n </button>\n <button\n class=\"cal-label-btn\"\n type=\"button\"\n :aria-label=\"${() =>\n `Switch to ${currentView.value === 'day' ? 'month' : currentView.value === 'month' ? 'year' : 'day'} view`}\"\n @click=\"${handleHeaderClick}\">\n <span class=\"cal-label-month\">${displayMonth_}</span><span class=\"cal-label-sep\" aria-hidden=\"true\">/</span\n ><span class=\"cal-label-year\">${displayYear_}</span>\n </button>\n <button class=\"nav-btn\" type=\"button\" aria-label=\"Next\" @click=\"${handleNext}\">\n <ore-icon name=\"chevron-right\" size=\"16\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n </button>\n </div>\n\n <!-- Day view: flat 7-column CSS grid, weekday headers + day cells -->\n <div\n class=\"cal-grid cal-grid-days\"\n role=\"grid\"\n part=\"grid\"\n :aria-label=\"${() => displayLabel.value}\"\n ?hidden=\"${() => currentView.value !== 'day'}\">\n <div role=\"row\" class=\"cal-grid-row\">\n ${() =>\n weekdayLabels.value.map(\n (lbl) => html`<div class=\"cal-cell cal-cell-head\" role=\"columnheader\" aria-label=\"${lbl}\">${lbl}</div>`,\n )}\n </div>\n ${() => {\n const cells = dayCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 7) rows.push(cells.slice(i, i + 7));\n\n return rows.map(\n (row) =>\n html`<div role=\"row\" class=\"cal-grid-row\">\n ${row.map(\n (cell) =>\n html`<div\n class=\"cal-cell cal-cell-day\"\n role=\"gridcell\"\n part=\"day\"\n :aria-selected=\"${() => String(cell.isSelected)}\"\n :aria-disabled=\"${() => String(cell.isDisabled)}\"\n :aria-current=\"${() => (cell.isToday ? 'date' : null)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-today=\"${() => cell.isToday}\"\n ?data-outside=\"${() => cell.isOutsideMonth}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n data-iso=\"${cell.iso}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => handleSelectDay(cell.iso)}\"\n @keydown=\"${handleDayKeydown}\">\n ${String(cell.day)}\n </div>`,\n )}\n </div>`,\n );\n }}\n </div>\n\n <!-- Month view -->\n <div\n class=\"cal-grid cal-grid-months\"\n role=\"grid\"\n :aria-label=\"${() => displayYear_.value}\"\n ?hidden=\"${() => currentView.value !== 'month'}\">\n ${() => {\n const cells = monthCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 4) rows.push(cells.slice(i, i + 4));\n\n return rows.map(\n (row) =>\n html`<div role=\"row\">\n ${row.map(\n (cell) =>\n html`<div\n class=\"cal-cell cal-cell-month\"\n role=\"gridcell\"\n :aria-selected=\"${() => String(cell.isSelected)}\"\n :aria-disabled=\"${() => String(cell.isDisabled)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => {\n if (!cell.isDisabled) handleSelectMonth(cell.month);\n }}\"\n @keydown=\"${(e: KeyboardEvent) =>\n handleGridKeydown(e, '.cal-cell-month', 4, () => {\n if (!cell.isDisabled) handleSelectMonth(cell.month);\n })}\">\n ${cell.shortLabel}\n </div>`,\n )}\n </div>`,\n );\n }}\n </div>\n\n <!-- Year view -->\n <div\n class=\"cal-grid cal-grid-years\"\n role=\"grid\"\n aria-label=\"Select year\"\n ?hidden=\"${() => currentView.value !== 'year'}\">\n ${() => {\n const cells = yearCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 4) rows.push(cells.slice(i, i + 4));\n\n return rows.map(\n (row) =>\n html`<div role=\"row\">\n ${row.map(\n (cell) =>\n html`<div\n class=\"cal-cell cal-cell-year\"\n role=\"gridcell\"\n :aria-selected=\"${() => String(cell.isSelected)}\"\n :aria-disabled=\"${() => String(cell.isDisabled)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => {\n if (!cell.isDisabled) handleSelectYear(cell.year);\n }}\"\n @keydown=\"${(e: KeyboardEvent) =>\n handleGridKeydown(e, '.cal-cell-year', 4, () => {\n if (!cell.isDisabled) handleSelectYear(cell.year);\n })}\">\n ${String(cell.year)}\n </div>`,\n )}\n </div>`,\n );\n }}\n </div>\n </div>\n `;\n },\n\n shadow: { delegatesFocus: true },\n styles: [colorThemeMixin, reducedMotionMixin, componentStyles],\n});\n"],"mappings":"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"}
1
+ {"version":3,"file":"date-picker.js","names":[],"sources":["../src/inputs/date-picker/date-picker.ts"],"sourcesContent":["import { define, html, inject, prop, ref, bind, getHost, onMounted, useEmit } from '@vielzeug/ore';\nimport { useField } from '@vielzeug/ore/forms';\nimport { computed, signal } from '@vielzeug/ripple';\nimport { Temporal, format } from '@vielzeug/tempo';\n\nimport type { ComponentSize, RoundedSize, ThemeColor, VisualVariant } from '../../shared';\n\nimport {\n createDatePickerControl,\n createDropdownPositioner,\n formatDisplayDate,\n parseIso,\n toIsoString,\n type DatePickerView,\n} from '../../headless';\nimport '../../content/icon/icon';\nimport '../input/input';\nimport { disablableBundle, roundableBundle, sizableBundle, themableBundle } from '../../shared';\nimport { colorThemeMixin, reducedMotionMixin } from '../../styles';\nimport { FORM_CTX, useFormContext } from '../shared/form-context';\nimport componentStyles from './date-picker.css?inline';\n\n// ── Types ─────────────────────────────────────────────────────────────────────\n\nexport type OreDatePickerEvents = {\n change: { isoValue: string | null };\n};\n\nexport type OreDatePickerProps = {\n /** Theme color */\n color?: ThemeColor;\n /** Disable the picker */\n disabled?: boolean;\n /** Validation error message */\n error?: string;\n /** Expand to container width */\n fullwidth?: boolean;\n /** Helper text below the field */\n helper?: string;\n /** Visible label */\n label?: string;\n /** Label placement */\n 'label-placement'?: 'inset' | 'outside';\n /** Locale for day/month names (default: browser locale) */\n locale?: string;\n /** Latest selectable date in ISO 8601 format (yyyy-MM-dd) */\n max?: string;\n /** Earliest selectable date in ISO 8601 format (yyyy-MM-dd) */\n min?: string;\n /** Form field name */\n name?: string;\n /** Placeholder shown in the text trigger */\n placeholder?: string;\n /** Mark field as required */\n required?: boolean;\n /** Border radius */\n rounded?: RoundedSize;\n /** Component size */\n size?: ComponentSize;\n /**\n * Selected date in ISO 8601 format (yyyy-MM-dd).\n * @example '2025-06-15'\n */\n value?: string;\n /** Visual variant */\n variant?: Exclude<VisualVariant, 'text' | 'frost'>;\n /**\n * Day-of-week indices to disable (0 = Sunday … 6 = Saturday).\n * Pass as a JSON array attribute or a JS property.\n * @example\n * ```html\n * <ore-date-picker weekend-days=\"[0,6]\"></ore-date-picker>\n * ```\n */\n 'weekend-days'?: number[];\n};\n\n/**\n * An accessible, keyboard-navigable date picker with an inline calendar popup.\n * Supports min/max bounds, disabled weekend days, and form association.\n *\n * @element ore-date-picker\n *\n * @attr {string} value - Selected date in ISO 8601 format (yyyy-MM-dd)\n * @attr {string} min - Minimum selectable date (yyyy-MM-dd)\n * @attr {string} max - Maximum selectable date (yyyy-MM-dd)\n * @attr {string} label - Label text\n * @attr {string} label-placement - 'inset' | 'outside'\n * @attr {string} placeholder - Trigger placeholder\n * @attr {boolean} disabled - Disable the picker\n * @attr {boolean} required - Required field\n * @attr {string} name - Form field name\n * @attr {string} error - Error message\n * @attr {string} helper - Helper text\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} size - Component size: 'sm' | 'md' | 'lg'\n * @attr {string} variant - Visual variant: 'solid' | 'flat' | 'bordered' | 'outline' | 'ghost'\n * @attr {string} rounded - Border radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'\n * @attr {string} locale - BCP 47 locale string\n * @attr {string} weekend-days - Comma-separated day indices to disable\n *\n * @fires change - Fired when a date is selected. detail: { isoValue: string | null }\n *\n * @slot label - Custom label for the trigger field\n * @slot prefix - Content before the trigger text (e.g. icon)\n * @slot helper - Custom helper text\n * @slot error - Custom error content\n *\n * @cssprop --date-picker-bg - Calendar background\n * @cssprop --date-picker-border-color - Calendar border color\n * @cssprop --date-picker-radius - Calendar border radius\n * @cssprop --date-picker-day-selected-bg - Background of selected day\n * @cssprop --date-picker-day-today-color - Color of today's date number\n * @cssprop --date-picker-day-outside-opacity - Opacity of days outside visible month\n *\n * @part field - The trigger button/field\n * @part calendar - The floating calendar panel\n * @part header - Calendar header (nav + label)\n * @part grid - Day grid\n * @part day - Individual day cell\n *\n * @example\n * ```html\n * <!-- Single date with constraints -->\n * <ore-date-picker label=\"Appointment date\" name=\"date\" min=\"2025-01-01\" max=\"2025-12-31\" color=\"primary\"></ore-date-picker>\n *\n *\n * <!-- Outside label, bordered variant -->\n * <ore-date-picker label=\"Start date\" label-placement=\"outside\" variant=\"bordered\"></ore-date-picker>\n * ```\n */\nexport const DATE_PICKER_TAG = 'ore-date-picker' as const;\n\ndefine<OreDatePickerProps>(DATE_PICKER_TAG, {\n formAssociated: true,\n props: {\n ...themableBundle,\n ...sizableBundle,\n ...disablableBundle,\n ...roundableBundle,\n error: prop.string(),\n fullwidth: prop.bool(false),\n helper: prop.string(),\n label: prop.string(),\n 'label-placement': prop.oneOf(['inset', 'outside'] as const, 'inset'),\n locale: prop.string(),\n max: prop.string(),\n min: prop.string(),\n name: prop.string(),\n placeholder: prop.string(),\n required: prop.bool(false),\n value: prop.string(),\n variant: prop.string<'flat' | 'solid' | 'bordered' | 'outline' | 'ghost'>(),\n 'weekend-days': prop.json([] as number[]),\n },\n\n setup(props) {\n const el = getHost();\n const emit = useEmit<OreDatePickerEvents>();\n\n // ── Signals ─────────────────────────────────────────────────────────────\n\n const isOpen = signal(false);\n\n // ── Selected date: local-override pattern ──────────────────────────────\n // localSelection holds a user-initiated pick (or undefined = no override).\n // selectedDate falls back to the value prop reactively — no setInterval needed.\n\n const localSelection = signal<Temporal.PlainDate | null | undefined>(undefined);\n\n const selectedDate = computed(() =>\n localSelection.value !== undefined ? localSelection.value : parseIso(props.value.value),\n );\n\n // ── Form context ────────────────────────────────────────────────────────\n\n const formCtx = inject(FORM_CTX);\n const fCtxProps = useFormContext(props, formCtx);\n\n const isDisabled = fCtxProps.disabled;\n const locale = computed(() => props.locale.value || (typeof navigator !== 'undefined' ? navigator.language : 'en'));\n\n // ── Date-picker control ─────────────────────────────────────────────────\n\n const ctrl = createDatePickerControl({\n get locale() {\n return locale.value;\n },\n get max() {\n return parseIso(props.max.value);\n },\n get min() {\n return parseIso(props.min.value);\n },\n onChange(date) {\n localSelection.value = date;\n isOpen.value = false;\n ctrl.setView('day');\n currentView.value = 'day';\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n emit('change', { isoValue: toIsoString(date) });\n },\n get value() {\n return selectedDate.value;\n },\n get weekendDays() {\n return props['weekend-days'].value ?? [];\n },\n });\n\n // ── Reactive display state ────────────────────────────────────────────\n // Three separate primitive signals — the proven pattern.\n\n const currentView = signal<DatePickerView>('day');\n const displayYear = signal(ctrl.displayYear());\n const displayMonth = signal(ctrl.displayMonth()); // 1-indexed (Temporal)\n\n // ── Form value (host is formAssociated) ──────────────────────────────────\n\n useField<string>({\n disabled: isDisabled,\n toFormValue: (v) => v || null,\n value: computed(() => toIsoString(selectedDate.value) ?? ''),\n });\n\n const dialogId = `date-picker-${Math.random().toString(36).slice(2, 9)}-calendar`;\n\n // ── Floating position ────────────────────────────────────────────────────\n // The old CSS-only `position: absolute; top: 100%` positioned the calendar relative to\n // the host box — fine until the host sits near a scroll/clip ancestor's edge (e.g. a form\n // grid inside a dialog), where the same absolute box also expands that ancestor's\n // *scrollable* overflow area even though it never changes the ancestor's own layout size,\n // which reads as \"the dialog got bigger\"/jumped. `createDropdownPositioner` — the same\n // Orbit-powered primitive `ore-select`'s dropdown already uses — positions via `fixed` +\n // computed `top`/`left`, auto-detecting both the nearest clipping ancestor (so flip/shift\n // keep the calendar within the dialog panel, not just the page viewport) and any ancestor\n // that establishes a containing block for `position: fixed` (a dialog panel's entrance\n // transition commonly leaves a permanent, if visually-identity, `transform` at rest) —\n // see `createDropdownPositioner`'s own `boundary`/`containingBlock` docs.\n const triggerRef = ref<HTMLElement>();\n const calendarRef = ref<HTMLElement>();\n\n const positioner = createDropdownPositioner({\n getFloating: () => calendarRef.value ?? null,\n getReference: () => triggerRef.value ?? null,\n matchWidth: false,\n offsetPx: 4,\n });\n\n let stopAutoUpdate: (() => void) | null = null;\n\n // ── Derived display values ───────────────────────────────────────────────\n\n const triggerText = computed(() => {\n if (selectedDate.value) return formatDisplayDate(selectedDate.value, locale.value);\n\n return props.placeholder.value || '';\n });\n\n const displayMonth_ = computed(() => {\n const d = Temporal.PlainDate.from({ day: 1, month: displayMonth.value, year: displayYear.value });\n\n return format(d, { intl: { month: 'long' }, locale: locale.value, tz: 'UTC' });\n });\n\n const displayYear_ = computed(() => String(displayYear.value));\n const displayLabel = computed(() => `${displayMonth_.value} ${displayYear_.value}`);\n\n const dayCells = computed(() => {\n void displayYear.value;\n void displayMonth.value;\n void selectedDate.value; // re-run when selection changes to refresh isSelected flags\n\n return ctrl.dayCells();\n });\n const monthCells = computed(() => {\n void displayYear.value;\n\n return ctrl.monthCells();\n });\n const yearCells = computed(() => {\n void displayYear.value;\n\n return ctrl.yearCells();\n });\n const weekdayLabels = computed(() => ctrl.weekdayLabels());\n const tabIndex = () => (isDisabled.value ? '-1' : '0');\n\n // ── Navigation handlers ──────────────────────────────────────────────────\n // In year/month views navigate by year; in day view navigate by month.\n\n function handlePrev(): void {\n if (currentView.value === 'day') ctrl.prevMonth();\n else ctrl.prevYear();\n\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n function handleNext(): void {\n if (currentView.value === 'day') ctrl.nextMonth();\n else ctrl.nextYear();\n\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n function handleHeaderClick(): void {\n const views: DatePickerView[] = ['day', 'month', 'year'];\n const next = views[(views.indexOf(currentView.value) + 1) % views.length];\n\n ctrl.setView(next);\n currentView.value = next;\n }\n\n function handleSelectMonth(month: number): void {\n ctrl.goTo(ctrl.displayYear(), month);\n ctrl.setView('day');\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n currentView.value = 'day';\n }\n\n function handleSelectYear(year: number): void {\n ctrl.goTo(year, ctrl.displayMonth());\n ctrl.setView('month');\n displayYear.value = ctrl.displayYear();\n currentView.value = 'month';\n }\n\n function handleSelectDay(isoStr: string): void {\n const date = parseIso(isoStr);\n\n if (!date) return;\n\n ctrl.select(date);\n }\n\n function handleDayKeydown(e: KeyboardEvent): void {\n const cell = e.currentTarget as HTMLElement;\n const grid = cell.closest('.cal-grid-days');\n\n if (!grid) return;\n\n const allCells = Array.from(grid.querySelectorAll<HTMLElement>('.cal-cell-day'));\n const idx = allCells.indexOf(cell);\n\n if (idx === -1) return;\n\n let target: HTMLElement | undefined;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleSelectDay(cell.dataset.iso ?? '');\n\n return;\n } else if (e.key === 'ArrowRight') {\n target = allCells[idx + 1];\n } else if (e.key === 'ArrowLeft') {\n target = allCells[idx - 1];\n } else if (e.key === 'ArrowDown') {\n target = allCells[idx + 7];\n } else if (e.key === 'ArrowUp') {\n target = allCells[idx - 7];\n } else if (e.key === 'Home') {\n target = allCells[Math.floor(idx / 7) * 7];\n } else if (e.key === 'End') {\n target = allCells[Math.floor(idx / 7) * 7 + 6];\n } else {\n return;\n }\n\n e.preventDefault();\n target?.focus();\n }\n\n // ── Month/year-cell keyboard navigation (fixed 4-column grid) ─────────────\n\n function handleGridKeydown(e: KeyboardEvent, cellSelector: string, columns: number, onSelect: () => void): void {\n const cell = e.currentTarget as HTMLElement;\n const grid = cell.closest('.cal-grid');\n\n if (!grid) return;\n\n const allCells = Array.from(grid.querySelectorAll<HTMLElement>(cellSelector));\n const idx = allCells.indexOf(cell);\n\n if (idx === -1) return;\n\n let target: HTMLElement | undefined;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n onSelect();\n\n return;\n } else if (e.key === 'ArrowRight') {\n target = allCells[idx + 1];\n } else if (e.key === 'ArrowLeft') {\n target = allCells[idx - 1];\n } else if (e.key === 'ArrowDown') {\n target = allCells[idx + columns];\n } else if (e.key === 'ArrowUp') {\n target = allCells[idx - columns];\n } else if (e.key === 'Home') {\n target = allCells[Math.floor(idx / columns) * columns];\n } else if (e.key === 'End') {\n target = allCells[Math.min(Math.floor(idx / columns) * columns + columns - 1, allCells.length - 1)];\n } else {\n return;\n }\n\n e.preventDefault();\n target?.focus();\n }\n\n // ── Open / close ─────────────────────────────────────────────────────────\n\n function openPicker(): void {\n if (isDisabled.value) return;\n\n isOpen.value = true;\n ctrl.setView('day');\n currentView.value = 'day';\n\n const sel = selectedDate.value;\n\n if (sel) {\n ctrl.goTo(sel.year, sel.month);\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n positioner.update();\n stopAutoUpdate = positioner.startAutoUpdate?.() ?? null;\n }\n\n function closePicker(): void {\n isOpen.value = false;\n ctrl.setView('day');\n currentView.value = 'day';\n stopAutoUpdate?.();\n stopAutoUpdate = null;\n }\n\n function handleTriggerClick(): void {\n if (isOpen.value) closePicker();\n else openPicker();\n }\n\n // ── Keyboard handlers ────────────────────────────────────────────────────\n\n function handleTriggerKeydown(e: KeyboardEvent): void {\n if (isDisabled.value) return;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleTriggerClick();\n } else if (e.key === 'Escape' && isOpen.value) {\n e.preventDefault();\n closePicker();\n }\n }\n\n function handleCalendarKeydown(e: KeyboardEvent): void {\n if (e.key === 'Escape') {\n e.preventDefault();\n closePicker();\n }\n }\n\n function handleOutsideClick(e: PointerEvent | MouseEvent): void {\n if (!isOpen.value) return;\n\n const path = e.composedPath();\n\n if (!path.includes(el)) closePicker();\n }\n\n // ── Lifecycle ────────────────────────────────────────────────────────────\n\n onMounted(() => {\n document.addEventListener('pointerdown', handleOutsideClick, { capture: true });\n\n return () => {\n document.removeEventListener('pointerdown', handleOutsideClick, { capture: true });\n stopAutoUpdate?.();\n stopAutoUpdate = null;\n };\n });\n\n // ── Host bindings ────────────────────────────────────────────────────────\n\n bind({\n attr: {\n open: () => (isOpen.value ? true : undefined),\n },\n });\n\n // ── Template ─────────────────────────────────────────────────────────────\n\n const inputValue = () => triggerText.value;\n const inputLabel = () => props.label.value ?? '';\n const inputPlaceholder = () => props.placeholder.value ?? '';\n const inputLabelPlacement = () => props['label-placement'].value ?? 'inset';\n const inputColor = () => props.color?.value ?? undefined;\n const inputSize = () => fCtxProps.size?.value ?? undefined;\n const inputVariant = () => fCtxProps.variant?.value ?? undefined;\n const inputRounded = () => props.rounded?.value ?? undefined;\n const inputHelper = () => props.helper.value ?? '';\n const inputError = () => props.error.value ?? '';\n const inputDisabled = () => (isDisabled.value ? true : undefined);\n const inputRequired = () => (props.required.value ? true : undefined);\n const inputFullwidth = () => (props.fullwidth.value ? true : undefined);\n\n return html`\n <!-- Trigger: ore-input in readonly display mode -->\n <ore-input\n class=\"trigger\"\n ref=\"${triggerRef}\"\n readonly\n tabindex=\"${tabIndex}\"\n role=\"combobox\"\n aria-haspopup=\"dialog\"\n aria-controls=\"${dialogId}\"\n :aria-expanded=\"${() => String(isOpen.value)}\"\n :aria-disabled=\"${() => (isDisabled.value ? 'true' : null)}\"\n :value=\"${inputValue}\"\n :label=\"${inputLabel}\"\n :placeholder=\"${inputPlaceholder}\"\n :label-placement=\"${inputLabelPlacement}\"\n :color=\"${inputColor}\"\n :size=\"${inputSize}\"\n :variant=\"${inputVariant}\"\n :rounded=\"${inputRounded}\"\n :helper=\"${inputHelper}\"\n :error=\"${inputError}\"\n ?disabled=\"${inputDisabled}\"\n ?required=\"${inputRequired}\"\n ?fullwidth=\"${inputFullwidth}\"\n @click=\"${handleTriggerClick}\"\n @keydown=\"${handleTriggerKeydown}\">\n <ore-icon slot=\"suffix\" name=\"calendar\" size=\"16\" stroke-width=\"1.75\" aria-hidden=\"true\"></ore-icon>\n </ore-input>\n\n <!-- Calendar popup -->\n <div\n class=\"calendar\"\n ref=\"${calendarRef}\"\n id=\"${dialogId}\"\n role=\"dialog\"\n aria-modal=\"true\"\n :aria-label=\"${() => `Choose date — ${displayLabel.value}`}\"\n ?data-open=\"${isOpen}\"\n @keydown=\"${handleCalendarKeydown}\">\n <!-- Calendar header -->\n <div class=\"cal-header\" part=\"header\">\n <button class=\"nav-btn\" type=\"button\" aria-label=\"Previous\" @click=\"${handlePrev}\">\n <ore-icon name=\"chevron-left\" size=\"16\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n </button>\n <button\n class=\"cal-label-btn\"\n type=\"button\"\n :aria-label=\"${() =>\n `Switch to ${currentView.value === 'day' ? 'month' : currentView.value === 'month' ? 'year' : 'day'} view`}\"\n @click=\"${handleHeaderClick}\">\n <span class=\"cal-label-month\">${displayMonth_}</span><span class=\"cal-label-sep\" aria-hidden=\"true\">/</span\n ><span class=\"cal-label-year\">${displayYear_}</span>\n </button>\n <button class=\"nav-btn\" type=\"button\" aria-label=\"Next\" @click=\"${handleNext}\">\n <ore-icon name=\"chevron-right\" size=\"16\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n </button>\n </div>\n\n <!-- Day view: flat 7-column CSS grid, weekday headers + day cells -->\n <div\n class=\"cal-grid cal-grid-days\"\n role=\"grid\"\n part=\"grid\"\n :aria-label=\"${() => displayLabel.value}\"\n ?hidden=\"${() => currentView.value !== 'day'}\">\n <div role=\"row\" class=\"cal-grid-row\">\n ${() =>\n weekdayLabels.value.map(\n (lbl) => html`<div class=\"cal-cell cal-cell-head\" role=\"columnheader\" aria-label=\"${lbl}\">${lbl}</div>`,\n )}\n </div>\n ${() => {\n const cells = dayCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 7) rows.push(cells.slice(i, i + 7));\n\n return rows.map(\n (row) =>\n html`<div role=\"row\" class=\"cal-grid-row\">\n ${row.map(\n (cell) =>\n html`<div\n class=\"cal-cell cal-cell-day\"\n role=\"gridcell\"\n part=\"day\"\n :aria-selected=\"${() => String(cell.isSelected)}\"\n :aria-disabled=\"${() => String(cell.isDisabled)}\"\n :aria-current=\"${() => (cell.isToday ? 'date' : null)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-today=\"${() => cell.isToday}\"\n ?data-outside=\"${() => cell.isOutsideMonth}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n data-iso=\"${cell.iso}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => handleSelectDay(cell.iso)}\"\n @keydown=\"${handleDayKeydown}\">\n ${String(cell.day)}\n </div>`,\n )}\n </div>`,\n );\n }}\n </div>\n\n <!-- Month view -->\n <div\n class=\"cal-grid cal-grid-months\"\n role=\"grid\"\n :aria-label=\"${() => displayYear_.value}\"\n ?hidden=\"${() => currentView.value !== 'month'}\">\n ${() => {\n const cells = monthCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 4) rows.push(cells.slice(i, i + 4));\n\n return rows.map(\n (row) =>\n html`<div role=\"row\">\n ${row.map(\n (cell) =>\n html`<div\n class=\"cal-cell cal-cell-month\"\n role=\"gridcell\"\n :aria-selected=\"${() => String(cell.isSelected)}\"\n :aria-disabled=\"${() => String(cell.isDisabled)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => {\n if (!cell.isDisabled) handleSelectMonth(cell.month);\n }}\"\n @keydown=\"${(e: KeyboardEvent) =>\n handleGridKeydown(e, '.cal-cell-month', 4, () => {\n if (!cell.isDisabled) handleSelectMonth(cell.month);\n })}\">\n ${cell.shortLabel}\n </div>`,\n )}\n </div>`,\n );\n }}\n </div>\n\n <!-- Year view -->\n <div\n class=\"cal-grid cal-grid-years\"\n role=\"grid\"\n aria-label=\"Select year\"\n ?hidden=\"${() => currentView.value !== 'year'}\">\n ${() => {\n const cells = yearCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 4) rows.push(cells.slice(i, i + 4));\n\n return rows.map(\n (row) =>\n html`<div role=\"row\">\n ${row.map(\n (cell) =>\n html`<div\n class=\"cal-cell cal-cell-year\"\n role=\"gridcell\"\n :aria-selected=\"${() => String(cell.isSelected)}\"\n :aria-disabled=\"${() => String(cell.isDisabled)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => {\n if (!cell.isDisabled) handleSelectYear(cell.year);\n }}\"\n @keydown=\"${(e: KeyboardEvent) =>\n handleGridKeydown(e, '.cal-cell-year', 4, () => {\n if (!cell.isDisabled) handleSelectYear(cell.year);\n })}\">\n ${String(cell.year)}\n </div>`,\n )}\n </div>`,\n );\n }}\n </div>\n </div>\n `;\n },\n\n shadow: { delegatesFocus: true },\n styles: [colorThemeMixin, reducedMotionMixin, componentStyles],\n});\n"],"mappings":"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"}
@@ -1,3 +1,4 @@
1
+ import '../alert/alert';
1
2
  import type { ComponentSize, RoundedSize, ThemeColor } from '../../types';
2
3
  export type OreToastEvents = {
3
4
  add: {
@@ -1 +1 @@
1
- {"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../../../src/feedback/toast/toast.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../../../src/feedback/toast/toast.ts"],"names":[],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- const e=require("./direction.cjs");let t=require("@vielzeug/orbit");var n=e=>e.endsWith(`-start`)?e.replace(`-start`,`-end`):e.endsWith(`-end`)?e.replace(`-end`,`-start`):e;function r({getDir:r,getFloating:i,getPlacement:a,getReference:o,matchWidth:s=!0,offsetPx:c=0,padding:l=6}){function u(){let t=a?.()??`bottom-start`;return(r?.()??e.elementDirection(o()))===`rtl`?n(t):t}function d(){let e=o(),n=i();if(!e||!n)return;let r=u(),a=(0,t.computePosition)(e,n,{middleware:[...c?[(0,t.offset)(c)]:[],(0,t.flip)({padding:l}),(0,t.shift)({padding:l}),...s?[(0,t.size)({padding:l})]:[]],placement:r});n.style.left=`${a.x}px`,n.style.top=`${a.y}px`,s&&(n.style.width=`${e.getBoundingClientRect().width}px`)}function f(){let e=o(),n=i();return!e||!n?()=>{}:(0,t.autoUpdate)(e,n,d)}return{floating:i,reference:o,startAutoUpdate:f,update:d}}exports.createDropdownPositioner=r;
1
+ const e=require("./direction.cjs");let t=require("@vielzeug/orbit");var n=e=>e.endsWith(`-start`)?e.replace(`-start`,`-end`):e.endsWith(`-end`)?e.replace(`-end`,`-start`):e;function r({boundary:r,getDir:i,getFloating:a,getPlacement:o,getReference:s,matchWidth:c=!0,offsetPx:l=0,padding:u=6}){function d(){let t=o?.()??`bottom-start`;return(i?.()??e.elementDirection(s()))===`rtl`?n(t):t}function f(){let e=s(),n=a();if(!e||!n)return;let i=d(),o=(0,t.computePosition)(e,n,{boundary:r??(0,t.getClippingAncestorRect)(n),middleware:[...l?[(0,t.offset)(l)]:[],(0,t.flip)({padding:u}),(0,t.shift)({padding:u}),...c?[(0,t.size)({padding:u})]:[]],placement:i});n.style.left=`${o.x}px`,n.style.top=`${o.y}px`;let f=n.style.transition,p=n.style.transform;n.style.transition=`none`,n.style.transform=`none`;let m=n.getBoundingClientRect(),h=o.x-m.left,g=o.y-m.top;n.style.transition=f,n.style.transform=p,(h!==0||g!==0)&&(n.style.left=`${o.x+h}px`,n.style.top=`${o.y+g}px`),c&&(n.style.width=`${e.getBoundingClientRect().width}px`)}function p(){let e=s(),n=a();return!e||!n?()=>{}:(0,t.autoUpdate)(e,n,f)}return{floating:a,reference:s,startAutoUpdate:p,update:f}}exports.createDropdownPositioner=r;
2
2
  //# sourceMappingURL=positioner.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"positioner.cjs","names":[],"sources":["../../src/headless/positioner.ts"],"sourcesContent":["import { autoUpdate, computePosition, flip, offset, type Placement, shift, size } from '@vielzeug/orbit';\n\nimport { elementDirection } from './direction';\n\n// ── Overlay positioner contract ──────────────────────────────────────────────\n\nexport type OverlayPositioner = {\n floating: () => HTMLElement | null;\n reference: () => HTMLElement | null;\n /** Start continuous position auto-updates. Returns a stop function. */\n startAutoUpdate?: () => () => void;\n update: () => void;\n};\n\n// ── Dropdown positioner ───────────────────────────────────────────────────────\n\nexport type DropdownPositionerOptions = {\n /**\n * Returns the text direction used for placement mirroring. Defaults to the resolved\n * direction of the reference element (nearest `dir=\"ltr\"|\"rtl\"` ancestor, falling back to\n * computed style) — most callers never need to pass this explicitly.\n */\n getDir?: () => 'ltr' | 'rtl';\n /** Getter for the floating (dropdown panel) element. */\n getFloating: () => HTMLElement | null;\n /** Getter for the current placement. Defaults to 'bottom-start' (RTL-aware: flips to 'bottom-end'). */\n getPlacement?: () => Placement;\n /** Getter for the reference (trigger) element. */\n getReference: () => HTMLElement | null;\n /** Whether to match the floating element width to the reference. Default: true */\n matchWidth?: boolean;\n /** Additional offset in pixels between reference and floating element. Default: 0 */\n offsetPx?: number;\n /** Padding (px) used by flip, shift, and size middleware. Default: 6 */\n padding?: number;\n};\n\n/** Mirrors a start/end placement for RTL layouts. */\nconst rtlPlacement = (p: Placement): Placement => {\n if (p.endsWith('-start')) return p.replace('-start', '-end') as Placement;\n\n if (p.endsWith('-end')) return p.replace('-end', '-start') as Placement;\n\n return p;\n};\n\n/**\n * Creates an Orbit-powered positioner for dropdown overlays (select, combobox, menu).\n *\n * Uses flip + shift + optional width-matching middleware. Supports continuous\n * auto-update for repositioning on scroll or resize.\n *\n * RTL-aware: start/end placements are automatically mirrored so dropdowns open on the\n * correct side, based on `getDir` (or the reference element's resolved direction when\n * `getDir` is omitted).\n */\nexport function createDropdownPositioner({\n getDir,\n getFloating,\n getPlacement,\n getReference,\n matchWidth = true,\n offsetPx = 0,\n padding = 6,\n}: DropdownPositionerOptions): OverlayPositioner {\n function resolvedPlacement(): Placement {\n const base = getPlacement?.() ?? 'bottom-start';\n const dir = getDir?.() ?? elementDirection(getReference());\n\n return dir === 'rtl' ? rtlPlacement(base) : base;\n }\n\n function updatePosition(): void {\n const ref = getReference();\n const floating = getFloating();\n\n if (!ref || !floating) return;\n\n const placement = resolvedPlacement();\n\n const result = computePosition(ref, floating, {\n middleware: [\n ...(offsetPx ? [offset(offsetPx)] : []),\n flip({ padding }),\n shift({ padding }),\n ...(matchWidth ? [size({ padding })] : []),\n ],\n placement,\n });\n\n floating.style.left = `${result.x}px`;\n floating.style.top = `${result.y}px`;\n\n if (matchWidth) {\n floating.style.width = `${ref.getBoundingClientRect().width}px`;\n }\n }\n\n function startAutoUpdate(): () => void {\n const ref = getReference();\n const floating = getFloating();\n\n if (!ref || !floating) return () => {};\n\n return autoUpdate(ref, floating, updatePosition);\n }\n\n return { floating: getFloating, reference: getReference, startAutoUpdate, update: updatePosition };\n}\n"],"mappings":"oEAsCA,IAAM,EAAgB,GAChB,EAAE,SAAS,QAAQ,EAAU,EAAE,QAAQ,SAAU,MAAM,EAEvD,EAAE,SAAS,MAAM,EAAU,EAAE,QAAQ,OAAQ,QAAQ,EAElD,EAaT,SAAgB,EAAyB,CACvC,SACA,cACA,eACA,eACA,aAAa,GACb,WAAW,EACX,UAAU,GACqC,CAC/C,SAAS,GAA+B,CACtC,IAAM,EAAO,IAAe,GAAK,eAGjC,OAFY,IAAS,GAAK,EAAA,iBAAiB,EAAa,CAAC,KAE1C,MAAQ,EAAa,CAAI,EAAI,CAC9C,CAEA,SAAS,GAAuB,CAC9B,IAAM,EAAM,EAAa,EACnB,EAAW,EAAY,EAE7B,GAAI,CAAC,GAAO,CAAC,EAAU,OAEvB,IAAM,EAAY,EAAkB,EAE9B,GAAA,EAAA,EAAA,gBAAA,CAAyB,EAAK,EAAU,CAC5C,WAAY,CACV,GAAI,EAAW,EAAA,EAAA,EAAA,OAAA,CAAQ,CAAQ,CAAC,EAAI,CAAC,aAChC,CAAE,SAAQ,CAAC,cACV,CAAE,SAAQ,CAAC,EACjB,GAAI,EAAa,EAAA,EAAA,EAAA,KAAA,CAAM,CAAE,SAAQ,CAAC,CAAC,EAAI,CAAC,CAC1C,EACA,WACF,CAAC,EAED,EAAS,MAAM,KAAO,GAAG,EAAO,EAAE,IAClC,EAAS,MAAM,IAAM,GAAG,EAAO,EAAE,IAE7B,IACF,EAAS,MAAM,MAAQ,GAAG,EAAI,sBAAsB,CAAC,CAAC,MAAM,IAEhE,CAEA,SAAS,GAA8B,CACrC,IAAM,EAAM,EAAa,EACnB,EAAW,EAAY,EAI7B,MAFI,CAAC,GAAO,CAAC,MAAuB,CAAC,GAErC,EAAA,EAAA,WAAA,CAAkB,EAAK,EAAU,CAAc,CACjD,CAEA,MAAO,CAAE,SAAU,EAAa,UAAW,EAAc,kBAAiB,OAAQ,CAAe,CACnG"}
1
+ {"version":3,"file":"positioner.cjs","names":[],"sources":["../../src/headless/positioner.ts"],"sourcesContent":["import {\n autoUpdate,\n computePosition,\n flip,\n getClippingAncestorRect,\n offset,\n type Placement,\n type Rect,\n shift,\n size,\n} from '@vielzeug/orbit';\n\nimport { elementDirection } from './direction';\n\n// ── Overlay positioner contract ──────────────────────────────────────────────\n\nexport type OverlayPositioner = {\n floating: () => HTMLElement | null;\n reference: () => HTMLElement | null;\n /** Start continuous position auto-updates. Returns a stop function. */\n startAutoUpdate?: () => () => void;\n update: () => void;\n};\n\n// ── Dropdown positioner ───────────────────────────────────────────────────────\n\nexport type DropdownPositionerOptions = {\n /**\n * Clipping boundary for flip/shift/size — the edges the dropdown must stay within.\n * Defaults to the nearest ancestor that actually clips content (`overflow:\n * hidden|auto|scroll|clip`, e.g. a dialog panel), auto-detected per update via\n * `getClippingAncestorRect()`, intersected with the viewport. Without this, flip/shift only\n * avoid the full page viewport — a dropdown can be \"in view\" by that measure while still\n * visibly overhanging a much smaller container it's actually nested in. Pass an explicit\n * boundary to override auto-detection.\n */\n boundary?: Element | Rect;\n /**\n * Returns the text direction used for placement mirroring. Defaults to the resolved\n * direction of the reference element (nearest `dir=\"ltr\"|\"rtl\"` ancestor, falling back to\n * computed style) — most callers never need to pass this explicitly.\n */\n getDir?: () => 'ltr' | 'rtl';\n /** Getter for the floating (dropdown panel) element. */\n getFloating: () => HTMLElement | null;\n /** Getter for the current placement. Defaults to 'bottom-start' (RTL-aware: flips to 'bottom-end'). */\n getPlacement?: () => Placement;\n /** Getter for the reference (trigger) element. */\n getReference: () => HTMLElement | null;\n /** Whether to match the floating element width to the reference. Default: true */\n matchWidth?: boolean;\n /** Additional offset in pixels between reference and floating element. Default: 0 */\n offsetPx?: number;\n /** Padding (px) used by flip, shift, and size middleware. Default: 6 */\n padding?: number;\n};\n\n/** Mirrors a start/end placement for RTL layouts. */\nconst rtlPlacement = (p: Placement): Placement => {\n if (p.endsWith('-start')) return p.replace('-start', '-end') as Placement;\n\n if (p.endsWith('-end')) return p.replace('-end', '-start') as Placement;\n\n return p;\n};\n\n/**\n * Creates an Orbit-powered positioner for dropdown overlays (select, combobox, menu).\n *\n * Uses flip + shift + optional width-matching middleware. Supports continuous\n * auto-update for repositioning on scroll or resize.\n *\n * RTL-aware: start/end placements are automatically mirrored so dropdowns open on the\n * correct side, based on `getDir` (or the reference element's resolved direction when\n * `getDir` is omitted).\n */\nexport function createDropdownPositioner({\n boundary,\n getDir,\n getFloating,\n getPlacement,\n getReference,\n matchWidth = true,\n offsetPx = 0,\n padding = 6,\n}: DropdownPositionerOptions): OverlayPositioner {\n function resolvedPlacement(): Placement {\n const base = getPlacement?.() ?? 'bottom-start';\n const dir = getDir?.() ?? elementDirection(getReference());\n\n return dir === 'rtl' ? rtlPlacement(base) : base;\n }\n\n function updatePosition(): void {\n const ref = getReference();\n const floating = getFloating();\n\n if (!ref || !floating) return;\n\n const placement = resolvedPlacement();\n // Defaults to `undefined` (meaning \"auto-detect\"), not the detected value itself —\n // re-running the detection on every update (rather than once, at positioner-creation time)\n // matters because the dialog/scroll-container an instance is rendered into can change\n // across opens (e.g. the same `<ore-select>` reused in different dialogs), and the detected\n // ancestor's own rect can change between opens even when it's the same element (a resized\n // dialog).\n const resolvedBoundary = boundary ?? getClippingAncestorRect(floating);\n\n const result = computePosition(ref, floating, {\n boundary: resolvedBoundary,\n middleware: [\n ...(offsetPx ? [offset(offsetPx)] : []),\n flip({ padding }),\n shift({ padding }),\n ...(matchWidth ? [size({ padding })] : []),\n ],\n placement,\n });\n\n floating.style.left = `${result.x}px`;\n floating.style.top = `${result.y}px`;\n\n // `computePosition()` assumes `left`/`top` resolve relative to the viewport (correct for\n // `position: fixed`) — true almost always, but not when some ancestor establishes a\n // containing block for fixed descendants (a non-`none` `transform`, even a visually-identity\n // one left over from an entrance transition that never resets to `none` at rest is a real,\n // easy-to-hit case — a modal dialog's panel, say). Analytically detecting *that* ancestor via\n // `getContainingBlock()` and pre-subtracting its rect turned out to be unreliable in\n // practice: browsers don't apply the \"ancestor transform traps fixed descendants\" rule\n // uniformly across every element nested under it in every case we tested — some floating\n // elements in the exact same subtree needed the correction and some didn't, for reasons we\n // couldn't fully pin down. Measuring what actually happened after writing `left`/`top`\n // and correcting only the observed gap sidesteps that: it's a no-op when the browser already\n // put the element where asked, and it fixes the same class of bug the moment there's a real\n // mismatch, regardless of which specific ancestor (if any) turns out to be responsible.\n //\n // The measurement itself must not be fooled by the floating element's *own* transform,\n // though: dropdowns/popovers here all use a `transform: translateY(...)` entrance transition\n // driven by a `[data-open]` attribute + `@starting-style` — right at open, before the\n // transition has visibly progressed, `getBoundingClientRect()` can still reflect that\n // starting offset (a handful of px, matching `--overlay-enter-translate-y`), which this\n // correction would otherwise misread as a permanent ancestor-driven mismatch and bake in\n // forever. Temporarily neutralizing the floating element's own transform for the measurement\n // (and restoring it before anything paints, so there's no visible flash) isolates the\n // correction to ancestor-driven offsets only, which is the only thing it's meant to fix.\n const prevTransition = floating.style.transition;\n const prevTransform = floating.style.transform;\n\n floating.style.transition = 'none';\n floating.style.transform = 'none';\n\n const actual = floating.getBoundingClientRect();\n const deltaX = result.x - actual.left;\n const deltaY = result.y - actual.top;\n\n floating.style.transition = prevTransition;\n floating.style.transform = prevTransform;\n\n if (deltaX !== 0 || deltaY !== 0) {\n floating.style.left = `${result.x + deltaX}px`;\n floating.style.top = `${result.y + deltaY}px`;\n }\n\n if (matchWidth) {\n floating.style.width = `${ref.getBoundingClientRect().width}px`;\n }\n }\n\n function startAutoUpdate(): () => void {\n const ref = getReference();\n const floating = getFloating();\n\n if (!ref || !floating) return () => {};\n\n return autoUpdate(ref, floating, updatePosition);\n }\n\n return { floating: getFloating, reference: getReference, startAutoUpdate, update: updatePosition };\n}\n"],"mappings":"oEA0DA,IAAM,EAAgB,GAChB,EAAE,SAAS,QAAQ,EAAU,EAAE,QAAQ,SAAU,MAAM,EAEvD,EAAE,SAAS,MAAM,EAAU,EAAE,QAAQ,OAAQ,QAAQ,EAElD,EAaT,SAAgB,EAAyB,CACvC,WACA,SACA,cACA,eACA,eACA,aAAa,GACb,WAAW,EACX,UAAU,GACqC,CAC/C,SAAS,GAA+B,CACtC,IAAM,EAAO,IAAe,GAAK,eAGjC,OAFY,IAAS,GAAK,EAAA,iBAAiB,EAAa,CAAC,KAE1C,MAAQ,EAAa,CAAI,EAAI,CAC9C,CAEA,SAAS,GAAuB,CAC9B,IAAM,EAAM,EAAa,EACnB,EAAW,EAAY,EAE7B,GAAI,CAAC,GAAO,CAAC,EAAU,OAEvB,IAAM,EAAY,EAAkB,EAS9B,GAAA,EAAA,EAAA,gBAAA,CAAyB,EAAK,EAAU,CAC5C,SAHuB,IAAA,EAAA,EAAA,wBAAA,CAAoC,CAAQ,EAInE,WAAY,CACV,GAAI,EAAW,EAAA,EAAA,EAAA,OAAA,CAAQ,CAAQ,CAAC,EAAI,CAAC,aAChC,CAAE,SAAQ,CAAC,cACV,CAAE,SAAQ,CAAC,EACjB,GAAI,EAAa,EAAA,EAAA,EAAA,KAAA,CAAM,CAAE,SAAQ,CAAC,CAAC,EAAI,CAAC,CAC1C,EACA,WACF,CAAC,EAED,EAAS,MAAM,KAAO,GAAG,EAAO,EAAE,IAClC,EAAS,MAAM,IAAM,GAAG,EAAO,EAAE,IAyBjC,IAAM,EAAiB,EAAS,MAAM,WAChC,EAAgB,EAAS,MAAM,UAErC,EAAS,MAAM,WAAa,OAC5B,EAAS,MAAM,UAAY,OAE3B,IAAM,EAAS,EAAS,sBAAsB,EACxC,EAAS,EAAO,EAAI,EAAO,KAC3B,EAAS,EAAO,EAAI,EAAO,IAEjC,EAAS,MAAM,WAAa,EAC5B,EAAS,MAAM,UAAY,GAEvB,IAAW,GAAK,IAAW,KAC7B,EAAS,MAAM,KAAO,GAAG,EAAO,EAAI,EAAO,IAC3C,EAAS,MAAM,IAAM,GAAG,EAAO,EAAI,EAAO,KAGxC,IACF,EAAS,MAAM,MAAQ,GAAG,EAAI,sBAAsB,CAAC,CAAC,MAAM,IAEhE,CAEA,SAAS,GAA8B,CACrC,IAAM,EAAM,EAAa,EACnB,EAAW,EAAY,EAI7B,MAFI,CAAC,GAAO,CAAC,MAAuB,CAAC,GAErC,EAAA,EAAA,WAAA,CAAkB,EAAK,EAAU,CAAc,CACjD,CAEA,MAAO,CAAE,SAAU,EAAa,UAAW,EAAc,kBAAiB,OAAQ,CAAe,CACnG"}