@stachelock/ui 0.6.8 → 0.6.11

package/dist/SelectTextInput.vue_vue_type_script_setup_true_lang-DYlrRigi.js

@@ -0,0 +1,305 @@
+import { defineComponent as Z, ref as w, onMounted as F, onBeforeUnmount as _, reactive as ee, toRefs as te, computed as u, watch as le, createElementBlock as L, openBlock as g, createVNode as v, unref as c, createSlots as se, withCtx as f, createElementVNode as d, normalizeClass as m, createBlock as O, toDisplayString as V, Teleport as ae, Transition as ne, normalizeStyle as ie, Fragment as oe, renderList as re, createCommentVNode as de, resolveDynamicComponent as ue } from "vue";
+import { ChevronUpDownIcon as ce, CheckIcon as fe } from "@heroicons/vue/20/solid";
+import { Listbox as ve, ListboxButton as xe, ListboxOptions as ge, ListboxOption as me } from "@headlessui/vue";
+import pe from "./forms/FormFieldWrapper.js";
+import { g as ye } from "./id-DafBB_QF.js";
+const he = {
+  class: "sl-w-full",
+  "data-testid": "select-text-input"
+}, be = { class: "sl-relative" }, ke = { class: "sl-pointer-events-none sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-2" }, we = {
+  key: 0,
+  class: "sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-4"
+}, Se = { class: "sl-flex-1 sl-relative" }, Be = ["aria-invalid", "name", "placeholder", "inputmode", "maxlength", "value", "disabled"], Ce = { class: "sl-text-xs sl-text-gray-500 dark:sl-text-slate-400" }, Ie = /* @__PURE__ */ Z({
+  __name: "SelectTextInput",
+  props: {
+    name: { type: String, required: !0 },
+    label: { type: String, default: "" },
+    tertiaryLabel: { type: String, default: "" },
+    secondaryLabel: { type: String, default: "" },
+    labelIconLeft: { type: [Object, Function], default: void 0 },
+    value: {
+      type: [Object, String, Number],
+      default: void 0
+    },
+    select: {
+      type: Object,
+      default: () => ({ options: [] })
+    },
+    text: {
+      type: Object,
+      default: () => ({})
+    },
+    delimiter: { type: String, default: " " },
+    formatter: { type: Function },
+    showErrors: { type: Boolean, default: !1 },
+    hasError: { type: Boolean, default: !1 },
+    validateOnMount: { type: Boolean, default: !1 },
+    textValidationRegex: { type: [RegExp, Object], default: void 0 },
+    requiredText: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 },
+    disabledMessage: { type: String, default: "" },
+    colorfulValidation: { type: Boolean, default: !0 },
+    showValidCheck: { type: Boolean, default: !1 },
+    // Disabled by default since chevron icon would overlap
+    optional: { type: Boolean, default: !1 }
+  },
+  emits: ["update:value", "update:validity"],
+  setup(s, { emit: q }) {
+    const U = ye("select-text-input"), p = w(!1), R = w(null), I = w({
+      top: "0px",
+      left: "0px",
+      width: "120px"
+    }), y = w(!1);
+    function M() {
+      const e = R.value?.$el;
+      if (!e) return;
+      const t = e.getBoundingClientRect();
+      I.value = {
+        top: `${t.bottom + 4}px`,
+        left: `${t.left}px`,
+        width: `${Math.max(t.width, 120)}px`
+      };
+    }
+    function W() {
+      y.value = !y.value, y.value && M();
+    }
+    function b() {
+      y.value && M();
+    }
+    function T() {
+      p.value = !0;
+    }
+    F(() => {
+      window.addEventListener("scroll", b, !0), window.addEventListener("resize", b);
+    }), _(() => {
+      window.removeEventListener("scroll", b, !0), window.removeEventListener("resize", b);
+    });
+    const Y = /\b(19|20)\d{2}\b$/;
+    function i(e) {
+      if (typeof e == "string") {
+        const t = e.trim();
+        return t.length ? t : void 0;
+      }
+      if (typeof e == "number") {
+        const t = String(e);
+        return t.length ? t : void 0;
+      }
+    }
+    function j(e) {
+      return !!e && typeof e == "object" && !Array.isArray(e) && ("select" in e || "text" in e || "display" in e);
+    }
+    function G(e) {
+      return !!(e.select || e.text || e.display);
+    }
+    function S(e, t, l) {
+      return l || (e && t ? `${e} ${t}`.trim() : e || t || void 0);
+    }
+    function z(e) {
+      const t = {};
+      if (e == null) return t;
+      if (typeof e == "string" || typeof e == "number") {
+        const l = i(e);
+        if (!l) return t;
+        const r = l.match(Y);
+        if (r) {
+          const o = r[0], x = l.slice(0, l.length - o.length).trim();
+          x && (t.select = x), t.text = o, t.display = S(t.select, t.text);
+        } else
+          t.text = l, t.display = l;
+        return t;
+      }
+      if (j(e)) {
+        const l = e, r = i(l.select), o = i(l.text), x = i(l.display);
+        return r && (t.select = r), o && (t.text = o), t.display = S(t.select, t.text, x), t;
+      }
+      if (typeof e == "object" && !Array.isArray(e)) {
+        const l = e, r = i(l.select) ?? i(l.term) ?? i(l.semester), o = i(l.text) ?? i(l.year) ?? i(l.value), x = i(l.display) ?? i(l.label);
+        return r && (t.select = r), o && (t.text = o), t.display = S(t.select, t.text, x), t;
+      }
+      return t;
+    }
+    const n = s, $ = q, A = z(n.value), D = ee({
+      localValue: A
+    }), { localValue: a } = te(D), H = u(
+      () => G(A) && !j(n.value)
+    ), N = u(() => n.select?.options || []), B = u(() => a.value.select && N.value.find((e) => e.value === a.value.select) || null), P = u(() => {
+      const e = a.value.text;
+      return n.textValidationRegex ? !e || String(e).trim() === "" ? n.requiredText === !0 : !n.textValidationRegex.test(String(e)) : !1;
+    }), C = u(() => !!(a.value.select && a.value.text && String(a.value.text).length > 0) && !P.value), h = u(() => n.showErrors && (n.hasError || P.value)), J = u(() => n.disabled ? "sl-ring-gray-200 dark:sl-ring-slate-700" : n.colorfulValidation ? h.value ? "sl-ring-red-500 dark:sl-ring-red-500 focus-within:sl-ring-stachelock-600" : n.showValidCheck && C.value && p.value ? "sl-ring-green-500 dark:sl-ring-green-500 focus-within:sl-ring-stachelock-600" : "sl-ring-gray-300 dark:sl-ring-slate-600 focus-within:sl-ring-stachelock-600" : "sl-ring-gray-300 dark:sl-ring-slate-600 focus-within:sl-ring-stachelock-600"), E = u(() => {
+      const e = { select: a.value.select, text: a.value.text }, t = n.formatter ? n.formatter(e) : void 0;
+      return t !== void 0 ? t : [e.select, e.text].filter(Boolean).join(n.delimiter).trim();
+    }), K = u(() => {
+      if (!h.value) return "";
+      const e = !!a.value.select, t = !!a.value.text && String(a.value.text).trim() !== "", l = !!a.value.text && /^\d{4}$/.test(String(a.value.text));
+      return !e && !t ? "Please select an option and enter a value." : e ? t ? !l && n.textValidationRegex ? "Please enter a valid value." : "Please complete both fields." : "Please enter a value." : "Please select an option.";
+    });
+    function k() {
+      const e = E.value || void 0, t = {
+        select: a.value.select,
+        text: a.value.text,
+        display: e
+      };
+      $("update:value", t), $("update:validity", C.value);
+    }
+    function Q(e) {
+      a.value.select = e?.value || void 0, y.value = !1, p.value = !0, k();
+    }
+    function X(e) {
+      a.value.text = e || void 0, k();
+    }
+    return le(
+      () => n.value,
+      (e) => {
+        D.localValue = z(e);
+      },
+      { deep: !0 }
+    ), F(() => {
+      H.value && k();
+    }), n.validateOnMount && (p.value = !0, k()), (e, t) => (g(), L("div", he, [
+      v(pe, {
+        id: c(U),
+        name: s.name,
+        label: s.label,
+        "tertiary-label": s.tertiaryLabel,
+        "error-message": h.value ? K.value : "",
+        "is-valid": C.value,
+        "is-touched": p.value,
+        "show-errors": s.showErrors,
+        "show-valid-check": s.showValidCheck,
+        "colorful-validation": s.colorfulValidation,
+        disabled: s.disabled,
+        "disabled-message": s.disabledMessage,
+        optional: s.optional
+      }, se({
+        default: f(() => [
+          d("div", {
+            class: m(["sl-flex sl-rounded-md sl-shadow-sm sl-ring-1 sl-ring-inset focus-within:sl-ring-2 focus-within:sl-ring-inset", [
+              J.value,
+              s.disabled ? "sl-bg-gray-50 dark:sl-bg-slate-800" : "sl-bg-white dark:sl-bg-slate-800"
+            ]])
+          }, [
+            v(c(ve), {
+              "model-value": B.value,
+              "onUpdate:modelValue": Q,
+              disabled: s.disabled
+            }, {
+              default: f(() => [
+                d("div", be, [
+                  v(c(xe), {
+                    ref_key: "listboxButtonRef",
+                    ref: R,
+                    class: m([
+                      "sl-relative sl-cursor-default sl-rounded-l-md sl-border-0 sl-py-1.5 sl-pl-2 sl-pr-10 sl-text-left sl-text-sm sl-leading-6 sl-bg-transparent",
+                      "focus:sl-outline-none focus:sl-ring-0",
+                      s.disabled ? "sl-cursor-not-allowed sl-text-gray-500 dark:sl-text-slate-400" : "sl-text-gray-900 dark:sl-text-slate-100"
+                    ]),
+                    "data-testid": "select-dropdown",
+                    onClick: W,
+                    onBlur: T
+                  }, {
+                    default: f(() => [
+                      d("span", {
+                        class: m(["sl-block sl-truncate sl-min-w-[80px] sl-max-w-[200px]", B.value ? "" : "sl-text-gray-400 dark:sl-text-slate-500"])
+                      }, V(B.value?.label || s.select?.placeholder || "Select…"), 3),
+                      d("span", ke, [
+                        v(c(ce), {
+                          class: "sl-h-5 sl-w-5 sl-text-gray-400 dark:sl-text-slate-300",
+                          "aria-hidden": "true"
+                        })
+                      ])
+                    ]),
+                    _: 1
+                  }, 8, ["class"]),
+                  (g(), O(ae, { to: "body" }, [
+                    v(ne, {
+                      "leave-active-class": "sl-transition sl-duration-100 sl-ease-in",
+                      "leave-from-class": "sl-opacity-100",
+                      "leave-to-class": "sl-opacity-0"
+                    }, {
+                      default: f(() => [
+                        v(c(ge), {
+                          class: "sl-fixed sl-z-[9999] sl-max-h-56 sl-overflow-auto sl-rounded-md sl-bg-white dark:sl-bg-slate-800 sl-py-1 sl-text-base sl-shadow-lg dark:sl-shadow-slate-900/50 sl-ring-1 sl-ring-black sl-ring-opacity-5 dark:sl-ring-slate-700 focus:sl-outline-none sm:sl-text-sm",
+                          style: ie(I.value)
+                        }, {
+                          default: f(() => [
+                            (g(!0), L(oe, null, re(N.value, (l) => (g(), O(c(me), {
+                              key: l.value,
+                              value: l,
+                              as: "template"
+                            }, {
+                              default: f(({ active: r, selected: o }) => [
+                                d("li", {
+                                  class: m([
+                                    "sl-relative sl-cursor-default sl-select-none sl-py-2 sl-pl-3 sl-pr-9",
+                                    r ? "sl-bg-stachelock-600 sl-text-white" : "sl-text-gray-900 dark:sl-text-slate-200"
+                                  ])
+                                }, [
+                                  d("span", {
+                                    class: m(["sl-block sl-truncate", o ? "sl-font-medium" : "sl-font-normal"])
+                                  }, V(l.label), 3),
+                                  o ? (g(), L("span", we, [
+                                    v(c(fe), {
+                                      class: "sl-h-5 sl-w-5",
+                                      "aria-hidden": "true"
+                                    })
+                                  ])) : de("", !0)
+                                ], 2)
+                              ]),
+                              _: 2
+                            }, 1032, ["value"]))), 128))
+                          ]),
+                          _: 1
+                        }, 8, ["style"])
+                      ]),
+                      _: 1
+                    })
+                  ]))
+                ])
+              ]),
+              _: 1
+            }, 8, ["model-value", "disabled"]),
+            t[1] || (t[1] = d("div", { class: "sl-w-px sl-bg-gray-200 dark:sl-bg-slate-700 sl-self-stretch" }, null, -1)),
+            d("div", Se, [
+              d("input", {
+                class: m([
+                  "sl-block sl-w-full sl-text-sm sl-leading-6 focus:sl-outline-none focus:sl-ring-0 sl-border-0 sl-py-1.5 sl-pl-2 sl-pr-10 sl-rounded-r-md sl-bg-transparent",
+                  "placeholder:sl-text-gray-400 dark:placeholder:sl-text-slate-500",
+                  s.disabled ? "sl-text-gray-500 dark:sl-text-slate-400 sl-cursor-not-allowed" : "sl-text-gray-900 dark:sl-text-slate-100"
+                ]),
+                "aria-invalid": h.value || void 0,
+                name: `${s.name}__text`,
+                placeholder: s.text?.placeholder || "",
+                inputmode: s.text?.inputMode ?? "text",
+                maxlength: s.text?.maxLength || void 0,
+                value: c(a).text || "",
+                onInput: t[0] || (t[0] = (l) => X(l.target.value)),
+                onBlur: T,
+                disabled: s.disabled,
+                "data-testid": "text-input"
+              }, null, 42, Be)
+            ])
+          ], 2)
+        ]),
+        _: 2
+      }, [
+        s.labelIconLeft ? {
+          name: "prefix",
+          fn: f(() => [
+            (g(), O(ue(s.labelIconLeft), { class: "sl-h-4 sl-w-4 sl-text-yellow-300" }))
+          ]),
+          key: "0"
+        } : void 0,
+        !h.value && E.value ? {
+          name: "success-message",
+          fn: f(() => [
+            d("span", Ce, V(E.value), 1)
+          ]),
+          key: "1"
+        } : void 0
+      ]), 1032, ["id", "name", "label", "tertiary-label", "error-message", "is-valid", "is-touched", "show-errors", "show-valid-check", "colorful-validation", "disabled", "disabled-message", "optional"])
+    ]));
+  }
+});
+export {
+  Ie as _
+};

