veylan-component-library 1.3.1 → 1.3.2

package/dist/fusion-component-library.es.js

@@ -1,4 +1,4 @@
-import { defineComponent as w, createElementBlock as r, createCommentVNode as s, openBlock as a, withModifiers as B, createElementVNode as e, renderSlot as q, toDisplayString as u, normalizeStyle as N, normalizeClass as _, createBlock as C, createTextVNode as c, Fragment as b, renderList as z, createVNode as M, createStaticVNode as v, ref as S, computed as V, withDirectives as E, vModelText as P } from "vue";
+import { defineComponent as w, createElementBlock as r, createCommentVNode as s, openBlock as a, withModifiers as B, createElementVNode as e, renderSlot as F, toDisplayString as u, normalizeStyle as N, normalizeClass as _, createBlock as C, createTextVNode as c, Fragment as b, renderList as z, createVNode as M, createStaticVNode as v, ref as S, computed as V, withDirectives as E, vModelText as P } from "vue";
 import { ChevronDown as U, Share2 as G, ArrowRight as O, ArrowLeft as W, MoreHorizontal as R, ToyBrick as Z, MessageSquare as $, Home as Q } from "lucide-vue-next";
 const K = /* @__PURE__ */ w({
   __name: "BaseModal",
@@ -45,7 +45,7 @@ function ee(n, t, l, o, x, f) {
         /* TEXT */
       ),
       s(" Content Slot "),
-      q(n.$slots, "default"),
+      F(n.$slots, "default"),
       s(" Action Buttons "),
       e("div", X, [
         e(
@@ -130,7 +130,7 @@ function se(n, t, l, o, x, f) {
       "stroke-width": 1.5
     })) : s("v-if", !0),
     s(" Text Slot "),
-    q(n.$slots, "default", {}, () => [
+    F(n.$slots, "default", {}, () => [
       t[0] || (t[0] = c(
         "Button",
         -1
@@ -478,11 +478,11 @@ const Vt = /* @__PURE__ */ h(oe, [["render", ye], ["__file", "/root/app/code/src
   key: 0,
   class: "text-black",
   style: { "font-size": "16px", "font-weight": "600", "line-height": "20px" }
-}, De = {
+}, qe = {
   key: 1,
   class: "text-black",
   style: { "font-size": "12px", "font-weight": "400", "line-height": "18px" }
-}, qe = {
+}, Fe = {
   key: 2,
   class: "flex items-end mt-auto",
   style: { padding: "0 16px", gap: "4px" }
@@ -496,7 +496,7 @@ const Vt = /* @__PURE__ */ h(oe, [["render", ye], ["__file", "/root/app/code/src
 }, Ae = {
   class: "absolute left-0 top-0 flex items-center justify-center text-white",
   style: { width: "24px", height: "24px", "font-size": "8px", "font-weight": "500", "line-height": "24px", "letter-spacing": "-0.08px" }
-}, Fe = {
+}, De = {
   style: { width: "12px", height: "12px" },
   viewBox: "0 0 12 12",
   fill: "none",
@@ -575,14 +575,14 @@ function Te(n, t, l, o, x, f) {
         )) : s("v-if", !0),
         l.description ? (a(), r(
           "p",
-          De,
+          qe,
           u(l.description),
           1
           /* TEXT */
         )) : s("v-if", !0)
       ])) : s("v-if", !0),
       s(" Footer Section "),
-      l.showFooter ? (a(), r("div", qe, [
+      l.showFooter ? (a(), r("div", Fe, [
         e("div", Le, [
           s(" Member Avatars "),
           l.showMembers ? (a(), r("div", He, [
@@ -634,7 +634,7 @@ function Te(n, t, l, o, x, f) {
             class: "flex justify-center items-center flex-shrink-0 rounded-full bg-black hover:bg-gray-600 transition-colors",
             style: { width: "24px", height: "24px" }
           }, [
-            (a(), r("svg", Fe, t[3] || (t[3] = [
+            (a(), r("svg", De, t[3] || (t[3] = [
               e(
                 "path",
                 {
@@ -681,13 +681,13 @@ const Et = /* @__PURE__ */ h(we, [["render", Te], ["__file", "/root/app/code/src
 function Ve(n, t, l, o, x, f) {
   return a(), r("div", Ne, [
     s(" Semantic Colors "),
-    t[0] || (t[0] = v('<div class="flex flex-col gap-4"><h3 class="text-lg font-semibold text-gray-900">Color Styles - Semantic</h3><div class="grid grid-cols-2 md:grid-cols-4 gap-4"><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-information"></div><p class="text-xs font-medium text-black">Information</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-information</code><code class="text-xs text-gray-600">#00DADA</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-success"></div><p class="text-xs font-medium text-black">Success</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-success</code><code class="text-xs text-gray-600">#A2DA00</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-warning"></div><p class="text-xs font-medium text-black">Warning</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-warning</code><code class="text-xs text-gray-600">#FFD700</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-error"></div><p class="text-xs font-medium text-black">Error</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-error</code><code class="text-xs text-gray-600">#FF6B35</code></div></div></div>', 1)),
+    t[0] || (t[0] = v('<div class="flex flex-col gap-4"><h3 class="text-lg font-semibold text-gray-900">Color Styles - Semantic</h3><div class="grid grid-cols-2 md:grid-cols-4 gap-4"><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-information"></div><p class="text-xs font-medium text-black">Information</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-information</code><code class="text-xs text-gray-600">#00DADA</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-success"></div><p class="text-xs font-medium text-black">Success</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-success</code><code class="text-xs text-gray-600">#C3FF00</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-warning"></div><p class="text-xs font-medium text-black">Warning</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-warning</code><code class="text-xs text-gray-600">#FFD700</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-error"></div><p class="text-xs font-medium text-black">Error</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-error</code><code class="text-xs text-gray-600">#FF6B35</code></div></div></div>', 1)),
     s(" Base Colors "),
     t[1] || (t[1] = v('<div class="flex flex-col gap-4"><h3 class="text-lg font-semibold text-gray-900">Base Colors</h3><div class="grid grid-cols-2 md:grid-cols-4 gap-4"><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-white border border-gray-200"></div><p class="text-xs font-medium text-black">White</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-white</code><code class="text-xs text-gray-600">#FFFFFF</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-black"></div><p class="text-xs font-medium text-black">Black</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-black</code><code class="text-xs text-gray-600">#000000</code></div></div></div>', 1)),
     s(" Gray Scale "),
-    t[2] || (t[2] = v('<div class="flex flex-col gap-4"><h3 class="text-lg font-semibold text-gray-900">Gray Scale</h3><div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-7 gap-4"><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-gray-600"></div><p class="text-xs font-medium text-black">Gray 600</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-gray-600</code><code class="text-xs text-gray-600">#2D2D2D</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-gray-500"></div><p class="text-xs font-medium text-black">Gray 500</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-gray-500</code><code class="text-xs text-gray-600">#3D3D3D</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-gray-400"></div><p class="text-xs font-medium text-black">Gray 400</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-gray-400</code><code class="text-xs text-gray-600">#5D5D5D</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-gray-300"></div><p class="text-xs font-medium text-black">Gray 300</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-gray-300</code><code class="text-xs text-gray-600">#7D7D7D</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-gray-200"></div><p class="text-xs font-medium text-black">Gray 200</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-gray-200</code><code class="text-xs text-gray-600">#9D9D9D</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-gray-100"></div><p class="text-xs font-medium text-black">Gray 100</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-gray-100</code><code class="text-xs text-gray-600">#BDBDBD</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-gray-50 border border-gray-200"></div><p class="text-xs font-medium text-black">Gray 50</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-gray-50</code><code class="text-xs text-gray-600">#DDDDDD</code></div></div></div>', 1)),
+    t[2] || (t[2] = v('<div class="flex flex-col gap-4"><h3 class="text-lg font-semibold text-gray-900">Gray Scale</h3><div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-7 gap-4"><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-gray-600"></div><p class="text-xs font-medium text-black">Gray 600</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-gray-600</code><code class="text-xs text-gray-600">#303030</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-gray-500"></div><p class="text-xs font-medium text-black">Gray 500</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-gray-500</code><code class="text-xs text-gray-600">#454545</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-gray-400"></div><p class="text-xs font-medium text-black">Gray 400</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-gray-400</code><code class="text-xs text-gray-600">#5D5D5D</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-gray-300"></div><p class="text-xs font-medium text-black">Gray 300</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-gray-300</code><code class="text-xs text-gray-600">#8F8F8F</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-gray-200"></div><p class="text-xs font-medium text-black">Gray 200</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-gray-200</code><code class="text-xs text-gray-600">#C8C8C8</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-gray-100"></div><p class="text-xs font-medium text-black">Gray 100</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-gray-100</code><code class="text-xs text-gray-600">#E8E8E8</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-gray-50 border border-gray-200"></div><p class="text-xs font-medium text-black">Gray 50</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-gray-50</code><code class="text-xs text-gray-600">#F6F6F6</code></div></div></div>', 1)),
     s(" Eletric Green Palette "),
-    t[3] || (t[3] = v('<div class="flex flex-col gap-4"><h3 class="text-lg font-semibold text-gray-900">Eletric Green</h3><div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-4"><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-eletric-green-50"></div><p class="text-xs font-medium text-black">Eletric Green 50</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-eletric-green-50</code><code class="text-xs text-gray-600">#DFF5A0</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-eletric-green"></div><p class="text-xs font-medium text-black">Eletric Green</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-eletric-green</code><code class="text-xs text-gray-600">#A2DA00</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-eletric-green--25"></div><p class="text-xs font-medium text-black">Eletric Green -25</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-eletric-green--25</code><code class="text-xs text-gray-600">#85BA00</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-eletric-green--50"></div><p class="text-xs font-medium text-black">Eletric Green -50</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-eletric-green--50</code><code class="text-xs text-gray-600">#6A9A00</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-eletric-green--75"></div><p class="text-xs font-medium text-black">Eletric Green -75</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-eletric-green--75</code><code class="text-xs text-gray-600">#527A00</code></div></div></div>', 1)),
+    t[3] || (t[3] = v('<div class="flex flex-col gap-4"><h3 class="text-lg font-semibold text-gray-900">Eletric Green</h3><div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-4"><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-eletric-green-50"></div><p class="text-xs font-medium text-black">Eletric Green 50</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-eletric-green-50</code><code class="text-xs text-gray-600">#ECFFAC</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-eletric-green"></div><p class="text-xs font-medium text-black">Eletric Green</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-eletric-green</code><code class="text-xs text-gray-600">#C3FF00</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-eletric-green--25"></div><p class="text-xs font-medium text-black">Eletric Green -25</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-eletric-green--25</code><code class="text-xs text-gray-600">#8CB700</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-eletric-green--50"></div><p class="text-xs font-medium text-black">Eletric Green -50</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-eletric-green--50</code><code class="text-xs text-gray-600">#638100</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-eletric-green--75"></div><p class="text-xs font-medium text-black">Eletric Green -75</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-eletric-green--75</code><code class="text-xs text-gray-600">#354500</code></div></div></div>', 1)),
     s(" Eletric Blue Palette "),
     t[4] || (t[4] = v('<div class="flex flex-col gap-4"><h3 class="text-lg font-semibold text-gray-900">Eletric Blue</h3><div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-4"><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-eletric-blue-50"></div><p class="text-xs font-medium text-black">Eletric Blue 50</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-eletric-blue-50</code><code class="text-xs text-gray-600">#A0F5F5</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-eletric-blue"></div><p class="text-xs font-medium text-black">Eletric Blue</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-eletric-blue</code><code class="text-xs text-gray-600">#00DADA</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-eletric-blue--25"></div><p class="text-xs font-medium text-black">Eletric Blue -25</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-eletric-blue--25</code><code class="text-xs text-gray-600">#00BABA</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-eletric-blue--50"></div><p class="text-xs font-medium text-black">Eletric Blue -50</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-eletric-blue--50</code><code class="text-xs text-gray-600">#009A9A</code></div><div class="flex flex-col gap-2"><div class="w-full h-20 rounded-lg bg-eletric-blue--75"></div><p class="text-xs font-medium text-black">Eletric Blue -75</p><code class="text-xs bg-gray-100 px-2 py-1 rounded">bg-eletric-blue--75</code><code class="text-xs text-gray-600">#007A7A</code></div></div></div>', 1)),
     s(" Usage Examples "),
@@ -712,7 +712,7 @@ const Pt = /* @__PURE__ */ h(je, [["render", Ve], ["__file", "/root/app/code/src
     })), H = (p) => g.value.some((m) => m.email === p.email), A = (p) => {
       const m = g.value.findIndex((y) => y.email === p.email);
       m > -1 ? g.value.splice(m, 1) : g.value.push(p), d.value = "";
-    }, F = (p) => {
+    }, D = (p) => {
       const m = g.value.findIndex((y) => y.email === p.email);
       m > -1 && g.value.splice(m, 1);
     }, T = (p) => {
@@ -720,7 +720,7 @@ const Pt = /* @__PURE__ */ h(je, [["render", Ve], ["__file", "/root/app/code/src
       m > -1 && k.value.splice(m, 1);
     }, I = () => {
       f.value?.focus();
-    }, D = { props: o, emit: x, hiddenInput: f, showDropdown: i, searchQuery: d, selectedUsers: g, collaborators: k, availableUsers: L, isUserSelected: H, toggleUser: A, removeUser: F, removeCollaborator: T, focusInput: I, toggleDropdown: () => {
+    }, q = { props: o, emit: x, hiddenInput: f, showDropdown: i, searchQuery: d, selectedUsers: g, collaborators: k, availableUsers: L, isUserSelected: H, toggleUser: A, removeUser: D, removeCollaborator: T, focusInput: I, toggleDropdown: () => {
       i.value = !i.value, i.value && I();
     }, handleBlur: () => {
       setTimeout(() => {
@@ -733,7 +733,7 @@ const Pt = /* @__PURE__ */ h(je, [["render", Ve], ["__file", "/root/app/code/src
         k.value.some((m) => m.email === p.email) || k.value.push(p);
       }), x("add", g.value, k.value), g.value = [], d.value = "", i.value = !1), x("close");
     } };
-    return Object.defineProperty(D, "__isScriptSetup", { enumerable: !1, value: !0 }), D;
+    return Object.defineProperty(q, "__isScriptSetup", { enumerable: !1, value: !0 }), q;
   }
 }), Pe = { class: "bg-white rounded-2xl w-full max-w-[630px] p-8 shadow-xl" }, Ue = { class: "relative mb-6" }, Ge = { class: "flex flex-wrap gap-2 flex-1" }, Oe = ["onClick"], We = {
   key: 0,
@@ -953,7 +953,7 @@ const Ut = /* @__PURE__ */ h(Ee, [["render", tt], ["__scopeId", "data-v-f6014a35
     t();
     const o = l, i = { emit: o, handleItemClick: (d) => {
       o("item-click", d);
-    }, getIconColor: (d) => d ? "#A2DA00" : "#FFFFFF", get Home() {
+    }, getIconColor: (d) => d ? "#C3FF00" : "#FFFFFF", get Home() {
       return Q;
     }, get MessageSquare() {
       return $;
@@ -1360,7 +1360,7 @@ const $t = /* @__PURE__ */ h(zt, [["render", Bt], ["__file", "/root/app/code/src
   preserveAspectRatio: "xMidYMid meet",
   viewBox: "0 0 24 24"
 };
-function Dt(n, t) {
+function qt(n, t) {
   return a(), r("svg", It, t[0] || (t[0] = [
     e(
       "path",
@@ -1374,7 +1374,7 @@ function Dt(n, t) {
     )
   ]));
 }
-const Qt = /* @__PURE__ */ h(Mt, [["render", Dt], ["__file", "/root/app/code/src/components/icons/IconTooling.vue"]]);
+const Qt = /* @__PURE__ */ h(Mt, [["render", qt], ["__file", "/root/app/code/src/components/icons/IconTooling.vue"]]);
 export {
   jt as BaseModal,
   Nt as ButtonComponent,