@pismo/marola 2.1.27 → 2.1.28

package/dist/components/DatePicker/DatePicker.stories.d.ts

@@ -8,7 +8,6 @@ declare const meta: {
     decorators: ((Story: import('@storybook/core/csf').PartialStoryFn<import('@storybook/react').ReactRenderer, {
         viewMode: "month" | "day" | "year";
         locale?: string | undefined;
-        placeholder?: string | undefined;
         format?: string | undefined;
         minDate?: dayjs.Dayjs | undefined;
         maxDate?: dayjs.Dayjs | undefined;
@@ -20,10 +19,10 @@ declare const meta: {
         'data-testid'?: string | undefined;
         mode: "single";
         value?: Date | undefined;
+        placeholder?: string | undefined;
     } | {
         viewMode: "month" | "day" | "year";
         locale?: string | undefined;
-        placeholder?: string | undefined;
         format?: string | undefined;
         minDate?: dayjs.Dayjs | undefined;
         maxDate?: dayjs.Dayjs | undefined;
@@ -35,6 +34,8 @@ declare const meta: {
         'data-testid'?: string | undefined;
         mode: "range";
         values?: [Date, Date] | undefined;
+        placeholders?: [string, string] | undefined;
+        limit?: number | undefined;
     }>) => import("react/jsx-runtime").JSX.Element)[];
 };
 export default meta;
@@ -43,6 +44,7 @@ export declare const Single: Story;
 export declare const SingleWithValue: Story;
 export declare const RangePicker: Story;
 export declare const RangeWithValues: Story;
+export declare const RangeWithLimit: Story;
 export declare const MonthView: Story;
 export declare const YearView: Story;
 export declare const LocalizedPortuguese: Story;

package/dist/components/DatePicker/dateUtils.d.ts

@@ -35,7 +35,7 @@ export declare const isCurrentDay: (date: Dayjs | null) => boolean;
  * @param selectedRange - The currently selected date range (optional).
  * @returns `true` if the date is disabled, otherwise `false`.
  */
-export declare const isDisabled: (date: Dayjs | null, minDate?: Dayjs, maxDate?: Dayjs, disableDates?: (date: Dayjs) => boolean, mode?: 'single' | 'range', selectedRange?: [Dayjs | null, Dayjs | null]) => boolean;
+export declare const isDisabled: (date: Dayjs | null, minDate?: Dayjs, maxDate?: Dayjs, disableDates?: (date: Dayjs) => boolean, mode?: 'single' | 'range', selectedRange?: [Dayjs | null, Dayjs | null], limit?: number) => boolean;
 /**
  * Generate an array of dates representing a month grid.
  * @param month - The month to display (as a Dayjs object).

package/dist/components/DatePicker/dateUtils.js

@@ -1,33 +1,34 @@
 import { d as u } from "../../dayjs.min-ClQKmc--.js";
-const c = (r) => r.add(1, "month").startOf("month"), M = (r) => r.subtract(1, "month").startOf("month"), Y = (r, t, n) => r ? n ? r.locale(t).format(n) : r.locale(t).format("LL") : "", h = (r) => r ? r.isSame(u(), "day") : !1, D = (r, t, n, o, i, s) => {
+const D = (r) => r.add(1, "month").startOf("month"), m = (r) => r.subtract(1, "month").startOf("month"), e = (r, n, t) => r ? t ? r.locale(n).format(t) : r.locale(n).format("LL") : "", p = (r) => r ? r.isSame(u(), "day") : !1, O = (r, n, t, o, i, s, a) => {
+  var M;
   if (!r) return !0;
-  const a = t && r.isBefore(t, "day"), f = n && r.isAfter(n, "day"), l = o && o(r), e = i === "range" && (s == null ? void 0 : s[0]) && !(s != null && s[1]) && r.isBefore(s[0], "day");
-  return !!(a || f || l || e);
-}, m = (r, t = !0) => {
-  const n = r.startOf("month"), o = r.endOf("month");
-  if (!t) {
-    const l = o.date();
-    return Array.from({ length: l }, (e, d) => n.clone().date(d + 1));
+  const f = n && r.isBefore(n, "day"), y = t && r.isAfter(t, "day"), d = o && o(r), l = i === "range" && (s == null ? void 0 : s[0]) && !(s != null && s[1]) && r.isBefore(s[0], "day"), c = i === "range" && a && ((M = s == null ? void 0 : s[0]) == null ? void 0 : M.add(a, "day")), Y = c && r.isAfter(c, "day");
+  return !!(f || y || d || l || Y);
+}, A = (r, n = !0) => {
+  const t = r.startOf("month"), o = r.endOf("month");
+  if (!n) {
+    const y = o.date();
+    return Array.from({ length: y }, (d, l) => t.clone().date(l + 1));
   }
-  const i = n.subtract(n.day(), "day"), s = o.add(6 - o.day(), "day"), a = [];
+  const i = t.subtract(t.day(), "day"), s = o.add(6 - o.day(), "day"), a = [];
   let f = i.clone();
   for (; !f.isAfter(s, "day"); )
     a.push(f), f = f.add(1, "day");
   return a;
-}, p = (r, t, n) => !r || !t || !n ? !1 : r.isBetween(t, n, "day", "[]"), O = (r, t) => r === null || t === null ? !1 : r.isSame(t, "day"), A = (r, t) => r === null || t === null ? !1 : r.isSame(t, "day"), I = (r, t = "short") => {
-  const n = [];
+}, L = (r, n, t) => !r || !n || !t ? !1 : r.isBetween(n, t, "day", "[]"), I = (r, n) => r === null || n === null ? !1 : r.isSame(n, "day"), b = (r, n) => r === null || n === null ? !1 : r.isSame(n, "day"), k = (r, n = "short") => {
+  const t = [];
   let o = u().locale(r).startOf("week");
   for (let i = 0; i < 7; i++)
-    n.push(o.format(t === "long" ? "dddd" : t === "short" ? "ddd" : "dd")), o = o.add(1, "day");
-  return n;
-}, L = (r, t) => {
+    t.push(o.format(n === "long" ? "dddd" : n === "short" ? "ddd" : "dd")), o = o.add(1, "day");
+  return t;
+}, w = (r, n) => {
   if (!r) return null;
-  const n = t ? u(r, t) : u(r);
-  return n.isValid() ? n : null;
-}, b = (r, t) => r === null || t === null ? !1 : r.isSame(t, "day"), k = (r, t, n) => {
+  const t = n ? u(r, n) : u(r);
+  return t.isValid() ? t : null;
+}, B = (r, n) => r === null || n === null ? !1 : r.isSame(n, "day"), V = (r, n, t) => {
   if (!r) return null;
-  if (n) {
-    const s = u(r, n, t);
+  if (t) {
+    const s = u(r, t, n);
     if (s.isValid()) return s;
   }
   const o = [
@@ -47,24 +48,24 @@ const c = (r) => r.add(1, "month").startOf("month"), M = (r) => r.subtract(1, "m
     // English style
   ];
   for (const s of o) {
-    const a = u(r, s, t);
+    const a = u(r, s, n);
     if (a.isValid()) return a;
   }
   const i = u(r);
   return i.isValid() ? i : null;
 };
 export {
-  Y as formatDateForInput,
-  m as getMonthGrid,
-  c as getNextMonth,
-  M as getPreviousMonth,
-  I as getWeekdayNames,
-  h as isCurrentDay,
-  p as isDateInRange,
-  D as isDisabled,
-  A as isRangeEnd,
-  O as isRangeStart,
-  b as isSameDay,
-  L as parseDate,
-  k as parseFormattedInput
+  e as formatDateForInput,
+  A as getMonthGrid,
+  D as getNextMonth,
+  m as getPreviousMonth,
+  k as getWeekdayNames,
+  p as isCurrentDay,
+  L as isDateInRange,
+  O as isDisabled,
+  b as isRangeEnd,
+  I as isRangeStart,
+  B as isSameDay,
+  w as parseDate,
+  V as parseFormattedInput
 };

package/dist/components/DatePicker/renderCalendarDays.d.ts

@@ -13,6 +13,7 @@ type RenderDaysProps = {
     hoverDate: Dayjs | null;
     handleSelect: (date: Dayjs) => void;
     setHoverDate: (date: Dayjs | null) => void;
+    limit?: number;
 };
 /**
  * Renders weekday names header
@@ -21,5 +22,5 @@ export declare const renderDayNames: (locale: string) => import("react/jsx-runti
 /**
  * Renders the days of the calendar
  */
-export declare const renderCalendarDays: ({ currentMonth, monthOffset, mode, locale, minDate, maxDate, disableDates, selectedDate, selectedRange, isSelectingRange, hoverDate, handleSelect, setHoverDate, }: RenderDaysProps) => import("react/jsx-runtime").JSX.Element;
+export declare const renderCalendarDays: ({ currentMonth, monthOffset, mode, locale, minDate, maxDate, disableDates, selectedDate, selectedRange, isSelectingRange, hoverDate, handleSelect, setHoverDate, limit, }: RenderDaysProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/DatePicker/renderCalendarDays.js

@@ -1,74 +1,75 @@
-import { jsx as d, jsxs as Y } from "react/jsx-runtime";
-import { d as x } from "../../dayjs.min-ClQKmc--.js";
-import { s } from "../../DatePicker.module-CnuDEiKF.js";
-import { getWeekdayNames as E, getMonthGrid as I, isDateInRange as C, isRangeStart as p, isRangeEnd as c, isDisabled as y, isCurrentDay as W, formatDateForInput as h } from "./dateUtils.js";
-const A = (a, n, i) => {
-  if (!n[0] || !i) return !1;
-  const u = n[0].isBefore(i) ? n[0] : i, m = n[0].isBefore(i) ? i : n[0];
+import { jsx as d, jsxs as x } from "react/jsx-runtime";
+import { d as E } from "../../dayjs.min-ClQKmc--.js";
+import { s as i } from "../../DatePicker.module-CnuDEiKF.js";
+import { getWeekdayNames as I, getMonthGrid as W, isDateInRange as S, isRangeStart as c, isRangeEnd as y, isDisabled as k, isCurrentDay as h, formatDateForInput as A } from "./dateUtils.js";
+const H = (a, n, s) => {
+  if (!n[0] || !s) return !1;
+  const u = n[0].isBefore(s) ? n[0] : s, m = n[0].isBefore(s) ? s : n[0];
   return a.isAfter(u, "day") && a.isBefore(m, "day");
-}, S = (a, n) => n !== null && a.isSame(n, "day"), H = (a, n, i) => !n[0] || !i || !a.isSame(i, "day") ? !1 : n[0].isAfter(i), F = (a, n, i) => !n[0] || !i || !a.isSame(i, "day") ? !1 : n[0].isBefore(i), G = (a) => /* @__PURE__ */ d("div", { className: s.weekdayNames, "data-testid": "calendar-weekday-names", children: E(a, "short").map((n) => /* @__PURE__ */ d("div", { className: s.weekdayName, "data-testid": `weekday-name-${n}`, children: n }, n)) }), K = ({
+}, j = (a, n) => n !== null && a.isSame(n, "day"), F = (a, n, s) => !n[0] || !s || !a.isSame(s, "day") ? !1 : n[0].isAfter(s), G = (a, n, s) => !n[0] || !s || !a.isSame(s, "day") ? !1 : n[0].isBefore(s), L = (a) => /* @__PURE__ */ d("div", { className: i.weekdayNames, "data-testid": "calendar-weekday-names", children: I(a, "short").map((n) => /* @__PURE__ */ d("div", { className: i.weekdayName, "data-testid": `weekday-name-${n}`, children: n }, n)) }), P = ({
   currentMonth: a,
   monthOffset: n = 0,
-  mode: i,
+  mode: s,
   locale: u,
   minDate: m,
   maxDate: N,
-  disableDates: l,
+  disableDates: b,
   selectedDate: o,
   selectedRange: t,
-  isSelectingRange: k,
+  isSelectingRange: B,
   hoverDate: f,
-  handleSelect: B,
-  setHoverDate: M
+  handleSelect: M,
+  setHoverDate: $,
+  limit: p
 }) => {
-  const $ = a.add(n, "month"), j = I($, !0);
-  return /* @__PURE__ */ Y("div", { className: s.calendar, "data-testid": `calendar-month-${n}`, children: [
-    G(u),
-    /* @__PURE__ */ d("div", { className: s.days, "data-testid": "calendar-days-grid", children: j.map((r) => {
-      const w = r.month() === $.month(), b = r.format("YYYY-MM-DD"), T = [
-        s.day,
-        !w && s.faded,
-        (o == null ? void 0 : o.isSame(r, "day")) && s.selected,
-        C(r, t[0], t[1]) && s["range-selected"],
-        p(r, t[0]) && s["range-start"],
-        c(r, t[1]) && s["range-end"],
-        y(r, m, N, l, i, t) && s.disabled,
-        W(r) && s["current-day"],
+  const w = a.add(n, "month"), T = W(w, !0);
+  return /* @__PURE__ */ x("div", { className: i.calendar, "data-testid": `calendar-month-${n}`, children: [
+    L(u),
+    /* @__PURE__ */ d("div", { className: i.days, "data-testid": "calendar-days-grid", children: T.map((r) => {
+      const C = r.month() === w.month(), l = r.format("YYYY-MM-DD"), Y = [
+        i.day,
+        !C && i.faded,
+        (o == null ? void 0 : o.isSame(r, "day")) && i.selected,
+        S(r, t[0], t[1]) && i["range-selected"],
+        c(r, t[0]) && i["range-start"],
+        y(r, t[1]) && i["range-end"],
+        k(r, m, N, b, s, t, p) && i.disabled,
+        h(r) && i["current-day"],
         // Hover range classes
-        A(r, t, f) && s["hovered-range"],
-        S(r, f) && s["hovered-date"],
-        H(r, t, f) && s["would-be-start-date"],
-        F(r, t, f) && s["would-be-end-date"]
+        H(r, t, f) && i["hovered-range"],
+        j(r, f) && i["hovered-date"],
+        F(r, t, f) && i["would-be-start-date"],
+        G(r, t, f) && i["would-be-end-date"]
       ].filter(Boolean).join(" ");
       return /* @__PURE__ */ d(
         "button",
         {
-          className: T,
-          onClick: () => B(r),
+          className: Y,
+          onClick: () => M(r),
           onMouseEnter: () => {
-            k && !y(r, m, N, l, i, t) && M(r);
+            B && !k(r, m, N, b, s, t, p) && $(r);
           },
           onMouseLeave: () => {
-            k && M(null);
+            B && $(null);
           },
-          disabled: y(r, m, N, l, i, t),
-          "aria-label": `${h(r, u)}${p(r, t[0]) ? ", range start" : c(r, t[1]) ? ", range end" : C(r, t[0], t[1]) ? ", in selected range" : S(r, f) ? ", being hovered" : ""}`,
-          "aria-selected": (o == null ? void 0 : o.isSame(r, "day")) || p(r, t[0]) || c(r, t[1]),
-          "data-testid": `calendar-day-${b}`,
-          "data-date": b,
-          "data-current-month": w ? "true" : "false",
+          disabled: k(r, m, N, b, s, t, p),
+          "aria-label": `${A(r, u)}${c(r, t[0]) ? ", range start" : y(r, t[1]) ? ", range end" : S(r, t[0], t[1]) ? ", in selected range" : j(r, f) ? ", being hovered" : ""}`,
+          "aria-selected": (o == null ? void 0 : o.isSame(r, "day")) || c(r, t[0]) || y(r, t[1]),
+          "data-testid": `calendar-day-${l}`,
+          "data-date": l,
+          "data-current-month": C ? "true" : "false",
           children: r.date()
         },
-        `${n}-${b}`
+        `${n}-${l}`
       );
     }) }),
-    i === "single" && n === 0 && /* @__PURE__ */ d("div", { className: s["today-footer"], "data-testid": "today-footer", children: /* @__PURE__ */ d(
+    s === "single" && n === 0 && /* @__PURE__ */ d("div", { className: i["today-footer"], "data-testid": "today-footer", children: /* @__PURE__ */ d(
       "button",
       {
-        className: s["today-button"],
+        className: i["today-button"],
         onClick: () => {
-          const r = x();
-          B(r);
+          const r = E();
+          M(r);
         },
         "data-testid": "today-button",
         children: {
@@ -80,6 +81,6 @@ const A = (a, n, i) => {
   ] });
 };
 export {
-  K as renderCalendarDays,
-  G as renderDayNames
+  P as renderCalendarDays,
+  L as renderDayNames
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pismo/marola",
   "description": "CDX tribe component library",
-  "version": "2.1.27",
+  "version": "2.1.28",
   "type": "module",
   "main": "dist/main.js",
   "types": "dist/main.d.ts",