barati-ui 0.1.0 → 0.1.1

package/dist/index.js

@@ -1,15 +1,15 @@
 (function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode('.cs-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;margin:0;border:0;border-radius:.5rem;font-family:inherit;font-weight:600;line-height:inherit;white-space:nowrap;vertical-align:middle;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex-shrink:0;overflow:hidden;text-decoration:none;-webkit-tap-highlight-color:transparent;transition:all .18s cubic-bezier(.4,0,.2,1)}.cs-btn.cs-link{overflow:visible}.cs-btn:focus-visible{outline:2px solid transparent;outline-offset:2px}.cs-btn:hover:not(:disabled):not(.is-disabled).cs-lift{transform:translateY(-2px)}.cs-btn:active:not(:disabled):not(.is-disabled).cs-press{transform:scale(.96)}.cs-btn:disabled,.cs-btn.is-disabled{opacity:.55;cursor:not-allowed;pointer-events:none}.cs-ripple{position:absolute;border-radius:9999px;background:currentColor;opacity:.3;transform:scale(0);pointer-events:none;z-index:1;animation:cs-ripple .65s ease-out forwards}.cs-spinner{display:inline-block;width:1em;height:1em;border-radius:9999px;border:2px solid currentColor;border-top-color:transparent;animation:cs-spin .7s linear infinite}.cs-badge{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:1.125rem;height:1.125rem;padding:0 .25rem;border-radius:9999px;font-size:.65rem;font-weight:700;line-height:1;text-indent:0;text-align:center;color:#fff;box-shadow:0 1px 3px #0000004d;z-index:2}.cs-badge-dot{display:block;width:.55rem;height:.55rem;border-radius:9999px;box-shadow:0 0 0 2px #fff;z-index:2}.cs-shine:after{content:"";position:absolute;top:-60%;left:-80%;width:40%;height:220%;transform:rotate(25deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);pointer-events:none}.cs-shine:hover:after{animation:cs-shine .8s ease forwards}.cs-glow{animation:cs-glow-pulse 2.4s ease-in-out infinite}.absolute{position:absolute}.-right-0\\.5{right:-.125rem}.-right-1{right:-.25rem}.-top-0\\.5{top:-.125rem}.-top-1{top:-.25rem}.mx-auto{margin-left:auto;margin-right:auto}.mb-4{margin-bottom:1rem}.mt-2{margin-top:.5rem}.flex{display:flex}.h-10{height:2.5rem}.h-11{height:2.75rem}.h-14{height:3.5rem}.h-16{height:4rem}.h-5{height:1.25rem}.h-7{height:1.75rem}.h-8{height:2rem}.min-h-screen{min-height:100vh}.w-5{width:1.25rem}.w-full{width:100%}.max-w-6xl{max-width:72rem}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.gap-1{gap:.25rem}.gap-1\\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-2\\.5{gap:.625rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.space-y-12>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(3rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(3rem * var(--tw-space-y-reverse))}.whitespace-nowrap{white-space:nowrap}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-none{border-radius:0}.rounded-sm{border-radius:.125rem}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.border-2{border-width:2px}.border-slate-200{--tw-border-opacity: 1;border-color:rgb(226 232 240 / var(--tw-border-opacity, 1))}.border-violet-600{--tw-border-opacity: 1;border-color:rgb(124 58 237 / var(--tw-border-opacity, 1))}.bg-amber-500{--tw-bg-opacity: 1;background-color:rgb(245 158 11 / var(--tw-bg-opacity, 1))}.bg-emerald-500{--tw-bg-opacity: 1;background-color:rgb(16 185 129 / var(--tw-bg-opacity, 1))}.bg-emerald-600{--tw-bg-opacity: 1;background-color:rgb(5 150 105 / var(--tw-bg-opacity, 1))}.bg-rose-500{--tw-bg-opacity: 1;background-color:rgb(244 63 94 / var(--tw-bg-opacity, 1))}.bg-rose-600{--tw-bg-opacity: 1;background-color:rgb(225 29 72 / var(--tw-bg-opacity, 1))}.bg-sky-500{--tw-bg-opacity: 1;background-color:rgb(14 165 233 / var(--tw-bg-opacity, 1))}.bg-sky-600{--tw-bg-opacity: 1;background-color:rgb(2 132 199 / var(--tw-bg-opacity, 1))}.bg-slate-200{--tw-bg-opacity: 1;background-color:rgb(226 232 240 / var(--tw-bg-opacity, 1))}.bg-slate-600{--tw-bg-opacity: 1;background-color:rgb(71 85 105 / var(--tw-bg-opacity, 1))}.bg-slate-900{--tw-bg-opacity: 1;background-color:rgb(15 23 42 / var(--tw-bg-opacity, 1))}.bg-slate-950{--tw-bg-opacity: 1;background-color:rgb(2 6 23 / var(--tw-bg-opacity, 1))}.bg-transparent{background-color:transparent}.bg-violet-500{--tw-bg-opacity: 1;background-color:rgb(139 92 246 / var(--tw-bg-opacity, 1))}.bg-violet-600{--tw-bg-opacity: 1;background-color:rgb(124 58 237 / var(--tw-bg-opacity, 1))}.bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}.from-violet-600{--tw-gradient-from: #7c3aed var(--tw-gradient-from-position);--tw-gradient-to: rgb(124 58 237 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.via-fuchsia-500{--tw-gradient-to: rgb(217 70 239 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), #d946ef var(--tw-gradient-via-position), var(--tw-gradient-to)}.to-rose-500{--tw-gradient-to: #f43f5e var(--tw-gradient-to-position)}.p-8{padding:2rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.px-2\\.5{padding-left:.625rem;padding-right:.625rem}.px-3\\.5{padding-left:.875rem;padding-right:.875rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-8{padding-left:2rem;padding-right:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.tracking-wide{letter-spacing:.025em}.tracking-widest{letter-spacing:.1em}.text-amber-950{--tw-text-opacity: 1;color:rgb(69 26 3 / var(--tw-text-opacity, 1))}.text-slate-100{--tw-text-opacity: 1;color:rgb(241 245 249 / var(--tw-text-opacity, 1))}.text-slate-400{--tw-text-opacity: 1;color:rgb(148 163 184 / var(--tw-text-opacity, 1))}.text-slate-800{--tw-text-opacity: 1;color:rgb(30 41 59 / var(--tw-text-opacity, 1))}.text-violet-600{--tw-text-opacity: 1;color:rgb(124 58 237 / var(--tw-text-opacity, 1))}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.underline-offset-4{text-underline-offset:4px}.shadow-md{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-none{--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-amber-500\\/30{--tw-shadow-color: rgb(245 158 11 / .3);--tw-shadow: var(--tw-shadow-colored)}.shadow-emerald-600\\/25{--tw-shadow-color: rgb(5 150 105 / .25);--tw-shadow: var(--tw-shadow-colored)}.shadow-fuchsia-500\\/30{--tw-shadow-color: rgb(217 70 239 / .3);--tw-shadow: var(--tw-shadow-colored)}.shadow-rose-600\\/25{--tw-shadow-color: rgb(225 29 72 / .25);--tw-shadow: var(--tw-shadow-colored)}.shadow-sky-600\\/25{--tw-shadow-color: rgb(2 132 199 / .25);--tw-shadow: var(--tw-shadow-colored)}.shadow-slate-900\\/25{--tw-shadow-color: rgb(15 23 42 / .25);--tw-shadow: var(--tw-shadow-colored)}.shadow-violet-600\\/25{--tw-shadow-color: rgb(124 58 237 / .25);--tw-shadow: var(--tw-shadow-colored)}.outline{outline-style:solid}@keyframes cs-ripple{to{transform:scale(1);opacity:0}}@keyframes cs-spin{to{transform:rotate(360deg)}}@keyframes cs-shine{to{left:130%}}@keyframes cs-glow-pulse{0%,to{box-shadow:0 0 8px 0 var(--cs-glow, rgba(139, 92, 246, .5))}50%{box-shadow:0 0 22px 6px var(--cs-glow, rgba(139, 92, 246, .5))}}.hover\\:bg-amber-400:hover{--tw-bg-opacity: 1;background-color:rgb(251 191 36 / var(--tw-bg-opacity, 1))}.hover\\:bg-emerald-500:hover{--tw-bg-opacity: 1;background-color:rgb(16 185 129 / var(--tw-bg-opacity, 1))}.hover\\:bg-rose-500:hover{--tw-bg-opacity: 1;background-color:rgb(244 63 94 / var(--tw-bg-opacity, 1))}.hover\\:bg-sky-500:hover{--tw-bg-opacity: 1;background-color:rgb(14 165 233 / var(--tw-bg-opacity, 1))}.hover\\:bg-slate-300:hover{--tw-bg-opacity: 1;background-color:rgb(203 213 225 / var(--tw-bg-opacity, 1))}.hover\\:bg-slate-50:hover{--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity, 1))}.hover\\:bg-slate-700:hover{--tw-bg-opacity: 1;background-color:rgb(51 65 85 / var(--tw-bg-opacity, 1))}.hover\\:bg-violet-50:hover{--tw-bg-opacity: 1;background-color:rgb(245 243 255 / var(--tw-bg-opacity, 1))}.hover\\:bg-violet-500:hover{--tw-bg-opacity: 1;background-color:rgb(139 92 246 / var(--tw-bg-opacity, 1))}.hover\\:bg-violet-500\\/10:hover{background-color:#8b5cf61a}.hover\\:underline:hover{text-decoration-line:underline}.hover\\:shadow-lg:hover{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.hover\\:shadow-fuchsia-500\\/40:hover{--tw-shadow-color: rgb(217 70 239 / .4);--tw-shadow: var(--tw-shadow-colored)}.hover\\:brightness-110:hover{--tw-brightness: brightness(1.1);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.focus-visible\\:ring-amber-400\\/50:focus-visible{--tw-ring-color: rgb(251 191 36 / .5)}.focus-visible\\:ring-emerald-500\\/50:focus-visible{--tw-ring-color: rgb(16 185 129 / .5)}.focus-visible\\:ring-fuchsia-400\\/50:focus-visible{--tw-ring-color: rgb(232 121 249 / .5)}.focus-visible\\:ring-rose-500\\/50:focus-visible{--tw-ring-color: rgb(244 63 94 / .5)}.focus-visible\\:ring-sky-500\\/50:focus-visible{--tw-ring-color: rgb(14 165 233 / .5)}.focus-visible\\:ring-slate-400\\/40:focus-visible{--tw-ring-color: rgb(148 163 184 / .4)}.focus-visible\\:ring-slate-400\\/50:focus-visible{--tw-ring-color: rgb(148 163 184 / .5)}.focus-visible\\:ring-slate-500\\/50:focus-visible{--tw-ring-color: rgb(100 116 139 / .5)}.focus-visible\\:ring-violet-400\\/40:focus-visible{--tw-ring-color: rgb(167 139 250 / .4)}.focus-visible\\:ring-violet-500\\/40:focus-visible{--tw-ring-color: rgb(139 92 246 / .4)}.focus-visible\\:ring-violet-500\\/50:focus-visible{--tw-ring-color: rgb(139 92 246 / .5)}@media(prefers-color-scheme:dark){.dark\\:border-slate-700{--tw-border-opacity: 1;border-color:rgb(51 65 85 / var(--tw-border-opacity, 1))}.dark\\:border-violet-400{--tw-border-opacity: 1;border-color:rgb(167 139 250 / var(--tw-border-opacity, 1))}.dark\\:bg-slate-700{--tw-bg-opacity: 1;background-color:rgb(51 65 85 / var(--tw-bg-opacity, 1))}.dark\\:bg-slate-800{--tw-bg-opacity: 1;background-color:rgb(30 41 59 / var(--tw-bg-opacity, 1))}.dark\\:text-slate-100{--tw-text-opacity: 1;color:rgb(241 245 249 / var(--tw-text-opacity, 1))}.dark\\:text-violet-300{--tw-text-opacity: 1;color:rgb(196 181 253 / var(--tw-text-opacity, 1))}.dark\\:hover\\:bg-slate-600:hover{--tw-bg-opacity: 1;background-color:rgb(71 85 105 / var(--tw-bg-opacity, 1))}.dark\\:hover\\:bg-violet-500\\/10:hover{background-color:#8b5cf61a}}')),document.head.appendChild(r)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
