@bobbykim/mcl-cards 0.10.4 → 0.10.6

package/dist/mcl-cards.js

@@ -1,11 +1,11 @@
-(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode('.perspective[data-v-eac7e2f0]{-webkit-perspective:1800px;perspective:1800px}.card[data-v-eac7e2f0]{-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transform:rotateY(0deg);transform:rotateY(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.flip-card[data-v-eac7e2f0]{-webkit-transform:rotateY(360deg);transform:rotateY(360deg)}.card[data-v-8bf2cac0]{background-size:cover;background-position:center center;background-repeat:no-repeat;padding:var(--border-width);background:conic-gradient(from var(--border-angle, 0deg),var(--tw-gradient-from) var(--tw-gradient-from-position),var(--tw-gradient-via),var(--tw-gradient-to));animation:bg-spin-8bf2cac0 4s linear infinite}@keyframes bg-spin-8bf2cac0{0%{--border-angle: 0deg}to{--border-angle: 360deg}}.card[data-v-8bf2cac0]:hover{animation-play-state:paused}@property --border-angle{syntax: "<angle>"; inherits: false; initial-value: 0deg;}')),document.head.appendChild(e)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}})();
-import { defineComponent as L, useSlots as T, computed as g, openBlock as m, createElementBlock as C, normalizeClass as c, createElementVNode as s, createCommentVNode as x, unref as S, withModifiers as j, renderSlot as A, toDisplayString as B, ref as z, normalizeStyle as $ } from "vue";
+(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode('.perspective[data-v-2c67f772]{-webkit-perspective:1800px;perspective:1800px}.card[data-v-2c67f772]{-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transform:rotateY(0deg);transform:rotateY(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.flip-card[data-v-2c67f772]{-webkit-transform:rotateY(360deg);transform:rotateY(360deg)}.card[data-v-b6e2475b]{background-size:cover;background-position:center center;background-repeat:no-repeat;padding:var(--border-width);background:conic-gradient(from var(--border-angle, 0deg),var(--tw-gradient-from) var(--tw-gradient-from-position),var(--tw-gradient-via),var(--tw-gradient-to));animation:bg-spin-b6e2475b 4s linear infinite}@keyframes bg-spin-b6e2475b{0%{--border-angle: 0deg}to{--border-angle: 360deg}}.card[data-v-b6e2475b]:hover{animation-play-state:paused}@property --border-angle{syntax: "<angle>"; inherits: false; initial-value: 0deg;}')),document.head.appendChild(e)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}})();
+import { defineComponent as L, computed as g, openBlock as m, createElementBlock as C, normalizeClass as c, createElementVNode as s, createCommentVNode as x, unref as V, withModifiers as S, renderSlot as T, toDisplayString as B, ref as M, normalizeStyle as z } from "vue";
 import { generateClass as i } from "@bobbykim/manguito-theme";
