@comercti/web-components-hmg 0.44.1 → 0.44.2

package/comerc-style-guide.es.js

@@ -7826,17 +7826,16 @@ const s0 = "@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:transl
     showLoading: { type: Boolean, default: !1 },
     background: { default: "smoky" },
     blur: { type: Boolean, default: !1 },
-    showText: { type: Boolean, default: !0 }
+    showText: { type: Boolean, default: !0 },
+    size: { default: "medium" }
   },
   setup(e) {
-    const t = Q(() => ({
-      "w-10 h-10 border-4 border-green-500 border-t-transparent rounded-full animate-spin": !0
-    })), a = Q(() => ({
-      "w-10 h-10 border-4 border-green-500 border-t-transparent border-l-transparent rounded-full animate-spin": !0
-    })), r = Q(() => ({
-      "w-[50px] h-[50px] relative ": !0
-    }));
-    return (n, l) => e.showLoading ? (d(), g("div", {
+    const t = e, a = (s) => s === "small" ? "w-6 h-6 border-2" : s === "medium" ? "w-8 h-8 border-4" : "w-10 h-10 border-4", r = Q(() => ({
+      [`${a(t.size)} border-green-500 border-t-transparent rounded-full animate-spin`]: !0
+    })), n = Q(() => ({
+      [`${a(t.size)} border-green-500 border-t-transparent border-l-transparent rounded-full animate-spin`]: !0
+    })), l = Q(() => "w-[50px] h-[50px] relative ");
+    return (s, i) => e.showLoading ? (d(), g("div", {
       key: 0,
       class: w(["fixed left-0 top-0 z-50 flex h-full w-full items-center justify-center", {
         "backdrop-blur-md": e.blur,
@@ -7849,14 +7848,14 @@ const s0 = "@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:transl
         u("div", c0, [
           e.type === "spinner" ? (d(), g("div", {
             key: 0,
-            class: w(t.value)
+            class: w(r.value)
           }, null, 2)) : e.type === "semi-circle" ? (d(), g("div", {
             key: 1,
-            class: w(a.value)
+            class: w(n.value)
           }, null, 2)) : e.type === "dots" ? (d(), g("div", {
             key: 2,
-            class: w(r.value)
-          }, [...l[0] || (l[0] = [
+            class: w(l.value)
+          }, [...i[0] || (i[0] = [
             kr('<div class="absolute -top-1 left-1/2 transform -translate-x-1/2 w-3 h-3 bg-green-500 rounded-full opacity-0 animate-fade"></div><div class="absolute top-0 left-10 transform -translate-x-1/2 w-3 h-3 bg-green-500 rounded-full opacity-0 animate-fade delay-15"></div><div class="absolute top-3 left-[3rem] transform -translate-x-1/2 w-3 h-3 bg-green-500 rounded-full opacity-0 animate-fade delay-30"></div><div class="absolute top-7 left-[3rem] transform -translate-x-1/2 w-3 h-3 bg-green-500 rounded-full opacity-0 animate-fade delay-45"></div><div class="absolute top-10 left-[2.5rem] transform -translate-x-1/2 w-3 h-3 bg-green-500 rounded-full opacity-0 animate-fade delay-60"></div><div class="absolute top-[2.7rem] left-[1.5rem] transform -translate-x-1/2 w-3 h-3 bg-green-500 rounded-full opacity-0 animate-fade delay-75"></div><div class="absolute top-[2.4rem] left-[0.6rem] transform -translate-x-1/2 w-3 h-3 bg-green-500 rounded-full opacity-0 animate-fade delay-90"></div><div class="absolute top-[1.5rem] right-9 transform -translate-x-1/2 w-3 h-3 bg-green-500 rounded-full opacity-0 animate-fade delay-105"></div><div class="absolute top-0 right-7 transform -translate-x-1/2 w-3 h-3 bg-green-500 rounded-full opacity-0 animate-fade delay-135"></div><div class="absolute top-[0.70rem] right-9 transform -translate-x-1/2 w-3 h-3 bg-green-500 rounded-full opacity-0 animate-fade delay-120"></div>', 10)
           ])], 2)) : C("", !0),
           e.showText ? (d(), g("p", u0, "Carregando...")) : C("", !0)
@@ -7871,7 +7870,8 @@ const s0 = "@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:transl
     showLoading: { type: Boolean, default: !1 },
     background: { default: "smoky" },
     blur: { type: Boolean, default: !1 },
-    showText: { type: Boolean, default: !0 }
+    showText: { type: Boolean, default: !0 },
+    size: { default: "medium" }
   },
   setup(e) {
     const { exibirLoading: t } = hr();
@@ -7880,8 +7880,9 @@ const s0 = "@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:transl
       "show-loading": e.showLoading || o(t),
       background: e.background,
       blur: e.blur,
-      "show-text": e.showText
-    }, null, 8, ["type", "show-loading", "background", "blur", "show-text"]));
+      "show-text": e.showText,
+      size: e.size
+    }, null, 8, ["type", "show-loading", "background", "blur", "show-text", "size"]));
   }
 }), m0 = ".toast-enter-active{--tw-scale-x: .75;--tw-scale-y: .75;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}.toast-leave-active{opacity:0;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.5s}.toast-enter-from{--tw-translate-y: 1.25rem;--tw-scale-x: .9;--tw-scale-y: .9;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));opacity:0}.toast-enter-to{--tw-translate-y: 0px;--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));opacity:1}", { addCeToast: s1, removeCeToast: d1, toasts: c1 } = vr(), { activateCeLoading: u1, disableCeLoading: g1 } = hr(), f0 = _($(Ru)), p0 = _($(Vu)), b0 = _(
   $(n0),