@codeandfunction/callaloo 3.15.2 → 3.16.0

package/dist/chunks/CLIcon.vue_vue_type_style_index_0_lang-zZ4zGuBt.js

@@ -0,0 +1,83 @@
+import { defineComponent as p, useCssVars as y, computed as v, onMounted as X, createElementBlock as a, openBlock as m, normalizeClass as u, unref as w, createElementVNode as B } from "vue";
+import { CLMode as f, CLColors as h, CLColorVariants as I, CLIconSizes as e } from "../index.js";
+import { g as x, a as z, c as S } from "./utils-Dz_31dEE.js";
+import { u as M, i as $ } from "./base-theme-B89pbWnC.js";
+const b = ({ color: o = h.Neutral }) => {
+  const { colors: i, darkMode: t } = M(), s = t.value ? f.Light : f.Dark, l = x({
+    color: o,
+    colors: i.value,
+    mode: s,
+    variant: I.Text
+  });
+  return z(S`color: ${l?.textBody};`);
+}, E = ["data-testid"], N = ["height", "width"], T = ["href"], O = /* @__PURE__ */ p({
+  name: "CLIcon",
+  __name: "CLIcon",
+  props: {
+    color: { default: h.Neutral },
+    name: {},
+    size: { default: e.Small },
+    testId: { default: "clll-icon" }
+  },
+  setup(o) {
+    y((n) => ({
+      v18b705a2: s[n.size] + "px"
+    }));
+    const i = o, t = "clll-icon", s = {
+      [e.Tiny]: 20,
+      [e.Small]: 24,
+      [e.Medium]: 28,
+      [e.Large]: 32,
+      [e.XL]: 36,
+      [e.XXL]: 40,
+      [e.XXXL]: 44,
+      [e.XXXXL]: 48
+    }, l = v(() => [
+      t,
+      `${t}--${i.name}`,
+      `${t}--${i.size}`
+    ]), C = async () => {
+      if (!$) return;
+      let n = window?.document.getElementById("clll-icons");
+      if (!n)
+        try {
+          const r = (/* @__PURE__ */ Object.assign({
+            "/src/icons.svg": () => import("./icons-QRYZHNAf.js").then((g) => g.default)
+          }))["/src/icons.svg"];
+          if (!r) {
+            console.warn("[Callaloo] Icon sprite not found");
+            return;
+          }
+          const L = await r();
+          if (n = window?.document.getElementById("clll-icons"), n) return;
+          const c = window?.document.createElement("div");
+          c.id = "clll-icons", c.style.display = "none", c.innerHTML = L.toString(), window?.document.readyState === "loading" ? window.addEventListener("DOMContentLoaded", () => {
+            window?.document.body.insertBefore(c, window?.document.body.childNodes[0]);
+          }) : window?.document.body.insertBefore(c, window?.document.body.childNodes[0]);
+        } catch (d) {
+          console.error("[Callaloo] Failed to load icon sprite:", d);
+        }
+    };
+    return X(() => {
+      C();
+    }), (n, d) => (m(), a("span", {
+      class: u([w(l), w(b)({ color: o.color })]),
+      "data-testid": o.testId
+    }, [
+      (m(), a("svg", {
+        "aria-hidden": "true",
+        class: u(`${t}-sprite`),
+        height: s[o.size],
+        width: s[o.size],
+        viewBox: "0 0 24 24"
+      }, [
+        B("use", {
+          href: `#${o.name}`
+        }, null, 8, T)
+      ], 10, N))
+    ], 10, E));
+  }
+});
+export {
+  O as _
+};

package/dist/chunks/CLInputMessages.vue_vue_type_style_index_0_lang-xm2qDJGJ.js

