@brightsoftware/date-np
Version:
Simple & minimal Nepali date picker that just works.
172 lines (171 loc) • 4.77 kB
JavaScript
import { jsxs as w, jsx as n } from "react/jsx-runtime";
import { useMemo as g } from "react";
import { MIN_AD_YEAR as b, MAX_AD_YEAR as B, MIN_BS_YEAR as L, MAX_BS_YEAR as E } from "../../../data/constants.js";
import { CALENDAR as S } from "../../../data/locale.js";
import { cn as f } from "../../../utils/clsx.js";
import { useRangePicker as I } from "../hooks/useRangePicker.js";
import { NepaliDate as T } from "../../NepaliDate.js";
const G = ({ panel: r }) => {
const {
rangePickerState: a,
togglePanelMode: v,
incrementPanelMonth: M,
canNavigateToPreviousMonth: p,
canNavigateToNextMonth: P,
shouldShowSinglePanel: Y
} = I(), { locale: h } = a, A = r === "left" ? a.leftPanel : a.rightPanel, o = r === "left" ? a.rightPanel : a.leftPanel, { activeMonth: s, activeYear: e } = A, i = () => h === "en" && e === b || e === B || h === "ne" && e === L || e === E, d = g(() => h === "ne" ? new T(e, s, 15) : new Date(e, s, 15), [e, s, h]), y = h === "en" ? S.AD.months[d.getMonth()] : S.BS.months[d.getMonth()], C = d.getFullYear();
let m = !1, c = !1;
a.shouldShowSinglePanel === void 0 ? c = Y() : (m = a.shouldShowSinglePanel, c = !a.shouldShowSinglePanel);
const x = g(() => {
if (i()) return !0;
if (m) return !1;
if (c || !P(r)) return !0;
if (r === "left") {
const t = s + 1, l = t > 11 ? e + 1 : e, u = t > 11 ? 0 : t;
if (l === o.activeYear && u >= o.activeMonth || l > o.activeYear)
return !0;
}
return !1;
}, [
r,
s,
e,
o.activeMonth,
o.activeYear,
c,
P
]), N = g(() => {
if (i()) return !0;
if (m) return !1;
if (c || !p(r)) return !0;
if (r === "right") {
const t = s - 1, l = t < 0 ? e - 1 : e, u = t < 0 ? 11 : t;
if (l === o.activeYear && u <= o.activeMonth || l < o.activeYear)
return !0;
}
return !1;
}, [
r,
s,
e,
o.activeMonth,
o.activeYear,
c,
p
]), D = () => {
i() || v(r, "month", "date");
}, j = () => {
i() || v(r, "year", "date");
}, R = () => {
i() || N || M(r, -1);
}, _ = () => {
i() || x || M(r, 1);
}, k = ({
direction: t,
onClick: l,
disabled: u
}) => /* @__PURE__ */ n(
"button",
{
onClick: l,
disabled: u,
className: f(
"p-1 rounded transition-colors",
u ? "text-gray-300" : "text-gray-600 hover:text-gray-900 hover:bg-gray-100 hover:cursor-pointer"
),
children: t === "left" ? /* @__PURE__ */ n(
"svg",
{
className: "w-4 h-4",
fill: "none",
stroke: "currentColor",
viewBox: "0 0 24 24",
children: /* @__PURE__ */ n(
"path",
{
strokeLinecap: "round",
strokeLinejoin: "round",
strokeWidth: 2,
d: "M15 19l-7-7 7-7"
}
)
}
) : /* @__PURE__ */ n(
"svg",
{
className: "w-4 h-4",
fill: "none",
stroke: "currentColor",
viewBox: "0 0 24 24",
children: /* @__PURE__ */ n(
"path",
{
strokeLinecap: "round",
strokeLinejoin: "round",
strokeWidth: 2,
d: "M9 5l7 7-7 7"
}
)
}
)
}
);
return /* @__PURE__ */ w("div", { className: "flex items-center justify-between w-full mb-2", children: [
/* @__PURE__ */ n("div", { className: "w-8", children: /* @__PURE__ */ n(
k,
{
direction: "left",
onClick: (t) => {
t.stopPropagation(), R();
},
disabled: N
}
) }),
/* @__PURE__ */ w(
"div",
{
className: f(
"flex items-center space-x-2",
i() ? "cursor-not-allowed opacity-50" : "cursor-pointer"
),
children: [
/* @__PURE__ */ n(
"span",
{
onClick: D,
className: f(
"font-medium text-gray-700",
!i() && "hover:underline"
),
children: y
}
),
/* @__PURE__ */ n(
"span",
{
onClick: j,
className: f(
"font-medium text-gray-700",
!i() && "hover:underline"
),
children: C
}
)
]
}
),
/* @__PURE__ */ n("div", { className: "flex justify-end items-center gap-1", children: /* @__PURE__ */ n(
k,
{
direction: "right",
onClick: (t) => {
t.stopPropagation(), _();
},
disabled: x
}
) })
] });
};
export {
G as default
};