@zag-js/pin-input 0.0.0-dev-20230220134212 → 0.0.0-dev-20230222120620

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 (15) hide show
  1. package/dist/chunk-CPXMEVTH.mjs +23 -0
  2. package/dist/{chunk-VZQYAAIE.mjs → chunk-H5AVP4J4.mjs} +5 -43
  3. package/dist/{chunk-IGE2OJGQ.mjs → chunk-YP6JAJVN.mjs} +5 -63
  4. package/dist/index.js +34 -163
  5. package/dist/index.mjs +3 -4
  6. package/dist/pin-input.connect.js +23 -113
  7. package/dist/pin-input.connect.mjs +2 -3
  8. package/dist/pin-input.dom.d.ts +9 -6
  9. package/dist/pin-input.dom.js +3 -37
  10. package/dist/pin-input.dom.mjs +1 -1
  11. package/dist/pin-input.machine.js +13 -84
  12. package/dist/pin-input.machine.mjs +2 -3
  13. package/package.json +8 -6
  14. package/dist/chunk-NT4W6JYX.mjs +0 -7
  15. package/dist/chunk-Y7IZ6OAH.mjs +0 -59
package/dist/chunk-CPXMEVTH.mjs ADDED
@@ -0,0 +1,23 @@
1
+ // src/pin-input.dom.ts
2
+ import { createScope, queryAll } from "@zag-js/dom-query";
3
+ var dom = createScope({
4
+ getRootId: (ctx) => ctx.ids?.root ?? `pin-input:${ctx.id}`,
5
+ getInputId: (ctx, id) => ctx.ids?.input?.(id) ?? `pin-input:${ctx.id}:${id}`,
6
+ getHiddenInputId: (ctx) => ctx.ids?.hiddenInput ?? `pin-input:${ctx.id}:hidden`,
7
+ getLabelId: (ctx) => ctx.ids?.label ?? `pin-input:${ctx.id}:label`,
8
+ getControlId: (ctx) => ctx.ids?.control ?? `pin-input:${ctx.id}:control`,
9
+ getRootEl: (ctx) => dom.getById(ctx, dom.getRootId(ctx)),
10
+ getElements: (ctx) => {
11
+ const ownerId = CSS.escape(dom.getRootId(ctx));
12
+ const selector = `input[data-ownedby=${ownerId}]`;
13
+ return queryAll(dom.getRootEl(ctx), selector);
14
+ },
15
+ getInputEl: (ctx, id) => dom.getById(ctx, dom.getInputId(ctx, id)),
16
+ getFocusedInputEl: (ctx) => dom.getElements(ctx)[ctx.focusedIndex],
17
+ getFirstInputEl: (ctx) => dom.getElements(ctx)[0],
18
+ getHiddenInputEl: (ctx) => dom.getById(ctx, dom.getHiddenInputId(ctx))
19
+ });
20
+
21
+ export {
22
+ dom
23
+ };
package/dist/{chunk-VZQYAAIE.mjs → chunk-H5AVP4J4.mjs} RENAMED
@@ -1,50 +1,12 @@
1
1
  import {
2
- isObject
3
- } from "./chunk-NT4W6JYX.mjs";
4
- import {
5
- dom,
6
- getWindow
7
- } from "./chunk-Y7IZ6OAH.mjs";
2
+ dom
3
+ } from "./chunk-CPXMEVTH.mjs";
8
4
 
9
5
  // src/pin-input.machine.ts
10
6
  import { createMachine, guards } from "@zag-js/core";
11
-
12
- // ../../utilities/core/src/object.ts
13
- function compact(obj) {
14
- if (obj === void 0)
15
- return obj;
16
- return Object.fromEntries(
17
- Object.entries(obj).filter(([, value]) => value !== void 0).map(([key, value]) => [key, isObject(value) ? compact(value) : value])
18
- );
19
- }
20
-
21
- // ../../utilities/dom/src/next-tick.ts
22
- function raf(fn) {
23
- const id = globalThis.requestAnimationFrame(fn);
24
- return function cleanup() {
25
- globalThis.cancelAnimationFrame(id);
26
- };
27
- }
28
-
29
- // ../../utilities/form-utils/src/input-event.ts
30
- function getDescriptor(el, options) {
31
- const { type, property = "value" } = options;
32
- const proto = getWindow(el)[type].prototype;
33
- return Object.getOwnPropertyDescriptor(proto, property) ?? {};
34
- }
35
- function dispatchInputValueEvent(el, value) {
36
- if (!el)
37
- return;
38
- const win = getWindow(el);
39
- if (!(el instanceof win.HTMLInputElement))
40
- return;
41
- const desc = getDescriptor(el, { type: "HTMLInputElement", property: "value" });
42
- desc.set?.call(el, value);
43
- const event = new win.Event("input", { bubbles: true });
44
- el.dispatchEvent(event);
45
- }
46
-
47
- // src/pin-input.machine.ts
7
+ import { raf } from "@zag-js/dom-query";
8
+ import { dispatchInputValueEvent } from "@zag-js/form-utils";
9
+ import { compact } from "@zag-js/utils";
48
10
  var { and, not } = guards;
49
11
  function machine(userContext) {
50
12
  const ctx = compact(userContext);
package/dist/{chunk-IGE2OJGQ.mjs → chunk-YP6JAJVN.mjs} RENAMED
@@ -3,71 +3,13 @@ import {
3
3
  } from "./chunk-BJXKBZJG.mjs";
4
4
  import {
5
5
  dom
6
- } from "./chunk-Y7IZ6OAH.mjs";
7
-
8
- // ../../utilities/dom/src/attrs.ts
9
- var dataAttr = (guard) => {
10
- return guard ? "" : void 0;
11
- };
12
- var ariaAttr = (guard) => {
13
- return guard ? "true" : void 0;
14
- };
15
-
16
- // ../../utilities/core/src/warning.ts
17
- function invariant(...a) {
18
- const m = a.length === 1 ? a[0] : a[1];
19
- const c = a.length === 2 ? a[0] : true;
20
- if (c && process.env.NODE_ENV !== "production") {
21
- throw new Error(m);
22
- }
23
- }
24
-
25
- // ../../utilities/dom/src/event.ts
26
- function getNativeEvent(e) {
27
- return e.nativeEvent ?? e;
28
- }
29
- var isModifiedEvent = (v) => v.ctrlKey || v.altKey || v.metaKey;
30
-
31
- // ../../utilities/dom/src/keyboard-event.ts
32
- var rtlKeyMap = {
33
- ArrowLeft: "ArrowRight",
34
- ArrowRight: "ArrowLeft"
35
- };
36
- var sameKeyMap = {
37
- Up: "ArrowUp",
38
- Down: "ArrowDown",
39
- Esc: "Escape",
40
- " ": "Space",
41
- ",": "Comma",
42
- Left: "ArrowLeft",
43
- Right: "ArrowRight"
44
- };
45
- function getEventKey(event, options = {}) {
46
- const { dir = "ltr", orientation = "horizontal" } = options;
47
- let { key } = event;
48
- key = sameKeyMap[key] ?? key;
49
- const isRtl = dir === "rtl" && orientation === "horizontal";
50
- if (isRtl && key in rtlKeyMap) {
51
- key = rtlKeyMap[key];
52
- }
53
- return key;
54
- }
55
-
56
- // ../../utilities/dom/src/visually-hidden.ts
57
- var visuallyHiddenStyle = {
58
- border: "0",
59
- clip: "rect(0 0 0 0)",
60
- height: "1px",
61
- margin: "-1px",
62
- overflow: "hidden",
63
- padding: "0",
64
- position: "absolute",
65
- width: "1px",
66
- whiteSpace: "nowrap",
67
- wordWrap: "normal"
68
- };
6
+ } from "./chunk-CPXMEVTH.mjs";
69
7
 
