@codeandfunction/callaloo 4.7.5 → 4.8.0

package/dist/chunks/CLModal.vue_vue_type_style_index_0_lang-BDyONfaQ.js

@@ -0,0 +1,176 @@
+import '../components/Modals/CLModal/CLModal.css';
+import { defineComponent as W, useTemplateRef as F, useSlots as U, ref as Z, computed as m, watch as j, onMounted as q, onBeforeUnmount as A, createElementBlock as p, createCommentVNode as v, openBlock as w, normalizeStyle as y, normalizeClass as l, unref as n, createElementVNode as d, createBlock as B, renderSlot as $, withCtx as G, createTextVNode as J, toDisplayString as K } from "vue";
+import { _ as P } from "./CLButton.vue_vue_type_style_index_0_lang-MvhnNzVW.js";
+import { _ as Q } from "./CLHeading.vue_vue_type_style_index_0_lang-DH5oJc1C.js";
+import { CLMode as k, CLColors as T, CLColorVariants as N, CLBorderRadius as X, CLIconSizes as Y, CLIconNames as ee, CLHeadingTypes as oe } from "../index.js";
+import { g as te } from "./utils-D00IXMTR.js";
+import { useTheme as ne } from "../composables/useTheme.js";
+import { useEsc as le } from "../composables/useEsc.js";
+import { c as S, i as a } from "./helper-qUkciePY.js";
+const se = () => {
+  const { colors: t, darkMode: _ } = ne(), f = _.value ? k.Dark : k.Light, r = te({
+    color: T.Neutral,
+    colors: t.value,
+    mode: f,
+    variant: N.Solid
+  }), c = _.value ? "black" : "white";
+  return {
+    "--clll-modal-overlay-bg": r?.bg ?? "transparent",
+    "--clll-modal-content-bg": c,
+    "--clll-modal-theme-radius": "var(--clll-default-radius)"
+  };
+}, ae = ["id", "data-testid"], re = ["aria-labelledby"], we = /* @__PURE__ */ W({
+  name: "CLModal",
+  __name: "CLModal",
+  props: {
+    borderRadius: { default: void 0 },
+    close: { type: Boolean, default: !0 },
+    closeBorderRadius: { default: X.Full },
+    dismissible: { type: Boolean, default: !0 },
+    fullscreen: { type: Boolean, default: !1 },
+    isOpen: { type: Boolean, default: !1 },
+    maxWidth: { default: "640px" },
+    modalId: {},
+    onClose: { type: Function, default: void 0 },
+    overlay: { type: Boolean, default: !0 },
+    testId: { default: "clll-modal" },
+    title: { default: void 0 },
+    zIndex: { default: 100 }
+  },
+  emits: ["modal-open", "modal-close"],
+  setup(t, { emit: _ }) {
+    const f = _, r = F("modal-window"), c = U(), o = t, e = "clll-modal", x = "clll-prevent-scroll", u = Z(), I = () => {
+      a && window?.document.body.classList.add(x);
+    }, C = () => {
+      a && window?.document.body.classList.remove(x);
+    }, R = m(() => [
+      e
+    ]), E = m(() => [
+      `${e}__window`,
+      o.fullscreen ? `${e}__window--fullscreen` : ""
+    ]), M = m(() => [
+      `${e}__content`,
+      o.borderRadius ? `${e}__content--${o.borderRadius}` : "",
+      o.close ? `${e}__content--has-close-button` : `${e}__content--has-no-close-button`,
+      c.body ? `${e}__content--has-body` : `${e}__content--has-no-body`,
+      c.footer ? `${e}__content--has-footer` : `${e}__content--has-no-footer`,
+      c.header || o.title ? `${e}__content--has-header` : `${e}__content--has-no-header`,
+      o.title ? `${e}__content--has-title` : `${e}__content--has-no-title`
+    ]), O = m(() => o.zIndex === "auto" || S(o.zIndex) ? o.zIndex : o.zIndex.toString()), V = m(() => o.zIndex === "auto" ? o.zIndex : ((S(o.zIndex) ? parseInt(o.zIndex, 10) : o.zIndex) + 100).toString()), H = (s) => {
+      try {
+        const i = s?.target, g = r.value;
+        return a && g && !g.contains(i) ? !0 : void 0;
+      } catch (i) {
+        console.error(i);
+        return;
+      }
+    }, b = (s) => {
+      try {
+        H(s) && (a && window.removeEventListener("mousedown", b), L());
+      } catch (i) {
+        console.error(i);
+      }
+    }, h = () => {
+      a && window.removeEventListener("mousedown", b);
+    }, z = () => {
+      a && (u.value && a && window.clearTimeout(u.value), h(), C());
+    }, L = () => {
+      o.isOpen && (o.onClose?.(), z());
+    };
+    j(o, (s) => {
+      s.isOpen ? (f("modal-open"), I(), r.value && r.value.focus(), a && s.dismissible && (h(), u.value = window.setTimeout(() => {
+        window.addEventListener("mousedown", b);
+      }, 100))) : (r.value && r.value.blur(), C(), h(), u.value && a && window.clearTimeout(u.value), f("modal-close"));
+    }), q(() => {
+      o.isOpen && a && (I(), r.value && r.value.focus());
+    });
+    const { clearEventListeners: D } = le({ escHandler: o.dismissible ? L : void 0 });
+    return A(() => {
+      z(), D();
+    }), (s, i) => t.isOpen ? (w(), p("div", {
+      key: 0,
+      id: t.modalId,
+      class: l(n(R)),
+      "data-testid": t.testId,
+      style: y({ ...n(se)(), zIndex: n(O) })
+    }, [
+      d("div", {
+        class: l(n(E)),
+        style: y({ zIndex: n(V) })
+      }, [
+        d("div", {
+          ref: "modal-window",
+          "aria-modal": "true",
+          "aria-labelledby": `${e}__content__header__title`,
+          class: l(n(M)),
+          role: "dialog",
+          tabindex: -1,
+          style: y({ "--clll-modal-max-width": t.maxWidth })
+        }, [
+          d("div", {
+            class: l(`${e}__close-button`)
+          }, [
+            t.onClose && t.close ? (w(), B(n(P), {
+              key: 0,
+              "aria-label": "Close modal",
+              "border-radius": t.closeBorderRadius,
+              color: n(T).Neutral,
+              "icon-before": n(ee).Delete,
+              "icon-size": n(Y).Tiny,
+              "on-click": t.onClose,
+              "test-id": `${e}__close-button`,
+              variant: n(N).Text
+            }, null, 8, ["border-radius", "color", "icon-before", "icon-size", "on-click", "test-id", "variant"])) : v("", !0)
+          ], 2),
+          d("div", {
+            class: l(`${e}__content__header`)
+          }, [
+            d("div", {
+              class: l(`${e}__content__title`)
+            }, [
+              d("div", {
+                class: l(`${e}__content__header__container`)
+              }, [
+                t.title ? (w(), B(n(Q), {
+                  key: 0,
+                  id: `${e}__content__header__title`,
+                  class: l(`${e}__content__header__title`),
+                  type: n(oe).Section
+                }, {
+                  default: G(() => [
+                    J(K(t.title), 1)
+                  ]),
+                  _: 1
+                }, 8, ["id", "class", "type"])) : v("", !0),
+                $(s.$slots, "header")
+              ], 2)
+            ], 2)
+          ], 2),
+          d("div", {
+            class: l(`${e}__content__scroller`)
+          }, [
+            d("div", {
+              class: l(`${e}__content__body`)
+            }, [
+              $(s.$slots, "body")
+            ], 2)
+          ], 2),
+          d("div", {
+            class: l(`${e}__content__footer`)
+          }, [
+            $(s.$slots, "footer")
+          ], 2)
+        ], 14, re)
+      ], 6),
+      t.overlay ? (w(), p("div", {
+        key: 0,
+        ref: "overlay-ref",
+        class: l(`${e}__overlay`),
+        style: y({ zIndex: t.zIndex })
+      }, null, 6)) : v("", !0)
+    ], 14, ae)) : v("", !0);
+  }
+});
+export {
+  we as _
+};

