@konstructio/ui 0.1.2-alpha.99 → 0.1.3

package/dist/components/TagsInput/TagsInput.js

@@ -0,0 +1,159 @@
+import { LoaderIcon as te } from "../../assets/icons/components/Loader.js";
+import { n as re, t as x } from "../../utils-DnIJruo0.js";
+import { Badge as ae } from "../Badge/Badge.js";
+import { Typography as w } from "../Typography/Typography.js";
+import { forwardRef as ne, useId as le, useMemo as se, useRef as oe, useState as k } from "react";
+import { jsx as a, jsxs as m } from "react/jsx-runtime";
+var ie = ["Enter", ","], de = ne(({ className: K, commitOnBlur: M = !0, delimiters: S = ie, disabled: u = !1, error: h, errorClassName: $, helperText: I, helperTextClassName: O, id: U, isLoading: g = !1, isRequired: N = !1, label: b, labelAction: D, loadingText: v = "Loading suggestions", placeholder: q, suggestions: T = [], theme: H, value: r, onBlur: V, onChange: C, onFocus: _, ...G }, f) => {
+  const J = le(), o = U ?? J, E = `${o}-suggestions`, L = `${o}-error`, B = `${o}-helper-text`, F = oe(null), [l, R] = k(""), [j, i] = k(!1), [d, s] = k(-1), c = typeof h == "string" && h.length > 0, z = !c && !!I, P = re(c && L, z && B), n = se(() => {
+    const e = l.trim().toLowerCase();
+    return T.filter((t) => !r.includes(t) && t.toLowerCase().includes(e));
+  }, [
+    l,
+    T,
+    r
+  ]), y = j && !u && (g || n.length > 0), Q = (e) => {
+    F.current = e, typeof f == "function" ? f(e) : f && (f.current = e);
+  }, p = (e) => {
+    const t = e.trim();
+    t && !r.includes(t) && C([...r, t]), R(""), s(-1);
+  }, A = (e) => {
+    C(r.filter((t) => t !== e));
+  }, W = (e) => {
+    if (e.key === "ArrowDown" && n.length > 0) {
+      e.preventDefault(), i(!0), s((t) => (t + 1) % n.length);
+      return;
+    }
+    if (e.key === "ArrowUp" && n.length > 0) {
+      e.preventDefault(), s((t) => t <= 0 ? n.length - 1 : t - 1);
+      return;
+    }
+    if (e.key === "Escape") {
+      i(!1), s(-1);
+      return;
+    }
+    if (S.includes(e.key)) {
+      if (e.preventDefault(), j && d >= 0 && n[d]) {
+        p(n[d]);
+        return;
+      }
+      p(l);
+      return;
+    }
+    e.key === "Backspace" && l === "" && r.length > 0 && (e.preventDefault(), A(r[r.length - 1]));
+  }, X = (e) => {
+    R(e.target.value), i(!0), s(-1);
+  }, Y = (e) => {
+    i(!0), _?.(e);
+  }, Z = (e) => {
+    M && p(l), i(!1), s(-1), V?.(e);
+  };
+  return /* @__PURE__ */ m("div", {
+    className: "flex w-full flex-col gap-2",
+    "data-theme": H,
+    children: [
+      b || D ? /* @__PURE__ */ m("div", {
+        className: "flex items-center justify-between",
+        children: [b ? /* @__PURE__ */ m(w, {
+          component: "label",
+          variant: "labelLarge",
+          htmlFor: o,
+          className: "cursor-pointer text-slate-800 dark:text-metal-50",
+          children: [b, N ? /* @__PURE__ */ a("span", {
+            "aria-hidden": "true",
+            className: "ml-1 text-red-600 dark:text-red-500",
+            children: "*"
+          }) : null]
+        }) : null, D]
+      }) : null,
+      /* @__PURE__ */ m("div", {
+        role: "presentation",
+        className: x("relative flex min-h-10 w-full flex-wrap items-center gap-2 rounded border bg-white px-2.5 py-2 transition-all", "focus-within:border-transparent focus-within:ring-1", "dark:bg-metal-800", c ? "border-red-600 focus-within:ring-red-600 dark:border-red-500 dark:focus-within:ring-red-500" : "border-gray-200 focus-within:ring-aurora-500 dark:border-metal-700", u && "cursor-not-allowed bg-gray-100 dark:bg-metal-900", K),
+        onClick: () => {
+          F.current?.focus();
+        },
+        children: [
+          r.map((e) => /* @__PURE__ */ a(ae, {
+            label: e,
+            dismissible: !0,
+            onDismiss: () => {
+              u || A(e);
+            }
+          }, e)),
+          /* @__PURE__ */ a("input", {
+            ...G,
+            ref: Q,
+            id: o,
+            type: "text",
+            role: "combobox",
+            value: l,
+            placeholder: r.length === 0 ? q : void 0,
+            disabled: u,
+            autoComplete: "off",
+            "aria-expanded": y,
+            "aria-controls": y ? E : void 0,
+            "aria-autocomplete": "list",
+            "aria-invalid": c || void 0,
+            "aria-describedby": P,
+            "aria-required": N || void 0,
+            className: "min-w-24 flex-1 bg-transparent text-sm text-slate-800 outline-none placeholder:text-slate-400 disabled:cursor-not-allowed dark:text-metal-50 dark:placeholder:text-metal-400",
+            onChange: X,
+            onKeyDown: W,
+            onFocus: Y,
+            onBlur: Z
+          }),
+          g ? /* @__PURE__ */ m("span", {
+            role: "status",
+            className: "flex items-center",
+            children: [/* @__PURE__ */ a(te, {
+              size: 16,
+              "aria-hidden": "true",
+              className: "animate-spin text-metal-400"
+            }), /* @__PURE__ */ a("span", {
+              className: "sr-only",
+              children: v
+            })]
+          }) : null,
+          y ? /* @__PURE__ */ a("div", {
+            id: E,
+            role: "listbox",
+            className: "absolute left-0 top-full z-10 mt-1 flex max-h-44 w-full flex-col overflow-y-auto rounded border border-gray-200 bg-white py-2 shadow-2xs animate-in fade-in-50 zoom-in-95 duration-200 dark:border-metal-700 dark:bg-metal-800",
+            children: g ? /* @__PURE__ */ a("span", {
+              className: "select-none px-6 py-1.5 text-sm text-slate-500 dark:text-metal-300",
+              children: v
+            }) : n.map((e, t) => /* @__PURE__ */ a("button", {
+              type: "button",
+              role: "option",
+              tabIndex: -1,
+              "aria-selected": t === d,
+              className: x("flex min-h-10 w-full cursor-pointer items-center px-6 py-1.5 text-left text-sm text-slate-800 transition-colors hover:bg-gray-50 dark:text-metal-50 dark:hover:bg-metal-700", t === d && "bg-gray-50 dark:bg-metal-700"),
+              onMouseDown: (ee) => {
+                ee.preventDefault();
+              },
+              onClick: () => {
+                p(e);
+              },
+              children: e
+            }, e))
+          }) : null
+        ]
+      }),
+      c ? /* @__PURE__ */ a(w, {
+        component: "span",
+        id: L,
+        className: x("text-xs tracking-normal text-red-700 dark:text-red-400", $),
+        children: h
+      }) : null,
+      z ? /* @__PURE__ */ a(w, {
+        component: "span",
+        id: B,
+        className: x("text-xs text-slate-600 dark:text-slate-200", O),
+        children: I
+      }) : null
+    ]
+  });
+});
+de.displayName = "KonstructTagsInput";
+export {
+  de as TagsInput
+};

