@feedmepos/mf-brand-app-builder 0.5.22-dev.1 → 0.5.24-dev.0

package/dist/{ButtonGroup-D_HkX122.js → ButtonGroup-2ilMTPHH.js}

@@ -1,4 +1,4 @@
-import { defineComponent as c, computed as n, resolveComponent as s, openBlock as m, createBlock as d } from "vue";
+import { defineComponent as c, computed as n, resolveComponent as s, createBlock as m, openBlock as d } from "vue";
 import { useI18n as i } from "@feedmepos/mf-common";
 const x = /* @__PURE__ */ c({
   __name: "ButtonGroup",
@@ -16,7 +16,7 @@ const x = /* @__PURE__ */ c({
     ));
     return (e, v) => {
       const a = s("FmButtonGroup");
-      return m(), d(a, {
+      return d(), m(a, {
         "model-value": p.value,
         "onUpdate:modelValue": r,
         items: o.value

package/dist/{CircularProgress-h90pbjU3.js → CircularProgress-DdblYCtV.js}

@@ -1,8 +1,8 @@
-import { openBlock as s, createElementBlock as o, defineComponent as l, createElementVNode as r } from "vue";
+import { createElementBlock as s, openBlock as o, defineComponent as l, createElementVNode as r } from "vue";
 import { _ as n } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const a = {}, _ = { class: "border-b border-fm-color-neutral-gray-100" };
 function d(e, t) {
-  return s(), o("div", _);
+  return o(), s("div", _);
 }
 const g = /* @__PURE__ */ n(a, [["render", d]]), f = { class: "relative" }, i = { class: "h-[18px] w-[18px] flex items-center justify-center" }, p = {
   class: "absolute h-full left-0 top-0 w-full text-fm-color-primary",
@@ -17,9 +17,9 @@ const x = /* @__PURE__ */ l({
     color: { default: "primary" }
   },
   setup(e) {
-    return (t, u) => (s(), o("div", f, [
+    return (t, u) => (o(), s("div", f, [
       r("div", i, [
-        (s(), o("svg", p, [
+        (o(), s("svg", p, [
           r("circle", {
             class: "spinner",
             "stroke-width": c[t.size],

package/dist/ColorPicker-RKWzhLBO.js

@@ -0,0 +1,543 @@
+import { defineComponent as ue, useTemplateRef as he, ref as pe, reactive as fe, computed as O, watch as ve, onMounted as de, onBeforeUnmount as me, createElementBlock as w, openBlock as x, normalizeStyle as R, unref as be, createElementVNode as h, createCommentVNode as J, renderSlot as N, createTextVNode as Q, Fragment as ge, renderList as we, toDisplayString as xe } from "vue";
+function A(e, t, a) {
+  return Math.max(t, Math.min(e, a));
+}
+function ye(e, t) {
+  if (typeof e == "string" || typeof t == "string")
+    return e === t;
+  for (const a in e)
+    if (e[a] !== t[a])
+      return !1;
+  return !0;
+}
+function F(e) {
+  const t = [], a = e.length > 5 ? 2 : 1;
+  for (let o = 1; o < e.length; o += a) {
+    const l = e.substring(o, o + a).repeat(a % 2 + 1), f = parseInt(l, 16);
+    t.push(o === 3 * a + 1 ? f / 255 : f);
+  }
+  return t.length === 3 && t.push(1), {
+    r: t[0],
+    g: t[1],
+    b: t[2],
+    a: t[3]
+  };
+}
+function te(e) {
+  const t = e.l / 100, a = t + e.s / 100 * Math.min(t, 1 - t), o = a === 0 ? 0 : 200 * (1 - t / a);
+  return {
+    h: e.h,
+    s: o,
+    v: a * 100,
+    a: e.a
+  };
+}
+function L(e) {
+  let t = e.h % 360;
+  t < 0 && (t += 360);
+  const a = e.s / 100, o = e.l / 100;
+  return {
+    r: B(0, t, a, o) * 255,
+    g: B(8, t, a, o) * 255,
+    b: B(4, t, a, o) * 255,
+    a: e.a
+  };
+}
+function B(e, t, a, o) {
+  const l = (e + t / 30) % 12, f = a * Math.min(o, 1 - o);
+  return o - f * Math.max(-1, Math.min(l - 3, 9 - l, 1));
+}
+function ne(e) {
+  const t = e.s / 100, a = e.v / 100, o = a * (1 - t / 2);
+  return {
+    h: e.h,
+    s: o === 0 || o === 1 ? 0 : (a - o) / Math.min(o, 1 - o) * 100,
+    l: o * 100,
+    a: e.a
+  };
+}
+function re(e) {
+  return {
+    h: e.h,
+    w: e.v * (100 - e.s) / 100,
+    b: 100 - e.v,
+    a: e.a
+  };
+}
+function C(e) {
+  return L(ne(e));
+}
+function y(e) {
+  const t = e.w / 100, a = e.b / 100;
+  let o, l;
+  const f = t + a;
+  return f >= 1 ? (o = 0, l = t / f) : (l = 1 - a, o = (1 - t / l) * 100), {
+    h: e.h,
+    s: o,
+    v: l * 100,
+    a: e.a
+  };
+}
+function S(e) {
+  const { r: t, g: a, b: o, a: l } = e, f = Math.min(t, a, o), v = Math.max(t, a, o), p = v - f, u = (v + f) / 2;
+  let c = 0;
+  p !== 0 && (v === t ? c = (a - o) / p + (a < o ? 6 : 0) : v === a ? c = (o - t) / p + 2 : v === o && (c = (t - a) / p + 4), c *= 60);
+  let I = 0;
+  return u !== 0 && u !== 255 && (I = (v - u) / Math.min(u, 255 - u)), {
+    h: c,
+    s: I * 100,
+    l: u / 255 * 100,
+    a: l
+  };
+}
+function E(e) {
+  return "#" + Object.values(e).map((t, a) => Math.round(a === 3 ? t * 255 : t).toString(16).padStart(2, "0")).join("");
+}
+function k(e) {
+  return re(te(S(e)));
+}
+const $e = {
+  hex: {
+    hex: (e) => e,
+    hsl: (e) => S(F(e)),
+    hsv: (e) => y(k(F(e))),
+    hwb: (e) => k(F(e)),
+    rgb: F
+  },
+  hsl: {
+    hex: (e) => E(L(e)),
+    hsl: (e) => e,
+    hsv: te,
+    hwb: (e) => k(L(e)),
+    rgb: L
+  },
+  hsv: {
+    hex: (e) => E(C(e)),
+    hsl: ne,
+    hsv: (e) => e,
+    hwb: re,
+    rgb: C
+  },
+  hwb: {
+    hex: (e) => E(C(y(e))),
+    hsl: (e) => S(C(y(e))),
+    hsv: y,
+    hwb: (e) => e,
+    rgb: (e) => C(y(e))
+  },
+  rgb: {
+    hex: E,
+    hsl: S,
+    hsv: (e) => y(k(e)),
+    hwb: k,
+    rgb: (e) => e
+  }
+};
+function Ne(e, t, a) {
+  return $e[e][t](a);
+}
+function Ce(e, t) {
+  const a = e.toFixed(t);
+  return a.includes(".") ? a.replace(/\.?0+$/, "") : a;
+}
+const ke = {
+  deg: 1,
+  grad: 0.9,
+  rad: 180 / Math.PI,
+  turn: 360
+}, T = {
+  from(e) {
+    return e.endsWith("%") ? $.from(e, { referenceValue: 1 }) : b.from(e, { min: 0, max: 1 });
+  },
+  to(e) {
+    return b.to(e);
+  }
+}, Z = {
+  from(e) {
+    const t = e.match(/deg|g?rad|turn$/);
+    if (t === null)
+      return b.from(e);
+    const a = t[0];
+    return b.from(e.slice(0, -a.length)) * ke[a];
+  },
+  to(e) {
+    return b.to(e);
+  }
+}, b = {
+  from(e, { min: t = Number.NEGATIVE_INFINITY, max: a = Number.POSITIVE_INFINITY } = {}) {
+    return e.endsWith(".") ? NaN : A(Number(e), t, a);
+  },
+  to(e) {
+    return Ce(e, 2);
+  }
+}, $ = {
+  from(e, { referenceValue: t = 100, min: a = 0, max: o = 100 } = {}) {
+    return e.endsWith("%") ? b.from(e.slice(0, -1), { min: a, max: o }) * t / 100 : NaN;
+  },
+  to(e) {
+    return b.to(e) + "%";
+  }
+}, P = {
+  from(e) {
+    return e.endsWith("%") ? $.from(e, { referenceValue: 255 }) : b.from(e, { min: 0, max: 255 });
+  },
+  to(e) {
+    return b.to(e);
+  }
+}, Ae = {
+  hsl: {
+    h: Z,
+    s: $,
+    l: $
+  },
+  hwb: {
+    h: Z,
+    w: $,
+    b: $
+  },
+  rgb: {
+    r: P,
+    g: P,
+    b: P
+  }
+};
+function j(e, t) {
+  return Ae[e][t];
+}
+function K({ format: e, color: t }, a) {
+  if (e === "hex")
+    return a && [5, 9].includes(t.length) ? t.substring(0, t.length - (t.length - 1) / 4) : t;
+  const o = Object.entries(t).slice(0, a ? 3 : 4).map(([l, f]) => {
+    const v = l === "a" ? T : j(e, l);
+    return (l === "a" ? "/ " : "") + v.to(f);
+  });
+  return `${e}(${o.join(" ")})`;
+}
+function ae(e) {
+  return /^#(?:(?:[A-F0-9]{2}){3,4}|[A-F0-9]{3,4})$/i.test(e);
+}
+function Ie(e) {
+  return "r" in e ? "rgb" : "w" in e ? "hwb" : "v" in e ? "hsv" : "s" in e ? "hsl" : null;
+}
+const ee = {
+  hsl: ["h", "s", "l", "a"],
+  hwb: ["h", "w", "b", "a"],
+  rgb: ["r", "g", "b", "a"]
+};
+function Me(e) {
+  if (typeof e != "string") {
+    const p = Ie(e);
+    return p === null ? null : { format: p, color: e };
+  }
+  if (e.startsWith("#"))
+    return ae(e) ? { format: "hex", color: e } : null;
+  if (!e.includes("(")) {
+    const p = document.createElement("canvas").getContext("2d");
+    p.fillStyle = e;
+    const u = p.fillStyle;
+    return u === "#000000" && e !== "black" ? null : { format: "hex", color: u };
+  }
+  const [t, a] = e.split("("), o = t.substring(0, 3);
+  if (!(o in ee))
+    return null;
+  const l = a.replace(/[,/)]/g, " ").replace(/\s+/g, " ").trim().split(" ");
+  l.length === 3 && l.push("1");
+  const f = ee[o], v = Object.fromEntries(f.map((p, u) => {
+    const c = p === "a" ? T : j(o, p);
+    return [
+      p,
+      c.from(l[u])
+    ];
+  }));
+  return { format: o, color: v };
+}
+function Fe(e, t, a) {
+  const o = e.getBoundingClientRect(), l = t - o.left, f = a - o.top;
+  return {
+    x: o.width === 0 ? 0 : A(l / o.width * 100, 0, 100),
+    y: o.height === 0 ? 0 : A((1 - f / o.height) * 100, 0, 100)
+  };
+}
+const Ee = { class: "vacp-range-input-group" }, Le = ["for"], Se = { class: "vacp-range-input-label-text vacp-range-input-label-text--hue" }, Te = ["id", "value"], je = ["for"], Ve = { class: "vacp-range-input-label-text vacp-range-input-label-text--alpha" }, ze = ["id", "value"], De = { class: "vacp-actions" }, Oe = { class: "vacp-color-inputs" }, Re = { class: "vacp-color-input-group" }, Be = ["for"], Pe = ["id", "value"], Ke = ["id", "for", "onInput"], He = { class: "vacp-color-input-label-text" }, We = ["id", "value", "onInput"], _e = /* @__PURE__ */ ue({
+  __name: "ColorPicker",
+  props: {
+    color: { default: "#ffffffff" },
+    copy: { type: Function, default: void 0 },
+    id: { default: "color-picker" },
+    visibleFormats: { default: () => ["hex", "hsl", "hwb", "rgb"] },
+    defaultFormat: { default: "hsl" },
+    alphaChannel: { default: "show" }
+  },
+  emits: ["color-change", "color-copy"],
+  setup(e, { expose: t, emit: a }) {
+    const o = ["hex", "hsl", "hsv", "hwb", "rgb"], l = e, f = a;
+    t({
+      copyColor: X,
+      switchFormat: H
+    });
+    const v = he("colorSpaceRef");
+    let p = !1;
+    const u = pe(l.visibleFormats.includes(l.defaultFormat) ? l.defaultFormat : l.visibleFormats[0]), c = fe({
+      hex: "#ffffffff",
+      hsl: { h: 0, s: 0, l: 100, a: 1 },
+      hsv: { h: 0, s: 0, v: 100, a: 1 },
+      hwb: { h: 0, w: 100, b: 0, a: 1 },
+      rgb: { r: 255, g: 255, b: 255, a: 1 }
+    }), I = O(function() {
+      const r = u.value, n = c[r];
+      return r.split("").map((i) => {
+        const s = n[i];
+        return {
+          value: j(r, i).to(s),
+          channel: i,
+          label: i.toUpperCase()
+        };
+      }).concat(l.alphaChannel === "show" ? [{
+        value: T.to(n.a),
+        channel: "a",
+        label: "Alpha"
+      }] : []);
+    }), oe = O(function() {
+      return l.alphaChannel === "hide" && [5, 9].includes(c.hex.length) ? c.hex.substring(0, c.hex.length - (c.hex.length - 1) / 4) : c.hex;
+    }), V = O(function() {
+      return c.hsv;
+    });
+    ve(() => l.color, Y), de(function() {
+      document.addEventListener("pointermove", z, { passive: !1 }), document.addEventListener("touchmove", D, { passive: !1 }), document.addEventListener("pointerup", M), document.addEventListener("touchend", M), Y(l.color);
+    }), me(function() {
+      document.removeEventListener("pointermove", z), document.removeEventListener("touchmove", D), document.removeEventListener("pointerup", M), document.removeEventListener("touchend", M);
+    });
+    function H() {
+      const r = (l.visibleFormats.findIndex((n) => n === u.value) + 1) % l.visibleFormats.length;
+      u.value = l.visibleFormats[r];
+    }
+    function le(r) {
+      p = !0, z(r);
+    }
+    function se(r) {
+      p = !0, D(r);
+    }
+    function M() {
+      p = !1;
+    }
+    function z(r) {
+      r.buttons !== 1 || !p || !(v.value instanceof HTMLElement) || W(v.value, r.clientX, r.clientY);
+    }
+    function D(r) {
+      if (!p || !(v.value instanceof HTMLElement))
+        return;
+      r.preventDefault();
+      const n = r.touches[0];
+      W(v.value, n.clientX, n.clientY);
+    }
+    function W(r, n, i) {
+      const s = Fe(r, n, i), d = Object.assign({}, c.hsv);
+      d.s = s.x, d.v = s.y, g("hsv", d);
+    }
+    function ie(r) {
+      if (!["ArrowUp", "ArrowRight", "ArrowDown", "ArrowLeft"].includes(r.key))
+        return;
+      r.preventDefault();
+      const n = ["ArrowLeft", "ArrowDown"].includes(r.key) ? -1 : 1, i = ["ArrowLeft", "ArrowRight"].includes(r.key) ? "s" : "v", s = r.shiftKey ? 10 : 1, d = c.hsv[i] + n * s, m = Object.assign({}, c.hsv);
+      m[i] = A(d, 0, 100), g("hsv", m);
+    }
+    function Y(r) {
+      const n = Me(r);
+      n !== null && g(n.format, n.color);
+    }
+    function _(r, n) {
+      const i = r.currentTarget, s = Object.assign({}, c.hsv);
+      s[n] = Number(i.value), g("hsv", s);
+    }
+    function ce(r) {
+      const n = r.target;
+      ae(n.value) && g("hex", n.value);
+    }
+    function U(r, n) {
+      const i = r.target, s = u.value, d = Object.assign({}, c[s]), m = (n === "a" ? T : j(s, n)).from(i.value);
+      Number.isNaN(m) || (d[n] = m, g(s, d));
+    }
+    function g(r, n) {
+      let i = n;
+      if (l.alphaChannel === "hide")
+        if (typeof n != "string")
+          n.a = 1, i = n;
+        else if ([5, 9].includes(n.length)) {
+          const s = (n.length - 1) / 4;
+          i = n.substring(0, n.length - s) + "f".repeat(s);
+        } else [4, 7].includes(n.length) && (i = n + "f".repeat((n.length - 1) / 3));
+      if (!ye(c[r], i)) {
+        c[r] = i;
+        for (const s of o)
+          s !== r && (c[s] = Ne(r, s, i));
+        f("color-change", G());
+      }
+    }
+    async function X() {
+      const r = c[u.value], n = l.alphaChannel === "hide", i = K({ color: r, format: u.value }, n);
+      await (l.copy ? l.copy : (s) => window.navigator.clipboard.writeText(s))(i), f("color-copy", G());
+    }
+    function G() {
+      const r = l.alphaChannel === "hide", n = K({ color: c[u.value], format: u.value }, r);
+      return {
+        colors: c,
+        cssColor: n
+      };
+    }
+    function q(r) {
+      if (!["ArrowUp", "ArrowRight", "ArrowDown", "ArrowLeft"].includes(r.key) || !r.shiftKey)
+        return;
+      const n = r.currentTarget, i = Number(n.step), s = ["ArrowLeft", "ArrowDown"].includes(r.key) ? -1 : 1, d = Number(n.value) + s * i * 10, m = A(d, Number(n.min), Number(n.max));
+      n.value = String(m - s * i);
+    }
+    return (r, n) => (x(), w("div", {
+      class: "vacp-color-picker",
+      style: R(`--vacp-color: ${be(K)({ format: "hsl", color: c.hsl }, !0)}`)
+    }, [
+      h("div", {
+        ref: "colorSpaceRef",
+        class: "vacp-color-space",
+        style: R(`position: relative; background: linear-gradient(to top, #000, transparent), linear-gradient(to right, #fff, transparent); background-color: hsl(${V.value.h} 100% 50%)`),
+        onPointerdown: le,
+        onTouchstart: se
+      }, [
+        h("div", {
+          ref: "thumb",
+          class: "vacp-color-space-thumb",
+          tabindex: "0",
+          "aria-label": "Color space thumb",
+          style: R(`box-sizing: border-box; position: absolute; left: ${V.value.s}%; bottom: ${V.value.v}%;`),
+          onKeydown: ie
+        }, null, 36)
+      ], 36),
+      h("div", Ee, [
+        h("label", {
+          class: "vacp-range-input-label vacp-range-input-label--hue",
+          for: `${r.id}-hue-slider`
+        }, [
+          h("span", Se, [
+            N(r.$slots, "hue-range-input-label", {}, () => [
+              n[2] || (n[2] = Q("Hue", -1))
+            ])
+          ]),
+          h("input", {
+            id: `${r.id}-hue-slider`,
+            class: "vacp-range-input vacp-range-input--hue",
+            value: c.hsv.h,
+            type: "range",
+            min: "0",
+            max: "360",
+            step: "1",
+            onKeydownPassive: q,
+            onInput: n[0] || (n[0] = (i) => _(i, "h"))
+          }, null, 40, Te)
+        ], 8, Le),
+        r.alphaChannel === "show" ? (x(), w("label", {
+          key: 0,
+          class: "vacp-range-input-label vacp-range-input-label--alpha",
+          for: `${r.id}-alpha-slider`
+        }, [
+          h("span", Ve, [
+            N(r.$slots, "alpha-range-input-label", {}, () => [
+              n[3] || (n[3] = Q("Alpha", -1))
+            ])
+          ]),
+          h("input", {
+            id: `${r.id}-alpha-slider`,
+            class: "vacp-range-input vacp-range-input--alpha",
+            value: c.hsv.a,
+            type: "range",
+            min: "0",
+            max: "1",
+            step: "0.01",
+            onKeydownPassive: q,
+            onInput: n[1] || (n[1] = (i) => _(i, "a"))
+          }, null, 40, ze)
+        ], 8, je)) : J("", !0)
+      ]),
+      h("div", De, [
+        h("button", {
+          class: "vacp-copy-button",
+          type: "button",
+          onClick: X
+        }, [
+          N(r.$slots, "copy-button", {}, () => [
+            n[4] || (n[4] = h("span", { class: "vacp-visually-hidden" }, "Copy color", -1)),
+            n[5] || (n[5] = h("svg", {
+              class: "vacp-icon",
+              xmlns: "http://www.w3.org/2000/svg",
+              "aria-hidden": "true",
+              width: "24",
+              height: "24",
+              viewBox: "0 0 32 32"
+            }, [
+              h("path", {
+                d: "M25.313 28v-18.688h-14.625v18.688h14.625zM25.313 6.688c1.438 0 2.688 1.188 2.688 2.625v18.688c0 1.438-1.25 2.688-2.688 2.688h-14.625c-1.438 0-2.688-1.25-2.688-2.688v-18.688c0-1.438 1.25-2.625 2.688-2.625h14.625zM21.313 1.313v2.688h-16v18.688h-2.625v-18.688c0-1.438 1.188-2.688 2.625-2.688h16z",
+                fill: "currentColor"
+              })
+            ], -1))
+          ])
+        ]),
+        N(r.$slots, "actions")
+      ]),
+      h("div", Oe, [
+        h("div", Re, [
+          u.value === "hex" ? (x(), w("label", {
+            key: 0,
+            class: "vacp-color-input-label",
+            for: `${r.id}-color-hex`
+          }, [
+            n[6] || (n[6] = h("span", { class: "vacp-color-input-label-text" }, " Hex ", -1)),
+            h("input", {
+              id: `${r.id}-color-hex`,
+              class: "vacp-color-input",
+              type: "text",
+              value: oe.value,
+              onInput: ce
+            }, null, 40, Pe)
+          ], 8, Be)) : (x(!0), w(ge, { key: 1 }, we(I.value, ({ value: i, channel: s, label: d }) => (x(), w("label", {
+            id: `${r.id}-color-${u.value}-${s}-label`,
+            key: `${r.id}-color-${u.value}-${s}-label`,
+            class: "vacp-color-input-label",
+            for: `${r.id}-color-${u.value}-${s}`,
+            onInput: (m) => U(m, s)
+          }, [
+            h("span", He, xe(d), 1),
+            h("input", {
+              id: `${r.id}-color-${u.value}-${s}`,
+              class: "vacp-color-input",
+              type: "text",
+              value: i,
+              onInput: (m) => U(m, s)
+            }, null, 40, We)
+          ], 40, Ke))), 128))
+        ]),
+        r.visibleFormats.length > 1 ? (x(), w("button", {
+          key: 0,
+          class: "vacp-format-switch-button",
+          type: "button",
+          onClick: H
+        }, [
+          N(r.$slots, "format-switch-button", {}, () => [
+            n[7] || (n[7] = h("span", { class: "vacp-visually-hidden" }, "Switch format", -1)),
+            n[8] || (n[8] = h("svg", {
+              class: "vacp-icon",
+              "aria-hidden": "true",
+              xmlns: "http://www.w3.org/2000/svg",
+              width: "16",
+              height: "15"
+            }, [
+              h("path", {
+                d: "M8 15l5-5-1-1-4 2-4-2-1 1zm4-9l1-1-5-5-5 5 1 1 4-2z",
+                fill: "currentColor"
+              })
+            ], -1))
+          ])
+        ])) : J("", !0)
+      ])
+    ], 4));
+  }
+});
+export {
+  _e as B
+};

package/dist/{ColorPicker-I6CkNIxt.js → ColorPicker-dVFIiu94.js}

@@ -1,6 +1,6 @@
-import { defineComponent as x, ref as b, watch as w, resolveComponent as m, openBlock as y, createBlock as h, withCtx as d, createVNode as i, createTextVNode as F, createElementVNode as r, createElementBlock as C, Fragment as B, renderList as V, normalizeClass as $, normalizeStyle as k, toDisplayString as P, computed as S, unref as D } from "vue";
-import { K as E } from "./ColorPicker-CHzKbuCD.js";
-const L = { class: "grid grid-cols-4 place-items-center items-start gap-16 flex-wrap pb-24" }, N = { class: "flex flex-col items-center" }, z = ["onClick"], K = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary text-center" }, R = { class: "w-full flex gap-8 justify-end items-center" }, T = /* @__PURE__ */ x({
+import { defineComponent as x, ref as b, watch as w, resolveComponent as m, createBlock as h, openBlock as y, withCtx as d, createElementVNode as r, createVNode as i, createElementBlock as C, Fragment as B, renderList as F, normalizeClass as V, normalizeStyle as k, toDisplayString as $, createTextVNode as P, computed as S, unref as D } from "vue";
+import { B as E } from "./ColorPicker-RKWzhLBO.js";
+const L = { class: "grid grid-cols-4 place-items-center items-start gap-16 flex-wrap pb-24" }, N = { class: "flex flex-col items-center" }, z = ["onClick"], R = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary text-center" }, T = { class: "w-full flex gap-8 justify-end items-center" }, U = /* @__PURE__ */ x({
   __name: "LinkBrandkitColor",
   props: {
     color: {}
@@ -46,16 +46,16 @@ const L = { class: "grid grid-cols-4 place-items-center items-start gap-16 flex-
           })
         ]),
         "dialog-header": d(() => t[3] || (t[3] = [
-          F(" Link with brandkit color ")
+          P(" Link with brandkit color ")
         ])),
         default: d(() => [
           r("div", L, [
-            (y(), C(B, null, V(e, (n) => {
+            (y(), C(B, null, F(e, (n) => {
               var g, _;
               return r("div", N, [
                 r("div", {
-                  onClick: (q) => a.value = n,
-                  class: $(["p-[2px] border-1 rounded-sm", {
+                  onClick: (I) => a.value = n,
+                  class: V(["p-[2px] border-1 rounded-sm", {
                     "border-fm-color-primary": (g = a.value) == null ? void 0 : g.includes(n),
                     "border-fm-color-neutral-gray-200": !((_ = a.value) != null && _.includes(n))
                   }])
@@ -65,13 +65,13 @@ const L = { class: "grid grid-cols-4 place-items-center items-start gap-16 flex-
                     style: k({ backgroundColor: `var(${n})` })
                   }, null, 4)
                 ], 10, z),
-                r("div", K, P(n.replace("--brand-color-", "").replace(/-/g, " ")), 1)
+                r("div", R, $(n.replace("--brand-color-", "").replace(/-/g, " ")), 1)
               ]);
             }), 64))
           ])
         ]),
         "dialog-footer": d(() => [
-          r("div", R, [
+          r("div", T, [
             i(u, {
               variant: "secondary",
               label: "Close",
@@ -87,7 +87,7 @@ const L = { class: "grid grid-cols-4 place-items-center items-start gap-16 flex-
       }, 8, ["modelValue"]);
     };
   }
-}), U = { class: "flex items-center gap-8" }, j = { class: "shadow-lg rounded-lg p-8" }, A = /* @__PURE__ */ x({
+}), j = { class: "flex items-center gap-8" }, q = { class: "shadow-lg rounded-lg p-8" }, G = /* @__PURE__ */ x({
   __name: "ColorPicker",
   props: {
     context: {}
@@ -108,7 +108,7 @@ const L = { class: "grid grid-cols-4 place-items-center items-start gap-16 flex-
     });
     return (e, o) => {
       const t = m("FmButton"), u = m("FmPopover");
-      return y(), C("div", U, [
+      return y(), C("div", j, [
         i(u, null, {
           "popover-button": d(() => [
             r("div", {
@@ -124,7 +124,7 @@ const L = { class: "grid grid-cols-4 place-items-center items-start gap-16 flex-
             ], 512)
           ]),
           default: d(() => [
-            r("div", j, [
+            r("div", q, [
               i(D(E), {
                 copy: s,
                 onColorCopy: o[0] || (o[0] = (c) => s(c.cssColor)),
@@ -146,7 +146,7 @@ const L = { class: "grid grid-cols-4 place-items-center items-start gap-16 flex-
           ]),
           _: 1
         }),
-        i(T, {
+        i(U, {
           color: l.context._value || "#ffffff00",
           onUpdate: o[2] || (o[2] = (c) => a(c))
         }, null, 8, ["color"])
@@ -155,5 +155,5 @@ const L = { class: "grid grid-cols-4 place-items-center items-start gap-16 flex-
   }
 });
 export {
-  A as default
+  G as default
 };

package/dist/{Icon.vue_vue_type_style_index_0_lang-CVCHCcWR.js → Icon.vue_vue_type_style_index_0_lang-BcRjQndc.js}

@@ -1,4 +1,4 @@
-import { defineComponent as n, openBlock as o, createElementBlock as l, normalizeClass as a, toDisplayString as r } from "vue";
+import { defineComponent as n, createElementBlock as o, openBlock as l, normalizeClass as a, toDisplayString as r } from "vue";
 const i = /* @__PURE__ */ n({
   __name: "Icon",
   props: {
@@ -6,7 +6,7 @@ const i = /* @__PURE__ */ n({
     filled: { type: Boolean, default: !1 }
   },
   setup(s) {
-    return (e, t) => (o(), l("span", {
+    return (e, t) => (l(), o("span", {
       class: a(["material-symbols-rounded", `icon-${e.filled ? "filled" : "rounded"}`])
     }, r(e.name), 3));
   }