package/dist/chunks/_plugin-vue_export-helper-CHgC5LLL.js

@@ -0,0 +1,9 @@
+const s = (t, r) => {
+  const o = t.__vccOpts || t;
+  for (const [c, e] of r)
+    o[c] = e;
+  return o;
+};
+export {
+  s as _
+};

package/dist/components/CLTable/CLTable.js

@@ -1,6 +1,6 @@
 import '../../assets/core.css';
 import './CLTable.css';
-import { defineComponent as i, computed as b, createElementBlock as o, openBlock as a, normalizeStyle as p, normalizeClass as s, unref as d, createElementVNode as h, createCommentVNode as y, renderSlot as r, Fragment as k, renderList as L, createVNode as T, withCtx as v } from "vue";
+import { defineComponent as i, computed as b, createElementBlock as a, openBlock as o, normalizeStyle as p, normalizeClass as s, unref as d, createElementVNode as h, createCommentVNode as y, renderSlot as r, Fragment as k, renderList as L, createVNode as T, withCtx as v } from "vue";
 import { CLMode as C, CLColorVariants as B, CLColors as w, CLTableTypes as g, CLTextTypes as H } from "../../index.js";
 import { g as N } from "../../chunks/utils-D00IXMTR.js";
 import { useTheme as x } from "../../composables/useTheme.js";