package/dist/{TabGroup.vue_vue_type_script_setup_true_lang-BzqtAqbr.js → TabGroup.vue_vue_type_script_setup_true_lang-DTWW7kYh.js}

@@ -1,7 +1,7 @@
 import { defineComponent as P, computed as v, createElementBlock as a, openBlock as o, createCommentVNode as d, createVNode as u, unref as s, withCtx as c, createElementVNode as m, Fragment as j, renderList as z, createBlock as p, normalizeClass as _, createTextVNode as A, toDisplayString as k, renderSlot as y, KeepAlive as F, resolveDynamicComponent as K, mergeProps as U, toHandlers as q } from "vue";
 import { TabGroup as J, TabList as Q, Tab as R } from "@headlessui/vue";
 import { useTabs as W } from "./composables/useTabs.js";
-import { _ as X } from "./SelectInput.vue_vue_type_script_setup_true_lang-DFfKsmvj.js";
+import { _ as X } from "./SelectInput.vue_vue_type_script_setup_true_lang-DEaP3bhC.js";
 const Y = { class: "sl-w-full" }, Z = {
   key: 0,
   class: "sl-block sm:sl-hidden sl-mb-4"

package/dist/{TabGroupUnderline.vue_vue_type_script_setup_true_lang-C6OYRDCq.js → TabGroupUnderline.vue_vue_type_script_setup_true_lang-B8e7kxad.js}

@@ -1,7 +1,7 @@
 import { defineComponent as P, computed as x, createElementBlock as n, openBlock as t, createCommentVNode as r, createVNode as v, toDisplayString as m, unref as l, withCtx as F, createElementVNode as c, Fragment as L, renderList as U, normalizeClass as f, createTextVNode as z, renderSlot as g, createBlock as y, KeepAlive as A, resolveDynamicComponent as K, mergeProps as j, toHandlers as q } from "vue";
 import { TabGroup as J } from "@headlessui/vue";
 import { useTabs as Q } from "./composables/useTabs.js";
-import { _ as R } from "./SelectInput.vue_vue_type_script_setup_true_lang-DFfKsmvj.js";
+import { _ as R } from "./SelectInput.vue_vue_type_script_setup_true_lang-DEaP3bhC.js";
 const W = { class: "sl-w-full" }, X = {
   key: 0,
   class: "sl-text-lg sl-font-semibold sl-text-gray-900 dark:sl-text-white sl-mb-4"

package/dist/{TabsInPills.vue_vue_type_script_setup_true_lang-C7T3PUnB.js → TabsInPills.vue_vue_type_script_setup_true_lang-Dzi4ENL1.js}

@@ -1,5 +1,5 @@
 import { defineComponent as I, createElementBlock as l, openBlock as t, createElementVNode as o, renderSlot as m, createVNode as V, unref as s, Fragment as r, renderList as i, normalizeClass as u, withModifiers as w, createTextVNode as N, createCommentVNode as h, toDisplayString as p } from "vue";
-import { _ as S } from "./SelectInput.vue_vue_type_script_setup_true_lang-DFfKsmvj.js";
+import { _ as S } from "./SelectInput.vue_vue_type_script_setup_true_lang-DEaP3bhC.js";
 import { u as $ } from "./useSimpleTabs-CSgkChEU.js";
 const B = { class: "sl-w-full" }, E = { class: "sm:sl-hidden" }, U = { class: "sl-hidden sm:sl-block sl-overflow-x-auto" }, z = {
   class: "sl-flex sl-flex-nowrap sl-space-x-4",

package/dist/{TagifyInput.vue_vue_type_script_setup_true_lang-BF2mK8JC.js → TagifyInput.vue_vue_type_script_setup_true_lang-CwxJ2x1x.js}

@@ -1,14 +1,14 @@
-import { defineComponent as V, ref as p, watch as z, onMounted as A, createBlock as w, openBlock as u, withCtx as g, createElementVNode as d, normalizeClass as F, createElementBlock as c, Fragment as T, renderList as S, withDirectives as k, toDisplayString as h, normalizeStyle as Q, withKeys as C, withModifiers as y, vModelText as B, createVNode as U, unref as R, createCommentVNode as K, renderSlot as L, nextTick as W } from "vue";
+import { defineComponent as z, ref as v, watch as A, onMounted as F, createBlock as w, openBlock as u, withCtx as g, createElementVNode as d, normalizeClass as k, createElementBlock as c, Fragment as T, renderList as S, withDirectives as C, toDisplayString as h, normalizeStyle as Q, withKeys as B, withModifiers as y, vModelText as K, createVNode as U, unref as R, createCommentVNode as L, renderSlot as N, nextTick as W } from "vue";
 import { XMarkIcon as X } from "@heroicons/vue/20/solid";
-import { _ } from "./UiBadge.vue_vue_type_script_setup_true_lang-DOtbLb9x.js";
-import j from "./forms/FormFieldWrapper.js";
-const G = { key: 0 }, H = ["onUpdate:modelValue", "placeholder", "disabled", "onKeydown", "onBlur"], P = ["onClick", "disabled"], Y = { class: "sl-flex-1 sl-min-w-0 sl-relative" }, Z = ["placeholder", "disabled", "onKeydown"], ee = { class: "sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-3 sl-pointer-events-auto" }, te = {
+import { _ as j } from "./UiBadge.vue_vue_type_script_setup_true_lang-DOtbLb9x.js";
+import G from "./forms/FormFieldWrapper.js";
+const H = { key: 0 }, P = ["onUpdate:modelValue", "placeholder", "disabled", "onKeydown", "onBlur"], Y = ["onClick", "disabled"], Z = ["placeholder", "disabled", "onKeydown"], _ = { class: "sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-3 sl-pointer-events-auto" }, ee = {
   key: 0,
   class: "sl-absolute sl-z-50 sl-mt-1 sl-max-h-60 sl-w-full sl-overflow-auto sl-rounded-md sl-bg-white sl-py-1 sl-text-base sl-shadow-lg sl-ring-1 sl-ring-black sl-ring-opacity-5 focus:sl-outline-none sm:sl-text-sm"
-}, le = ["onClick"], se = { class: "sl-flex" }, ae = { class: "sl-truncate sl-font-semibold" }, ne = { class: "sl-block sl-truncate" }, oe = {
+}, te = ["onClick"], le = { class: "sl-flex" }, se = { class: "sl-truncate sl-font-semibold" }, ae = { class: "sl-block sl-truncate" }, ne = {
   key: 0,
   class: "sl-ml-2 sl-truncate sl-text-gray-500"
-}, ce = /* @__PURE__ */ V({
+}, de = /* @__PURE__ */ z({
   __name: "TagifyInput",
   props: {
     items: {
@@ -81,29 +81,29 @@ const G = { key: 0 }, H = ["onUpdate:modelValue", "placeholder", "disabled", "on
     }
   },
   emits: ["update:value", "update:query", "invalid-tag"],
-  setup(s, { expose: N, emit: D }) {
-    const t = s, m = D, i = p(""), f = p([]), n = p(JSON.parse(JSON.stringify(t.value))), v = p(!1);
-    z(
+  setup(s, { expose: D, emit: I }) {
+    const t = s, m = I, o = v(""), p = v([]), n = v(JSON.parse(JSON.stringify(t.value))), f = v(!1);
+    A(
       () => t.value,
       (e) => {
         JSON.stringify(e) !== JSON.stringify(n.value) && (n.value = JSON.parse(JSON.stringify(e)));
       },
       { deep: !0 }
     );
-    const I = (e) => e[t.itemSubtext] || e[t.itemText], $ = (e) => e[t.itemSubtext] ? e[t.itemText] : void 0, q = (e) => e[t.tagDisplayKey] || e[t.itemText], E = () => {
-      if (i.value && i.value.length > 0) {
-        m("update:query", i.value);
-        const e = i.value.toLowerCase();
-        f.value = t.items.filter((a) => a[t.itemText]?.toLowerCase().includes(e) || a[t.itemSubtext]?.toLowerCase().includes(e)), v.value = !0;
+    const $ = (e) => e[t.itemSubtext] || e[t.itemText], q = (e) => e[t.itemSubtext] ? e[t.itemText] : void 0, E = (e) => e[t.tagDisplayKey] || e[t.itemText], J = () => {
+      if (o.value && o.value.length > 0) {
+        m("update:query", o.value);
+        const e = o.value.toLowerCase();
+        p.value = t.items.filter((a) => a[t.itemText]?.toLowerCase().includes(e) || a[t.itemSubtext]?.toLowerCase().includes(e)), f.value = !0;
       } else
-        f.value = [], v.value = !1;
-    }, J = () => {
-      const e = i.value.trim();
+        p.value = [], f.value = !1;
+    }, M = () => {
+      const e = o.value.trim();
       if (e === "")
         return;
       let a = null;
       const l = e.toLowerCase(), r = t.items.find(
-        (o) => o[t.itemText]?.toLowerCase() === l || o[t.itemSubtext]?.toLowerCase() === l
+        (i) => i[t.itemText]?.toLowerCase() === l || i[t.itemSubtext]?.toLowerCase() === l
       );
       if (r)
         a = { ...r };
@@ -112,16 +112,16 @@ const G = { key: 0 }, H = ["onUpdate:modelValue", "placeholder", "disabled", "on
       else
         return;
       n.value.some(
-        (o) => o[t.itemText] === a[t.itemText]
-      ) || (n.value.push(a), m("update:value", n.value)), i.value = "", f.value = [], v.value = !1;
-    }, M = (e) => {
+        (i) => i[t.itemText] === a[t.itemText]
+      ) || (n.value.push(a), m("update:value", n.value)), o.value = "", p.value = [], f.value = !1;
+    }, O = (e) => {
       const a = e[t.itemText].trim();
       n.value.some(
         (l) => l[t.itemText] === a
-      ) || (n.value.push({ ...e }), m("update:value", n.value)), i.value = "", f.value = [], v.value = !1;
+      ) || (n.value.push({ ...e }), m("update:value", n.value)), o.value = "", p.value = [], f.value = !1;
     }, b = (e) => {
       n.value.splice(e, 1), m("update:value", n.value);
-    }, O = (e) => {
+    }, V = (e) => {
       n.value[e].isEditing = !0, W(() => {
       });
     }, x = (e) => {
@@ -136,11 +136,11 @@ const G = { key: 0 }, H = ["onUpdate:modelValue", "placeholder", "disabled", "on
         a[t.itemText] = l, m("update:value", n.value);
       }
     };
-    return A(() => {
-      f.value = [];
-    }), N({
+    return F(() => {
+      p.value = [];
+    }), D({
       selectedTags: n
-    }), (e, a) => (u(), w(j, {
+    }), (e, a) => (u(), w(G, {
       id: s.name,
       name: s.name,
       label: s.label,
@@ -150,74 +150,77 @@ const G = { key: 0 }, H = ["onUpdate:modelValue", "placeholder", "disabled", "on
       optional: s.optional
     }, {
       "tertiary-label-overlay": g(() => [
-        L(e.$slots, "tertiary-overlay")
+        N(e.$slots, "tertiary-overlay")
       ]),
       default: g(() => [
         d("div", {
-          class: F(["sl-flex sl-flex-wrap sl-items-center sl-gap-4 sl-rounded-md sl-bg-white sl-px-3 sm:sl-text-sm sm:sl-leading-6", s.inline ? null : "sl-shadow-sm sl-border sl-border-gray-300 focus-within:sl-ring-2 focus-within:sl-ring-stachelock-600"])
+          class: k(["sl-flex sl-flex-wrap sl-items-center sl-gap-2 sl-rounded-md sl-bg-white sl-py-1.5 sl-ring-1 sl-ring-inset sl-ring-gray-300 dark:sl-ring-slate-600 dark:sl-bg-slate-800 sm:sl-text-sm sm:sl-leading-6", s.inline ? null : "sl-shadow-sm focus-within:sl-ring-2 focus-within:sl-ring-stachelock-600"])
         }, [
-          (u(!0), c(T, null, S(n.value, (l, r) => (u(), w(_, {
+          (u(!0), c(T, null, S(n.value, (l, r) => (u(), w(j, {
             key: r,
-            onClick: (o) => O(r),
+            onClick: (i) => V(r),
             theme: "primary",
-            size: "sm"
+            size: "sm",
+            class: "sl-ml-2"
           }, {
             default: g(() => [
-              l.isEditing ? k((u(), c("input", {
+              l.isEditing ? C((u(), c("input", {
                 key: 1,
                 ref_for: !0,
                 ref: "editInput",
-                "onUpdate:modelValue": (o) => l[t.itemText] = o,
+                "onUpdate:modelValue": (i) => l[t.itemText] = i,
                 placeholder: s.placeholder,
                 disabled: s.disabled,
-                onKeydown: C(y((o) => x(r), ["prevent"]), ["enter"]),
-                onBlur: (o) => x(r),
-                class: "sl-bg-transparent sl-border-none sl-outline-none sl-text-stachelock-600 sl-text-sm placeholder:sl-text-stachelock-400/80 focus:sl-ring-0 focus:sl-ring-stachelock-600 focus:sl-rounded-lg -sl-mx-3 -sl-my-2",
+                onKeydown: B(y((i) => x(r), ["prevent"]), ["enter"]),
+                onBlur: (i) => x(r),
+                class: "sl-bg-transparent sl-border-none sl-outline-none sl-text-stachelock-600 sl-text-sm placeholder:sl-text-gray-400 dark:placeholder:sl-text-slate-500 focus:sl-ring-0 focus:sl-ring-stachelock-600 focus:sl-rounded-lg",
                 style: Q({ width: l[t.itemText].length + 4 + "ch" })
-              }, null, 44, H)), [
-                [B, l[t.itemText]]
-              ]) : (u(), c("span", G, h(q(l)), 1)),
+              }, null, 44, P)), [
+                [K, l[t.itemText]]
+              ]) : (u(), c("span", H, h(E(l)), 1)),
               d("button", {
                 type: "button",
                 class: "sl-ml-2 sl-text-stachelock-600 hover:sl-text-stachelock-400 focus:sl-outline-none",
-                onClick: y((o) => b(r), ["stop"]),
+                onClick: y((i) => b(r), ["stop"]),
                 disabled: s.disabled
               }, [
                 U(R(X), { class: "sl-h-4 sl-w-4" })
-              ], 8, P)
+              ], 8, Y)
             ]),
             _: 2
           }, 1032, ["onClick"]))), 128)),
-          d("div", Y, [
-            k(d("input", {
+          d("div", {
+            class: k(["sl-flex-1 sl-min-w-0 sl-relative", n.value.length === 0 ? "sl-pl-2" : ""])
+          }, [
+            C(d("input", {
               ref: "input",
-              "onUpdate:modelValue": a[0] || (a[0] = (l) => i.value = l),
+              "onUpdate:modelValue": a[0] || (a[0] = (l) => o.value = l),
               placeholder: s.placeholder,
-              onInput: E,
+              onInput: J,
               disabled: s.disabled,
-              onKeydown: C(y(J, ["prevent"]), ["enter"]),
-              class: "sl-w-full sl-border-none sl-outline-none sl-rounded-md focus:sl-ring-0 sl-text-sm sl-font-light -sl-mx-3 sl-pr-12"
+              onKeydown: B(y(M, ["prevent"]), ["enter"]),
+              class: "sl-w-full sl-border-none sl-outline-none sl-rounded-md sl-bg-transparent focus:sl-ring-0 sl-text-sm sl-text-gray-900 dark:sl-text-slate-100 placeholder:sl-text-gray-400 dark:placeholder:sl-text-slate-500 sl-pr-12"
             }, null, 40, Z), [
-              [B, i.value]
+              [K, o.value]
             ]),
-            d("div", ee, [
-              L(e.$slots, "input-overlay")
+            d("div", _, [
+              N(e.$slots, "input-overlay")
             ]),
-            v.value && !s.disabled ? (u(), c("div", te, [
-              (u(!0), c(T, null, S(f.value, (l) => (u(), c("div", {
+            f.value && !s.disabled ? (u(), c("div", ee, [
+              (u(!0), c(T, null, S(p.value, (l) => (u(), c("div", {
                 key: l[s.itemKey],
                 class: "sl-cursor-pointer sl-select-none sl-py-2 sl-pl-3 sl-pr-9 hover:sl-bg-stachelock-600 hover:sl-text-white",
-                onClick: y((r) => M(l), ["prevent"])
+                onClick: y((r) => O(l), ["prevent"])
               }, [
-                d("div", se, [
-                  d("span", ae, [
-                    d("span", ne, h(I(l)), 1)
+                d("div", le, [
+                  d("span", se, [
+                    d("span", ae, h($(l)), 1)
                   ]),
-                  s.showSubext ? (u(), c("span", oe, h($(l)), 1)) : K("", !0)
+                  s.showSubext ? (u(), c("span", ne, h(q(l)), 1)) : L("", !0)
                 ])
-              ], 8, le))), 128))
-            ])) : K("", !0)
-          ])
+              ], 8, te))), 128))
+            ])) : L("", !0)
+          ], 2)
         ], 2)
       ]),
       _: 3
@@ -225,5 +228,5 @@ const G = { key: 0 }, H = ["onUpdate:modelValue", "placeholder", "disabled", "on
   }
 });
 export {
-  ce as _
+  de as _
 };

package/dist/{TextAreaInput.vue_vue_type_script_setup_true_lang-Cf0MJobG.js → TextAreaInput.vue_vue_type_script_setup_true_lang-Dtf7H1sT.js}

@@ -50,8 +50,9 @@ const L = { class: "sl-w-full" }, T = { class: "sl-relative" }, P = ["id", "name
     const w = F(() => {
       const l = [
         "sl-w-full",
-        "sl-px-3",
-        "sl-py-2",
+        "sl-pl-2",
+        "sl-pr-3",
+        "sl-py-1.5",
         "sl-text-sm",
         "sl-border",
         "sl-rounded-md",

package/dist/{calendar-DLry-Vik.js → calendar-DaXCwXP5.js}

@@ -84,7 +84,7 @@ function z(t) {
 }
 function B(t, e, n = 4) {
   const [s, o, a] = t.split("-").map(Number), i = new Date(s, o - 1, a, 0, 0, 0, 0), u = new Date(s, o - 1, a, 23, 59, 59, 999), f = e.filter((r) => !C(r)).map((r) => {
-    const c = r.startTime?.dateTime || r.datetime, l = r.endTime?.dateTime || r.datetime, h = new Date(c), d = l ? new Date(l) : new Date(h.getTime() + 1800 * 1e3), p = new Date(Math.max(i.getTime(), h.getTime())), E = new Date(Math.min(u.getTime(), d.getTime()));
+    const c = r.startTime?.dateTime || r.datetime, l = r.endTime?.dateTime || r.datetime, h = new Date(c), d = l ? new Date(l) : new Date(h.getTime() + 30 * 60 * 1e3), p = new Date(Math.max(i.getTime(), h.getTime())), E = new Date(Math.min(u.getTime(), d.getTime()));
     return {
       ...r,
       _start: p.getTime(),

package/dist/calendars/CalendarDashboard.d.ts

@@ -1 +1,3 @@
-export {}
+export * from '../src/components/calendars/CalendarDashboard'
+import StachelockUI from '../src/components/calendars/CalendarDashboard'
+export default StachelockUI

package/dist/calendars/CalendarDashboard.js

@@ -1,6 +1,6 @@
 import { defineComponent as _, ref as w, computed as d, createElementBlock as y, openBlock as D, createElementVNode as r, createVNode as s, withCtx as b, createTextVNode as x } from "vue";
-import { _ as C } from "../CalendarHeader.vue_vue_type_script_setup_true_lang-CMBsY5Y0.js";
-import { _ as S } from "../MonthCalendar.vue_vue_type_style_index_0_lang-lnKkvJ9u.js";
+import { _ as C } from "../CalendarHeader.vue_vue_type_script_setup_true_lang-CooyV5tq.js";
+import { _ as S } from "../MonthCalendar.vue_vue_type_style_index_0_lang-BdrrlrNr.js";
 import { _ as E } from "../EventsList.vue_vue_type_script_setup_true_lang-BTIoGr_e.js";
 import V from "../components/Button.js";
 import { _ as A } from "../_plugin-vue_export-helper-CHgC5LLL.js";

package/dist/calendars/CalendarHeader.d.ts

@@ -1 +1,3 @@
-export {}
+export * from '../src/components/calendars/CalendarHeader'
+import StachelockUI from '../src/components/calendars/CalendarHeader'
+export default StachelockUI

package/dist/calendars/CalendarHeader.js

@@ -1,4 +1,4 @@
-import { _ as f } from "../CalendarHeader.vue_vue_type_script_setup_true_lang-CMBsY5Y0.js";
+import { _ as f } from "../CalendarHeader.vue_vue_type_script_setup_true_lang-CooyV5tq.js";
 export {
   f as default
 };

package/dist/calendars/DayCalendar.d.ts

@@ -1 +1,3 @@
-export {}
+export * from '../src/components/calendars/DayCalendar'
+import StachelockUI from '../src/components/calendars/DayCalendar'
+export default StachelockUI

package/dist/calendars/DayCalendar.js

@@ -1,4 +1,4 @@
-import { _ as f } from "../DayCalendar.vue_vue_type_script_setup_true_lang-D-4jcUvI.js";
+import { _ as f } from "../DayCalendar.vue_vue_type_script_setup_true_lang-BgV8wr8v.js";
 export {
   f as default
 };

package/dist/calendars/EventCard.d.ts

@@ -1 +1,3 @@
-export {}
+export * from '../src/components/calendars/EventCard'
+import StachelockUI from '../src/components/calendars/EventCard'
+export default StachelockUI

package/dist/calendars/EventsList.d.ts

@@ -1 +1,3 @@
-export {}
+export * from '../src/components/calendars/EventsList'
+import StachelockUI from '../src/components/calendars/EventsList'
+export default StachelockUI

package/dist/calendars/MonthCalendar.d.ts

@@ -1 +1,3 @@
-export {}
+export * from '../src/components/calendars/MonthCalendar'
+import StachelockUI from '../src/components/calendars/MonthCalendar'
+export default StachelockUI