@@ -0,0 +1,121 @@
+import { defineComponent as G, createElementBlock as W, openBlock as R, normalizeClass as O, unref as E, renderSlot as N, Fragment as A, renderList as H, createElementVNode as I, toDisplayString as j } from "vue";
+import { CLOrientation as J, CLMode as x, CLColorVariants as n, CLColors as K } from "../index.js";
+import { u as L } from "./base-theme-B89pbWnC.js";
+import { g as w, c as r, b as q, f as M, a as S } from "./utils-Dz_31dEE.js";
+const B = "clll-form-field", m = /* @__PURE__ */ G({
+  __name: "CLFormField",
+  props: {
+    fluid: { type: Boolean },
+    hasPill: { type: Boolean },
+    hasCharCounter: { type: Boolean },
+    orientation: {}
+  },
+  setup(e) {
+    return (l, s) => (R(), W("div", {
+      class: O([
+        B,
+        e.fluid || e.orientation === E(J).Horizontal ? `${B}--fluid` : `${B}--fixed`,
+        e.orientation ? `${B}--${e.orientation}` : "",
+        e.hasPill ? `${B}--haspill` : "",
+        e.hasCharCounter ? `${B}--hascharcounter` : ""
+      ])
+    }, [
+      N(l.$slots, "default")
+    ], 2));
+  }
+}), ll = ({
+  color: e,
+  component: l,
+  disabled: s,
+  variant: a
+}) => {
+  const { borderRadius: c, colors: b, darkMode: f } = L(), h = f.value ? x.Dark : x.Light, i = w({
+    color: e,
+    colors: b.value,
+    mode: h,
+    variant: n.Solid
+  }), d = w({
+    color: e,
+    colors: b.value,
+    mode: h,
+    variant: n.Outline
+  }), t = f.value ? "black" : "white", $ = a === n.Ghost ? "transparent" : d?.border, y = d?.disabled, u = f.value ? "black" : i?.textDisabled, g = d?.focus, C = d?.focus, _ = a === n.Ghost ? "0px" : "2px", k = d?.text, v = d?.textDisabled;
+  let o, p, D;
+  c.value && (o = r`&:not([class*='clll-${l}--rounded-']){&.clll-${l}.clll-${l}--rounded .clll-${l}__${l}{border-radius:var(--clll-${c.value});}&.clll-${l}.clll-${l}--rounded{.clll-radiobutton__indicator{border-radius:var(--clll-${c.value});}}}`), s && (p = r`.clll-${l}__${l}-container{.clll-${l}__label{cursor:not-allowed;.clll-${l}__${l}{&:disabled{&:checked{background-color:${u};}}}}}&.clll-${l}--disabled{.clll-${l}__label{.clll-${l}__${l}-frame{.clll-${l}__icon{color:${v};}.clll-radiobutton__indicator{background-color:${v};}}}`);
+  const T = r`&.clll-${l}--haslabel{.clll-${l}__label{.clll-text{&.clll-${l}__label--required::after{${z()}}}}}.clll-${l}__${l}-container{.clll-${l}__label{.clll-${l}__${l}-frame{.clll-${l}__icon{color:${k};}.clll-radiobutton__indicator{background-color:${k};}.clll-${l}__${l}{${M({ borderColor: $, shadowColor: C, outlineWidth: _, outlineColor: g, shadowWidth: "--clll-unit-0" })}&:checked{background-color:${t};${s ? M({ borderColor: y, shadowColor: C, outlineWidth: _, outlineColor: g, shadowWidth: "--clll-unit-0" }) : ""}}}}}}.clll-${l}__${l}{${q({ backgroundColor: t, borderColor: $ })}}`;
+  return S(T, o, p, D);
+}, el = ({
+  color: e,
+  component: l,
+  disabled: s,
+  readonly: a,
+  variant: c
+}) => {
+  const { borderRadius: b, colors: f, darkMode: h } = L(), i = h.value ? x.Dark : x.Light, d = w({
+    color: e,
+    colors: f.value,
+    mode: i,
+    variant: n.Solid
+  }), t = w({
+    color: e,
+    colors: f.value,
+    mode: i,
+    variant: n.Outline
+  }), $ = h.value ? "black" : "white", y = h.value ? "black" : d?.textDisabled, u = t?.border, g = t?.disabled, C = h.value ? "black" : d?.textDisabled, _ = t?.focus, k = t?.focus, v = t?.text, o = t?.focus;
+  let p, D, T, F;
+  b.value && (p = r`&:not([class*='clll-${l}--rounded-']){.clll-${l}.clll-${l}--rounded,.clll-${l}__input-container,&.clll-${l}.clll-${l}--rounded .clll-${l}__input{border-radius:var(--clll-${b.value})}}&.clll-${l}--hascustomprefix,&.clll-${l}--hascustomsuffix,&.clll-input--hasiconprefix,&.clll-input--hasiconsuffix,{&.clll-${l}.clll-${l}--rounded{.clll-${l}__input-container{overflow:hidden;.clll-${l}__input-border-control{.clll-${l}__input{border-radius:0}}}}}`), s && (D = r`&.clll-${l}--disabled{cursor:default;.clll-${l}__input-container{border-color:${g};.clll-${l}__input{&:disabled{border-color:${g};background-color:${C};color:${o};&::placeholder{color:${o};}}}}}`), a && (T = r`&.clll-${l}--readonly{cursor:not-allowed;.clll-${l}__input-container{border-color:${g};pointer-events:none;.clll-${l}__input{&:read-only{border-color:${g};background-color:${C};color:${o};&::placeholder{color:${o};}}}}}`), c === n.Ghost && (F = r`&.clll-${l}{&.clll-${l}--ghost,&.clll-input.clll-input--rounded.clll-${l}--ghost{.clll-${l}__input-container,.clll-${l}__input{background-color:#fff0;border:0;padding:0;border-radius:0;&:focus,&:focus-within{outline:none;}}}}&.clll-${l}--grouped{background-color:#fff0;border:0}`);
+  const V = r`&.clll-${l}--haslabel{.clll-${l}__label{.clll-text{&.clll-${l}__label--required::after{${z()}}}}}.clll-${l}__input-container{background-color:${$};border-color:${u};.clll-${l}__input{${q({ backgroundColor: $, borderColor: u, placeholderColor: o })}${M({ borderColor: _, shadowColor: k, outlineWidth: "2px", shadowWidth: "--clll-unit-0" })}color:${v}}}&.clll-input--hascustomprefix,&.clll-input--hascustomsuffix,&.clll-input--hasiconprefix,&.clll-input--hasiconsuffix,&.clll-input--grouped,&.clll-input--hascharcounter{.clll-${l}__input-container{border-color:${u};border-style:solid;border-width:1px;&:focus-within{outline-color:${_};outline-style:solid;outline-width:2px}.clll-input__input{border:0;outline:none;&:focus{outline:none;box-shadow:none}}}&:not(.clll-input--ghost){.clll-${l}__input-container{&:focus-within{outline-offset:-1px}}}}.clll-${l}__input-prefix,.clll-${l}__input-suffix,.clll-icon{color:${o}}&.clll-input--grouped{.clll-${l}__input-prefix,.clll-${l}__input-suffix,.clll-${l}__char-counter{background-color:${y};color:${o};.clll-icon{color:${o}}}}&.clll-input--file{.clll-input__input-container{.clll-input__input{&::file-selector-button{background-color:${y}}}}}&.clll-input--color{.clll-input__input-container{.clll-input__input-border-control{border-color:${u};border-style:solid;border-width:2px}}&.clll-input--danger{.clll-input__input-border-control{border-color:${u};border-style:solid;border-width:2px}}&.clll-input--warning{.clll-input__input-border-control{border-color:${u};border-style:solid;border-width:2px}}&.clll-input--success{.clll-input__input-border-control{border-color:${u};border-style:solid;border-width:2px}}&.clll-input--disabled{background-color:${$}}&.clll-input--readonly{background-color:${$}}}&.clll-${l}--hascharcounter{.clll-${l}__char-counter{color:${o}}}`;
+  return S(V, p, D, T, F);
+}, Q = ({ color: e }) => {
+  const { colors: l, darkMode: s } = L(), a = s.value ? x.Dark : x.Light, c = w({
+    color: e,
+    colors: l.value,
+    mode: a,
+    variant: n.Outline
+  });
+  return S(r`&.clll-input__message--${e}{color:${c?.textBody};}`);
+}, ol = ({ color: e, disabled: l, variant: s }) => {
+  const { borderRadius: a, colors: c, darkMode: b } = L(), f = b.value ? x.Dark : x.Light, h = w({
+    color: e,
+    colors: c.value,
+    mode: f,
+    variant: n.Solid
+  }), i = w({
+    color: e,
+    colors: c.value,
+    mode: f,
+    variant: n.Outline
+  }), d = b.value ? "black" : "white", t = i?.border, $ = i?.disabled, y = b.value ? "black" : h?.textDisabled, u = i?.focus, g = i?.focus, C = i?.text, _ = i?.focus;
+  let k, v, o;
+  a.value && (k = r`&:not([class*='clll-select--rounded-']){&.clll-select.clll-select--rounded,.clll-select__select-container,&.clll-select.clll-select--rounded .clll-select__select{border-radius:var(--clll-${a.value});}}`), l && (v = r`&.clll-select--disabled{cursor:default;.clll-select__select-container{border-color:${$};.clll-select__select{&:disabled{border-color:${$};background-color:${y};color:${_};&::placeholder{color:${_};}}}}.clll-select__icon{.clll-icon{color:${_};}}}`), s === n.Ghost && (o = r`&.clll-select{&.clll-select--ghost,&.clll-select.clll-select--rounded.clll-select--ghost, .clll-select__select-container, &.clll-select.clll-select--rounded .clll-select__select{.clll-select__select-container,.clll-select__select{background-color:#fff0;border:0;padding-left:0;padding-top:0;padding-bottom:0;border-radius:0;&:focus{outline:none;}}}}`);
+  const p = r`&.clll-select--haslabel{.clll-select__label{text-align:left;.clll-text{&.clll-select__label--required::after{${z()}}}}}.clll-select__select-container{border-color:${t};.clll-select__select{${q({ backgroundColor: d, borderColor: t, placeholderColor: _ })}${M({ borderColor: u, shadowColor: g, outlineWidth: "2px", shadowWidth: "--clll-unit-0" })}color:${C};}.clll-select__icon{.clll-icon{color:${C};}}}
+  `;
+  return S(p, k, v, o);
+}, z = () => {
+  const { colors: e, darkMode: l } = L();
+  return `position:relative;top:var(--clll-unit-1);content:'*';font-size:var(--clll-unit-4_5);font-weight:500;font-family:var(--clll-font-family);-webkit-font-smoothing:antialiased;color:${l.value ? e.value.danger?.["400"] : e.value.danger?.["700"]};text-decoration:unset;margin-inline-start:var(--clll-unit-0_5);box-sizing:content-box;line-height:0;`;
+}, P = "clll-input__message", rl = /* @__PURE__ */ G({
+  __name: "CLInputMessages",
+  props: {
+    id: {},
+    messages: {},
+    messageType: { default: K.Neutral }
+  },
+  setup(e) {
+    return (l, s) => (R(!0), W(A, null, H(e.messages, (a, c) => (R(), W("span", {
+      key: `${e.id}-message-${c}`,
+      class: O([P, `${P}--${e.messageType}`, E(Q)({ color: e.messageType })])
+    }, [
+      I("span", {
+        class: O([`${P}__text`])
+      }, j(a), 3)
+    ], 2))), 128));
+  }
+});
+export {
+  m as _,
+  rl as a,
+  ll as c,
+  el as i,
+  ol as s
+};