@@ -25,7 +25,7 @@ const A = () => {
     borderRadius: {},
     colWidths: {},
     id: { default: "main" },
-    rounded: { type: Boolean, default: !0 },
+    rounded: { type: Boolean, default: !1 },
     rowHeight: { default: "auto" },
     striped: { type: Boolean },
     testId: { default: "clll-table" },
@@ -45,7 +45,7 @@ const A = () => {
       t.withVerticalLines ? `${e}--vertical-lines` : void 0,
       t.bordered ? `${e}--bordered` : void 0
     ]);
-    return (c, m) => (a(), o("div", {
+    return (c, m) => (o(), a("div", {
       class: s(d(n)),
       "data-testid": l.testId,
       style: p(d(A)())
@@ -55,8 +55,8 @@ const A = () => {
         class: s(d(u)),
         style: p({ "--clll-table-row-height": l.rowHeight })
       }, [
-        l.colWidths?.length ? (a(), o("colgroup", F, [
-          (a(!0), o(k, null, L(l.colWidths, (_, $) => (a(), o("col", {
+        l.colWidths?.length ? (o(), a("colgroup", F, [
+          (o(!0), a(k, null, L(l.colWidths, (_, $) => (o(), a("col", {
             key: `table-${l.id}-col-${$}`,
             style: p({ width: _ })
           }, null, 4))), 128))
@@ -69,7 +69,7 @@ const A = () => {
   name: "CLTableBody",
   __name: "CLTableBody",
   setup(l) {
-    return (t, e) => (a(), o("tbody", {
+    return (t, e) => (o(), a("tbody", {
       class: s([z])
     }, [
       r(t.$slots, "default")
@@ -95,25 +95,25 @@ const A = () => {
       t.isActive ? `${e}--active` : "",
       t.onClick ? `${e}--clickable` : ""
     ]), u = () => t?.onClick?.();
-    return (c, m) => l.isHeader ? (a(), o("th", {
+    return (c, m) => l.isHeader ? (o(), a("th", {
       key: 0,
       class: s(d(n)),
       colspan: l.colSpan,
       onClick: u
     }, [
-      l.isAction ? (a(), o("div", {
+      l.isAction ? (o(), a("div", {
         key: 1,
         class: s(`${e}__actions`)
       }, [
         r(c.$slots, "default")
       ], 2)) : r(c.$slots, "default", { key: 0 })
-    ], 10, E)) : (a(), o("td", {
+    ], 10, E)) : (o(), a("td", {
       key: 1,
       class: s(d(n)),
       colspan: l.colSpan,
       onClick: u
     }, [
-      l.isAction ? (a(), o("div", {
+      l.isAction ? (o(), a("div", {
         key: 1,
         class: s(`${e}__actions`)
       }, [
@@ -125,7 +125,7 @@ const A = () => {
   name: "CLTableFooter",
   __name: "CLTableFooter",
   setup(l) {
-    return (t, e) => (a(), o("tfoot", {
+    return (t, e) => (o(), a("tfoot", {
       class: s([O])
     }, [
       r(t.$slots, "default")
@@ -135,7 +135,7 @@ const A = () => {
   name: "CLTableHeader",
   __name: "CLTableHeader",
   setup(l) {
-    return (t, e) => (a(), o("thead", {
+    return (t, e) => (o(), a("thead", {
       class: s([q])
     }, [
       r(t.$slots, "default")
@@ -149,7 +149,7 @@ const A = () => {
   },
   setup(l) {
     const t = "clll-table__nested-cell";
-    return (e, n) => (a(), o("div", {
+    return (e, n) => (o(), a("div", {
       class: s(t)
     }, [
       T(d(V), {
@@ -174,7 +174,7 @@ const A = () => {
       e,
       t.onClick ? `${e}--clickable` : ""
     ]), u = () => t?.onClick?.();
-    return (c, m) => (a(), o("tr", {
+    return (c, m) => (o(), a("tr", {
       class: s(d(n)),
       onClick: u
     }, [