mada-design-system 0.9.0 → 1.0.0

package/index.es315.js

@@ -1,49 +1,16 @@
-var y = Object.defineProperty;
-var Y = (a, i, r) => i in a ? y(a, i, { enumerable: !0, configurable: !0, writable: !0, value: r }) : a[i] = r;
-var n = (a, i, r) => (Y(a, typeof i != "symbol" ? i + "" : i, r), r);
-import { Parser as m } from "./index.es395.js";
-import { mapValue as u, parseNDigits as l, normalizeTwoDigitYear as p } from "./index.es396.js";
-class g extends m {
-  constructor() {
-    super(...arguments);
-    n(this, "priority", 130);
-    n(this, "incompatibleTokens", ["Y", "R", "u", "w", "I", "i", "e", "c", "t", "T"]);
-  }
-  parse(r, e, s) {
-    const t = (o) => ({
-      year: o,
-      isTwoDigitYear: e === "yy"
-    });
-    switch (e) {
-      case "y":
-        return u(l(4, r), t);
-      case "yo":
-        return u(
-          s.ordinalNumber(r, {
-            unit: "year"
-          }),
-          t
-        );
-      default:
-        return u(l(e.length, r), t);
-    }
-  }
-  validate(r, e) {
-    return e.isTwoDigitYear || e.year > 0;
-  }
-  set(r, e, s) {
-    const t = r.getFullYear();
-    if (s.isTwoDigitYear) {
-      const c = p(
-        s.year,
-        t
-      );
-      return r.setFullYear(c, 0, 1), r.setHours(0, 0, 0, 0), r;
-    }
-    const o = !("era" in e) || e.era === 1 ? s.year : 1 - s.year;
-    return r.setFullYear(o, 0, 1), r.setHours(0, 0, 0, 0), r;
-  }
+function p(e, r, s, t, f = !1) {
+  if (!e || !r)
+    return;
+  const { startOfYear: o, endOfYear: i, eachYearOfInterval: l, getYear: u } = t, Y = o(e), c = i(r), a = l({ start: Y, end: c });
+  return f && a.reverse(), a.map((n) => {
+    const d = s.formatYearDropdown(n, t);
+    return {
+      value: u(n),
+      label: d,
+      disabled: !1
+    };
+  });
 }
 export {
-  g as YearParser
+  p as getYearOptions
 };

package/index.es316.js

@@ -1,69 +1,26 @@
-var D = Object.defineProperty;
-var f = (t, i, r) => i in t ? D(t, i, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[i] = r;
-var n = (t, i, r) => (f(t, typeof i != "symbol" ? i + "" : i, r), r);
-import { getWeekYear as y } from "./index.es260.js";
-import { startOfWeek as m } from "./index.es258.js";
-import { Parser as T } from "./index.es395.js";
-import { mapValue as Y, parseNDigits as u, normalizeTwoDigitYear as p } from "./index.es396.js";
-class C extends T {
-  constructor() {
-    super(...arguments);
-    n(this, "priority", 130);
-    n(this, "incompatibleTokens", [
-      "y",
-      "R",
-      "u",
-      "Q",
-      "q",
-      "M",
-      "L",
-      "I",
-      "d",
-      "D",
-      "i",
-      "t",
-      "T"
-    ]);
-  }
-  parse(r, e, s) {
-    const a = (o) => ({
-      year: o,
-      isTwoDigitYear: e === "YY"
-    });
-    switch (e) {
-      case "Y":
-        return Y(u(4, r), a);
-      case "Yo":
-        return Y(
-          s.ordinalNumber(r, {
-            unit: "year"
-          }),
-          a
-        );
-      default:
-        return Y(u(e.length, r), a);
-    }
-  }
-  validate(r, e) {
-    return e.isTwoDigitYear || e.year > 0;
-  }
-  set(r, e, s, a) {
-    const o = y(r, a);
-    if (s.isTwoDigitYear) {
-      const l = p(
-        s.year,
-        o
-      );
-      return r.setFullYear(
-        l,
-        0,
-        a.firstWeekContainsDate
-      ), r.setHours(0, 0, 0, 0), m(r, a);
-    }
-    const c = !("era" in e) || e.era === 1 ? s.year : 1 - s.year;
-    return r.setFullYear(c, 0, a.firstWeekContainsDate), r.setHours(0, 0, 0, 0), m(r, a);
-  }
-}
+import { labelDay as o, labelDayButton as l } from "./index.es335.js";
+import { labelCaption as t, labelGrid as b } from "./index.es336.js";
+import { labelGridcell as m } from "./index.es337.js";
+import { labelMonthDropdown as f } from "./index.es338.js";
+import { labelNav as n } from "./index.es339.js";
+import { labelNext as u } from "./index.es340.js";
+import { labelPrevious as N } from "./index.es341.js";
+import { labelWeekday as y } from "./index.es342.js";
+import { labelWeekNumber as v } from "./index.es343.js";
+import { labelWeekNumberHeader as G } from "./index.es344.js";
+import { labelYearDropdown as h } from "./index.es345.js";
 export {
-  C as LocalWeekYearParser
+  t as labelCaption,
+  o as labelDay,
+  l as labelDayButton,
+  b as labelGrid,
+  m as labelGridcell,
+  f as labelMonthDropdown,
+  n as labelNav,
+  u as labelNext,
+  N as labelPrevious,
+  v as labelWeekNumber,
+  G as labelWeekNumberHeader,
+  y as labelWeekday,
+  h as labelYearDropdown
 };

package/index.es317.js

@@ -1,40 +1,22 @@
-var f = Object.defineProperty;
-var p = (t, e, r) => e in t ? f(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r;
-var i = (t, e, r) => (p(t, typeof e != "symbol" ? e + "" : e, r), r);
-import { startOfISOWeek as n } from "./index.es254.js";
-import { constructFrom as u } from "./index.es237.js";
-import { Parser as c } from "./index.es395.js";
-import { parseNDigitsSigned as a } from "./index.es396.js";
-class W extends c {
-  constructor() {
-    super(...arguments);
-    i(this, "priority", 130);
-    i(this, "incompatibleTokens", [
-      "G",
-      "y",
-      "Y",
-      "u",
-      "Q",
-      "q",
-      "M",
-      "L",
-      "w",
-      "d",
-      "D",
-      "e",
-      "c",
-      "t",
-      "T"
-    ]);
-  }
-  parse(r, s) {
-    return s === "R" ? a(4, r) : a(s.length, r);
-  }
-  set(r, s, m) {
-    const o = u(r, 0);
-    return o.setFullYear(m, 0, 4), o.setHours(0, 0, 0, 0), n(o);
-  }
-}
+var o;
+(function(e) {
+  e.Root = "root", e.Chevron = "chevron", e.Day = "day", e.DayButton = "day_button", e.CaptionLabel = "caption_label", e.Dropdowns = "dropdowns", e.Dropdown = "dropdown", e.DropdownRoot = "dropdown_root", e.Footer = "footer", e.MonthGrid = "month_grid", e.MonthCaption = "month_caption", e.MonthsDropdown = "months_dropdown", e.Month = "month", e.Months = "months", e.Nav = "nav", e.NextMonthButton = "button_next", e.PreviousMonthButton = "button_previous", e.Week = "week", e.Weeks = "weeks", e.Weekday = "weekday", e.Weekdays = "weekdays", e.WeekNumber = "week_number", e.WeekNumberHeader = "week_number_header", e.YearsDropdown = "years_dropdown";
+})(o || (o = {}));
+var t;
+(function(e) {
+  e.disabled = "disabled", e.hidden = "hidden", e.outside = "outside", e.focused = "focused", e.today = "today";
+})(t || (t = {}));
+var r;
+(function(e) {
+  e.range_end = "range_end", e.range_middle = "range_middle", e.range_start = "range_start", e.selected = "selected";
+})(r || (r = {}));
+var n;
+(function(e) {
+  e.weeks_before_enter = "weeks_before_enter", e.weeks_before_exit = "weeks_before_exit", e.weeks_after_enter = "weeks_after_enter", e.weeks_after_exit = "weeks_after_exit", e.caption_after_enter = "caption_after_enter", e.caption_after_exit = "caption_after_exit", e.caption_before_enter = "caption_before_enter", e.caption_before_exit = "caption_before_exit";
+})(n || (n = {}));
 export {
-  W as ISOWeekYearParser
+  n as Animation,
+  t as DayFlag,
+  r as SelectionState,
+  o as UI
 };

package/index.es318.js

@@ -1,21 +1,56 @@
-var p = Object.defineProperty;
-var a = (s, e, r) => e in s ? p(s, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : s[e] = r;
-var i = (s, e, r) => (a(s, typeof e != "symbol" ? e + "" : e, r), r);
-import { Parser as l } from "./index.es395.js";
-import { parseNDigitsSigned as o } from "./index.es396.js";
-class c extends l {
-  constructor() {
-    super(...arguments);
-    i(this, "priority", 130);
-    i(this, "incompatibleTokens", ["G", "y", "Y", "R", "w", "I", "i", "e", "c", "t", "T"]);
-  }
-  parse(r, t) {
-    return t === "u" ? o(4, r) : o(t.length, r);
-  }
-  set(r, t, n) {
-    return r.setFullYear(n, 0, 1), r.setHours(0, 0, 0, 0), r;
-  }
+import { useRef as q, useLayoutEffect as z } from "react";
+import { Animation as o } from "./index.es317.js";
+const l = (e) => e instanceof HTMLElement ? e : null, w = (e) => [
+  ...e.querySelectorAll("[data-animated-month]") ?? []
+], I = (e) => l(e.querySelector("[data-animated-month]")), S = (e) => l(e.querySelector("[data-animated-caption]")), A = (e) => l(e.querySelector("[data-animated-weeks]")), B = (e) => l(e.querySelector("[data-animated-nav]")), P = (e) => l(e.querySelector("[data-animated-weekdays]"));
+function D(e, b, { classNames: s, months: a, focused: g, dateLib: H }) {
+  const p = q(null), h = q(a), v = q(!1);
+  z(() => {
+    const f = h.current;
+    if (h.current = a, !b || !e.current || // safety check because the ref can be set to anything by consumers
+    !(e.current instanceof HTMLElement) || // validation required for the animation to work as expected
+    a.length === 0 || f.length === 0 || a.length !== f.length)
+      return;
+    const M = H.isSameMonth(a[0].date, f[0].date), u = H.isAfter(a[0].date, f[0].date), m = u ? s[o.caption_after_enter] : s[o.caption_before_enter], L = u ? s[o.weeks_after_enter] : s[o.weeks_before_enter], x = p.current, _ = e.current.cloneNode(!0);
+    if (_ instanceof HTMLElement ? (w(_).forEach((t) => {
+      if (!(t instanceof HTMLElement))
+        return;
+      const c = I(t);
+      c && t.contains(c) && t.removeChild(c);
+      const n = S(t);
+      n && n.classList.remove(m);
+      const r = A(t);
+      r && r.classList.remove(L);
+    }), p.current = _) : p.current = null, v.current || M || // skip animation if a day is focused because it can cause issues to the animation and is better for a11y
+    g)
+      return;
+    const k = x instanceof HTMLElement ? w(x) : [], d = w(e.current);
+    if (d != null && d.every((i) => i instanceof HTMLElement) && k && k.every((i) => i instanceof HTMLElement)) {
+      v.current = !0, e.current.style.isolation = "isolate";
+      const i = B(e.current);
+      i && (i.style.zIndex = "1"), d.forEach((t, c) => {
+        const n = k[c];
+        if (!n)
+          return;
+        t.style.position = "relative", t.style.overflow = "hidden";
+        const r = S(t);
+        r && r.classList.add(m);
+        const y = A(t);
+        y && y.classList.add(L);
+        const W = () => {
+          v.current = !1, e.current && (e.current.style.isolation = ""), i && (i.style.zIndex = ""), r && r.classList.remove(m), y && y.classList.remove(L), t.style.position = "", t.style.overflow = "", t.contains(n) && t.removeChild(n);
+        };
+        n.style.pointerEvents = "none", n.style.position = "absolute", n.style.overflow = "hidden", n.setAttribute("aria-hidden", "true");
+        const C = P(n);
+        C && (C.style.opacity = "0");
+        const E = S(n);
+        E && (E.classList.add(u ? s[o.caption_before_exit] : s[o.caption_after_exit]), E.addEventListener("animationend", W));
+        const T = A(n);
+        T && T.classList.add(u ? s[o.weeks_before_exit] : s[o.weeks_after_exit]), t.insertBefore(n, t.firstChild);
+      });
+    }
+  });
 }
 export {
-  c as ExtendedYearParser
+  D as useAnimation
 };

package/index.es319.js

@@ -1,70 +1,76 @@
-var n = Object.defineProperty;
-var s = (o, e, r) => e in o ? n(o, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : o[e] = r;
-var i = (o, e, r) => (s(o, typeof e != "symbol" ? e + "" : e, r), r);
-import { Parser as u } from "./index.es395.js";
-import { parseNDigits as Q } from "./index.es396.js";
-class q extends u {
-  constructor() {
-    super(...arguments);
-    i(this, "priority", 120);
-    i(this, "incompatibleTokens", [
-      "Y",
-      "R",
-      "q",
-      "M",
-      "L",
-      "w",
-      "I",
-      "d",
-      "D",
-      "i",
-      "e",
-      "c",
-      "t",
-      "T"
-    ]);
-  }
-  parse(r, a, t) {
-    switch (a) {
-      case "Q":
-      case "QQ":
-        return Q(a.length, r);
-      case "Qo":
-        return t.ordinalNumber(r, { unit: "quarter" });
-      case "QQQ":
-        return t.quarter(r, {
-          width: "abbreviated",
-          context: "formatting"
-        }) || t.quarter(r, {
-          width: "narrow",
-          context: "formatting"
-        });
-      case "QQQQQ":
-        return t.quarter(r, {
-          width: "narrow",
-          context: "formatting"
-        });
-      case "QQQQ":
-      default:
-        return t.quarter(r, {
-          width: "wide",
-          context: "formatting"
-        }) || t.quarter(r, {
-          width: "abbreviated",
-          context: "formatting"
-        }) || t.quarter(r, {
-          width: "narrow",
-          context: "formatting"
-        });
+import { useEffect as N, useMemo as w } from "react";
+import { getDates as S } from "./index.es370.js";
+import { getDays as b } from "./index.es371.js";
+import { getDisplayMonths as q } from "./index.es372.js";
+import { getInitialMonth as g } from "./index.es373.js";
+import { getMonths as E } from "./index.es374.js";
+import { getNavMonths as F } from "./index.es375.js";
+import { getNextMonth as P } from "./index.es376.js";
+import { getPreviousMonth as V } from "./index.es377.js";
+import { getWeeks as Z } from "./index.es378.js";
+import { useControlledValue as j } from "./index.es379.js";
+function $(e, o) {
+  var l;
+  const [s, t] = F(e, o), { startOfMonth: a, endOfMonth: u } = o, h = g(e, s, t, o), [r, M] = j(
+    h,
+    // initialMonth is always computed from props.month if provided
+    e.month ? h : void 0
+  );
+  N(() => {
+    const n = g(e, s, t, o);
+    M(n);
+  }, [e.timeZone]);
+  const { months: k, weeks: c, days: W, previousMonth: O, nextMonth: x } = w(() => {
+    const n = q(r, t, { numberOfMonths: e.numberOfMonths }, o), i = S(n, e.endMonth ? u(e.endMonth) : void 0, {
+      ISOWeek: e.ISOWeek,
+      fixedWeeks: e.fixedWeeks,
+      broadcastCalendar: e.broadcastCalendar
+    }, o), m = E(n, i, {
+      broadcastCalendar: e.broadcastCalendar,
+      fixedWeeks: e.fixedWeeks,
+      ISOWeek: e.ISOWeek,
+      reverseMonths: e.reverseMonths
+    }, o), I = Z(m), T = b(m), C = V(r, s, e, o), D = P(r, t, e, o);
+    return {
+      months: m,
+      weeks: I,
+      days: T,
+      previousMonth: C,
+      nextMonth: D
+    };
+  }, [
+    o,
+    r.getTime(),
+    t == null ? void 0 : t.getTime(),
+    s == null ? void 0 : s.getTime(),
+    e.disableNavigation,
+    e.broadcastCalendar,
+    (l = e.endMonth) == null ? void 0 : l.getTime(),
+    e.fixedWeeks,
+    e.ISOWeek,
+    e.numberOfMonths,
+    e.pagedNavigation,
+    e.reverseMonths
+  ]), { disableNavigation: v, onMonthChange: f } = e, y = (n) => c.some((i) => i.days.some((m) => m.isEqualTo(n))), d = (n) => {
+    if (v)
+      return;
+    let i = a(n);
+    s && i < a(s) && (i = a(s)), t && i > a(t) && (i = a(t)), M(i), f == null || f(i);
+  };
+  return {
+    months: k,
+    weeks: c,
+    days: W,
+    navStart: s,
+    navEnd: t,
+    previousMonth: O,
+    nextMonth: x,
+    goToMonth: d,
+    goToDay: (n) => {
+      y(n) || d(n.date);
     }
-  }
-  validate(r, a) {
-    return a >= 1 && a <= 4;
-  }
-  set(r, a, t) {
-    return r.setMonth((t - 1) * 3, 1), r.setHours(0, 0, 0, 0), r;
-  }
+  };
 }
 export {
-  q as QuarterParser
+  $ as useCalendar
 };

package/index.es32.js

@@ -1,125 +1,23 @@
-import { jsxs as c, jsx as s } from "react/jsx-runtime";
-import * as e from "@radix-ui/react-dropdown-menu";
-import * as r from "react";
-import { cn as d } from "./index.es89.js";
-import l from "./index.es134.js";
-import p from "./index.es135.js";
-import m from "./index.es136.js";
-const S = e.Root, C = e.Trigger, z = e.Group, k = e.Portal, T = e.Sub, j = e.RadioGroup, u = r.forwardRef(({ className: a, inset: t, children: o, ...n }, i) => /* @__PURE__ */ c(
-  e.SubTrigger,
+import { jsx as t } from "react/jsx-runtime";
+import * as o from "@radix-ui/react-collapsible";
+import * as s from "react";
+import { cn as i } from "./index.es94.js";
+const c = o.Root, b = s.forwardRef(({ className: r, children: e, ...l }, a) => /* @__PURE__ */ t(
+  o.Trigger,
   {
-    ref: i,
-    className: d(
-      "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[state=open]:bg-accent focus:bg-accent",
-      t && "pl-8",
-      a
+    ref: a,
+    className: i(
+      "group hover:bg-button-background-neutral focus:border-2 focus:border-black active:bg-button-background-neutral-pressed",
+      r
     ),
-    ...n,
-    children: [
-      o,
-      /* @__PURE__ */ s(l, { className: "ml-auto h-4 w-4" })
-    ]
+    ...l,
+    children: e
   }
 ));
-u.displayName = e.SubTrigger.displayName;
-const f = r.forwardRef(({ className: a, ...t }, o) => /* @__PURE__ */ s(
-  e.SubContent,
-  {
-    ref: o,
-    className: d(
-      "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      a
-    ),
-    ...t
-  }
-));
-f.displayName = e.SubContent.displayName;
-const b = r.forwardRef(({ className: a, sideOffset: t = 4, ...o }, n) => /* @__PURE__ */ s(e.Portal, { children: /* @__PURE__ */ s(
-  e.Content,
-  {
-    ref: n,
-    sideOffset: t,
-    className: d(
-      "z-50 min-w-[8rem] overflow-hidden rounded-2 border bg-card p-space-02 text-foreground shadow-xsm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      a
-    ),
-    ...o
-  }
-) }));
-b.displayName = e.Content.displayName;
-const w = r.forwardRef(({ className: a, inset: t, ...o }, n) => /* @__PURE__ */ s(
-  e.Item,
-  {
-    ref: n,
-    className: d(
-      "relative flex cursor-default select-none items-center rounded-1 py-space-02 pe-space-02 ps-space-03 text-body-01 outline-none transition-colors data-[disabled]:pointer-events-none   data-[disabled]:text-disabled focus:bg-card-hover",
-      t && "pl-8",
-      a
-    ),
-    ...o
-  }
-));
-w.displayName = e.Item.displayName;
-const h = r.forwardRef(({ className: a, children: t, checked: o, ...n }, i) => /* @__PURE__ */ c(
-  e.CheckboxItem,
-  {
-    ref: i,
-    className: d(
-      "relative flex cursor-default select-none items-center  rounded-1 py-space-01 pe-space-01 ps-space-03 text-body-01 outline-none transition-colors data-[disabled]:pointer-events-none data-[disabled]:text-disabled focus:bg-card-hover",
-      a
-    ),
-    checked: o,
-    ...n,
-    children: [
-      /* @__PURE__ */ s("span", { className: "absolute -start-space-01 flex h-space-04 w-space-04 items-center justify-center", children: /* @__PURE__ */ s(e.ItemIndicator, { children: /* @__PURE__ */ s(p, { className: "h-space-03 w-space-03" }) }) }),
-      t
-    ]
-  }
-));
-h.displayName = e.CheckboxItem.displayName;
-const N = r.forwardRef(({ className: a, children: t, ...o }, n) => /* @__PURE__ */ c(
-  e.RadioItem,
-  {
-    ref: n,
-    className: d(
-      "relative flex cursor-default select-none items-center rounded-1 py-space-01 pe-space-04 ps-space-03 text-body-01 outline-none transition-colors data-[disabled]:pointer-events-none data-[disabled]:text-disabled focus:bg-card-hover",
-      a
-    ),
-    ...o,
-    children: [
-      /* @__PURE__ */ s("span", { className: "absolute -start-space-01 flex h-space-04 w-space-04 items-center justify-center", children: /* @__PURE__ */ s(e.ItemIndicator, { children: /* @__PURE__ */ s(m, { className: "h-space-02 w-space-02 fill-current" }) }) }),
-      t
-    ]
-  }
-));
-N.displayName = e.RadioItem.displayName;
-const y = r.forwardRef(({ className: a, inset: t, ...o }, n) => /* @__PURE__ */ s(
-  e.Label,
-  {
-    ref: n,
-    className: d("text-caption-01 font-bold text-foreground-secondary", t && "pl-8", a),
-    ...o
-  }
-));
-y.displayName = e.Label.displayName;
-const g = r.forwardRef(({ className: a, ...t }, o) => /* @__PURE__ */ s(e.Separator, { ref: o, className: d("my-space-03 h-px bg-border", a), ...t }));
-g.displayName = e.Separator.displayName;
-const x = ({ className: a, ...t }) => /* @__PURE__ */ s("span", { className: d("ml-auto text-xs tracking-widest opacity-60", a), ...t });
-x.displayName = "DropdownMenuShortcut";
+b.displayName = o.CollapsibleTrigger.displayName;
+const m = o.CollapsibleContent;
 export {
-  S as DropdownMenu,
-  h as DropdownMenuCheckboxItem,
-  b as DropdownMenuContent,
-  z as DropdownMenuGroup,
-  w as DropdownMenuItem,
-  y as DropdownMenuLabel,
-  k as DropdownMenuPortal,
-  j as DropdownMenuRadioGroup,
-  N as DropdownMenuRadioItem,
-  g as DropdownMenuSeparator,
-  x as DropdownMenuShortcut,
-  T as DropdownMenuSub,
-  f as DropdownMenuSubContent,
-  u as DropdownMenuSubTrigger,
-  C as DropdownMenuTrigger
+  c as Collapsible,
+  m as CollapsibleContent,
+  b as CollapsibleTrigger
 };