package/dist/chunks/CLLink.vue_vue_type_style_index_0_lang-D7BqWIqs.js

@@ -0,0 +1,60 @@
+import { defineComponent as x, computed as C, createElementBlock as k, openBlock as d, normalizeClass as b, unref as l, renderSlot as L, createBlock as $, createCommentVNode as g } from "vue";
+import { _ as h } from "./CLIcon.vue_vue_type_style_index_0_lang-zZ4zGuBt.js";
+import { CLMode as u, CLColors as m, CLColorVariants as v, CLLinkTarget as y, CLIconSizes as B, CLIconNames as p } from "../index.js";
+import { g as w, a as z, f as I, c as T } from "./utils-Dz_31dEE.js";
+import { u as D } from "./base-theme-B89pbWnC.js";
+const H = ({
+  color: e = m.Primary,
+  underline: o = !0
+}) => {
+  const { colors: r, darkMode: n } = D(), a = n.value ? u.Dark : u.Light, t = w({
+    color: e,
+    colors: r.value,
+    mode: a,
+    variant: v.Outline
+  }), i = t?.border, f = t?.textDisabled, c = t?.textBody, s = n.value ? t?.borderHover : t?.textDisabled;
+  return z(T`text-decoration-line:underline;text-decoration-color:${o ? i : "transparent"};display:inline-flex;align-items:center;transition: color 200ms linear, text-decoration-color 200ms linear;color:${c};font-weight:500;background-color:transparent;padding:0;border:0;.clll-text{color:${c};}&:hover{text-decoration-color:${o ? f : "transparent"};background-color:transparent;color:${s};.clll-text{color:${s};}}${I({ borderColor: c ?? "transparent", shadowColor: t?.shadow ?? "transparent", outlineOffset: "2px", shadowWidth: "--clll-unit-0" })}`);
+}, S = ["aria-label", "data-testid", "href", "rel", "target"], P = /* @__PURE__ */ x({
+  name: "CLLink",
+  __name: "CLLink",
+  props: {
+    ariaLabel: {},
+    color: { default: m.Primary },
+    external: { type: Boolean, default: !1 },
+    href: {},
+    onClick: {},
+    rel: { default: "noreferrer noopener" },
+    target: { default: y.Self },
+    testId: { default: "clll-link" },
+    underline: { type: Boolean, default: !0 }
+  },
+  setup(e) {
+    const o = e, r = "clll-link", n = C(() => [
+      r,
+      `${r}--${o.color}`,
+      `${r}--${o.external ? "external" : "internal"}`,
+      o.underline ? `${r}--underline` : `${r}--nounderline`
+    ]);
+    return (a, t) => (d(), k("a", {
+      "aria-label": e.ariaLabel,
+      class: b([l(n), l(H)({ color: e.color, underline: e.underline })]),
+      "data-testid": e.testId,
+      href: e.href,
+      rel: e.external ? e.rel : "",
+      target: e.target,
+      onClick: t[0] || (t[0] = //@ts-ignore
+      (...i) => e.onClick && e.onClick(...i))
+    }, [
+      L(a.$slots, "default"),
+      e.external ? (d(), $(l(h), {
+        key: 0,
+        color: e.color,
+        name: l(p).ExternalLink,
+        size: l(B).Tiny
+      }, null, 8, ["color", "name", "size"])) : g("", !0)
+    ], 10, S));
+  }
+});
+export {
+  P as _
+};