-import { getGlassmorphismClass as E } from "@bobbykim/manguito-theme/util";
-const O = {
+import { getGlassmorphismClass as $ } from "@bobbykim/manguito-theme/util";
+const E = {
   key: 0,
   class: "relative"
-}, D = ["src", "alt"], I = ["innerHTML"], W = { class: "flex h-full flex-col justify-between" }, G = { class: "flex-1 px-xs pt-sm" }, q = ["innerHTML"], N = ["innerHTML"], F = { class: "w-full px-xs" }, R = ["href", "target"], ot = /* @__PURE__ */ L({
+}, O = ["src", "alt"], D = ["innerHTML"], I = { class: "flex h-full flex-col justify-between" }, W = { class: "flex-1 px-xs pt-sm" }, G = ["innerHTML"], q = ["innerHTML"], N = { class: "w-full px-xs" }, F = ["href", "target"], lt = /* @__PURE__ */ L({
   __name: "MclCardA",
   props: {
     title: {},
@@ -38,30 +38,28 @@ const O = {
   },
   emits: ["card-click", "card-btn-click"],
   setup(t, { emit: v }) {
-    const n = t;
-    T();
-    const u = v, b = g(() => {
+    const n = t, u = v, b = g(() => {
       const {
         borderColor: e,
         bgColor: l,
         rounded: a,
-        enlargeOnHover: o,
+        enlargeOnHover: r,
         showShadow: k,
-        glass: f,
+        glass: h,
         glassBlur: p,
-        glassOpacity: V,
-        fullWidth: M
+        glassOpacity: A,
+        fullWidth: H
       } = n;
       return [
         i.borderColorVariant({ color: e }),
         i.bgColorVariant({ color: l }),
-        !M && "max-w-[450px] sm:max-w-[350px]",
+        !H && "max-w-[450px] sm:max-w-[350px]",
         a ? "rounded-lg" : "rounded-sm",
-        o && "hover:scale-105 transition ease-in duration-300",
+        r && "hover:scale-105 transition ease-in duration-300",
         k && "drop-shadow-md",
-        f && E(l, p, V)
+        h && $(l, p, A)
       ].filter(Boolean).join(" ");
-    }), h = g(() => {
+    }), f = g(() => {
       const { titleSize: e, titleColor: l, showHighlight: a } = n;
       return [
         i.h3Variant({ size: e }),
@@ -81,79 +79,79 @@ const O = {
         a.includes(e) ? "text-black" : "text-white",
         l && "btn-round"
       ].filter(Boolean).join(" ");
-    }), r = (e) => {
-      const { title: l, ctaLink: a, ctaTarget: o, ctaAsLink: k } = n, f = {
+    }), o = (e) => {
+      const { title: l, ctaLink: a, ctaTarget: r, ctaAsLink: k } = n, h = {
         title: l,
         url: a,
-        target: o || "_self"
+        target: r || "_self"
       };
-      !k && e.preventDefault(), u("card-btn-click", e, f);
+      k || e.preventDefault(), u("card-btn-click", e, h);
     }, d = (e) => {
-      const { title: l, ctaLink: a, ctaTarget: o } = n;
+      const { title: l, ctaLink: a, ctaTarget: r } = n;
       u("card-click", e, {
         title: l,
         url: a,
-        target: o || "_self"
+        target: r || "_self"
       });
     };
     return (e, l) => (m(), C("div", {
       class: c(["xs:w-auto flex w-full flex-shrink-0 flex-grow cursor-pointer flex-col overflow-hidden border", b.value]),
       onClick: d
     }, [
-      t.showImage ? (m(), C("div", O, [
+      t.showImage ? (m(), C("div", E, [
         s("img", {
           src: t.imageSource,
           alt: t.imageAlt,
           class: "aspect-video min-w-full object-cover object-top"
-        }, null, 8, D),
+        }, null, 8, O),
         t.showLabel ? (m(), C("span", {
           key: 0,
           class: c(["absolute bottom-0 ml-xs inline-block translate-y-[50%] px-2xs py-3xs text-xs font-bold", y.value]),
           innerHTML: t.labelText
-        }, null, 10, I)) : x("", !0)
+        }, null, 10, D)) : x("", !0)
       ])) : x("", !0),
-      s("div", W, [
-        s("div", G, [
+      s("div", I, [
+        s("div", W, [
           !t.showImage && t.showLabel ? (m(), C("span", {
             key: 0,
             class: c(["mb-2xs inline-block px-2xs py-3xs text-xs font-bold", y.value]),
             innerHTML: t.labelText
-          }, null, 10, q)) : x("", !0),
+          }, null, 10, G)) : x("", !0),
           s("h3", {
-            class: c(h.value),
+            class: c(f.value),
             innerHTML: t.title
-          }, null, 10, N),
+          }, null, 10, q),
           t.showHighlight ? (m(), C("div", {
             key: 1,
-            class: c(["mb-xs h-3xs w-md", S(i).bgColorVariant({ color: t.highlightColor })])
+            class: c(["mb-xs h-3xs w-md", V(i).bgColorVariant({ color: t.highlightColor })])
           }, null, 2)) : x("", !0),
           s("div", {
             class: "mb-sm cursor-default",
-            onClick: l[0] || (l[0] = j(() => {
+            onClick: l[0] || (l[0] = S(() => {
             }, ["stop"]))
           }, [
-            A(e.$slots, "default")
+            T(e.$slots, "default")
           ])
         ]),
         t.showCta ? (m(), C("div", {
           key: 0,
           class: "cursor-default border-0 pb-sm",
-          onClick: l[2] || (l[2] = j(() => {
+          onClick: l[2] || (l[2] = S(() => {
           }, ["stop"]))
         }, [
-          s("div", F, [
+          s("div", N, [
             s("a", {
               href: t.ctaLink,
               target: t.ctaTarget,
               class: c(["btn btn-full", w.value]),
-              onClick: l[1] || (l[1] = (a) => r(a))
-            }, B(t.ctaText), 11, R)
+              onClick: l[1] || (l[1] = (a) => o(a))
+            }, B(t.ctaText), 11, F)
           ])
         ])) : x("", !0)
       ])
     ], 2));
   }
-}), J = ["href", "target"], K = { class: "peer absolute inset-0 z-15 flex flex-col items-start justify-end p-xs transition-opacity duration-200 hover:opacity-100 [@media(hover:hover)]:opacity-0" }, P = ["innerHTML"], Q = ["src", "alt"], rt = /* @__PURE__ */ L({
+}), R = ["href", "target"], J = { class: "peer absolute inset-0 z-15 flex flex-col items-start justify-end p-xs transition-opacity duration-200 hover:opacity-100 [@media(hover:hover)]:opacity-0" }, K = ["innerHTML"], P = ["src", "alt"], ot = /* @__PURE__ */ L({
   __name: "MclCardB",
   props: {
     title: {},
@@ -171,34 +169,30 @@ const O = {
   },
   emits: ["card-click"],
   setup(t, { emit: v }) {
-    const n = t;
-    T();
-    const u = v, b = g(() => {
-      const { borderColor: r, rounded: d } = n, e = [
-        i.borderColorVariant({ color: r })
+    const n = t, u = v, b = g(() => {
+      const { borderColor: o, rounded: d } = n, e = [
+        i.borderColorVariant({ color: o })
       ];
       return e.push(d ? "rounded-md" : "rounded-sm"), e.join(" ");
-    }), h = g(() => {
-      const { showGrayScale: r } = n;
-      return r ? "[@media(hover:hover)]:grayscale peer-hover:grayscale-0" : "";
+    }), f = g(() => {
+      const { showGrayScale: o } = n;
+      return o ? "[@media(hover:hover)]:grayscale peer-hover:grayscale-0" : "";
     }), y = g(() => {
-      const { titleSize: r, titleColor: d, titleBlockColor: e } = n;
+      const { titleSize: o, titleColor: d, titleBlockColor: e } = n;
       return [
-        i.h3Variant({ size: r }),
+        i.h3Variant({ size: o }),
         i.textColorVariant({ color: d }),
         i.bgColorVariant({ color: e })
       ].join(" ");
-    }), w = (r) => {
+    }), w = (o) => {
       const { title: d, ctaLink: e, ctaTarget: l, ctaAsLink: a } = n;
-      !a && r.preventDefault();
-      const o = {
+      a || o.preventDefault(), u("card-click", o, {
         title: d,
         url: e,
         target: l || "_self"
-      };
-      console.log(o), u("card-click", r, o);
+      });
     };
-    return (r, d) => (m(), C("div", {
+    return (o, d) => (m(), C("div", {
       class: c(["xs:w-auto relative w-full max-w-112.5 shrink-0 grow cursor-pointer overflow-hidden border sm:max-w-87.5", b.value])
     }, [
       s("a", {
@@ -206,22 +200,22 @@ const O = {
         target: t.ctaTarget,
         onClick: d[0] || (d[0] = (e) => w(e))
       }, [
-        s("div", K, [
+        s("div", J, [
           s("h3", {
             innerHTML: t.title,
             class: c(["pointer-events-none mb-2xs inline-block px-xs py-2xs tracking-wide", y.value])
-          }, null, 10, P),
-          A(r.$slots, "default")
+          }, null, 10, K),
+          T(o.$slots, "default")
         ]),
         s("img", {
           src: t.imageSource,
           alt: t.imageAlt,
-          class: c(["relative z-10 aspect-3/4 h-full w-full object-cover object-center transition-all duration-200", h.value])
-        }, null, 10, Q)
-      ], 8, J)
+          class: c(["relative z-10 aspect-3/4 h-full w-full object-cover object-center transition-all duration-200", f.value])
+        }, null, 10, P)
+      ], 8, R)
     ], 2));
   }
-}), U = ["src", "alt"], X = /* @__PURE__ */ L({
+}), Q = ["src", "alt"], U = /* @__PURE__ */ L({
   __name: "MclCardC",
   props: {
     imageSource: {},
@@ -237,32 +231,30 @@ const O = {
   },
   emits: ["card-click"],
   setup(t, { emit: v }) {
-    const n = t;
-    T();
-    const u = z(!1), b = v, h = g(() => {
-      const r = [
+    const n = t, u = M(!1), b = v, f = g(() => {
+      const o = [
         i.bgColorVariant({ color: n.cardColor })
       ];
-      return u.value && r.push("flip-card"), r.join(" ");
+      return u.value && o.push("flip-card"), o.join(" ");
     }), y = g(() => {
       const {
-        titleSize: r,
+        titleSize: o,
         titleColor: d,
         showHighlight: e,
         highlightColor: l,
         highlightOpacity: a
-      } = n, o = [
-        i.h3Variant({ size: r }),
+      } = n, r = [
+        i.h3Variant({ size: o }),
         i.textColorVariant({ color: d })
       ];
-      return e && (o.push("px-xs py-2xs mb-2xs rounded"), o.push(i.bgColorVariant({ color: l })), o.push(
+      return e && (r.push("px-xs py-2xs mb-2xs rounded"), r.push(i.bgColorVariant({ color: l })), r.push(
         i.bgOpacityVariant({ opacity: a })
-      )), o.join(" ");
-    }), w = (r) => {
-      r.preventDefault(), u.value && b("card-click", r), u.value = !0;
+      )), r.join(" ");
+    }), w = (o) => {
+      o.preventDefault(), u.value && b("card-click", o), u.value = !0;
     };
-    return (r, d) => (m(), C("div", {
-      class: c(["card relative aspect-square max-h-100 overflow-hidden transition duration-1600", h.value]),
+    return (o, d) => (m(), C("div", {
+      class: c(["card relative aspect-square max-h-100 overflow-hidden transition duration-1600", f.value]),
       onClick: w
     }, [
       s("img", {
@@ -272,7 +264,7 @@ const O = {
           u.value ? "opacity-100" : "opacity-0",
           "absolute aspect-square h-full w-full object-cover object-center transition-opacity delay-500 duration-800"
         ])
-      }, null, 10, U),
+      }, null, 10, Q),
       s("div", {
         class: c([
           u.value ? "cursor-pointer opacity-100" : "opacity-0",
@@ -285,16 +277,16 @@ const O = {
         }, [
           s("span", null, B(t.title), 1)
         ], 2)) : x("", !0),
-        A(r.$slots, "card-body", {}, void 0, !0)
+        T(o.$slots, "card-body", {}, void 0, !0)
       ], 2)
     ], 2));
   }
-}), H = (t, v) => {
+}), j = (t, v) => {
   const n = t.__vccOpts || t;
   for (const [u, b] of v)
     n[u] = b;
   return n;
-}, it = /* @__PURE__ */ H(X, [["__scopeId", "data-v-eac7e2f0"]]), Y = { class: "flex flex-col overflow-hidden rounded-md" }, Z = ["src", "alt"], _ = ["href", "target"], tt = /* @__PURE__ */ L({
+}, rt = /* @__PURE__ */ j(U, [["__scopeId", "data-v-2c67f772"]]), X = { class: "flex flex-col overflow-hidden rounded-md" }, Y = ["src", "alt"], Z = ["href", "target"], _ = /* @__PURE__ */ L({
   __name: "MclCardD",
   props: {
     showImage: { type: Boolean, default: !0 },
@@ -375,61 +367,59 @@ const O = {
       black: "to-black",
       white: "to-white",
       transparent: "to-transparent"
-    }, h = t;
-    T();
-    const y = v, w = g(() => {
-      const { titleSize: a, titleColor: o } = h;
+    }, f = t, y = v, w = g(() => {
+      const { titleSize: a, titleColor: r } = f;
       return [
         i.h2Variant({ size: a }),
-        i.textColorVariant({ color: o })
+        i.textColorVariant({ color: r })
       ].join(" ");
-    }), r = g(() => {
-      const { ctaButton: a, ctaButtonColor: o, ctaButtonBlock: k } = h, f = [], p = ["light-1", "light-2", "light-3", "light-4"];
-      return a ? f.push(
+    }), o = g(() => {
+      const { ctaButton: a, ctaButtonColor: r, ctaButtonBlock: k } = f, h = [], p = ["light-1", "light-2", "light-3", "light-4"];
+      return a ? h.push(
         "btn",
-        i.btnColorVariant({ color: o })
-      ) : f.push("mcl-link"), a && k && f.push("btn-full"), a && !p.includes(o) && f.push("text-white"), f.join(" ");
+        i.btnColorVariant({ color: r })
+      ) : h.push("mcl-link"), a && k && h.push("btn-full"), a && !p.includes(r) && h.push("text-white"), h.join(" ");
     }), d = g(() => ({
-      "--border-width": `${h.borderWidth}px`
+      "--border-width": `${f.borderWidth}px`
     })), e = g(() => {
-      const a = n[h.borderColor], o = u[h.gradient1], k = b[h.gradient2];
+      const a = n[f.borderColor], r = u[f.gradient1], k = b[f.gradient2];
       return [
-        i.borderColorVariant({ color: h.borderColor }),
+        i.borderColorVariant({ color: f.borderColor }),
         a,
-        o,
+        r,
         k
       ].join(" ");
     }), l = (a) => {
-      const { title: o, ctaLink: k, ctaLinkTarget: f, ctaAsLink: p } = h, V = {
-        title: o,
+      const { title: r, ctaLink: k, ctaLinkTarget: h, ctaAsLink: p } = f, A = {
+        title: r,
         url: k,
-        target: f || "_self"
+        target: h || "_self"
       };
-      !p && a.preventDefault(), y("card-click", a, V);
+      p || a.preventDefault(), y("card-click", a, A);
     };
-    return (a, o) => (m(), C("div", {
+    return (a, r) => (m(), C("div", {
       class: c(["card xs:w-auto w-full max-w-112.5 shrink-0 grow overflow-hidden rounded-md border from-20% sm:max-w-87.5", e.value]),
-      style: $(d.value)
+      style: z(d.value)
     }, [
-      s("div", Y, [
+      s("div", X, [
         t.showImage ? (m(), C("img", {
           key: 0,
           src: t.imageSource,
           class: "max-h-50 min-w-full object-cover object-top",
           alt: t.imageAlt
-        }, null, 8, Z)) : x("", !0),
+        }, null, 8, Y)) : x("", !0),
         s("div", {
-          class: c(["p-xs", S(i).bgColorVariant({ color: t.bgColor })])
+          class: c(["p-xs", V(i).bgColorVariant({ color: t.bgColor })])
         }, [
           s("h3", {
             class: c(["mb-xs", w.value])
           }, B(t.title), 3),
           t.showHighlight ? (m(), C("div", {
             key: 0,
-            class: c(["mb-xs h-3xs w-md", S(i).bgColorVariant({ color: t.highlightColor })])
+            class: c(["mb-xs h-3xs w-md", V(i).bgColorVariant({ color: t.highlightColor })])
           }, null, 2)) : x("", !0),
           s("div", null, [
-            A(a.$slots, "default", {}, void 0, !0)
+            T(a.$slots, "default", {}, void 0, !0)
           ]),
           s("div", {
             class: c(["mt-xs", { "mb-2xs": !t.ctaButton }])
@@ -437,18 +427,18 @@ const O = {
             s("a", {
               href: t.ctaLink,
               target: t.ctaLinkTarget,
-              class: c(r.value),
+              class: c(o.value),
               onClick: l
-            }, B(t.ctaText), 11, _)
+            }, B(t.ctaText), 11, Z)
           ], 2)
         ], 2)
       ])
     ], 6));
   }
-}), st = /* @__PURE__ */ H(tt, [["__scopeId", "data-v-8bf2cac0"]]);
+}), it = /* @__PURE__ */ j(_, [["__scopeId", "data-v-b6e2475b"]]);
 export {
-  ot as MclCardA,
-  rt as MclCardB,
-  it as MclCardC,
-  st as MclCardD
+  lt as MclCardA,
+  ot as MclCardB,
+  rt as MclCardC,
+  it as MclCardD
 };

package/dist/mcl-cards.umd.cjs

@@ -1,2 +1,2 @@
-(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode('.perspective[data-v-eac7e2f0]{-webkit-perspective:1800px;perspective:1800px}.card[data-v-eac7e2f0]{-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transform:rotateY(0deg);transform:rotateY(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.flip-card[data-v-eac7e2f0]{-webkit-transform:rotateY(360deg);transform:rotateY(360deg)}.card[data-v-8bf2cac0]{background-size:cover;background-position:center center;background-repeat:no-repeat;padding:var(--border-width);background:conic-gradient(from var(--border-angle, 0deg),var(--tw-gradient-from) var(--tw-gradient-from-position),var(--tw-gradient-via),var(--tw-gradient-to));animation:bg-spin-8bf2cac0 4s linear infinite}@keyframes bg-spin-8bf2cac0{0%{--border-angle: 0deg}to{--border-angle: 360deg}}.card[data-v-8bf2cac0]:hover{animation-play-state:paused}@property --border-angle{syntax: "<angle>"; inherits: false; initial-value: 0deg;}')),document.head.appendChild(e)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}})();
-(function(g,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue"),require("@bobbykim/manguito-theme"),require("@bobbykim/manguito-theme/util")):typeof define=="function"&&define.amd?define(["exports","vue","@bobbykim/manguito-theme","@bobbykim/manguito-theme/util"],t):(g=typeof globalThis<"u"?globalThis:g||self,t(g.MclCards={},g.Vue,g.ManguitoTheme,g.ManguitoThemeUtil))})(this,(function(g,t,n,w){"use strict";const B={key:0,class:"relative"},V=["src","alt"],E=["innerHTML"],S={class:"flex h-full flex-col justify-between"},z={class:"flex-1 px-xs pt-sm"},L=["innerHTML"],N=["innerHTML"],A={class:"w-full px-xs"},j=["href","target"],M=t.defineComponent({__name:"MclCardA",props:{title:{},titleSize:{default:"md"},titleColor:{default:"dark-3"},borderColor:{default:"light-3"},bgColor:{default:"light-1"},fullWidth:{type:Boolean,default:!1},glass:{type:Boolean,default:!1},glassBlur:{default:"sm"},glassOpacity:{default:20},showImage:{type:Boolean,default:!0},imageSource:{},imageAlt:{},showCta:{type:Boolean,default:!0},ctaAsLink:{type:Boolean,default:!1},ctaText:{default:"cta text"},ctaColor:{default:"primary"},ctaLink:{default:"#"},ctaTarget:{default:"_self"},showLabel:{type:Boolean,default:!0},labelText:{default:"Lorem ipsum"},labelTextColor:{default:"light-1"},labelColor:{default:"dark-4"},enlargeOnHover:{type:Boolean,default:!1},showHighlight:{type:Boolean,default:!0},highlightColor:{default:"primary"},rounded:{type:Boolean,default:!0},showShadow:{type:Boolean,default:!0}},emits:["card-click","card-btn-click"],setup(e,{emit:C}){const i=e;t.useSlots();const d=C,u=t.computed(()=>{const{borderColor:l,bgColor:o,rounded:a,enlargeOnHover:r,showShadow:h,glass:m,glassBlur:y,glassOpacity:p,fullWidth:U}=i;return[n.generateClass.borderColorVariant({color:l}),n.generateClass.bgColorVariant({color:o}),!U&&"max-w-[450px] sm:max-w-[350px]",a?"rounded-lg":"rounded-sm",r&&"hover:scale-105 transition ease-in duration-300",h&&"drop-shadow-md",m&&w.getGlassmorphismClass(o,y,p)].filter(Boolean).join(" ")}),f=t.computed(()=>{const{titleSize:l,titleColor:o,showHighlight:a}=i;return[n.generateClass.h3Variant({size:l}),n.generateClass.textColorVariant({color:o}),a?"mb-2xs":"mb-xs"].filter(Boolean).join(" ")}),k=t.computed(()=>{const{labelTextColor:l,labelColor:o}=i;return[n.generateClass.textColorVariant({color:l}),n.generateClass.bgColorVariant({color:o})].filter(Boolean).join(" ")}),b=t.computed(()=>{const{ctaColor:l,rounded:o}=i,a=["light-1","light-2","light-3","light-4"];return[n.generateClass.btnColorVariant({color:l}),a.includes(l)?"text-black":"text-white",o&&"btn-round"].filter(Boolean).join(" ")}),s=l=>{const{title:o,ctaLink:a,ctaTarget:r,ctaAsLink:h}=i,m={title:o,url:a,target:r||"_self"};!h&&l.preventDefault(),d("card-btn-click",l,m)},c=l=>{const{title:o,ctaLink:a,ctaTarget:r}=i;d("card-click",l,{title:o,url:a,target:r||"_self"})};return(l,o)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["xs:w-auto flex w-full flex-shrink-0 flex-grow cursor-pointer flex-col overflow-hidden border",u.value]),onClick:c},[e.showImage?(t.openBlock(),t.createElementBlock("div",B,[t.createElementVNode("img",{src:e.imageSource,alt:e.imageAlt,class:"aspect-video min-w-full object-cover object-top"},null,8,V),e.showLabel?(t.openBlock(),t.createElementBlock("span",{key:0,class:t.normalizeClass(["absolute bottom-0 ml-xs inline-block translate-y-[50%] px-2xs py-3xs text-xs font-bold",k.value]),innerHTML:e.labelText},null,10,E)):t.createCommentVNode("",!0)])):t.createCommentVNode("",!0),t.createElementVNode("div",S,[t.createElementVNode("div",z,[!e.showImage&&e.showLabel?(t.openBlock(),t.createElementBlock("span",{key:0,class:t.normalizeClass(["mb-2xs inline-block px-2xs py-3xs text-xs font-bold",k.value]),innerHTML:e.labelText},null,10,L)):t.createCommentVNode("",!0),t.createElementVNode("h3",{class:t.normalizeClass(f.value),innerHTML:e.title},null,10,N),e.showHighlight?(t.openBlock(),t.createElementBlock("div",{key:1,class:t.normalizeClass(["mb-xs h-3xs w-md",t.unref(n.generateClass).bgColorVariant({color:e.highlightColor})])},null,2)):t.createCommentVNode("",!0),t.createElementVNode("div",{class:"mb-sm cursor-default",onClick:o[0]||(o[0]=t.withModifiers(()=>{},["stop"]))},[t.renderSlot(l.$slots,"default")])]),e.showCta?(t.openBlock(),t.createElementBlock("div",{key:0,class:"cursor-default border-0 pb-sm",onClick:o[2]||(o[2]=t.withModifiers(()=>{},["stop"]))},[t.createElementVNode("div",A,[t.createElementVNode("a",{href:e.ctaLink,target:e.ctaTarget,class:t.normalizeClass(["btn btn-full",b.value]),onClick:o[1]||(o[1]=a=>s(a))},t.toDisplayString(e.ctaText),11,j)])])):t.createCommentVNode("",!0)])],2))}}),H=["href","target"],$={class:"peer absolute inset-0 z-15 flex flex-col items-start justify-end p-xs transition-opacity duration-200 hover:opacity-100 [@media(hover:hover)]:opacity-0"},T=["innerHTML"],D=["src","alt"],O=t.defineComponent({__name:"MclCardB",props:{title:{},titleSize:{default:"md"},titleColor:{default:"light-1"},titleBlockColor:{default:"dark-4"},borderColor:{default:"light-3"},imageSource:{},imageAlt:{},showGrayScale:{type:Boolean,default:!0},ctaAsLink:{type:Boolean,default:!1},ctaLink:{default:"#"},ctaTarget:{default:"_self"},rounded:{type:Boolean,default:!1}},emits:["card-click"],setup(e,{emit:C}){const i=e;t.useSlots();const d=C,u=t.computed(()=>{const{borderColor:s,rounded:c}=i,l=[n.generateClass.borderColorVariant({color:s})];return l.push(c?"rounded-md":"rounded-sm"),l.join(" ")}),f=t.computed(()=>{const{showGrayScale:s}=i;return s?"[@media(hover:hover)]:grayscale peer-hover:grayscale-0":""}),k=t.computed(()=>{const{titleSize:s,titleColor:c,titleBlockColor:l}=i;return[n.generateClass.h3Variant({size:s}),n.generateClass.textColorVariant({color:c}),n.generateClass.bgColorVariant({color:l})].join(" ")}),b=s=>{const{title:c,ctaLink:l,ctaTarget:o,ctaAsLink:a}=i;!a&&s.preventDefault();const r={title:c,url:l,target:o||"_self"};console.log(r),d("card-click",s,r)};return(s,c)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["xs:w-auto relative w-full max-w-112.5 shrink-0 grow cursor-pointer overflow-hidden border sm:max-w-87.5",u.value])},[t.createElementVNode("a",{href:e.ctaLink,target:e.ctaTarget,onClick:c[0]||(c[0]=l=>b(l))},[t.createElementVNode("div",$,[t.createElementVNode("h3",{innerHTML:e.title,class:t.normalizeClass(["pointer-events-none mb-2xs inline-block px-xs py-2xs tracking-wide",k.value])},null,10,T),t.renderSlot(s.$slots,"default")]),t.createElementVNode("img",{src:e.imageSource,alt:e.imageAlt,class:t.normalizeClass(["relative z-10 aspect-3/4 h-full w-full object-cover object-center transition-all duration-200",f.value])},null,10,D)],8,H)],2))}}),I=["src","alt"],q=t.defineComponent({__name:"MclCardC",props:{imageSource:{},imageAlt:{},title:{},titleSize:{default:"md"},titleColor:{default:"dark-3"},showHighlight:{type:Boolean,default:!1},highlightColor:{default:"light-3"},highlightOpacity:{default:80},showTitle:{type:Boolean,default:!1},cardColor:{default:"primary"}},emits:["card-click"],setup(e,{emit:C}){const i=e;t.useSlots();const d=t.ref(!1),u=C,f=t.computed(()=>{const s=[n.generateClass.bgColorVariant({color:i.cardColor})];return d.value&&s.push("flip-card"),s.join(" ")}),k=t.computed(()=>{const{titleSize:s,titleColor:c,showHighlight:l,highlightColor:o,highlightOpacity:a}=i,r=[n.generateClass.h3Variant({size:s}),n.generateClass.textColorVariant({color:c})];return l&&(r.push("px-xs py-2xs mb-2xs rounded"),r.push(n.generateClass.bgColorVariant({color:o})),r.push(n.generateClass.bgOpacityVariant({opacity:a}))),r.join(" ")}),b=s=>{s.preventDefault(),d.value&&u("card-click",s),d.value=!0};return(s,c)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["card relative aspect-square max-h-100 overflow-hidden transition duration-1600",f.value]),onClick:b},[t.createElementVNode("img",{src:e.imageSource,alt:e.imageAlt,class:t.normalizeClass([d.value?"opacity-100":"opacity-0","absolute aspect-square h-full w-full object-cover object-center transition-opacity delay-500 duration-800"])},null,10,I),t.createElementVNode("div",{class:t.normalizeClass([d.value?"cursor-pointer opacity-100":"opacity-0","relative flex h-full flex-col justify-end p-sm transition delay-500 duration-800"])},[e.showTitle?(t.openBlock(),t.createElementBlock("h3",{key:0,class:t.normalizeClass(["relative self-start",k.value])},[t.createElementVNode("span",null,t.toDisplayString(e.title),1)],2)):t.createCommentVNode("",!0),t.renderSlot(s.$slots,"card-body",{},void 0,!0)],2)],2))}}),x=(e,C)=>{const i=e.__vccOpts||e;for(const[d,u]of C)i[d]=u;return i},W=x(q,[["__scopeId","data-v-eac7e2f0"]]),G={class:"flex flex-col overflow-hidden rounded-md"},F=["src","alt"],P=["href","target"],R=x(t.defineComponent({__name:"MclCardD",props:{showImage:{type:Boolean,default:!0},imageSource:{},imageAlt:{default:""},title:{},titleSize:{default:"md"},titleColor:{default:"dark-4"},bgColor:{default:"light-1"},showHighlight:{type:Boolean,default:!0},highlightColor:{default:"primary"},ctaText:{default:"Read more"},ctaLink:{},ctaLinkTarget:{default:"_self"},ctaAsLink:{type:Boolean,default:!1},ctaButton:{type:Boolean,default:!1},ctaButtonColor:{default:"warning"},ctaButtonBlock:{type:Boolean,default:!1},borderWidth:{default:3},borderColor:{default:"light-3"},gradient1:{default:"primary"},gradient2:{default:"secondary"},customColor:{}},emits:["card-click"],setup(e,{emit:C}){const i={primary:"from-primary",secondary:"from-secondary",success:"from-success",info:"from-info",warning:"from-warning",danger:"from-danger","light-1":"from-light-1","light-2":"from-light-2","light-3":"from-light-3","light-4":"from-light-4","dark-1":"from-dark-1","dark-2":"from-dark-2","dark-3":"from-dark-3","dark-4":"from-dark-4",black:"from-black",white:"from-white",transparent:"from-transparent"},d={primary:"via-primary",secondary:"via-secondary",success:"via-success",info:"via-info",warning:"via-warning",danger:"via-danger","light-1":"via-light-1","light-2":"via-light-2","light-3":"via-light-3","light-4":"via-light-4","dark-1":"via-dark-1","dark-2":"via-dark-2","dark-3":"via-dark-3","dark-4":"via-dark-4",black:"via-black",white:"via-white",transparent:"via-transparent"},u={primary:"to-primary",secondary:"to-secondary",success:"to-success",info:"to-info",warning:"to-warning",danger:"to-danger","light-1":"to-light-1","light-2":"to-light-2","light-3":"to-light-3","light-4":"to-light-4","dark-1":"to-dark-1","dark-2":"to-dark-2","dark-3":"to-dark-3","dark-4":"to-dark-4",black:"to-black",white:"to-white",transparent:"to-transparent"},f=e;t.useSlots();const k=C,b=t.computed(()=>{const{titleSize:a,titleColor:r}=f;return[n.generateClass.h2Variant({size:a}),n.generateClass.textColorVariant({color:r})].join(" ")}),s=t.computed(()=>{const{ctaButton:a,ctaButtonColor:r,ctaButtonBlock:h}=f,m=[],y=["light-1","light-2","light-3","light-4"];return a?m.push("btn",n.generateClass.btnColorVariant({color:r})):m.push("mcl-link"),a&&h&&m.push("btn-full"),a&&!y.includes(r)&&m.push("text-white"),m.join(" ")}),c=t.computed(()=>({"--border-width":`${f.borderWidth}px`})),l=t.computed(()=>{const a=i[f.borderColor],r=d[f.gradient1],h=u[f.gradient2];return[n.generateClass.borderColorVariant({color:f.borderColor}),a,r,h].join(" ")}),o=a=>{const{title:r,ctaLink:h,ctaLinkTarget:m,ctaAsLink:y}=f,p={title:r,url:h,target:m||"_self"};!y&&a.preventDefault(),k("card-click",a,p)};return(a,r)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["card xs:w-auto w-full max-w-112.5 shrink-0 grow overflow-hidden rounded-md border from-20% sm:max-w-87.5",l.value]),style:t.normalizeStyle(c.value)},[t.createElementVNode("div",G,[e.showImage?(t.openBlock(),t.createElementBlock("img",{key:0,src:e.imageSource,class:"max-h-50 min-w-full object-cover object-top",alt:e.imageAlt},null,8,F)):t.createCommentVNode("",!0),t.createElementVNode("div",{class:t.normalizeClass(["p-xs",t.unref(n.generateClass).bgColorVariant({color:e.bgColor})])},[t.createElementVNode("h3",{class:t.normalizeClass(["mb-xs",b.value])},t.toDisplayString(e.title),3),e.showHighlight?(t.openBlock(),t.createElementBlock("div",{key:0,class:t.normalizeClass(["mb-xs h-3xs w-md",t.unref(n.generateClass).bgColorVariant({color:e.highlightColor})])},null,2)):t.createCommentVNode("",!0),t.createElementVNode("div",null,[t.renderSlot(a.$slots,"default",{},void 0,!0)]),t.createElementVNode("div",{class:t.normalizeClass(["mt-xs",{"mb-2xs":!e.ctaButton}])},[t.createElementVNode("a",{href:e.ctaLink,target:e.ctaLinkTarget,class:t.normalizeClass(s.value),onClick:o},t.toDisplayString(e.ctaText),11,P)],2)],2)])],6))}}),[["__scopeId","data-v-8bf2cac0"]]);g.MclCardA=M,g.MclCardB=O,g.MclCardC=W,g.MclCardD=R,Object.defineProperty(g,Symbol.toStringTag,{value:"Module"})}));
+(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode('.perspective[data-v-2c67f772]{-webkit-perspective:1800px;perspective:1800px}.card[data-v-2c67f772]{-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transform:rotateY(0deg);transform:rotateY(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.flip-card[data-v-2c67f772]{-webkit-transform:rotateY(360deg);transform:rotateY(360deg)}.card[data-v-b6e2475b]{background-size:cover;background-position:center center;background-repeat:no-repeat;padding:var(--border-width);background:conic-gradient(from var(--border-angle, 0deg),var(--tw-gradient-from) var(--tw-gradient-from-position),var(--tw-gradient-via),var(--tw-gradient-to));animation:bg-spin-b6e2475b 4s linear infinite}@keyframes bg-spin-b6e2475b{0%{--border-angle: 0deg}to{--border-angle: 360deg}}.card[data-v-b6e2475b]:hover{animation-play-state:paused}@property --border-angle{syntax: "<angle>"; inherits: false; initial-value: 0deg;}')),document.head.appendChild(e)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}})();
+(function(g,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue"),require("@bobbykim/manguito-theme"),require("@bobbykim/manguito-theme/util")):typeof define=="function"&&define.amd?define(["exports","vue","@bobbykim/manguito-theme","@bobbykim/manguito-theme/util"],t):(g=typeof globalThis<"u"?globalThis:g||self,t(g.MclCards={},g.Vue,g.ManguitoTheme,g.ManguitoThemeUtil))})(this,(function(g,t,s,w){"use strict";const B={key:0,class:"relative"},V=["src","alt"],E=["innerHTML"],z={class:"flex h-full flex-col justify-between"},L={class:"flex-1 px-xs pt-sm"},S=["innerHTML"],N=["innerHTML"],A={class:"w-full px-xs"},j=["href","target"],M=t.defineComponent({__name:"MclCardA",props:{title:{},titleSize:{default:"md"},titleColor:{default:"dark-3"},borderColor:{default:"light-3"},bgColor:{default:"light-1"},fullWidth:{type:Boolean,default:!1},glass:{type:Boolean,default:!1},glassBlur:{default:"sm"},glassOpacity:{default:20},showImage:{type:Boolean,default:!0},imageSource:{},imageAlt:{},showCta:{type:Boolean,default:!0},ctaAsLink:{type:Boolean,default:!1},ctaText:{default:"cta text"},ctaColor:{default:"primary"},ctaLink:{default:"#"},ctaTarget:{default:"_self"},showLabel:{type:Boolean,default:!0},labelText:{default:"Lorem ipsum"},labelTextColor:{default:"light-1"},labelColor:{default:"dark-4"},enlargeOnHover:{type:Boolean,default:!1},showHighlight:{type:Boolean,default:!0},highlightColor:{default:"primary"},rounded:{type:Boolean,default:!0},showShadow:{type:Boolean,default:!0}},emits:["card-click","card-btn-click"],setup(e,{emit:C}){const i=e,d=C,u=t.computed(()=>{const{borderColor:l,bgColor:o,rounded:a,enlargeOnHover:n,showShadow:h,glass:m,glassBlur:y,glassOpacity:p,fullWidth:U}=i;return[s.generateClass.borderColorVariant({color:l}),s.generateClass.bgColorVariant({color:o}),!U&&"max-w-[450px] sm:max-w-[350px]",a?"rounded-lg":"rounded-sm",n&&"hover:scale-105 transition ease-in duration-300",h&&"drop-shadow-md",m&&w.getGlassmorphismClass(o,y,p)].filter(Boolean).join(" ")}),f=t.computed(()=>{const{titleSize:l,titleColor:o,showHighlight:a}=i;return[s.generateClass.h3Variant({size:l}),s.generateClass.textColorVariant({color:o}),a?"mb-2xs":"mb-xs"].filter(Boolean).join(" ")}),k=t.computed(()=>{const{labelTextColor:l,labelColor:o}=i;return[s.generateClass.textColorVariant({color:l}),s.generateClass.bgColorVariant({color:o})].filter(Boolean).join(" ")}),b=t.computed(()=>{const{ctaColor:l,rounded:o}=i,a=["light-1","light-2","light-3","light-4"];return[s.generateClass.btnColorVariant({color:l}),a.includes(l)?"text-black":"text-white",o&&"btn-round"].filter(Boolean).join(" ")}),r=l=>{const{title:o,ctaLink:a,ctaTarget:n,ctaAsLink:h}=i,m={title:o,url:a,target:n||"_self"};h||l.preventDefault(),d("card-btn-click",l,m)},c=l=>{const{title:o,ctaLink:a,ctaTarget:n}=i;d("card-click",l,{title:o,url:a,target:n||"_self"})};return(l,o)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["xs:w-auto flex w-full flex-shrink-0 flex-grow cursor-pointer flex-col overflow-hidden border",u.value]),onClick:c},[e.showImage?(t.openBlock(),t.createElementBlock("div",B,[t.createElementVNode("img",{src:e.imageSource,alt:e.imageAlt,class:"aspect-video min-w-full object-cover object-top"},null,8,V),e.showLabel?(t.openBlock(),t.createElementBlock("span",{key:0,class:t.normalizeClass(["absolute bottom-0 ml-xs inline-block translate-y-[50%] px-2xs py-3xs text-xs font-bold",k.value]),innerHTML:e.labelText},null,10,E)):t.createCommentVNode("",!0)])):t.createCommentVNode("",!0),t.createElementVNode("div",z,[t.createElementVNode("div",L,[!e.showImage&&e.showLabel?(t.openBlock(),t.createElementBlock("span",{key:0,class:t.normalizeClass(["mb-2xs inline-block px-2xs py-3xs text-xs font-bold",k.value]),innerHTML:e.labelText},null,10,S)):t.createCommentVNode("",!0),t.createElementVNode("h3",{class:t.normalizeClass(f.value),innerHTML:e.title},null,10,N),e.showHighlight?(t.openBlock(),t.createElementBlock("div",{key:1,class:t.normalizeClass(["mb-xs h-3xs w-md",t.unref(s.generateClass).bgColorVariant({color:e.highlightColor})])},null,2)):t.createCommentVNode("",!0),t.createElementVNode("div",{class:"mb-sm cursor-default",onClick:o[0]||(o[0]=t.withModifiers(()=>{},["stop"]))},[t.renderSlot(l.$slots,"default")])]),e.showCta?(t.openBlock(),t.createElementBlock("div",{key:0,class:"cursor-default border-0 pb-sm",onClick:o[2]||(o[2]=t.withModifiers(()=>{},["stop"]))},[t.createElementVNode("div",A,[t.createElementVNode("a",{href:e.ctaLink,target:e.ctaTarget,class:t.normalizeClass(["btn btn-full",b.value]),onClick:o[1]||(o[1]=a=>r(a))},t.toDisplayString(e.ctaText),11,j)])])):t.createCommentVNode("",!0)])],2))}}),H=["href","target"],$={class:"peer absolute inset-0 z-15 flex flex-col items-start justify-end p-xs transition-opacity duration-200 hover:opacity-100 [@media(hover:hover)]:opacity-0"},T=["innerHTML"],D=["src","alt"],O=t.defineComponent({__name:"MclCardB",props:{title:{},titleSize:{default:"md"},titleColor:{default:"light-1"},titleBlockColor:{default:"dark-4"},borderColor:{default:"light-3"},imageSource:{},imageAlt:{},showGrayScale:{type:Boolean,default:!0},ctaAsLink:{type:Boolean,default:!1},ctaLink:{default:"#"},ctaTarget:{default:"_self"},rounded:{type:Boolean,default:!1}},emits:["card-click"],setup(e,{emit:C}){const i=e,d=C,u=t.computed(()=>{const{borderColor:r,rounded:c}=i,l=[s.generateClass.borderColorVariant({color:r})];return l.push(c?"rounded-md":"rounded-sm"),l.join(" ")}),f=t.computed(()=>{const{showGrayScale:r}=i;return r?"[@media(hover:hover)]:grayscale peer-hover:grayscale-0":""}),k=t.computed(()=>{const{titleSize:r,titleColor:c,titleBlockColor:l}=i;return[s.generateClass.h3Variant({size:r}),s.generateClass.textColorVariant({color:c}),s.generateClass.bgColorVariant({color:l})].join(" ")}),b=r=>{const{title:c,ctaLink:l,ctaTarget:o,ctaAsLink:a}=i;a||r.preventDefault(),d("card-click",r,{title:c,url:l,target:o||"_self"})};return(r,c)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["xs:w-auto relative w-full max-w-112.5 shrink-0 grow cursor-pointer overflow-hidden border sm:max-w-87.5",u.value])},[t.createElementVNode("a",{href:e.ctaLink,target:e.ctaTarget,onClick:c[0]||(c[0]=l=>b(l))},[t.createElementVNode("div",$,[t.createElementVNode("h3",{innerHTML:e.title,class:t.normalizeClass(["pointer-events-none mb-2xs inline-block px-xs py-2xs tracking-wide",k.value])},null,10,T),t.renderSlot(r.$slots,"default")]),t.createElementVNode("img",{src:e.imageSource,alt:e.imageAlt,class:t.normalizeClass(["relative z-10 aspect-3/4 h-full w-full object-cover object-center transition-all duration-200",f.value])},null,10,D)],8,H)],2))}}),I=["src","alt"],q=t.defineComponent({__name:"MclCardC",props:{imageSource:{},imageAlt:{},title:{},titleSize:{default:"md"},titleColor:{default:"dark-3"},showHighlight:{type:Boolean,default:!1},highlightColor:{default:"light-3"},highlightOpacity:{default:80},showTitle:{type:Boolean,default:!1},cardColor:{default:"primary"}},emits:["card-click"],setup(e,{emit:C}){const i=e,d=t.ref(!1),u=C,f=t.computed(()=>{const r=[s.generateClass.bgColorVariant({color:i.cardColor})];return d.value&&r.push("flip-card"),r.join(" ")}),k=t.computed(()=>{const{titleSize:r,titleColor:c,showHighlight:l,highlightColor:o,highlightOpacity:a}=i,n=[s.generateClass.h3Variant({size:r}),s.generateClass.textColorVariant({color:c})];return l&&(n.push("px-xs py-2xs mb-2xs rounded"),n.push(s.generateClass.bgColorVariant({color:o})),n.push(s.generateClass.bgOpacityVariant({opacity:a}))),n.join(" ")}),b=r=>{r.preventDefault(),d.value&&u("card-click",r),d.value=!0};return(r,c)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["card relative aspect-square max-h-100 overflow-hidden transition duration-1600",f.value]),onClick:b},[t.createElementVNode("img",{src:e.imageSource,alt:e.imageAlt,class:t.normalizeClass([d.value?"opacity-100":"opacity-0","absolute aspect-square h-full w-full object-cover object-center transition-opacity delay-500 duration-800"])},null,10,I),t.createElementVNode("div",{class:t.normalizeClass([d.value?"cursor-pointer opacity-100":"opacity-0","relative flex h-full flex-col justify-end p-sm transition delay-500 duration-800"])},[e.showTitle?(t.openBlock(),t.createElementBlock("h3",{key:0,class:t.normalizeClass(["relative self-start",k.value])},[t.createElementVNode("span",null,t.toDisplayString(e.title),1)],2)):t.createCommentVNode("",!0),t.renderSlot(r.$slots,"card-body",{},void 0,!0)],2)],2))}}),x=(e,C)=>{const i=e.__vccOpts||e;for(const[d,u]of C)i[d]=u;return i},W=x(q,[["__scopeId","data-v-2c67f772"]]),G={class:"flex flex-col overflow-hidden rounded-md"},F=["src","alt"],P=["href","target"],R=x(t.defineComponent({__name:"MclCardD",props:{showImage:{type:Boolean,default:!0},imageSource:{},imageAlt:{default:""},title:{},titleSize:{default:"md"},titleColor:{default:"dark-4"},bgColor:{default:"light-1"},showHighlight:{type:Boolean,default:!0},highlightColor:{default:"primary"},ctaText:{default:"Read more"},ctaLink:{},ctaLinkTarget:{default:"_self"},ctaAsLink:{type:Boolean,default:!1},ctaButton:{type:Boolean,default:!1},ctaButtonColor:{default:"warning"},ctaButtonBlock:{type:Boolean,default:!1},borderWidth:{default:3},borderColor:{default:"light-3"},gradient1:{default:"primary"},gradient2:{default:"secondary"},customColor:{}},emits:["card-click"],setup(e,{emit:C}){const i={primary:"from-primary",secondary:"from-secondary",success:"from-success",info:"from-info",warning:"from-warning",danger:"from-danger","light-1":"from-light-1","light-2":"from-light-2","light-3":"from-light-3","light-4":"from-light-4","dark-1":"from-dark-1","dark-2":"from-dark-2","dark-3":"from-dark-3","dark-4":"from-dark-4",black:"from-black",white:"from-white",transparent:"from-transparent"},d={primary:"via-primary",secondary:"via-secondary",success:"via-success",info:"via-info",warning:"via-warning",danger:"via-danger","light-1":"via-light-1","light-2":"via-light-2","light-3":"via-light-3","light-4":"via-light-4","dark-1":"via-dark-1","dark-2":"via-dark-2","dark-3":"via-dark-3","dark-4":"via-dark-4",black:"via-black",white:"via-white",transparent:"via-transparent"},u={primary:"to-primary",secondary:"to-secondary",success:"to-success",info:"to-info",warning:"to-warning",danger:"to-danger","light-1":"to-light-1","light-2":"to-light-2","light-3":"to-light-3","light-4":"to-light-4","dark-1":"to-dark-1","dark-2":"to-dark-2","dark-3":"to-dark-3","dark-4":"to-dark-4",black:"to-black",white:"to-white",transparent:"to-transparent"},f=e,k=C,b=t.computed(()=>{const{titleSize:a,titleColor:n}=f;return[s.generateClass.h2Variant({size:a}),s.generateClass.textColorVariant({color:n})].join(" ")}),r=t.computed(()=>{const{ctaButton:a,ctaButtonColor:n,ctaButtonBlock:h}=f,m=[],y=["light-1","light-2","light-3","light-4"];return a?m.push("btn",s.generateClass.btnColorVariant({color:n})):m.push("mcl-link"),a&&h&&m.push("btn-full"),a&&!y.includes(n)&&m.push("text-white"),m.join(" ")}),c=t.computed(()=>({"--border-width":`${f.borderWidth}px`})),l=t.computed(()=>{const a=i[f.borderColor],n=d[f.gradient1],h=u[f.gradient2];return[s.generateClass.borderColorVariant({color:f.borderColor}),a,n,h].join(" ")}),o=a=>{const{title:n,ctaLink:h,ctaLinkTarget:m,ctaAsLink:y}=f,p={title:n,url:h,target:m||"_self"};y||a.preventDefault(),k("card-click",a,p)};return(a,n)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["card xs:w-auto w-full max-w-112.5 shrink-0 grow overflow-hidden rounded-md border from-20% sm:max-w-87.5",l.value]),style:t.normalizeStyle(c.value)},[t.createElementVNode("div",G,[e.showImage?(t.openBlock(),t.createElementBlock("img",{key:0,src:e.imageSource,class:"max-h-50 min-w-full object-cover object-top",alt:e.imageAlt},null,8,F)):t.createCommentVNode("",!0),t.createElementVNode("div",{class:t.normalizeClass(["p-xs",t.unref(s.generateClass).bgColorVariant({color:e.bgColor})])},[t.createElementVNode("h3",{class:t.normalizeClass(["mb-xs",b.value])},t.toDisplayString(e.title),3),e.showHighlight?(t.openBlock(),t.createElementBlock("div",{key:0,class:t.normalizeClass(["mb-xs h-3xs w-md",t.unref(s.generateClass).bgColorVariant({color:e.highlightColor})])},null,2)):t.createCommentVNode("",!0),t.createElementVNode("div",null,[t.renderSlot(a.$slots,"default",{},void 0,!0)]),t.createElementVNode("div",{class:t.normalizeClass(["mt-xs",{"mb-2xs":!e.ctaButton}])},[t.createElementVNode("a",{href:e.ctaLink,target:e.ctaLinkTarget,class:t.normalizeClass(r.value),onClick:o},t.toDisplayString(e.ctaText),11,P)],2)],2)])],6))}}),[["__scopeId","data-v-b6e2475b"]]);g.MclCardA=M,g.MclCardB=O,g.MclCardC=W,g.MclCardD=R,Object.defineProperty(g,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bobbykim/mcl-cards",
-  "version": "0.10.4",
+  "version": "0.10.6",
   "description": "card components based on @bobbykim/manguito-theme",
   "type": "module",
   "files": [
@@ -31,7 +31,7 @@
   "license": "MIT",
   "dependencies": {
     "vue": "^3.5.13",
-    "@bobbykim/manguito-theme": "1.2.0"
+    "@bobbykim/manguito-theme": "1.3.0"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^5.2.1",
@@ -43,6 +43,9 @@
     "vue-tsc": "^2.1.10"
   },
   "scripts": {
-    "build": "vite build"
+    "build": "vite build",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "typecheck": "vue-tsc --noEmit -p tsconfig.json"
   }
 }