alytus-ff 0.1.18 → 0.1.20

package/dist/App.vue.d.ts

@@ -1,2 +1,117 @@
-declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: import('vue').DefineComponent<{}, {
+    showDialog: import('vue').Ref<boolean, boolean>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {
+    UserAvatar: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+        user: {
+            type: import('vue').PropType<import('.').IUser>;
+            required: true;
+        };
+        size: {
+            type: NumberConstructor;
+            required: true;
+        };
+        baseUrl: {
+            type: StringConstructor;
+            required: true;
+        };
+    }>, {
+        fullName: import('vue').ComputedRef<string>;
+    }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+        user: {
+            type: import('vue').PropType<import('.').IUser>;
+            required: true;
+        };
+        size: {
+            type: NumberConstructor;
+            required: true;
+        };
+        baseUrl: {
+            type: StringConstructor;
+            required: true;
+        };
+    }>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    AccountAvatar: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+        item: {
+            type: import('vue').PropType<import('.').IAccount>;
+            required: true;
+        };
+        size: {
+            type: NumberConstructor;
+            default: number;
+        };
+    }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+        item: {
+            type: import('vue').PropType<import('.').IAccount>;
+            required: true;
+        };
+        size: {
+            type: NumberConstructor;
+            default: number;
+        };
+    }>> & Readonly<{}>, {
+        size: number;
+    }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    PageTitle: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+        title: {
+            type: StringConstructor;
+            required: true;
+        };
+        description: {
+            type: StringConstructor;
+            default: null;
+        };
+    }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+        title: {
+            type: StringConstructor;
+            required: true;
+        };
+        description: {
+            type: StringConstructor;
+            default: null;
+        };
+    }>> & Readonly<{}>, {
+        description: string;
+    }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    CustomDialog: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+        value: {
+            type: BooleanConstructor;
+            required: true;
+        };
+        title: {
+            type: StringConstructor;
+            default: null;
+        };
+        persistent: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        noFooter: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>, {}, {}, {}, {
+        mdiClose(): string;
+    }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+        value: {
+            type: BooleanConstructor;
+            required: true;
+        };
+        title: {
+            type: StringConstructor;
+            default: null;
+        };
+        persistent: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        noFooter: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>> & Readonly<{}>, {
+        title: string;
+        persistent: boolean;
+        noFooter: boolean;
+    }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 export default _default;

package/dist/alytus-ff.js