package/dist/chunks/CLNavLink.vue_vue_type_script_setup_true_lang-Dp3SsIfq.js

@@ -0,0 +1,44 @@
+import { defineComponent as i, createBlock as o, openBlock as c, unref as d, withCtx as f, renderSlot as m } from "vue";
+import { _ as u } from "./CLLink.vue_vue_type_style_index_0_lang-D7BqWIqs.js";
+import { CLColors as k } from "../index.js";
+const x = /* @__PURE__ */ i({
+  name: "CLNavLink",
+  __name: "CLNavLink",
+  props: {
+    ariaLabel: {},
+    color: { default: k.Neutral },
+    external: { type: Boolean, default: !1 },
+    href: {},
+    id: {},
+    onClick: {},
+    rel: { default: "noreferrer noopener" },
+    target: {},
+    testId: { default: "clll-navlink" }
+  },
+  emits: ["click"],
+  setup(e, { emit: a }) {
+    const l = e, r = a, n = (t) => {
+      l.onClick && l.onClick(t), r("click", t);
+    };
+    return (t, s) => (c(), o(d(u), {
+      id: e.id,
+      "aria-label": e.ariaLabel,
+      color: e.color,
+      "data-testid": e.testId,
+      external: e.external,
+      href: e.href,
+      rel: e.rel,
+      target: e.target,
+      underline: !e.onClick,
+      onClick: n
+    }, {
+      default: f(() => [
+        m(t.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["id", "aria-label", "color", "data-testid", "external", "href", "rel", "target", "underline"]));
+  }
+});
+export {
+  x as _
+};

package/dist/chunks/CLPill.vue_vue_type_style_index_0_lang-BXGTb6A6.js

@@ -0,0 +1,88 @@
+import { defineComponent as v, computed as d, createElementBlock as i, openBlock as t, Fragment as y, createCommentVNode as o, createBlock as u, normalizeClass as c, unref as a, createElementVNode as s, toDisplayString as r, withCtx as h } from "vue";
+import { _ as b } from "./CLButton.vue_vue_type_style_index_0_lang-CqgySW52.js";
+import { _ as m } from "./CLIcon.vue_vue_type_style_index_0_lang-zZ4zGuBt.js";
+import { CLColorVariants as z, CLColors as B, CLIconSizes as $ } from "../index.js";
+import { p as f } from "./utils-D2P_fCSp.js";
+const L = ["data-testid"], E = /* @__PURE__ */ v({
+  name: "CLPill",
+  __name: "CLPill",
+  props: {
+    color: { default: B.Neutral },
+    count: {},
+    elevated: { type: Boolean, default: !1 },
+    icon: {},
+    label: {},
+    onClick: {},
+    rounded: { type: Boolean, default: !0 },
+    testId: { default: "clll-pill" },
+    variant: { default: z.Soft }
+  },
+  setup(e) {
+    const l = e, n = "clll-pill", C = d(() => [
+      n,
+      `${n}--${l.color}--${l.variant}`,
+      l.count ? `${n}--has-count` : "",
+      l.elevated ? `${n}--elevated` : "",
+      l.icon ? `${n}--has-icon` : `${n}--has-noicon`,
+      l.rounded ? `${n}--rounded` : ""
+    ]), k = d(() => [
+      n,
+      `${n}--clickable`,
+      `${n}--${l.color}--${l.variant}`,
+      l.count ? `${n}--has-count` : "",
+      l.icon ? `${n}--has-icon` : `${n}--has-noicon`,
+      l.rounded ? `${n}--rounded` : ""
+    ]);
+    return (x, I) => (t(), i(y, null, [
+      e.onClick ? o("", !0) : (t(), i("div", {
+        key: 0,
+        class: c([a(C), a(f)({ color: e.color, variant: e.variant })]),
+        "data-testid": e.testId
+      }, [
+        e.icon ? (t(), u(a(m), {
+          key: 0,
+          name: e.icon,
+          size: a($).Tiny
+        }, null, 8, ["name", "size"])) : o("", !0),
+        s("span", {
+          class: c(`${n}__label`)
+        }, r(e.label), 3),
+        e.count ? (t(), i("span", {
+          key: 1,
+          class: c(`${n}__count`)
+        }, r(e.count), 3)) : o("", !0)
+      ], 10, L)),
+      e.onClick ? (t(), u(a(b), {
+        key: 1,
+        color: e.color,
+        "on-click": e.onClick,
+        variant: e.variant,
+        pill: "",
+        rounded: e.rounded
+      }, {
+        default: h(() => [
+          s("div", {
+            class: c([a(k), a(f)({ color: e.color, variant: e.variant })])
+          }, [
+            e.icon ? (t(), u(a(m), {
+              key: 0,
+              name: e.icon,
+              size: a($).Tiny
+            }, null, 8, ["name", "size"])) : o("", !0),
+            s("span", {
+              class: c(`${n}__label`)
+            }, r(e.label), 3),
+            e.count ? (t(), i("span", {
+              key: 1,
+              class: c(`${n}__count`)
+            }, r(e.count), 3)) : o("", !0)
+          ], 2)
+        ]),
+        _: 1
+      }, 8, ["color", "on-click", "variant", "rounded"])) : o("", !0)
+    ], 64));
+  }
+});
+export {
+  E as _
+};

package/dist/chunks/CLProgress.vue_vue_type_style_index_0_lang-5-cwF-oh.js

@@ -0,0 +1,65 @@
+import { defineComponent as p, mergeModels as _, useCssVars as $, useModel as C, computed as d, createElementBlock as n, openBlock as c, normalizeClass as s, unref as t, createCommentVNode as v, createElementVNode as a, createVNode as y, withCtx as g, createTextVNode as V, toDisplayString as x } from "vue";
+import { _ as N } from "./CLText.vue_vue_type_style_index_0_lang-CTc6UiQV.js";
+import { CLTextTypes as B, CLColors as u, CLSizes as L } from "../index.js";
+import { a as b } from "./utils-D2P_fCSp.js";
+const h = ["data-testid"], S = /* @__PURE__ */ p({
+  name: "CLProgress",
+  __name: "CLProgress",
+  props: /* @__PURE__ */ _({
+    color: { default: u.Primary },
+    inverted: { type: Boolean, default: !1 },
+    rounded: { type: Boolean, default: !0 },
+    size: { default: L.Medium },
+    status: { type: Boolean, default: !1 },
+    testId: { default: "clll-progress" }
+  }, {
+    modelValue: { type: Number, default: 0 },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(o) {
+    $((f) => ({
+      v70fa21a0: l.value
+    }));
+    const r = o, l = C(o, "modelValue"), e = "clll-progress", i = d(() => [
+      e,
+      `${e}--${r.color}`,
+      `${e}--${r.size}`,
+      r.inverted ? `${e}--inverted` : "",
+      r.rounded ? `${e}--rounded` : `${e}--not-rounded`
+    ]), m = d(() => `${l.value}%`);
+    return (f, z) => (c(), n("div", {
+      class: s([t(i), t(b)({ color: o.color })]),
+      "data-testid": o.testId
+    }, [
+      o.status ? (c(), n("div", {
+        key: 0,
+        class: s(`${e}__status__container`)
+      }, [
+        a("div", {
+          class: s(`${e}__status__label`)
+        }, [
+          y(t(N), {
+            color: t(u).Neutral,
+            type: t(B).Summary
+          }, {
+            default: g(() => [
+              V(x(t(m)), 1)
+            ]),
+            _: 1
+          }, 8, ["color", "type"])
+        ], 2)
+      ], 2)) : v("", !0),
+      a("div", {
+        class: s(`${e}__bar-container`)
+      }, [
+        a("div", {
+          class: s(`${e}__bar`)
+        }, null, 2)
+      ], 2)
+    ], 10, h));
+  }
+});
+export {
+  S as _
+};

package/dist/chunks/CLSkeleton.vue_vue_type_style_index_0_lang-D7_swcoA.js

@@ -0,0 +1,33 @@
+import { defineComponent as a, useCssVars as r, computed as i, createElementBlock as u, openBlock as c, normalizeClass as m, unref as n, createElementVNode as f } from "vue";
+import { s as p } from "./utils-DaKwZixu.js";
+const k = ["data-testid"], _ = /* @__PURE__ */ a({
+  name: "CLSkeleton",
+  __name: "CLSkeleton",
+  props: {
+    borderRadius: {},
+    height: { default: "100%" },
+    rounded: { type: Boolean, default: !0 },
+    testId: { default: "clll-skeleton" },
+    width: { default: "100%" }
+  },
+  setup(o) {
+    r((s) => ({
+      v168f558d: s.width,
+      bce73b80: s.height
+    }));
+    const t = o, e = "clll-skeleton", d = i(() => [
+      e,
+      t.borderRadius ? `${e}--${t.borderRadius}` : "",
+      t.rounded ? `${e}--rounded` : `${e}--square`
+    ]);
+    return (s, l) => (c(), u("div", {
+      class: m([n(d), n(p)()]),
+      "data-testid": o.testId
+    }, [...l[0] || (l[0] = [
+      f("div", { class: "clll-skeleton__animation" }, null, -1)
+    ])], 10, k));
+  }
+});
+export {
+  _
+};

package/dist/chunks/CLSpinner.vue_vue_type_style_index_0_lang-CLccujHE.js

@@ -0,0 +1,53 @@
+import { defineComponent as m, computed as n, createElementBlock as r, openBlock as i, normalizeClass as c, unref as l, createElementVNode as a } from "vue";
+import { CLSizes as u, CLPosition as f, CLColors as C, CLAlign as $ } from "../index.js";
+import { a as z } from "./utils-DaKwZixu.js";
+const L = ["data-testid"], h = /* @__PURE__ */ m({
+  name: "CLSpinner",
+  __name: "CLSpinner",
+  props: {
+    align: { default: $.Left },
+    color: { default: C.Primary },
+    position: { default: f.Absolute },
+    size: { default: u.Medium },
+    testId: { default: "clll-spinner" }
+  },
+  setup(o) {
+    const t = o, e = "clll-spinner", p = n(() => [
+      e,
+      `${e}--${t.position}`,
+      `${e}--${t.color}`,
+      `${e}--${t.size}`,
+      `${e}--${t.align}`
+    ]), d = n(() => [
+      `${e}__circle`,
+      `${e}__circle--${t.size}`
+    ]);
+    return (_, s) => (i(), r("div", {
+      class: c([l(p), l(z)({ color: o.color })]),
+      "data-testid": o.testId
+    }, [
+      (i(), r("svg", {
+        class: c(l(d)),
+        xmlns: "http://www.w3.org/2000/svg",
+        fill: "none",
+        viewBox: "0 0 24 24"
+      }, [...s[0] || (s[0] = [
+        a("circle", {
+          style: { opacity: "0.25" },
+          cx: "12",
+          cy: "12",
+          r: "10",
+          stroke: "currentColor",
+          "stroke-width": "4"
+        }, null, -1),
+        a("path", {
+          fill: "currentColor",
+          d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+        }, null, -1)
+      ])], 2))
+    ], 10, L));
+  }
+});
+export {
+  h as _
+};

package/dist/chunks/CLText.vue_vue_type_style_index_0_lang-CTc6UiQV.js

@@ -0,0 +1,46 @@
+import { defineComponent as s, computed as n, createBlock as r, openBlock as f, resolveDynamicComponent as c, normalizeClass as u, unref as o, withCtx as m, renderSlot as i } from "vue";
+import { CLTextTypes as p, CLColors as $, CLAlign as y } from "../index.js";
+import { t as C } from "./utils-DYzsHCvl.js";
+const h = /* @__PURE__ */ s({
+  name: "CLText",
+  __name: "CLText",
+  props: {
+    align: { default: y.Left },
+    as: { default: "p" },
+    bold: { type: Boolean, default: !1 },
+    bolder: { type: Boolean, default: !1 },
+    color: { default: $.Secondary },
+    light: { type: Boolean, default: !1 },
+    medium: { type: Boolean, default: !1 },
+    testId: { default: "clll-text" },
+    truncate: { type: Boolean, default: !1 },
+    type: { default: p.Body }
+  },
+  setup(l) {
+    const t = l, e = "clll-text", a = n(() => [
+      e,
+      `${e}--${t.align}`,
+      `${e}--${t.color}`,
+      `${e}--${t.truncate ? "wrap" : "nowrap"}`,
+      `${e}--${t.type}`,
+      {
+        [`${e}--mediumbold`]: t.medium,
+        [`${e}--light`]: t.light,
+        [`${e}--bold`]: t.bold,
+        [`${e}--bolder`]: t.bolder
+      }
+    ]);
+    return (d, x) => (f(), r(c(l.as), {
+      class: u([o(a), o(C)({ color: l.color })]),
+      "data-testid": l.testId
+    }, {
+      default: m(() => [
+        i(d.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["class", "data-testid"]));
+  }
+});
+export {
+  h as _
+};