UNPKG

react-typed-date

Version:

![npm version](https://img.shields.io/npm/v/react-typed-date) ![license](https://img.shields.io/badge/license-MIT-green) ![bundle size](https://img.shields.io/bundlephobia/minzip/react-typed-date)

754 lines (751 loc) 25.7 kB
import je, { useState as ye, useRef as Q, useMemo as ie, useEffect as Ee, useCallback as Te } from "react"; const ce = (r, p) => r === 2 ? Oe(p) ? 29 : 28 : [4, 6, 9, 11].includes(r) ? 30 : 31, Oe = (r) => r % 4 === 0 && r % 100 !== 0 || r % 400 === 0, Ce = (r, p, k) => { if (r < 100) return !1; const w = new Date(r, p - 1, k); return w.getFullYear() === r && w.getMonth() === p - 1 && w.getDate() === k; }, Ye = (r, p) => r === null ? "_".repeat(p) : String(r).padStart(p, "0"), Ne = (r, p) => r >= 0 && r <= 23 && p >= 0 && p <= 59; function De({ value: r, onChange: p, format: k = "MM/DD/YYYY" }) { const [w, S] = ye( r ? { year: r.getFullYear(), month: r.getMonth() + 1, day: r.getDate(), hour: r.getHours(), minute: r.getMinutes(), second: r.getSeconds() } : { year: null, month: null, day: null, hour: null, minute: null, second: null } ), [y, M] = ye(0), [R, _] = ye(""), j = Q(null), U = Q({ month: r ? r.getMonth() + 1 : null, day: r ? r.getDate() : null, year: r ? r.getFullYear() : null, hour: r ? r.getHours() : null, minute: r ? r.getMinutes() : null, second: r ? r.getSeconds() : null }), re = Q(""), H = Q(!1), fe = ie(() => { var h, c; const t = k.split(/[\s]+/), a = t[0] || k, s = t[1], m = ((h = a.match(/[^A-Za-z]/)) == null ? void 0 : h[0]) || "/", u = ((c = s == null ? void 0 : s.match(/[^A-Za-z]/)) == null ? void 0 : c[0]) || ":", g = a.split(/[^A-Za-z]/), f = s ? s.split(/[^A-Za-z]/) : [], b = [ ...g.map((l) => l.startsWith("M") ? "month" : l.startsWith("D") ? "day" : l.startsWith("Y") ? "year" : "month"), ...f.map((l) => l.startsWith("H") || l.startsWith("h") ? "hour" : l.startsWith("m") ? "minute" : l.startsWith("s") ? "second" : "hour") ]; return { dateSeparator: m, timeSeparator: u, segmentOrder: b, hasTime: f.length > 0 }; }, [k]), { dateSeparator: z, timeSeparator: B, segmentOrder: x, hasTime: Y } = fe, C = ie(() => { const t = []; let a = 0; return x.forEach((s, m) => { const u = s === "year" ? 4 : 2; if (t.push({ start: a, end: a + u }), m < x.length - 1) { const g = x[m + 1], f = s === "hour" || s === "minute", b = g === "hour" || g === "minute"; !f && b ? a += u + 1 : f && b ? a += u + B.length : a += u + z.length; } else a += u; }), t; }, [x, z, B]), de = ie( () => x.map((t) => t === "year" ? 4 : 2), [x] ); Ee(() => { if (H.current) return; H.current = !0; const t = r ? r.getMonth() + 1 : null, a = r ? r.getDate() : null, s = r ? r.getFullYear() : null, m = r ? r.getHours() : null, u = r ? r.getMinutes() : null, g = r ? r.getSeconds() : null; U.current = { month: t, day: a, year: s, hour: m, minute: u, second: g }, S({ year: s, month: t, day: a, hour: m, minute: u, second: g }), H.current = !1; }, [r]); const L = Te( (t, a, s, m = null, u = null, g = null) => { if (H.current) return; const f = t; let b = a; const h = s, c = m, l = u, O = g; if (f !== null && h !== null && b !== null) { const N = ce(f, h); b = Math.min(b, N); } if (U.current = { month: f, day: b, year: h, hour: c, minute: l, second: O }, S({ year: h, month: f, day: b, hour: c, minute: l, second: O }), f !== null && b !== null && h !== null && h >= 1e3 && Ce(h, f, b)) { const N = Y ? c ?? 0 : 0, $ = Y ? l ?? 0 : 0, se = Y ? O ?? 0 : 0; (!Y || Ne(N, $)) && (p == null || p( new Date( h, f - 1, b, N, $, se ) )); } }, [p, Y] ), v = Te( (t, a) => { if (H.current) return; const { month: s, day: m, year: u, hour: g, minute: f, second: b } = U.current; let h = s, c = m, l = u, O = g, N = f, $ = b; t === "month" ? h = a : t === "day" ? c = a : t === "year" ? l = a : t === "hour" ? O = a : t === "minute" ? N = a : t === "second" && ($ = a), L( h, c, l, O, N, $ ); }, [L] ), J = (t) => t === "month" ? w.month : t === "day" ? w.day : t === "year" ? w.year : t === "hour" ? w.hour : t === "minute" ? w.minute : w.second, ne = (t) => { const a = x[t], s = a === "year" ? 4 : 2; return y === t && R !== "" ? R.padEnd(s, "_") : Ye(J(a), s); }, G = ie(() => { const t = [], a = []; x.forEach((u, g) => { const f = ne(g); u === "hour" || u === "minute" || u === "second" ? a.push(f) : t.push(f); }); const s = t.join(z), m = a.join(B); return Y ? `${s} ${m}` : s; }, [x, z, B, Y, w]); Ee(() => { if (j.current) { const t = C[y]; R !== "" ? j.current.setSelectionRange( t.start, t.start + R.length ) : j.current.setSelectionRange(t.start, t.end); } }, [y, G, R, C]); const oe = (t) => { if (j.current) { const a = j.current.selectionStart; if (a !== null) for (let s = 0; s < C.length; s++) { const { start: m, end: u } = C[s]; if (a >= m && a <= u) { t.preventDefault(), y === s || (M(s), _("")), j.current.setSelectionRange(m, u); break; } } } }, W = Q(!1), I = (t) => { const a = t.key; if (a === "Tab") { if (W.current = !0, t.shiftKey && y > 0) { t.preventDefault(), _(""), M((s) => s - 1); return; } else if (!t.shiftKey && y < C.length - 1) { t.preventDefault(), _(""), M((s) => s + 1); return; } _(""); return; } if (a === "ArrowLeft") { t.preventDefault(), _(""), M((s) => s > 0 ? s - 1 : 0); return; } if (a === "ArrowRight") { t.preventDefault(), _(""), M( (s) => s < C.length - 1 ? s + 1 : C.length - 1 ); return; } if (a === "ArrowUp" || a === "ArrowDown") { t.preventDefault(), _(""); const { month: s, day: m, year: u, hour: g, minute: f, second: b } = U.current, h = x[y]; if (h === "month") { const c = s ?? 0, l = a === "ArrowUp" ? Math.min(c + 1, 12) : Math.max(c - 1, 1); l !== c && v("month", l); } else if (h === "day") { const c = m ?? 0, l = s !== null && u !== null ? ce(s, u) : 31, O = a === "ArrowUp" ? Math.min(c + 1, l) : Math.max(c - 1, 1); O !== c && v("day", O); } else if (h === "year") { const c = u ?? 0, l = a === "ArrowUp" ? Math.min(c + 1, 9999) : Math.max(c - 1, 1e3); l !== c && v("year", l); } else if (h === "hour") { const c = g ?? 0, l = a === "ArrowUp" ? Math.min(c + 1, 23) : Math.max(c - 1, 0); l !== c && v("hour", l); } else if (h === "minute") { const c = f ?? 0, l = a === "ArrowUp" ? Math.min(c + 1, 59) : Math.max(c - 1, 0); l !== c && v("minute", l); } else if (h === "second") { const c = b ?? 0, l = a === "ArrowUp" ? Math.min(c + 1, 59) : Math.max(c - 1, 0); l !== c && v("second", l); } return; } if (/^\d$/.test(a)) { t.preventDefault(); const s = x[y], m = de[y], u = R + a; if (u.length <= m) { _(u); const g = parseInt(u, 10), { month: f, year: b } = U.current; if (s === "month") v("month", Math.min(g, 12)); else if (s === "day") { const h = f !== null && b !== null ? ce(f, b) : 31; v("day", Math.min(g, h)); } else s === "year" ? u.length < 4 ? (re.current = u, v("year", g)) : (re.current = "", v("year", Math.min(Math.max(g, 1e3), 9999))) : s === "hour" ? v("hour", Math.min(g, 23)) : s === "minute" ? v("minute", Math.min(g, 59)) : s === "second" && v("second", Math.min(g, 59)); u.length === m && (_(""), y < C.length - 1 && M(y + 1)); } return; } }, K = (t) => { t.preventDefault(); }, X = () => { if (W.current) { W.current = !1, M(0), _(""); const { start: t, end: a } = C[0]; setTimeout(() => { var s; (s = j.current) == null || s.setSelectionRange(t, a); }, 0); } }; return Ee(() => { const t = (a) => { a.key === "Tab" && (W.current = !0, setTimeout(() => { W.current = !1; }, 100)); }; return document.addEventListener("keydown", t), () => { document.removeEventListener("keydown", t); }; }, []), { inputProps: { ref: j, type: "text", value: G, onChange: K, onKeyDown: I, onMouseUp: oe, onBlur: () => { if (R) { const t = x[y], a = parseInt(R, 10); if (t === "month") v("month", Math.min(a, 12)); else if (t === "day") { const { month: s, year: m } = U.current, u = s !== null && m !== null ? ce(s, m) : 31; v("day", Math.min(a, u)); } else t === "year" ? v("year", a) : t === "hour" ? v("hour", Math.min(a, 23)) : t === "minute" ? v("minute", Math.min(a, 59)) : t === "second" && v("second", Math.min(a, 59)); _(""); } }, onFocus: X } }; } var le = { exports: {} }, ee = {}; /** * @license React * react-jsx-runtime.production.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var Re; function Pe() { if (Re) return ee; Re = 1; var r = Symbol.for("react.transitional.element"), p = Symbol.for("react.fragment"); function k(w, S, y) { var M = null; if (y !== void 0 && (M = "" + y), S.key !== void 0 && (M = "" + S.key), "key" in S) { y = {}; for (var R in S) R !== "key" && (y[R] = S[R]); } else y = S; return S = y.ref, { $$typeof: r, type: w, key: M, ref: S !== void 0 ? S : null, props: y }; } return ee.Fragment = p, ee.jsx = k, ee.jsxs = k, ee; } var te = {}; /** * @license React * react-jsx-runtime.development.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var _e; function Ue() { return _e || (_e = 1, process.env.NODE_ENV !== "production" && function() { function r(e) { if (e == null) return null; if (typeof e == "function") return e.$$typeof === m ? null : e.displayName || e.name || null; if (typeof e == "string") return e; switch (e) { case J: return "Fragment"; case v: return "Portal"; case G: return "Profiler"; case ne: return "StrictMode"; case K: return "Suspense"; case X: return "SuspenseList"; } if (typeof e == "object") switch (typeof e.tag == "number" && console.error( "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue." ), e.$$typeof) { case W: return (e.displayName || "Context") + ".Provider"; case oe: return (e._context.displayName || "Context") + ".Consumer"; case I: var n = e.render; return e = e.displayName, e || (e = n.displayName || n.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e; case ae: return n = e.displayName || null, n !== null ? n : r(e.type) || "Memo"; case t: n = e._payload, e = e._init; try { return r(e(n)); } catch { } } return null; } function p(e) { return "" + e; } function k(e) { try { p(e); var n = !1; } catch { n = !0; } if (n) { n = console; var o = n.error, d = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object"; return o.call( n, "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.", d ), p(e); } } function w() { } function S() { if (c === 0) { l = console.log, O = console.info, N = console.warn, $ = console.error, se = console.group, pe = console.groupCollapsed, be = console.groupEnd; var e = { configurable: !0, enumerable: !0, value: w, writable: !0 }; Object.defineProperties(console, { info: e, log: e, warn: e, error: e, group: e, groupCollapsed: e, groupEnd: e }); } c++; } function y() { if (c--, c === 0) { var e = { configurable: !0, enumerable: !0, writable: !0 }; Object.defineProperties(console, { log: f({}, e, { value: l }), info: f({}, e, { value: O }), warn: f({}, e, { value: N }), error: f({}, e, { value: $ }), group: f({}, e, { value: se }), groupCollapsed: f({}, e, { value: pe }), groupEnd: f({}, e, { value: be }) }); } 0 > c && console.error( "disabledDepth fell below zero. This is a bug in React. Please file an issue." ); } function M(e) { if (me === void 0) try { throw Error(); } catch (o) { var n = o.stack.trim().match(/\n( *(at )?)/); me = n && n[1] || "", ve = -1 < o.stack.indexOf(` at`) ? " (<anonymous>)" : -1 < o.stack.indexOf("@") ? "@unknown:0:0" : ""; } return ` ` + me + e + ve; } function R(e, n) { if (!e || he) return ""; var o = ge.get(e); if (o !== void 0) return o; he = !0, o = Error.prepareStackTrace, Error.prepareStackTrace = void 0; var d = null; d = u.H, u.H = null, S(); try { var T = { DetermineComponentFrameRoot: function() { try { if (n) { var V = function() { throw Error(); }; if (Object.defineProperty(V.prototype, "props", { set: function() { throw Error(); } }), typeof Reflect == "object" && Reflect.construct) { try { Reflect.construct(V, []); } catch (P) { var ue = P; } Reflect.construct(e, [], V); } else { try { V.call(); } catch (P) { ue = P; } e.call(V.prototype); } } else { try { throw Error(); } catch (P) { ue = P; } (V = e()) && typeof V.catch == "function" && V.catch(function() { }); } } catch (P) { if (P && ue && typeof P.stack == "string") return [P.stack, ue.stack]; } return [null, null]; } }; T.DetermineComponentFrameRoot.displayName = "DetermineComponentFrameRoot"; var E = Object.getOwnPropertyDescriptor( T.DetermineComponentFrameRoot, "name" ); E && E.configurable && Object.defineProperty( T.DetermineComponentFrameRoot, "name", { value: "DetermineComponentFrameRoot" } ); var i = T.DetermineComponentFrameRoot(), D = i[0], q = i[1]; if (D && q) { var A = D.split(` `), F = q.split(` `); for (i = E = 0; E < A.length && !A[E].includes( "DetermineComponentFrameRoot" ); ) E++; for (; i < F.length && !F[i].includes( "DetermineComponentFrameRoot" ); ) i++; if (E === A.length || i === F.length) for (E = A.length - 1, i = F.length - 1; 1 <= E && 0 <= i && A[E] !== F[i]; ) i--; for (; 1 <= E && 0 <= i; E--, i--) if (A[E] !== F[i]) { if (E !== 1 || i !== 1) do if (E--, i--, 0 > i || A[E] !== F[i]) { var Z = ` ` + A[E].replace( " at new ", " at " ); return e.displayName && Z.includes("<anonymous>") && (Z = Z.replace("<anonymous>", e.displayName)), typeof e == "function" && ge.set(e, Z), Z; } while (1 <= E && 0 <= i); break; } } } finally { he = !1, u.H = d, y(), Error.prepareStackTrace = o; } return A = (A = e ? e.displayName || e.name : "") ? M(A) : "", typeof e == "function" && ge.set(e, A), A; } function _(e) { if (e == null) return ""; if (typeof e == "function") { var n = e.prototype; return R( e, !(!n || !n.isReactComponent) ); } if (typeof e == "string") return M(e); switch (e) { case K: return M("Suspense"); case X: return M("SuspenseList"); } if (typeof e == "object") switch (e.$$typeof) { case I: return e = R(e.render, !1), e; case ae: return _(e.type); case t: n = e._payload, e = e._init; try { return _(e(n)); } catch { } } return ""; } function j() { var e = u.A; return e === null ? null : e.getOwner(); } function U(e) { if (g.call(e, "key")) { var n = Object.getOwnPropertyDescriptor(e, "key").get; if (n && n.isReactWarning) return !1; } return e.key !== void 0; } function re(e, n) { function o() { we || (we = !0, console.error( "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)", n )); } o.isReactWarning = !0, Object.defineProperty(e, "key", { get: o, configurable: !0 }); } function H() { var e = r(this.type); return Se[e] || (Se[e] = !0, console.error( "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release." )), e = this.props.ref, e !== void 0 ? e : null; } function fe(e, n, o, d, T, E) { return o = E.ref, e = { $$typeof: L, type: e, key: n, props: E, _owner: T }, (o !== void 0 ? o : null) !== null ? Object.defineProperty(e, "ref", { enumerable: !1, get: H }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", { configurable: !1, enumerable: !1, writable: !0, value: 0 }), Object.defineProperty(e, "_debugInfo", { configurable: !1, enumerable: !1, writable: !0, value: null }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e; } function z(e, n, o, d, T, E) { if (typeof e == "string" || typeof e == "function" || e === J || e === G || e === ne || e === K || e === X || e === a || typeof e == "object" && e !== null && (e.$$typeof === t || e.$$typeof === ae || e.$$typeof === W || e.$$typeof === oe || e.$$typeof === I || e.$$typeof === b || e.getModuleId !== void 0)) { var i = n.children; if (i !== void 0) if (d) if (h(i)) { for (d = 0; d < i.length; d++) B(i[d], e); Object.freeze && Object.freeze(i); } else console.error( "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead." ); else B(i, e); } else i = "", (e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (i += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports."), e === null ? d = "null" : h(e) ? d = "array" : e !== void 0 && e.$$typeof === L ? (d = "<" + (r(e.type) || "Unknown") + " />", i = " Did you accidentally export a JSX literal instead of a component?") : d = typeof e, console.error( "React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", d, i ); if (g.call(n, "key")) { i = r(e); var D = Object.keys(n).filter(function(A) { return A !== "key"; }); d = 0 < D.length ? "{key: someKey, " + D.join(": ..., ") + ": ...}" : "{key: someKey}", Me[i + d] || (D = 0 < D.length ? "{" + D.join(": ..., ") + ": ...}" : "{}", console.error( `A props object containing a "key" prop is being spread into JSX: let props = %s; <%s {...props} /> React keys must be passed directly to JSX without using spread: let props = %s; <%s key={someKey} {...props} />`, d, i, D, i ), Me[i + d] = !0); } if (i = null, o !== void 0 && (k(o), i = "" + o), U(n) && (k(n.key), i = "" + n.key), "key" in n) { o = {}; for (var q in n) q !== "key" && (o[q] = n[q]); } else o = n; return i && re( o, typeof e == "function" ? e.displayName || e.name || "Unknown" : e ), fe(e, i, E, T, j(), o); } function B(e, n) { if (typeof e == "object" && e && e.$$typeof !== ke) { if (h(e)) for (var o = 0; o < e.length; o++) { var d = e[o]; x(d) && Y(d, n); } else if (x(e)) e._store && (e._store.validated = 1); else if (e === null || typeof e != "object" ? o = null : (o = s && e[s] || e["@@iterator"], o = typeof o == "function" ? o : null), typeof o == "function" && o !== e.entries && (o = o.call(e), o !== e)) for (; !(e = o.next()).done; ) x(e.value) && Y(e.value, n); } } function x(e) { return typeof e == "object" && e !== null && e.$$typeof === L; } function Y(e, n) { if (e._store && !e._store.validated && e.key == null && (e._store.validated = 1, n = C(n), !xe[n])) { xe[n] = !0; var o = ""; e && e._owner != null && e._owner !== j() && (o = null, typeof e._owner.tag == "number" ? o = r(e._owner.type) : typeof e._owner.name == "string" && (o = e._owner.name), o = " It was passed a child from " + o + "."); var d = u.getCurrentStack; u.getCurrentStack = function() { var T = _(e.type); return d && (T += d() || ""), T; }, console.error( 'Each child in a list should have a unique "key" prop.%s%s See https://react.dev/link/warning-keys for more information.', n, o ), u.getCurrentStack = d; } } function C(e) { var n = "", o = j(); return o && (o = r(o.type)) && (n = ` Check the render method of \`` + o + "`."), n || (e = r(e)) && (n = ` Check the top-level render call using <` + e + ">."), n; } var de = je, L = Symbol.for("react.transitional.element"), v = Symbol.for("react.portal"), J = Symbol.for("react.fragment"), ne = Symbol.for("react.strict_mode"), G = Symbol.for("react.profiler"), oe = Symbol.for("react.consumer"), W = Symbol.for("react.context"), I = Symbol.for("react.forward_ref"), K = Symbol.for("react.suspense"), X = Symbol.for("react.suspense_list"), ae = Symbol.for("react.memo"), t = Symbol.for("react.lazy"), a = Symbol.for("react.offscreen"), s = Symbol.iterator, m = Symbol.for("react.client.reference"), u = de.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, g = Object.prototype.hasOwnProperty, f = Object.assign, b = Symbol.for("react.client.reference"), h = Array.isArray, c = 0, l, O, N, $, se, pe, be; w.__reactDisabledLog = !0; var me, ve, he = !1, ge = new (typeof WeakMap == "function" ? WeakMap : Map)(), ke = Symbol.for("react.client.reference"), we, Se = {}, Me = {}, xe = {}; te.Fragment = J, te.jsx = function(e, n, o, d, T) { return z(e, n, o, !1, d, T); }, te.jsxs = function(e, n, o, d, T) { return z(e, n, o, !0, d, T); }; }()), te; } var Ae; function We() { return Ae || (Ae = 1, process.env.NODE_ENV === "production" ? le.exports = Pe() : le.exports = Ue()), le.exports; } var $e = We(); function He({ value: r, onChange: p, format: k, className: w, ...S }) { const { inputProps: y } = De({ value: r, onChange: p, format: k }); return /* @__PURE__ */ $e.jsx("input", { className: w, ...y, ...S }); } export { He as TypedDateInput, De as useTypedDate };