70
8
  // src/pin-input.connect.ts
9
+ import { getEventKey, getNativeEvent, isModifiedEvent } from "@zag-js/dom-event";
10
+ import { ariaAttr, dataAttr } from "@zag-js/dom-query";
11
+ import { invariant } from "@zag-js/utils";
12
+ import { visuallyHiddenStyle } from "@zag-js/visually-hidden";
71
13
  function connect(state, send, normalize) {
72
14
  const isValueComplete = state.context.isValueComplete;
73
15
  const isInvalid = state.context.invalid;
package/dist/index.js CHANGED
@@ -31,127 +31,15 @@ var import_anatomy = require("@zag-js/anatomy");
31
31
  var anatomy = (0, import_anatomy.createAnatomy)("pinInput").parts("root", "label", "hiddenInput", "input", "control");
32
32
  var parts = anatomy.build();
33
33
 
34
- // ../../utilities/dom/src/attrs.ts
35
- var dataAttr = (guard) => {
36
- return guard ? "" : void 0;
37
- };
38
- var ariaAttr = (guard) => {
39
- return guard ? "true" : void 0;
40
- };
41
-
42
- // ../../utilities/core/src/guard.ts
43
- var isArray = (v) => Array.isArray(v);
44
- var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
45
-
46
- // ../../utilities/core/src/object.ts
47
- function compact(obj) {
48
- if (obj === void 0)
49
- return obj;
50
- return Object.fromEntries(
51
- Object.entries(obj).filter(([, value]) => value !== void 0).map(([key, value]) => [key, isObject(value) ? compact(value) : value])
52
- );
53
- }
54
-
55
- // ../../utilities/core/src/warning.ts
56
- function invariant(...a) {
57
- const m = a.length === 1 ? a[0] : a[1];
58
- const c = a.length === 2 ? a[0] : true;
59
- if (c && process.env.NODE_ENV !== "production") {
60
- throw new Error(m);
61
- }
62
- }
63
-
64
- // ../../utilities/dom/src/query.ts
65
- function isDocument(el) {
66
- return el.nodeType === Node.DOCUMENT_NODE;
67
- }
68
- function isWindow(value) {
69
- return value?.toString() === "[object Window]";
70
- }
71
- function getDocument(el) {
72
- if (isWindow(el))
73
- return el.document;
74
- if (isDocument(el))
75
- return el;
76
- return el?.ownerDocument ?? document;
77
- }
78
- function getWindow(el) {
79
- return el?.ownerDocument.defaultView ?? window;
80
- }
81
- function defineDomHelpers(helpers) {
82
- const dom2 = {
83
- getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
84
- getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
85
- getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
86
- getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
87
- getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
88
- };
89
- return {
90
- ...dom2,
91
- ...helpers
92
- };
93
- }
94
-
95
- // ../../utilities/dom/src/event.ts
96
- function getNativeEvent(e) {
97
- return e.nativeEvent ?? e;
98
- }
99
- var isModifiedEvent = (v) => v.ctrlKey || v.altKey || v.metaKey;
100
-
101
- // ../../utilities/dom/src/keyboard-event.ts
102
- var rtlKeyMap = {
103
- ArrowLeft: "ArrowRight",
104
- ArrowRight: "ArrowLeft"
105
- };
106
- var sameKeyMap = {
107
- Up: "ArrowUp",
108
- Down: "ArrowDown",
109
- Esc: "Escape",
110
- " ": "Space",
111
- ",": "Comma",
112
- Left: "ArrowLeft",
113
- Right: "ArrowRight"
114
- };
115
- function getEventKey(event, options = {}) {
116
- const { dir = "ltr", orientation = "horizontal" } = options;
117
- let { key } = event;
118
- key = sameKeyMap[key] ?? key;
119
- const isRtl = dir === "rtl" && orientation === "horizontal";
120
- if (isRtl && key in rtlKeyMap) {
121
- key = rtlKeyMap[key];
122
- }
123
- return key;
124
- }
125
-
126
- // ../../utilities/dom/src/next-tick.ts
127
- function raf(fn) {
128
- const id = globalThis.requestAnimationFrame(fn);
129
- return function cleanup() {
130
- globalThis.cancelAnimationFrame(id);
131
- };
132
- }
133
-
134
- // ../../utilities/dom/src/nodelist.ts
135
- function queryAll(root, selector) {
136
- return Array.from(root?.querySelectorAll(selector) ?? []);
137
- }
138
-
139
- // ../../utilities/dom/src/visually-hidden.ts
140
- var visuallyHiddenStyle = {
141
- border: "0",
142
- clip: "rect(0 0 0 0)",
143
- height: "1px",
144
- margin: "-1px",
145
- overflow: "hidden",
146
- padding: "0",
147
- position: "absolute",
148
- width: "1px",
149
- whiteSpace: "nowrap",
150
- wordWrap: "normal"
151
- };
34
+ // src/pin-input.connect.ts
35
+ var import_dom_event = require("@zag-js/dom-event");
36
+ var import_dom_query2 = require("@zag-js/dom-query");
37
+ var import_utils = require("@zag-js/utils");
38
+ var import_visually_hidden = require("@zag-js/visually-hidden");
152
39
 
153
40
  // src/pin-input.dom.ts
154
- var dom = defineDomHelpers({
41
+ var import_dom_query = require("@zag-js/dom-query");
42
+ var dom = (0, import_dom_query.createScope)({
155
43
  getRootId: (ctx) => ctx.ids?.root ?? `pin-input:${ctx.id}`,
156
44
  getInputId: (ctx, id) => ctx.ids?.input?.(id) ?? `pin-input:${ctx.id}:${id}`,
157
45
  getHiddenInputId: (ctx) => ctx.ids?.hiddenInput ?? `pin-input:${ctx.id}:hidden`,
@@ -161,7 +49,7 @@ var dom = defineDomHelpers({
161
49
  getElements: (ctx) => {
162
50
  const ownerId = CSS.escape(dom.getRootId(ctx));
163
51
  const selector = `input[data-ownedby=${ownerId}]`;
164
- return queryAll(dom.getRootEl(ctx), selector);
52
+ return (0, import_dom_query.queryAll)(dom.getRootEl(ctx), selector);
165
53
  },
166
54
  getInputEl: (ctx, id) => dom.getById(ctx, dom.getInputId(ctx, id)),
167
55
  getFocusedInputEl: (ctx) => dom.getElements(ctx)[ctx.focusedIndex],
@@ -184,7 +72,7 @@ function connect(state, send, normalize) {
184
72
  isValueComplete,
185
73
  setValue(value) {
186
74
  if (!Array.isArray(value)) {
187
- invariant("[pin-input/setValue] value must be an array");
75
+ (0, import_utils.invariant)("[pin-input/setValue] value must be an array");
188
76
  }
189
77
  send({ type: "SET_VALUE", value });
190
78
  },
@@ -199,17 +87,17 @@ function connect(state, send, normalize) {
199
87
  dir: state.context.dir,
200
88
  ...parts.root.attrs,
201
89
  id: dom.getRootId(state.context),
202
- "data-invalid": dataAttr(isInvalid),
203
- "data-disabled": dataAttr(state.context.disabled),
204
- "data-complete": dataAttr(isValueComplete)
90
+ "data-invalid": (0, import_dom_query2.dataAttr)(isInvalid),
91
+ "data-disabled": (0, import_dom_query2.dataAttr)(state.context.disabled),
92
+ "data-complete": (0, import_dom_query2.dataAttr)(isValueComplete)
205
93
  }),
206
94
  labelProps: normalize.label({
207
95
  ...parts.label.attrs,
208
96
  htmlFor: dom.getHiddenInputId(state.context),
209
97
  id: dom.getLabelId(state.context),
210
- "data-invalid": dataAttr(isInvalid),
211
- "data-disabled": dataAttr(state.context.disabled),
212
- "data-complete": dataAttr(isValueComplete),
98
+ "data-invalid": (0, import_dom_query2.dataAttr)(isInvalid),
99
+ "data-disabled": (0, import_dom_query2.dataAttr)(state.context.disabled),
100
+ "data-complete": (0, import_dom_query2.dataAttr)(isValueComplete),
213
101
  onClick: (event) => {
214
102
  event.preventDefault();
215
103
  focus();
@@ -223,7 +111,7 @@ function connect(state, send, normalize) {
223
111
  id: dom.getHiddenInputId(state.context),
224
112
  name: state.context.name,
225
113
  form: state.context.form,
226
- style: visuallyHiddenStyle,
114
+ style: import_visually_hidden.visuallyHiddenStyle,
227
115
  maxLength: state.context.valueLength,
228
116
  defaultValue: state.context.valueAsString
229
117
  }),
@@ -236,21 +124,21 @@ function connect(state, send, normalize) {
236
124
  return normalize.input({
237
125
  ...parts.input.attrs,
238
126
  disabled: state.context.disabled,
239
- "data-disabled": dataAttr(state.context.disabled),
240
- "data-complete": dataAttr(isValueComplete),
127
+ "data-disabled": (0, import_dom_query2.dataAttr)(state.context.disabled),
128
+ "data-complete": (0, import_dom_query2.dataAttr)(isValueComplete),
241
129
  id: dom.getInputId(state.context, index.toString()),
242
130
  "data-ownedby": dom.getRootId(state.context),
243
131
  "aria-label": translations.inputLabel(index, state.context.valueLength),
244
132
  inputMode: state.context.otp || state.context.type === "numeric" ? "numeric" : "text",
245
- "aria-invalid": ariaAttr(isInvalid),
246
- "data-invalid": dataAttr(isInvalid),
133
+ "aria-invalid": (0, import_dom_query2.ariaAttr)(isInvalid),
134
+ "data-invalid": (0, import_dom_query2.dataAttr)(isInvalid),
247
135
  type: state.context.mask ? "password" : inputType,
248
136
  defaultValue: state.context.value[index] || "",
249
137
  autoCapitalize: "none",
250
138
  autoComplete: state.context.otp ? "one-time-code" : "off",
251
139
  placeholder: focusedIndex === index ? "" : state.context.placeholder,
252
140
  onChange(event) {
253
- const evt = getNativeEvent(event);
141
+ const evt = (0, import_dom_event.getNativeEvent)(event);
254
142
  const { value } = event.currentTarget;
255
143
  if (evt.inputType === "insertFromPaste" || value.length > 2) {
256
144
  send({ type: "PASTE", value });
@@ -264,8 +152,8 @@ function connect(state, send, normalize) {
264
152
  send({ type: "INPUT", value, index });
265
153
  },
266
154
  onKeyDown(event) {
267
- const evt = getNativeEvent(event);
268
- if (evt.isComposing || isModifiedEvent(evt))
155
+ const evt = (0, import_dom_event.getNativeEvent)(event);
156
+ if (evt.isComposing || (0, import_dom_event.isModifiedEvent)(evt))
269
157
  return;
270
158
  const keyMap = {
271
159
  Backspace() {
@@ -284,7 +172,7 @@ function connect(state, send, normalize) {
284
172
  send("ENTER");
285
173
  }
286
174
  };
287
- const key = getEventKey(event, { dir: state.context.dir });
175
+ const key = (0, import_dom_event.getEventKey)(event, { dir: state.context.dir });
288
176
  const exec = keyMap[key];
289
177
  if (exec) {
290
178
  exec(event);
@@ -308,29 +196,12 @@ function connect(state, send, normalize) {
308
196
 
309
197
  // src/pin-input.machine.ts
310
198
  var import_core = require("@zag-js/core");
311
-
312
- // ../../utilities/form-utils/src/input-event.ts
313
- function getDescriptor(el, options) {
314
- const { type, property = "value" } = options;
315
- const proto = getWindow(el)[type].prototype;
316
- return Object.getOwnPropertyDescriptor(proto, property) ?? {};
317
- }
318
- function dispatchInputValueEvent(el, value) {
319
- if (!el)
320
- return;
321
- const win = getWindow(el);
322
- if (!(el instanceof win.HTMLInputElement))
323
- return;
324
- const desc = getDescriptor(el, { type: "HTMLInputElement", property: "value" });
325
- desc.set?.call(el, value);
326
- const event = new win.Event("input", { bubbles: true });
327
- el.dispatchEvent(event);
328
- }
329
-
330
- // src/pin-input.machine.ts
199
+ var import_dom_query3 = require("@zag-js/dom-query");
200
+ var import_form_utils = require("@zag-js/form-utils");
201
+ var import_utils2 = require("@zag-js/utils");
331
202
  var { and, not } = import_core.guards;
332
203
  function machine(userContext) {
333
- const ctx = compact(userContext);
204
+ const ctx = (0, import_utils2.compact)(userContext);
334
205
  return (0, import_core.createMachine)(
335
206
  {
336
207
  id: "pin-input",
@@ -467,14 +338,14 @@ function machine(userContext) {
467
338
  assign(ctx2, emptyValues);
468
339
  },
469
340
  focusInput: (ctx2) => {
470
- raf(() => {
341
+ (0, import_dom_query3.raf)(() => {
471
342
  if (ctx2.focusedIndex === -1)
472
343
  return;
473
344
  dom.getFocusedInputEl(ctx2)?.focus();
474
345
  });
475
346
  },
476
347
  setInputSelection: (ctx2) => {
477
- raf(() => {
348
+ (0, import_dom_query3.raf)(() => {
478
349
  if (ctx2.focusedIndex === -1)
479
350
  return;
480
351
  const input = dom.getFocusedInputEl(ctx2);
@@ -492,7 +363,7 @@ function machine(userContext) {
492
363
  ctx2.onChange?.({ value: Array.from(ctx2.value) });
493
364
  },
494
365
  dispatchInputEvent: (ctx2) => {
495
- dispatchInputValueEvent(dom.getHiddenInputEl(ctx2), ctx2.valueAsString);
366
+ (0, import_form_utils.dispatchInputValueEvent)(dom.getHiddenInputEl(ctx2), ctx2.valueAsString);
496
367
  },
497
368
  invokeOnInvalid: (ctx2, evt) => {
498
369
  ctx2.onInvalid?.({ value: evt.value, index: ctx2.focusedIndex });
@@ -522,7 +393,7 @@ function machine(userContext) {
522
393
  });
523
394
  },
524
395
  setPastedValue(ctx2, evt) {
525
- raf(() => {
396
+ (0, import_dom_query3.raf)(() => {
526
397
  const startIndex = ctx2.focusedValue ? 1 : 0;
527
398
  const value = evt.value.substring(startIndex, startIndex + ctx2.valueLength);
528
399
  assign(ctx2, value);
@@ -552,7 +423,7 @@ function machine(userContext) {
552
423
  ctx2.focusedIndex = Math.max(ctx2.focusedIndex - 1, 0);
553
424
  },
554
425
  setLastValueFocusIndex: (ctx2) => {
555
- raf(() => {
426
+ (0, import_dom_query3.raf)(() => {
556
427
  ctx2.focusedIndex = Math.min(ctx2.filledValueLength, ctx2.valueLength - 1);
557
428
  });
558
429
  },
@@ -562,7 +433,7 @@ function machine(userContext) {
562
433
  blurFocusedInputIfNeeded(ctx2) {
563
434
  if (!ctx2.blurOnComplete)
564
435
  return;
565
- raf(() => {
436
+ (0, import_dom_query3.raf)(() => {
566
437
  dom.getFocusedInputEl(ctx2)?.blur();
567
438
  });
568
439
  },
package/dist/index.mjs CHANGED
@@ -1,14 +1,13 @@
1
1
  import {
2
2
  connect
3
- } from "./chunk-IGE2OJGQ.mjs";
3
+ } from "./chunk-YP6JAJVN.mjs";
4
4
  import {
5
5
  anatomy
6
6
  } from "./chunk-BJXKBZJG.mjs";
7
7
  import {
8
8
  machine
9
- } from "./chunk-VZQYAAIE.mjs";
10
- import "./chunk-NT4W6JYX.mjs";
11
- import "./chunk-Y7IZ6OAH.mjs";
9
+ } from "./chunk-H5AVP4J4.mjs";
10
+ import "./chunk-CPXMEVTH.mjs";
12
11
  export {
13
12
  anatomy,
14
13
  connect,
package/dist/pin-input.connect.js CHANGED
@@ -23,101 +23,10 @@ __export(pin_input_connect_exports, {
23
23
  connect: () => connect
24
24
  });
25
25
  module.exports = __toCommonJS(pin_input_connect_exports);
26
-
27
- // ../../utilities/dom/src/attrs.ts
28
- var dataAttr = (guard) => {
29
- return guard ? "" : void 0;
30
- };
31
- var ariaAttr = (guard) => {
32
- return guard ? "true" : void 0;
33
- };
34
-
35
- // ../../utilities/core/src/warning.ts
36
- function invariant(...a) {
37
- const m = a.length === 1 ? a[0] : a[1];
38
- const c = a.length === 2 ? a[0] : true;
39
- if (c && process.env.NODE_ENV !== "production") {
40
- throw new Error(m);
41
- }
42
- }
43
-
44
- // ../../utilities/dom/src/query.ts
45
- function isDocument(el) {
46
- return el.nodeType === Node.DOCUMENT_NODE;
47
- }
48
- function isWindow(value) {
49
- return value?.toString() === "[object Window]";
50
- }
51
- function getDocument(el) {
52
- if (isWindow(el))
53
- return el.document;
54
- if (isDocument(el))
55
- return el;
56
- return el?.ownerDocument ?? document;
57
- }
58
- function defineDomHelpers(helpers) {
59
- const dom2 = {
60
- getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
61
- getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
62
- getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
63
- getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
64
- getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
65
- };
66
- return {
67
- ...dom2,
68
- ...helpers
69
- };
70
- }
71
-
72
- // ../../utilities/dom/src/event.ts
73
- function getNativeEvent(e) {
74
- return e.nativeEvent ?? e;
75
- }
76
- var isModifiedEvent = (v) => v.ctrlKey || v.altKey || v.metaKey;
77
-
78
- // ../../utilities/dom/src/keyboard-event.ts
79
- var rtlKeyMap = {
80
- ArrowLeft: "ArrowRight",
81
- ArrowRight: "ArrowLeft"
82
- };
83
- var sameKeyMap = {
84
- Up: "ArrowUp",
85
- Down: "ArrowDown",
86
- Esc: "Escape",
87
- " ": "Space",
88
- ",": "Comma",
89
- Left: "ArrowLeft",
90
- Right: "ArrowRight"
91
- };
92
- function getEventKey(event, options = {}) {
93
- const { dir = "ltr", orientation = "horizontal" } = options;
94
- let { key } = event;
95
- key = sameKeyMap[key] ?? key;
96
- const isRtl = dir === "rtl" && orientation === "horizontal";
97
- if (isRtl && key in rtlKeyMap) {
98
- key = rtlKeyMap[key];
99
- }
100
- return key;
101
- }
102
-
103
- // ../../utilities/dom/src/nodelist.ts
104
- function queryAll(root, selector) {
105
- return Array.from(root?.querySelectorAll(selector) ?? []);
106
- }
107
-
108
- // ../../utilities/dom/src/visually-hidden.ts
109
- var visuallyHiddenStyle = {
110
- border: "0",
111
- clip: "rect(0 0 0 0)",
112
- height: "1px",
113
- margin: "-1px",
114
- overflow: "hidden",
115
- padding: "0",
116
- position: "absolute",
117
- width: "1px",
118
- whiteSpace: "nowrap",
119
- wordWrap: "normal"
120
- };
26
+ var import_dom_event = require("@zag-js/dom-event");
27
+ var import_dom_query2 = require("@zag-js/dom-query");
28
+ var import_utils = require("@zag-js/utils");
29
+ var import_visually_hidden = require("@zag-js/visually-hidden");
121
30
 
122
31
  // src/pin-input.anatomy.ts
123
32
  var import_anatomy = require("@zag-js/anatomy");
@@ -125,7 +34,8 @@ var anatomy = (0, import_anatomy.createAnatomy)("pinInput").parts("root", "label
125
34
  var parts = anatomy.build();
126
35
 
127
36
  // src/pin-input.dom.ts
128
- var dom = defineDomHelpers({
37
+ var import_dom_query = require("@zag-js/dom-query");
38
+ var dom = (0, import_dom_query.createScope)({
129
39
  getRootId: (ctx) => ctx.ids?.root ?? `pin-input:${ctx.id}`,
130
40
  getInputId: (ctx, id) => ctx.ids?.input?.(id) ?? `pin-input:${ctx.id}:${id}`,
131
41
  getHiddenInputId: (ctx) => ctx.ids?.hiddenInput ?? `pin-input:${ctx.id}:hidden`,
@@ -135,7 +45,7 @@ var dom = defineDomHelpers({
135
45
  getElements: (ctx) => {
136
46
  const ownerId = CSS.escape(dom.getRootId(ctx));
137
47
  const selector = `input[data-ownedby=${ownerId}]`;
138
- return queryAll(dom.getRootEl(ctx), selector);
48
+ return (0, import_dom_query.queryAll)(dom.getRootEl(ctx), selector);
139
49
  },
140
50
  getInputEl: (ctx, id) => dom.getById(ctx, dom.getInputId(ctx, id)),
141
51
  getFocusedInputEl: (ctx) => dom.getElements(ctx)[ctx.focusedIndex],
@@ -158,7 +68,7 @@ function connect(state, send, normalize) {
158
68
  isValueComplete,
159
69
  setValue(value) {
160
70
  if (!Array.isArray(value)) {
161
- invariant("[pin-input/setValue] value must be an array");
71
+ (0, import_utils.invariant)("[pin-input/setValue] value must be an array");
162
72
  }
163
73
  send({ type: "SET_VALUE", value });
164
74
  },
@@ -173,17 +83,17 @@ function connect(state, send, normalize) {
173
83
  dir: state.context.dir,
174
84
  ...parts.root.attrs,
175
85
  id: dom.getRootId(state.context),
176
- "data-invalid": dataAttr(isInvalid),
177
- "data-disabled": dataAttr(state.context.disabled),
178
- "data-complete": dataAttr(isValueComplete)
86
+ "data-invalid": (0, import_dom_query2.dataAttr)(isInvalid),
87
+ "data-disabled": (0, import_dom_query2.dataAttr)(state.context.disabled),
88
+ "data-complete": (0, import_dom_query2.dataAttr)(isValueComplete)
179
89
  }),
180
90
  labelProps: normalize.label({
181
91
  ...parts.label.attrs,
182
92
  htmlFor: dom.getHiddenInputId(state.context),
183
93
  id: dom.getLabelId(state.context),
184
- "data-invalid": dataAttr(isInvalid),
185
- "data-disabled": dataAttr(state.context.disabled),
186
- "data-complete": dataAttr(isValueComplete),
94
+ "data-invalid": (0, import_dom_query2.dataAttr)(isInvalid),
95
+ "data-disabled": (0, import_dom_query2.dataAttr)(state.context.disabled),
96
+ "data-complete": (0, import_dom_query2.dataAttr)(isValueComplete),
187
97
  onClick: (event) => {
188
98
  event.preventDefault();
189
99
  focus();
@@ -197,7 +107,7 @@ function connect(state, send, normalize) {
197
107
  id: dom.getHiddenInputId(state.context),
198
108
  name: state.context.name,
199
109
  form: state.context.form,
200
- style: visuallyHiddenStyle,
110
+ style: import_visually_hidden.visuallyHiddenStyle,
201
111
  maxLength: state.context.valueLength,
202
112
  defaultValue: state.context.valueAsString
203
113
  }),
@@ -210,21 +120,21 @@ function connect(state, send, normalize) {
210
120
  return normalize.input({
211
121
  ...parts.input.attrs,
212
122
  disabled: state.context.disabled,
213
- "data-disabled": dataAttr(state.context.disabled),
214
- "data-complete": dataAttr(isValueComplete),
123
+ "data-disabled": (0, import_dom_query2.dataAttr)(state.context.disabled),
124
+ "data-complete": (0, import_dom_query2.dataAttr)(isValueComplete),
215
125
  id: dom.getInputId(state.context, index.toString()),
216
126
  "data-ownedby": dom.getRootId(state.context),
217
127
  "aria-label": translations.inputLabel(index, state.context.valueLength),
218
128
  inputMode: state.context.otp || state.context.type === "numeric" ? "numeric" : "text",
219
- "aria-invalid": ariaAttr(isInvalid),
220
- "data-invalid": dataAttr(isInvalid),
129
+ "aria-invalid": (0, import_dom_query2.ariaAttr)(isInvalid),
130
+ "data-invalid": (0, import_dom_query2.dataAttr)(isInvalid),
221
131
  type: state.context.mask ? "password" : inputType,
222
132
  defaultValue: state.context.value[index] || "",
223
133
  autoCapitalize: "none",
224
134
  autoComplete: state.context.otp ? "one-time-code" : "off",
225
135
  placeholder: focusedIndex === index ? "" : state.context.placeholder,
226
136
  onChange(event) {
227
- const evt = getNativeEvent(event);
137
+ const evt = (0, import_dom_event.getNativeEvent)(event);
228
138
  const { value } = event.currentTarget;
229
139
  if (evt.inputType === "insertFromPaste" || value.length > 2) {
230
140
  send({ type: "PASTE", value });
@@ -238,8 +148,8 @@ function connect(state, send, normalize) {
238
148
  send({ type: "INPUT", value, index });
239
149
  },
240
150
  onKeyDown(event) {
241
- const evt = getNativeEvent(event);
242
- if (evt.isComposing || isModifiedEvent(evt))
151
+ const evt = (0, import_dom_event.getNativeEvent)(event);
152
+ if (evt.isComposing || (0, import_dom_event.isModifiedEvent)(evt))
243
153
  return;
244
154
  const keyMap = {
245
155
  Backspace() {
@@ -258,7 +168,7 @@ function connect(state, send, normalize) {
258
168
  send("ENTER");
259
169
  }
260
170
  };
261
- const key = getEventKey(event, { dir: state.context.dir });
171
+ const key = (0, import_dom_event.getEventKey)(event, { dir: state.context.dir });
262
172
  const exec = keyMap[key];
263
173
  if (exec) {
264
174
  exec(event);
package/dist/pin-input.connect.mjs CHANGED
@@ -1,9 +1,8 @@
1
1
  import {
2
2
  connect
3
- } from "./chunk-IGE2OJGQ.mjs";
3
+ } from "./chunk-YP6JAJVN.mjs";
4
4
  import "./chunk-BJXKBZJG.mjs";
5
- import "./chunk-NT4W6JYX.mjs";
6
- import "./chunk-Y7IZ6OAH.mjs";
5
+ import "./chunk-CPXMEVTH.mjs";
7
6
  export {
8
7
  connect
9
8
  };
package/dist/pin-input.dom.d.ts CHANGED
@@ -4,20 +4,23 @@ import '@zag-js/types';
4
4
 
5
5
  declare const dom: {
6
6
  getRootNode: (ctx: {
7
- getRootNode?: (() => Node | Document | ShadowRoot) | undefined;
7
+ getRootNode?: (() => Document | Node | ShadowRoot) | undefined;
8
8
  }) => Document | ShadowRoot;
9
9
  getDoc: (ctx: {
10
- getRootNode?: (() => Node | Document | ShadowRoot) | undefined;
10
+ getRootNode?: (() => Document | Node | ShadowRoot) | undefined;
11
11
  }) => Document;
12
12
  getWin: (ctx: {
13
- getRootNode?: (() => Node | Document | ShadowRoot) | undefined;
13
+ getRootNode?: (() => Document | Node | ShadowRoot) | undefined;
14
14
  }) => Window & typeof globalThis;
15
15
  getActiveElement: (ctx: {
16
- getRootNode?: (() => Node | Document | ShadowRoot) | undefined;
16
+ getRootNode?: (() => Document | Node | ShadowRoot) | undefined;
17
17
  }) => HTMLElement | null;
18
- getById: <T = HTMLElement>(ctx: {
19
- getRootNode?: (() => Node | Document | ShadowRoot) | undefined;
18
+ getById: <T extends HTMLElement = HTMLElement>(ctx: {
19
+ getRootNode?: (() => Document | Node | ShadowRoot) | undefined;
20
20
  }, id: string) => T | null;
21
+ queryById: <T_1 extends HTMLElement = HTMLElement>(ctx: {
22
+ getRootNode?: (() => Document | Node | ShadowRoot) | undefined;
23
+ }, id: string) => T_1;
21
24
  } & {
22
25
  getRootId: (ctx: MachineContext) => string;
23
26
  getInputId: (ctx: MachineContext, id: string) => string;
package/dist/pin-input.dom.js CHANGED
@@ -23,42 +23,8 @@ __export(pin_input_dom_exports, {
23
23
  dom: () => dom
24
24
  });
25
25
  module.exports = __toCommonJS(pin_input_dom_exports);
26
-
27
- // ../../utilities/dom/src/query.ts
28
- function isDocument(el) {
29
- return el.nodeType === Node.DOCUMENT_NODE;
30
- }
31
- function isWindow(value) {
32
- return value?.toString() === "[object Window]";
33
- }
34
- function getDocument(el) {
35
- if (isWindow(el))
36
- return el.document;
37
- if (isDocument(el))
38
- return el;
39
- return el?.ownerDocument ?? document;
40
- }
41
- function defineDomHelpers(helpers) {
42
- const dom2 = {
43
- getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
44
- getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
45
- getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
46
- getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
47
- getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
48
- };
49
- return {
50
- ...dom2,
51
- ...helpers
52
- };
53
- }
54
-
55
- // ../../utilities/dom/src/nodelist.ts
56
- function queryAll(root, selector) {
57
- return Array.from(root?.querySelectorAll(selector) ?? []);
58
- }
59
-
60
- // src/pin-input.dom.ts
61
- var dom = defineDomHelpers({
26
+ var import_dom_query = require("@zag-js/dom-query");
27
+ var dom = (0, import_dom_query.createScope)({
62
28
  getRootId: (ctx) => ctx.ids?.root ?? `pin-input:${ctx.id}`,
63
29
  getInputId: (ctx, id) => ctx.ids?.input?.(id) ?? `pin-input:${ctx.id}:${id}`,
64
30
  getHiddenInputId: (ctx) => ctx.ids?.hiddenInput ?? `pin-input:${ctx.id}:hidden`,
@@ -68,7 +34,7 @@ var dom = defineDomHelpers({
68
34
  getElements: (ctx) => {
69
35
  const ownerId = CSS.escape(dom.getRootId(ctx));
70
36
  const selector = `input[data-ownedby=${ownerId}]`;
71
- return queryAll(dom.getRootEl(ctx), selector);
37
+ return (0, import_dom_query.queryAll)(dom.getRootEl(ctx), selector);
72
38
  },
73
39
  getInputEl: (ctx, id) => dom.getById(ctx, dom.getInputId(ctx, id)),
74
40
  getFocusedInputEl: (ctx) => dom.getElements(ctx)[ctx.focusedIndex],
package/dist/pin-input.dom.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  dom
3
- } from "./chunk-Y7IZ6OAH.mjs";
3
+ } from "./chunk-CPXMEVTH.mjs";
4
4
  export {
5
5
  dom
6
6
  };
package/dist/pin-input.machine.js CHANGED
@@ -24,84 +24,13 @@ __export(pin_input_machine_exports, {
24
24
  });
25
25
  module.exports = __toCommonJS(pin_input_machine_exports);
26
26
  var import_core = require("@zag-js/core");
27
-
28
- // ../../utilities/core/src/guard.ts
29
- var isArray = (v) => Array.isArray(v);
30
- var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
31
-
32
- // ../../utilities/core/src/object.ts
33
- function compact(obj) {
34
- if (obj === void 0)
35
- return obj;
36
- return Object.fromEntries(
37
- Object.entries(obj).filter(([, value]) => value !== void 0).map(([key, value]) => [key, isObject(value) ? compact(value) : value])
38
- );
39
- }
40
-
41
- // ../../utilities/dom/src/query.ts
42
- function isDocument(el) {
43
- return el.nodeType === Node.DOCUMENT_NODE;
44
- }
45
- function isWindow(value) {
46
- return value?.toString() === "[object Window]";
47
- }
48
- function getDocument(el) {
49
- if (isWindow(el))
50
- return el.document;
51
- if (isDocument(el))
52
- return el;
53
- return el?.ownerDocument ?? document;
54
- }
55
- function getWindow(el) {
56
- return el?.ownerDocument.defaultView ?? window;
57
- }
58
- function defineDomHelpers(helpers) {
59
- const dom2 = {
60
- getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
61
- getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
62
- getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
63
- getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
64
- getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
65
- };
66
- return {
67
- ...dom2,
68
- ...helpers
69
- };
70
- }
71
-
72
- // ../../utilities/dom/src/next-tick.ts
73
- function raf(fn) {
74
- const id = globalThis.requestAnimationFrame(fn);
75
- return function cleanup() {
76
- globalThis.cancelAnimationFrame(id);
77
- };
78
- }
79
-
80
- // ../../utilities/dom/src/nodelist.ts
81
- function queryAll(root, selector) {
82
- return Array.from(root?.querySelectorAll(selector) ?? []);
83
- }
84
-
85
- // ../../utilities/form-utils/src/input-event.ts
86
- function getDescriptor(el, options) {
87
- const { type, property = "value" } = options;
88
- const proto = getWindow(el)[type].prototype;
89
- return Object.getOwnPropertyDescriptor(proto, property) ?? {};
90
- }
91
- function dispatchInputValueEvent(el, value) {
92
- if (!el)
93
- return;
94
- const win = getWindow(el);
95
- if (!(el instanceof win.HTMLInputElement))
96
- return;
97
- const desc = getDescriptor(el, { type: "HTMLInputElement", property: "value" });
98
- desc.set?.call(el, value);
99
- const event = new win.Event("input", { bubbles: true });
100
- el.dispatchEvent(event);
101
- }
27
+ var import_dom_query2 = require("@zag-js/dom-query");
28
+ var import_form_utils = require("@zag-js/form-utils");
29
+ var import_utils = require("@zag-js/utils");
102
30
 
103
31
  // src/pin-input.dom.ts
104
- var dom = defineDomHelpers({
32
+ var import_dom_query = require("@zag-js/dom-query");
33
+ var dom = (0, import_dom_query.createScope)({
105
34
  getRootId: (ctx) => ctx.ids?.root ?? `pin-input:${ctx.id}`,
106
35
  getInputId: (ctx, id) => ctx.ids?.input?.(id) ?? `pin-input:${ctx.id}:${id}`,
107
36
  getHiddenInputId: (ctx) => ctx.ids?.hiddenInput ?? `pin-input:${ctx.id}:hidden`,
@@ -111,7 +40,7 @@ var dom = defineDomHelpers({
111
40
  getElements: (ctx) => {
112
41
  const ownerId = CSS.escape(dom.getRootId(ctx));
113
42
  const selector = `input[data-ownedby=${ownerId}]`;
114
- return queryAll(dom.getRootEl(ctx), selector);
43
+ return (0, import_dom_query.queryAll)(dom.getRootEl(ctx), selector);
115
44
  },
116
45
  getInputEl: (ctx, id) => dom.getById(ctx, dom.getInputId(ctx, id)),
117
46
  getFocusedInputEl: (ctx) => dom.getElements(ctx)[ctx.focusedIndex],
@@ -122,7 +51,7 @@ var dom = defineDomHelpers({
122
51
  // src/pin-input.machine.ts
123
52
  var { and, not } = import_core.guards;
124
53
  function machine(userContext) {
125
- const ctx = compact(userContext);
54
+ const ctx = (0, import_utils.compact)(userContext);
126
55
  return (0, import_core.createMachine)(
127
56
  {
128
57
  id: "pin-input",
@@ -259,14 +188,14 @@ function machine(userContext) {
259
188
  assign(ctx2, emptyValues);
260
189
  },
261
190
  focusInput: (ctx2) => {
262
- raf(() => {
191
+ (0, import_dom_query2.raf)(() => {
263
192
  if (ctx2.focusedIndex === -1)
264
193
  return;
265
194
  dom.getFocusedInputEl(ctx2)?.focus();
266
195
  });
267
196
  },
268
197
  setInputSelection: (ctx2) => {
269
- raf(() => {
198
+ (0, import_dom_query2.raf)(() => {
270
199
  if (ctx2.focusedIndex === -1)
271
200
  return;
272
201
  const input = dom.getFocusedInputEl(ctx2);
@@ -284,7 +213,7 @@ function machine(userContext) {
284
213
  ctx2.onChange?.({ value: Array.from(ctx2.value) });
285
214
  },
286
215
  dispatchInputEvent: (ctx2) => {
287
- dispatchInputValueEvent(dom.getHiddenInputEl(ctx2), ctx2.valueAsString);
216
+ (0, import_form_utils.dispatchInputValueEvent)(dom.getHiddenInputEl(ctx2), ctx2.valueAsString);
288
217
  },
289
218
  invokeOnInvalid: (ctx2, evt) => {
290
219
  ctx2.onInvalid?.({ value: evt.value, index: ctx2.focusedIndex });
@@ -314,7 +243,7 @@ function machine(userContext) {
314
243
  });
315
244
  },
316
245
  setPastedValue(ctx2, evt) {
317
- raf(() => {
246
+ (0, import_dom_query2.raf)(() => {
318
247
  const startIndex = ctx2.focusedValue ? 1 : 0;
319
248
  const value = evt.value.substring(startIndex, startIndex + ctx2.valueLength);
320
249
  assign(ctx2, value);
@@ -344,7 +273,7 @@ function machine(userContext) {
344
273
  ctx2.focusedIndex = Math.max(ctx2.focusedIndex - 1, 0);
345
274
  },
346
275
  setLastValueFocusIndex: (ctx2) => {
347
- raf(() => {
276
+ (0, import_dom_query2.raf)(() => {
348
277
  ctx2.focusedIndex = Math.min(ctx2.filledValueLength, ctx2.valueLength - 1);
349
278
  });
350
279
  },
@@ -354,7 +283,7 @@ function machine(userContext) {
354
283
  blurFocusedInputIfNeeded(ctx2) {
355
284
  if (!ctx2.blurOnComplete)
356
285
  return;
357
- raf(() => {
286
+ (0, import_dom_query2.raf)(() => {
358
287
  dom.getFocusedInputEl(ctx2)?.blur();
359
288
  });
360
289
  },
package/dist/pin-input.machine.mjs CHANGED
@@ -1,8 +1,7 @@
1
1
  import {
2
2
  machine
3
- } from "./chunk-VZQYAAIE.mjs";
4
- import "./chunk-NT4W6JYX.mjs";
5
- import "./chunk-Y7IZ6OAH.mjs";
3
+ } from "./chunk-H5AVP4J4.mjs";
4
+ import "./chunk-CPXMEVTH.mjs";
6
5
  export {
7
6
  machine
8
7
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zag-js/pin-input",
3
- "version": "0.0.0-dev-20230220134212",
3
+ "version": "0.0.0-dev-20230222120620",
4
4
  "description": "Core logic for the pin-input widget implemented as a state machine",
5
5
  "keywords": [
6
6
  "js",
@@ -27,14 +27,16 @@
27
27
  },
28
28
  "dependencies": {
29
29
  "@zag-js/anatomy": "0.1.4",
30
- "@zag-js/core": "0.0.0-dev-20230220134212",
30
+ "@zag-js/dom-query": "0.0.0-dev-20230222120620",
31
+ "@zag-js/dom-event": "0.0.0-dev-20230222120620",
32
+ "@zag-js/form-utils": "0.0.0-dev-20230222120620",
33
+ "@zag-js/visually-hidden": "0.0.0-dev-20230222120620",
34
+ "@zag-js/utils": "0.3.3",
35
+ "@zag-js/core": "0.0.0-dev-20230222120620",
31
36
  "@zag-js/types": "0.3.4"
32
37
  },
33
38
  "devDependencies": {
34
- "clean-package": "2.2.0",
35
- "@zag-js/dom-utils": "0.2.4",
36
- "@zag-js/form-utils": "0.2.4",
37
- "@zag-js/utils": "0.3.3"
39
+ "clean-package": "2.2.0"
38
40
  },
39
41
  "clean-package": "../../../clean-package.config.json",
40
42
  "main": "dist/index.js",
package/dist/chunk-NT4W6JYX.mjs DELETED
@@ -1,7 +0,0 @@
1
- // ../../utilities/core/src/guard.ts
2
- var isArray = (v) => Array.isArray(v);
3
- var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
4
-
5
- export {
6
- isObject
7
- };
package/dist/chunk-Y7IZ6OAH.mjs DELETED
@@ -1,59 +0,0 @@
1
- // ../../utilities/dom/src/query.ts
2
- function isDocument(el) {
3
- return el.nodeType === Node.DOCUMENT_NODE;
4
- }
5
- function isWindow(value) {
6
- return value?.toString() === "[object Window]";
7
- }
8
- function getDocument(el) {
9
- if (isWindow(el))
10
- return el.document;
11
- if (isDocument(el))
12
- return el;
13
- return el?.ownerDocument ?? document;
14
- }
15
- function getWindow(el) {
16
- return el?.ownerDocument.defaultView ?? window;
17
- }
18
- function defineDomHelpers(helpers) {
19
- const dom2 = {
20
- getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
21
- getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
22
- getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
23
- getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
24
- getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
25
- };
26
- return {
27
- ...dom2,
28
- ...helpers
29
- };
30
- }
31
-
32
- // ../../utilities/dom/src/nodelist.ts
33
- function queryAll(root, selector) {
34
- return Array.from(root?.querySelectorAll(selector) ?? []);
35
- }
36
-
37
- // src/pin-input.dom.ts
38
- var dom = defineDomHelpers({
39
- getRootId: (ctx) => ctx.ids?.root ?? `pin-input:${ctx.id}`,
40
- getInputId: (ctx, id) => ctx.ids?.input?.(id) ?? `pin-input:${ctx.id}:${id}`,
41
- getHiddenInputId: (ctx) => ctx.ids?.hiddenInput ?? `pin-input:${ctx.id}:hidden`,
42
- getLabelId: (ctx) => ctx.ids?.label ?? `pin-input:${ctx.id}:label`,
43
- getControlId: (ctx) => ctx.ids?.control ?? `pin-input:${ctx.id}:control`,
44
- getRootEl: (ctx) => dom.getById(ctx, dom.getRootId(ctx)),
45
- getElements: (ctx) => {
46
- const ownerId = CSS.escape(dom.getRootId(ctx));
47
- const selector = `input[data-ownedby=${ownerId}]`;
48
- return queryAll(dom.getRootEl(ctx), selector);
49
- },
50
- getInputEl: (ctx, id) => dom.getById(ctx, dom.getInputId(ctx, id)),
51
- getFocusedInputEl: (ctx) => dom.getElements(ctx)[ctx.focusedIndex],
52
- getFirstInputEl: (ctx) => dom.getElements(ctx)[0],
53
- getHiddenInputEl: (ctx) => dom.getById(ctx, dom.getHiddenInputId(ctx))
54
- });
55
-
56
- export {
57
- getWindow,
58
- dom
59
- };