@codeandfunction/callaloo 3.15.2 → 3.16.0

package/dist/components/Modals/CLModal/CLModal.js

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

package/dist/components/Modals/CLModal/CLModal.vue.d.ts

@@ -38,14 +38,14 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<CL
     borderRadius: CLBorderRadius;
     close: boolean;
     testId: string;
-    isOpen: boolean;
-    zIndex: number | string;
     closeBorderRadius: CLBorderRadius;
     dismissible: boolean;
     fullscreen: boolean;
+    isOpen: boolean;
     maxWidth: string;
     onClose: CLGenericFunction;
     overlay: boolean;
+    zIndex: number | string;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     'modal-window': HTMLDivElement;
     'overlay-ref': HTMLDivElement;

package/dist/components/Navigation/CLLink/CLLink.css

@@ -0,0 +1 @@
+:root{--clll-unit-0: 0;--clll-unit-0_5: .125rem;--clll-unit-1: .25rem;--clll-unit-1_5: .375rem;--clll-unit-2: .5rem;--clll-unit-2_5: .625rem;--clll-unit-3: .75rem;--clll-unit-3_5: .875rem;--clll-unit-4: 1rem;--clll-unit-4_5: 1.125rem;--clll-unit-5: 1.25rem;--clll-unit-5_5: 1.375rem;--clll-unit-6: 1.5rem;--clll-unit-6_5: 1.625rem;--clll-unit-7: 1.75rem;--clll-unit-7_5: 1.875rem;--clll-unit-8: 2rem;--clll-unit-8_5: 2.125rem;--clll-unit-9_5: 2.375rem;--clll-unit-10: 2.5rem;--clll-unit-10_5: 2.625rem;--clll-unit-12: 3rem;--clll-unit-14: 3.5rem;--clll-unit-14_5: 3.625rem;--clll-unit-18: 4.5rem}.form-addon-flex{display:flex;align-items:center;justify-content:center;pointer-events:none;user-select:none}.form-addon-flex--left{left:0}.form-addon-flex--right{right:0}.form-addon-flex--icon{z-index:10;box-sizing:border-box}.form-addon-flex--string{position:relative}.form-addon-radius--left-full{border-top-left-radius:var(--clll-rounded-full);border-bottom-left-radius:var(--clll-rounded-full)}.form-addon-radius--right-full{border-top-right-radius:var(--clll-rounded-full);border-bottom-right-radius:var(--clll-rounded-full)}.form-addon-radius--left-lg{border-top-left-radius:var(--clll-rounded-lg);border-bottom-left-radius:var(--clll-rounded-lg)}.form-addon-radius--right-lg{border-top-right-radius:var(--clll-rounded-lg);border-bottom-right-radius:var(--clll-rounded-lg)}.form-addon-radius--left-md{border-top-left-radius:var(--clll-rounded-md);border-bottom-left-radius:var(--clll-rounded-md)}.form-addon-radius--right-md{border-top-right-radius:var(--clll-rounded-md);border-bottom-right-radius:var(--clll-rounded-md)}.form-addon-radius--left-sm{border-top-left-radius:var(--clll-rounded-sm);border-bottom-left-radius:var(--clll-rounded-sm)}.form-addon-radius--right-sm{border-top-right-radius:var(--clll-rounded-sm);border-bottom-right-radius:var(--clll-rounded-sm)}.form-addon-radius--left-xs{border-top-left-radius:var(--clll-rounded-xs);border-bottom-left-radius:var(--clll-rounded-xs)}.form-addon-radius--right-xs{border-top-right-radius:var(--clll-rounded-xs);border-bottom-right-radius:var(--clll-rounded-xs)}.form-addon-radius--left-xl{border-top-left-radius:var(--clll-rounded-xl);border-bottom-left-radius:var(--clll-rounded-xl)}.form-addon-radius--right-xl{border-top-right-radius:var(--clll-rounded-xl);border-bottom-right-radius:var(--clll-rounded-xl)}.form-addon-radius--left-2xl{border-top-left-radius:var(--clll-rounded-2xl);border-bottom-left-radius:var(--clll-rounded-2xl)}.form-addon-radius--right-2xl{border-top-right-radius:var(--clll-rounded-2xl);border-bottom-right-radius:var(--clll-rounded-2xl)}.form-addon-radius--left-3xl{border-top-left-radius:var(--clll-rounded-3xl);border-bottom-left-radius:var(--clll-rounded-3xl)}.form-addon-radius--right-3xl{border-top-right-radius:var(--clll-rounded-3xl);border-bottom-right-radius:var(--clll-rounded-3xl)}.form-addon-radius--left-none{border-top-left-radius:0;border-bottom-left-radius:0}.form-addon-radius--right-none{border-top-right-radius:0;border-bottom-right-radius:0}.form-control-flex{display:inline-flex;align-items:center;justify-content:center;position:relative}.form-counter-flex{display:flex;align-items:center;justify-content:flex-end;max-width:100px;box-sizing:border-box;flex:1;position:relative;pointer-events:none;user-select:none}.form-select-icon-flex{position:absolute;top:0;right:0;height:100%;display:flex;align-items:center;pointer-events:none}:root{--clll-rounded-full: 9999px;--clll-rounded-none: 0;--clll-rounded-xs: var(--clll-unit-1);--clll-rounded-sm: var(--clll-unit-2);--clll-rounded-md: var(--clll-unit-3);--clll-rounded-lg: var(--clll-unit-4);--clll-rounded-xl: var(--clll-unit-5);--clll-rounded-2xl: var(--clll-unit-6);--clll-rounded-3xl: var(--clll-unit-7);--clll-px-xs: var(--clll-unit-1_5);--clll-px-sm: var(--clll-unit-2);--clll-px-md: var(--clll-unit-2_5);--clll-px-lg: var(--clll-unit-3);--clll-px-xl: var(--clll-unit-3_5);--clll-px-2xl: var(--clll-unit-4);--clll-px-3xl: var(--clll-unit-4_5);--clll-px-s-xs: calc(var(--clll-px-xs) * .5);--clll-px-s-sm: calc(var(--clll-px-sm) * .5);--clll-py-xs: calc(var(--clll-unit-1) - 1px);--clll-py-sm: calc(var(--clll-unit-1_5) - 1px);--clll-py-md: calc(var(--clll-unit-2) - 1px);--clll-py-lg: var(--clll-unit-2);--clll-py-xl: var(--clll-unit-2_5);--clll-py-2xl: var(--clll-unit-3);--clll-py-3xl: var(--clll-unit-3_5);--clll-py-4xl: var(--clll-unit-4);--clll-py-s-xs: calc(var(--clll-py-xs) * .5);--clll-z-index-10: 10}.clll-link{cursor:pointer}.clll-link.clll-link--underline.clll-link--neutral,.clll-link.clll-link--underline.clll-link--primary,.clll-link.clll-link--underline.clll-link--secondary,.clll-link.clll-link--underline.clll-link--danger,.clll-link.clll-link--underline.clll-link--info,.clll-link.clll-link--underline.clll-link--warning,.clll-link.clll-link--underline.clll-link--success{font-family:var(--clll-font-family);-webkit-font-smoothing:antialiased;border-radius:var(--clll-rounded-xs);text-underline-offset:var(--clll-unit-0_5);transition-property:text-decoration-color;transition-duration:.3s;transition-timing-function:ease}.clll-link.clll-link--nounderline.clll-link--neutral,.clll-link.clll-link--nounderline.clll-link--primary,.clll-link.clll-link--nounderline.clll-link--secondary,.clll-link.clll-link--nounderline.clll-link--danger,.clll-link.clll-link--nounderline.clll-link--info,.clll-link.clll-link--nounderline.clll-link--warning,.clll-link.clll-link--nounderline.clll-link--success{font-family:var(--clll-font-family);-webkit-font-smoothing:antialiased;border-radius:var(--clll-rounded-xs);transition-property:text-decoration-color;transition-duration:.3s;transition-timing-function:ease}.clll-link .clll-text{transition-property:color;transition-duration:.3s;transition-timing-function:ease}.clll-link.clll-link--external .clll-icon{padding-left:var(--clll-px-s-xs)}

