vlite3 0.5.9 → 0.6.1

package/components/BackButton.vue.d.ts

@@ -0,0 +1,24 @@
+import { ButtonSize } from '../types';
+export interface BackButtonProps {
+    /** Icon to display, defaults to a left arrow */
+    icon?: string;
+    /** Button size variant */
+    size?: ButtonSize;
+    /** Tooltip text shown on hover */
+    tooltip?: string;
+    /** Custom CSS classes */
+    class?: string;
+    /**
+     * Fallback path when there's no browser history to go back to.
+     * Defaults to '/'
+     */
+    fallback?: string;
+}
+declare const _default: import('vue').DefineComponent<BackButtonProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<BackButtonProps> & Readonly<{}>, {
+    size: ButtonSize;
+    icon: string;
+    class: string;
+    fallback: string;
+    tooltip: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLButtonElement>;
+export default _default;

package/components/BackButton.vue.js

@@ -0,0 +1,31 @@
+import { defineComponent as l, openBlock as c, createBlock as s, normalizeClass as i } from "vue";
+import { useRouter as n } from "vue-router";
+import r from "./Button.vue.js";
+const p = /* @__PURE__ */ l({
+  __name: "BackButton",
+  props: {
+    icon: { default: "heroicons-solid:arrow-left" },
+    size: { default: "sm" },
+    tooltip: { default: "Go back" },
+    class: { default: "" },
+    fallback: { default: "/" }
+  },
+  setup(o) {
+    const t = o, e = n();
+    function a() {
+      window.history.state?.back ? e.back() : e.push(t.fallback);
+    }
+    return (f, u) => (c(), s(r, {
+      variant: "ghost",
+      icon: o.icon,
+      size: o.size,
+      rounded: "full",
+      title: o.tooltip,
+      class: i(t.class),
+      onClick: a
+    }, null, 8, ["icon", "size", "title", "class"]));
+  }
+});
+export {
+  p as default
+};

package/components/BackButton.vue2.js

@@ -0,0 +1,4 @@
+import f from "./BackButton.vue.js";
+export {
+  f as default
+};

package/components/Chip/Chip.vue.js

@@ -31,7 +31,7 @@ const V = ["role", "tabindex"], j = {
         case "small":
           return "h-5.5 text-[11px] px-2.5 gap-1";
         case "large":
-          return "h-8 text-sm px-3 gap-2";
+          return "h-7 text-sm px-3 gap-2";
         default:
           return "h-6 text-xs px-2.5 gap-1.5";
       }

package/components/DateRangePicker.vue.d.ts

@@ -14,6 +14,7 @@ type __VLS_Props = {
     size?: ButtonSize;
     variant?: ButtonVariant;
     showQuickRanges?: boolean;
+    triggerClass?: string;
 };
 declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     change: (...args: any[]) => void;

package/components/DateRangePicker.vue.js

@@ -6,10 +6,10 @@ import { $t as l } from "../utils/i18n.js";
 import P from "./Button.vue.js";
 import p from "v-datepicker-lite";
 import "v-datepicker-lite/style.css";
-const $ = { class: "flex items-center gap-2" }, H = { class: "flex flex-col sm:flex-row bg-background rounded-md" }, Q = {
+const $ = { class: "flex items-center justify-between gap-2 w-full" }, j = { class: "flex flex-col sm:flex-row bg-background rounded-md" }, H = {
   key: 0,
   class: "flex flex-col gap-1 sm:pr-3 py-2 sm:border-r border-border max-h-[280px]"
-}, j = { class: "flex flex-col sm:flex-row items-center gap-4 py-2 p-3" }, O = { class: "border border-border rounded-md overflow-hidden bg-background" }, I = { class: "flex items-center justify-center shrink-0" }, U = { class: "border border-border rounded-md overflow-hidden bg-background" }, ee = /* @__PURE__ */ V({
+}, Q = { class: "flex flex-col sm:flex-row items-center gap-4 py-2 p-3" }, O = { class: "border border-border rounded-md overflow-hidden bg-background" }, I = { class: "flex items-center justify-center shrink-0" }, U = { class: "border border-border rounded-md overflow-hidden bg-background" }, ee = /* @__PURE__ */ V({
   __name: "DateRangePicker",
   props: {
     modelValue: {},
@@ -21,18 +21,19 @@ const $ = { class: "flex items-center gap-2" }, H = { class: "flex flex-col sm:f
     readonly: { type: Boolean },
     size: {},
     variant: {},
-    showQuickRanges: { type: Boolean, default: !0 }
+    showQuickRanges: { type: Boolean, default: !0 },
+    triggerClass: {}
   },
   emits: ["update:modelValue", "change"],
   setup(r, { emit: M }) {
-    const v = r, D = M, o = w(!1), c = w(0);
+    const v = r, b = M, o = w(!1), c = w(0);
     L(o, (t) => {
       t && c.value++;
     });
     const n = u({
       get: () => v.modelValue || { start: null, end: null },
       set: (t) => {
-        D("update:modelValue", t), D("change", t);
+        b("update:modelValue", t), b("change", t);
       }
     }), Y = (t) => {
       n.value = { ...n.value, start: t };
@@ -44,13 +45,13 @@ const $ = { class: "flex items-center gap-2" }, H = { class: "flex flex-col sm:f
         if (!isNaN(t.getTime())) return t.toISOString();
       }
       return v.maxDate;
-    }), N = u(() => {
+    }), C = u(() => {
       if (n.value.start) {
         const t = new Date(n.value.start);
         if (!isNaN(t.getTime())) return t.toISOString();
       }
       return v.minDate;
-    }), b = (t) => {
+    }), D = (t) => {
       if (!t) return "";
       try {
         const e = new Date(t);
@@ -58,7 +59,7 @@ const $ = { class: "flex items-center gap-2" }, H = { class: "flex flex-col sm:f
       } catch {
         return "";
       }
-    }, C = u(() => [
+    }, N = u(() => [
       {
         label: l("vlite.dateRangePicker.today") !== "vlite.dateRangePicker.today" ? l("vlite.dateRangePicker.today") : "Today",
         value: "today",
@@ -152,30 +153,30 @@ const $ = { class: "flex items-center gap-2" }, H = { class: "flex flex-col sm:f
           variant: r.variant || "outline",
           size: r.size || "md",
           disabled: r.disabled,
-          class: k(["w-full sm:min-w-[280px] justify-start text-left font-normal", { "ring-2 ring-ring ring-offset-2": a }])
+          class: k(["w-max justify-between text-left font-normal", [r.triggerClass, { "ring-1 ring-ring ring-offset-[1]": a }]])
         }, {
           default: y(() => [
             i("div", $, [
               i("span", {
                 class: k({ "text-muted-foreground": !n.value.start })
-              }, R(n.value.start ? b(n.value.start) : r.placeholderStart), 3),
+              }, R(n.value.start ? D(n.value.start) : r.placeholderStart), 3),
               g(f, {
                 icon: "lucide:arrow-right",
-                class: "w-4 h-4 text-muted-foreground opacity-50 shrink-0"
+                class: "w-4 h-4 text-muted-foreground opacity-60 shrink-0"
               }),
               i("span", {
                 class: k({ "text-muted-foreground": !n.value.end })
-              }, R(n.value.end ? b(n.value.end) : r.placeholderEnd), 3)
+              }, R(n.value.end ? D(n.value.end) : r.placeholderEnd), 3)
             ])
           ]),
           _: 1
         }, 8, ["variant", "size", "disabled", "class"])
       ]),
       menu: y(() => [
-        i("div", H, [
-          r.showQuickRanges ? (d(), x("div", Q, [
+        i("div", j, [
+          r.showQuickRanges ? (d(), x("div", H, [
             e[1] || (e[1] = i("div", { class: "text-xs pl-2 pb-2 font-semibold text-muted-foreground uppercase tracking-wider" }, " Quick Ranges ", -1)),
-            (d(!0), x(z, null, B(C.value, (a) => (d(), m(P, {
+            (d(!0), x(z, null, B(N.value, (a) => (d(), m(P, {
               key: a.value,
               text: a.label,
               icon: a.icon,
@@ -185,7 +186,7 @@ const $ = { class: "flex items-center gap-2" }, H = { class: "flex flex-col sm:f
               onClick: (s) => F(a)
             }, null, 8, ["text", "icon", "onClick"]))), 128))
           ])) : E("", !0),
-          i("div", j, [
+          i("div", Q, [
             i("div", O, [
               (d(), m(h(p), {
                 key: "start-" + c.value,
@@ -214,7 +215,7 @@ const $ = { class: "flex items-center gap-2" }, H = { class: "flex flex-col sm:f
                 value: n.value.end,
                 onChange: _,
                 mode: "date",
-                "min-date": N.value,
+                "min-date": C.value,
                 "max-date": r.maxDate,
                 disabled: r.disabled,
                 readonly: r.readonly

package/components/Form/FormField.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent as U, computed as o, markRaw as I, openBlock as r, createBlock as f, mergeProps as u, toHandlers as S, createSlots as N, unref as R, withCtx as n, createVNode as z, createTextVNode as c, toDisplayString as m, createCommentVNode as L, resolveDynamicComponent as B } from "vue";
+import { defineComponent as U, computed as o, markRaw as I, openBlock as r, createBlock as f, mergeProps as s, toHandlers as S, createSlots as N, unref as R, withCtx as n, createVNode as z, createTextVNode as c, toDisplayString as m, createCommentVNode as L, resolveDynamicComponent as B } from "vue";
 import { isComponent as h, isAddonObject as p } from "./utils/form.utils.js";
 import O from "../NumberInput.vue.js";
 import v from "../Button.vue.js";
@@ -15,7 +15,7 @@ import G from "../DatePicker.vue.js";
 import J from "../ColorPicker/ColorPicker.vue.js";
 import K from "../IconPicker.vue.js";
 import M from "./CustomFields.vue.js";
-const se = /* @__PURE__ */ U({
+const ue = /* @__PURE__ */ U({
   __name: "FormField",
   props: {
     field: {},
@@ -32,10 +32,10 @@ const se = /* @__PURE__ */ U({
   },
   emits: ["change", "addonChange", "addonAction"],
   setup(l, { emit: $ }) {
-    const e = l, s = $, d = (t, a) => {
-      s("change", { value: t, data: a });
+    const e = l, u = $, d = (t, a) => {
+      u("change", { value: t, data: a });
     }, w = (t) => {
-      s("change", { value: t });
+      u("change", { value: t });
     }, C = o(() => {
       const t = e.field.type;
       if (h(t))
@@ -111,7 +111,7 @@ const se = /* @__PURE__ */ U({
         max: e.field.max,
         step: e.field.props?.step ?? 1,
         variant: e.field.props?.variant ?? "split",
-        mode: e.field.props?.mode ?? "outline",
+        mode: e.field.props?.mode ?? (e.variant === "transparent" ? "ghost" : "outline"),
         size: e.size,
         rounded: e.rounded,
         placeholder: i,
@@ -232,18 +232,18 @@ const se = /* @__PURE__ */ U({
       const t = e.field.type;
       return t === "text" || t === "email" || t === "password" || t === "tel" || t === "url" || t === "search" || !t;
     }), P = o(() => F.value && A.value), V = (t, a) => {
-      s("addonChange", t.name, { value: a.value });
+      u("addonChange", t.name, { value: a.value });
     }, k = (t) => {
-      t.action && s("addonAction", t.action);
+      t.action && u("addonAction", t.action);
     };
-    return (t, a) => P.value ? (r(), f(g, u({ key: 0 }, {
+    return (t, a) => P.value ? (r(), f(g, s({ key: 0 }, {
       ...b.value,
       ...l.field?.props || {}
     }, S(x.value)), N({ _: 2 }, [
       R(p)(l.field.addonLeft) ? {
         name: "addon-left",
         fn: n(() => [
-          l.field.addonLeft.type === "select" ? (r(), f(y, u({
+          l.field.addonLeft.type === "select" ? (r(), f(y, s({
             key: 0,
             modelValue: l.field.addonLeft.name ? l.values[l.field.addonLeft.name] : void 0,
             options: l.field.addonLeft.options || []
@@ -259,7 +259,7 @@ const se = /* @__PURE__ */ U({
               }, 1024)
             ]),
             _: 1
-          }, 16, ["modelValue", "options"])) : l.field.addonLeft.type === "button" ? (r(), f(v, u({
+          }, 16, ["modelValue", "options"])) : l.field.addonLeft.type === "button" ? (r(), f(v, s({
             key: 1,
             variant: "outline"
           }, l.field.addonLeft.props || {}, {
@@ -276,7 +276,7 @@ const se = /* @__PURE__ */ U({
       R(p)(l.field.addonRight) ? {
         name: "addon-right",
         fn: n(() => [
-          l.field.addonRight.type === "select" ? (r(), f(y, u({
+          l.field.addonRight.type === "select" ? (r(), f(y, s({
             key: 0,
             modelValue: l.field.addonRight.name ? l.values[l.field.addonRight.name] : void 0,
             options: l.field.addonRight.options || []
@@ -292,7 +292,7 @@ const se = /* @__PURE__ */ U({
               }, 1024)
             ]),
             _: 1
-          }, 16, ["modelValue", "options"])) : l.field.addonRight.type === "button" ? (r(), f(v, u({
+          }, 16, ["modelValue", "options"])) : l.field.addonRight.type === "button" ? (r(), f(v, s({
             key: 1,
             variant: "outline"
           }, l.field.addonRight.props || {}, {
@@ -306,7 +306,7 @@ const se = /* @__PURE__ */ U({
         ]),
         key: "1"
       } : void 0
-    ]), 1040)) : (r(), f(B(C.value), u({
+    ]), 1040)) : (r(), f(B(C.value), s({
       key: 1,
       class: ["switch", "check"].includes(l.field?.type) ? "" : "w-full"
     }, {
@@ -316,5 +316,5 @@ const se = /* @__PURE__ */ U({
   }
 });
 export {
-  se as default
+  ue as default
 };