@@ -1,5 +1,5 @@
-import { defineComponent as p, openBlock as c, createElementBlock as l, createElementVNode as s, toDisplayString as d, createCommentVNode as u, renderSlot as m } from "vue";
-const f = p({
+import { defineComponent as m, openBlock as a, createElementBlock as $, createElementVNode as v, toDisplayString as d, createCommentVNode as y, renderSlot as c, resolveComponent as r, createBlock as p, withCtx as l, createVNode as _, normalizeClass as b, createTextVNode as N, computed as S } from "vue";
+const U = m({
   name: "PageTitle",
   props: {
     title: {
@@ -11,27 +11,27 @@ const f = p({
       default: null
     }
   }
-}), a = (e, t) => {
+}), f = (e, t) => {
   const o = e.__vccOpts || e;
-  for (const [r, n] of t)
-    o[r] = n;
+  for (const [s, n] of t)
+    o[s] = n;
   return o;
-}, _ = { class: "mt-6 mb-3 ff-page-title" }, g = { class: "text-h5 ff-title" }, $ = {
+}, q = { class: "mt-6 mb-3 ff-page-title" }, A = { class: "text-h5 ff-title" }, w = {
   key: 0,
   class: "text-body-2 ff-description"
 };
-function b(e, t, o, r, n, i) {
-  return c(), l("div", _, [
-    s("div", null, [
-      s("span", g, d(e.title), 1),
-      e.description ? (c(), l("div", $, d(e.description), 1)) : u("", !0)
+function B(e, t, o, s, n, i) {
+  return a(), $("div", q, [
+    v("div", null, [
+      v("span", A, d(e.title), 1),
+      e.description ? (a(), $("div", w, d(e.description), 1)) : y("", !0)
     ]),
-    s("div", null, [
-      m(e.$slots, "buttons")
+    v("div", null, [
+      c(e.$slots, "buttons")
     ])
   ]);
 }
-const v = /* @__PURE__ */ a(f, [["render", b]]), h = p({
+const K = /* @__PURE__ */ f(U, [["render", B]]), T = m({
   name: "PageSubtitle",
   props: {
     subtitle: {
@@ -39,21 +39,160 @@ const v = /* @__PURE__ */ a(f, [["render", b]]), h = p({
       required: !0
     }
   }
-}), k = { class: "text-h6 font-weight-bold mt-7 mb-4" };
-function C(e, t, o, r, n, i) {
-  return c(), l("div", k, d(e.subtitle), 1);
+}), D = { class: "text-h6 font-weight-bold mt-7 mb-4" };
+function V(e, t, o, s, n, i) {
+  return a(), $("div", D, d(e.subtitle), 1);
 }
-const y = /* @__PURE__ */ a(h, [["render", C]]), x = (e) => e ? e.replace(/(?:\r\n|\r|\n)/g, "<br>") : "", T = (e) => {
+const Q = /* @__PURE__ */ f(T, [["render", V]]);
+var P = "M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z";
+const R = m({
+  name: "CustomDialog",
+  methods: {
+    mdiClose() {
+      return P;
+    }
+  },
+  props: {
+    value: {
+      type: Boolean,
+      required: !0
+    },
+    title: {
+      type: String,
+      default: null
+    },
+    persistent: {
+      type: Boolean,
+      default: !1
+    },
+    noFooter: {
+      type: Boolean,
+      default: !1
+    }
+  }
+}), E = { class: "close-btn" };
+function F(e, t, o, s, n, i) {
+  const u = r("v-btn"), g = r("v-card-text"), h = r("v-spacer"), C = r("v-card-actions"), k = r("v-card"), L = r("v-dialog");
+  return a(), p(L, {
+    "model-value": e.value,
+    "max-width": "960",
+    persistent: e.persistent,
+    fullscreen: e.$vuetify.display.smAndDown,
+    class: "ff-dialog",
+    "onUpdate:modelValue": t[1] || (t[1] = (z) => e.$emit("close"))
+  }, {
+    default: l(() => [
+      c(e.$slots, "card", {}, () => [
+        _(k, { title: e.title }, {
+          append: l(() => [
+            v("div", E, [
+              _(u, {
+                variant: "text",
+                icon: e.mdiClose(),
+                onClick: t[0] || (t[0] = (z) => e.$emit("close"))
+              }, null, 8, ["icon"])
+            ])
+          ]),
+          default: l(() => [
+            _(g, null, {
+              default: l(() => [
+                c(e.$slots, "default")
+              ]),
+              _: 3
+            }),
+            e.noFooter ? y("", !0) : (a(), p(C, { key: 0 }, {
+              default: l(() => [
+                c(e.$slots, "left-footer"),
+                _(h),
+                c(e.$slots, "footer")
+              ]),
+              _: 3
+            }))
+          ]),
+          _: 3
+        }, 8, ["title"])
+      ])
+    ]),
+    _: 3
+  }, 8, ["model-value", "persistent", "fullscreen"]);
+}
+const W = /* @__PURE__ */ f(R, [["render", F]]), I = m({
+  name: "AccountAvatar",
+  props: {
+    item: {
+      type: Object,
+      required: !0
+    },
+    size: {
+      type: Number,
+      default: 32
+    }
+  }
+});
+function O(e, t, o, s, n, i) {
+  const u = r("v-avatar");
+  return a(), p(u, {
+    class: b(`ff-avatar avatar-${e.size}-${e.item.initials.length >= 3 ? "l" : "s"}`),
+    size: e.size
+  }, {
+    default: l(() => [
+      N(d(e.item.initials), 1)
+    ]),
+    _: 1
+  }, 8, ["class", "size"]);
+}
+const X = /* @__PURE__ */ f(I, [["render", O]]), M = (e) => e.surname ? `${e.name} ${e.surname}` : e.name, Z = m({
+  name: "UserAvatar",
+  props: {
+    user: {
+      type: Object,
+      required: !0
+    },
+    size: {
+      type: Number,
+      required: !0
+    },
+    baseUrl: {
+      type: String,
+      required: !0
+    }
+  },
+  setup(e) {
+    return { fullName: S(() => M(e.user)) };
+  }
+}), G = { key: 1 };
+function H(e, t, o, s, n, i) {
+  const u = r("v-img"), g = r("v-avatar");
+  return a(), p(g, {
+    color: e.user.avatar_thumb ? "light_grey_bg" : e.user.color ?? "primary",
+    class: b(`avatar-${e.size}-${e.user.initials.length >= 3 ? "l" : "s"}`),
+    size: e.size
+  }, {
+    default: l(() => [
+      e.user.avatar_thumb ? (a(), p(u, {
+        key: 0,
+        alt: e.fullName,
+        src: `${e.baseUrl}/${e.user.avatar_thumb}`
+      }, null, 8, ["alt", "src"])) : (a(), $("span", G, d(e.user.initials), 1))
+    ]),
+    _: 1
+  }, 8, ["color", "class", "size"]);
+}
+const Y = /* @__PURE__ */ f(Z, [["render", H]]), j = (e) => e ? e.replace(/(?:\r\n|\r|\n)/g, "<br>") : "", x = (e) => {
   let t = document.cookie.match(new RegExp("(^|;\\s*)(" + e + ")=([^;]*)"));
   return t ? decodeURIComponent(t[3]) : null;
-}, P = (e, t, o, r) => {
+}, ee = (e, t, o, s) => {
   let n, i;
-  return r == null && (r = "/"), i = "", o && (n = /* @__PURE__ */ new Date(), n.setTime(n.getTime() + o * 24 * 60 * 60 * 1e3), i = "; expires=" + n.toUTCString()), document.cookie = encodeURIComponent(e) + "=" + encodeURIComponent(t) + i + "; path=" + r, !0;
+  return s == null && (s = "/"), i = "", o && (n = /* @__PURE__ */ new Date(), n.setTime(n.getTime() + o * 24 * 60 * 60 * 1e3), i = "; expires=" + n.toUTCString()), document.cookie = encodeURIComponent(e) + "=" + encodeURIComponent(t) + i + "; path=" + s, !0;
 };
 export {
-  y as PageSubtitle,
-  v as PageTitle,
-  T as getCookie,
-  x as nl2br,
-  P as setCookie
+  X as AccountAvatar,
+  W as CustomDialog,
+  Q as PageSubtitle,
+  K as PageTitle,
+  Y as UserAvatar,
+  M as formatFullName,
+  x as getCookie,
+  j as nl2br,
+  ee as setCookie
 };

package/dist/alytus-ff.umd.cjs

@@ -1 +1 @@
-(function(n,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(n=typeof globalThis<"u"?globalThis:n||self,e(n["Alytus FF"]={},n.Vue))})(this,function(n,e){"use strict";const d=e.defineComponent({name:"PageTitle",props:{title:{type:String,required:!0},description:{type:String,default:null}}}),l=(t,o)=>{const r=t.__vccOpts||t;for(const[s,i]of o)r[s]=i;return r},p={class:"mt-6 mb-3 ff-page-title"},a={class:"text-h5 ff-title"},f={key:0,class:"text-body-2 ff-description"};function m(t,o,r,s,i,c){return e.openBlock(),e.createElementBlock("div",p,[e.createElementVNode("div",null,[e.createElementVNode("span",a,e.toDisplayString(t.title),1),t.description?(e.openBlock(),e.createElementBlock("div",f,e.toDisplayString(t.description),1)):e.createCommentVNode("",!0)]),e.createElementVNode("div",null,[e.renderSlot(t.$slots,"buttons")])])}const u=l(d,[["render",m]]),g=e.defineComponent({name:"PageSubtitle",props:{subtitle:{type:String,required:!0}}}),_={class:"text-h6 font-weight-bold mt-7 mb-4"};function b(t,o,r,s,i,c){return e.openBlock(),e.createElementBlock("div",_,e.toDisplayString(t.subtitle),1)}const k=l(g,[["render",b]]),h=t=>t?t.replace(/(?:\r\n|\r|\n)/g,"<br>"):"",y=t=>{let o=document.cookie.match(new RegExp("(^|;\\s*)("+t+")=([^;]*)"));return o?decodeURIComponent(o[3]):null},S=(t,o,r,s)=>{let i,c;return s==null&&(s="/"),c="",r&&(i=new Date,i.setTime(i.getTime()+r*24*60*60*1e3),c="; expires="+i.toUTCString()),document.cookie=encodeURIComponent(t)+"="+encodeURIComponent(o)+c+"; path="+s,!0};n.PageSubtitle=k,n.PageTitle=u,n.getCookie=y,n.nl2br=h,n.setCookie=S,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})});
+(function(n,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(n=typeof globalThis<"u"?globalThis:n||self,e(n["Alytus FF"]={},n.Vue))})(this,function(n,e){"use strict";const m=e.defineComponent({name:"PageTitle",props:{title:{type:String,required:!0},description:{type:String,default:null}}}),i=(t,o)=>{const s=t.__vccOpts||t;for(const[a,r]of o)s[a]=r;return s},f={class:"mt-6 mb-3 ff-page-title"},u={class:"text-h5 ff-title"},_={key:0,class:"text-body-2 ff-description"};function $(t,o,s,a,r,l){return e.openBlock(),e.createElementBlock("div",f,[e.createElementVNode("div",null,[e.createElementVNode("span",u,e.toDisplayString(t.title),1),t.description?(e.openBlock(),e.createElementBlock("div",_,e.toDisplayString(t.description),1)):e.createCommentVNode("",!0)]),e.createElementVNode("div",null,[e.renderSlot(t.$slots,"buttons")])])}const C=i(m,[["render",$]]),g=e.defineComponent({name:"PageSubtitle",props:{subtitle:{type:String,required:!0}}}),y={class:"text-h6 font-weight-bold mt-7 mb-4"};function k(t,o,s,a,r,l){return e.openBlock(),e.createElementBlock("div",y,e.toDisplayString(t.subtitle),1)}const h=i(g,[["render",k]]);var b="M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z";const B=e.defineComponent({name:"CustomDialog",methods:{mdiClose(){return b}},props:{value:{type:Boolean,required:!0},title:{type:String,default:null},persistent:{type:Boolean,default:!1},noFooter:{type:Boolean,default:!1}}}),S={class:"close-btn"};function N(t,o,s,a,r,l){const c=e.resolveComponent("v-btn"),d=e.resolveComponent("v-card-text"),F=e.resolveComponent("v-spacer"),O=e.resolveComponent("v-card-actions"),R=e.resolveComponent("v-card"),I=e.resolveComponent("v-dialog");return e.openBlock(),e.createBlock(I,{"model-value":t.value,"max-width":"960",persistent:t.persistent,fullscreen:t.$vuetify.display.smAndDown,class:"ff-dialog","onUpdate:modelValue":o[1]||(o[1]=M=>t.$emit("close"))},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"card",{},()=>[e.createVNode(R,{title:t.title},{append:e.withCtx(()=>[e.createElementVNode("div",S,[e.createVNode(c,{variant:"text",icon:t.mdiClose(),onClick:o[0]||(o[0]=M=>t.$emit("close"))},null,8,["icon"])])]),default:e.withCtx(()=>[e.createVNode(d,null,{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default")]),_:3}),t.noFooter?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(O,{key:0},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"left-footer"),e.createVNode(F),e.renderSlot(t.$slots,"footer")]),_:3}))]),_:3},8,["title"])])]),_:3},8,["model-value","persistent","fullscreen"])}const V=i(B,[["render",N]]),w=e.defineComponent({name:"AccountAvatar",props:{item:{type:Object,required:!0},size:{type:Number,default:32}}});function z(t,o,s,a,r,l){const c=e.resolveComponent("v-avatar");return e.openBlock(),e.createBlock(c,{class:e.normalizeClass(`ff-avatar avatar-${t.size}-${t.item.initials.length>=3?"l":"s"}`),size:t.size},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.item.initials),1)]),_:1},8,["class","size"])}const L=i(w,[["render",z]]),p=t=>t.surname?`${t.name} ${t.surname}`:t.name,A=e.defineComponent({name:"UserAvatar",props:{user:{type:Object,required:!0},size:{type:Number,required:!0},baseUrl:{type:String,required:!0}},setup(t){return{fullName:e.computed(()=>p(t.user))}}}),D={key:1};function T(t,o,s,a,r,l){const c=e.resolveComponent("v-img"),d=e.resolveComponent("v-avatar");return e.openBlock(),e.createBlock(d,{color:t.user.avatar_thumb?"light_grey_bg":t.user.color??"primary",class:e.normalizeClass(`avatar-${t.size}-${t.user.initials.length>=3?"l":"s"}`),size:t.size},{default:e.withCtx(()=>[t.user.avatar_thumb?(e.openBlock(),e.createBlock(c,{key:0,alt:t.fullName,src:`${t.baseUrl}/${t.user.avatar_thumb}`},null,8,["alt","src"])):(e.openBlock(),e.createElementBlock("span",D,e.toDisplayString(t.user.initials),1))]),_:1},8,["color","class","size"])}const U=i(A,[["render",T]]),E=t=>t?t.replace(/(?:\r\n|\r|\n)/g,"<br>"):"",q=t=>{let o=document.cookie.match(new RegExp("(^|;\\s*)("+t+")=([^;]*)"));return o?decodeURIComponent(o[3]):null},P=(t,o,s,a)=>{let r,l;return a==null&&(a="/"),l="",s&&(r=new Date,r.setTime(r.getTime()+s*24*60*60*1e3),l="; expires="+r.toUTCString()),document.cookie=encodeURIComponent(t)+"="+encodeURIComponent(o)+l+"; path="+a,!0};n.AccountAvatar=L,n.CustomDialog=V,n.PageSubtitle=h,n.PageTitle=C,n.UserAvatar=U,n.formatFullName=p,n.getCookie=q,n.nl2br=E,n.setCookie=P,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})});

package/dist/components/Avatar/AccountAvatar.vue.d.ts

@@ -0,0 +1,24 @@
+import { PropType } from 'vue';
+import { IAccount } from '../../types/Account.ts';
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    item: {
+        type: PropType<IAccount>;
+        required: true;
+    };
+    size: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    item: {
+        type: PropType<IAccount>;
+        required: true;
+    };
+    size: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>> & Readonly<{}>, {
+    size: number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/components/Avatar/UserAvatar.vue.d.ts

@@ -0,0 +1,32 @@
+import { PropType } from 'vue';
+import { IUser } from '../../types/User.ts';
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    user: {
+        type: PropType<IUser>;
+        required: true;
+    };
+    size: {
+        type: NumberConstructor;
+        required: true;
+    };
+    baseUrl: {
+        type: StringConstructor;
+        required: true;
+    };
+}>, {
+    fullName: import('vue').ComputedRef<string>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    user: {
+        type: PropType<IUser>;
+        required: true;
+    };
+    size: {
+        type: NumberConstructor;
+        required: true;
+    };
+    baseUrl: {
+        type: StringConstructor;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/components/Dialog/CustomDialog.vue.d.ts

@@ -0,0 +1,42 @@
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    value: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    title: {
+        type: StringConstructor;
+        default: null;
+    };
+    persistent: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    noFooter: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {}, {}, {}, {
+    mdiClose(): string;
+}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    value: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    title: {
+        type: StringConstructor;
+        default: null;
+    };
+    persistent: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    noFooter: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{}>, {
+    title: string;
+    persistent: boolean;
+    noFooter: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/index.d.ts

@@ -1,6 +1,12 @@
 import { default as PageTitle } from './components/Page/PageTitle.vue';
 import { default as PageSubtitle } from './components/Page/PageSubtitle.vue';
+import { default as CustomDialog } from './components/Dialog/CustomDialog.vue';
+import { default as AccountAvatar } from './components/Avatar/AccountAvatar.vue';
+import { default as UserAvatar } from './components/Avatar/UserAvatar.vue';
 import { nl2br } from './utils/HtmlUtil.ts';
 import { getCookie, setCookie } from './utils/CookieUtil.ts';
+import { formatFullName } from './utils/StringUtil.ts';
 import { NameValuePair } from './types/Base.ts';
-export { PageTitle, PageSubtitle, nl2br, getCookie, setCookie, NameValuePair };
+import { IAccount } from './types/Account.ts';
+import { IUser } from './types/User.ts';
+export { PageTitle, PageSubtitle, CustomDialog, AccountAvatar, UserAvatar, nl2br, getCookie, setCookie, formatFullName, NameValuePair, IAccount, IUser };

package/dist/modules/vuetify.d.ts

@@ -0,0 +1,82 @@
+declare const vuetify: {
+    install: (app: import('vue').App) => void;
+    defaults: import('vue').Ref<import('vuetify').DefaultsInstance>;
+    display: import('vuetify').DisplayInstance;
+    theme: import('vuetify').ThemeInstance & {
+        install: (app: import('vue').App) => void;
+    };
+    icons: {
+        defaultSet: string;
+        aliases: Partial<import('vuetify').IconAliases>;
+        sets: Record<string, import('vuetify').IconSet>;
+    };
+    locale: {
+        isRtl: import('vue').Ref<boolean>;
+        rtl: import('vue').Ref<Record<string, boolean>>;
+        rtlClasses: import('vue').Ref<string>;
+        name: string;
+        messages: import('vue').Ref<import('vuetify').LocaleMessages>;
+        current: import('vue').Ref<string>;
+        fallback: import('vue').Ref<string>;
+        t: (key: string, ...params: unknown[]) => string;
+        n: (value: number) => string;
+        provide: (props: import('vuetify').LocaleOptions) => import('vuetify').LocaleInstance;
+    };
+    date: {
+        options: {
+            adapter: (new (options: {
+                locale: any;
+                formats?: any;
+            }) => import('vuetify').DateInstance) | import('vuetify').DateInstance;
+            formats?: Record<string, any>;
+            locale: Record<string, any>;
+        };
+        instance: {
+            locale?: any;
+            date: (value?: any) => unknown;
+            format: (date: unknown, formatString: string) => string;
+            toJsDate: (value: unknown) => Date;
+            parseISO: (date: string) => unknown;
+            toISO: (date: unknown) => string;
+            startOfDay: (date: unknown) => unknown;
+            endOfDay: (date: unknown) => unknown;
+            startOfWeek: (date: unknown, firstDayOfWeek?: number | string) => unknown;
+            endOfWeek: (date: unknown) => unknown;
+            startOfMonth: (date: unknown) => unknown;
+            endOfMonth: (date: unknown) => unknown;
+            startOfYear: (date: unknown) => unknown;
+            endOfYear: (date: unknown) => unknown;
+            isAfter: (date: unknown, comparing: unknown) => boolean;
+            isAfterDay: (value: unknown, comparing: unknown) => boolean;
+            isSameDay: (date: unknown, comparing: unknown) => boolean;
+            isSameMonth: (date: unknown, comparing: unknown) => boolean;
+            isSameYear: (value: unknown, comparing: unknown) => boolean;
+            isBefore: (date: unknown, comparing: unknown) => boolean;
+            isEqual: (date: unknown, comparing: unknown) => boolean;
+            isValid: (date: any) => boolean;
+            isWithinRange: (date: unknown, range: [unknown, unknown]) => boolean;
+            addMinutes: (date: unknown, amount: number) => unknown;
+            addHours: (date: unknown, amount: number) => unknown;
+            addDays: (date: unknown, amount: number) => unknown;
+            addWeeks: (date: unknown, amount: number) => unknown;
+            addMonths: (date: unknown, amount: number) => unknown;
+            getYear: (date: unknown) => number;
+            setYear: (date: unknown, year: number) => unknown;
+            getDiff: (date: unknown, comparing: unknown, unit?: string) => number;
+            getWeekArray: (date: unknown, firstDayOfWeek?: number | string) => unknown[][];
+            getWeekdays: (firstDayOfWeek?: number | string) => string[];
+            getMonth: (date: unknown) => number;
+            setMonth: (date: unknown, month: number) => unknown;
+            getDate: (date: unknown) => number;
+            setDate: (date: unknown, day: number) => unknown;
+            getNextMonth: (date: unknown) => unknown;
+            getPreviousMonth: (date: unknown) => unknown;
+            getHours: (date: unknown) => number;
+            setHours: (date: unknown, hours: number) => unknown;
+            getMinutes: (date: unknown) => number;
+            setMinutes: (date: unknown, minutes: number) => unknown;
+        };
+    };
+    goTo: import('vuetify').GoToInstance;
+};
+export default vuetify;

package/dist/style.css

@@ -1 +1 @@
-.ff-page-title,.ff-page-subtitle{display:flex;justify-content:space-between;align-items:center}.ff-page-title .v-btn,.ff-page-subtitle .v-btn{text-transform:unset;letter-spacing:.045em}#app{max-width:1280px;margin:0 auto;padding:2rem}
+.ff-page-title,.ff-page-subtitle{display:flex;justify-content:space-between;align-items:center}.ff-page-title .v-btn,.ff-page-subtitle .v-btn{text-transform:unset;letter-spacing:.045em}.ff-dialog.v-dialog .close-btn{margin-right:-4px}@media screen and (min-width: 600px){.ff-dialog.v-dialog .close-btn{margin-right:-12px}}.ff-dialog.v-dialog>.v-overlay__content>.v-card>.v-card-item{padding-left:16px;padding-right:16px}@media screen and (min-width: 600px){.ff-dialog.v-dialog>.v-overlay__content>.v-card>.v-card-item{padding-left:24px;padding-right:24px}}@media screen and (min-width: 960px){.ff-dialog.v-dialog>.v-overlay__content>.v-card>.v-card-item{padding-left:36px;padding-right:36px}}.ff-dialog.v-dialog>.v-overlay__content>.v-card>.v-card-text{padding-left:16px;padding-right:16px}@media screen and (min-width: 600px){.ff-dialog.v-dialog>.v-overlay__content>.v-card>.v-card-text{padding-left:24px;padding-right:24px}}@media screen and (min-width: 960px){.ff-dialog.v-dialog>.v-overlay__content>.v-card>.v-card-text{padding-left:36px;padding-right:36px}}.ff-dialog.v-dialog>.v-overlay__content>.v-card>.v-card-actions{padding:12px 16px 16px}@media screen and (min-width: 600px){.ff-dialog.v-dialog>.v-overlay__content>.v-card>.v-card-actions{padding-left:24px;padding-right:24px}}@media screen and (min-width: 960px){.ff-dialog.v-dialog>.v-overlay__content>.v-card>.v-card-actions{padding-left:36px;padding-right:36px}}.ff-avatar{background:linear-gradient(180deg,#3c3c3c,#4f4f4f 25%,#787878)!important;color:#fff!important}.avatar-96-s{font-size:32px!important;font-weight:500!important}.avatar-96-l{font-size:26px!important;font-weight:500!important}.avatar-32-s{font-size:14px!important;font-weight:500!important;line-height:normal!important;letter-spacing:1px}.avatar-32-l{font-size:11px!important;font-weight:500!important;line-height:normal!important;letter-spacing:1px}

package/dist/types/Account.d.ts

@@ -0,0 +1,5 @@
+export interface IAccount {
+    name: string;
+    surname: string | null;
+    initials: string;
+}

package/dist/types/User.d.ts

@@ -0,0 +1,7 @@
+export interface IUser {
+    name: string;
+    surname: string | null;
+    initials: string;
+    color: string;
+    avatar_thumb: string | null;
+}

package/dist/utils/StringUtil.d.ts

@@ -0,0 +1,4 @@
+export declare const formatFullName: (obj: {
+    name: string;
+    surname: string | null;
+}) => string;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "alytus-ff",
   "private": false,
-  "version": "0.1.18",
+  "version": "0.1.20",
   "type": "module",
   "files": [
     "dist",
@@ -30,9 +30,12 @@
     "vue": "^3.3.11"
   },
   "peerDependencies": {
-    "vue": "^3.0.0"
+    "vue": "^3.0.0",
+    "vuetify": "^3.0.0",
+    "@mdi/js": "^7.4.47"
   },
   "devDependencies": {
+    "@mdi/js": "^7.4.47",
     "@types/node": "^22.5.5",
     "@vitejs/plugin-vue": "^5.1.2",
     "path": "^0.12.7",
@@ -40,6 +43,7 @@
     "vite": "^5.4.1",
     "vite-plugin-dts": "^4.2.1",
     "vue-tsc": "^2.0.29",
-    "vue": "^3.3.11"
+    "vue": "^3.3.11",
+    "vuetify": "^3.6.14"
   }
 }

package/src/components/Avatar/AccountAvatar.vue

@@ -0,0 +1,22 @@
+<template>
+    <v-avatar :class="`ff-avatar avatar-${size}-${item.initials.length >= 3 ? 'l' : 's'}`" :size="size">{{ item.initials }}</v-avatar>
+</template>
+
+<script lang="ts">
+import {defineComponent, type PropType} from "vue"
+import {IAccount} from "../../types/Account.ts"
+
+export default defineComponent({
+    name: "AccountAvatar",
+    props: {
+        item: {
+            type: Object as PropType<IAccount>,
+            required: true
+        },
+        size: {
+            type: Number,
+            default: 32
+        }
+    }
+})
+</script>

package/src/components/Avatar/UserAvatar.vue

@@ -0,0 +1,38 @@
+<template>
+    <v-avatar
+        :color="user.avatar_thumb ? 'light_grey_bg' : (user.color ?? 'primary')"
+        :class="`avatar-${size}-${user.initials.length >= 3 ? 'l' : 's'}`"
+        :size="size"
+    >
+        <v-img v-if="user.avatar_thumb" :alt="fullName" :src="`${baseUrl}/${user.avatar_thumb}`" />
+        <span v-else>{{user.initials}}</span>
+    </v-avatar>
+</template>
+
+<script lang="ts">
+import {computed, defineComponent, type PropType} from "vue"
+import {IUser} from "../../types/User.ts"
+import {formatFullName} from "../../utils/StringUtil.ts";
+
+export default defineComponent({
+    name: "UserAvatar",
+    props: {
+        user: {
+            type: Object as PropType<IUser>,
+            required: true
+        },
+        size: {
+            type: Number,
+            required: true
+        },
+        baseUrl: {
+            type: String,
+            required: true
+        }
+    },
+    setup(props) {
+        const fullName = computed(() => formatFullName(props.user))
+        return {fullName}
+    }
+})
+</script>

package/src/components/Dialog/CustomDialog.vue

@@ -0,0 +1,53 @@
+<template>
+    <v-dialog :model-value="value" max-width="960" :persistent="persistent" :fullscreen="$vuetify.display.smAndDown" class="ff-dialog" @update:modelValue="$emit('close')">
+        <slot name="card">
+            <v-card :title="title">
+                <template v-slot:append>
+                    <div class="close-btn">
+                        <v-btn variant="text" :icon="mdiClose()" @click="$emit('close')" />
+                    </div>
+                </template>
+                <v-card-text>
+                    <slot></slot>
+                </v-card-text>
+                <v-card-actions v-if="!noFooter">
+                    <slot name="left-footer"></slot>
+                    <v-spacer></v-spacer>
+                    <slot name="footer"></slot>
+                </v-card-actions>
+            </v-card>
+        </slot>
+    </v-dialog>
+</template>
+
+<script lang="ts">
+import {defineComponent} from "vue";
+import {mdiClose} from "@mdi/js";
+
+export default defineComponent({
+    name: "CustomDialog",
+    methods: {
+        mdiClose() {
+            return mdiClose
+        }
+    },
+    props: {
+        value: {
+            type: Boolean,
+            required: true
+        },
+        title: {
+            type: String,
+            default: null
+        },
+        persistent: {
+            type: Boolean,
+            default: false
+        },
+        noFooter: {
+            type: Boolean,
+            default: false
+        }
+    }
+})
+</script>