@utk09/finra-ui 0.0.4 → 0.0.6

package/dist/Calendar-EtS0i3_l.js

@@ -0,0 +1,664 @@
+import { jsx as c, jsxs as w, Fragment as we } from "react/jsx-runtime";
+import { forwardRef as Ie, useId as We, useRef as se, useState as ee, useCallback as M, useMemo as H, useEffect as te } from "react";
+import { m as Me } from "./dateFormat-CGZCSpqw.js";
+function Ke(a, r) {
+  return r ? a.label.toLowerCase().includes(r.toLowerCase()) : !0;
+}
+function Se(a) {
+  const r = [], p = /* @__PURE__ */ new Map(), d = [];
+  for (const h of a)
+    if (h.favourite && r.push(h), h.group) {
+      const S = p.get(h.group) ?? [];
+      S.push(h), p.set(h.group, S);
+    } else
+      d.push(h);
+  const I = [];
+  for (const [h, S] of p)
+    I.push({ label: h, options: S });
+  return { favourites: r, groups: I, ungrouped: d };
+}
+function be(...a) {
+  return a.filter(Boolean).join(" ") || void 0;
+}
+function Pe({
+  options: a,
+  value: r,
+  onChange: p,
+  multiple: d = !1,
+  inputValue: I,
+  onInputChange: h,
+  filterFn: S,
+  loading: T = !1,
+  onLoadOptions: f,
+  creatable: U = !1,
+  onCreateOption: A,
+  formatCreateLabel: $,
+  header: L,
+  footer: W,
+  placeholder: C,
+  disabled: m = !1,
+  noOptionsMessage: F = "No options",
+  renderOption: O,
+  renderValue: v,
+  renderCheckIcon: g,
+  renderIndicator: y,
+  renderPillRemoveIcon: K,
+  renderLoading: P,
+  open: Y,
+  onOpenChange: D,
+  classNames: t,
+  dataAttributes: V,
+  "aria-label": z,
+  "aria-labelledby": ie,
+  ...le
+}, ae) {
+  const s = We(), i = `${s}-listbox`, o = se(null), Q = se(null), j = se(null), [ue, Ee] = ee(""), [Ae, Ce] = ee(!1), [k, E] = ee(-1), u = Y ?? Ae, b = I ?? ue, N = M(
+    (e) => {
+      Y === void 0 && Ce(e), D?.(e);
+    },
+    [Y, D]
+  ), B = M(
+    (e) => {
+      I === void 0 && Ee(e), h?.(e);
+    },
+    [I, h]
+  ), x = H(() => r == null ? [] : Array.isArray(r) ? r : [r], [r]), ce = M(
+    (e) => x.some((n) => n === e),
+    [x]
+  ), ve = S ?? Ke, ne = H(
+    () => a.filter((e) => ve(e, b)),
+    [a, ve, b]
+  ), X = H(() => {
+    const { favourites: e, groups: n, ungrouped: l } = Se(ne), R = [];
+    for (const G of e) R.push(G);
+    for (const G of n)
+      for (const xe of G.options)
+        xe.favourite || R.push(xe);
+    for (const G of l)
+      G.favourite || R.push(G);
+    return R;
+  }, [ne]), Z = U && b.trim() !== "" && !a.some((e) => e.label.toLowerCase() === b.trim().toLowerCase()), _e = $ ? $(b.trim()) : `Create "${b.trim()}"`, J = X.length + (Z ? 1 : 0), de = M(
+    (e) => {
+      if (!e.disabled) {
+        if (d) {
+          const n = ce(e.value) ? x.filter((l) => l !== e.value) : [...x, e.value];
+          p?.(n), B("");
+        } else
+          p?.(e.value), B(e.label), N(!1);
+        o.current?.focus();
+      }
+    },
+    [d, ce, x, p, B, N]
+  ), fe = M(
+    (e) => {
+      if (!d) return;
+      const n = x.filter((l) => l !== e);
+      p?.(n.length > 0 ? n : null), o.current?.focus();
+    },
+    [d, x, p]
+  ), $e = M(
+    (e) => {
+      if (!m)
+        switch (e.key) {
+          case "ArrowDown": {
+            e.preventDefault(), u ? E((n) => (n + 1) % J) : (N(!0), E(0));
+            break;
+          }
+          case "ArrowUp": {
+            e.preventDefault(), u ? E((n) => (n - 1 + J) % J) : (N(!0), E(J - 1));
+            break;
+          }
+          case "Enter": {
+            e.preventDefault(), u && k >= 0 ? k < X.length ? de(X[k]) : Z && (A?.(b.trim()), B("")) : u || N(!0);
+            break;
+          }
+          case "Escape": {
+            u && (e.preventDefault(), N(!1), E(-1));
+            break;
+          }
+          case "Backspace": {
+            d && b === "" && x.length > 0 && fe(x[x.length - 1]);
+            break;
+          }
+          case "Home": {
+            u && (e.preventDefault(), E(0));
+            break;
+          }
+          case "End": {
+            u && (e.preventDefault(), E(J - 1));
+            break;
+          }
+        }
+    },
+    [
+      m,
+      u,
+      N,
+      k,
+      J,
+      X,
+      de,
+      Z,
+      A,
+      b,
+      B,
+      d,
+      x,
+      fe
+    ]
+  ), Le = M(
+    (e) => {
+      const n = e.target.value;
+      B(n), u || N(!0), E(0), f?.(n);
+    },
+    [B, u, N, f]
+  ), Oe = M(() => {
+    !m && !u && N(!0);
+  }, [m, u, N]);
+  te(() => {
+    if (!u) return;
+    const e = (n) => {
+      j.current && !j.current.contains(n.target) && (N(!1), E(-1));
+    };
+    return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+  }, [u, N]), te(() => {
+    if (k < 0 || !Q.current) return;
+    const e = Q.current.querySelector(`[data-index="${k}"]`);
+    e && e.scrollIntoView?.({ block: "nearest" });
+  }, [k]);
+  const { favourites: pe, groups: De, ungrouped: Ye } = H(
+    () => Se(ne),
+    [ne]
+  ), he = (e) => `${s}-option-${e}`, re = (e, n) => {
+    const l = {
+      isSelected: ce(e.value),
+      isHighlighted: k === n,
+      isDisabled: e.disabled ?? !1,
+      isFavourite: e.favourite ?? !1
+    };
+    return /* @__PURE__ */ c(
+      "div",
+      {
+        id: he(n),
+        role: "option",
+        tabIndex: -1,
+        "data-index": n,
+        "aria-selected": l.isSelected,
+        "aria-disabled": l.isDisabled || void 0,
+        "data-highlighted": l.isHighlighted || void 0,
+        "data-selected": l.isSelected || void 0,
+        "data-disabled": l.isDisabled || void 0,
+        className: be(
+          t?.option,
+          l.isHighlighted && t?.optionHighlighted,
+          l.isSelected && t?.optionSelected,
+          l.isDisabled && t?.optionDisabled
+        ),
+        onMouseDown: (R) => {
+          R.preventDefault(), de(e);
+        },
+        onMouseEnter: () => E(n),
+        children: O ? O(e, l) : /* @__PURE__ */ w(we, { children: [
+          /* @__PURE__ */ c("span", { className: t?.optionLabel, children: e.label }),
+          l.isSelected && g ? g() : null
+        ] })
+      },
+      `${n}-${String(e.value)}`
+    );
+  }, Be = () => d ? x.map((e) => {
+    const n = a.find((l) => l.value === e);
+    return n ? /* @__PURE__ */ w("span", { className: t?.pill, "data-combobox-pill": !0, children: [
+      /* @__PURE__ */ c("span", { className: t?.pillText, children: v ? v(n) : n.label }),
+      m ? null : /* @__PURE__ */ c(
+        "button",
+        {
+          type: "button",
+          className: t?.pillRemove,
+          tabIndex: -1,
+          "aria-label": `Remove ${n.label}`,
+          onMouseDown: (l) => {
+            l.preventDefault(), l.stopPropagation(), fe(e);
+          },
+          children: K ? K() : "×"
+        }
+      )
+    ] }, String(e)) : null;
+  }) : null, Re = H(() => {
+    if (d || u) return b;
+    if (r != null && !v) {
+      const e = a.find((n) => n.value === r);
+      if (e) return e.label;
+    }
+    return b;
+  }, [d, u, b, r, a, v]), ye = H(() => {
+    if (d || u || r == null || !v) return null;
+    const e = a.find((n) => n.value === r);
+    return e ? /* @__PURE__ */ c("span", { className: t?.singleValue, children: v(e) }) : null;
+  }, [d, u, r, a, v, t?.singleValue]), q = [];
+  let _ = 0;
+  pe.length > 0 && q.push(
+    /* @__PURE__ */ w(
+      "div",
+      {
+        role: "group",
+        "aria-label": "Favourites",
+        className: t?.group,
+        "data-combobox-group": "favourites",
+        children: [
+          /* @__PURE__ */ c("div", { className: t?.groupLabel, "data-combobox-group-label": !0, "aria-hidden": "true", children: "Favourites" }),
+          pe.map((e) => {
+            const n = re(e, _);
+            return _++, n;
+          })
+        ]
+      },
+      "__fav-group"
+    )
+  );
+  for (const e of De) {
+    const n = e.options.filter((l) => !l.favourite);
+    n.length !== 0 && q.push(
+      /* @__PURE__ */ w(
+        "div",
+        {
+          role: "group",
+          "aria-label": e.label,
+          className: t?.group,
+          "data-combobox-group": e.label,
+          children: [
+            /* @__PURE__ */ c("div", { className: t?.groupLabel, "data-combobox-group-label": !0, "aria-hidden": "true", children: e.label }),
+            n.map((l) => {
+              const R = re(l, _);
+              return _++, R;
+            })
+          ]
+        },
+        `__group-${e.label}`
+      )
+    );
+  }
+  const ge = Ye.filter((e) => !e.favourite);
+  if (ge.length > 0)
+    if (pe.length > 0 || De.length > 0)
+      q.push(
+        /* @__PURE__ */ w(
+          "div",
+          {
+            role: "group",
+            "aria-label": "All",
+            className: t?.group,
+            "data-combobox-group": "all",
+            children: [
+              /* @__PURE__ */ c("div", { className: t?.groupLabel, "data-combobox-group-label": !0, "aria-hidden": "true", children: "All" }),
+              ge.map((e) => {
+                const n = re(e, _);
+                return _++, n;
+              })
+            ]
+          },
+          "__ungrouped"
+        )
+      );
+    else
+      for (const e of ge)
+        q.push(re(e, _)), _++;
+  if (Z) {
+    const e = _;
+    q.push(
+      /* @__PURE__ */ c(
+        "div",
+        {
+          id: he(e),
+          role: "option",
+          tabIndex: -1,
+          "data-index": e,
+          "aria-selected": !1,
+          "data-highlighted": k === e || void 0,
+          "data-combobox-create": !0,
+          className: be(
+            t?.option,
+            t?.optionCreate,
+            k === e && t?.optionHighlighted
+          ),
+          onMouseDown: (n) => {
+            n.preventDefault(), A?.(b.trim()), B("");
+          },
+          onMouseEnter: () => E(e),
+          children: _e
+        },
+        "__create"
+      )
+    );
+  }
+  const He = X.length > 0 || Z, Ne = {
+    type: "text",
+    role: "searchbox",
+    "aria-autocomplete": "list",
+    "aria-controls": u ? i : void 0,
+    "aria-activedescendant": u && k >= 0 ? he(k) : void 0,
+    "aria-label": z ?? C,
+    "aria-labelledby": ie,
+    onChange: Le,
+    onKeyDown: $e,
+    onFocus: Oe,
+    disabled: m
+  };
+  return /* @__PURE__ */ w("div", { ref: j, className: t?.root, ...V, ...le, children: [
+    /* @__PURE__ */ w(
+      "div",
+      {
+        role: "combobox",
+        "aria-expanded": u,
+        "aria-controls": u ? i : void 0,
+        "aria-haspopup": "listbox",
+        "aria-disabled": m || void 0,
+        className: t?.wrapper,
+        children: [
+          d ? /* @__PURE__ */ w("div", { className: t?.multiValueContainer, children: [
+            Be(),
+            /* @__PURE__ */ c(
+              "input",
+              {
+                ref: Me(ae, o),
+                className: t?.input,
+                ...Ne,
+                value: b,
+                placeholder: x.length === 0 ? C : void 0
+              }
+            )
+          ] }) : /* @__PURE__ */ w(we, { children: [
+            ye,
+            /* @__PURE__ */ c(
+              "input",
+              {
+                ref: Me(ae, o),
+                className: be(t?.input, ye ? t?.inputHidden : void 0),
+                ...Ne,
+                value: Re,
+                placeholder: C
+              }
+            )
+          ] }),
+          y ? y(u) : null
+        ]
+      }
+    ),
+    u ? /* @__PURE__ */ w("div", { className: t?.listbox, children: [
+      L ? /* @__PURE__ */ c("div", { className: t?.header, children: L }) : null,
+      /* @__PURE__ */ c(
+        "div",
+        {
+          ref: Q,
+          id: i,
+          role: "listbox",
+          "aria-multiselectable": d || void 0,
+          className: t?.options,
+          tabIndex: -1,
+          children: T ? /* @__PURE__ */ c("div", { role: "presentation", className: t?.loading, "aria-live": "polite", children: P ? P() : "Loading..." }) : He ? q : /* @__PURE__ */ c("div", { role: "presentation", className: t?.empty, "aria-live": "polite", children: F })
+        }
+      ),
+      W ? /* @__PURE__ */ c("div", { className: t?.footer, children: W }) : null
+    ] }) : null
+  ] });
+}
+const Ue = Ie(Pe);
+Ue.displayName = "ComboBoxBase";
+function me(a, r) {
+  return a.getFullYear() === r.getFullYear() && a.getMonth() === r.getMonth() && a.getDate() === r.getDate();
+}
+function oe(a) {
+  return new Date(a.getFullYear(), a.getMonth(), a.getDate());
+}
+const Te = [
+  "January",
+  "February",
+  "March",
+  "April",
+  "May",
+  "June",
+  "July",
+  "August",
+  "September",
+  "October",
+  "November",
+  "December"
+], Ve = ["Mo", "Tu", "We", "Th", "Fr", "Sa", "Su"], je = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], Je = [
+  "Monday",
+  "Tuesday",
+  "Wednesday",
+  "Thursday",
+  "Friday",
+  "Saturday",
+  "Sunday"
+], qe = [
+  "Sunday",
+  "Monday",
+  "Tuesday",
+  "Wednesday",
+  "Thursday",
+  "Friday",
+  "Saturday"
+];
+function Ge(a, r) {
+  return (a.getDay() - r + 7) % 7;
+}
+function ze(a, r, p, d, I, h, S, T) {
+  const f = new Date(a, r, 1), U = Ge(f, p), A = new Date(a, r, 1 - U), $ = [], L = h ? oe(h) : null, W = S ? oe(S) : null, C = oe(I);
+  for (let m = 0; m < 42; m++) {
+    const F = new Date(A.getFullYear(), A.getMonth(), A.getDate() + m), O = oe(F), v = F.getMonth() === r && F.getFullYear() === a;
+    let g = !v;
+    v && (L && O < L && (g = !0), W && O > W && (g = !0), !g && T && (typeof T == "function" ? g = T(F) : g = T.some((y) => me(y, F)))), $.push({
+      date: F,
+      isCurrentMonth: v,
+      isToday: me(F, C),
+      isSelected: d != null && me(F, d),
+      isDisabled: g
+    });
+  }
+  return $;
+}
+function Fe(...a) {
+  return a.filter(Boolean).join(" ") || void 0;
+}
+function ke(a, r) {
+  return `${Te[r]} ${a}`;
+}
+function Qe(a) {
+  return `${Te[a.getMonth()]} ${a.getDate()}, ${a.getFullYear()}`;
+}
+const Xe = Ie(
+  ({
+    value: a,
+    onSelect: r,
+    month: p,
+    onMonthChange: d,
+    min: I,
+    max: h,
+    disabledDates: S,
+    weekStartsOn: T = 1,
+    classNames: f,
+    renderNavPrev: U,
+    renderNavNext: A,
+    footer: $,
+    today: L
+  }, W) => {
+    const C = H(() => L ?? /* @__PURE__ */ new Date(), [L]), m = se(null), [F, O] = ee(() => p || (a ? new Date(a.getFullYear(), a.getMonth(), 1) : new Date(C.getFullYear(), C.getMonth(), 1))), v = p ?? F, g = v.getFullYear(), y = v.getMonth(), K = M(
+      (s) => {
+        p || O(s), d?.(s);
+      },
+      [p, d]
+    );
+    te(() => {
+      p && O(p);
+    }, [p]);
+    const P = M(() => {
+      K(new Date(g, y - 1, 1));
+    }, [g, y, K]), Y = M(() => {
+      K(new Date(g, y + 1, 1));
+    }, [g, y, K]), D = H(
+      () => ze(
+        g,
+        y,
+        T,
+        a,
+        C,
+        I,
+        h,
+        S
+      ),
+      [g, y, T, a, C, I, h, S]
+    ), [t, V] = ee(() => {
+      const s = D.findIndex((o) => o.isSelected && o.isCurrentMonth);
+      if (s >= 0) return s;
+      const i = D.findIndex((o) => o.isToday && o.isCurrentMonth);
+      return i >= 0 ? i : D.findIndex((o) => o.isCurrentMonth);
+    });
+    te(() => {
+      const s = D.findIndex((o) => o.isSelected && o.isCurrentMonth);
+      if (s >= 0) {
+        V(s);
+        return;
+      }
+      const i = D.findIndex((o) => o.isToday && o.isCurrentMonth);
+      if (i >= 0) {
+        V(i);
+        return;
+      }
+      V(D.findIndex((o) => o.isCurrentMonth));
+    }, [D]), te(() => {
+      const s = m.current;
+      if (!s) return;
+      const i = s.querySelector(`[data-day-index="${t}"]`);
+      i && s.contains(document.activeElement) && i.focus();
+    }, [t]);
+    const z = M(
+      (s) => {
+        s.isDisabled || r?.(s.date);
+      },
+      [r]
+    ), ie = M(
+      (s) => {
+        let i = t;
+        switch (s.key) {
+          case "ArrowRight":
+            s.preventDefault(), i = t + 1;
+            break;
+          case "ArrowLeft":
+            s.preventDefault(), i = t - 1;
+            break;
+          case "ArrowDown":
+            s.preventDefault(), i = t + 7;
+            break;
+          case "ArrowUp":
+            s.preventDefault(), i = t - 7;
+            break;
+          case "Enter":
+          case " ":
+            s.preventDefault(), t >= 0 && t < D.length && z(D[t]);
+            return;
+          case "PageDown":
+            s.preventDefault(), Y();
+            return;
+          case "PageUp":
+            s.preventDefault(), P();
+            return;
+          default:
+            return;
+        }
+        if (i < 0) {
+          P();
+          return;
+        }
+        if (i >= 42) {
+          Y();
+          return;
+        }
+        V(i);
+      },
+      [t, D, z, Y, P]
+    ), le = T === 1 ? Ve : je, ae = T === 1 ? Je : qe;
+    return /* @__PURE__ */ w("div", { ref: W, className: f?.root, children: [
+      /* @__PURE__ */ w("div", { className: f?.header, children: [
+        /* @__PURE__ */ c(
+          "button",
+          {
+            type: "button",
+            className: f?.navButton,
+            onClick: P,
+            "aria-label": "Previous month",
+            children: U ? U() : "◀"
+          }
+        ),
+        /* @__PURE__ */ c("div", { className: f?.title, "aria-live": "polite", children: ke(g, y) }),
+        /* @__PURE__ */ c(
+          "button",
+          {
+            type: "button",
+            className: f?.navButton,
+            onClick: Y,
+            "aria-label": "Next month",
+            children: A ? A() : "▶"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ w(
+        "div",
+        {
+          ref: m,
+          className: f?.grid,
+          role: "grid",
+          tabIndex: -1,
+          "aria-label": ke(g, y),
+          onKeyDown: ie,
+          children: [
+            /* @__PURE__ */ c("div", { className: Fe(f?.weekdayRow, f?.row), role: "row", children: le.map((s, i) => /* @__PURE__ */ c(
+              "span",
+              {
+                className: f?.weekday,
+                role: "columnheader",
+                "aria-label": ae[i],
+                children: s
+              },
+              s
+            )) }),
+            Array.from({ length: 6 }, (s, i) => /* @__PURE__ */ c("div", { className: f?.row, role: "row", children: D.slice(i * 7, i * 7 + 7).map((o, Q) => {
+              const j = i * 7 + Q;
+              return /* @__PURE__ */ c(
+                "button",
+                {
+                  type: "button",
+                  role: "gridcell",
+                  "data-day-index": j,
+                  tabIndex: j === t ? 0 : -1,
+                  "aria-label": Qe(o.date),
+                  "aria-selected": o.isSelected || void 0,
+                  "aria-disabled": o.isDisabled || void 0,
+                  disabled: o.isDisabled,
+                  className: Fe(
+                    f?.day,
+                    o.isToday && f?.dayToday,
+                    o.isSelected && f?.daySelected,
+                    o.isDisabled && f?.dayDisabled,
+                    !o.isCurrentMonth && f?.dayOutside
+                  ),
+                  onMouseDown: (ue) => {
+                    ue.preventDefault(), z(o);
+                  },
+                  children: o.date.getDate()
+                },
+                o.date.getTime()
+              );
+            }) }, i))
+          ]
+        }
+      ),
+      $ ? /* @__PURE__ */ c("div", { className: f?.footer, children: $ }) : null
+    ] });
+  }
+);
+Xe.displayName = "CalendarBase";
+export {
+  Ue as C,
+  Xe as a
+};
+//# sourceMappingURL=Calendar-EtS0i3_l.js.map