UNPKG

react-week-picker-pro

Version:

A modern, functional React component for selecting weeks with comprehensive features including week numbers, date ranges, and flexible configuration options.

453 lines (452 loc) 14.9 kB
import ce, { useState as re, useMemo as O } from "react"; var $ = { exports: {} }, D = {}; /** * @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 te; function le() { if (te) return D; te = 1; var a = Symbol.for("react.transitional.element"), n = Symbol.for("react.fragment"); function t(s, l, u) { var E = null; if (u !== void 0 && (E = "" + u), l.key !== void 0 && (E = "" + l.key), "key" in l) { u = {}; for (var i in l) i !== "key" && (u[i] = l[i]); } else u = l; return l = u.ref, { $$typeof: a, type: s, key: E, ref: l !== void 0 ? l : null, props: u }; } return D.Fragment = n, D.jsx = t, D.jsxs = t, D; } var Y = {}; /** * @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 ne; function ie() { return ne || (ne = 1, process.env.NODE_ENV !== "production" && function() { function a(e) { if (e == null) return null; if (typeof e == "function") return e.$$typeof === A ? null : e.displayName || e.name || null; if (typeof e == "string") return e; switch (e) { case x: return "Fragment"; case W: return "Profiler"; case q: return "StrictMode"; case y: return "Suspense"; case X: return "SuspenseList"; case w: return "Activity"; } 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 L: return "Portal"; case V: return (e.displayName || "Context") + ".Provider"; case z: return (e._context.displayName || "Context") + ".Consumer"; case G: var r = e.render; return e = e.displayName, e || (e = r.displayName || r.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e; case o: return r = e.displayName || null, r !== null ? r : a(e.type) || "Memo"; case h: r = e._payload, e = e._init; try { return a(e(r)); } catch { } } return null; } function n(e) { return "" + e; } function t(e) { try { n(e); var r = !1; } catch { r = !0; } if (r) { r = console; var c = r.error, d = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object"; return c.call( r, "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.", d ), n(e); } } function s(e) { if (e === x) return "<>"; if (typeof e == "object" && e !== null && e.$$typeof === h) return "<...>"; try { var r = a(e); return r ? "<" + r + ">" : "<...>"; } catch { return "<...>"; } } function l() { var e = P.A; return e === null ? null : e.getOwner(); } function u() { return Error("react-stack-top-frame"); } function E(e) { if (F.call(e, "key")) { var r = Object.getOwnPropertyDescriptor(e, "key").get; if (r && r.isReactWarning) return !1; } return e.key !== void 0; } function i(e, r) { function c() { S || (S = !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)", r )); } c.isReactWarning = !0, Object.defineProperty(e, "key", { get: c, configurable: !0 }); } function m() { var e = a(this.type); return I[e] || (I[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 R(e, r, c, d, T, v, B, H) { return c = v.ref, e = { $$typeof: p, type: e, key: r, props: v, _owner: T }, (c !== void 0 ? c : null) !== null ? Object.defineProperty(e, "ref", { enumerable: !1, get: m }) : 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.defineProperty(e, "_debugStack", { configurable: !1, enumerable: !1, writable: !0, value: B }), Object.defineProperty(e, "_debugTask", { configurable: !1, enumerable: !1, writable: !0, value: H }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e; } function b(e, r, c, d, T, v, B, H) { var f = r.children; if (f !== void 0) if (d) if (C(f)) { for (d = 0; d < f.length; d++) g(f[d]); Object.freeze && Object.freeze(f); } 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 g(f); if (F.call(r, "key")) { f = a(e); var N = Object.keys(r).filter(function(oe) { return oe !== "key"; }); d = 0 < N.length ? "{key: someKey, " + N.join(": ..., ") + ": ...}" : "{key: someKey}", ee[f + d] || (N = 0 < N.length ? "{" + N.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, f, N, f ), ee[f + d] = !0); } if (f = null, c !== void 0 && (t(c), f = "" + c), E(r) && (t(r.key), f = "" + r.key), "key" in r) { c = {}; for (var Z in r) Z !== "key" && (c[Z] = r[Z]); } else c = r; return f && i( c, typeof e == "function" ? e.displayName || e.name || "Unknown" : e ), R( e, f, v, T, l(), c, B, H ); } function g(e) { typeof e == "object" && e !== null && e.$$typeof === p && e._store && (e._store.validated = 1); } var _ = ce, p = Symbol.for("react.transitional.element"), L = Symbol.for("react.portal"), x = Symbol.for("react.fragment"), q = Symbol.for("react.strict_mode"), W = Symbol.for("react.profiler"), z = Symbol.for("react.consumer"), V = Symbol.for("react.context"), G = Symbol.for("react.forward_ref"), y = Symbol.for("react.suspense"), X = Symbol.for("react.suspense_list"), o = Symbol.for("react.memo"), h = Symbol.for("react.lazy"), w = Symbol.for("react.activity"), A = Symbol.for("react.client.reference"), P = _.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, F = Object.prototype.hasOwnProperty, C = Array.isArray, M = console.createTask ? console.createTask : function() { return null; }; _ = { "react-stack-bottom-frame": function(e) { return e(); } }; var S, I = {}, U = _["react-stack-bottom-frame"].bind( _, u )(), K = M(s(u)), ee = {}; Y.Fragment = x, Y.jsx = function(e, r, c, d, T) { var v = 1e4 > P.recentlyCreatedOwnerStacks++; return b( e, r, c, !1, d, T, v ? Error("react-stack-top-frame") : U, v ? M(s(e)) : K ); }, Y.jsxs = function(e, r, c, d, T) { var v = 1e4 > P.recentlyCreatedOwnerStacks++; return b( e, r, c, !0, d, T, v ? Error("react-stack-top-frame") : U, v ? M(s(e)) : K ); }; }()), Y; } var ae; function ue() { return ae || (ae = 1, process.env.NODE_ENV === "production" ? $.exports = le() : $.exports = ie()), $.exports; } var k = ue(); const J = (a) => { const n = new Date( Date.UTC(a.getFullYear(), a.getMonth(), a.getDate()) ), t = n.getUTCDay() || 7; n.setUTCDate(n.getUTCDate() + 4 - t); const s = new Date(Date.UTC(n.getUTCFullYear(), 0, 1)); return Math.ceil(((n.getTime() - s.getTime()) / 864e5 + 1) / 7); }, j = (a, n = 1) => { const t = new Date(a), s = t.getDay(), l = t.getDate() - s + (n === 1 ? s === 0 ? -6 : 1 : 0); return new Date(t.setDate(l)); }, Q = (a, n = 1) => { const t = j(a, n), s = new Date(t); return s.setDate(t.getDate() + 6), s; }, se = (a, n = "MMM dd, yyyy") => { const t = {}; return n.includes("MMM") ? t.month = "short" : n.includes("MM") && (t.month = "2-digit"), n.includes("dd") ? t.day = "2-digit" : n.includes("d") && (t.day = "numeric"), n.includes("yyyy") ? t.year = "numeric" : n.includes("yy") && (t.year = "2-digit"), new Intl.DateTimeFormat("en-US", t).format(a); }, de = (a, n, t = 1) => { const s = j(a, t), l = j(n, t); return s.getTime() === l.getTime(); }, fe = (a, n, t = 1) => { const s = new Date(a, n, 1), l = new Date(a, n + 1, 0), u = /* @__PURE__ */ new Date(), E = [], i = j(s, t); let m = new Date(i); for (; m <= l || m.getDay() !== t; ) { const R = m.getMonth() === n, b = m.toDateString() === u.toDateString(), g = J(m); if (E.push({ date: new Date(m), isCurrentMonth: R, isToday: b, weekNumber: g, isSelected: !1 }), m.setDate(m.getDate() + 1), m > l && m.getDay() === t) break; } return E; }, me = ({ selectedWeek: a, onWeekSelect: n, minDate: t, maxDate: s, className: l = "", dateFormat: u = "MMM dd, yyyy", showWeekNumbers: E = !0, firstDayOfWeek: i = 1 }) => { const [m, R] = re(a || /* @__PURE__ */ new Date()), [b, g] = re( a ? j(a, i) : null ), _ = m.getMonth(), p = m.getFullYear(), L = O(() => { const o = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"]; return i === 1 ? [...o.slice(1), o[0]] : o; }, [i]), x = O(() => { const o = fe(p, _, i), h = []; for (let w = 0; w < o.length; w += 7) { const A = o.slice(w, w + 7); h.push(A); } return h; }, [p, _, i]), q = (o) => { const h = Q(o, i), w = J(o); t && h < t || s && o > s || (g(o), n && n(o, h, w)); }, W = () => { R(new Date(p, _ - 1, 1)); }, z = () => { R(new Date(p, _ + 1, 1)); }, V = O(() => t ? new Date(p, _, 1) <= t : !1, [t, p, _]), G = O(() => s ? new Date(p, _ + 1, 0) >= s : !1, [s, p, _]), y = O(() => { if (!b) return null; const o = Q(b, i), h = J(b); return { start: se(b, u), end: se(o, u), weekNumber: h }; }, [b, u, i]), X = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ]; return /* @__PURE__ */ k.jsxs("div", { className: `week-picker ${l}`, children: [ /* @__PURE__ */ k.jsxs("div", { className: "week-picker__header", children: [ /* @__PURE__ */ k.jsx( "button", { className: "week-picker__nav-button", onClick: W, disabled: V, "aria-label": "Previous month", children: "‹" } ), /* @__PURE__ */ k.jsxs("h2", { className: "week-picker__month-year", children: [ X[_], " ", p ] }), /* @__PURE__ */ k.jsx( "button", { className: "week-picker__nav-button", onClick: z, disabled: G, "aria-label": "Next month", children: "›" } ) ] }), y && /* @__PURE__ */ k.jsx("div", { className: "week-picker__selected-week-info", children: /* @__PURE__ */ k.jsxs("p", { className: "week-picker__selected-week-text", children: [ "Week ", y.weekNumber, ": ", y.start, " -", " ", y.end ] }) }), /* @__PURE__ */ k.jsxs("div", { className: "week-picker__calendar", children: [ /* @__PURE__ */ k.jsxs("div", { className: "week-picker__week-day-headers", children: [ E && /* @__PURE__ */ k.jsx("div", { className: "week-picker__week-number-header", children: "Wk" }), /* @__PURE__ */ k.jsx("div", { className: "week-picker__week-day-headers-container", children: L.map((o) => /* @__PURE__ */ k.jsx("div", { className: "week-picker__week-day-header", children: o }, o)) }) ] }), x.map((o, h) => { const w = j(o[0].date, i), A = b && de(w, b, i), P = J(w), F = Q(w, i), C = !(t && F < t || s && w > s), M = [ "week-picker__week-row", A ? "week-picker__week-row--selected" : "", C ? "" : "week-picker__week-row--disabled" ].filter(Boolean).join(" "); return /* @__PURE__ */ k.jsxs( "div", { className: M, onClick: () => C && q(w), style: { cursor: C ? "pointer" : "not-allowed" }, children: [ E && /* @__PURE__ */ k.jsx("div", { className: "week-picker__week-number", children: P }), /* @__PURE__ */ k.jsx("div", { className: "week-picker__days-container", children: o.map((S, I) => { const U = [ "week-picker__day", S.isCurrentMonth ? "week-picker__day--current-month" : "week-picker__day--other-month", S.isToday ? "week-picker__day--today" : "" ].filter(Boolean).join(" "); return /* @__PURE__ */ k.jsx("div", { className: U, children: S.date.getDate() }, I); }) }) ] }, h ); }) ] }) ] }); }, _e = "1.0.6"; export { me as WeekPicker, me as default, se as formatDate, J as getISOWeekNumber, fe as getMonthDays, Q as getWeekEnd, j as getWeekStart, de as isSameWeek, _e as version }; //# sourceMappingURL=react-week-picker-pro.js.map