@mpen/react-basic-inputs 0.3.1 → 0.3.3

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.
@@ -17,9 +17,7 @@ export declare type ActionButtonProps = RequiredKeys<ComponentPropsWithoutRef<'b
17
17
  export declare function DatetimeLocalInput({ value, defaultValue, min, max, onChange, ...props }: DatetimeLocalInputProps): JSX_2.Element;
18
18
 
19
19
  export declare type DatetimeLocalInputChangeEvent = {
20
- isoString: string | null;
21
- value: number | null;
22
- date: Date | null;
20
+ value: string;
23
21
  };
24
22
 
25
23
  export declare type DatetimeLocalInputProps = OverrideProps<'input', {
@@ -37,16 +35,14 @@ export declare type DatetimeOffsetInputChangeEvent = {
37
35
  };
38
36
 
39
37
  export declare type DatetimeOffsetInputProps = {
40
- min?: DateValue_2;
41
- max?: DateValue_2;
42
- value?: DateValue_2 | null;
43
- defaultValue?: DateValue_2;
38
+ min?: DateValue;
39
+ max?: DateValue;
40
+ value?: DateValue | null;
41
+ defaultValue?: DateValue;
44
42
  onChange?: (ev: DatetimeOffsetInputChangeEvent) => void;
45
43
  };
46
44
 
47
- export declare type DateValue = number | string | Date;
48
-
49
- declare type DateValue_2 = number | string | Date;
45
+ declare type DateValue = number | string | Date;
50
46
 
51
47
  export declare const DebouncedInput: FC<DebouncedInputProps>;
52
48
 
@@ -1,8 +1,8 @@
1
- var C = Object.defineProperty;
2
- var q = (e, t, n) => t in e ? C(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
1
+ var z = Object.defineProperty;
2
+ var q = (e, t, n) => t in e ? z(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
3
3
  var P = (e, t, n) => (q(e, typeof t != "symbol" ? t + "" : t, n), n);
4
4
  import { jsx as v, jsxs as L } from "react/jsx-runtime";
5
- import { useDebugValue as G, useRef as h, useInsertionEffect as Z, useEffect as H, useMemo as F, useCallback as T, createElement as W, forwardRef as k, useState as D, useImperativeHandle as B, useLayoutEffect as J, useId as X } from "react";
5
+ import { useDebugValue as G, useRef as h, useInsertionEffect as Z, useEffect as C, useMemo as F, useCallback as T, createElement as W, forwardRef as k, useState as D, useImperativeHandle as B, useLayoutEffect as J, useId as X } from "react";
6
6
  const Q = Object.freeze(() => {
7
7
  });
8
8
  function ee(e) {
@@ -26,23 +26,23 @@ function te(e) {
26
26
  function ne() {
27
27
  throw new Error("INVALID_USE_EVENT_INVOCATION: the callback from useEvent cannot be invoked before the component has mounted.");
28
28
  }
29
- function ue() {
29
+ function re() {
30
30
  var e = h(!0);
31
31
  return e.current ? (e.current = !1, !0) : e.current;
32
32
  }
33
33
  var R = function(e, t) {
34
- var n = ue();
35
- H(function() {
34
+ var n = re();
35
+ C(function() {
36
36
  if (!n)
37
37
  return e();
38
38
  }, t);
39
39
  };
40
- function re(e, ...t) {
40
+ function ue(e, ...t) {
41
41
  return typeof e == "function" ? e(...t) : e;
42
42
  }
43
43
  function se(e, t) {
44
44
  if (e.uniqueKey != null)
45
- return re(e.uniqueKey, e, t);
45
+ return ue(e.uniqueKey, e, t);
46
46
  if (typeof e.value == "string")
47
47
  return e.value;
48
48
  if (typeof e.value == "number")
@@ -55,65 +55,65 @@ function se(e, t) {
55
55
  }
56
56
  return String(t);
57
57
  }
58
- class Y {
58
+ class H {
59
59
  constructor() {
60
60
  P(this, "_usedKeys", /* @__PURE__ */ new Map());
61
61
  }
62
62
  fix(t, n) {
63
- let u = se(t, n);
63
+ let r = se(t, n);
64
64
  for (; ; ) {
65
- let r = this._usedKeys.get(u);
66
- if (r === void 0) {
67
- this._usedKeys.set(u, 1);
65
+ let u = this._usedKeys.get(r);
66
+ if (u === void 0) {
67
+ this._usedKeys.set(r, 1);
68
68
  break;
69
69
  }
70
- this._usedKeys.set(u, ++r), u = `${u}(${r})`;
70
+ this._usedKeys.set(r, ++u), r = `${r}(${u})`;
71
71
  }
72
- return u;
72
+ return r;
73
73
  }
74
74
  }
75
- const le = (e) => ({
75
+ const ce = (e) => ({
76
76
  value: e,
77
77
  text: String(e),
78
78
  disabled: !0,
79
79
  key: ae
80
- }), ce = "3c9369b7-0a5e-46ea-93c2-e8b9fec67fdb", ae = "1a53f789-77f5-4ce6-a829-b00e563f1ee8";
80
+ }), le = "3c9369b7-0a5e-46ea-93c2-e8b9fec67fdb", ae = "1a53f789-77f5-4ce6-a829-b00e563f1ee8";
81
81
  function ie({
82
82
  options: e,
83
83
  value: t,
84
- invalidValueOption: n = le,
85
- onChange: u,
86
- placeholder: r,
84
+ invalidValueOption: n = ce,
85
+ onChange: r,
86
+ placeholder: u,
87
87
  ...s
88
88
  }) {
89
- const a = t == null, c = F(() => t != null && e.some((l) => l.value == t), [e, t]), o = F(() => t == null || !n ? null : n(t), [n, t]), i = F(() => {
90
- if (c)
89
+ const i = t == null, f = F(() => t != null && e.some((c) => c.value == t), [e, t]), o = F(() => t == null || !n ? null : n(t), [n, t]), l = F(() => {
90
+ if (f)
91
91
  return e;
92
- const l = [...e];
93
- return a ? r != null && l.unshift({ text: r, hidden: !0, value: null, key: ce }) : o && l.push(o), l;
94
- }, [c, e, a, o, r]), d = te((l) => {
95
- const g = l.target.selectedIndex, S = i[g];
96
- u == null || u({
97
- value: S.value,
92
+ const c = [...e];
93
+ return i ? u != null && c.unshift({ text: u, hidden: !0, value: null, key: le }) : o && c.push(o), c;
94
+ }, [f, e, i, o, u]), d = te((c) => {
95
+ const g = c.target.selectedIndex, O = l[g];
96
+ r == null || r({
97
+ value: O.value,
98
98
  // option: opt,
99
99
  // event: ev,
100
100
  index: g,
101
101
  type: "change",
102
- timeStamp: l.timeStamp,
103
- target: l.target
102
+ timeStamp: c.timeStamp,
103
+ target: c.target
104
104
  });
105
- }), f = h(null), m = T(() => {
106
- f.current && (f.current.selectedIndex < 0 || i[f.current.selectedIndex].value != t) && (f.current.selectedIndex = i.findIndex((l) => l.value == t));
107
- }, [i, t]), N = (l) => {
108
- f.current = l, m();
105
+ }), a = h(null), x = T(() => {
106
+ a.current && (a.current.selectedIndex < 0 || l[a.current.selectedIndex].value != t) && (a.current.selectedIndex = l.findIndex((c) => c.value == t));
107
+ }, [l, t]), N = (c) => {
108
+ a.current = c, x();
109
109
  };
110
110
  R(() => {
111
- m();
112
- }, [m]);
113
- const x = new Y();
114
- return /* @__PURE__ */ v("select", { ...s, onChange: d, ref: N, children: i.map((l, g) => {
115
- const { value: S, text: b, uniqueKey: O, ...y } = l, V = x.fix(l, g);
116
- return /* @__PURE__ */ W("option", { ...y, key: V, value: V }, l.text);
111
+ x();
112
+ }, [x]);
113
+ const m = new H();
114
+ return /* @__PURE__ */ v("select", { ...s, onChange: d, ref: N, children: l.map((c, g) => {
115
+ const { value: O, text: b, uniqueKey: S, ...y } = c, V = m.fix(c, g);
116
+ return /* @__PURE__ */ W("option", { ...y, key: V, value: V }, c.text);
117
117
  }) });
118
118
  }
119
119
  function fe(e) {
@@ -129,27 +129,27 @@ function oe(e) {
129
129
  function de(e) {
130
130
  return e ? e === "∞" || e === "+∞" ? Number.POSITIVE_INFINITY : e === "-∞" ? Number.NEGATIVE_INFINITY : Number.parseFloat(e) : Number.NaN;
131
131
  }
132
- function j(e) {
132
+ function Y(e) {
133
133
  return Number.isNaN(e) ? "" : e === Number.POSITIVE_INFINITY ? "∞" : e === Number.NEGATIVE_INFINITY ? "-∞" : oe(e);
134
134
  }
135
- function me(e) {
136
- return e ? j(Number.parseFloat(e)) : "";
135
+ function xe(e) {
136
+ return e ? Y(Number.parseFloat(e)) : "";
137
137
  }
138
138
  function I(e, t = 2) {
139
139
  return String(e).padStart(t, "0");
140
140
  }
141
- const z = k(function({ value: t = "", onPaste: n, onChange: u, onInput: r, onBlur: s, formatOnChange: a = ee, ...c }, o) {
142
- const [i, d] = D(t), f = h(t), m = h(!1);
141
+ const j = k(function({ value: t = "", onPaste: n, onChange: r, onInput: u, onBlur: s, formatOnChange: i = ee, ...f }, o) {
142
+ const [l, d] = D(t), a = h(t), x = h(!1);
143
143
  R(() => {
144
- d(t), m.current = !1, f.current = t;
144
+ d(t), x.current = !1, a.current = t;
145
145
  }, [t]);
146
146
  const N = {
147
147
  type: "text",
148
- ...c,
148
+ ...f,
149
149
  ref: o,
150
- value: i,
151
- onChange: (x) => {
152
- d(x.target.value);
150
+ value: l,
151
+ onChange: (m) => {
152
+ d(m.target.value);
153
153
  },
154
154
  // TODO: fire a change event onPaste ?
155
155
  // formatOnPaste?
@@ -167,106 +167,106 @@ const z = k(function({ value: t = "", onPaste: n, onChange: u, onInput: r, onBlu
167
167
  // // ev.preventDefault()
168
168
  // // setCurrentValue(formatOnChange(ev.clipboardData.getData('text/plain')))
169
169
  // },
170
- onInput: (x) => {
171
- m.current = !0, r == null || r(x);
170
+ onInput: (m) => {
171
+ x.current = !0, u == null || u(m);
172
172
  },
173
- onBlur: (x) => {
174
- const l = a(i);
175
- m.current && (l !== f.current && (u == null || u({
173
+ onBlur: (m) => {
174
+ const c = i(l);
175
+ x.current && (c !== a.current && (r == null || r({
176
176
  type: "change",
177
- value: l,
178
- timeStamp: x.timeStamp,
179
- target: x.target
180
- }), f.current = l), l !== x.target.value && d(l)), s == null || s(x);
177
+ value: c,
178
+ timeStamp: m.timeStamp,
179
+ target: m.target
180
+ }), a.current = c), c !== m.target.value && d(c)), s == null || s(m);
181
181
  }
182
182
  };
183
183
  return /* @__PURE__ */ v("input", { ...N });
184
184
  });
185
- function Se({ formatOnChange: e = fe, ...t }) {
186
- return /* @__PURE__ */ v(z, { formatOnChange: e, ...t, type: "text" });
185
+ function Oe({ formatOnChange: e = fe, ...t }) {
186
+ return /* @__PURE__ */ v(j, { formatOnChange: e, ...t, type: "text" });
187
187
  }
188
- const Oe = k(function({
188
+ const Se = k(function({
189
189
  onInput: t,
190
190
  style: n,
191
- initialHeight: u = "auto",
192
- ...r
191
+ initialHeight: r = "auto",
192
+ ...u
193
193
  }, s) {
194
- const a = h(null), [c, o] = D(u), i = T(() => {
195
- const f = a.current;
196
- if (!f)
194
+ const i = h(null), [f, o] = D(r), l = T(() => {
195
+ const a = i.current;
196
+ if (!a)
197
197
  return;
198
- f.style.height = u;
199
- const m = `${f.scrollHeight}px`;
200
- o(m), f.style.height = m;
201
- }, [u]);
198
+ a.style.height = r;
199
+ const x = `${a.scrollHeight}px`;
200
+ o(x), a.style.height = x;
201
+ }, [r]);
202
202
  B(s, () => ({
203
- element: a.current,
204
- adjustHeight: i
205
- }), [i]);
206
- const d = _((f) => {
207
- i(), t == null || t(f);
203
+ element: i.current,
204
+ adjustHeight: l
205
+ }), [l]);
206
+ const d = _((a) => {
207
+ l(), t == null || t(a);
208
208
  });
209
209
  return J(() => {
210
- i();
211
- const f = a.current;
212
- if (!f)
210
+ l();
211
+ const a = i.current;
212
+ if (!a)
213
213
  return;
214
- const m = new ResizeObserver((N) => {
215
- i();
214
+ const x = new ResizeObserver((N) => {
215
+ l();
216
216
  });
217
- return m.observe(f), () => {
218
- m.unobserve(f);
217
+ return x.observe(a), () => {
218
+ x.unobserve(a);
219
219
  };
220
- }, [i]), /* @__PURE__ */ v("textarea", { ...r, style: {
220
+ }, [l]), /* @__PURE__ */ v("textarea", { ...u, style: {
221
221
  overflow: "hidden",
222
222
  // these 2 styles aren't needed if the caller sets them in CSS.
223
223
  resize: "none",
224
224
  ...n,
225
- height: c
226
- }, onInput: d, ref: a });
225
+ height: f
226
+ }, onInput: d, ref: i });
227
227
  });
228
228
  function Ee(e) {
229
- const t = X(), n = e.name ?? t, u = e.valueEquals ?? Object.is, r = e.options ?? [], s = new Y(), a = _((c) => {
230
- const o = Number(c.target.value), i = r[o];
231
- i != null && e.onChange != null && e.onChange({
232
- value: i.value,
229
+ const t = X(), n = e.name ?? t, r = e.valueEquals ?? Object.is, u = e.options ?? [], s = new H(), i = _((f) => {
230
+ const o = Number(f.target.value), l = u[o];
231
+ l != null && e.onChange != null && e.onChange({
232
+ value: l.value,
233
233
  index: o,
234
234
  type: "change",
235
- timeStamp: c.timeStamp,
236
- target: c.target
235
+ timeStamp: f.timeStamp,
236
+ target: f.target
237
237
  });
238
238
  });
239
- return /* @__PURE__ */ v("ul", { className: e.className, children: r.map((c, o) => {
240
- const { value: i, text: d, key: f, itemClassName: m, labelClassName: N, inputClassName: x, textClassName: l, ...g } = c, S = s.fix(c, o);
241
- return e.value !== void 0 && (g.checked = u(i, e.value)), /* @__PURE__ */ v("li", { className: m, "aria-disabled": g.disabled, children: /* @__PURE__ */ L("label", { className: N, children: [
242
- /* @__PURE__ */ v("input", { ...g, className: x, value: o, onChange: a, name: n, type: "radio" }),
243
- /* @__PURE__ */ v("span", { className: l, children: d })
244
- ] }) }, S);
239
+ return /* @__PURE__ */ v("ul", { className: e.className, children: u.map((f, o) => {
240
+ const { value: l, text: d, key: a, itemClassName: x, labelClassName: N, inputClassName: m, textClassName: c, ...g } = f, O = s.fix(f, o);
241
+ return e.value !== void 0 && (g.checked = r(l, e.value)), /* @__PURE__ */ v("li", { className: x, "aria-disabled": g.disabled, children: /* @__PURE__ */ L("label", { className: N, children: [
242
+ /* @__PURE__ */ v("input", { ...g, className: m, value: o, onChange: i, name: n, type: "radio" }),
243
+ /* @__PURE__ */ v("span", { className: c, children: d })
244
+ ] }) }, O);
245
245
  }) });
246
246
  }
247
247
  function U() {
248
248
  return h(null);
249
249
  }
250
- function A(e) {
250
+ function K(e) {
251
251
  e.current != null && (clearTimeout(e.current), e.current = null);
252
252
  }
253
253
  const De = ({
254
254
  value: e,
255
255
  onChange: t,
256
256
  debounce: n = 500,
257
- ...u
257
+ ...r
258
258
  }) => {
259
- const r = U(), s = U();
259
+ const u = U(), s = U();
260
260
  R(() => {
261
- A(s), r.current != null && (r.current.value = e);
261
+ K(s), u.current != null && (u.current.value = e);
262
262
  }, [e]);
263
- const a = () => {
264
- r.current != null && r.current.value !== e && (t == null || t({ value: r.current.value }));
263
+ const i = () => {
264
+ u.current != null && u.current.value !== e && (t == null || t({ value: u.current.value }));
265
265
  };
266
- return /* @__PURE__ */ v("input", { ...u, ref: r, defaultValue: e, onInput: () => {
267
- A(s), s.current = setTimeout(a, n);
266
+ return /* @__PURE__ */ v("input", { ...r, ref: u, defaultValue: e, onInput: () => {
267
+ K(s), s.current = setTimeout(i, n);
268
268
  }, onBlur: () => {
269
- A(s), a();
269
+ K(s), i();
270
270
  } });
271
271
  };
272
272
  function _e({ onClick: e, ...t }) {
@@ -276,49 +276,36 @@ function _e({ onClick: e, ...t }) {
276
276
  }
277
277
  function E(e, t) {
278
278
  const n = e instanceof Date ? e : new Date(e);
279
- let u = `${n.getFullYear()}-${I(n.getMonth() + 1)}-${I(n.getDate())}T${I(n.getHours())}:${I(n.getMinutes())}`;
280
- const r = (t == null ? void 0 : t.milliseconds) || (t == null ? void 0 : t.milliseconds) == null && n.getMilliseconds() !== 0;
281
- return ((t == null ? void 0 : t.seconds) || (t == null ? void 0 : t.seconds) == null && (n.getSeconds() !== 0 || r)) && (u += `:${I(n.getSeconds())}`, r && (u += `.${I(n.getMilliseconds(), 3)}`)), t != null && t.offset && (u += p(-n.getTimezoneOffset())), u;
279
+ let r = `${n.getFullYear()}-${I(n.getMonth() + 1)}-${I(n.getDate())}T${I(n.getHours())}:${I(n.getMinutes())}`;
280
+ const u = (t == null ? void 0 : t.milliseconds) || (t == null ? void 0 : t.milliseconds) == null && n.getMilliseconds() !== 0;
281
+ return ((t == null ? void 0 : t.seconds) || (t == null ? void 0 : t.seconds) == null && (n.getSeconds() !== 0 || u)) && (r += `:${I(n.getSeconds())}`, u && (r += `.${I(n.getMilliseconds(), 3)}`)), t != null && t.offset && (r += p(-n.getTimezoneOffset())), r;
282
282
  }
283
283
  function p(e) {
284
284
  if (e == null)
285
285
  return "";
286
286
  if (e === 0)
287
287
  return "Z";
288
- const t = e > 0 ? "+" : "-", n = Math.floor(Math.abs(e) / 60), u = Math.abs(e) % 60;
289
- return `${t}${I(n)}:${I(u)}`;
288
+ const t = e > 0 ? "+" : "-", n = Math.floor(Math.abs(e) / 60), r = Math.abs(e) % 60;
289
+ return `${t}${I(n)}:${I(r)}`;
290
290
  }
291
- const xe = /^(\d{4}-\d{2}-\d{2}T\d{2}:\d{2}(?::\d{2}(?:\.\d{1,3})?)?)(Z|[+-]\d{2}:\d{2})?$/, ve = { offset: !1, seconds: !1, milliseconds: !1 };
291
+ const me = /^(\d{4}-\d{2}-\d{2}T\d{2}:\d{2}(?::\d{2}(?:\.\d{1,3})?)?)(Z|[+-]\d{2}:\d{2})?$/, ve = { offset: !1, seconds: !1, milliseconds: !1 };
292
292
  function Ne(e) {
293
293
  return e == null || Number.isNaN(e) || e === "" || Number.isNaN(+new Date(e));
294
294
  }
295
295
  function M(e) {
296
296
  if (typeof e == "string") {
297
- const t = e.match(xe);
297
+ const t = e.match(me);
298
298
  if (t)
299
299
  return t[1];
300
300
  }
301
301
  return Ne(e) ? "" : E(e, ve);
302
302
  }
303
303
  const w = { offset: !1 };
304
- function Me({ value: e, defaultValue: t, min: n, max: u, onChange: r, ...s }) {
305
- return e !== void 0 && (s.value = e === null ? "" : E(e, w)), t != null && (s.defaultValue = E(t, w)), n != null && (s.min = E(n, w)), u != null && (s.max = E(u, w)), r != null && (s.onChange = (a) => {
306
- if (a.currentTarget.value.length) {
307
- const c = new Date(a.currentTarget.valueAsNumber);
308
- r({
309
- // TODO: undo this, "date time local" should in fact be local (no time zone)
310
- isoString: E(c, { offset: !0 }),
311
- // isoString: date.toISOString(),
312
- value: c.valueOf(),
313
- date: c
314
- });
315
- } else
316
- r({
317
- // isoStringWithOffset: null,
318
- isoString: null,
319
- value: null,
320
- date: null
321
- });
304
+ function Me({ value: e, defaultValue: t, min: n, max: r, onChange: u, ...s }) {
305
+ return e !== void 0 && (s.value = e === null ? "" : E(e, w)), t != null && (s.defaultValue = E(t, w)), n != null && (s.min = E(n, w)), r != null && (s.max = E(r, w)), u != null && (s.onChange = (i) => {
306
+ u({
307
+ value: i.currentTarget.value
308
+ });
322
309
  }), /* @__PURE__ */ v("input", { type: "datetime-local", ...s });
323
310
  }
324
311
  function ge(e) {
@@ -326,11 +313,11 @@ function ge(e) {
326
313
  return t.current = e, t;
327
314
  }
328
315
  function be(e, t) {
329
- const n = h(e), u = ge(t);
330
- return H(() => {
331
- Object.is(n.current, e) || (u.current(), n.current = e);
332
- }, [u, e]), T((r) => {
333
- n.current = r;
316
+ const n = h(e), r = ge(t);
317
+ return C(() => {
318
+ Object.is(n.current, e) || (r.current(), n.current = e);
319
+ }, [r, e]), T((u) => {
320
+ n.current = u;
334
321
  }, []);
335
322
  }
336
323
  const he = [
@@ -419,45 +406,45 @@ function $(e) {
419
406
  return null;
420
407
  if (t[0] === "Z")
421
408
  return 0;
422
- const [, n, u, r] = t, s = Number(u) * 60 + Number(r);
409
+ const [, n, r, u] = t, s = Number(r) * 60 + Number(u);
423
410
  return n === "+" ? s : -s;
424
411
  }
425
- function K(e) {
412
+ function A(e) {
426
413
  return e === "" ? null : -new Date(e).getTimezoneOffset();
427
414
  }
428
415
  function we({
429
416
  value: e,
430
417
  defaultValue: t,
431
418
  min: n,
432
- max: u,
433
- onChange: r,
419
+ max: r,
420
+ onChange: u,
434
421
  ...s
435
422
  }) {
436
- const [a, c] = D(() => $(e ?? t) !== null), [o, i] = D(() => $(e ?? t)), [d, f] = D(() => M(e ?? t)), m = be(e, () => {
437
- c($(e) !== null), i($(e)), f(M(e));
423
+ const [i, f] = D(() => $(e ?? t) !== null), [o, l] = D(() => $(e ?? t)), [d, a] = D(() => M(e ?? t)), x = be(e, () => {
424
+ f($(e) !== null), l($(e)), a(M(e));
438
425
  }), N = T((b) => {
439
- m(b), r == null || r({
426
+ x(b), u == null || u({
440
427
  value: b
441
428
  });
442
- }, [r, m]);
443
- n != null && (s.min = M(n)), u != null && (s.max = M(u));
444
- const x = a ? o : K(d), l = T(
429
+ }, [u, x]);
430
+ n != null && (s.min = M(n)), r != null && (s.max = M(r));
431
+ const m = i ? o : A(d), c = T(
445
432
  (b) => {
446
- const O = b.currentTarget.value;
447
- f(O), N(O + p(x));
433
+ const S = b.currentTarget.value;
434
+ a(S), N(S + p(m));
448
435
  },
449
- [N, x]
436
+ [N, m]
450
437
  ), g = T(
451
438
  (b) => {
452
- i(b.value), N(d + p(b.value));
439
+ l(b.value), N(d + p(b.value));
453
440
  },
454
441
  [N, d]
455
- ), S = T(
442
+ ), O = T(
456
443
  (b) => {
457
- const O = b.currentTarget.checked;
458
- c(O);
444
+ const S = b.currentTarget.checked;
445
+ f(S);
459
446
  let y;
460
- O ? d && o === null ? (y = K(d), i(y)) : y = o : y = K(d), N(d + p(y));
447
+ S ? d && o === null ? (y = A(d), l(y)) : y = o : y = A(d), N(d + p(y));
461
448
  },
462
449
  [o, d, N]
463
450
  );
@@ -468,52 +455,52 @@ function we({
468
455
  type: "datetime-local",
469
456
  ...s,
470
457
  value: d,
471
- onChange: l
458
+ onChange: c
472
459
  }
473
460
  ),
474
461
  /* @__PURE__ */ v(
475
462
  "input",
476
463
  {
477
464
  type: "checkbox",
478
- title: a ? "Use UTC offset from this device" : "Enable UTC offset selection",
479
- checked: a,
480
- onChange: S
465
+ title: i ? "Use UTC offset from this device" : "Enable UTC offset selection",
466
+ checked: i,
467
+ onChange: O
481
468
  }
482
469
  ),
483
470
  /* @__PURE__ */ v(
484
471
  ie,
485
472
  {
486
- value: x,
473
+ value: m,
487
474
  onChange: g,
488
- disabled: !a,
475
+ disabled: !i,
489
476
  options: he
490
477
  }
491
478
  )
492
479
  ] });
493
480
  }
494
- const $e = k(function({ placeholder: t, formatOnChange: n = me, onChange: u, value: r, ...s }, a) {
495
- const c = {
481
+ const $e = k(function({ placeholder: t, formatOnChange: n = xe, onChange: r, value: u, ...s }, i) {
482
+ const f = {
496
483
  inputMode: "decimal",
497
484
  ...s,
498
485
  formatOnChange: n,
499
486
  type: "number"
500
487
  };
501
- return r !== void 0 && (c.value = j(r)), t != null && (c.placeholder = String(t)), u != null && (c.onChange = (o) => {
502
- u({
488
+ return u !== void 0 && (f.value = Y(u)), t != null && (f.placeholder = String(t)), r != null && (f.onChange = (o) => {
489
+ r({
503
490
  ...o,
504
491
  value: de(o.value)
505
492
  });
506
- }), /* @__PURE__ */ v(z, { ...c, ref: a });
493
+ }), /* @__PURE__ */ v(j, { ...f, ref: i });
507
494
  });
508
495
  export {
509
496
  _e as ActionButton,
510
497
  Me as DatetimeLocalInput,
511
498
  we as DatetimeOffsetInput,
512
499
  De as DebouncedInput,
513
- z as Input,
500
+ j as Input,
514
501
  $e as NumberInput,
515
502
  Ee as RadioMenu,
516
503
  ie as Select,
517
- Oe as TextArea,
518
- Se as TextInput
504
+ Se as TextArea,
505
+ Oe as TextInput
519
506
  };
@@ -1 +1 @@
1
- (function(x,f){typeof exports=="object"&&typeof module<"u"?f(exports,require("react/jsx-runtime"),require("react")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react"],f):(x=typeof globalThis<"u"?globalThis:x||self,f(x["@mpen/react-basic-inputs"]={},x.jsxRuntime,x.React))})(this,function(x,f,r){"use strict";var ve=Object.defineProperty;var be=(x,f,r)=>f in x?ve(x,f,{enumerable:!0,configurable:!0,writable:!0,value:r}):x[f]=r;var L=(x,f,r)=>(be(x,typeof f!="symbol"?f+"":f,r),r);const U=Object.freeze(()=>{});function q(e){return e}let D;typeof window<"u"?D=e=>{r.useDebugValue(e);const t=r.useRef(Y);r.useInsertionEffect(()=>{t.current=e},[e]);const n=r.useRef(null);return n.current||(n.current=function(){return t.current.apply(this,arguments)}),n.current}:D=U;function H(e){return D(e)}function Y(){throw new Error("INVALID_USE_EVENT_INVOCATION: the callback from useEvent cannot be invoked before the component has mounted.")}function z(){var e=r.useRef(!0);return e.current?(e.current=!1,!0):e.current}var p=function(e,t){var n=z();r.useEffect(function(){if(!n)return e()},t)};function G(e,...t){return typeof e=="function"?e(...t):e}function Z(e,t){if(e.uniqueKey!=null)return G(e.uniqueKey,e,t);if(typeof e.value=="string")return e.value;if(typeof e.value=="number")return String(e.value);try{const n=JSON.stringify(e.value);if(n!==void 0)return n}catch{}return String(t)}class K{constructor(){L(this,"_usedKeys",new Map)}fix(t,n){let u=Z(t,n);for(;;){let s=this._usedKeys.get(u);if(s===void 0){this._usedKeys.set(u,1);break}this._usedKeys.set(u,++s),u=`${u}(${s})`}return u}}const B=e=>({value:e,text:String(e),disabled:!0,key:J}),W="3c9369b7-0a5e-46ea-93c2-e8b9fec67fdb",J="1a53f789-77f5-4ce6-a829-b00e563f1ee8";function C({options:e,value:t,invalidValueOption:n=B,onChange:u,placeholder:s,...l}){const a=t==null,i=r.useMemo(()=>t!=null&&e.some(c=>c.value==t),[e,t]),m=r.useMemo(()=>t==null||!n?null:n(t),[n,t]),o=r.useMemo(()=>{if(i)return e;const c=[...e];return a?s!=null&&c.unshift({text:s,hidden:!0,value:null,key:W}):m&&c.push(m),c},[i,e,a,m,s]),v=H(c=>{const g=c.target.selectedIndex,O=o[g];u==null||u({value:O.value,index:g,type:"change",timeStamp:c.timeStamp,target:c.target})}),d=r.useRef(null),b=r.useCallback(()=>{d.current&&(d.current.selectedIndex<0||o[d.current.selectedIndex].value!=t)&&(d.current.selectedIndex=o.findIndex(c=>c.value==t))},[o,t]),I=c=>{d.current=c,b()};p(()=>{b()},[b]);const N=new K;return f.jsx("select",{...l,onChange:v,ref:I,children:o.map((c,g)=>{const{value:O,text:h,uniqueKey:E,...T}=c,P=N.fix(c,g);return r.createElement("option",{...T,key:P,value:P},c.text)})})}function X(e){return e?String(e).replace(/\s+/gu," ").trim():""}function Q(e){try{return e.toLocaleString("en-US",{useGrouping:!1,maximumFractionDigits:20})}catch{return e.toFixed(14).replace(/\.?0+$/,"")}}function R(e){return e?e==="∞"||e==="+∞"?Number.POSITIVE_INFINITY:e==="-∞"?Number.NEGATIVE_INFINITY:Number.parseFloat(e):Number.NaN}function V(e){return Number.isNaN(e)?"":e===Number.POSITIVE_INFINITY?"∞":e===Number.NEGATIVE_INFINITY?"-∞":Q(e)}function ee(e){return e?V(Number.parseFloat(e)):""}function y(e,t=2){return String(e).padStart(t,"0")}const $=r.forwardRef(function({value:t="",onPaste:n,onChange:u,onInput:s,onBlur:l,formatOnChange:a=q,...i},m){const[o,v]=r.useState(t),d=r.useRef(t),b=r.useRef(!1);p(()=>{v(t),b.current=!1,d.current=t},[t]);const I={type:"text",...i,ref:m,value:o,onChange:N=>{v(N.target.value)},onInput:N=>{b.current=!0,s==null||s(N)},onBlur:N=>{const c=a(o);b.current&&(c!==d.current&&(u==null||u({type:"change",value:c,timeStamp:N.timeStamp,target:N.target}),d.current=c),c!==N.target.value&&v(c)),l==null||l(N)}};return f.jsx("input",{...I})});function te({formatOnChange:e=X,...t}){return f.jsx($,{formatOnChange:e,...t,type:"text"})}const ne=r.forwardRef(function({onInput:t,style:n,initialHeight:u="auto",...s},l){const a=r.useRef(null),[i,m]=r.useState(u),o=r.useCallback(()=>{const d=a.current;if(!d)return;d.style.height=u;const b=`${d.scrollHeight}px`;m(b),d.style.height=b},[u]);r.useImperativeHandle(l,()=>({element:a.current,adjustHeight:o}),[o]);const v=D(d=>{o(),t==null||t(d)});return r.useLayoutEffect(()=>{o();const d=a.current;if(!d)return;const b=new ResizeObserver(I=>{o()});return b.observe(d),()=>{b.unobserve(d)}},[o]),f.jsx("textarea",{...s,style:{overflow:"hidden",resize:"none",...n,height:i},onInput:v,ref:a})});function ue(e){const t=r.useId(),n=e.name??t,u=e.valueEquals??Object.is,s=e.options??[],l=new K,a=D(i=>{const m=Number(i.target.value),o=s[m];o!=null&&e.onChange!=null&&e.onChange({value:o.value,index:m,type:"change",timeStamp:i.timeStamp,target:i.target})});return f.jsx("ul",{className:e.className,children:s.map((i,m)=>{const{value:o,text:v,key:d,itemClassName:b,labelClassName:I,inputClassName:N,textClassName:c,...g}=i,O=l.fix(i,m);return e.value!==void 0&&(g.checked=u(o,e.value)),f.jsx("li",{className:b,"aria-disabled":g.disabled,children:f.jsxs("label",{className:I,children:[f.jsx("input",{...g,className:N,value:m,onChange:a,name:n,type:"radio"}),f.jsx("span",{className:c,children:v})]})},O)})})}function j(){return r.useRef(null)}function A(e){e.current!=null&&(clearTimeout(e.current),e.current=null)}const re=({value:e,onChange:t,debounce:n=500,...u})=>{const s=j(),l=j();p(()=>{A(l),s.current!=null&&(s.current.value=e)},[e]);const a=()=>{s.current!=null&&s.current.value!==e&&(t==null||t({value:s.current.value}))};return f.jsx("input",{...u,ref:s,defaultValue:e,onInput:()=>{A(l),l.current=setTimeout(a,n)},onBlur:()=>{A(l),a()}})};function se({onClick:e,...t}){return t.onClick=n=>{n.preventDefault(),e==null||e(n)},f.jsx("button",{type:"button",...t})}function S(e,t){const n=e instanceof Date?e:new Date(e);let u=`${n.getFullYear()}-${y(n.getMonth()+1)}-${y(n.getDate())}T${y(n.getHours())}:${y(n.getMinutes())}`;const s=(t==null?void 0:t.milliseconds)||(t==null?void 0:t.milliseconds)==null&&n.getMilliseconds()!==0;return((t==null?void 0:t.seconds)||(t==null?void 0:t.seconds)==null&&(n.getSeconds()!==0||s))&&(u+=`:${y(n.getSeconds())}`,s&&(u+=`.${y(n.getMilliseconds(),3)}`)),t!=null&&t.offset&&(u+=M(-n.getTimezoneOffset())),u}function M(e){if(e==null)return"";if(e===0)return"Z";const t=e>0?"+":"-",n=Math.floor(Math.abs(e)/60),u=Math.abs(e)%60;return`${t}${y(n)}:${y(u)}`}const le=/^(\d{4}-\d{2}-\d{2}T\d{2}:\d{2}(?::\d{2}(?:\.\d{1,3})?)?)(Z|[+-]\d{2}:\d{2})?$/,fe={offset:!1,seconds:!1,milliseconds:!1};function ce(e){return e==null||Number.isNaN(e)||e===""||Number.isNaN(+new Date(e))}function _(e){if(typeof e=="string"){const t=e.match(le);if(t)return t[1]}return ce(e)?"":S(e,fe)}const w={offset:!1};function ie({value:e,defaultValue:t,min:n,max:u,onChange:s,...l}){return e!==void 0&&(l.value=e===null?"":S(e,w)),t!=null&&(l.defaultValue=S(t,w)),n!=null&&(l.min=S(n,w)),u!=null&&(l.max=S(u,w)),s!=null&&(l.onChange=a=>{if(a.currentTarget.value.length){const i=new Date(a.currentTarget.valueAsNumber);s({isoString:S(i,{offset:!0}),value:i.valueOf(),date:i})}else s({isoString:null,value:null,date:null})}),f.jsx("input",{type:"datetime-local",...l})}function ae(e){const t=r.useRef(e);return t.current=e,t}function oe(e,t){const n=r.useRef(e),u=ae(t);return r.useEffect(()=>{Object.is(n.current,e)||(u.current(),n.current=e)},[u,e]),r.useCallback(s=>{n.current=s},[])}const de=[{value:-12*60,text:"-12:00"},{value:-11*60,text:"-11:00"},{value:-10*60,text:"-10:00"},{value:-9.5*60,text:"-09:30"},{value:-9*60,text:"-09:00"},{value:-8*60,text:"-08:00"},{value:-7*60,text:"-07:00"},{value:-6*60,text:"-06:00"},{value:-5*60,text:"-05:00"},{value:-4*60,text:"-04:00"},{value:-3.5*60,text:"-03:30"},{value:-3*60,text:"-03:00"},{value:-2*60,text:"-02:00"},{value:-1*60,text:"-01:00"},{value:0,text:"±00:00"},{value:1*60,text:"+01:00"},{value:2*60,text:"+02:00"},{value:3*60,text:"+03:00"},{value:3.5*60,text:"+03:30"},{value:4*60,text:"+04:00"},{value:4.5*60,text:"+04:30"},{value:5*60,text:"+05:00"},{value:5.5*60,text:"+05:30"},{value:5.75*60,text:"+05:45"},{value:6*60,text:"+06:00"},{value:6.5*60,text:"+06:30"},{value:7*60,text:"+07:00"},{value:8*60,text:"+08:00"},{value:8.75*60,text:"+08:45"},{value:9*60,text:"+09:00"},{value:9.5*60,text:"+09:30"},{value:10*60,text:"+10:00"},{value:10.5*60,text:"+10:30"},{value:11*60,text:"+11:00"},{value:12*60,text:"+12:00"},{value:12.75*60,text:"+12:45"},{value:13*60,text:"+13:00"},{value:14*60,text:"+14:00"}];function k(e){if(typeof e!="string"||e==="")return null;const t=e.match(/([+-])(\d{2}):(\d{2})|Z$/);if(!t)return null;if(t[0]==="Z")return 0;const[,n,u,s]=t,l=Number(u)*60+Number(s);return n==="+"?l:-l}function F(e){return e===""?null:-new Date(e).getTimezoneOffset()}function xe({value:e,defaultValue:t,min:n,max:u,onChange:s,...l}){const[a,i]=r.useState(()=>k(e??t)!==null),[m,o]=r.useState(()=>k(e??t)),[v,d]=r.useState(()=>_(e??t)),b=oe(e,()=>{i(k(e)!==null),o(k(e)),d(_(e))}),I=r.useCallback(h=>{b(h),s==null||s({value:h})},[s,b]);n!=null&&(l.min=_(n)),u!=null&&(l.max=_(u));const N=a?m:F(v),c=r.useCallback(h=>{const E=h.currentTarget.value;d(E),I(E+M(N))},[I,N]),g=r.useCallback(h=>{o(h.value),I(v+M(h.value))},[I,v]),O=r.useCallback(h=>{const E=h.currentTarget.checked;i(E);let T;E?v&&m===null?(T=F(v),o(T)):T=m:T=F(v),I(v+M(T))},[m,v,I]);return f.jsxs("span",{children:[f.jsx("input",{type:"datetime-local",...l,value:v,onChange:c}),f.jsx("input",{type:"checkbox",title:a?"Use UTC offset from this device":"Enable UTC offset selection",checked:a,onChange:O}),f.jsx(C,{value:N,onChange:g,disabled:!a,options:de})]})}const me=r.forwardRef(function({placeholder:t,formatOnChange:n=ee,onChange:u,value:s,...l},a){const i={inputMode:"decimal",...l,formatOnChange:n,type:"number"};return s!==void 0&&(i.value=V(s)),t!=null&&(i.placeholder=String(t)),u!=null&&(i.onChange=m=>{u({...m,value:R(m.value)})}),f.jsx($,{...i,ref:a})});x.ActionButton=se,x.DatetimeLocalInput=ie,x.DatetimeOffsetInput=xe,x.DebouncedInput=re,x.Input=$,x.NumberInput=me,x.RadioMenu=ue,x.Select=C,x.TextArea=ne,x.TextInput=te,Object.defineProperty(x,Symbol.toStringTag,{value:"Module"})});
1
+ (function(o,f){typeof exports=="object"&&typeof module<"u"?f(exports,require("react/jsx-runtime"),require("react")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react"],f):(o=typeof globalThis<"u"?globalThis:o||self,f(o["@mpen/react-basic-inputs"]={},o.jsxRuntime,o.React))})(this,function(o,f,r){"use strict";var ve=Object.defineProperty;var be=(o,f,r)=>f in o?ve(o,f,{enumerable:!0,configurable:!0,writable:!0,value:r}):o[f]=r;var L=(o,f,r)=>(be(o,typeof f!="symbol"?f+"":f,r),r);const U=Object.freeze(()=>{});function q(e){return e}let E;typeof window<"u"?E=e=>{r.useDebugValue(e);const t=r.useRef(Y);r.useInsertionEffect(()=>{t.current=e},[e]);const n=r.useRef(null);return n.current||(n.current=function(){return t.current.apply(this,arguments)}),n.current}:E=U;function H(e){return E(e)}function Y(){throw new Error("INVALID_USE_EVENT_INVOCATION: the callback from useEvent cannot be invoked before the component has mounted.")}function z(){var e=r.useRef(!0);return e.current?(e.current=!1,!0):e.current}var p=function(e,t){var n=z();r.useEffect(function(){if(!n)return e()},t)};function G(e,...t){return typeof e=="function"?e(...t):e}function Z(e,t){if(e.uniqueKey!=null)return G(e.uniqueKey,e,t);if(typeof e.value=="string")return e.value;if(typeof e.value=="number")return String(e.value);try{const n=JSON.stringify(e.value);if(n!==void 0)return n}catch{}return String(t)}class K{constructor(){L(this,"_usedKeys",new Map)}fix(t,n){let u=Z(t,n);for(;;){let s=this._usedKeys.get(u);if(s===void 0){this._usedKeys.set(u,1);break}this._usedKeys.set(u,++s),u=`${u}(${s})`}return u}}const B=e=>({value:e,text:String(e),disabled:!0,key:J}),W="3c9369b7-0a5e-46ea-93c2-e8b9fec67fdb",J="1a53f789-77f5-4ce6-a829-b00e563f1ee8";function C({options:e,value:t,invalidValueOption:n=B,onChange:u,placeholder:s,...l}){const d=t==null,x=r.useMemo(()=>t!=null&&e.some(c=>c.value==t),[e,t]),m=r.useMemo(()=>t==null||!n?null:n(t),[n,t]),i=r.useMemo(()=>{if(x)return e;const c=[...e];return d?s!=null&&c.unshift({text:s,hidden:!0,value:null,key:W}):m&&c.push(m),c},[x,e,d,m,s]),v=H(c=>{const h=c.target.selectedIndex,S=i[h];u==null||u({value:S.value,index:h,type:"change",timeStamp:c.timeStamp,target:c.target})}),a=r.useRef(null),b=r.useCallback(()=>{a.current&&(a.current.selectedIndex<0||i[a.current.selectedIndex].value!=t)&&(a.current.selectedIndex=i.findIndex(c=>c.value==t))},[i,t]),I=c=>{a.current=c,b()};p(()=>{b()},[b]);const N=new K;return f.jsx("select",{...l,onChange:v,ref:I,children:i.map((c,h)=>{const{value:S,text:g,uniqueKey:O,...T}=c,P=N.fix(c,h);return r.createElement("option",{...T,key:P,value:P},c.text)})})}function X(e){return e?String(e).replace(/\s+/gu," ").trim():""}function Q(e){try{return e.toLocaleString("en-US",{useGrouping:!1,maximumFractionDigits:20})}catch{return e.toFixed(14).replace(/\.?0+$/,"")}}function R(e){return e?e==="∞"||e==="+∞"?Number.POSITIVE_INFINITY:e==="-∞"?Number.NEGATIVE_INFINITY:Number.parseFloat(e):Number.NaN}function V(e){return Number.isNaN(e)?"":e===Number.POSITIVE_INFINITY?"∞":e===Number.NEGATIVE_INFINITY?"-∞":Q(e)}function ee(e){return e?V(Number.parseFloat(e)):""}function y(e,t=2){return String(e).padStart(t,"0")}const $=r.forwardRef(function({value:t="",onPaste:n,onChange:u,onInput:s,onBlur:l,formatOnChange:d=q,...x},m){const[i,v]=r.useState(t),a=r.useRef(t),b=r.useRef(!1);p(()=>{v(t),b.current=!1,a.current=t},[t]);const I={type:"text",...x,ref:m,value:i,onChange:N=>{v(N.target.value)},onInput:N=>{b.current=!0,s==null||s(N)},onBlur:N=>{const c=d(i);b.current&&(c!==a.current&&(u==null||u({type:"change",value:c,timeStamp:N.timeStamp,target:N.target}),a.current=c),c!==N.target.value&&v(c)),l==null||l(N)}};return f.jsx("input",{...I})});function te({formatOnChange:e=X,...t}){return f.jsx($,{formatOnChange:e,...t,type:"text"})}const ne=r.forwardRef(function({onInput:t,style:n,initialHeight:u="auto",...s},l){const d=r.useRef(null),[x,m]=r.useState(u),i=r.useCallback(()=>{const a=d.current;if(!a)return;a.style.height=u;const b=`${a.scrollHeight}px`;m(b),a.style.height=b},[u]);r.useImperativeHandle(l,()=>({element:d.current,adjustHeight:i}),[i]);const v=E(a=>{i(),t==null||t(a)});return r.useLayoutEffect(()=>{i();const a=d.current;if(!a)return;const b=new ResizeObserver(I=>{i()});return b.observe(a),()=>{b.unobserve(a)}},[i]),f.jsx("textarea",{...s,style:{overflow:"hidden",resize:"none",...n,height:x},onInput:v,ref:d})});function ue(e){const t=r.useId(),n=e.name??t,u=e.valueEquals??Object.is,s=e.options??[],l=new K,d=E(x=>{const m=Number(x.target.value),i=s[m];i!=null&&e.onChange!=null&&e.onChange({value:i.value,index:m,type:"change",timeStamp:x.timeStamp,target:x.target})});return f.jsx("ul",{className:e.className,children:s.map((x,m)=>{const{value:i,text:v,key:a,itemClassName:b,labelClassName:I,inputClassName:N,textClassName:c,...h}=x,S=l.fix(x,m);return e.value!==void 0&&(h.checked=u(i,e.value)),f.jsx("li",{className:b,"aria-disabled":h.disabled,children:f.jsxs("label",{className:I,children:[f.jsx("input",{...h,className:N,value:m,onChange:d,name:n,type:"radio"}),f.jsx("span",{className:c,children:v})]})},S)})})}function j(){return r.useRef(null)}function A(e){e.current!=null&&(clearTimeout(e.current),e.current=null)}const re=({value:e,onChange:t,debounce:n=500,...u})=>{const s=j(),l=j();p(()=>{A(l),s.current!=null&&(s.current.value=e)},[e]);const d=()=>{s.current!=null&&s.current.value!==e&&(t==null||t({value:s.current.value}))};return f.jsx("input",{...u,ref:s,defaultValue:e,onInput:()=>{A(l),l.current=setTimeout(d,n)},onBlur:()=>{A(l),d()}})};function se({onClick:e,...t}){return t.onClick=n=>{n.preventDefault(),e==null||e(n)},f.jsx("button",{type:"button",...t})}function D(e,t){const n=e instanceof Date?e:new Date(e);let u=`${n.getFullYear()}-${y(n.getMonth()+1)}-${y(n.getDate())}T${y(n.getHours())}:${y(n.getMinutes())}`;const s=(t==null?void 0:t.milliseconds)||(t==null?void 0:t.milliseconds)==null&&n.getMilliseconds()!==0;return((t==null?void 0:t.seconds)||(t==null?void 0:t.seconds)==null&&(n.getSeconds()!==0||s))&&(u+=`:${y(n.getSeconds())}`,s&&(u+=`.${y(n.getMilliseconds(),3)}`)),t!=null&&t.offset&&(u+=M(-n.getTimezoneOffset())),u}function M(e){if(e==null)return"";if(e===0)return"Z";const t=e>0?"+":"-",n=Math.floor(Math.abs(e)/60),u=Math.abs(e)%60;return`${t}${y(n)}:${y(u)}`}const le=/^(\d{4}-\d{2}-\d{2}T\d{2}:\d{2}(?::\d{2}(?:\.\d{1,3})?)?)(Z|[+-]\d{2}:\d{2})?$/,fe={offset:!1,seconds:!1,milliseconds:!1};function ce(e){return e==null||Number.isNaN(e)||e===""||Number.isNaN(+new Date(e))}function _(e){if(typeof e=="string"){const t=e.match(le);if(t)return t[1]}return ce(e)?"":D(e,fe)}const w={offset:!1};function ie({value:e,defaultValue:t,min:n,max:u,onChange:s,...l}){return e!==void 0&&(l.value=e===null?"":D(e,w)),t!=null&&(l.defaultValue=D(t,w)),n!=null&&(l.min=D(n,w)),u!=null&&(l.max=D(u,w)),s!=null&&(l.onChange=d=>{s({value:d.currentTarget.value})}),f.jsx("input",{type:"datetime-local",...l})}function ae(e){const t=r.useRef(e);return t.current=e,t}function oe(e,t){const n=r.useRef(e),u=ae(t);return r.useEffect(()=>{Object.is(n.current,e)||(u.current(),n.current=e)},[u,e]),r.useCallback(s=>{n.current=s},[])}const de=[{value:-12*60,text:"-12:00"},{value:-11*60,text:"-11:00"},{value:-10*60,text:"-10:00"},{value:-9.5*60,text:"-09:30"},{value:-9*60,text:"-09:00"},{value:-8*60,text:"-08:00"},{value:-7*60,text:"-07:00"},{value:-6*60,text:"-06:00"},{value:-5*60,text:"-05:00"},{value:-4*60,text:"-04:00"},{value:-3.5*60,text:"-03:30"},{value:-3*60,text:"-03:00"},{value:-2*60,text:"-02:00"},{value:-1*60,text:"-01:00"},{value:0,text:"±00:00"},{value:1*60,text:"+01:00"},{value:2*60,text:"+02:00"},{value:3*60,text:"+03:00"},{value:3.5*60,text:"+03:30"},{value:4*60,text:"+04:00"},{value:4.5*60,text:"+04:30"},{value:5*60,text:"+05:00"},{value:5.5*60,text:"+05:30"},{value:5.75*60,text:"+05:45"},{value:6*60,text:"+06:00"},{value:6.5*60,text:"+06:30"},{value:7*60,text:"+07:00"},{value:8*60,text:"+08:00"},{value:8.75*60,text:"+08:45"},{value:9*60,text:"+09:00"},{value:9.5*60,text:"+09:30"},{value:10*60,text:"+10:00"},{value:10.5*60,text:"+10:30"},{value:11*60,text:"+11:00"},{value:12*60,text:"+12:00"},{value:12.75*60,text:"+12:45"},{value:13*60,text:"+13:00"},{value:14*60,text:"+14:00"}];function k(e){if(typeof e!="string"||e==="")return null;const t=e.match(/([+-])(\d{2}):(\d{2})|Z$/);if(!t)return null;if(t[0]==="Z")return 0;const[,n,u,s]=t,l=Number(u)*60+Number(s);return n==="+"?l:-l}function F(e){return e===""?null:-new Date(e).getTimezoneOffset()}function xe({value:e,defaultValue:t,min:n,max:u,onChange:s,...l}){const[d,x]=r.useState(()=>k(e??t)!==null),[m,i]=r.useState(()=>k(e??t)),[v,a]=r.useState(()=>_(e??t)),b=oe(e,()=>{x(k(e)!==null),i(k(e)),a(_(e))}),I=r.useCallback(g=>{b(g),s==null||s({value:g})},[s,b]);n!=null&&(l.min=_(n)),u!=null&&(l.max=_(u));const N=d?m:F(v),c=r.useCallback(g=>{const O=g.currentTarget.value;a(O),I(O+M(N))},[I,N]),h=r.useCallback(g=>{i(g.value),I(v+M(g.value))},[I,v]),S=r.useCallback(g=>{const O=g.currentTarget.checked;x(O);let T;O?v&&m===null?(T=F(v),i(T)):T=m:T=F(v),I(v+M(T))},[m,v,I]);return f.jsxs("span",{children:[f.jsx("input",{type:"datetime-local",...l,value:v,onChange:c}),f.jsx("input",{type:"checkbox",title:d?"Use UTC offset from this device":"Enable UTC offset selection",checked:d,onChange:S}),f.jsx(C,{value:N,onChange:h,disabled:!d,options:de})]})}const me=r.forwardRef(function({placeholder:t,formatOnChange:n=ee,onChange:u,value:s,...l},d){const x={inputMode:"decimal",...l,formatOnChange:n,type:"number"};return s!==void 0&&(x.value=V(s)),t!=null&&(x.placeholder=String(t)),u!=null&&(x.onChange=m=>{u({...m,value:R(m.value)})}),f.jsx($,{...x,ref:d})});o.ActionButton=se,o.DatetimeLocalInput=ie,o.DatetimeOffsetInput=xe,o.DebouncedInput=re,o.Input=$,o.NumberInput=me,o.RadioMenu=ue,o.Select=C,o.TextArea=ne,o.TextInput=te,Object.defineProperty(o,Symbol.toStringTag,{value:"Module"})});
package/package.json CHANGED
@@ -1,9 +1,11 @@
1
1
  {
2
2
  "name": "@mpen/react-basic-inputs",
3
3
  "private": false,
4
- "version": "0.3.1",
4
+ "version": "0.3.3",
5
5
  "type": "module",
6
- "files": ["dist"],
6
+ "files": [
7
+ "dist"
8
+ ],
7
9
  "exports": {
8
10
  ".": {
9
11
  "import": "./dist/react-basic-inputs.js",
@@ -21,7 +23,8 @@
21
23
  "preview": "bun run --bun vite preview",
22
24
  "_prepublishOnly": "bun run --bun build",
23
25
  "_publish": "npm publish --access=public",
24
- "build:docs": "typedoc && hg addremove docs"
26
+ "build:docs": "typedoc && hg addremove docs",
27
+ "bump": "npm version patch && bun.exe run build && npm publish"
25
28
  },
26
29
  "peerDependencies": {
27
30
  "react": "^18.2.0"