@alif-ui-test/core 1.11.0 → 2.0.0-alpha.5

package/dist/components/Dates/InputMonthPicker/MonthPicker/MonthPicker.constants.js

@@ -1,47 +1,47 @@
-const e = {
-  en: [
-    "January",
-    "February",
-    "March",
-    "April",
-    "May",
-    "June",
-    "July",
-    "August",
-    "September",
-    "October",
-    "November",
-    "December"
-  ],
-  ru: [
-    "Январь",
-    "Февраль",
-    "Март",
-    "Апрель",
-    "Май",
-    "Июнь",
-    "Июль",
-    "Август",
-    "Сентябрь",
-    "Октябрь",
-    "Ноябрь",
-    "Декабрь"
-  ],
-  tj: [
-    "Январ",
-    "Феврал",
-    "Март",
-    "Апрел",
-    "Май",
-    "Июн",
-    "Июл",
-    "Август",
-    "Сентябр",
-    "Октябр",
-    "Ноябр",
-    "Декабр"
-  ]
-};
-export {
-  e as MONTHS
+//#region src/components/Dates/InputMonthPicker/MonthPicker/MonthPicker.constants.ts
+var e = Array.from({ length: 12 }, (e, t) => t + 1), t = {
+	en: [
+		"January",
+		"February",
+		"March",
+		"April",
+		"May",
+		"June",
+		"July",
+		"August",
+		"September",
+		"October",
+		"November",
+		"December"
+	],
+	ru: [
+		"Январь",
+		"Февраль",
+		"Март",
+		"Апрель",
+		"Май",
+		"Июнь",
+		"Июль",
+		"Август",
+		"Сентябрь",
+		"Октябрь",
+		"Ноябрь",
+		"Декабрь"
+	],
+	tj: [
+		"Январ",
+		"Феврал",
+		"Март",
+		"Апрел",
+		"Май",
+		"Июн",
+		"Июл",
+		"Август",
+		"Сентябр",
+		"Октябр",
+		"Ноябр",
+		"Декабр"
+	]
 };
+//#endregion
+export { t as MONTHS, e as MONTH_NUMBERS };

package/dist/components/Dates/InputMonthPicker/MonthPicker/MonthPicker.js

@@ -1,59 +1,58 @@
-import { jsxs as u, jsx as m } from "react/jsx-runtime";
-import { useState as b } from "react";
-import { MONTHS as N } from "./MonthPicker.constants.js";
-import O from "../../Dates.module.css.js";
-import { PickerContent as k } from "../../PickerContent/PickerContent.js";
-import { getPickerStyles as x } from "../../Dates.utils.js";
-import { PickerOptions as P } from "../../PickerOptions/PickerOptions.js";
-import { useLocale as S } from "../../../../providers/hooks/useLocale/useLocale.js";
-import { classNames as V } from "../../../../utils/class-names.js";
-const q = ({
-  className: c,
-  onChange: i,
-  onPickerChange: e,
-  value: o,
-  isRange: s,
-  disabledMonths: n,
-  options: p,
-  pickerWidth: h
-}) => {
-  const { locale: l } = S(), r = (/* @__PURE__ */ new Date()).getMonth() + 1, a = Array.isArray(o) ? o[0] ?? r : o ?? r, [f, y] = b(a), M = Array.from({ length: 12 }, (t, d) => d + 1), A = (t) => {
-    e?.(t), i?.(t), t != null && y(Array.isArray(t) ? Math.min(...t) : t);
-  };
-  return /* @__PURE__ */ u(
-    "div",
-    {
-      style: x("month", h),
-      className: V(O.root, c),
-      children: [
-        /* @__PURE__ */ m(
-          k,
-          {
-            type: "month",
-            items: M,
-            monthNames: N[l],
-            currentValue: r,
-            visibleValue: f,
-            onChange: i,
-            onPickerChange: e,
-            isRange: s,
-            value: o,
-            disabledOptions: n
-          }
-        ),
-        /* @__PURE__ */ m(
-          P,
-          {
-            options: p,
-            isRange: s,
-            disabledOptions: n,
-            onChange: A
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  q as MonthPicker
+import { resolveTypography as e } from "../../../../utils/typography.js";
+import { classNames as t } from "../../../../utils/class-names.js";
+import { useLocale as n } from "../../../../providers/hooks/useLocale/useLocale.js";
+import r from "../../Dates.module.js";
+import { PickerOptions as i } from "../../PickerOptions/PickerOptions.js";
+import { getPickerStyles as a, getRangeBoundaries as o, getRangeMouseHandlers as s } from "../../Dates.utils.js";
+import { MONTHS as c, MONTH_NUMBERS as l } from "./MonthPicker.constants.js";
+import { normalizeRange as u } from "./MonthPicker.utils.js";
+import { useMemo as d, useState as f } from "react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+//#region src/components/Dates/InputMonthPicker/MonthPicker/MonthPicker.tsx
+var h = ({ onChange: h, onPickerChange: g, value: _, isRange: v, disabledMonths: y, options: b, pickerWidth: x, className: S, style: C, ref: w }) => {
+	let { locale: T } = n(), E = (/* @__PURE__ */ new Date()).getMonth() + 1, [D, O] = f(null), [k, A] = f(null), j = c[T], M = d(() => o(_, v, D, k, u), [
+		_,
+		v,
+		D,
+		k
+	]), N = (e) => {
+		if (!v) {
+			g?.(e), h?.(e);
+			return;
+		}
+		if (!D) {
+			O([e, null]), g?.(e);
+			return;
+		}
+		let [t] = D, n = u(t, e);
+		O(null), g?.(n), h?.(n);
+	}, P = (e) => {
+		let n = E === e, i = !v && e === _, a = v && M?.[0] === e, o = v && M?.[1] === e, s = v && M && e > M[0] && e < M[1];
+		return t(r.dateCell, "uiFont", r.month, n && r.today, i && r.active, a && r.rangeStart, o && r.rangeEnd, s && r.rangeMiddle, s && n && r.todayRangeMiddle);
+	};
+	return /* @__PURE__ */ m("div", {
+		ref: w,
+		style: a("month", x, C),
+		className: t(r.root, S),
+		children: [/* @__PURE__ */ p("div", {
+			className: t(r.calendar, r.calendarShadow),
+			children: l.map((t) => /* @__PURE__ */ p("button", {
+				onClick: () => N(t),
+				...s(v, A, t),
+				className: P(t),
+				style: e("body", "s"),
+				disabled: y?.includes(t),
+				children: j[t - 1]
+			}, t))
+		}), /* @__PURE__ */ p(i, {
+			options: b,
+			isRange: v,
+			disabledOptions: y,
+			onChange: (e) => {
+				g?.(e), h?.(e);
+			}
+		})]
+	});
 };
+//#endregion
+export { h as MonthPicker };

package/dist/components/Dates/InputMonthPicker/MonthPicker/MonthPicker.utils.js

@@ -0,0 +1,4 @@
+//#region src/components/Dates/InputMonthPicker/MonthPicker/MonthPicker.utils.ts
+var e = (e, t) => [Math.min(e, t), Math.max(e, t)];
+//#endregion
+export { e as normalizeRange };

package/dist/components/Dates/InputMonthYearPicker/InputMonthYearPicker.constants.js

@@ -0,0 +1,15 @@
+//#region src/components/Dates/InputMonthYearPicker/InputMonthYearPicker.constants.ts
+var e = {
+	year: {
+		en: "MM.YYYY",
+		ru: "MM.ГГГГ",
+		tj: "MM.СССС"
+	},
+	year_range: {
+		en: "MM.YYYY – MM.YYYY",
+		ru: "MM.ГГГГ – MM.ГГГГ",
+		tj: "MM.СССС – MM.СССС"
+	}
+};
+//#endregion
+export { e as MASK_VALUES };

package/dist/components/Dates/InputMonthYearPicker/InputMonthYearPicker.js

@@ -1,110 +1,95 @@
-import { jsxs as B, jsx as n } from "react/jsx-runtime";
-import { useState as P, useMemo as F, useEffect as T } from "react";
-import { defineMask as x, formatRangeValue as D, formatMonthYear as d, validateRange as E, validateSingle as L, normalizeMonthInput as U } from "./InputMonthYearPicker.utils.js";
-import { getPopoverWidth as $, sanitizeInput as q, formatInputValue as G } from "../Dates.utils.js";
-import { useLocale as H } from "../../../providers/hooks/useLocale/useLocale.js";
-import { Popover as h } from "../../Popover/Popover.js";
-import { Input as J } from "../../Input/Input.js";
-import { MonthYearPicker as K } from "./MonthYearPicker/MonthYearPicker.js";
-import { OutlineSystemCalendar as Q } from "../../../icons/components/OutlineSystemCalendar.js";
-const rt = ({
-  value: r,
-  className: V,
-  style: g,
-  minYear: f = 1900,
-  maxYear: a = 2100,
-  disabledDates: A,
-  options: z,
-  isRange: o,
-  onChange: s,
-  onClear: I,
-  onBlur: C,
-  pickerWidth: M,
-  ...N
-}) => {
-  const { locale: c } = H(), [k, l] = P(!1), [w, e] = P(""), y = F(
-    () => x(!!o, c),
-    [o, c]
-  ), O = isNaN(Number(w.split(" ")[0])) ? void 0 : y, S = (t) => {
-    const u = U(t.target.value, c), i = q(u);
-    e(G(i, y));
-  }, b = (t) => {
-    C?.(t);
-    const u = t.target.value.trim();
-    if (o) {
-      const p = E(u, f, a);
-      p ? (e(p.formatted), s?.(p.value)) : m();
-      return;
-    }
-    const i = L(u, f, a);
-    i ? (e(i.formatted), s?.(i.value)) : m();
-  }, j = (t) => {
-    if (t) {
-      if (o) {
-        Array.isArray(t) ? (e(D(t[0], t[1])), s?.(t), l(!1)) : e(`${d(t)} – `);
-        return;
-      }
-      typeof t == "string" && (e(d(t)), s?.(t), l(!1));
-    }
-  }, m = () => {
-    I?.(), e(""), s?.(null);
-  };
-  return T(() => {
-    if (r == null) {
-      e("");
-      return;
-    }
-    if (o && Array.isArray(r)) {
-      e(D(r[0], r[1]));
-      return;
-    }
-    e(d(r));
-  }, [r, o]), /* @__PURE__ */ B(
-    h,
-    {
-      position: "bottom-start",
-      isOpen: k,
-      onClose: () => l(!1),
-      width: $(M),
-      children: [
-        /* @__PURE__ */ n(
-          h.Trigger,
-          {
-            className: V,
-            style: { width: "100%", ...g },
-            children: /* @__PURE__ */ n(
-              J,
-              {
-                rightIcon: /* @__PURE__ */ n(Q, { onMouseDown: (t) => t.preventDefault() }),
-                ...N,
-                value: w,
-                onChange: S,
-                onBlur: b,
-                mask: O,
-                onFieldClick: () => l(!k),
-                isFilled: !!r,
-                onClear: I && m
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ n(h.Dropdown, { children: /* @__PURE__ */ n("div", { onMouseDown: (t) => t.preventDefault(), children: /* @__PURE__ */ n(
-          K,
-          {
-            value: r,
-            isRange: o,
-            minYear: f,
-            maxYear: a,
-            disabledDates: A,
-            onPickerChange: j,
-            options: z,
-            pickerWidth: M
-          }
-        ) }) })
-      ]
-    }
-  );
-};
-export {
-  rt as InputMonthYearPicker
+import { useLocale as e } from "../../../providers/hooks/useLocale/useLocale.js";
+import { Popover as t } from "../../Popover/Popover.js";
+import { formatInputValue as n, getPopoverWidth as r } from "../Dates.utils.js";
+import { PickerInput as i } from "../PickerInput/PickerInput.js";
+import { MonthYearPicker as a } from "./MonthYearPicker/MonthYearPicker.js";
+import { defineMask as o, formatMonthYear as s, formatRangeValue as c, normalizeMonthInput as l, validateRange as u, validateSingle as d } from "./InputMonthYearPicker.utils.js";
+import { useEffect as f, useState as p } from "react";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
+import { OutlineSystemCalendar as g } from "@alif-ui-test/icons";
+//#region src/components/Dates/InputMonthYearPicker/InputMonthYearPicker.tsx
+var _ = ({ value: _, className: v, style: y, minDate: b = "01-1900", maxDate: x = "12-2100", disabledDates: S, options: C, isRange: w, onChange: T, onClear: E, onBlur: D, pickerWidth: O, rightIcon: k = /* @__PURE__ */ m(g, {}), ...A }) => {
+	let { locale: j } = e(), [M, N] = p(!1), [P, F] = p(""), I = o(w, j), L = isNaN(Number(P.split(" ")[0])) ? void 0 : I, R = (e) => {
+		F(n(l(e.target.value, j), I));
+	}, z = (e) => S?.includes(e) ?? !1, B = () => {
+		E?.(), F(""), T?.(null);
+	}, V = (e) => {
+		D?.(e);
+		let t = e.target.value.trim();
+		if (w) {
+			let e = u(t, b, x);
+			if (e) {
+				let [t, n] = e.value;
+				if (z(t) || z(n)) {
+					B();
+					return;
+				}
+				F(e.formatted), T?.(e.value);
+			} else B();
+			return;
+		}
+		let n = d(t, b, x);
+		if (n) {
+			if (z(n.value)) {
+				B();
+				return;
+			}
+			F(n.formatted), T?.(n.value);
+		} else B();
+	}, H = (e) => {
+		if (e) {
+			if (w) {
+				Array.isArray(e) ? (F(c(e[0], e[1])), T?.(e), N(!1)) : F(`${s(e)} – `);
+				return;
+			}
+			typeof e == "string" && (F(s(e)), T?.(e), N(!1));
+		}
+	};
+	return f(() => {
+		if (_ == null) {
+			F("");
+			return;
+		}
+		if (w && Array.isArray(_)) {
+			F(c(_[0], _[1]));
+			return;
+		}
+		F(s(_));
+	}, [_, w]), /* @__PURE__ */ h(t, {
+		position: "bottom-start",
+		isOpen: M,
+		onClose: () => N(!1),
+		width: r(O),
+		children: [/* @__PURE__ */ m(t.Trigger, {
+			className: v,
+			style: {
+				width: "100%",
+				...y
+			},
+			children: /* @__PURE__ */ m(i, {
+				...A,
+				rightIcon: k,
+				value: P,
+				onChange: R,
+				onBlur: V,
+				mask: L,
+				onFieldClick: () => N(!M),
+				onClear: E && B
+			})
+		}), /* @__PURE__ */ m(t.Dropdown, {
+			onMouseDown: (e) => e.preventDefault(),
+			children: /* @__PURE__ */ m(a, {
+				value: _,
+				isRange: w,
+				minDate: b,
+				maxDate: x,
+				disabledDates: S,
+				onPickerChange: H,
+				options: C,
+				pickerWidth: O
+			})
+		})]
+	});
 };
+//#endregion
+export { _ as InputMonthYearPicker };

package/dist/components/Dates/InputMonthYearPicker/InputMonthYearPicker.utils.js

@@ -1,44 +1,42 @@
-import { MONTHS as c } from "../InputMonthPicker/MonthPicker/MonthPicker.constants.js";
-const m = {
-  year: {
-    en: "MM.YYYY",
-    ru: "MM.ГГГГ",
-    tj: "MM.СССС"
-  },
-  year_range: {
-    en: "MM.YYYY – MM.YYYY",
-    ru: "MM.ГГГГ – MM.ГГГГ",
-    tj: "MM.СССС – MM.СССС"
-  }
-}, d = (n, r = "ru") => n ? m.year_range[r] : m.year[r], M = (n) => n.replace(/(\d{2})\D(\d{2,4})/, "$1-$2"), l = (n) => {
-  if (!n) return "";
-  const [r, a = ""] = n.split("-");
-  return `${r}.${a}`;
-}, Y = (n, r) => {
-  const a = c[r].map((t) => t.toLowerCase());
-  return n.split(/\s*[-–]\s*/).map((t) => {
-    const [e, s] = t.trim().split(/\s+/);
-    if (!e || !s) return t;
-    const o = a.findIndex((i) => i.startsWith(e.toLowerCase()));
-    return o === -1 ? t : `${String(o + 1).padStart(2, "0")}–${s}`;
-  }).join(" - ");
-}, p = (n, r) => `${l(n)} – ${l(r)}`.trim(), y = (n, r, a) => {
-  const t = M(n), e = l(t);
-  if (!e) return null;
-  const [s, o] = t.split("-").map(Number);
-  return s >= 1 && s <= 12 && o >= r && o <= a ? { formatted: e, value: t } : null;
-}, $ = (n, r, a) => {
-  let [t, e] = n.split(/\s*[-–]\s*/).map(M);
-  if (!t || !e) return null;
-  const [s, o] = t.split("-").map(Number), [i, u] = e.split("-").map(Number);
-  return !s || !o || !i || !u || s < 1 || s > 12 || i < 1 || i > 12 || o < r || o > a || u < r || u > a ? null : (o * 100 + s > u * 100 + i && ([t, e] = [e, t]), { formatted: p(t, e), value: [t, e] });
-};
-export {
-  d as defineMask,
-  l as formatMonthYear,
-  p as formatRangeValue,
-  Y as normalizeMonthInput,
-  M as normalizePart,
-  $ as validateRange,
-  y as validateSingle
+import { MONTHS as e } from "../InputMonthPicker/MonthPicker/MonthPicker.constants.js";
+import { MASK_VALUES as t } from "./InputMonthYearPicker.constants.js";
+//#region src/components/Dates/InputMonthYearPicker/InputMonthYearPicker.utils.ts
+var n = (e, n = "ru") => e ? t.year_range[n] : t.year[n], r = (e) => e.replace(/(\d{2})\D(\d{2,4})/, "$1-$2"), i = (e) => {
+	if (!e) return null;
+	let [t, n] = r(e).split("-").map(Number);
+	return !t || !n || t < 1 || t > 12 ? null : n * 100 + t;
+}, a = (e) => {
+	if (!e) return "";
+	let [t, n = ""] = e.split("-");
+	return `${t}.${n}`;
+}, o = (t, n) => {
+	let r = e[n].map((e) => e.toLowerCase());
+	return t.split(/\s*[-–]\s*/).map((e) => {
+		let [t, n] = e.trim().split(/\s+/);
+		if (!t || !n) return e;
+		let i = r.findIndex((e) => e.startsWith(t.toLowerCase()));
+		return i === -1 ? e : `${String(i + 1).padStart(2, "0")}–${n}`;
+	}).join(" - ");
+}, s = (e, t) => `${a(e)} – ${a(t)}`.trim(), c = (e, t, n) => {
+	let o = r(e), s = a(o);
+	if (!s) return null;
+	let [c, l] = o.split("-").map(Number);
+	if (c < 1 || c > 12 || !l) return null;
+	let u = i(t), d = i(n), f = l * 100 + c;
+	return u !== null && f < u || d !== null && f > d ? null : c >= 1 && c <= 12 ? {
+		formatted: s,
+		value: o
+	} : null;
+}, l = (e, t, n) => {
+	let [a, o] = e.split(/\s*[-–]\s*/).map(r);
+	if (!a || !o) return null;
+	let [c, l] = a.split("-").map(Number), [u, d] = o.split("-").map(Number);
+	if (!c || !l || !u || !d || c < 1 || c > 12 || u < 1 || u > 12) return null;
+	let f = i(t), p = i(n), m = l * 100 + c, h = d * 100 + u;
+	return f !== null && (m < f || h < f) || p !== null && (m > p || h > p) ? null : (m > h && ([a, o] = [o, a]), {
+		formatted: s(a, o),
+		value: [a, o]
+	});
 };
+//#endregion
+export { n as defineMask, a as formatMonthYear, s as formatRangeValue, o as normalizeMonthInput, l as validateRange, c as validateSingle };

package/dist/components/Dates/InputMonthYearPicker/MonthYearPicker/MonthView/MonthView.js

@@ -0,0 +1,34 @@
+import { resolveTypography as e } from "../../../../../utils/typography.js";
+import { classNames as t } from "../../../../../utils/class-names.js";
+import { useLocale as n } from "../../../../../providers/hooks/useLocale/useLocale.js";
+import r from "../../../Dates.module.js";
+import { getRangeMouseHandlers as i } from "../../../Dates.utils.js";
+import { MONTHS as a } from "../../../InputMonthPicker/MonthPicker/MonthPicker.constants.js";
+import { formatValue as o, parseValue as s, toMonthDate as c } from "../MonthYearPicker.utils.js";
+import { jsx as l } from "react/jsx-runtime";
+//#region src/components/Dates/InputMonthYearPicker/MonthYearPicker/MonthView/MonthView.tsx
+var u = ({ year: u, currentMonth: d, currentYear: f, value: p, isRange: m, boundaries: h, minDate: g, maxDate: _, disabledDates: v, onMonthClick: y, onHoverMonth: b }) => {
+	let { locale: x } = n(), S = a[x], C = g ? s(g) : null, w = _ ? s(_) : null, T = (e) => !!(C && (u < C.year || u === C.year && e < C.month) || w && (u > w.year || u === w.year && e > w.month)), E = (e) => {
+		let t = o(e, u);
+		return T(e) || v?.includes(t);
+	}, D = (e) => {
+		let [n, i] = h.map((e) => e && s(e)), a = o(e, u), l = c(u, e), g = n && c(n.year, n.month), _ = i && c(i.year, i.month);
+		return t(r.dateCell, "uiFont", r.month, !m && p === a && r.active, m && g && l.getTime() === g.getTime() && r.rangeStart, m && _ && l.getTime() === _.getTime() && r.rangeEnd, m && g && _ && l > g && l < _ && r.rangeMiddle, m && g && _ && l > g && l < _ && d === e && f === u && r.todayRangeMiddle, d === e && f === u && r.today);
+	};
+	return /* @__PURE__ */ l("div", {
+		className: t(r.calendar, r.calendarShadow),
+		children: S.map((t, n) => /* @__PURE__ */ l("button", {
+			className: D(n),
+			style: e("body", "s"),
+			onClick: () => y(n),
+			disabled: E(n),
+			...i(m, b, {
+				month: n,
+				year: u
+			}),
+			children: t
+		}, t))
+	});
+};
+//#endregion
+export { u as MonthView };