package/dist/components/Navigation/CLLink/CLLink.js

@@ -0,0 +1,6 @@
+import './CLLink.css';
+import { _ as s } from "../../../chunks/CLLink.vue_vue_type_style_index_0_lang-D7BqWIqs.js";
+export {
+  s as CLLink,
+  s as default
+};

package/dist/components/Navigation/CLLink/CLLink.vue.d.ts

@@ -1,4 +1,4 @@
-import { CLColors, CLGenericFunction, CLLinkTarget } from '../../../index.ts';
+import { CLColors, CLGenericFunction, CLLinkTarget } from '../../../types';
 export interface CLLinkProps {
     /** Sets the aria-label on the Link element. */
     ariaLabel?: string;
@@ -23,9 +23,9 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<CL
     color: CLColors;
     testId: string;
     target: CLLinkTarget;
+    underline: boolean;
     external: boolean;
     rel: string;
-    underline: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLAnchorElement>, {
     default?(_: {}): any;
 }>;

package/dist/components/Navigation/CLNavLink/CLNavLink.js

@@ -0,0 +1,5 @@
+import { _ as s } from "../../../chunks/CLNavLink.vue_vue_type_script_setup_true_lang-Dp3SsIfq.js";
+export {
+  s as CLNavLink,
+  s as default
+};

package/dist/components/Navigation/CLNavLink/CLNavLink.vue.d.ts

@@ -1,4 +1,4 @@
-import { CLColors, CLGenericFunction, CLLinkTarget } from '../../../index.ts';
+import { CLColors, CLGenericFunction, CLLinkTarget } from '../../../types';
 export interface CLNavLinkProps {
     /** Sets the aria-label on the NavLink element. */
     ariaLabel?: string;

package/dist/components/Navigation/CLNavSection/CLNavSection.css

@@ -0,0 +1 @@
+:root{--clll-unit-0: 0;--clll-unit-0_5: .125rem;--clll-unit-1: .25rem;--clll-unit-1_5: .375rem;--clll-unit-2: .5rem;--clll-unit-2_5: .625rem;--clll-unit-3: .75rem;--clll-unit-3_5: .875rem;--clll-unit-4: 1rem;--clll-unit-4_5: 1.125rem;--clll-unit-5: 1.25rem;--clll-unit-5_5: 1.375rem;--clll-unit-6: 1.5rem;--clll-unit-6_5: 1.625rem;--clll-unit-7: 1.75rem;--clll-unit-7_5: 1.875rem;--clll-unit-8: 2rem;--clll-unit-8_5: 2.125rem;--clll-unit-9_5: 2.375rem;--clll-unit-10: 2.5rem;--clll-unit-10_5: 2.625rem;--clll-unit-12: 3rem;--clll-unit-14: 3.5rem;--clll-unit-14_5: 3.625rem;--clll-unit-18: 4.5rem}.form-addon-flex{display:flex;align-items:center;justify-content:center;pointer-events:none;user-select:none}.form-addon-flex--left{left:0}.form-addon-flex--right{right:0}.form-addon-flex--icon{z-index:10;box-sizing:border-box}.form-addon-flex--string{position:relative}.form-addon-radius--left-full{border-top-left-radius:var(--clll-rounded-full);border-bottom-left-radius:var(--clll-rounded-full)}.form-addon-radius--right-full{border-top-right-radius:var(--clll-rounded-full);border-bottom-right-radius:var(--clll-rounded-full)}.form-addon-radius--left-lg{border-top-left-radius:var(--clll-rounded-lg);border-bottom-left-radius:var(--clll-rounded-lg)}.form-addon-radius--right-lg{border-top-right-radius:var(--clll-rounded-lg);border-bottom-right-radius:var(--clll-rounded-lg)}.form-addon-radius--left-md{border-top-left-radius:var(--clll-rounded-md);border-bottom-left-radius:var(--clll-rounded-md)}.form-addon-radius--right-md{border-top-right-radius:var(--clll-rounded-md);border-bottom-right-radius:var(--clll-rounded-md)}.form-addon-radius--left-sm{border-top-left-radius:var(--clll-rounded-sm);border-bottom-left-radius:var(--clll-rounded-sm)}.form-addon-radius--right-sm{border-top-right-radius:var(--clll-rounded-sm);border-bottom-right-radius:var(--clll-rounded-sm)}.form-addon-radius--left-xs{border-top-left-radius:var(--clll-rounded-xs);border-bottom-left-radius:var(--clll-rounded-xs)}.form-addon-radius--right-xs{border-top-right-radius:var(--clll-rounded-xs);border-bottom-right-radius:var(--clll-rounded-xs)}.form-addon-radius--left-xl{border-top-left-radius:var(--clll-rounded-xl);border-bottom-left-radius:var(--clll-rounded-xl)}.form-addon-radius--right-xl{border-top-right-radius:var(--clll-rounded-xl);border-bottom-right-radius:var(--clll-rounded-xl)}.form-addon-radius--left-2xl{border-top-left-radius:var(--clll-rounded-2xl);border-bottom-left-radius:var(--clll-rounded-2xl)}.form-addon-radius--right-2xl{border-top-right-radius:var(--clll-rounded-2xl);border-bottom-right-radius:var(--clll-rounded-2xl)}.form-addon-radius--left-3xl{border-top-left-radius:var(--clll-rounded-3xl);border-bottom-left-radius:var(--clll-rounded-3xl)}.form-addon-radius--right-3xl{border-top-right-radius:var(--clll-rounded-3xl);border-bottom-right-radius:var(--clll-rounded-3xl)}.form-addon-radius--left-none{border-top-left-radius:0;border-bottom-left-radius:0}.form-addon-radius--right-none{border-top-right-radius:0;border-bottom-right-radius:0}.form-control-flex{display:inline-flex;align-items:center;justify-content:center;position:relative}.form-counter-flex{display:flex;align-items:center;justify-content:flex-end;max-width:100px;box-sizing:border-box;flex:1;position:relative;pointer-events:none;user-select:none}.form-select-icon-flex{position:absolute;top:0;right:0;height:100%;display:flex;align-items:center;pointer-events:none}:root{--clll-rounded-full: 9999px;--clll-rounded-none: 0;--clll-rounded-xs: var(--clll-unit-1);--clll-rounded-sm: var(--clll-unit-2);--clll-rounded-md: var(--clll-unit-3);--clll-rounded-lg: var(--clll-unit-4);--clll-rounded-xl: var(--clll-unit-5);--clll-rounded-2xl: var(--clll-unit-6);--clll-rounded-3xl: var(--clll-unit-7);--clll-px-xs: var(--clll-unit-1_5);--clll-px-sm: var(--clll-unit-2);--clll-px-md: var(--clll-unit-2_5);--clll-px-lg: var(--clll-unit-3);--clll-px-xl: var(--clll-unit-3_5);--clll-px-2xl: var(--clll-unit-4);--clll-px-3xl: var(--clll-unit-4_5);--clll-px-s-xs: calc(var(--clll-px-xs) * .5);--clll-px-s-sm: calc(var(--clll-px-sm) * .5);--clll-py-xs: calc(var(--clll-unit-1) - 1px);--clll-py-sm: calc(var(--clll-unit-1_5) - 1px);--clll-py-md: calc(var(--clll-unit-2) - 1px);--clll-py-lg: var(--clll-unit-2);--clll-py-xl: var(--clll-unit-2_5);--clll-py-2xl: var(--clll-unit-3);--clll-py-3xl: var(--clll-unit-3_5);--clll-py-4xl: var(--clll-unit-4);--clll-py-s-xs: calc(var(--clll-py-xs) * .5);--clll-z-index-10: 10}.clll-nav-section{margin:0;padding:0;list-style:none}.clll-nav-section.clll-nav-section--horizontal>:not([hidden])~:not([hidden]){margin-top:var(--clll-unit-2)}@media (min-width: 768px){.clll-nav-section.clll-nav-section--horizontal{display:inline-block}.clll-nav-section.clll-nav-section--horizontal>:not([hidden])~:not([hidden]){margin-top:var(--clll-unit-0)}.clll-nav-section.clll-nav-section--horizontal>:not([hidden])~:not([hidden]){margin-left:var(--clll-unit-4)}}@media (min-width: 1280px){.clll-nav-section.clll-nav-section--horizontal>:not([hidden])~:not([hidden]){margin-left:var(--clll-unit-8)}}@media (min-width: 768px){.clll-nav-section.clll-nav-section--horizontal .clll-nav-section__item{display:inline-block}}.clll-nav-section.clll-nav-section--vertical>:not([hidden])~:not([hidden]){margin-top:var(--clll-unit-2)}@media (min-width: 768px){.clll-nav-section.clll-nav-section--vertical>:not([hidden])~:not([hidden]){margin-top:var(--clll-unit-4)}}

package/dist/components/Navigation/CLNavSection/CLNavSection.js

@@ -0,0 +1,55 @@
+import './CLNavSection.css';
+import { defineComponent as f, computed as u, createElementBlock as a, openBlock as l, normalizeClass as m, unref as r, Fragment as p, renderList as _, createVNode as i, withCtx as n, createTextVNode as C, toDisplayString as x } from "vue";
+import { _ as k } from "../../../chunks/CLNavLink.vue_vue_type_script_setup_true_lang-Dp3SsIfq.js";
+import { _ as L } from "../../../chunks/CLText.vue_vue_type_style_index_0_lang-CTc6UiQV.js";
+import { CLOrientation as h, CLColors as $ } from "../../../index.js";
+const g = ["data-testid"], V = /* @__PURE__ */ f({
+  name: "CLNavSection",
+  __name: "CLNavSection",
+  props: {
+    color: { default: $.Primary },
+    navItems: {},
+    testId: { default: "clll-nav-section" },
+    type: { default: h.Horizontal }
+  },
+  setup(t) {
+    const c = t, o = "clll-nav-section", s = u(() => [
+      o,
+      `${o}--${c.type}`
+    ]);
+    return (y, N) => (l(), a("ul", {
+      class: m(r(s)),
+      "data-testid": t.testId
+    }, [
+      (l(!0), a(p, null, _(t.navItems, (e, d) => (l(), a("li", {
+        key: `link-${e.id}-${d}`,
+        class: "clll-nav-section__item"
+      }, [
+        i(r(k), {
+          id: e.id,
+          "aria-label": e.ariaLabel,
+          color: t.color,
+          external: e.external,
+          href: e.href,
+          rel: e.rel,
+          target: e.target,
+          "on-click": e.onClick
+        }, {
+          default: n(() => [
+            i(r(L), { as: "span" }, {
+              default: n(() => [
+                C(x(e.label), 1)
+              ]),
+              _: 2
+            }, 1024)
+          ]),
+          _: 2
+        }, 1032, ["id", "aria-label", "color", "external", "href", "rel", "target", "on-click"])
+      ]))), 128))
+    ], 10, g));
+  }
+});
+export {
+  V as CLNavSection,
+  V as default
+};

package/dist/components/Navigation/CLNavSection/CLNavSection.vue.d.ts

@@ -1,4 +1,4 @@
-import { CLColors, CLNavItem, CLOrientation } from '../../../index.ts';
+import { CLColors, CLNavItem, CLOrientation } from '../../../types';
 export interface CLNavSectionProps {
     /** Set the color of the link. The property can be one of `CLColors`, e.g. `CLColors.Secondary`. */
     color?: CLColors;

package/dist/components/Popups/CLDropdownMenu/CLDropdownMenu.css

@@ -0,0 +1 @@
+:root{--clll-unit-0: 0;--clll-unit-0_5: .125rem;--clll-unit-1: .25rem;--clll-unit-1_5: .375rem;--clll-unit-2: .5rem;--clll-unit-2_5: .625rem;--clll-unit-3: .75rem;--clll-unit-3_5: .875rem;--clll-unit-4: 1rem;--clll-unit-4_5: 1.125rem;--clll-unit-5: 1.25rem;--clll-unit-5_5: 1.375rem;--clll-unit-6: 1.5rem;--clll-unit-6_5: 1.625rem;--clll-unit-7: 1.75rem;--clll-unit-7_5: 1.875rem;--clll-unit-8: 2rem;--clll-unit-8_5: 2.125rem;--clll-unit-9_5: 2.375rem;--clll-unit-10: 2.5rem;--clll-unit-10_5: 2.625rem;--clll-unit-12: 3rem;--clll-unit-14: 3.5rem;--clll-unit-14_5: 3.625rem;--clll-unit-18: 4.5rem}.form-addon-flex{display:flex;align-items:center;justify-content:center;pointer-events:none;user-select:none}.form-addon-flex--left{left:0}.form-addon-flex--right{right:0}.form-addon-flex--icon{z-index:10;box-sizing:border-box}.form-addon-flex--string{position:relative}.form-addon-radius--left-full{border-top-left-radius:var(--clll-rounded-full);border-bottom-left-radius:var(--clll-rounded-full)}.form-addon-radius--right-full{border-top-right-radius:var(--clll-rounded-full);border-bottom-right-radius:var(--clll-rounded-full)}.form-addon-radius--left-lg{border-top-left-radius:var(--clll-rounded-lg);border-bottom-left-radius:var(--clll-rounded-lg)}.form-addon-radius--right-lg{border-top-right-radius:var(--clll-rounded-lg);border-bottom-right-radius:var(--clll-rounded-lg)}.form-addon-radius--left-md{border-top-left-radius:var(--clll-rounded-md);border-bottom-left-radius:var(--clll-rounded-md)}.form-addon-radius--right-md{border-top-right-radius:var(--clll-rounded-md);border-bottom-right-radius:var(--clll-rounded-md)}.form-addon-radius--left-sm{border-top-left-radius:var(--clll-rounded-sm);border-bottom-left-radius:var(--clll-rounded-sm)}.form-addon-radius--right-sm{border-top-right-radius:var(--clll-rounded-sm);border-bottom-right-radius:var(--clll-rounded-sm)}.form-addon-radius--left-xs{border-top-left-radius:var(--clll-rounded-xs);border-bottom-left-radius:var(--clll-rounded-xs)}.form-addon-radius--right-xs{border-top-right-radius:var(--clll-rounded-xs);border-bottom-right-radius:var(--clll-rounded-xs)}.form-addon-radius--left-xl{border-top-left-radius:var(--clll-rounded-xl);border-bottom-left-radius:var(--clll-rounded-xl)}.form-addon-radius--right-xl{border-top-right-radius:var(--clll-rounded-xl);border-bottom-right-radius:var(--clll-rounded-xl)}.form-addon-radius--left-2xl{border-top-left-radius:var(--clll-rounded-2xl);border-bottom-left-radius:var(--clll-rounded-2xl)}.form-addon-radius--right-2xl{border-top-right-radius:var(--clll-rounded-2xl);border-bottom-right-radius:var(--clll-rounded-2xl)}.form-addon-radius--left-3xl{border-top-left-radius:var(--clll-rounded-3xl);border-bottom-left-radius:var(--clll-rounded-3xl)}.form-addon-radius--right-3xl{border-top-right-radius:var(--clll-rounded-3xl);border-bottom-right-radius:var(--clll-rounded-3xl)}.form-addon-radius--left-none{border-top-left-radius:0;border-bottom-left-radius:0}.form-addon-radius--right-none{border-top-right-radius:0;border-bottom-right-radius:0}.form-control-flex{display:inline-flex;align-items:center;justify-content:center;position:relative}.form-counter-flex{display:flex;align-items:center;justify-content:flex-end;max-width:100px;box-sizing:border-box;flex:1;position:relative;pointer-events:none;user-select:none}.form-select-icon-flex{position:absolute;top:0;right:0;height:100%;display:flex;align-items:center;pointer-events:none}:root{--clll-rounded-full: 9999px;--clll-rounded-none: 0;--clll-rounded-xs: var(--clll-unit-1);--clll-rounded-sm: var(--clll-unit-2);--clll-rounded-md: var(--clll-unit-3);--clll-rounded-lg: var(--clll-unit-4);--clll-rounded-xl: var(--clll-unit-5);--clll-rounded-2xl: var(--clll-unit-6);--clll-rounded-3xl: var(--clll-unit-7);--clll-px-xs: var(--clll-unit-1_5);--clll-px-sm: var(--clll-unit-2);--clll-px-md: var(--clll-unit-2_5);--clll-px-lg: var(--clll-unit-3);--clll-px-xl: var(--clll-unit-3_5);--clll-px-2xl: var(--clll-unit-4);--clll-px-3xl: var(--clll-unit-4_5);--clll-px-s-xs: calc(var(--clll-px-xs) * .5);--clll-px-s-sm: calc(var(--clll-px-sm) * .5);--clll-py-xs: calc(var(--clll-unit-1) - 1px);--clll-py-sm: calc(var(--clll-unit-1_5) - 1px);--clll-py-md: calc(var(--clll-unit-2) - 1px);--clll-py-lg: var(--clll-unit-2);--clll-py-xl: var(--clll-unit-2_5);--clll-py-2xl: var(--clll-unit-3);--clll-py-3xl: var(--clll-unit-3_5);--clll-py-4xl: var(--clll-unit-4);--clll-py-s-xs: calc(var(--clll-py-xs) * .5);--clll-z-index-10: 10}.clll-dropdown-menu__menu{position:relative;display:inline-block}.clll-dropdown-menu__menu .clll-dropdown-menu__dropdown{z-index:var(--v69f60b10)}