-import { ref as O, useAttrs as W, computed as n, openBlock as l, createBlock as X, resolveDynamicComponent as Y, mergeProps as q, unref as N, withCtx as G, createElementBlock as o, Fragment as v, createElementVNode as H, toDisplayString as c, createCommentVNode as d, renderSlot as T, normalizeClass as I, createTextVNode as J } from "vue";
-const K = {
+import { ref as O, useAttrs as W, computed as n, openBlock as l, createBlock as Y, resolveDynamicComponent as q, mergeProps as G, unref as T, withCtx as H, createElementBlock as i, Fragment as p, createElementVNode as I, toDisplayString as f, createCommentVNode as u, renderSlot as $, normalizeClass as J, createTextVNode as K } from "vue";
+const Q = {
   key: 0,
   class: "whitespace-nowrap"
-}, Q = {
+}, U = {
   key: 1,
   "aria-hidden": "true"
-}, U = {
+}, Z = {
   key: 2,
   "aria-hidden": "true"
-}, ee = /* @__PURE__ */ Object.assign({ name: "CsisButton", inheritAttrs: !1 }, {
+}, d = /* @__PURE__ */ Object.assign({ name: "CsisButton", inheritAttrs: !1 }, {
   __name: "Button",
   props: {
     component: { type: [String, Object, Function], default: null },
@@ -69,21 +69,21 @@ const K = {
     autofocus: { type: Boolean, default: !1 }
   },
   emits: ["click"],
-  setup(e, { emit: $ }) {
-    const t = e, z = $, p = O(null), f = W(), D = n(() => {
-      const { class: a, style: s, ...r } = f;
+  setup(e, { emit: z }) {
+    const t = e, D = z, m = O(null), b = W(), L = n(() => {
+      const { class: a, style: s, ...r } = b;
       return r;
-    }), u = n(() => t.disabled || t.loading), m = n(() => t.variant === "link"), b = n(() => t.component ? t.component : t.href ? "a" : t.tag), y = n(() => b.value === "button"), h = n(() => b.value === "a"), L = n(() => {
+    }), g = n(() => t.disabled || t.loading), y = n(() => t.variant === "link"), h = n(() => t.component ? t.component : t.href ? "a" : t.tag), x = n(() => h.value === "button"), v = n(() => h.value === "a"), P = n(() => {
       if (t.rel) return t.rel;
       if (t.target === "_blank") return "noopener noreferrer";
-    }), x = {
+    }), w = {
       xs: "h-7 px-2.5 text-xs gap-1",
       sm: "h-8 px-3.5 text-sm gap-1.5",
       md: "h-10 px-5 text-sm gap-2",
       lg: "h-11 px-6 text-base gap-2",
       xl: "h-14 px-8 text-lg gap-2.5",
       "2xl": "h-16 px-10 text-xl gap-3"
-    }, w = {
+    }, k = {
       primary: "bg-violet-600 text-white shadow-md shadow-violet-600/25 hover:bg-violet-500 focus-visible:ring-violet-500/50",
       gradient: "bg-gradient-to-br from-violet-600 via-fuchsia-500 to-rose-500 text-white shadow-md shadow-fuchsia-500/30 hover:brightness-110 hover:shadow-lg hover:shadow-fuchsia-500/40 focus-visible:ring-fuchsia-400/50",
       secondary: "bg-slate-200 text-slate-800 shadow-sm hover:bg-slate-300 focus-visible:ring-slate-400/50 dark:bg-slate-700 dark:text-slate-100 dark:hover:bg-slate-600",
@@ -96,14 +96,14 @@ const K = {
       info: "bg-sky-600 text-white shadow-md shadow-sky-600/25 hover:bg-sky-500 focus-visible:ring-sky-500/50",
       light: "bg-white text-slate-800 border border-slate-200 shadow-sm hover:bg-slate-50 focus-visible:ring-slate-400/40 dark:bg-slate-800 dark:text-slate-100 dark:border-slate-700",
       link: "cs-link text-violet-600 underline-offset-4 hover:underline focus-visible:ring-violet-400/40 bg-transparent shadow-none"
-    }, k = {
+    }, B = {
       none: "rounded-none",
       sm: "rounded-sm",
       md: "rounded-lg",
       lg: "rounded-xl",
       xl: "rounded-2xl",
       full: "rounded-full"
-    }, B = {
+    }, S = {
       primary: "rgba(139, 92, 246, 0.55)",
       gradient: "rgba(217, 70, 239, 0.5)",
       secondary: "rgba(148, 163, 184, 0.5)",
@@ -116,84 +116,89 @@ const K = {
       info: "rgba(2, 132, 199, 0.55)",
       light: "rgba(15, 23, 42, 0.18)",
       link: "rgba(139, 92, 246, 0.4)"
-    }, S = {
+    }, C = {
       danger: "bg-rose-500",
       success: "bg-emerald-500",
       info: "bg-sky-500",
       warning: "bg-amber-500",
       violet: "bg-violet-500",
       slate: "bg-slate-600"
-    }, P = n(() => {
-      const a = ["cs-btn", w[t.variant] || w.primary];
-      return m.value || (a.push(x[t.size] || x.md), a.push(k[t.rounded] || k.md)), t.uppercase && a.push("uppercase tracking-wide"), t.fullWidth && a.push("w-full"), t.lift && a.push("cs-lift"), t.press && a.push("cs-press"), t.glow && a.push("cs-glow"), t.glossy && a.push("cs-shine"), u.value && a.push("is-disabled"), a;
-    }), A = n(() => {
+    }, A = n(() => {
+      const a = ["cs-btn", k[t.variant] || k.primary];
+      return y.value || (a.push(w[t.size] || w.md), a.push(B[t.rounded] || B.md)), t.uppercase && a.push("uppercase tracking-wide"), t.fullWidth && a.push("w-full"), t.lift && a.push("cs-lift"), t.press && a.push("cs-press"), t.glow && a.push("cs-glow"), t.glossy && a.push("cs-shine"), g.value && a.push("is-disabled"), a;
+    }), V = n(() => {
       if (t.glow)
-        return { "--cs-glow": B[t.variant] || B.primary };
-    }), C = n(() => t.badgeType === "dot"), V = n(() => C.value ? ["cs-badge-dot", "absolute", "-top-0.5", "-right-0.5", "bg-rose-500"] : ["cs-badge", "absolute", "-top-1", "-right-1", S[t.badgeType] || S.danger]), E = n(() => {
+        return { "--cs-glow": S[t.variant] || S.primary };
+    }), N = n(() => t.badgeType === "dot"), X = n(() => N.value ? ["cs-badge-dot", "absolute", "-top-0.5", "-right-0.5", "bg-rose-500"] : ["cs-badge", "absolute", "-top-1", "-right-1", C[t.badgeType] || C.danger]), E = n(() => {
       const a = Number(t.badgeMax) || 99, s = Number(t.badge);
       return Number.isFinite(s) ? s > a ? `${a}+` : String(s) : String(t.badge ?? "");
     });
     function F(a) {
-      const s = p.value;
-      if (!s || m.value) return;
-      const r = s.getBoundingClientRect(), g = Math.max(r.width, r.height) * 2, R = a.clientX - r.left - g / 2, j = a.clientY - r.top - g / 2, i = document.createElement("span");
-      i.className = "cs-ripple", i.style.width = `${g}px`, i.style.height = `${g}px`, i.style.left = `${R}px`, i.style.top = `${j}px`, s.appendChild(i), window.setTimeout(() => i.remove(), 650);
+      const s = m.value;
+      if (!s || y.value) return;
+      const r = s.getBoundingClientRect(), c = Math.max(r.width, r.height) * 2, R = a.clientX - r.left - c / 2, j = a.clientY - r.top - c / 2, o = document.createElement("span");
+      o.className = "cs-ripple", o.style.width = `${c}px`, o.style.height = `${c}px`, o.style.left = `${R}px`, o.style.top = `${j}px`, s.appendChild(o), window.setTimeout(() => o.remove(), 650);
     }
     function M(a) {
-      if (u.value) {
+      if (g.value) {
         a.preventDefault(), a.stopPropagation();
         return;
       }
-      t.ripple && F(a), z("click", a);
+      t.ripple && F(a), D("click", a);
     }
-    return (a, s) => (l(), X(Y(b.value), q({
+    return (a, s) => (l(), Y(q(h.value), G({
       ref_key: "root",
-      ref: p
-    }, D.value, {
-      type: y.value ? e.type : void 0,
-      href: h.value && e.href ? e.href : void 0,
-      target: h.value && e.target ? e.target : void 0,
-      rel: h.value ? L.value : void 0,
-      disabled: y.value ? u.value : void 0,
-      "aria-disabled": u.value || void 0,
+      ref: m
+    }, L.value, {
+      type: x.value ? e.type : void 0,
+      href: v.value && e.href ? e.href : void 0,
+      target: v.value && e.target ? e.target : void 0,
+      rel: v.value ? P.value : void 0,
+      disabled: x.value ? g.value : void 0,
+      "aria-disabled": g.value || void 0,
       "aria-busy": e.loading || void 0,
       "aria-label": e.ariaLabel || void 0,
       autofocus: e.autofocus || void 0,
-      class: [N(f).class, P.value],
-      style: [N(f).style, A.value],
+      class: [T(b).class, A.value],
+      style: [T(b).style, V.value],
       onClick: M
     }), {
-      default: G(() => [
-        e.loading ? (l(), o(v, { key: 0 }, [
-          s[0] || (s[0] = H("span", {
+      default: H(() => [
+        e.loading ? (l(), i(p, { key: 0 }, [
+          s[0] || (s[0] = I("span", {
             "aria-hidden": "true",
             class: "cs-spinner"
           }, null, -1)),
-          e.loadingText ? (l(), o("span", K, c(e.loadingText), 1)) : d("", !0)
-        ], 64)) : (l(), o(v, { key: 1 }, [
-          a.$slots.icon ? T(a.$slots, "icon", {}, void 0, void 0, 0) : e.icon && e.iconPosition === "left" ? (l(), o("span", Q, c(e.icon), 1)) : d("", !0),
-          T(a.$slots, "default"),
-          e.icon && e.iconPosition === "right" ? (l(), o("span", U, c(e.icon), 1)) : d("", !0)
+          e.loadingText ? (l(), i("span", Q, f(e.loadingText), 1)) : u("", !0)
+        ], 64)) : (l(), i(p, { key: 1 }, [
+          a.$slots.icon ? $(a.$slots, "icon", {}, void 0, void 0, 0) : e.icon && e.iconPosition === "left" ? (l(), i("span", U, f(e.icon), 1)) : u("", !0),
+          $(a.$slots, "default"),
+          e.icon && e.iconPosition === "right" ? (l(), i("span", Z, f(e.icon), 1)) : u("", !0)
         ], 64)),
-        e.badge !== null && e.badge !== void 0 ? (l(), o("span", {
+        e.badge !== null && e.badge !== void 0 ? (l(), i("span", {
           key: 2,
-          class: I(V.value)
+          class: J(X.value)
         }, [
-          C.value ? d("", !0) : (l(), o(v, { key: 0 }, [
-            J(c(E.value), 1)
+          N.value ? u("", !0) : (l(), i(p, { key: 0 }, [
+            K(f(E.value), 1)
           ], 64))
-        ], 2)) : d("", !0)
+        ], 2)) : u("", !0)
       ]),
       _: 3
     }, 16, ["type", "href", "target", "rel", "disabled", "aria-disabled", "aria-busy", "aria-label", "autofocus", "class", "style"]));
   }
-}), Z = (e) => {
-  e.component("Button", Button), e.component("CButton", Button);
-}, te = { install: Z, Button }, ae = "0.1.0";
+}), _ = (e) => {
+  e.component("Button", d), e.component("CButton", d), e.component("XButton", d);
+}, te = {
+  install: _,
+  Button: d,
+  CButton: d,
+  XButton: d
+}, ae = "0.1.1";
 export {
-  ee as Button,
-  ee as CButton,
-  ee as XButton,
+  d as Button,
+  d as CButton,
+  d as XButton,
   te as default,
   ae as version
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "barati-ui",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "A gorgeous, feature-rich Vue 3 button component library built with Vite and Tailwind CSS",
   "type": "module",
   "main": "./dist/index.js",