barati-ui 0.1.4 → 0.1.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.js +58 -53
  2. package/dist/style.css +7 -0
  3. package/package.json +2 -1
package/dist/index.js CHANGED
@@ -1,15 +1,20 @@
1
- (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)}})();
2
- 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";
3
- const Q = {
1
+ (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-red-400{--tw-bg-opacity: 1;background-color:rgb(248 113 113 / 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-4{padding:1rem}.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}}.barati[data-v-fd3fcd47]{background-color:red!important;border:2px solid blue!important}')),document.head.appendChild(r)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
2
+ import { ref as j, useAttrs as W, computed as n, openBlock as l, createBlock as I, resolveDynamicComponent as Y, mergeProps as q, unref as z, withCtx as G, createElementBlock as r, Fragment as x, createElementVNode as H, toDisplayString as b, createCommentVNode as u, renderSlot as D, normalizeClass as J, createTextVNode as K } from "vue";
3
+ const Q = (e, h) => {
4
+ const t = e.__vccOpts || e;
5
+ for (const [v, g] of h)
6
+ t[v] = g;
7
+ return t;
8
+ }, U = {
4
9
  key: 0,
5
10
  class: "whitespace-nowrap"
6
- }, U = {
11
+ }, Z = {
7
12
  key: 1,
8
13
  "aria-hidden": "true"
9
- }, Z = {
14
+ }, _ = {
10
15
  key: 2,
11
16
  "aria-hidden": "true"
12
- }, d = /* @__PURE__ */ Object.assign({ name: "CsisButton", inheritAttrs: !1 }, {
17
+ }, ee = /* @__PURE__ */ Object.assign({ name: "CsisButton", inheritAttrs: !1 }, {
13
18
  __name: "Button",
14
19
  props: {
15
20
  component: { type: [String, Object, Function], default: null },
@@ -69,21 +74,21 @@ const Q = {
69
74
  autofocus: { type: Boolean, default: !1 }
70
75
  },
71
76
  emits: ["click"],
72
- setup(e, { emit: z }) {
73
- const t = e, D = z, m = O(null), b = W(), L = n(() => {
74
- const { class: a, style: s, ...r } = b;
75
- return r;
76
- }), 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(() => {
77
+ setup(e, { emit: h }) {
78
+ const t = e, v = h, g = j(null), p = W(), L = n(() => {
79
+ const { class: a, style: s, ...i } = p;
80
+ return i;
81
+ }), c = n(() => t.disabled || t.loading), w = n(() => t.variant === "link"), m = n(() => t.component ? t.component : t.href ? "a" : t.tag), k = n(() => m.value === "button"), y = n(() => m.value === "a"), P = n(() => {
77
82
  if (t.rel) return t.rel;
78
83
  if (t.target === "_blank") return "noopener noreferrer";
79
- }), w = {
84
+ }), B = {
80
85
  xs: "h-7 px-2.5 text-xs gap-1",
81
86
  sm: "h-8 px-3.5 text-sm gap-1.5",
82
87
  md: "h-10 px-5 text-sm gap-2",
83
88
  lg: "h-11 px-6 text-base gap-2",
84
89
  xl: "h-14 px-8 text-lg gap-2.5",
85
90
  "2xl": "h-16 px-10 text-xl gap-3"
86
- }, k = {
91
+ }, S = {
87
92
  primary: "bg-violet-600 text-white shadow-md shadow-violet-600/25 hover:bg-violet-500 focus-visible:ring-violet-500/50",
88
93
  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",
89
94
  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 +101,14 @@ const Q = {
96
101
  info: "bg-sky-600 text-white shadow-md shadow-sky-600/25 hover:bg-sky-500 focus-visible:ring-sky-500/50",
97
102
  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",
98
103
  link: "cs-link text-violet-600 underline-offset-4 hover:underline focus-visible:ring-violet-400/40 bg-transparent shadow-none"
99
- }, B = {
104
+ }, C = {
100
105
  none: "rounded-none",
101
106
  sm: "rounded-sm",
102
107
  md: "rounded-lg",
103
108
  lg: "rounded-xl",
104
109
  xl: "rounded-2xl",
105
110
  full: "rounded-full"
106
- }, S = {
111
+ }, N = {
107
112
  primary: "rgba(139, 92, 246, 0.55)",
108
113
  gradient: "rgba(217, 70, 239, 0.5)",
109
114
  secondary: "rgba(148, 163, 184, 0.5)",
@@ -116,7 +121,7 @@ const Q = {
116
121
  info: "rgba(2, 132, 199, 0.55)",
117
122
  light: "rgba(15, 23, 42, 0.18)",
118
123
  link: "rgba(139, 92, 246, 0.4)"
119
- }, C = {
124
+ }, T = {
120
125
  danger: "bg-rose-500",
121
126
  success: "bg-emerald-500",
122
127
  info: "bg-sky-500",
@@ -124,81 +129,81 @@ const Q = {
124
129
  violet: "bg-violet-500",
125
130
  slate: "bg-slate-600"
126
131
  }, A = n(() => {
127
- const a = ["cs-btn", k[t.variant] || k.primary];
128
- 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;
132
+ const a = ["cs-btn", S[t.variant] || S.primary];
133
+ return w.value || (a.push(B[t.size] || B.md), a.push(C[t.rounded] || C.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"), c.value && a.push("is-disabled"), a;
129
134
  }), V = n(() => {
130
135
  if (t.glow)
131
- return { "--cs-glow": S[t.variant] || S.primary };
132
- }), 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(() => {
136
+ return { "--cs-glow": N[t.variant] || N.primary };
137
+ }), $ = n(() => t.badgeType === "dot"), X = n(() => $.value ? ["cs-badge-dot", "absolute", "-top-0.5", "-right-0.5", "bg-rose-500"] : ["cs-badge", "absolute", "-top-1", "-right-1", T[t.badgeType] || T.danger]), E = n(() => {
133
138
  const a = Number(t.badgeMax) || 99, s = Number(t.badge);
134
139
  return Number.isFinite(s) ? s > a ? `${a}+` : String(s) : String(t.badge ?? "");
135
140
  });
136
141
  function F(a) {
137
- const s = m.value;
138
- if (!s || y.value) return;
139
- 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");
140
- 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);
142
+ const s = g.value;
143
+ if (!s || w.value) return;
144
+ const i = s.getBoundingClientRect(), f = Math.max(i.width, i.height) * 2, O = a.clientX - i.left - f / 2, R = a.clientY - i.top - f / 2, o = document.createElement("span");
145
+ o.className = "cs-ripple", o.style.width = `${f}px`, o.style.height = `${f}px`, o.style.left = `${O}px`, o.style.top = `${R}px`, s.appendChild(o), window.setTimeout(() => o.remove(), 650);
141
146
  }
142
147
  function M(a) {
143
- if (g.value) {
148
+ if (c.value) {
144
149
  a.preventDefault(), a.stopPropagation();
145
150
  return;
146
151
  }
147
- t.ripple && F(a), D("click", a);
152
+ t.ripple && F(a), v("click", a);
148
153
  }
149
- return (a, s) => (l(), Y(q(h.value), G({
154
+ return (a, s) => (l(), I(Y(m.value), q({
150
155
  ref_key: "root",
151
- ref: m
156
+ ref: g
152
157
  }, L.value, {
153
- type: x.value ? e.type : void 0,
154
- href: v.value && e.href ? e.href : void 0,
155
- target: v.value && e.target ? e.target : void 0,
156
- rel: v.value ? P.value : void 0,
157
- disabled: x.value ? g.value : void 0,
158
- "aria-disabled": g.value || void 0,
158
+ type: k.value ? e.type : void 0,
159
+ href: y.value && e.href ? e.href : void 0,
160
+ target: y.value && e.target ? e.target : void 0,
161
+ rel: y.value ? P.value : void 0,
162
+ disabled: k.value ? c.value : void 0,
163
+ "aria-disabled": c.value || void 0,
159
164
  "aria-busy": e.loading || void 0,
160
165
  "aria-label": e.ariaLabel || void 0,
161
166
  autofocus: e.autofocus || void 0,
162
- class: [T(b).class, A.value],
163
- style: [T(b).style, V.value],
167
+ class: ["barati", [z(p).class, A.value]],
168
+ style: [z(p).style, V.value],
164
169
  onClick: M
165
170
  }), {
166
- default: H(() => [
167
- e.loading ? (l(), i(p, { key: 0 }, [
168
- s[0] || (s[0] = I("span", {
171
+ default: G(() => [
172
+ e.loading ? (l(), r(x, { key: 0 }, [
173
+ s[0] || (s[0] = H("span", {
169
174
  "aria-hidden": "true",
170
175
  class: "cs-spinner"
171
176
  }, null, -1)),
172
- e.loadingText ? (l(), i("span", Q, f(e.loadingText), 1)) : u("", !0)
173
- ], 64)) : (l(), i(p, { key: 1 }, [
174
- 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),
175
- $(a.$slots, "default"),
176
- e.icon && e.iconPosition === "right" ? (l(), i("span", Z, f(e.icon), 1)) : u("", !0)
177
+ e.loadingText ? (l(), r("span", U, b(e.loadingText), 1)) : u("", !0)
178
+ ], 64)) : (l(), r(x, { key: 1 }, [
179
+ a.$slots.icon ? D(a.$slots, "icon", {}, void 0, !0, 0) : e.icon && e.iconPosition === "left" ? (l(), r("span", Z, b(e.icon), 1)) : u("", !0),
180
+ D(a.$slots, "default", {}, void 0, !0),
181
+ e.icon && e.iconPosition === "right" ? (l(), r("span", _, b(e.icon), 1)) : u("", !0)
177
182
  ], 64)),
178
- e.badge !== null && e.badge !== void 0 ? (l(), i("span", {
183
+ e.badge !== null && e.badge !== void 0 ? (l(), r("span", {
179
184
  key: 2,
180
185
  class: J(X.value)
181
186
  }, [
182
- N.value ? u("", !0) : (l(), i(p, { key: 0 }, [
183
- K(f(E.value), 1)
187
+ $.value ? u("", !0) : (l(), r(x, { key: 0 }, [
188
+ K(b(E.value), 1)
184
189
  ], 64))
185
190
  ], 2)) : u("", !0)
186
191
  ]),
187
192
  _: 3
188
193
  }, 16, ["type", "href", "target", "rel", "disabled", "aria-disabled", "aria-busy", "aria-label", "autofocus", "class", "style"]));
189
194
  }
190
- }), _ = (e) => {
195
+ }), d = /* @__PURE__ */ Q(ee, [["__scopeId", "data-v-fd3fcd47"]]), te = (e) => {
191
196
  e.component("Button", d), e.component("CButton", d), e.component("XButton", d);
192
- }, te = {
193
- install: _,
197
+ }, ne = {
198
+ install: te,
194
199
  Button: d,
195
200
  CButton: d,
196
201
  XButton: d
197
- }, ae = "0.1.1";
202
+ }, se = "0.1.6";
198
203
  export {
199
204
  d as Button,
200
205
  d as CButton,
201
206
  d as XButton,
202
- te as default,
203
- ae as version
207
+ ne as default,
208
+ se as version
204
209
  };
package/dist/style.css CHANGED
@@ -259,6 +259,10 @@
259
259
  --tw-bg-opacity: 1;
260
260
  background-color: rgb(5 150 105 / var(--tw-bg-opacity, 1));
261
261
  }
262
+ .bg-red-400 {
263
+ --tw-bg-opacity: 1;
264
+ background-color: rgb(248 113 113 / var(--tw-bg-opacity, 1));
265
+ }
262
266
  .bg-rose-500 {
263
267
  --tw-bg-opacity: 1;
264
268
  background-color: rgb(244 63 94 / var(--tw-bg-opacity, 1));
@@ -321,6 +325,9 @@
321
325
  .to-rose-500 {
322
326
  --tw-gradient-to: #f43f5e var(--tw-gradient-to-position);
323
327
  }
328
+ .p-4 {
329
+ padding: 1rem;
330
+ }
324
331
  .p-8 {
325
332
  padding: 2rem;
326
333
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "barati-ui",
3
- "version": "0.1.4",
3
+ "version": "0.1.6",
4
4
  "description": "A gorgeous, feature-rich Vue 3 button component library built with Vite and Tailwind CSS",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
@@ -37,6 +37,7 @@
37
37
  "dev": "vite",
38
38
  "build": "vite build && npm run build:css",
39
39
  "build:css": "postcss src/style.css -o dist/style.css",
40
+ "prepublishOnly": "npm run build",
40
41
  "preview": "vite preview"
41
42
  },
42
43
  "peerDependencies": {