vx-vue 0.0.1 → 0.0.2

package/dist/style.css

@@ -0,0 +1 @@
+.messagetoast-fade-enter-from,.messagetoast-fade-leave-to{@apply opacity-0 transform-gpu -translate-y-10;}.messagetoast-fade-enter-to,.messagetoast-fade-leave-from{@apply opacity-100 translate-y-0;}.messagetoast-fade-enter-active,.messagetoast-fade-leave-active{@apply transition-all duration-300;}tbody tr[data-v-c18eb3d8]:nth-of-type(odd){@apply bg-slate-100 text-slate-700;}tbody tr[data-v-c18eb3d8]:nth-of-type(2n){@apply bg-slate-200 text-slate-800;}tbody tr:nth-of-type(odd) td.active[data-v-c18eb3d8]{@apply bg-amber-100 text-amber-700;}tbody tr:nth-of-type(2n) td.active[data-v-c18eb3d8]{@apply bg-amber-200 text-amber-800;}thead th.active[data-v-c18eb3d8]{@apply bg-amber-800;}

package/dist/vxvue.es.js

@@ -1,6 +1,6 @@
-import { openBlock as s, createElementBlock as l, createElementVNode as n, ref as c, computed as V, useAttrs as _, normalizeClass as k, mergeProps as A, withModifiers as j, createBlock as C, unref as b, renderSlot as h, toDisplayString as v, createCommentVNode as m, Fragment as x, renderList as L, createVNode as M, Transition as z, withCtx as B, createTextVNode as $, nextTick as N } from "vue";
-function O(t, a) {
-  return s(), l("svg", {
+import { openBlock as a, createElementBlock as o, createElementVNode as n, ref as g, computed as _, useAttrs as T, normalizeClass as f, mergeProps as N, withModifiers as C, createBlock as B, unref as $, renderSlot as x, toDisplayString as h, createCommentVNode as y, Fragment as b, renderList as k, createVNode as P, Transition as L, withCtx as j, createTextVNode as w, nextTick as O, watch as V, onMounted as z, resolveDynamicComponent as D } from "vue";
+function I(t, i) {
+  return a(), o("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     fill: "none",
     viewBox: "0 0 24 24",
@@ -15,8 +15,8 @@ function O(t, a) {
     })
   ]);
 }
-function E(t, a) {
-  return s(), l("svg", {
+function F(t, i) {
+  return a(), o("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     fill: "none",
     viewBox: "0 0 24 24",
@@ -36,76 +36,76 @@ function E(t, a) {
     })
   ]);
 }
-const P = ["value", "type"], te = /* @__PURE__ */ Object.assign({ inheritAttrs: !1 }, {
+const E = ["value", "type"], Ee = /* @__PURE__ */ Object.assign({ inheritAttrs: !1 }, {
   __name: "password-input",
   props: ["modelValue"],
   emits: ["update:modelValue"],
-  setup(t, { emit: a }) {
-    const r = c(!1), i = V(() => {
-      let e = Object.assign({}, _());
+  setup(t, { emit: i }) {
+    const s = g(!1), l = _(() => {
+      let e = Object.assign({}, T());
       return delete e.class, e;
     });
-    return (e, o) => (s(), l("div", {
-      class: k("inline-block relative " + _().class)
+    return (e, v) => (a(), o("div", {
+      class: f("inline-block relative " + T().class)
     }, [
-      n("input", A({
+      n("input", N({
         value: t.modelValue,
-        type: r.value ? "text" : "password",
-        onInput: o[0] || (o[0] = (u) => a("update:modelValue", u.target.value))
-      }, i.value, { class: "block pr-10 w-full form-input peer" }), null, 16, P),
+        type: s.value ? "text" : "password",
+        onInput: v[0] || (v[0] = (u) => i("update:modelValue", u.target.value))
+      }, l.value, { class: "block pr-10 w-full form-input peer" }), null, 16, E),
       n("button", {
-        onClick: o[1] || (o[1] = j((u) => r.value = !r.value, ["stop"])),
+        onClick: v[1] || (v[1] = C((u) => s.value = !s.value, ["stop"])),
         class: "flex absolute inset-y-0 right-0 items-center pr-3 text-brand-700 hover:text-brand"
       }, [
-        r.value ? (s(), C(b(O), {
+        s.value ? (a(), B($(I), {
           key: 0,
           class: "w-5 h-5"
-        })) : (s(), C(b(E), {
+        })) : (a(), B($(F), {
           key: 1,
           class: "w-5 h-5"
         }))
       ]),
-      h(e.$slots, "default")
+      x(e.$slots, "default")
     ], 2));
   }
-}), T = ["value"], F = {
+}), q = ["value"], R = {
   key: 0,
   disabled: "",
   value: ""
-}, I = ["value", "selected"], se = {
+}, U = ["value", "selected"], G = {
   __name: "form-select",
   props: { options: Array, modelValue: [String, Number], disabledLabel: String },
   emits: ["update:modelValue"],
-  setup(t, { emit: a }) {
-    return (r, i) => (s(), l("select", A(r.$attrs, {
+  setup(t, { emit: i }) {
+    return (s, l) => (a(), o("select", N(s.$attrs, {
       value: t.modelValue,
       class: "form-select",
-      onChange: i[0] || (i[0] = (e) => a("update:modelValue", e.target.value))
+      onChange: l[0] || (l[0] = (e) => i("update:modelValue", e.target.value))
     }), [
-      t.disabledLabel ? (s(), l("option", F, v(t.disabledLabel), 1)) : m("", !0),
-      (s(!0), l(x, null, L(t.options, (e) => (s(), l("option", {
+      t.disabledLabel ? (a(), o("option", R, h(t.disabledLabel), 1)) : y("", !0),
+      (a(!0), o(b, null, k(t.options, (e) => (a(), o("option", {
         value: e.key !== void 0 ? e.key : e.label || e,
         selected: (e.key !== void 0 ? e.key : e.label || e) === t.modelValue
-      }, v(e.label || e), 9, I))), 256))
-    ], 16, T));
+      }, h(e.label || e), 9, U))), 256))
+    ], 16, q));
   }
-}, D = {
+}, H = {
   key: 0,
   class: "fixed inset-0 z-50 bg-black bg-opacity-50 backdrop-blur-sm",
   "aria-hidden": "true"
-}, q = {
+}, J = {
   key: 0,
   class: "overflow-y-auto fixed inset-0 z-50"
-}, G = { class: "flex justify-center items-end px-4 pt-4 pb-20 min-h-screen text-center sm:block sm:p-0" }, H = { key: 0 }, J = /* @__PURE__ */ n("span", {
+}, K = { class: "flex justify-center items-end px-4 pt-4 pb-20 min-h-screen text-center sm:block sm:p-0" }, Q = { key: 0 }, W = /* @__PURE__ */ n("span", {
   class: "hidden sm:inline-block sm:h-screen sm:align-middle",
   "aria-hidden": "true"
-}, "​", -1), K = { class: "inline-block overflow-hidden text-left align-bottom bg-white rounded shadow-xl transition-all transform sm:my-8 sm:w-full sm:max-w-sm sm:align-middle lg:max-w-lg" }, Q = { class: "px-4 pb-4 mt-4 sm:px-6 sm:pb-6 sm:mt-5" }, R = { class: "flex flex-row items-center" }, U = { class: "flex-shrink-0" }, W = { class: "flex-grow text-center" }, X = ["onClick"], le = {
+}, "​", -1), X = { class: "inline-block overflow-hidden text-left align-bottom bg-white rounded shadow-xl transition-all transform sm:my-8 sm:w-full sm:max-w-sm sm:align-middle lg:max-w-lg" }, Y = { class: "px-4 pb-4 mt-4 sm:px-6 sm:pb-6 sm:mt-5" }, Z = { class: "flex flex-row items-center" }, ee = { class: "flex-shrink-0" }, te = { class: "flex-grow text-center" }, se = ["onClick"], qe = {
   __name: "confirm",
   props: {
     buttons: {
       type: [Object, Array],
       default: { label: "Ok" },
-      validator: (t) => Array.isArray(t) && t.length <= 2 && t.filter((a) => a.label !== "undefined" && a.value !== "undefined").length === t.length || t.label !== void 0 && t.value !== void 0
+      validator: (t) => Array.isArray(t) && t.length <= 2 && t.filter((i) => i.label !== "undefined" && i.value !== "undefined").length === t.length || t.label !== void 0 && t.value !== void 0
     },
     headerClass: {
       type: String,
@@ -116,65 +116,458 @@ const P = ["value", "type"], te = /* @__PURE__ */ Object.assign({ inheritAttrs:
       default: "button"
     }
   },
-  setup(t, { expose: a }) {
-    const r = t, i = c(""), e = c(""), o = c(!1);
-    let u = null, g = null;
-    const S = V(() => Array.isArray(r.buttons) ? r.buttons : [r.buttons]), y = c(null);
-    return a({ open: (d, w) => (i.value = d, e.value = w, o.value = !0, N(() => y.value.firstElementChild.focus()), new Promise((f, p) => {
-      u = f, g = p;
-    })) }), (d, w) => (s(), l(x, null, [
-      o.value ? (s(), l("div", D)) : m("", !0),
-      M(z, { name: "appear" }, {
-        default: B(() => [
-          o.value ? (s(), l("div", q, [
-            n("div", G, [
-              o.value ? (s(), l("div", H, [
-                J,
-                n("div", K, [
-                  i.value ? (s(), l("h3", {
+  setup(t, { expose: i }) {
+    const s = t, l = g(""), e = g(""), v = g(!1);
+    let u = null, c = null;
+    const d = _(() => Array.isArray(s.buttons) ? s.buttons : [s.buttons]), r = g(null);
+    return i({ open: (p, M) => (l.value = p, e.value = M, v.value = !0, O(() => r.value.firstElementChild.focus()), new Promise((A, S) => {
+      u = A, c = S;
+    })) }), (p, M) => (a(), o(b, null, [
+      v.value ? (a(), o("div", H)) : y("", !0),
+      P(L, { name: "appear" }, {
+        default: j(() => [
+          v.value ? (a(), o("div", J, [
+            n("div", K, [
+              v.value ? (a(), o("div", Q, [
+                W,
+                n("div", X, [
+                  l.value ? (a(), o("h3", {
                     key: 0,
-                    class: k(["py-4 pt-4 text-lg font-medium text-center sm:py-6", t.headerClass])
+                    class: f(["py-4 pt-4 text-lg font-medium text-center sm:py-6", t.headerClass])
                   }, [
-                    h(d.$slots, "title", { title: i.value }, () => [
-                      $(v(i.value), 1)
+                    x(p.$slots, "title", { title: l.value }, () => [
+                      w(h(l.value), 1)
                     ])
-                  ], 2)) : m("", !0),
-                  n("div", Q, [
-                    n("div", R, [
-                      n("div", U, [
-                        h(d.$slots, "icon")
+                  ], 2)) : y("", !0),
+                  n("div", Y, [
+                    n("div", Z, [
+                      n("div", ee, [
+                        x(p.$slots, "icon")
                       ]),
-                      n("p", W, [
-                        h(d.$slots, "default", { message: e.value }, () => [
-                          $(v(e.value), 1)
+                      n("p", te, [
+                        x(p.$slots, "default", { message: e.value }, () => [
+                          w(h(e.value), 1)
                         ])
                       ])
                     ]),
                     n("div", {
                       class: "flex justify-center mt-5 space-x-2 sm:mt-6",
                       ref_key: "buttonsContainer",
-                      ref: y
+                      ref: r
                     }, [
-                      (s(!0), l(x, null, L(S.value, (f, p) => (s(), l("button", {
-                        class: k([t.buttonClass, f.class]),
-                        onClick: j((Z) => {
-                          o.value = !1, p === 0 ? b(u)() : b(g)();
+                      (a(!0), o(b, null, k(d.value, (A, S) => (a(), o("button", {
+                        class: f([t.buttonClass, A.class]),
+                        onClick: C((Ie) => {
+                          v.value = !1, S === 0 ? $(u)() : $(c)();
                         }, ["prevent"])
-                      }, v(f.label), 11, X))), 256))
+                      }, h(A.label), 11, se))), 256))
                     ], 512)
                   ])
                 ])
-              ])) : m("", !0)
+              ])) : y("", !0)
             ])
-          ])) : m("", !0)
+          ])) : y("", !0)
         ]),
         _: 3
       })
     ], 64));
   }
+}, le = ["aria-checked"], ae = ["checked"], Re = {
+  __name: "form-switch",
+  props: ["modelValue"],
+  emits: ["update:modelValue"],
+  setup(t, { emit: i }) {
+    const s = t, l = _(() => s.modelValue ? "bg-vxvue" : "bg-slate-200"), e = _(() => s.modelValue ? "translate-x-5" : "translate-x-0"), v = _(() => {
+      let u = Object.assign({}, T());
+      return delete u.class, u;
+    });
+    return (u, c) => (a(), o(b, null, [
+      n("label", {
+        class: f(u.$attrs.class)
+      }, [
+        n("span", {
+          class: f([l.value, "inline-flex relative flex-shrink-0 w-11 h-6 rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out cursor-pointer focus:ring-2 focus:ring-offset-2 focus:outline-none focus:ring-vxvue"]),
+          role: "switch",
+          "aria-checked": !!t.modelValue
+        }, [
+          n("span", {
+            "aria-hidden": "true",
+            class: f([e.value, "inline-block w-5 h-5 bg-white rounded-full ring-0 shadow transition duration-200 ease-in-out transform pointer-events-none"])
+          }, null, 2),
+          n("input", N({
+            class: "hidden",
+            value: "1",
+            type: "checkbox",
+            onChange: c[0] || (c[0] = (d) => i("update:modelValue", d.target.checked))
+          }, v.value, { checked: t.modelValue }), null, 16, ae)
+        ], 10, le)
+      ], 2),
+      x(u.$slots, "default")
+    ], 64));
+  }
+};
+function ne(t, i) {
+  return a(), o("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    fill: "currentColor",
+    "aria-hidden": "true"
+  }, [
+    n("path", {
+      "fill-rule": "evenodd",
+      d: "M7.72 12.53a.75.75 0 010-1.06l7.5-7.5a.75.75 0 111.06 1.06L9.31 12l6.97 6.97a.75.75 0 11-1.06 1.06l-7.5-7.5z",
+      "clip-rule": "evenodd"
+    })
+  ]);
+}
+function re(t, i) {
+  return a(), o("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    fill: "currentColor",
+    "aria-hidden": "true"
+  }, [
+    n("path", {
+      "fill-rule": "evenodd",
+      d: "M16.28 11.47a.75.75 0 010 1.06l-7.5 7.5a.75.75 0 01-1.06-1.06L14.69 12 7.72 5.03a.75.75 0 011.06-1.06l7.5 7.5z",
+      "clip-rule": "evenodd"
+    })
+  ]);
+}
+function oe(t, i) {
+  return a(), o("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    fill: "currentColor",
+    "aria-hidden": "true"
+  }, [
+    n("path", {
+      "fill-rule": "evenodd",
+      d: "M5.47 5.47a.75.75 0 011.06 0L12 10.94l5.47-5.47a.75.75 0 111.06 1.06L13.06 12l5.47 5.47a.75.75 0 11-1.06 1.06L12 13.06l-5.47 5.47a.75.75 0 01-1.06-1.06L10.94 12 5.47 6.53a.75.75 0 010-1.06z",
+      "clip-rule": "evenodd"
+    })
+  ]);
+}
+const ie = {
+  "aria-live": "assertive",
+  class: "flex fixed inset-0 z-50 items-start py-6 px-4 pointer-events-none sm:p-6"
+}, ue = { class: "flex flex-col items-center space-y-4 w-full" }, de = { class: "p-4" }, ce = { class: "flex items-start" }, ve = { class: "flex-shrink-0" }, pe = { class: "flex-1 pt-0.5 ml-3 w-0" }, fe = { class: "font-bold" }, he = { class: "mt-1" }, me = { class: "flex flex-shrink-0 ml-4" }, xe = /* @__PURE__ */ n("span", { class: "sr-only" }, "Close", -1), Ue = /* @__PURE__ */ Object.assign({
+  inheritAttrs: !1
+}, {
+  __name: "message-toast",
+  props: {
+    title: String,
+    message: [String, Array],
+    timeout: { type: Number, default: 5e3 },
+    active: { type: Boolean, default: !1 }
+  },
+  emits: ["timeout", "close"],
+  setup(t, { emit: i }) {
+    const s = t, l = g(null), e = _(() => typeof s.message == "string" ? [s.message] : s.message), v = () => {
+      window.clearTimeout(l.value), s.active && s.timeout && (l.value = window.setTimeout(() => {
+        i("timeout");
+      }, s.timeout));
+    };
+    return V(() => s.active, v), z(v), (u, c) => (a(), o("div", ie, [
+      n("div", ue, [
+        P(L, { name: "messagetoast-fade" }, {
+          default: j(() => [
+            t.active ? (a(), o("div", {
+              key: 0,
+              class: f(["overflow-hidden w-full max-w-sm rounded-md ring-1 ring-black ring-opacity-5 shadow-lg pointer-events-auto", u.$attrs.class])
+            }, [
+              n("div", de, [
+                n("div", ce, [
+                  n("div", ve, [
+                    x(u.$slots, "icon")
+                  ]),
+                  n("div", pe, [
+                    n("p", fe, [
+                      x(u.$slots, "title", {}, () => [
+                        w(h(t.title), 1)
+                      ])
+                    ]),
+                    (a(!0), o(b, null, k(e.value, (d) => (a(), o("p", he, [
+                      x(u.$slots, "default", {}, () => [
+                        w(h(d), 1)
+                      ])
+                    ]))), 256))
+                  ]),
+                  n("div", me, [
+                    n("button", {
+                      onClick: c[0] || (c[0] = (d) => i("close")),
+                      class: "inline-flex text-white bg-black bg-opacity-20 rounded-sm focus:ring-2 focus:outline-none hover:text-stone-200 focus:ring-stone-200"
+                    }, [
+                      xe,
+                      P($(oe), { class: "w-5 h-5" })
+                    ])
+                  ])
+                ])
+              ])
+            ], 2)) : y("", !0)
+          ]),
+          _: 3
+        })
+      ])
+    ]));
+  }
+}), ge = { class: "flex justify-between items-center px-4 sm:px-0" }, be = { class: "flex flex-1 -mt-px w-0" }, ye = ["onClick"], _e = { class: "hidden md:flex md:-mt-px" }, we = { class: "flex flex-1 justify-end -mt-px w-0" }, ke = ["onClick"], Ge = {
+  __name: "pagination",
+  props: {
+    page: { type: Number, default: 1 },
+    total: { type: Number, default: 1 },
+    perPage: {
+      type: Number,
+      default: 20,
+      validator(t) {
+        return t >= 1;
+      }
+    },
+    showNavButtons: { type: Boolean, default: !0 },
+    prevText: { type: String, default: "Previous" },
+    nextText: { type: String, default: "Next" },
+    showAllPages: { type: Boolean, default: !1 },
+    markerPosition: {
+      type: String,
+      default: "above",
+      validator(t) {
+        return ["above", "below"].indexOf(t) !== -1;
+      }
+    }
+  },
+  emits: ["update:page"],
+  setup(t, { emit: i }) {
+    const s = t, l = g(Math.ceil(s.total / s.perPage)), e = g(null), v = _(() => s.markerPosition === "above" ? "border-t-2 pt-4" : "border-b-2 pb-4"), u = _(() => {
+      let r = [1];
+      if (s.showAllPages || l.value <= 7) {
+        for (let m = 2; m <= l.value; ++m)
+          r.push(m);
+        return r;
+      }
+      return e.value >= l.value ? r.push("dots", e.value - 2, e.value - 1) : e.value - 1 && e.value - 1 > 1 && (e.value > 1 && r.push("dots"), r.push(e.value - 1)), e.value > 1 && r.push(e.value), e.value + 1 < l.value && (r.push(e.value + 1), e.value <= 1 && r.push(e.value + 2), e.value + 2 < this.maxPage && r.push("dots")), e.value < this.maxPage && r.push(this.maxPage), r;
+    }), c = () => {
+      e.value > 1 && i("update:page", e.value - 1);
+    }, d = () => {
+      e.value < l.value && i("update:page", e.value + 1);
+    };
+    return V(() => s.page, (r) => e.value = Math.min(Math.max(r, 1), l.value), { immediate: !0 }), V(() => s.perPage, (r) => {
+      l.value = Math.ceil(s.total / s.perPage), i("update:page", 1);
+    }), V(() => s.total, (r) => {
+      l.value = Math.ceil(s.total / s.perPage), e.value > l.value && i("update:page", 1);
+    }), (r, m) => (a(), o("nav", ge, [
+      n("div", be, [
+        t.showNavButtons ? (a(), o("a", {
+          key: 0,
+          onClick: C(c, ["prevent"]),
+          href: "#",
+          class: f(["inline-flex items-center pr-1 text-sm font-medium text-gray-500 border-transparent hover:text-gray-700 hover:border-gray-300", [{ "cursor-default pointer-events-none": e.value <= 1 }, v.value]])
+        }, [
+          P($(ne), { class: "w-5 h-5" }),
+          w(" " + h(t.prevText), 1)
+        ], 10, ye)) : y("", !0)
+      ]),
+      n("div", _e, [
+        (a(!0), o(b, null, k(u.value, (p, M) => (a(), B(D(p !== "dots" ? "a" : "span"), {
+          onClick: C((A) => p !== "dots" ? i("update:page", p) : null, ["prevent"]),
+          key: M,
+          href: p !== "dots" ? "#" : null,
+          class: f(["inline-flex items-center px-4 text-sm font-medium", [{
+            "border-vxvue-500 text-vxvue-700": p === e.value,
+            "border-transparent text-gray-500": p !== e.value,
+            "hover:text-gray-700 hover:border-gray-300": p !== "dots"
+          }, v.value]])
+        }, {
+          default: j(() => [
+            w(h(p !== "dots" ? p : "..."), 1)
+          ]),
+          _: 2
+        }, 1032, ["onClick", "href", "class"]))), 128))
+      ]),
+      n("div", we, [
+        t.showNavButtons ? (a(), o("a", {
+          key: 0,
+          onClick: C(d, ["prevent"]),
+          href: "#",
+          class: f(["inline-flex items-center pl-1 text-sm font-medium text-gray-500 border-transparent hover:text-gray-700 hover:border-gray-300", [v.value, { "cursor-default pointer-events-none": e.value >= l.value }]])
+        }, [
+          w(h(t.nextText) + " ", 1),
+          P($(re), { class: "w-5 h-5" })
+        ], 10, ke)) : y("", !0)
+      ])
+    ]));
+  }
+};
+const $e = (t, i) => {
+  const s = t.__vccOpts || t;
+  for (const [l, e] of i)
+    s[l] = e;
+  return s;
+}, Ce = { class: "overflow-hidden rounded ring-1 ring-opacity-10 shadow ring-slate-500" }, Pe = { class: "min-w-full divide-y divide-y-slate-900" }, Ae = { class: "text-white bg-slate-700" }, Ve = ["onClick"], Me = { class: "flex items-center" }, Se = {
+  key: 0,
+  xmlns: "http://www.w3.org/2000/svg",
+  class: "flex-shrink-0 ml-2 w-4 h-4",
+  fill: "none",
+  viewBox: "0 0 24 24",
+  stroke: "currentColor"
+}, Te = ["d"], Be = {
+  key: 1,
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round",
+  "stroke-width": "2",
+  d: "M8 9l4-4 4 4m0 6l-4 4-4-4"
+}, Ne = {
+  __name: "sortable",
+  props: {
+    columns: {
+      type: Array,
+      required: !0,
+      validator: (t) => {
+        for (const i of t)
+          if (i.label === void 0 || i.prop === void 0)
+            return !1;
+        return !0;
+      }
+    },
+    rows: { type: Array, required: !0 },
+    offset: { type: Number, default: null },
+    count: { type: Number, default: null },
+    sortProp: { type: String },
+    sortDirection: { type: String, validator: (t) => !t || ["asc", "desc"].indexOf(t) !== -1 },
+    keyProperty: { type: String, default: "key" }
+  },
+  emits: ["before-sort", "after-sort"],
+  setup(t, { emit: i }) {
+    const s = t, l = g(s.sortProp), e = g(s.sortDirection), v = _(() => {
+      let c = s.rows.slice();
+      const d = s.columns.find(({ prop: r }) => r === l.value);
+      return d && (e.value === "asc" && d.sortAscFunction ? c.sort(d.sortAscFunction) : e.value === "desc" && d.sortDescFunction ? c.sort(d.sortDescFunction) : c.sort((r, m) => r[l.value] < m[l.value] ? e.value === "asc" ? -1 : 1 : r[l.value] > m[l.value] ? e.value === "asc" ? 1 : -1 : 0)), c.slice(s.offset || 0, (s.offset || 0) + (s.count || c.length));
+    }), u = (c) => {
+      i("before-sort", { prop: l.value, dir: e.value }), l.value === c ? e.value = e.value === "asc" ? "desc" : "asc" : (l.value = c, e.value = e.value || "asc"), O(() => i("after-sort", { prop: l.value, dir: e.value }));
+    };
+    return (c, d) => (a(), o("div", Ce, [
+      n("table", Pe, [
+        n("thead", Ae, [
+          n("tr", null, [
+            (a(!0), o(b, null, k(t.columns, (r) => (a(), o("th", {
+              scope: "col",
+              class: f(["py-3 px-6 text-left", [
+                { "cursor-pointer": r.sortable, active: l.value === r.prop },
+                r.cssClass
+              ]]),
+              onClick: (m) => r.sortable ? u(r.prop) : null
+            }, [
+              x(c.$slots, r.prop + "-header", {
+                column: r,
+                sortDir: e.value,
+                sortProp: l.value
+              }, () => [
+                n("div", Me, [
+                  n("span", null, h(r.label), 1),
+                  r.sortable ? (a(), o("svg", Se, [
+                    l.value === r.prop ? (a(), o("path", {
+                      key: 0,
+                      "stroke-linecap": "round",
+                      "stroke-linejoin": "round",
+                      "stroke-width": "2",
+                      d: e.value === "asc" ? "M19 9l-7 7-7-7" : "M5 15l7-7 7 7"
+                    }, null, 8, Te)) : (a(), o("path", Be))
+                  ])) : y("", !0)
+                ])
+              ], !0)
+            ], 10, Ve))), 256))
+          ])
+        ]),
+        n("tbody", null, [
+          (a(!0), o(b, null, k(v.value, (r) => (a(), o("tr", {
+            key: r[t.keyProperty],
+            class: f(r.cssClass)
+          }, [
+            (a(!0), o(b, null, k(t.columns, (m) => (a(), o("td", {
+              class: f(["py-3 px-6 whitespace-nowrap", { active: l.value === m.prop }])
+            }, [
+              x(c.$slots, m.prop, { row: r }, () => [
+                w(h(r[m.prop]), 1)
+              ], !0)
+            ], 2))), 256))
+          ], 2))), 128))
+        ])
+      ])
+    ]));
+  }
+}, He = /* @__PURE__ */ $e(Ne, [["__scopeId", "data-v-c18eb3d8"]]), je = { class: "sm:hidden" }, Le = { class: "hidden sm:block" }, Oe = { class: "border-b border-gray-200" }, ze = {
+  class: "flex -mb-px space-x-8",
+  "aria-label": "Tabs"
+}, De = ["onClick", "aria-current"], Je = {
+  __name: "tabs",
+  props: {
+    items: { type: Array, default: [] },
+    activeIndex: { type: Number, default: 0 }
+  },
+  emits: ["update:active-index"],
+  setup(t, { emit: i }) {
+    const s = t, l = g(s.items[s.activeIndex] || {}), e = _(() => {
+      let u = [];
+      return s.items.forEach((c, d) => {
+        c.disabled || u.push({ label: c.name, key: d });
+      }), u;
+    });
+    V(() => s.activeIndex, (u) => {
+      l.value = s.items[u] || {};
+    });
+    const v = (u) => {
+      u.disabled || (l.value = u, i("update:active-index", s.items.indexOf(u)));
+    };
+    return (u, c) => (a(), o(b, null, [
+      n("div", je, [
+        P(G, {
+          options: e.value,
+          "model-value": t.activeIndex,
+          "onUpdate:modelValue": c[0] || (c[0] = (d) => i("update:activeIndex", d)),
+          class: "w-full"
+        }, null, 8, ["options", "model-value"])
+      ]),
+      n("div", Le, [
+        n("div", Oe, [
+          n("nav", ze, [
+            (a(!0), o(b, null, k(t.items, (d) => (a(), o("a", {
+              key: d.name,
+              href: "#",
+              onClick: C((r) => v(d), ["prevent"]),
+              class: f([
+                l.value === d ? "border-vxvue-500 text-vxvue-600" : "border-transparent text-gray-900 hover:text-gray-700 hover:border-gray-300",
+                d.disabled ? "cursor-not-allowed text-gray-400 hover:border-transparent" : "",
+                "group inline-flex items-center py-4 px-1 border-b-4 font-medium"
+              ]),
+              "aria-current": l.value === d ? "page" : void 0
+            }, [
+              x(u.$slots, "icon", { tab: d }),
+              n("span", null, [
+                x(u.$slots, "default", { tab: d }, () => [
+                  w(h(d.name), 1)
+                ])
+              ]),
+              d.badge ? (a(), o("span", {
+                key: 0,
+                class: f([
+                  l.value === d ? "bg-vxvue-50 text-vxvue-700" : "bg-gray-200 text-gray-900",
+                  d.disabled ? "bg-gray-100 text-gray-400" : "",
+                  "hidden ml-3 py-0.5 px-2.5 rounded-full text-xs font-medium md:inline-block"
+                ])
+              }, h(d.badge), 3)) : y("", !0)
+            ], 10, De))), 128))
+          ])
+        ])
+      ])
+    ], 64));
+  }
 };
 export {
-  le as Confirm,
-  se as FormSelect,
-  te as PasswordInput
+  qe as Confirm,
+  G as FormSelect,
+  Re as FormSwitch,
+  Ue as MessageToast,
+  Ge as Pagination,
+  Ee as PasswordInput,
+  He as Sortable,
+  Je as Tabs
 };

package/dist/vxvue.umd.js

@@ -1 +1 @@
-(function(r,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(r=typeof globalThis<"u"?globalThis:r||self,e(r.vxVue={},r.Vue))})(this,function(r,e){"use strict";function u(l,n){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M3.98 8.223A10.477 10.477 0 001.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.45 10.45 0 0112 4.5c4.756 0 8.773 3.162 10.065 7.498a10.523 10.523 0 01-4.293 5.774M6.228 6.228L3 3m3.228 3.228l3.65 3.65m7.894 7.894L21 21m-3.228-3.228l-3.65-3.65m0 0a3 3 0 10-4.243-4.243m4.242 4.242L9.88 9.88"})])}function h(l,n){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M2.036 12.322a1.012 1.012 0 010-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178z"}),e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M15 12a3 3 0 11-6 0 3 3 0 016 0z"})])}const b=["value","type"],g=Object.assign({inheritAttrs:!1},{__name:"password-input",props:["modelValue"],emits:["update:modelValue"],setup(l,{emit:n}){const o=e.ref(!1),a=e.computed(()=>{let t=Object.assign({},e.useAttrs());return delete t.class,t});return(t,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass("inline-block relative "+e.useAttrs().class)},[e.createElementVNode("input",e.mergeProps({value:l.modelValue,type:o.value?"text":"password",onInput:s[0]||(s[0]=c=>n("update:modelValue",c.target.value))},a.value,{class:"block pr-10 w-full form-input peer"}),null,16,b),e.createElementVNode("button",{onClick:s[1]||(s[1]=e.withModifiers(c=>o.value=!o.value,["stop"])),class:"flex absolute inset-y-0 right-0 items-center pr-3 text-brand-700 hover:text-brand"},[o.value?(e.openBlock(),e.createBlock(e.unref(u),{key:0,class:"w-5 h-5"})):(e.openBlock(),e.createBlock(e.unref(h),{key:1,class:"w-5 h-5"}))]),e.renderSlot(t.$slots,"default")],2))}}),y=["value"],x={key:0,disabled:"",value:""},B=["value","selected"],w={__name:"form-select",props:{options:Array,modelValue:[String,Number],disabledLabel:String},emits:["update:modelValue"],setup(l,{emit:n}){return(o,a)=>(e.openBlock(),e.createElementBlock("select",e.mergeProps(o.$attrs,{value:l.modelValue,class:"form-select",onChange:a[0]||(a[0]=t=>n("update:modelValue",t.target.value))}),[l.disabledLabel?(e.openBlock(),e.createElementBlock("option",x,e.toDisplayString(l.disabledLabel),1)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.options,t=>(e.openBlock(),e.createElementBlock("option",{value:t.key!==void 0?t.key:t.label||t,selected:(t.key!==void 0?t.key:t.label||t)===l.modelValue},e.toDisplayString(t.label||t),9,B))),256))],16,y))}},V={key:0,class:"fixed inset-0 z-50 bg-black bg-opacity-50 backdrop-blur-sm","aria-hidden":"true"},_={key:0,class:"overflow-y-auto fixed inset-0 z-50"},E={class:"flex justify-center items-end px-4 pt-4 pb-20 min-h-screen text-center sm:block sm:p-0"},C={key:0},N=e.createElementVNode("span",{class:"hidden sm:inline-block sm:h-screen sm:align-middle","aria-hidden":"true"},"​",-1),S={class:"inline-block overflow-hidden text-left align-bottom bg-white rounded shadow-xl transition-all transform sm:my-8 sm:w-full sm:max-w-sm sm:align-middle lg:max-w-lg"},$={class:"px-4 pb-4 mt-4 sm:px-6 sm:pb-6 sm:mt-5"},A={class:"flex flex-row items-center"},j={class:"flex-shrink-0"},L={class:"flex-grow text-center"},M=["onClick"],z={__name:"confirm",props:{buttons:{type:[Object,Array],default:{label:"Ok"},validator:l=>Array.isArray(l)&&l.length<=2&&l.filter(n=>n.label!=="undefined"&&n.value!=="undefined").length===l.length||l.label!==void 0&&l.value!==void 0},headerClass:{type:String,default:"text-vxvue-alt-900 bg-vxvue-alt-400"},buttonClass:{type:String,default:"button"}},setup(l,{expose:n}){const o=l,a=e.ref(""),t=e.ref(""),s=e.ref(!1);let c=null,f=null;const T=e.computed(()=>Array.isArray(o.buttons)?o.buttons:[o.buttons]),p=e.ref(null);return n({open:(i,k)=>(a.value=i,t.value=k,s.value=!0,e.nextTick(()=>p.value.firstElementChild.focus()),new Promise((d,m)=>{c=d,f=m}))}),(i,k)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[s.value?(e.openBlock(),e.createElementBlock("div",V)):e.createCommentVNode("",!0),e.createVNode(e.Transition,{name:"appear"},{default:e.withCtx(()=>[s.value?(e.openBlock(),e.createElementBlock("div",_,[e.createElementVNode("div",E,[s.value?(e.openBlock(),e.createElementBlock("div",C,[N,e.createElementVNode("div",S,[a.value?(e.openBlock(),e.createElementBlock("h3",{key:0,class:e.normalizeClass(["py-4 pt-4 text-lg font-medium text-center sm:py-6",l.headerClass])},[e.renderSlot(i.$slots,"title",{title:a.value},()=>[e.createTextVNode(e.toDisplayString(a.value),1)])],2)):e.createCommentVNode("",!0),e.createElementVNode("div",$,[e.createElementVNode("div",A,[e.createElementVNode("div",j,[e.renderSlot(i.$slots,"icon")]),e.createElementVNode("p",L,[e.renderSlot(i.$slots,"default",{message:t.value},()=>[e.createTextVNode(e.toDisplayString(t.value),1)])])]),e.createElementVNode("div",{class:"flex justify-center mt-5 space-x-2 sm:mt-6",ref_key:"buttonsContainer",ref:p},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(T.value,(d,m)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass([l.buttonClass,d.class]),onClick:e.withModifiers(O=>{s.value=!1,m===0?e.unref(c)():e.unref(f)()},["prevent"])},e.toDisplayString(d.label),11,M))),256))],512)])])])):e.createCommentVNode("",!0)])])):e.createCommentVNode("",!0)]),_:3})],64))}};r.Confirm=z,r.FormSelect=w,r.PasswordInput=g,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})});
+(function(p,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(p=typeof globalThis<"u"?globalThis:p||self,e(p.vxVue={},p.Vue))})(this,function(p,e){"use strict";function x(l,r){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M3.98 8.223A10.477 10.477 0 001.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.45 10.45 0 0112 4.5c4.756 0 8.773 3.162 10.065 7.498a10.523 10.523 0 01-4.293 5.774M6.228 6.228L3 3m3.228 3.228l3.65 3.65m7.894 7.894L21 21m-3.228-3.228l-3.65-3.65m0 0a3 3 0 10-4.243-4.243m4.242 4.242L9.88 9.88"})])}function b(l,r){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M2.036 12.322a1.012 1.012 0 010-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178z"}),e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M15 12a3 3 0 11-6 0 3 3 0 016 0z"})])}const y=["value","type"],_=Object.assign({inheritAttrs:!1},{__name:"password-input",props:["modelValue"],emits:["update:modelValue"],setup(l,{emit:r}){const o=e.ref(!1),n=e.computed(()=>{let t=Object.assign({},e.useAttrs());return delete t.class,t});return(t,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass("inline-block relative "+e.useAttrs().class)},[e.createElementVNode("input",e.mergeProps({value:l.modelValue,type:o.value?"text":"password",onInput:d[0]||(d[0]=s=>r("update:modelValue",s.target.value))},n.value,{class:"block pr-10 w-full form-input peer"}),null,16,y),e.createElementVNode("button",{onClick:d[1]||(d[1]=e.withModifiers(s=>o.value=!o.value,["stop"])),class:"flex absolute inset-y-0 right-0 items-center pr-3 text-brand-700 hover:text-brand"},[o.value?(e.openBlock(),e.createBlock(e.unref(x),{key:0,class:"w-5 h-5"})):(e.openBlock(),e.createBlock(e.unref(b),{key:1,class:"w-5 h-5"}))]),e.renderSlot(t.$slots,"default")],2))}}),w=["value"],B={key:0,disabled:"",value:""},V=["value","selected"],g={__name:"form-select",props:{options:Array,modelValue:[String,Number],disabledLabel:String},emits:["update:modelValue"],setup(l,{emit:r}){return(o,n)=>(e.openBlock(),e.createElementBlock("select",e.mergeProps(o.$attrs,{value:l.modelValue,class:"form-select",onChange:n[0]||(n[0]=t=>r("update:modelValue",t.target.value))}),[l.disabledLabel?(e.openBlock(),e.createElementBlock("option",B,e.toDisplayString(l.disabledLabel),1)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.options,t=>(e.openBlock(),e.createElementBlock("option",{value:t.key!==void 0?t.key:t.label||t,selected:(t.key!==void 0?t.key:t.label||t)===l.modelValue},e.toDisplayString(t.label||t),9,V))),256))],16,w))}},E={key:0,class:"fixed inset-0 z-50 bg-black bg-opacity-50 backdrop-blur-sm","aria-hidden":"true"},N={key:0,class:"overflow-y-auto fixed inset-0 z-50"},C={class:"flex justify-center items-end px-4 pt-4 pb-20 min-h-screen text-center sm:block sm:p-0"},$={key:0},S=e.createElementVNode("span",{class:"hidden sm:inline-block sm:h-screen sm:align-middle","aria-hidden":"true"},"​",-1),P={class:"inline-block overflow-hidden text-left align-bottom bg-white rounded shadow-xl transition-all transform sm:my-8 sm:w-full sm:max-w-sm sm:align-middle lg:max-w-lg"},T={class:"px-4 pb-4 mt-4 sm:px-6 sm:pb-6 sm:mt-5"},M={class:"flex flex-row items-center"},A={class:"flex-shrink-0"},z={class:"flex-grow text-center"},D=["onClick"],L={__name:"confirm",props:{buttons:{type:[Object,Array],default:{label:"Ok"},validator:l=>Array.isArray(l)&&l.length<=2&&l.filter(r=>r.label!=="undefined"&&r.value!=="undefined").length===l.length||l.label!==void 0&&l.value!==void 0},headerClass:{type:String,default:"text-vxvue-alt-900 bg-vxvue-alt-400"},buttonClass:{type:String,default:"button"}},setup(l,{expose:r}){const o=l,n=e.ref(""),t=e.ref(""),d=e.ref(!1);let s=null,i=null;const c=e.computed(()=>Array.isArray(o.buttons)?o.buttons:[o.buttons]),a=e.ref(null);return r({open:(m,h)=>(n.value=m,t.value=h,d.value=!0,e.nextTick(()=>a.value.firstElementChild.focus()),new Promise((u,k)=>{s=u,i=k}))}),(m,h)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[d.value?(e.openBlock(),e.createElementBlock("div",E)):e.createCommentVNode("",!0),e.createVNode(e.Transition,{name:"appear"},{default:e.withCtx(()=>[d.value?(e.openBlock(),e.createElementBlock("div",N,[e.createElementVNode("div",C,[d.value?(e.openBlock(),e.createElementBlock("div",$,[S,e.createElementVNode("div",P,[n.value?(e.openBlock(),e.createElementBlock("h3",{key:0,class:e.normalizeClass(["py-4 pt-4 text-lg font-medium text-center sm:py-6",l.headerClass])},[e.renderSlot(m.$slots,"title",{title:n.value},()=>[e.createTextVNode(e.toDisplayString(n.value),1)])],2)):e.createCommentVNode("",!0),e.createElementVNode("div",T,[e.createElementVNode("div",M,[e.createElementVNode("div",A,[e.renderSlot(m.$slots,"icon")]),e.createElementVNode("p",z,[e.renderSlot(m.$slots,"default",{message:t.value},()=>[e.createTextVNode(e.toDisplayString(t.value),1)])])]),e.createElementVNode("div",{class:"flex justify-center mt-5 space-x-2 sm:mt-6",ref_key:"buttonsContainer",ref:a},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(c.value,(u,k)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass([l.buttonClass,u.class]),onClick:e.withModifiers(Ne=>{d.value=!1,k===0?e.unref(s)():e.unref(i)()},["prevent"])},e.toDisplayString(u.label),11,D))),256))],512)])])])):e.createCommentVNode("",!0)])])):e.createCommentVNode("",!0)]),_:3})],64))}},j=["aria-checked"],F=["checked"],O={__name:"form-switch",props:["modelValue"],emits:["update:modelValue"],setup(l,{emit:r}){const o=l,n=e.computed(()=>o.modelValue?"bg-vxvue":"bg-slate-200"),t=e.computed(()=>o.modelValue?"translate-x-5":"translate-x-0"),d=e.computed(()=>{let s=Object.assign({},e.useAttrs());return delete s.class,s});return(s,i)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("label",{class:e.normalizeClass(s.$attrs.class)},[e.createElementVNode("span",{class:e.normalizeClass([n.value,"inline-flex relative flex-shrink-0 w-11 h-6 rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out cursor-pointer focus:ring-2 focus:ring-offset-2 focus:outline-none focus:ring-vxvue"]),role:"switch","aria-checked":!!l.modelValue},[e.createElementVNode("span",{"aria-hidden":"true",class:e.normalizeClass([t.value,"inline-block w-5 h-5 bg-white rounded-full ring-0 shadow transition duration-200 ease-in-out transform pointer-events-none"])},null,2),e.createElementVNode("input",e.mergeProps({class:"hidden",value:"1",type:"checkbox",onChange:i[0]||(i[0]=c=>r("update:modelValue",c.target.checked))},d.value,{checked:l.modelValue}),null,16,F)],10,j)],2),e.renderSlot(s.$slots,"default")],64))}};function I(l,r){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"fill-rule":"evenodd",d:"M7.72 12.53a.75.75 0 010-1.06l7.5-7.5a.75.75 0 111.06 1.06L9.31 12l6.97 6.97a.75.75 0 11-1.06 1.06l-7.5-7.5z","clip-rule":"evenodd"})])}function q(l,r){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"fill-rule":"evenodd",d:"M16.28 11.47a.75.75 0 010 1.06l-7.5 7.5a.75.75 0 01-1.06-1.06L14.69 12 7.72 5.03a.75.75 0 011.06-1.06l7.5 7.5z","clip-rule":"evenodd"})])}function R(l,r){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"fill-rule":"evenodd",d:"M5.47 5.47a.75.75 0 011.06 0L12 10.94l5.47-5.47a.75.75 0 111.06 1.06L13.06 12l5.47 5.47a.75.75 0 11-1.06 1.06L12 13.06l-5.47 5.47a.75.75 0 01-1.06-1.06L10.94 12 5.47 6.53a.75.75 0 010-1.06z","clip-rule":"evenodd"})])}const Be="",U={"aria-live":"assertive",class:"flex fixed inset-0 z-50 items-start py-6 px-4 pointer-events-none sm:p-6"},G={class:"flex flex-col items-center space-y-4 w-full"},H={class:"p-4"},J={class:"flex items-start"},K={class:"flex-shrink-0"},Q={class:"flex-1 pt-0.5 ml-3 w-0"},W={class:"font-bold"},X={class:"mt-1"},Y={class:"flex flex-shrink-0 ml-4"},Z=e.createElementVNode("span",{class:"sr-only"},"Close",-1),v=Object.assign({inheritAttrs:!1},{__name:"message-toast",props:{title:String,message:[String,Array],timeout:{type:Number,default:5e3},active:{type:Boolean,default:!1}},emits:["timeout","close"],setup(l,{emit:r}){const o=l,n=e.ref(null),t=e.computed(()=>typeof o.message=="string"?[o.message]:o.message),d=()=>{window.clearTimeout(n.value),o.active&&o.timeout&&(n.value=window.setTimeout(()=>{r("timeout")},o.timeout))};return e.watch(()=>o.active,d),e.onMounted(d),(s,i)=>(e.openBlock(),e.createElementBlock("div",U,[e.createElementVNode("div",G,[e.createVNode(e.Transition,{name:"messagetoast-fade"},{default:e.withCtx(()=>[l.active?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["overflow-hidden w-full max-w-sm rounded-md ring-1 ring-black ring-opacity-5 shadow-lg pointer-events-auto",s.$attrs.class])},[e.createElementVNode("div",H,[e.createElementVNode("div",J,[e.createElementVNode("div",K,[e.renderSlot(s.$slots,"icon")]),e.createElementVNode("div",Q,[e.createElementVNode("p",W,[e.renderSlot(s.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(l.title),1)])]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.value,c=>(e.openBlock(),e.createElementBlock("p",X,[e.renderSlot(s.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(c),1)])]))),256))]),e.createElementVNode("div",Y,[e.createElementVNode("button",{onClick:i[0]||(i[0]=c=>r("close")),class:"inline-flex text-white bg-black bg-opacity-20 rounded-sm focus:ring-2 focus:outline-none hover:text-stone-200 focus:ring-stone-200"},[Z,e.createVNode(e.unref(R),{class:"w-5 h-5"})])])])])],2)):e.createCommentVNode("",!0)]),_:3})])]))}}),ee={class:"flex justify-between items-center px-4 sm:px-0"},te={class:"flex flex-1 -mt-px w-0"},le=["onClick"],oe={class:"hidden md:flex md:-mt-px"},ne={class:"flex flex-1 justify-end -mt-px w-0"},ae=["onClick"],re={__name:"pagination",props:{page:{type:Number,default:1},total:{type:Number,default:1},perPage:{type:Number,default:20,validator(l){return l>=1}},showNavButtons:{type:Boolean,default:!0},prevText:{type:String,default:"Previous"},nextText:{type:String,default:"Next"},showAllPages:{type:Boolean,default:!1},markerPosition:{type:String,default:"above",validator(l){return["above","below"].indexOf(l)!==-1}}},emits:["update:page"],setup(l,{emit:r}){const o=l,n=e.ref(Math.ceil(o.total/o.perPage)),t=e.ref(null),d=e.computed(()=>o.markerPosition==="above"?"border-t-2 pt-4":"border-b-2 pb-4"),s=e.computed(()=>{let a=[1];if(o.showAllPages||n.value<=7){for(let f=2;f<=n.value;++f)a.push(f);return a}return t.value>=n.value?a.push("dots",t.value-2,t.value-1):t.value-1&&t.value-1>1&&(t.value>1&&a.push("dots"),a.push(t.value-1)),t.value>1&&a.push(t.value),t.value+1<n.value&&(a.push(t.value+1),t.value<=1&&a.push(t.value+2),t.value+2<this.maxPage&&a.push("dots")),t.value<this.maxPage&&a.push(this.maxPage),a}),i=()=>{t.value>1&&r("update:page",t.value-1)},c=()=>{t.value<n.value&&r("update:page",t.value+1)};return e.watch(()=>o.page,a=>t.value=Math.min(Math.max(a,1),n.value),{immediate:!0}),e.watch(()=>o.perPage,a=>{n.value=Math.ceil(o.total/o.perPage),r("update:page",1)}),e.watch(()=>o.total,a=>{n.value=Math.ceil(o.total/o.perPage),t.value>n.value&&r("update:page",1)}),(a,f)=>(e.openBlock(),e.createElementBlock("nav",ee,[e.createElementVNode("div",te,[l.showNavButtons?(e.openBlock(),e.createElementBlock("a",{key:0,onClick:e.withModifiers(i,["prevent"]),href:"#",class:e.normalizeClass(["inline-flex items-center pr-1 text-sm font-medium text-gray-500 border-transparent hover:text-gray-700 hover:border-gray-300",[{"cursor-default pointer-events-none":t.value<=1},d.value]])},[e.createVNode(e.unref(I),{class:"w-5 h-5"}),e.createTextVNode(" "+e.toDisplayString(l.prevText),1)],10,le)):e.createCommentVNode("",!0)]),e.createElementVNode("div",oe,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(s.value,(m,h)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(m!=="dots"?"a":"span"),{onClick:e.withModifiers(u=>m!=="dots"?r("update:page",m):null,["prevent"]),key:h,href:m!=="dots"?"#":null,class:e.normalizeClass(["inline-flex items-center px-4 text-sm font-medium",[{"border-vxvue-500 text-vxvue-700":m===t.value,"border-transparent text-gray-500":m!==t.value,"hover:text-gray-700 hover:border-gray-300":m!=="dots"},d.value]])},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(m!=="dots"?m:"..."),1)]),_:2},1032,["onClick","href","class"]))),128))]),e.createElementVNode("div",ne,[l.showNavButtons?(e.openBlock(),e.createElementBlock("a",{key:0,onClick:e.withModifiers(c,["prevent"]),href:"#",class:e.normalizeClass(["inline-flex items-center pl-1 text-sm font-medium text-gray-500 border-transparent hover:text-gray-700 hover:border-gray-300",[d.value,{"cursor-default pointer-events-none":t.value>=n.value}]])},[e.createTextVNode(e.toDisplayString(l.nextText)+" ",1),e.createVNode(e.unref(q),{class:"w-5 h-5"})],10,ae)):e.createCommentVNode("",!0)])]))}},Ve="",se=(l,r)=>{const o=l.__vccOpts||l;for(const[n,t]of r)o[n]=t;return o},ce={class:"overflow-hidden rounded ring-1 ring-opacity-10 shadow ring-slate-500"},ie={class:"min-w-full divide-y divide-y-slate-900"},de={class:"text-white bg-slate-700"},me=["onClick"],pe={class:"flex items-center"},fe={key:0,xmlns:"http://www.w3.org/2000/svg",class:"flex-shrink-0 ml-2 w-4 h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor"},ue=["d"],he={key:1,"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M8 9l4-4 4 4m0 6l-4 4-4-4"},ke=se({__name:"sortable",props:{columns:{type:Array,required:!0,validator:l=>{for(const r of l)if(r.label===void 0||r.prop===void 0)return!1;return!0}},rows:{type:Array,required:!0},offset:{type:Number,default:null},count:{type:Number,default:null},sortProp:{type:String},sortDirection:{type:String,validator:l=>!l||["asc","desc"].indexOf(l)!==-1},keyProperty:{type:String,default:"key"}},emits:["before-sort","after-sort"],setup(l,{emit:r}){const o=l,n=e.ref(o.sortProp),t=e.ref(o.sortDirection),d=e.computed(()=>{let i=o.rows.slice();const c=o.columns.find(({prop:a})=>a===n.value);return c&&(t.value==="asc"&&c.sortAscFunction?i.sort(c.sortAscFunction):t.value==="desc"&&c.sortDescFunction?i.sort(c.sortDescFunction):i.sort((a,f)=>a[n.value]<f[n.value]?t.value==="asc"?-1:1:a[n.value]>f[n.value]?t.value==="asc"?1:-1:0)),i.slice(o.offset||0,(o.offset||0)+(o.count||i.length))}),s=i=>{r("before-sort",{prop:n.value,dir:t.value}),n.value===i?t.value=t.value==="asc"?"desc":"asc":(n.value=i,t.value=t.value||"asc"),e.nextTick(()=>r("after-sort",{prop:n.value,dir:t.value}))};return(i,c)=>(e.openBlock(),e.createElementBlock("div",ce,[e.createElementVNode("table",ie,[e.createElementVNode("thead",de,[e.createElementVNode("tr",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.columns,a=>(e.openBlock(),e.createElementBlock("th",{scope:"col",class:e.normalizeClass(["py-3 px-6 text-left",[{"cursor-pointer":a.sortable,active:n.value===a.prop},a.cssClass]]),onClick:f=>a.sortable?s(a.prop):null},[e.renderSlot(i.$slots,a.prop+"-header",{column:a,sortDir:t.value,sortProp:n.value},()=>[e.createElementVNode("div",pe,[e.createElementVNode("span",null,e.toDisplayString(a.label),1),a.sortable?(e.openBlock(),e.createElementBlock("svg",fe,[n.value===a.prop?(e.openBlock(),e.createElementBlock("path",{key:0,"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:t.value==="asc"?"M19 9l-7 7-7-7":"M5 15l7-7 7 7"},null,8,ue)):(e.openBlock(),e.createElementBlock("path",he))])):e.createCommentVNode("",!0)])],!0)],10,me))),256))])]),e.createElementVNode("tbody",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(d.value,a=>(e.openBlock(),e.createElementBlock("tr",{key:a[l.keyProperty],class:e.normalizeClass(a.cssClass)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.columns,f=>(e.openBlock(),e.createElementBlock("td",{class:e.normalizeClass(["py-3 px-6 whitespace-nowrap",{active:n.value===f.prop}])},[e.renderSlot(i.$slots,f.prop,{row:a},()=>[e.createTextVNode(e.toDisplayString(a[f.prop]),1)],!0)],2))),256))],2))),128))])])]))}},[["__scopeId","data-v-c18eb3d8"]]),ge={class:"sm:hidden"},xe={class:"hidden sm:block"},be={class:"border-b border-gray-200"},ye={class:"flex -mb-px space-x-8","aria-label":"Tabs"},_e=["onClick","aria-current"],we={__name:"tabs",props:{items:{type:Array,default:[]},activeIndex:{type:Number,default:0}},emits:["update:active-index"],setup(l,{emit:r}){const o=l,n=e.ref(o.items[o.activeIndex]||{}),t=e.computed(()=>{let s=[];return o.items.forEach((i,c)=>{i.disabled||s.push({label:i.name,key:c})}),s});e.watch(()=>o.activeIndex,s=>{n.value=o.items[s]||{}});const d=s=>{s.disabled||(n.value=s,r("update:active-index",o.items.indexOf(s)))};return(s,i)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("div",ge,[e.createVNode(g,{options:t.value,"model-value":l.activeIndex,"onUpdate:modelValue":i[0]||(i[0]=c=>r("update:activeIndex",c)),class:"w-full"},null,8,["options","model-value"])]),e.createElementVNode("div",xe,[e.createElementVNode("div",be,[e.createElementVNode("nav",ye,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.items,c=>(e.openBlock(),e.createElementBlock("a",{key:c.name,href:"#",onClick:e.withModifiers(a=>d(c),["prevent"]),class:e.normalizeClass([n.value===c?"border-vxvue-500 text-vxvue-600":"border-transparent text-gray-900 hover:text-gray-700 hover:border-gray-300",c.disabled?"cursor-not-allowed text-gray-400 hover:border-transparent":"","group inline-flex items-center py-4 px-1 border-b-4 font-medium"]),"aria-current":n.value===c?"page":void 0},[e.renderSlot(s.$slots,"icon",{tab:c}),e.createElementVNode("span",null,[e.renderSlot(s.$slots,"default",{tab:c},()=>[e.createTextVNode(e.toDisplayString(c.name),1)])]),c.badge?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass([n.value===c?"bg-vxvue-50 text-vxvue-700":"bg-gray-200 text-gray-900",c.disabled?"bg-gray-100 text-gray-400":"","hidden ml-3 py-0.5 px-2.5 rounded-full text-xs font-medium md:inline-block"])},e.toDisplayString(c.badge),3)):e.createCommentVNode("",!0)],10,_e))),128))])])])],64))}};p.Confirm=L,p.FormSelect=g,p.FormSwitch=O,p.MessageToast=v,p.Pagination=re,p.PasswordInput=_,p.Sortable=ke,p.Tabs=we,Object.defineProperty(p,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -9,7 +9,7 @@
       "require": "./dist/vxvue.umd.js"
     }
   },
-  "version": "0.0.1",
+  "version": "0.0.2",
   "scripts": {
     "dev": "vite",
     "build": "vite build",