package/dist/components/TextArea/TextArea.js

@@ -1,30 +1,75 @@
-import { t as m } from "../../utils-COaoD3PI.js";
-import { textAreaVariants as h } from "./TextArea.variants.js";
-import { forwardRef as u, useId as p } from "react";
-import { jsx as e, jsxs as v } from "react/jsx-runtime";
-var g = u(({ initialValue: s, label: r, labelWrapperClassName: o, name: i, placeholder: c, rows: d = 3, theme: n, className: f, ...a }, x) => {
-  const t = p(), l = i ? `${t}-name` : t;
-  return /* @__PURE__ */ v("div", {
-    className: "flex flex-col gap-2",
-    "data-theme": n,
-    children: [r ? /* @__PURE__ */ e("div", {
-      className: m(o),
-      children: /* @__PURE__ */ e("label", {
-        htmlFor: l,
-        className: "cursor-pointer",
-        children: r
-      })
-    }) : null, /* @__PURE__ */ e("textarea", {
-      id: l,
-      ref: x,
-      className: m(h({ className: f })),
-      rows: d,
-      placeholder: c,
-      value: s ?? a.value,
-      ...a
-    })]
+import { WarningIcon as E } from "../../assets/icons/components/Warning.js";
+import { n as F, t } from "../../utils-DnIJruo0.js";
+import { textAreaVariants as H } from "./TextArea.variants.js";
+import { Typography as n } from "../Typography/Typography.js";
+import { forwardRef as L, useId as W } from "react";
+import { jsx as r, jsxs as o } from "react/jsx-runtime";
+var M = L(({ className: f, defaultValue: h, error: s, helperText: l, helperTextClassName: u, id: v, initialValue: g, isExpandable: N = !1, isRequired: d = !1, label: i, labelClassName: b, labelWrapperClassName: y, name: I, placeholder: k, rows: w = 3, theme: j, value: c, variant: T, ...A }, V) => {
+  const $ = W(), a = v ?? $, m = `${a}-error`, x = `${a}-helper-text`, B = c !== void 0, e = typeof s == "string" && s.length > 0, p = !e && !!l, C = F(e && m, p && x);
+  return /* @__PURE__ */ o("div", {
+    className: "flex flex-col gap-2 w-full relative",
+    "data-theme": j,
+    children: [
+      i ? /* @__PURE__ */ r("div", {
+        className: t("flex items-center justify-between", y),
+        children: /* @__PURE__ */ o(n, {
+          component: "label",
+          variant: "labelLarge",
+          htmlFor: a,
+          className: t("cursor-pointer", "flex", "gap-1", "text-sm", "font-medium", b),
+          children: [
+            i,
+            " ",
+            d && /* @__PURE__ */ r(n, {
+              component: "span",
+              "aria-hidden": "true",
+              className: t("text-red-600", "dark:text-red-500", "text-xs", "mt-0.5"),
+              children: "*"
+            })
+          ]
+        })
+      }) : null,
+      /* @__PURE__ */ o("div", {
+        className: "relative",
+        children: [/* @__PURE__ */ r("textarea", {
+          ...A,
+          id: a,
+          ref: V,
+          name: I,
+          "data-error": e,
+          "aria-invalid": e || void 0,
+          "aria-describedby": C,
+          "aria-required": d || void 0,
+          className: t(H({
+            className: f,
+            isExpandable: N,
+            variant: e ? "error" : T ?? "default"
+          })),
+          rows: w,
+          placeholder: k,
+          value: c,
+          defaultValue: B ? void 0 : h ?? g
+        }), e ? /* @__PURE__ */ r("i", {
+          className: t("absolute", "right-3", "top-2.5", "text-red-700", "dark:text-red-500"),
+          children: /* @__PURE__ */ r(E, { className: "w-5 h-5" })
+        }) : null]
+      }),
+      e ? /* @__PURE__ */ r(n, {
+        component: "span",
+        id: m,
+        className: t("text-xs", "tracking-normal", "text-red-700", "dark:text-red-400"),
+        children: s
+      }) : null,
+      p ? /* @__PURE__ */ r(n, {
+        component: "span",
+        id: x,
+        variant: "body1",
+        className: t("text-xs", "text-slate-600", "dark:text-slate-200", "select-none", "tracking-normal", u),
+        children: l
+      }) : null
+    ]
   });
 });
 export {
-  g as TextArea
+  M as TextArea
 };

package/dist/components/TextArea/TextArea.variants.js

@@ -1,20 +1,57 @@
-import { t as r } from "../../dist-Bcn6lMQe.js";
-var i = r([
+import { t as e } from "../../dist-B9GE4SXf.js";
+var r = e([
+  "bg-white",
   "border",
-  "border-gray-200",
+  "border-gray-300",
+  "caret-text-slate-800",
   "disabled:cursor-not-allowed",
-  "disabled:opacity-50",
+  "disabled:text-slate-500",
+  "flex",
+  "focus-visible:border-transparent",
   "focus-visible:outline-none",
   "focus-visible:ring-1",
-  "focus-visible:ring-ring",
-  "p-2",
-  "placeholder:text-gray-300",
-  "resize-none",
-  "rounded-md",
-  "shadow-xs",
+  "px-2.5",
+  "py-2",
+  "rounded",
+  "text-slate-800",
+  "text-sm",
+  "max-md:text-base",
+  "transition-all",
   "w-full",
-  "focus:ring-kubefirst-primary"
-]);
+  "disabled:bg-gray-50",
+  "placeholder:text-slate-400",
+  "data-[error=false]:dark:focus:ring-aurora-500",
+  "data-[error=false]:focus:ring-aurora-500",
+  "dark:bg-metal-800",
+  "dark:border-metal-700",
+  "dark:caret-text-metal-50",
+  "dark:disabled:bg-metal-900",
+  "dark:disabled:placeholder:text-metal-400",
+  "dark:disabled:text-metal-400",
+  "dark:placeholder:text-metal-300",
+  "dark:text-slate-50"
+], {
+  variants: {
+    variant: {
+      default: "",
+      error: [
+        "pr-8",
+        "border-red-600",
+        "focus-visible:border-red-600",
+        "focus-visible:ring-transparent",
+        "dark:border-red-500"
+      ]
+    },
+    isExpandable: {
+      true: "resize-y",
+      false: "resize-none"
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    isExpandable: !1
+  }
+});
 export {
-  i as textAreaVariants
+  r as textAreaVariants
 };

package/dist/components/TimePicker/TimePicker.variants.js

@@ -1,4 +1,4 @@
-import { t } from "../../dist-Bcn6lMQe.js";
+import { t } from "../../dist-B9GE4SXf.js";
 var r = t([
   "border",
   "rounded",
@@ -12,6 +12,7 @@ var r = t([
   "dark:border-metal-700",
   "dark:bg-metal-800",
   "cursor-pointer",
+  "tap-target",
   "transition-all",
   "transition-duration-100",
   "data-[open=true]:border-aurora-500",
@@ -26,7 +27,7 @@ var r = t([
   "flex",
   "flex-col",
   "dark:text-metal-50"
-]), o = t([
+]), i = t([
   "w-15",
   "h-10",
   "snap-start",
@@ -37,6 +38,7 @@ var r = t([
   "border-2",
   "border-transparent",
   "hover:bg-gray-100",
+  "active:bg-gray-100",
   "focus-within:bg-gray-100",
   "data-[active=true]:bg-blue-600",
   "data-[active=true]:text-white",
@@ -50,8 +52,9 @@ var r = t([
   "dark:data-[active=true]:focus-within:bg-aurora-500",
   "dark:data-[active=true]:focus-within:border-aurora-50",
   "dark:hover:bg-metal-700",
+  "dark:active:bg-metal-700",
   "dark:focus-within:bg-metal-700"
-]), i = t([
+]), o = t([
   "flex",
   "items-center",
   "justify-center",
@@ -64,8 +67,8 @@ var r = t([
   "text-sm"
 ]);
 export {
-  i as buttonVariants,
-  o as liVariants,
+  o as buttonVariants,
+  i as liVariants,
   r as timePickerVariants,
   e as ulVariants
 };

package/dist/components/TimePicker/components/HoursList/HoursList.js

@@ -1,12 +1,12 @@
-import { t as s } from "../../../../utils-COaoD3PI.js";
-import { useTimePickerContext as v } from "../../contexts/time-picker.hook.js";
-import { buttonVariants as k, liVariants as d, ulVariants as H } from "../../TimePicker.variants.js";
-import { useCallback as A, useEffect as D, useRef as N } from "react";
+import { t as s } from "../../../../utils-DnIJruo0.js";
+import { buttonVariants as d, liVariants as k, ulVariants as H } from "../../TimePicker.variants.js";
+import { useTimePickerContext as S } from "../../contexts/time-picker.hook.js";
+import { useEffect as A, useRef as D } from "react";
 import { jsx as i } from "react/jsx-runtime";
-var $ = ({ hours: a, scrollBehavior: m }) => {
-  const c = N(null), S = N(a), { format: l, isTyping: p, onSelectHour: n } = v(), b = l === "12" && a >= 12 ? a - 12 : a, u = l === "12" ? 12 : 24, y = A((e, t) => {
-    e.currentTarget?.blur(), n(t);
-  }, [n]), w = A((e, t) => {
+var h = ({ hours: a, scrollBehavior: f }) => {
+  const c = D(null), N = D(a), { format: l, isTyping: m, onSelectHour: p } = S(), b = l === "12" && a >= 12 ? a - 12 : a, u = l === "12" ? 12 : 24, y = (e, t) => {
+    e.currentTarget?.blur(), p(t);
+  }, w = (e, t) => {
     const r = c.current?.querySelectorAll("button");
     if (!r) return;
     let o = t;
@@ -15,23 +15,21 @@ var $ = ({ hours: a, scrollBehavior: m }) => {
     else if (e.key === "ArrowUp" || e.key === "Tab" && e.shiftKey)
       e.preventDefault(), o = (t - 1 + u) % u;
     else if (e.key === "Enter") {
-      e.preventDefault(), n(l === "12" ? t + 1 : t), document.querySelector('[aria-label="minutes"]')?.querySelector('li[data-active="true"] button')?.focus();
+      e.preventDefault();
+      const n = l === "12" ? t + 1 : t;
+      p(n), document.querySelector('[aria-label="minutes"]')?.querySelector('li[data-active="true"] button')?.focus();
       return;
     }
     o !== t && r[o]?.focus();
-  }, [
-    l,
-    u,
-    n
-  ]);
-  if (D(() => {
-    const e = c.current, t = S.current, r = l === "12" && t >= 12 ? t - 12 : t, o = r === 0 && l === "12" ? 12 : r;
+  };
+  if (A(() => {
+    const e = c.current, t = N.current, r = l === "12" && t >= 12 ? t - 12 : t, o = r === 0 && l === "12" ? 12 : r;
     e && e.querySelector(`[data-value="${`0${o}`.slice(-2)}"]`)?.scrollIntoView({
-      behavior: m,
+      behavior: f,
       block: "center"
     });
-  }, [l, m]), D(() => {
-    if (!p) return;
+  }, [l, f]), A(() => {
+    if (!m) return;
     const e = c.current, t = l === "12" && a >= 12 ? a - 12 : a, r = t === 0 && l === "12" ? 12 : t;
     e && e.querySelector(`[data-value="${`0${r}`.slice(-2)}"]`)?.scrollIntoView({
       behavior: "instant",
@@ -40,7 +38,7 @@ var $ = ({ hours: a, scrollBehavior: m }) => {
   }, [
     a,
     l,
-    p
+    m
   ]), l === "12") {
     const e = b === 0 ? 12 : b;
     return /* @__PURE__ */ i("ul", {
@@ -51,7 +49,7 @@ var $ = ({ hours: a, scrollBehavior: m }) => {
       children: Array.from({ length: 12 }, (t, r) => {
         const o = e - 1 === r;
         return /* @__PURE__ */ i("li", {
-          className: s(d()),
+          className: s(k()),
           "data-value": `0${r + 1}`.slice(-2),
           "data-active": o,
           role: "presentation",
@@ -59,9 +57,9 @@ var $ = ({ hours: a, scrollBehavior: m }) => {
             type: "button",
             role: "option",
             tabIndex: o ? 0 : -1,
-            className: s(k()),
-            onClick: (f) => y(f, r + 1),
-            onKeyDown: (f) => w(f, r),
+            className: s(d()),
+            onClick: (n) => y(n, r + 1),
+            onKeyDown: (n) => w(n, r),
             children: r + 1
           })
         }, r);
@@ -76,7 +74,7 @@ var $ = ({ hours: a, scrollBehavior: m }) => {
     children: Array.from({ length: 24 }, (e, t) => {
       const r = a === t;
       return /* @__PURE__ */ i("li", {
-        className: s(d()),
+        className: s(k()),
         "data-value": `0${t}`.slice(-2),
         "data-active": r,
         role: "presentation",
@@ -84,7 +82,7 @@ var $ = ({ hours: a, scrollBehavior: m }) => {
           type: "button",
           role: "option",
           tabIndex: r ? 0 : -1,
-          className: s(k()),
+          className: s(d()),
           onClick: (o) => y(o, t),
           onKeyDown: (o) => w(o, t),
           children: t
@@ -93,7 +91,7 @@ var $ = ({ hours: a, scrollBehavior: m }) => {
     })
   });
 };
-$.displayName = "HoursList";
+h.displayName = "HoursList";
 export {
-  $ as HoursList
+  h as HoursList
 };

package/dist/components/TimePicker/components/MeridianList/MeridianList.js

@@ -1,56 +1,52 @@
-import { t } from "../../../../utils-COaoD3PI.js";
-import { useTimePickerContext as N } from "../../contexts/time-picker.hook.js";
-import { buttonVariants as p, liVariants as b } from "../../TimePicker.variants.js";
-import { useCallback as y, useRef as D } from "react";
-import { jsx as o, jsxs as M } from "react/jsx-runtime";
-var T = ({ listClassName: k, listItemClassName: n, listItemButtonClassName: c, onClose: f }) => {
-  const u = D(null), { format: x, isAM: r, onSelectAM: l, onSelectPM: s } = N(), m = y((e, a) => {
+import { t } from "../../../../utils-DnIJruo0.js";
+import { buttonVariants as d, liVariants as p } from "../../TimePicker.variants.js";
+import { useTimePickerContext as w } from "../../contexts/time-picker.hook.js";
+import { useRef as N } from "react";
+import { jsx as o, jsxs as D } from "react/jsx-runtime";
+var M = ({ listClassName: b, listItemClassName: n, listItemButtonClassName: s, onClose: y }) => {
+  const i = N(null), { format: k, isAM: r, onSelectAM: c, onSelectPM: f } = w(), u = (e, a) => {
     e.currentTarget?.blur(), a();
-  }, []), d = y((e, a) => {
-    const i = u.current?.querySelectorAll("button");
-    if (!i) return;
-    const h = e.key === "Tab" && !e.shiftKey, w = e.key === "Tab" && e.shiftKey;
-    e.key === "ArrowDown" || e.key === "ArrowUp" || h || w ? (e.preventDefault(), a ? i[1]?.focus() : i[0]?.focus()) : e.key === "Enter" && (e.preventDefault(), a ? l() : s(), f?.());
-  }, [
-    l,
-    s,
-    f
-  ]);
-  return x === "24" ? null : /* @__PURE__ */ M("ul", {
-    ref: u,
-    className: t("flex items-center justify-center flex-col", k),
+  }, m = (e, a) => {
+    const l = i.current?.querySelectorAll("button");
+    if (!l) return;
+    const x = e.key === "Tab" && !e.shiftKey, h = e.key === "Tab" && e.shiftKey;
+    e.key === "ArrowDown" || e.key === "ArrowUp" || x || h ? (e.preventDefault(), a ? l[1]?.focus() : l[0]?.focus()) : e.key === "Enter" && (e.preventDefault(), a ? c() : f(), y?.());
+  };
+  return k === "24" ? null : /* @__PURE__ */ D("ul", {
+    ref: i,
+    className: t("flex items-center justify-center flex-col", b),
     "aria-label": "meridian",
     role: "listbox",
     children: [/* @__PURE__ */ o("li", {
-      className: t(b({ className: n })),
+      className: t(p({ className: n })),
       "data-active": r,
       role: "presentation",
       children: /* @__PURE__ */ o("button", {
         type: "button",
         role: "option",
         tabIndex: r ? 0 : -1,
-        className: t(p({ className: c }), { "dark:text-slate-50": !r }),
-        onClick: (e) => m(e, l),
-        onKeyDown: (e) => d(e, !0),
+        className: t(d({ className: s }), { "dark:text-slate-50": !r }),
+        onClick: (e) => u(e, c),
+        onKeyDown: (e) => m(e, !0),
         children: "AM"
       })
     }), /* @__PURE__ */ o("li", {
-      className: t(b({ className: n })),
+      className: t(p({ className: n })),
       "data-active": !r,
       role: "presentation",
       children: /* @__PURE__ */ o("button", {
         type: "button",
         role: "option",
         tabIndex: r ? -1 : 0,
-        className: t(p({ className: c }), { "dark:text-slate-50": r }),
-        onClick: (e) => m(e, s),
-        onKeyDown: (e) => d(e, !1),
+        className: t(d({ className: s }), { "dark:text-slate-50": r }),
+        onClick: (e) => u(e, f),
+        onKeyDown: (e) => m(e, !1),
         children: "PM"
       })
     })]
   });
 };
-T.displayName = "MeridianList";
+M.displayName = "MeridianList";
 export {
-  T as MeridianList
+  M as MeridianList
 };