appsalutely 0.1.2 → 0.1.4

package/dist/appsalutely.js

@@ -0,0 +1,383 @@
+(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode("html{overflow:auto}html[data-theme=dark]{color-scheme:dark}html[data-theme=light]{color-scheme:light}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
+import { ref as b, watch as C, computed as O, defineComponent as x, useModel as B, useSlots as A, onBeforeMount as E, createBlock as c, openBlock as m, unref as t, withCtx as s, createCommentVNode as w, createVNode as d, createElementBlock as $, renderSlot as h, createElementVNode as g, normalizeClass as z, toDisplayString as P, Fragment as S, renderList as L, normalizeStyle as q, mergeModels as T, withModifiers as U } from "vue";
+import { useRouter as R, RouterView as j } from "vue-router";
+import { VApp as G, VProgressLinear as H, VAppBar as D, VMain as J, VFooter as K, VBtn as V, VNavigationDrawer as Q, VList as X, VSnackbar as Y, VContainer as Z, VBreadcrumbs as ee, VCard as W, VForm as I, VCardText as N, VTextField as F, VListItem as te, VIcon as le, VOtpInput as oe } from "vuetify/components";
+import { defineStore as M } from "pinia";
+const ae = M("colorMode", () => {
+  const l = b(localStorage.getItem("colorMode") == "dark" ? "dark" : "light");
+  function r() {
+    l.value = l.value === "dark" ? "light" : "dark";
+  }
+  function o(a) {
+    localStorage.setItem("colorMode", a), document.documentElement.setAttribute("data-theme", a);
+  }
+  return C(l, (a) => o(a)), o(l.value), { mode: l, toggle: r };
+}), ne = M("footer", () => {
+  const l = b([]), r = O(() => l.value.length > 0 ? l.value[l.value.length - 1] : null);
+  function o(n) {
+    return n.id || (n.id = (/* @__PURE__ */ new Date()).getTime().toString()), n.timeout === void 0 && (n.timeout = 5e3), l.value.push(n), n.timeout && setTimeout(() => {
+      a(n.id);
+    }, n.timeout), n.id;
+  }
+  function a(n) {
+    l.value = l.value.filter((f) => f.id !== n);
+  }
+  return { messages: l, current: r, addMessage: o, removeMessage: a };
+}), re = M("notify", () => {
+  const l = b([]), r = b({});
+  function o(e) {
+    return e.id ? a(e.id) : e.id = (/* @__PURE__ */ new Date()).getTime().toString(), e.timeout === void 0 && (e.timeout = 5e3), l.value.push(e), e.timeout && (r.value[e.id] = setTimeout(() => {
+      a(e.id);
+    }, e.timeout)), e.id;
+  }
+  function a(e) {
+    l.value = l.value.filter((k) => k.id !== e), r.value[e] && (clearTimeout(r.value[e]), delete r.value[e]);
+  }
+  function n(e) {
+    return o({ text: e, type: "info" });
+  }
+  function f(e) {
+    return o({ text: e, type: "success" });
+  }
+  function u(e) {
+    return o({ text: e, type: "warning" });
+  }
+  function i(e) {
+    return o({ text: e, type: "error" });
+  }
+  return { messages: l, add: o, remove: a, info: n, success: f, warning: u, error: i };
+}), ue = { class: "d-flex flex-column pa-4 h-100" }, ie = ["textContent"], ge = /* @__PURE__ */ x({
+  __name: "AppBase",
+  props: {
+    drawerOpen: { type: Boolean, default: !1 },
+    drawerOpenModifiers: {}
+  },
+  emits: ["update:drawerOpen"],
+  setup(l) {
+    const r = ae(), o = B(l, "drawerOpen"), a = b(!1), n = ne(), f = b(!1), u = b(null), i = re(), e = R(), k = A();
+    return C(a, (y) => {
+      localStorage.setItem("drawerDocked", String(y));
+    }), E(() => {
+      e.beforeEach(() => {
+        u.value = setTimeout(() => {
+          f.value = !0;
+        }, 300);
+      }), e.afterEach(() => {
+        u.value && (clearTimeout(u.value), u.value = null), f.value = !1;
+      }), a.value = localStorage.getItem("drawerDocked") === "true", o.value = a.value;
+    }), (y, v) => (m(), c(t(G), {
+      theme: t(r).mode
+    }, {
+      default: s(() => [
+        f.value ? (m(), c(t(H), {
+          key: 0,
+          indeterminate: "",
+          class: "mb-n1",
+          style: { "z-index": "100000", opacity: "0.5" },
+          height: "1"
+        })) : w("", !0),
+        d(t(D), { height: "64" }, {
+          default: s(() => [
+            h(y.$slots, "header")
+          ]),
+          _: 3
+        }),
+        d(t(J), { class: "bg-surface-light" }, {
+          default: s(() => [
+            g("div", ue, [
+              d(t(j))
+            ])
+          ]),
+          _: 1
+        }),
+        t(k).footer ? (m(), c(t(D), {
+          key: 1,
+          height: "40",
+          location: "bottom"
+        }, {
+          default: s(() => [
+            d(t(K), { class: "py-0 w-100 d-flex align-center" }, {
+              default: s(() => [
+                t(n).current ? (m(), $("span", {
+                  key: 0,
+                  textContent: P(t(n).current.text),
+                  class: z([t(n).current.type ? {} : { ["text-" + t(n).current.type]: !0 }, "overflow-hidden text-no-wrap"]),
+                  style: { "text-overflow": "ellipsis" }
+                }, null, 10, ie)) : w("", !0),
+                t(n).current && t(n).current.actions ? (m(!0), $(S, { key: 1 }, L(Object.entries(t(n).current.actions), (p, _) => (m(), c(t(V), {
+                  text: p[0],
+                  onClick: p[1],
+                  key: _,
+                  density: "comfortable",
+                  variant: "tonal",
+                  class: "mx-2 px-2 text-none",
+                  color: t(n).current.type
+                }, null, 8, ["text", "onClick", "color"]))), 128)) : w("", !0),
+                v[2] || (v[2] = g("div", { class: "me-auto" }, null, -1)),
+                h(y.$slots, "footer")
+              ]),
+              _: 3,
+              __: [2]
+            })
+          ]),
+          _: 3
+        })) : w("", !0),
+        t(k).drawer ? (m(), c(t(Q), {
+          key: 2,
+          modelValue: o.value,
+          "onUpdate:modelValue": v[1] || (v[1] = (p) => o.value = p),
+          width: "250",
+          "rail-width": "58",
+          rail: a.value,
+          mobile: a.value ? !1 : void 0
+        }, {
+          default: s(() => [
+            d(t(X), {
+              class: "h-100 d-flex flex-column",
+              nav: ""
+            }, {
+              default: s(() => [
+                h(y.$slots, "drawer"),
+                v[3] || (v[3] = g("div", { class: "flex-grow-1" }, null, -1)),
+                d(t(V), {
+                  onClick: v[0] || (v[0] = (p) => a.value = !a.value),
+                  icon: "mdi-pin-outline",
+                  rounded: "rounded",
+                  density: "comfortable",
+                  title: a.value ? "Undock sidebar" : "Dock sidebar",
+                  class: "ma-1 ms-auto",
+                  variant: a.value ? "tonal" : "text"
+                }, null, 8, ["title", "variant"])
+              ]),
+              _: 3,
+              __: [3]
+            })
+          ]),
+          _: 3
+        }, 8, ["modelValue", "rail", "mobile"])) : w("", !0),
+        (m(!0), $(S, null, L(t(i).messages, (p, _) => (m(), c(t(Y), {
+          key: _,
+          "model-value": !0,
+          text: p.text,
+          color: p.type,
+          location: "bottom end",
+          style: q({ bottom: `${_ * 56}px` }),
+          timeout: -1
+        }, {
+          actions: s(() => [
+            d(t(V), {
+              icon: "mdi-close",
+              onClick: (pe) => t(i).remove(p.id)
+            }, null, 8, ["onClick"])
+          ]),
+          _: 2
+        }, 1032, ["text", "color", "style"]))), 128))
+      ]),
+      _: 3
+    }, 8, ["theme"]));
+  }
+}), ye = /* @__PURE__ */ x({
+  __name: "DashboardPage",
+  props: {
+    breadcrumbs: {},
+    fluid: { type: Boolean, default: !0 }
+  },
+  setup(l) {
+    return (r, o) => (m(), c(t(Z), {
+      fluid: r.fluid,
+      class: "h-100 d-flex flex-column py-0 h-100"
+    }, {
+      default: s(() => [
+        r.breadcrumbs ? (m(), c(t(ee), {
+          key: 0,
+          items: r.breadcrumbs,
+          density: "comfortable",
+          class: "pa-0 flex-wrap"
+        }, null, 8, ["items"])) : w("", !0),
+        h(r.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["fluid"]));
+  }
+}), se = (l, r) => {
+  const o = l.__vccOpts || l;
+  for (const [a, n] of r)
+    o[a] = n;
+  return o;
+}, de = {}, me = { class: "h-100 d-flex align-center" };
+function fe(l, r) {
+  return m(), $(S, null, [
+    r[0] || (r[0] = g("span", {
+      class: "border-s mx-3",
+      style: { height: "32px" }
+    }, null, -1)),
+    g("span", me, [
+      h(l.$slots, "default")
+    ])
+  ], 64);
+}
+const Ve = /* @__PURE__ */ se(de, [["render", fe]]), xe = /* @__PURE__ */ x({
+  __name: "LoginForm",
+  props: /* @__PURE__ */ T({
+    title: { default: "Log in" },
+    submitButtonText: { default: "Log in" },
+    minWidth: {},
+    maxWidth: {},
+    loading: { type: Boolean },
+    usernameLabel: { default: "Username" },
+    passwordLabel: { default: "Password" }
+  }, {
+    username: { default: "" },
+    usernameModifiers: {},
+    password: { default: "" },
+    passwordModifiers: {}
+  }),
+  emits: /* @__PURE__ */ T(["submit"], ["update:username", "update:password"]),
+  setup(l, { emit: r }) {
+    const o = B(l, "username"), a = B(l, "password"), n = r, f = b(!1);
+    return (u, i) => (m(), c(t(W), {
+      title: u.title,
+      "min-width": u.minWidth,
+      "max-width": u.maxWidth
+    }, {
+      default: s(() => [
+        d(t(I), {
+          onSubmit: i[2] || (i[2] = U((e) => n("submit", o.value, a.value), ["prevent"])),
+          modelValue: f.value,
+          "onUpdate:modelValue": i[3] || (i[3] = (e) => f.value = e)
+        }, {
+          default: s(() => [
+            d(t(N), { class: "d-flex flex-column" }, {
+              default: s(() => [
+                d(t(F), {
+                  modelValue: o.value,
+                  "onUpdate:modelValue": i[0] || (i[0] = (e) => o.value = e),
+                  label: u.usernameLabel,
+                  rules: [(e) => !!e || "Username is required"],
+                  "persistent-placeholder": "",
+                  autofocus: ""
+                }, null, 8, ["modelValue", "label", "rules"]),
+                d(t(F), {
+                  modelValue: a.value,
+                  "onUpdate:modelValue": i[1] || (i[1] = (e) => a.value = e),
+                  label: u.passwordLabel,
+                  type: "password",
+                  rules: [(e) => !!e || "Password is required"],
+                  "persistent-placeholder": ""
+                }, null, 8, ["modelValue", "label", "rules"]),
+                d(t(V), {
+                  disabled: !f.value,
+                  type: "submit",
+                  color: "primary",
+                  variant: "flat",
+                  text: u.submitButtonText,
+                  loading: u.loading,
+                  class: "align-self-center"
+                }, null, 8, ["disabled", "text", "loading"]),
+                h(u.$slots, "beneath")
+              ]),
+              _: 3
+            })
+          ]),
+          _: 3
+        }, 8, ["modelValue"])
+      ]),
+      _: 3
+    }, 8, ["title", "min-width", "max-width"]));
+  }
+}), ce = { class: "text-no-wrap overflow-hidden" }, ke = /* @__PURE__ */ x({
+  __name: "NavDrawerLink",
+  props: {
+    to: {},
+    icon: {},
+    text: {}
+  },
+  setup(l) {
+    return (r, o) => (m(), c(t(te), {
+      role: "option",
+      to: r.to,
+      slim: ""
+    }, {
+      prepend: s(() => [
+        d(t(le), { icon: r.icon }, null, 8, ["icon"])
+      ]),
+      default: s(() => [
+        g("span", ce, P(r.text), 1)
+      ]),
+      _: 1
+    }, 8, ["to"]));
+  }
+}), _e = /* @__PURE__ */ x({
+  __name: "OTPForm",
+  props: /* @__PURE__ */ T({
+    title: { default: "2FA Verification" },
+    subtitle: { default: "Enter the code from your authenticator app" },
+    submitButtonText: { default: "Verify" },
+    minWidth: {},
+    maxWidth: {},
+    loading: { type: Boolean },
+    length: { default: 6 },
+    autosubmit: { type: Boolean, default: !0 }
+  }, {
+    otp: { default: "" },
+    otpModifiers: {}
+  }),
+  emits: /* @__PURE__ */ T(["submit"], ["update:otp"]),
+  setup(l, { emit: r }) {
+    const o = B(l, "otp"), a = r, n = l, f = O(() => o.value.length === n.length);
+    return C(o, () => {
+      n.autosubmit && o.value.length === n.length && a("submit", o.value);
+    }), (u, i) => (m(), c(t(W), {
+      title: u.title,
+      subtitle: u.subtitle,
+      "min-width": u.minWidth,
+      "max-width": u.maxWidth
+    }, {
+      default: s(() => [
+        d(t(I), {
+          onSubmit: i[1] || (i[1] = U((e) => a("submit", o.value), ["prevent"])),
+          "model-value": f.value
+        }, {
+          default: s(() => [
+            d(t(N), { class: "d-flex flex-column" }, {
+              default: s(() => [
+                d(t(oe), {
+                  modelValue: o.value,
+                  "onUpdate:modelValue": i[0] || (i[0] = (e) => o.value = e),
+                  label: "OTP",
+                  "persistent-placeholder": "",
+                  autofocus: "",
+                  length: u.length
+                }, null, 8, ["modelValue", "length"]),
+                d(t(V), {
+                  disabled: !f.value,
+                  type: "submit",
+                  color: "primary",
+                  variant: "flat",
+                  text: u.submitButtonText,
+                  loading: u.loading,
+                  class: "align-self-center"
+                }, null, 8, ["disabled", "text", "loading"]),
+                h(u.$slots, "beneath")
+              ]),
+              _: 3
+            })
+          ]),
+          _: 3
+        }, 8, ["model-value"])
+      ]),
+      _: 3
+    }, 8, ["title", "subtitle", "min-width", "max-width"]));
+  }
+});
+export {
+  ge as AppBase,
+  ye as DashboardPage,
+  Ve as FooterSection,
+  xe as LoginForm,
+  ke as NavDrawerLink,
+  _e as OTPForm,
+  ae as useColorMode,
+  ne as useFooter,
+  re as useNotify
+};

package/dist/appsalutely.umd.cjs

@@ -0,0 +1,2 @@
+(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode("html{overflow:auto}html[data-theme=dark]{color-scheme:dark}html[data-theme=light]{color-scheme:light}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
+(function(s,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("vue-router"),require("vuetify/components"),require("pinia")):typeof define=="function"&&define.amd?define(["exports","vue","vue-router","vuetify/components","pinia"],e):(s=typeof globalThis<"u"?globalThis:s||self,e(s.appsalutely={},s.Vue,s.VueRouter,s.VuetifyComponents,s.Pinia))})(this,function(s,e,b,i,w){"use strict";const k=w.defineStore("colorMode",()=>{const r=e.ref(localStorage.getItem("colorMode")=="dark"?"dark":"light");function a(){r.value=r.value==="dark"?"light":"dark"}function l(o){localStorage.setItem("colorMode",o),document.documentElement.setAttribute("data-theme",o)}return e.watch(r,o=>l(o)),l(r.value),{mode:r,toggle:a}}),y=w.defineStore("footer",()=>{const r=e.ref([]),a=e.computed(()=>r.value.length>0?r.value[r.value.length-1]:null);function l(n){return n.id||(n.id=new Date().getTime().toString()),n.timeout===void 0&&(n.timeout=5e3),r.value.push(n),n.timeout&&setTimeout(()=>{o(n.id)},n.timeout),n.id}function o(n){r.value=r.value.filter(f=>f.id!==n)}return{messages:r,current:a,addMessage:l,removeMessage:o}}),g=w.defineStore("notify",()=>{const r=e.ref([]),a=e.ref({});function l(t){return t.id?o(t.id):t.id=new Date().getTime().toString(),t.timeout===void 0&&(t.timeout=5e3),r.value.push(t),t.timeout&&(a.value[t.id]=setTimeout(()=>{o(t.id)},t.timeout)),t.id}function o(t){r.value=r.value.filter(V=>V.id!==t),a.value[t]&&(clearTimeout(a.value[t]),delete a.value[t])}function n(t){return l({text:t,type:"info"})}function f(t){return l({text:t,type:"success"})}function d(t){return l({text:t,type:"warning"})}function u(t){return l({text:t,type:"error"})}return{messages:r,add:l,remove:o,info:n,success:f,warning:d,error:u}}),B={class:"d-flex flex-column pa-4 h-100"},x=["textContent"],C=e.defineComponent({__name:"AppBase",props:{drawerOpen:{type:Boolean,default:!1},drawerOpenModifiers:{}},emits:["update:drawerOpen"],setup(r){const a=k(),l=e.useModel(r,"drawerOpen"),o=e.ref(!1),n=y(),f=e.ref(!1),d=e.ref(null),u=g(),t=b.useRouter(),V=e.useSlots();return e.watch(o,p=>{localStorage.setItem("drawerDocked",String(p))}),e.onBeforeMount(()=>{t.beforeEach(()=>{d.value=setTimeout(()=>{f.value=!0},300)}),t.afterEach(()=>{d.value&&(clearTimeout(d.value),d.value=null),f.value=!1}),o.value=localStorage.getItem("drawerDocked")==="true",l.value=o.value}),(p,m)=>(e.openBlock(),e.createBlock(e.unref(i.VApp),{theme:e.unref(a).mode},{default:e.withCtx(()=>[f.value?(e.openBlock(),e.createBlock(e.unref(i.VProgressLinear),{key:0,indeterminate:"",class:"mb-n1",style:{"z-index":"100000",opacity:"0.5"},height:"1"})):e.createCommentVNode("",!0),e.createVNode(e.unref(i.VAppBar),{height:"64"},{default:e.withCtx(()=>[e.renderSlot(p.$slots,"header")]),_:3}),e.createVNode(e.unref(i.VMain),{class:"bg-surface-light"},{default:e.withCtx(()=>[e.createElementVNode("div",B,[e.createVNode(e.unref(b.RouterView))])]),_:1}),e.unref(V).footer?(e.openBlock(),e.createBlock(e.unref(i.VAppBar),{key:1,height:"40",location:"bottom"},{default:e.withCtx(()=>[e.createVNode(e.unref(i.VFooter),{class:"py-0 w-100 d-flex align-center"},{default:e.withCtx(()=>[e.unref(n).current?(e.openBlock(),e.createElementBlock("span",{key:0,textContent:e.toDisplayString(e.unref(n).current.text),class:e.normalizeClass([e.unref(n).current.type?{}:{["text-"+e.unref(n).current.type]:!0},"overflow-hidden text-no-wrap"]),style:{"text-overflow":"ellipsis"}},null,10,x)):e.createCommentVNode("",!0),e.unref(n).current&&e.unref(n).current.actions?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:1},e.renderList(Object.entries(e.unref(n).current.actions),(c,h)=>(e.openBlock(),e.createBlock(e.unref(i.VBtn),{text:c[0],onClick:c[1],key:h,density:"comfortable",variant:"tonal",class:"mx-2 px-2 text-none",color:e.unref(n).current.type},null,8,["text","onClick","color"]))),128)):e.createCommentVNode("",!0),m[2]||(m[2]=e.createElementVNode("div",{class:"me-auto"},null,-1)),e.renderSlot(p.$slots,"footer")]),_:3,__:[2]})]),_:3})):e.createCommentVNode("",!0),e.unref(V).drawer?(e.openBlock(),e.createBlock(e.unref(i.VNavigationDrawer),{key:2,modelValue:l.value,"onUpdate:modelValue":m[1]||(m[1]=c=>l.value=c),width:"250","rail-width":"58",rail:o.value,mobile:o.value?!1:void 0},{default:e.withCtx(()=>[e.createVNode(e.unref(i.VList),{class:"h-100 d-flex flex-column",nav:""},{default:e.withCtx(()=>[e.renderSlot(p.$slots,"drawer"),m[3]||(m[3]=e.createElementVNode("div",{class:"flex-grow-1"},null,-1)),e.createVNode(e.unref(i.VBtn),{onClick:m[0]||(m[0]=c=>o.value=!o.value),icon:"mdi-pin-outline",rounded:"rounded",density:"comfortable",title:o.value?"Undock sidebar":"Dock sidebar",class:"ma-1 ms-auto",variant:o.value?"tonal":"text"},null,8,["title","variant"])]),_:3,__:[3]})]),_:3},8,["modelValue","rail","mobile"])):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(u).messages,(c,h)=>(e.openBlock(),e.createBlock(e.unref(i.VSnackbar),{key:h,"model-value":!0,text:c.text,color:c.type,location:"bottom end",style:e.normalizeStyle({bottom:`${h*56}px`}),timeout:-1},{actions:e.withCtx(()=>[e.createVNode(e.unref(i.VBtn),{icon:"mdi-close",onClick:O=>e.unref(u).remove(c.id)},null,8,["onClick"])]),_:2},1032,["text","color","style"]))),128))]),_:3},8,["theme"]))}}),N=e.defineComponent({__name:"DashboardPage",props:{breadcrumbs:{},fluid:{type:Boolean,default:!0}},setup(r){return(a,l)=>(e.openBlock(),e.createBlock(e.unref(i.VContainer),{fluid:a.fluid,class:"h-100 d-flex flex-column py-0 h-100"},{default:e.withCtx(()=>[a.breadcrumbs?(e.openBlock(),e.createBlock(e.unref(i.VBreadcrumbs),{key:0,items:a.breadcrumbs,density:"comfortable",class:"pa-0 flex-wrap"},null,8,["items"])):e.createCommentVNode("",!0),e.renderSlot(a.$slots,"default")]),_:3},8,["fluid"]))}}),S=(r,a)=>{const l=r.__vccOpts||r;for(const[o,n]of a)l[o]=n;return l},M={},T={class:"h-100 d-flex align-center"};function _(r,a){return e.openBlock(),e.createElementBlock(e.Fragment,null,[a[0]||(a[0]=e.createElementVNode("span",{class:"border-s mx-3",style:{height:"32px"}},null,-1)),e.createElementVNode("span",T,[e.renderSlot(r.$slots,"default")])],64)}const $=S(M,[["render",_]]),F=e.defineComponent({__name:"LoginForm",props:e.mergeModels({title:{default:"Log in"},submitButtonText:{default:"Log in"},minWidth:{},maxWidth:{},loading:{type:Boolean},usernameLabel:{default:"Username"},passwordLabel:{default:"Password"}},{username:{default:""},usernameModifiers:{},password:{default:""},passwordModifiers:{}}),emits:e.mergeModels(["submit"],["update:username","update:password"]),setup(r,{emit:a}){const l=e.useModel(r,"username"),o=e.useModel(r,"password"),n=a,f=e.ref(!1);return(d,u)=>(e.openBlock(),e.createBlock(e.unref(i.VCard),{title:d.title,"min-width":d.minWidth,"max-width":d.maxWidth},{default:e.withCtx(()=>[e.createVNode(e.unref(i.VForm),{onSubmit:u[2]||(u[2]=e.withModifiers(t=>n("submit",l.value,o.value),["prevent"])),modelValue:f.value,"onUpdate:modelValue":u[3]||(u[3]=t=>f.value=t)},{default:e.withCtx(()=>[e.createVNode(e.unref(i.VCardText),{class:"d-flex flex-column"},{default:e.withCtx(()=>[e.createVNode(e.unref(i.VTextField),{modelValue:l.value,"onUpdate:modelValue":u[0]||(u[0]=t=>l.value=t),label:d.usernameLabel,rules:[t=>!!t||"Username is required"],"persistent-placeholder":"",autofocus:""},null,8,["modelValue","label","rules"]),e.createVNode(e.unref(i.VTextField),{modelValue:o.value,"onUpdate:modelValue":u[1]||(u[1]=t=>o.value=t),label:d.passwordLabel,type:"password",rules:[t=>!!t||"Password is required"],"persistent-placeholder":""},null,8,["modelValue","label","rules"]),e.createVNode(e.unref(i.VBtn),{disabled:!f.value,type:"submit",color:"primary",variant:"flat",text:d.submitButtonText,loading:d.loading,class:"align-self-center"},null,8,["disabled","text","loading"]),e.renderSlot(d.$slots,"beneath")]),_:3})]),_:3},8,["modelValue"])]),_:3},8,["title","min-width","max-width"]))}}),L={class:"text-no-wrap overflow-hidden"},E=e.defineComponent({__name:"NavDrawerLink",props:{to:{},icon:{},text:{}},setup(r){return(a,l)=>(e.openBlock(),e.createBlock(e.unref(i.VListItem),{role:"option",to:a.to,slim:""},{prepend:e.withCtx(()=>[e.createVNode(e.unref(i.VIcon),{icon:a.icon},null,8,["icon"])]),default:e.withCtx(()=>[e.createElementVNode("span",L,e.toDisplayString(a.text),1)]),_:1},8,["to"]))}}),D=e.defineComponent({__name:"OTPForm",props:e.mergeModels({title:{default:"2FA Verification"},subtitle:{default:"Enter the code from your authenticator app"},submitButtonText:{default:"Verify"},minWidth:{},maxWidth:{},loading:{type:Boolean},length:{default:6},autosubmit:{type:Boolean,default:!0}},{otp:{default:""},otpModifiers:{}}),emits:e.mergeModels(["submit"],["update:otp"]),setup(r,{emit:a}){const l=e.useModel(r,"otp"),o=a,n=r,f=e.computed(()=>l.value.length===n.length);return e.watch(l,()=>{n.autosubmit&&l.value.length===n.length&&o("submit",l.value)}),(d,u)=>(e.openBlock(),e.createBlock(e.unref(i.VCard),{title:d.title,subtitle:d.subtitle,"min-width":d.minWidth,"max-width":d.maxWidth},{default:e.withCtx(()=>[e.createVNode(e.unref(i.VForm),{onSubmit:u[1]||(u[1]=e.withModifiers(t=>o("submit",l.value),["prevent"])),"model-value":f.value},{default:e.withCtx(()=>[e.createVNode(e.unref(i.VCardText),{class:"d-flex flex-column"},{default:e.withCtx(()=>[e.createVNode(e.unref(i.VOtpInput),{modelValue:l.value,"onUpdate:modelValue":u[0]||(u[0]=t=>l.value=t),label:"OTP","persistent-placeholder":"",autofocus:"",length:d.length},null,8,["modelValue","length"]),e.createVNode(e.unref(i.VBtn),{disabled:!f.value,type:"submit",color:"primary",variant:"flat",text:d.submitButtonText,loading:d.loading,class:"align-self-center"},null,8,["disabled","text","loading"]),e.renderSlot(d.$slots,"beneath")]),_:3})]),_:3},8,["model-value"])]),_:3},8,["title","subtitle","min-width","max-width"]))}});s.AppBase=C,s.DashboardPage=N,s.FooterSection=$,s.LoginForm=F,s.NavDrawerLink=E,s.OTPForm=D,s.useColorMode=k,s.useFooter=y,s.useNotify=g,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});

package/dist/{components → types/components}/DashboardPage.vue.d.ts

@@ -2,7 +2,6 @@ import { VBreadcrumbs } from 'vuetify/components';
 type __VLS_Props = {
     breadcrumbs?: VBreadcrumbs['$props']['items'];
     fluid?: boolean;
-    title?: string;
 };
 declare var __VLS_10: {};
 type __VLS_Slots = {} & {

package/dist/{components → types/components}/LoginForm.vue.d.ts

@@ -4,12 +4,18 @@ type __VLS_Props = {
     minWidth?: string | number;
     maxWidth?: string | number;
     loading?: boolean;
+    usernameLabel?: string;
+    passwordLabel?: string;
 };
 type __VLS_PublicProps = __VLS_Props & {
     'username'?: string;
     'password'?: string;
 };
-declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare var __VLS_30: {};
+type __VLS_Slots = {} & {
+    beneath?: (props: typeof __VLS_30) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     submit: (args_0: string, args_1: string) => any;
     "update:username": (value: string) => any;
     "update:password": (value: string) => any;
@@ -20,5 +26,13 @@ declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {},
 }>, {
     title: string;
     submitButtonText: string;
+    usernameLabel: string;
+    passwordLabel: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/{components → types/components}/OTPForm.vue.d.ts

@@ -11,7 +11,11 @@ type __VLS_Props = {
 type __VLS_PublicProps = __VLS_Props & {
     'otp'?: string;
 };
-declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare var __VLS_26: {};
+type __VLS_Slots = {} & {
+    beneath?: (props: typeof __VLS_26) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     submit: (args_0: string) => any;
     "update:otp": (value: string) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
@@ -24,4 +28,10 @@ declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {}, {},
     submitButtonText: string;
     autosubmit: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/index.d.ts

@@ -0,0 +1,9 @@
+export { default as AppBase } from './components/AppBase.vue';
+export { default as DashboardPage } from './components/DashboardPage.vue';
+export { default as FooterSection } from './components/FooterSection.vue';
+export { default as LoginForm } from './components/LoginForm.vue';
+export { default as NavDrawerLink } from './components/NavDrawerLink.vue';
+export { default as OTPForm } from './components/OTPForm.vue';
+export { default as useColorMode } from './stores/colorMode';
+export { default as useFooter } from './stores/footer';
+export { default as useNotify } from './stores/notify';

package/package.json

@@ -1,46 +1,43 @@
 {
   "name": "appsalutely",
-  "description": "A utility library for building applications with FastAPI and Vue.js",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "type": "module",
-  "module": "./dist/index.js",
-  "main": "./dist/index.umd.js",
-  "types": "./dist/index.d.ts",
-  "license": "MIT",
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/appsalutely.umd.cjs",
+  "module": "./dist/appsalutely.js",
   "exports": {
     ".": {
-      "import": "./dist/index.js",
-      "require": "./dist/index.umd.js"
-    },
-    "./index.css": "./dist/index.css"
+      "import": "./dist/appsalutely.js",
+      "require": "./dist/appsalutely.umd.cjs"
+    }
   },
+  "types": "./dist/types/index.d.ts",
   "scripts": {
     "build": "vite build && vue-tsc",
     "type-check": "vue-tsc --build",
     "lint": "eslint . --fix",
     "format": "prettier --write src/"
   },
-  "dependencies": {
-    "pinia": "^3.0.1",
+  "peerDependencies": {
+    "pinia": "^3.0.2",
     "vue": "^3.5.13",
     "vue-router": "^4.5.1",
-    "vuetify": "^3.8.5"
+    "vuetify": "^3.8.6"
   },
   "devDependencies": {
-    "@tsconfig/node22": "^22.0.1",
-    "@types/node": "^22.14.0",
-    "@vitejs/plugin-vue": "^5.2.4",
+    "@types/node": "^22.15.21",
+    "@vitejs/plugin-vue": "^5.2.3",
     "@vue/eslint-config-prettier": "^10.2.0",
     "@vue/eslint-config-typescript": "^14.5.0",
     "@vue/tsconfig": "^0.7.0",
-    "eslint": "^9.22.0",
-    "eslint-plugin-vue": "~10.0.0",
+    "eslint": "^9.27.0",
+    "eslint-plugin-vue": "^10.1.0",
     "jiti": "^2.4.2",
-    "npm-run-all2": "^7.0.2",
-    "prettier": "3.5.3",
-    "typescript": "~5.8.0",
-    "vite": "^6.2.4",
-    "vite-plugin-vue-devtools": "^7.7.2",
+    "typescript": "~5.8.3",
+    "vite": "^6.3.5",
+    "vite-plugin-css-injected-by-js": "^3.5.2",
     "vue-tsc": "^2.2.8"
   }
 }

package/.editorconfig

@@ -1,9 +0,0 @@
-[*.{js,jsx,mjs,cjs,ts,tsx,mts,cts,vue,css,scss,sass,less,styl}]
-charset = utf-8
-indent_size = 2
-indent_style = space
-insert_final_newline = true
-trim_trailing_whitespace = true
-
-end_of_line = lf
-max_line_length = 100

package/.prettierrc.json

@@ -1,6 +0,0 @@
-{
-  "$schema": "https://json.schemastore.org/prettierrc",
-  "semi": false,
-  "singleQuote": true,
-  "printWidth": 100
-}

package/dist/index.css

@@ -1 +0,0 @@
-html{overflow:auto}html[data-theme=dark]{color-scheme:dark}html[data-theme=light]{color-scheme:light}

package/dist/index.d.ts

@@ -1,10 +0,0 @@
-import AppBase from './components/AppBase.vue';
-import DashboardPage from './components/DashboardPage.vue';
-import FooterSection from './components/FooterSection.vue';
-import LoginForm from './components/LoginForm.vue';
-import NavDrawerLink from './components/NavDrawerLink.vue';
-import OTPForm from './components/OTPForm.vue';
-import useColorMode from './stores/colorMode';
-import useFooter from './stores/footer';
-import useNotify from './stores/notify';
-export { AppBase, DashboardPage, FooterSection, LoginForm, NavDrawerLink, OTPForm, useColorMode, useFooter, useNotify, };

package/dist/index.js

@@ -1,381 +0,0 @@
-import { ref as v, watch as S, computed as P, defineComponent as k, useModel as B, useSlots as A, onBeforeMount as E, createBlock as f, openBlock as m, unref as t, withCtx as s, createCommentVNode as h, createVNode as d, createElementBlock as w, renderSlot as V, createElementVNode as b, normalizeClass as j, toDisplayString as M, Fragment as T, renderList as F, normalizeStyle as z, mergeModels as C, withModifiers as U } from "vue";
-import { useRouter as q, RouterView as R } from "vue-router";
-import { VApp as G, VProgressLinear as H, VAppBar as O, VMain as J, VFooter as K, VBtn as x, VNavigationDrawer as Q, VList as X, VSnackbar as Y, VContainer as Z, VBreadcrumbs as ee, VCard as W, VForm as I, VCardText as N, VTextField as L, VListItem as te, VIcon as oe, VOtpInput as le } from "vuetify/components";
-import { defineStore as D } from "pinia";
-const ne = D("colorMode", () => {
-  const o = v(localStorage.getItem("colorMode") == "dark" ? "dark" : "light");
-  function n() {
-    o.value = o.value === "dark" ? "light" : "dark";
-  }
-  function l(r) {
-    localStorage.setItem("colorMode", r), document.documentElement.setAttribute("data-theme", r);
-  }
-  return S(o, (r) => l(r)), l(o.value), { mode: o, toggle: n };
-}), re = D("footer", () => {
-  const o = v([]), n = P(() => o.value.length > 0 ? o.value[o.value.length - 1] : null);
-  function l(a) {
-    return a.id || (a.id = (/* @__PURE__ */ new Date()).getTime().toString()), a.timeout === void 0 && (a.timeout = 5e3), o.value.push(a), a.timeout && setTimeout(() => {
-      r(a.id);
-    }, a.timeout), a.id;
-  }
-  function r(a) {
-    o.value = o.value.filter((c) => c.id !== a);
-  }
-  return { messages: o, current: n, addMessage: l, removeMessage: r };
-}), ae = D("notify", () => {
-  const o = v([]), n = v({});
-  function l(e) {
-    return e.id ? r(e.id) : e.id = (/* @__PURE__ */ new Date()).getTime().toString(), e.timeout === void 0 && (e.timeout = 5e3), o.value.push(e), e.timeout && (n.value[e.id] = setTimeout(() => {
-      r(e.id);
-    }, e.timeout)), e.id;
-  }
-  function r(e) {
-    o.value = o.value.filter((_) => _.id !== e), n.value[e] && (clearTimeout(n.value[e]), delete n.value[e]);
-  }
-  function a(e) {
-    return l({ text: e, type: "info" });
-  }
-  function c(e) {
-    return l({ text: e, type: "success" });
-  }
-  function u(e) {
-    return l({ text: e, type: "warning" });
-  }
-  function i(e) {
-    return l({ text: e, type: "error" });
-  }
-  return { messages: o, add: l, remove: r, info: a, success: c, warning: u, error: i };
-}), ue = { class: "d-flex flex-column pa-4 h-100" }, ie = ["textContent"], xe = /* @__PURE__ */ k({
-  __name: "AppBase",
-  props: {
-    drawerOpen: { type: Boolean, default: !1 },
-    drawerOpenModifiers: {}
-  },
-  emits: ["update:drawerOpen"],
-  setup(o) {
-    const n = ne(), l = B(o, "drawerOpen"), r = v(!1), a = re(), c = v(!1), u = v(null), i = ae(), e = q(), _ = A();
-    return S(r, (g) => {
-      localStorage.setItem("drawerDocked", String(g));
-    }), E(() => {
-      e.beforeEach(() => {
-        u.value = setTimeout(() => {
-          c.value = !0;
-        }, 300);
-      }), e.afterEach(() => {
-        u.value && (clearTimeout(u.value), u.value = null), c.value = !1;
-      }), r.value = localStorage.getItem("drawerDocked") === "true", l.value = r.value;
-    }), (g, y) => (m(), f(t(G), {
-      theme: t(n).mode
-    }, {
-      default: s(() => [
-        c.value ? (m(), f(t(H), {
-          key: 0,
-          indeterminate: "",
-          class: "mb-n1",
-          style: { "z-index": "100000", opacity: "0.5" },
-          height: "1"
-        })) : h("", !0),
-        d(t(O), { height: "64" }, {
-          default: s(() => [
-            V(g.$slots, "header")
-          ]),
-          _: 3
-        }),
-        d(t(J), { class: "bg-surface-light" }, {
-          default: s(() => [
-            b("div", ue, [
-              d(t(R))
-            ])
-          ]),
-          _: 1
-        }),
-        t(_).footer ? (m(), f(t(O), {
-          key: 1,
-          height: "40",
-          location: "bottom"
-        }, {
-          default: s(() => [
-            d(t(K), { class: "py-0 w-100 d-flex align-center" }, {
-              default: s(() => [
-                t(a).current ? (m(), w("span", {
-                  key: 0,
-                  textContent: M(t(a).current.text),
-                  class: j([t(a).current.type ? {} : { ["text-" + t(a).current.type]: !0 }, "overflow-hidden text-no-wrap"]),
-                  style: { "text-overflow": "ellipsis" }
-                }, null, 10, ie)) : h("", !0),
-                t(a).current && t(a).current.actions ? (m(!0), w(T, { key: 1 }, F(Object.entries(t(a).current.actions), (p, $) => (m(), f(t(x), {
-                  text: p[0],
-                  onClick: p[1],
-                  key: $,
-                  density: "comfortable",
-                  variant: "tonal",
-                  class: "mx-2 px-2 text-none",
-                  color: t(a).current.type
-                }, null, 8, ["text", "onClick", "color"]))), 128)) : h("", !0),
-                y[2] || (y[2] = b("div", { class: "me-auto" }, null, -1)),
-                V(g.$slots, "footer")
-              ]),
-              _: 3,
-              __: [2]
-            })
-          ]),
-          _: 3
-        })) : h("", !0),
-        t(_).drawer ? (m(), f(t(Q), {
-          key: 2,
-          modelValue: l.value,
-          "onUpdate:modelValue": y[1] || (y[1] = (p) => l.value = p),
-          width: "250",
-          "rail-width": "58",
-          rail: r.value,
-          mobile: r.value ? !1 : void 0
-        }, {
-          default: s(() => [
-            d(t(X), { class: "h-100 d-flex flex-column" }, {
-              default: s(() => [
-                V(g.$slots, "drawer"),
-                d(t(x), {
-                  onClick: y[0] || (y[0] = (p) => r.value = !r.value),
-                  icon: "mdi-pin-outline",
-                  rounded: "rounded",
-                  density: "comfortable",
-                  title: r.value ? "Undock sidebar" : "Dock sidebar",
-                  class: "my-1 mx-3 ms-auto",
-                  variant: r.value ? "tonal" : "text"
-                }, null, 8, ["title", "variant"])
-              ]),
-              _: 3
-            })
-          ]),
-          _: 3
-        }, 8, ["modelValue", "rail", "mobile"])) : h("", !0),
-        (m(!0), w(T, null, F(t(i).messages, (p, $) => (m(), f(t(Y), {
-          key: $,
-          "model-value": !0,
-          text: p.text,
-          color: p.type,
-          location: "bottom end",
-          style: z({ bottom: `${$ * 56}px` }),
-          timeout: -1
-        }, {
-          actions: s(() => [
-            d(t(x), {
-              icon: "mdi-close",
-              onClick: (be) => t(i).remove(p.id)
-            }, null, 8, ["onClick"])
-          ]),
-          _: 2
-        }, 1032, ["text", "color", "style"]))), 128))
-      ]),
-      _: 3
-    }, 8, ["theme"]));
-  }
-}), se = ["textContent"], ke = /* @__PURE__ */ k({
-  __name: "DashboardPage",
-  props: {
-    breadcrumbs: {},
-    fluid: { type: Boolean, default: !0 },
-    title: {}
-  },
-  setup(o) {
-    return (n, l) => (m(), f(t(Z), {
-      fluid: n.fluid,
-      class: "h-100 d-flex flex-column py-0 h-100"
-    }, {
-      default: s(() => [
-        n.breadcrumbs ? (m(), f(t(ee), {
-          key: 0,
-          items: n.breadcrumbs,
-          density: "comfortable",
-          class: "pa-0"
-        }, null, 8, ["items"])) : h("", !0),
-        n.title ? (m(), w("h1", {
-          key: 1,
-          textContent: M(n.title),
-          class: "text-h5 font-bold ma-1"
-        }, null, 8, se)) : h("", !0),
-        V(n.$slots, "default")
-      ]),
-      _: 3
-    }, 8, ["fluid"]));
-  }
-}), de = (o, n) => {
-  const l = o.__vccOpts || o;
-  for (const [r, a] of n)
-    l[r] = a;
-  return l;
-}, me = {}, ce = { class: "h-100 d-flex align-center" };
-function fe(o, n) {
-  return m(), w(T, null, [
-    n[0] || (n[0] = b("span", {
-      class: "border-s mx-3",
-      style: { height: "32px" }
-    }, null, -1)),
-    b("span", ce, [
-      V(o.$slots, "default")
-    ])
-  ], 64);
-}
-const _e = /* @__PURE__ */ de(me, [["render", fe]]), pe = { class: "d-flex justify-center" }, $e = /* @__PURE__ */ k({
-  __name: "LoginForm",
-  props: /* @__PURE__ */ C({
-    title: { default: "Login" },
-    submitButtonText: { default: "Login" },
-    minWidth: {},
-    maxWidth: {},
-    loading: { type: Boolean }
-  }, {
-    username: { default: "" },
-    usernameModifiers: {},
-    password: { default: "" },
-    passwordModifiers: {}
-  }),
-  emits: /* @__PURE__ */ C(["submit"], ["update:username", "update:password"]),
-  setup(o, { emit: n }) {
-    const l = B(o, "username"), r = B(o, "password"), a = n, c = v(!1);
-    return (u, i) => (m(), f(t(W), {
-      title: u.title,
-      "min-width": u.minWidth,
-      "max-width": u.maxWidth
-    }, {
-      default: s(() => [
-        d(t(I), {
-          onSubmit: i[2] || (i[2] = U((e) => a("submit", l.value, r.value), ["prevent"])),
-          modelValue: c.value,
-          "onUpdate:modelValue": i[3] || (i[3] = (e) => c.value = e)
-        }, {
-          default: s(() => [
-            d(t(N), null, {
-              default: s(() => [
-                d(t(L), {
-                  modelValue: l.value,
-                  "onUpdate:modelValue": i[0] || (i[0] = (e) => l.value = e),
-                  label: "Username",
-                  rules: [(e) => !!e || "Username is required"],
-                  "persistent-placeholder": "",
-                  autofocus: ""
-                }, null, 8, ["modelValue", "rules"]),
-                d(t(L), {
-                  modelValue: r.value,
-                  "onUpdate:modelValue": i[1] || (i[1] = (e) => r.value = e),
-                  label: "Password",
-                  type: "password",
-                  rules: [(e) => !!e || "Password is required"],
-                  "persistent-placeholder": ""
-                }, null, 8, ["modelValue", "rules"]),
-                b("div", pe, [
-                  d(t(x), {
-                    disabled: !c.value,
-                    type: "submit",
-                    color: "primary",
-                    variant: "flat",
-                    text: u.submitButtonText,
-                    loading: u.loading
-                  }, null, 8, ["disabled", "text", "loading"])
-                ])
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        }, 8, ["modelValue"])
-      ]),
-      _: 1
-    }, 8, ["title", "min-width", "max-width"]));
-  }
-}), ve = { class: "text-no-wrap overflow-hidden" }, Be = /* @__PURE__ */ k({
-  __name: "NavDrawerLink",
-  props: {
-    to: {},
-    icon: {},
-    text: {}
-  },
-  setup(o) {
-    return (n, l) => (m(), f(t(te), {
-      role: "option",
-      to: n.to,
-      slim: ""
-    }, {
-      prepend: s(() => [
-        d(t(oe), { icon: n.icon }, null, 8, ["icon"])
-      ]),
-      default: s(() => [
-        b("span", ve, M(n.text), 1)
-      ]),
-      _: 1
-    }, 8, ["to"]));
-  }
-}), he = { class: "d-flex justify-center" }, Ce = /* @__PURE__ */ k({
-  __name: "OTPForm",
-  props: /* @__PURE__ */ C({
-    title: { default: "2FA Verification" },
-    subtitle: { default: "Enter the code from your authenticator app" },
-    submitButtonText: { default: "Verify" },
-    minWidth: {},
-    maxWidth: {},
-    loading: { type: Boolean },
-    length: { default: 6 },
-    autosubmit: { type: Boolean, default: !0 }
-  }, {
-    otp: { default: "" },
-    otpModifiers: {}
-  }),
-  emits: /* @__PURE__ */ C(["submit"], ["update:otp"]),
-  setup(o, { emit: n }) {
-    const l = B(o, "otp"), r = n, a = o, c = P(() => l.value.length === a.length);
-    return S(l, () => {
-      a.autosubmit && l.value.length === a.length && r("submit", l.value);
-    }), (u, i) => (m(), f(t(W), {
-      title: u.title,
-      subtitle: u.subtitle,
-      "min-width": u.minWidth,
-      "max-width": u.maxWidth
-    }, {
-      default: s(() => [
-        d(t(I), {
-          onSubmit: i[1] || (i[1] = U((e) => r("submit", l.value), ["prevent"])),
-          "model-value": c.value
-        }, {
-          default: s(() => [
-            d(t(N), null, {
-              default: s(() => [
-                d(t(le), {
-                  modelValue: l.value,
-                  "onUpdate:modelValue": i[0] || (i[0] = (e) => l.value = e),
-                  label: "OTP",
-                  "persistent-placeholder": "",
-                  autofocus: "",
-                  length: u.length
-                }, null, 8, ["modelValue", "length"]),
-                b("div", he, [
-                  d(t(x), {
-                    disabled: !c.value,
-                    type: "submit",
-                    color: "primary",
-                    variant: "flat",
-                    text: u.submitButtonText,
-                    loading: u.loading
-                  }, null, 8, ["disabled", "text", "loading"])
-                ])
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        }, 8, ["model-value"])
-      ]),
-      _: 1
-    }, 8, ["title", "subtitle", "min-width", "max-width"]));
-  }
-});
-export {
-  xe as AppBase,
-  ke as DashboardPage,
-  _e as FooterSection,
-  $e as LoginForm,
-  Be as NavDrawerLink,
-  Ce as OTPForm,
-  ne as useColorMode,
-  re as useFooter,
-  ae as useNotify
-};

package/dist/index.umd.cjs

@@ -1 +0,0 @@
-(function(s,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("vue-router"),require("vuetify/components"),require("pinia")):typeof define=="function"&&define.amd?define(["exports","vue","vue-router","vuetify/components","pinia"],e):(s=typeof globalThis<"u"?globalThis:s||self,e(s.appsalutely={},s.Vue,s.VueRouter,s.VuetifyComponents,s.Pinia))})(this,function(s,e,y,i,w){"use strict";const k=w.defineStore("colorMode",()=>{const o=e.ref(localStorage.getItem("colorMode")=="dark"?"dark":"light");function l(){o.value=o.value==="dark"?"light":"dark"}function r(n){localStorage.setItem("colorMode",n),document.documentElement.setAttribute("data-theme",n)}return e.watch(o,n=>r(n)),r(o.value),{mode:o,toggle:l}}),b=w.defineStore("footer",()=>{const o=e.ref([]),l=e.computed(()=>o.value.length>0?o.value[o.value.length-1]:null);function r(a){return a.id||(a.id=new Date().getTime().toString()),a.timeout===void 0&&(a.timeout=5e3),o.value.push(a),a.timeout&&setTimeout(()=>{n(a.id)},a.timeout),a.id}function n(a){o.value=o.value.filter(f=>f.id!==a)}return{messages:o,current:l,addMessage:r,removeMessage:n}}),B=w.defineStore("notify",()=>{const o=e.ref([]),l=e.ref({});function r(t){return t.id?n(t.id):t.id=new Date().getTime().toString(),t.timeout===void 0&&(t.timeout=5e3),o.value.push(t),t.timeout&&(l.value[t.id]=setTimeout(()=>{n(t.id)},t.timeout)),t.id}function n(t){o.value=o.value.filter(h=>h.id!==t),l.value[t]&&(clearTimeout(l.value[t]),delete l.value[t])}function a(t){return r({text:t,type:"info"})}function f(t){return r({text:t,type:"success"})}function d(t){return r({text:t,type:"warning"})}function u(t){return r({text:t,type:"error"})}return{messages:o,add:r,remove:n,info:a,success:f,warning:d,error:u}}),g={class:"d-flex flex-column pa-4 h-100"},x=["textContent"],C=e.defineComponent({__name:"AppBase",props:{drawerOpen:{type:Boolean,default:!1},drawerOpenModifiers:{}},emits:["update:drawerOpen"],setup(o){const l=k(),r=e.useModel(o,"drawerOpen"),n=e.ref(!1),a=b(),f=e.ref(!1),d=e.ref(null),u=B(),t=y.useRouter(),h=e.useSlots();return e.watch(n,p=>{localStorage.setItem("drawerDocked",String(p))}),e.onBeforeMount(()=>{t.beforeEach(()=>{d.value=setTimeout(()=>{f.value=!0},300)}),t.afterEach(()=>{d.value&&(clearTimeout(d.value),d.value=null),f.value=!1}),n.value=localStorage.getItem("drawerDocked")==="true",r.value=n.value}),(p,m)=>(e.openBlock(),e.createBlock(e.unref(i.VApp),{theme:e.unref(l).mode},{default:e.withCtx(()=>[f.value?(e.openBlock(),e.createBlock(e.unref(i.VProgressLinear),{key:0,indeterminate:"",class:"mb-n1",style:{"z-index":"100000",opacity:"0.5"},height:"1"})):e.createCommentVNode("",!0),e.createVNode(e.unref(i.VAppBar),{height:"64"},{default:e.withCtx(()=>[e.renderSlot(p.$slots,"header")]),_:3}),e.createVNode(e.unref(i.VMain),{class:"bg-surface-light"},{default:e.withCtx(()=>[e.createElementVNode("div",g,[e.createVNode(e.unref(y.RouterView))])]),_:1}),e.unref(h).footer?(e.openBlock(),e.createBlock(e.unref(i.VAppBar),{key:1,height:"40",location:"bottom"},{default:e.withCtx(()=>[e.createVNode(e.unref(i.VFooter),{class:"py-0 w-100 d-flex align-center"},{default:e.withCtx(()=>[e.unref(a).current?(e.openBlock(),e.createElementBlock("span",{key:0,textContent:e.toDisplayString(e.unref(a).current.text),class:e.normalizeClass([e.unref(a).current.type?{}:{["text-"+e.unref(a).current.type]:!0},"overflow-hidden text-no-wrap"]),style:{"text-overflow":"ellipsis"}},null,10,x)):e.createCommentVNode("",!0),e.unref(a).current&&e.unref(a).current.actions?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:1},e.renderList(Object.entries(e.unref(a).current.actions),(c,V)=>(e.openBlock(),e.createBlock(e.unref(i.VBtn),{text:c[0],onClick:c[1],key:V,density:"comfortable",variant:"tonal",class:"mx-2 px-2 text-none",color:e.unref(a).current.type},null,8,["text","onClick","color"]))),128)):e.createCommentVNode("",!0),m[2]||(m[2]=e.createElementVNode("div",{class:"me-auto"},null,-1)),e.renderSlot(p.$slots,"footer")]),_:3,__:[2]})]),_:3})):e.createCommentVNode("",!0),e.unref(h).drawer?(e.openBlock(),e.createBlock(e.unref(i.VNavigationDrawer),{key:2,modelValue:r.value,"onUpdate:modelValue":m[1]||(m[1]=c=>r.value=c),width:"250","rail-width":"58",rail:n.value,mobile:n.value?!1:void 0},{default:e.withCtx(()=>[e.createVNode(e.unref(i.VList),{class:"h-100 d-flex flex-column"},{default:e.withCtx(()=>[e.renderSlot(p.$slots,"drawer"),e.createVNode(e.unref(i.VBtn),{onClick:m[0]||(m[0]=c=>n.value=!n.value),icon:"mdi-pin-outline",rounded:"rounded",density:"comfortable",title:n.value?"Undock sidebar":"Dock sidebar",class:"my-1 mx-3 ms-auto",variant:n.value?"tonal":"text"},null,8,["title","variant"])]),_:3})]),_:3},8,["modelValue","rail","mobile"])):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(u).messages,(c,V)=>(e.openBlock(),e.createBlock(e.unref(i.VSnackbar),{key:V,"model-value":!0,text:c.text,color:c.type,location:"bottom end",style:e.normalizeStyle({bottom:`${V*56}px`}),timeout:-1},{actions:e.withCtx(()=>[e.createVNode(e.unref(i.VBtn),{icon:"mdi-close",onClick:W=>e.unref(u).remove(c.id)},null,8,["onClick"])]),_:2},1032,["text","color","style"]))),128))]),_:3},8,["theme"]))}}),N=["textContent"],S=e.defineComponent({__name:"DashboardPage",props:{breadcrumbs:{},fluid:{type:Boolean,default:!0},title:{}},setup(o){return(l,r)=>(e.openBlock(),e.createBlock(e.unref(i.VContainer),{fluid:l.fluid,class:"h-100 d-flex flex-column py-0 h-100"},{default:e.withCtx(()=>[l.breadcrumbs?(e.openBlock(),e.createBlock(e.unref(i.VBreadcrumbs),{key:0,items:l.breadcrumbs,density:"comfortable",class:"pa-0"},null,8,["items"])):e.createCommentVNode("",!0),l.title?(e.openBlock(),e.createElementBlock("h1",{key:1,textContent:e.toDisplayString(l.title),class:"text-h5 font-bold ma-1"},null,8,N)):e.createCommentVNode("",!0),e.renderSlot(l.$slots,"default")]),_:3},8,["fluid"]))}}),_=(o,l)=>{const r=o.__vccOpts||o;for(const[n,a]of l)r[n]=a;return r},M={},T={class:"h-100 d-flex align-center"};function $(o,l){return e.openBlock(),e.createElementBlock(e.Fragment,null,[l[0]||(l[0]=e.createElementVNode("span",{class:"border-s mx-3",style:{height:"32px"}},null,-1)),e.createElementVNode("span",T,[e.renderSlot(o.$slots,"default")])],64)}const F=_(M,[["render",$]]),E={class:"d-flex justify-center"},D=e.defineComponent({__name:"LoginForm",props:e.mergeModels({title:{default:"Login"},submitButtonText:{default:"Login"},minWidth:{},maxWidth:{},loading:{type:Boolean}},{username:{default:""},usernameModifiers:{},password:{default:""},passwordModifiers:{}}),emits:e.mergeModels(["submit"],["update:username","update:password"]),setup(o,{emit:l}){const r=e.useModel(o,"username"),n=e.useModel(o,"password"),a=l,f=e.ref(!1);return(d,u)=>(e.openBlock(),e.createBlock(e.unref(i.VCard),{title:d.title,"min-width":d.minWidth,"max-width":d.maxWidth},{default:e.withCtx(()=>[e.createVNode(e.unref(i.VForm),{onSubmit:u[2]||(u[2]=e.withModifiers(t=>a("submit",r.value,n.value),["prevent"])),modelValue:f.value,"onUpdate:modelValue":u[3]||(u[3]=t=>f.value=t)},{default:e.withCtx(()=>[e.createVNode(e.unref(i.VCardText),null,{default:e.withCtx(()=>[e.createVNode(e.unref(i.VTextField),{modelValue:r.value,"onUpdate:modelValue":u[0]||(u[0]=t=>r.value=t),label:"Username",rules:[t=>!!t||"Username is required"],"persistent-placeholder":"",autofocus:""},null,8,["modelValue","rules"]),e.createVNode(e.unref(i.VTextField),{modelValue:n.value,"onUpdate:modelValue":u[1]||(u[1]=t=>n.value=t),label:"Password",type:"password",rules:[t=>!!t||"Password is required"],"persistent-placeholder":""},null,8,["modelValue","rules"]),e.createElementVNode("div",E,[e.createVNode(e.unref(i.VBtn),{disabled:!f.value,type:"submit",color:"primary",variant:"flat",text:d.submitButtonText,loading:d.loading},null,8,["disabled","text","loading"])])]),_:1})]),_:1},8,["modelValue"])]),_:1},8,["title","min-width","max-width"]))}}),O={class:"text-no-wrap overflow-hidden"},L=e.defineComponent({__name:"NavDrawerLink",props:{to:{},icon:{},text:{}},setup(o){return(l,r)=>(e.openBlock(),e.createBlock(e.unref(i.VListItem),{role:"option",to:l.to,slim:""},{prepend:e.withCtx(()=>[e.createVNode(e.unref(i.VIcon),{icon:l.icon},null,8,["icon"])]),default:e.withCtx(()=>[e.createElementVNode("span",O,e.toDisplayString(l.text),1)]),_:1},8,["to"]))}}),P={class:"d-flex justify-center"},U=e.defineComponent({__name:"OTPForm",props:e.mergeModels({title:{default:"2FA Verification"},subtitle:{default:"Enter the code from your authenticator app"},submitButtonText:{default:"Verify"},minWidth:{},maxWidth:{},loading:{type:Boolean},length:{default:6},autosubmit:{type:Boolean,default:!0}},{otp:{default:""},otpModifiers:{}}),emits:e.mergeModels(["submit"],["update:otp"]),setup(o,{emit:l}){const r=e.useModel(o,"otp"),n=l,a=o,f=e.computed(()=>r.value.length===a.length);return e.watch(r,()=>{a.autosubmit&&r.value.length===a.length&&n("submit",r.value)}),(d,u)=>(e.openBlock(),e.createBlock(e.unref(i.VCard),{title:d.title,subtitle:d.subtitle,"min-width":d.minWidth,"max-width":d.maxWidth},{default:e.withCtx(()=>[e.createVNode(e.unref(i.VForm),{onSubmit:u[1]||(u[1]=e.withModifiers(t=>n("submit",r.value),["prevent"])),"model-value":f.value},{default:e.withCtx(()=>[e.createVNode(e.unref(i.VCardText),null,{default:e.withCtx(()=>[e.createVNode(e.unref(i.VOtpInput),{modelValue:r.value,"onUpdate:modelValue":u[0]||(u[0]=t=>r.value=t),label:"OTP","persistent-placeholder":"",autofocus:"",length:d.length},null,8,["modelValue","length"]),e.createElementVNode("div",P,[e.createVNode(e.unref(i.VBtn),{disabled:!f.value,type:"submit",color:"primary",variant:"flat",text:d.submitButtonText,loading:d.loading},null,8,["disabled","text","loading"])])]),_:1})]),_:1},8,["model-value"])]),_:1},8,["title","subtitle","min-width","max-width"]))}});s.AppBase=C,s.DashboardPage=S,s.FooterSection=F,s.LoginForm=D,s.NavDrawerLink=L,s.OTPForm=U,s.useColorMode=k,s.useFooter=b,s.useNotify=B,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});

package/eslint.config.ts

@@ -1,22 +0,0 @@
-import { globalIgnores } from 'eslint/config'
-import { defineConfigWithVueTs, vueTsConfigs } from '@vue/eslint-config-typescript'
-import pluginVue from 'eslint-plugin-vue'
-import skipFormatting from '@vue/eslint-config-prettier/skip-formatting'
-
-// To allow more languages other than `ts` in `.vue` files, uncomment the following lines:
-// import { configureVueProject } from '@vue/eslint-config-typescript'
-// configureVueProject({ scriptLangs: ['ts', 'tsx'] })
-// More info at https://github.com/vuejs/eslint-config-typescript/#advanced-setup
-
-export default defineConfigWithVueTs(
-  {
-    name: 'app/files-to-lint',
-    files: ['**/*.{ts,mts,tsx,vue}'],
-  },
-
-  globalIgnores(['**/dist/**', '**/dist-ssr/**', '**/coverage/**']),
-
-  pluginVue.configs['flat/essential'],
-  vueTsConfigs.recommended,
-  skipFormatting,
-)

package/tsconfig.json

@@ -1,23 +0,0 @@
-{
-  "extends": "@vue/tsconfig/tsconfig.dom.json",
-  "include": ["src/**/*.ts", "src/**/*.vue"],
-  "exclude": ["src/**/__tests__/*"],
-  "compilerOptions": {
-    "target": "ES2022",
-    "module": "ESNext",
-    "noEmit": false,
-    "emitDeclarationOnly": true,
-    "moduleResolution": "bundler",
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "outDir": "./dist",
-    "declaration": true,
-    "skipLibCheck": true,
-    "strict": true
-  },
-  "references": [
-    {
-      "path": "./tsconfig.node.json"
-    }
-  ]
-}

package/tsconfig.node.json

@@ -1,10 +0,0 @@
-{
-  "compilerOptions": {
-    "composite": true,
-    "skipLibCheck": true,
-    "module": "ESNext",
-    "moduleResolution": "bundler",
-    "allowSyntheticDefaultImports": true
-  },
-  "include": ["vite.config.ts"]
-}

package/vite.config.d.ts

@@ -1,3 +0,0 @@
-import { type UserConfig } from 'vite';
-declare const _default: UserConfig;
-export default _default;

package/vite.config.js

@@ -1,25 +0,0 @@
-import { defineConfig } from 'vite';
-import Vue from '@vitejs/plugin-vue';
-var config = {
-    build: {
-        lib: {
-            entry: 'src/index.ts',
-            name: 'appsalutely',
-            fileName: 'index',
-        },
-        rollupOptions: {
-            external: ['vue', 'vue-router', 'pinia', 'vuetify', 'vuetify/components'],
-            output: {
-                globals: {
-                    vue: 'Vue',
-                    'vue-router': 'VueRouter',
-                    pinia: 'Pinia',
-                    vuetify: 'Vuetify',
-                    'vuetify/components': 'VuetifyComponents',
-                },
-            },
-        },
-    },
-    plugins: [Vue()],
-};
-export default defineConfig(config);

package/vite.config.ts

@@ -1,26 +0,0 @@
-import { defineConfig, type UserConfig } from 'vite'
-import Vue from '@vitejs/plugin-vue'
-
-const config: UserConfig = {
-  build: {
-    lib: {
-      entry: 'src/index.ts',
-      name: 'appsalutely',
-      fileName: 'index',
-    },
-    rollupOptions: {
-      external: ['vue', 'vue-router', 'pinia', 'vuetify', 'vuetify/components'],
-      output: {
-        globals: {
-          vue: 'Vue',
-          'vue-router': 'VueRouter',
-          pinia: 'Pinia',
-          vuetify: 'Vuetify',
-          'vuetify/components': 'VuetifyComponents',
-        },
-      },
-    },
-  },
-  plugins: [Vue()],
-}
-export default defineConfig(config)