alytus-ff 0.1.25 → 0.1.26

package/dist/App.vue.d.ts

@@ -1,5 +1,56 @@
+import { IUser } from './types/User.ts';
+import { LanguageAndFlag } from './types/Lang.ts';
+import { IAccount } from './types/Account.ts';
 declare const _default: import('vue').DefineComponent<{}, {
     showDialog: import('vue').Ref<boolean, boolean>;
+    showDialog2: import('vue').Ref<boolean, boolean>;
+    baseUrl: import('vue').Ref<string, string>;
+    currentUser: import('vue').Ref<{
+        name: string;
+        surname: string | null;
+        initials: string;
+        color: string;
+        avatar_thumb: string | null;
+        email: string;
+    }, IUser | {
+        name: string;
+        surname: string | null;
+        initials: string;
+        color: string;
+        avatar_thumb: string | null;
+        email: string;
+    }>;
+    currentAccount: import('vue').Ref<{
+        id: number;
+        name: string;
+        surname: string | null;
+        initials: string;
+    }, IAccount | {
+        id: number;
+        name: string;
+        surname: string | null;
+        initials: string;
+    }>;
+    accounts: import('vue').Ref<{
+        id: number;
+        name: string;
+        surname: string | null;
+        initials: string;
+    }[], IAccount[] | {
+        id: number;
+        name: string;
+        surname: string | null;
+        initials: string;
+    }[]>;
+    langs: import('vue').Ref<{
+        title: string;
+        value: string;
+        icon: string;
+    }[], LanguageAndFlag[] | {
+        title: string;
+        value: string;
+        icon: string;
+    }[]>;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {
     PageSubtitle: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
         subtitle: {
@@ -24,7 +75,7 @@ declare const _default: import('vue').DefineComponent<{}, {
     }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
     UserAvatar: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
         user: {
-            type: import('vue').PropType<import('.').IUser>;
+            type: import('vue').PropType<IUser>;
             required: true;
         };
         size: {
@@ -39,7 +90,7 @@ declare const _default: import('vue').DefineComponent<{}, {
         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>;
+            type: import('vue').PropType<IUser>;
             required: true;
         };
         size: {
@@ -53,7 +104,7 @@ declare const _default: import('vue').DefineComponent<{}, {
     }>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
     AccountAvatar: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
         item: {
-            type: import('vue').PropType<import('.').IAccount>;
+            type: import('vue').PropType<IAccount>;
             required: true;
         };
         size: {
@@ -62,7 +113,7 @@ declare const _default: import('vue').DefineComponent<{}, {
         };
     }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
         item: {
-            type: import('vue').PropType<import('.').IAccount>;
+            type: import('vue').PropType<IAccount>;
             required: true;
         };
         size: {
@@ -152,5 +203,143 @@ declare const _default: import('vue').DefineComponent<{}, {
         noFullScreen: boolean;
         fullHeight: boolean;
     }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    UserMenu: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+        currentUser: {
+            type: import('vue').PropType<IUser>;
+            required: true;
+        };
+        currentAccount: {
+            type: import('vue').PropType<IAccount>;
+            default: null;
+        };
+        currentLang: {
+            type: import('vue').PropType<LanguageAndFlag>;
+            required: true;
+        };
+        accounts: {
+            type: import('vue').PropType<IAccount[]>;
+            required: true;
+        };
+        langs: {
+            type: import('vue').PropType<LanguageAndFlag[]>;
+            required: true;
+        };
+        baseUrl: {
+            type: StringConstructor;
+            required: true;
+        };
+        texts: {
+            type: import('vue').PropType<{
+                [key: string]: string;
+            }>;
+            required: true;
+        };
+    }>, {
+        isOpen: import('vue').Ref<boolean, boolean>;
+        userName: import('vue').ComputedRef<string>;
+        langMenu: import('vue').Ref<boolean, boolean>;
+        selectAccount: (account: IAccount) => void;
+        openProfile: () => void;
+        switchLang: (lang: LanguageAndFlag) => void;
+        logOut: () => void;
+    }, {}, {}, {
+        mdiLogout(): string;
+        mdiAccount(): string;
+        mdiMenuDown(): string;
+        mdiCheck(): string;
+        formatFullName: (obj: {
+            name: string;
+            surname: string | null;
+        }) => string;
+    }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("open-profile" | "select-account" | "switch-lang" | "log-out")[], "open-profile" | "select-account" | "switch-lang" | "log-out", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+        currentUser: {
+            type: import('vue').PropType<IUser>;
+            required: true;
+        };
+        currentAccount: {
+            type: import('vue').PropType<IAccount>;
+            default: null;
+        };
+        currentLang: {
+            type: import('vue').PropType<LanguageAndFlag>;
+            required: true;
+        };
+        accounts: {
+            type: import('vue').PropType<IAccount[]>;
+            required: true;
+        };
+        langs: {
+            type: import('vue').PropType<LanguageAndFlag[]>;
+            required: true;
+        };
+        baseUrl: {
+            type: StringConstructor;
+            required: true;
+        };
+        texts: {
+            type: import('vue').PropType<{
+                [key: string]: string;
+            }>;
+            required: true;
+        };
+    }>> & Readonly<{
+        "onOpen-profile"?: ((...args: any[]) => any) | undefined;
+        "onSelect-account"?: ((...args: any[]) => any) | undefined;
+        "onSwitch-lang"?: ((...args: any[]) => any) | undefined;
+        "onLog-out"?: ((...args: any[]) => any) | undefined;
+    }>, {
+        currentAccount: IAccount;
+    }, {}, {
+        AccountAvatar: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+            item: {
+                type: import('vue').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: import('vue').PropType<IAccount>;
+                required: true;
+            };
+            size: {
+                type: NumberConstructor;
+                default: number;
+            };
+        }>> & Readonly<{}>, {
+            size: number;
+        }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+        UserAvatar: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+            user: {
+                type: import('vue').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: import('vue').PropType<IUser>;
+                required: true;
+            };
+            size: {
+                type: NumberConstructor;
+                required: true;
+            };
+            baseUrl: {
+                type: StringConstructor;
+                required: true;
+            };
+        }>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    }, {}, 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 v, createElementBlock as g, openBlock as a, createElementVNode as c, createCommentVNode as y, toDisplayString as p, renderSlot as u, normalizeClass as f, resolveComponent as r, createBlock as m, withCtx as i, createVNode as _, createTextVNode as N, computed as z } from "vue";
-const B = v({
+import { defineComponent as L, createElementBlock as g, openBlock as o, createElementVNode as u, createCommentVNode as V, toDisplayString as p, renderSlot as b, normalizeClass as A, resolveComponent as s, createBlock as f, withCtx as n, createVNode as l, createTextVNode as C, computed as E, ref as P, Fragment as z, renderList as B, normalizeProps as T, guardReactiveProps as D, mergeProps as R } from "vue";
+const F = L({
   name: "PageTitle",
   props: {
     title: {
@@ -11,27 +11,27 @@ const B = v({
       default: null
     }
   }
-}), $ = (e, t) => {
-  const o = e.__vccOpts || e;
-  for (const [s, n] of t)
-    o[s] = n;
-  return o;
-}, U = { class: "mt-6 mb-3 ff-page-title" }, q = { class: "text-h5 ff-title" }, A = {
+}), y = (e, t) => {
+  const r = e.__vccOpts || e;
+  for (const [c, i] of t)
+    r[c] = i;
+  return r;
+}, I = { class: "mt-6 mb-3 ff-page-title" }, Z = { class: "text-h5 ff-title" }, G = {
   key: 0,
   class: "text-body-2 ff-description"
 };
-function w(e, t, o, s, n, l) {
-  return a(), g("div", U, [
-    c("div", null, [
-      c("span", q, p(e.title), 1),
-      e.description ? (a(), g("div", A, p(e.description), 1)) : y("", !0)
+function K(e, t, r, c, i, m) {
+  return o(), g("div", I, [
+    u("div", null, [
+      u("span", Z, p(e.title), 1),
+      e.description ? (o(), g("div", G, p(e.description), 1)) : V("", !0)
     ]),
-    c("div", null, [
-      u(e.$slots, "buttons")
+    u("div", null, [
+      b(e.$slots, "buttons")
     ])
   ]);
 }
-const K = /* @__PURE__ */ $(B, [["render", w]]), P = v({
+const ye = /* @__PURE__ */ y(F, [["render", K]]), J = L({
   name: "PageSubtitle",
   props: {
     subtitle: {
@@ -43,24 +43,24 @@ const K = /* @__PURE__ */ $(B, [["render", w]]), P = v({
       default: !1
     }
   }
-}), T = { class: "text-h6 font-weight-bold" };
-function D(e, t, o, s, n, l) {
-  return a(), g("div", {
-    class: f([e.firstPosition ? "mt-0" : "mt-7", "mb-4 ff-page-subtitle"])
+}), W = { class: "text-h6 font-weight-bold" };
+function Q(e, t, r, c, i, m) {
+  return o(), g("div", {
+    class: A([e.firstPosition ? "mt-0" : "mt-7", "mb-4 ff-page-subtitle"])
   }, [
-    c("div", T, p(e.subtitle), 1),
-    c("div", null, [
-      u(e.$slots, "buttons")
+    u("div", W, p(e.subtitle), 1),
+    u("div", null, [
+      b(e.$slots, "buttons")
     ])
   ], 2);
 }
-const Q = /* @__PURE__ */ $(P, [["render", D]]);
-var F = "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 O = v({
+const ke = /* @__PURE__ */ y(J, [["render", Q]]);
+var X = "M12,4A4,4 0 0,1 16,8A4,4 0 0,1 12,12A4,4 0 0,1 8,8A4,4 0 0,1 12,4M12,14C16.42,14 20,15.79 20,18V20H4V18C4,15.79 7.58,14 12,14Z", Y = "M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z", j = "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", x = "M17 7L15.59 8.41L18.17 11H8V13H18.17L15.59 15.58L17 17L22 12M4 5H12V3H4C2.9 3 2 3.9 2 5V19C2 20.1 2.9 21 4 21H12V19H4V5Z", ee = "M7,10L12,15L17,10H7Z";
+const te = L({
   name: "CustomDialog",
   methods: {
     mdiClose() {
-      return F;
+      return j;
     }
   },
   props: {
@@ -89,45 +89,45 @@ const O = v({
       default: !1
     }
   }
-}), V = { class: "close-btn" };
-function H(e, t, o, s, n, l) {
-  const d = r("v-btn"), h = r("v-card-text"), b = r("v-spacer"), C = r("v-card-actions"), S = r("v-card"), k = r("v-dialog");
-  return a(), m(k, {
+}), ne = { class: "close-btn" };
+function le(e, t, r, c, i, m) {
+  const v = s("v-btn"), _ = s("v-card-text"), $ = s("v-spacer"), d = s("v-card-actions"), N = s("v-card"), U = s("v-dialog");
+  return o(), f(U, {
     "model-value": e.value,
     "max-width": "960",
     persistent: e.persistent,
     fullscreen: e.$vuetify.display.smAndDown && !e.noFullScreen,
-    class: f([e.fullHeight ? "ff-dialog" : "ff-dialog ff-full-height"]),
+    class: A([e.fullHeight ? "ff-dialog" : "ff-dialog ff-full-height"]),
     "content-class": e.fullHeight ? "ff-full-height" : "",
-    "onUpdate:modelValue": t[1] || (t[1] = (L) => e.$emit("close"))
+    "onUpdate:modelValue": t[1] || (t[1] = (k) => e.$emit("close"))
   }, {
-    default: i(() => [
-      u(e.$slots, "card", {}, () => [
-        _(S, {
+    default: n(() => [
+      b(e.$slots, "card", {}, () => [
+        l(N, {
           title: e.title,
-          class: f(e.fullHeight ? "ff-full-height" : "")
+          class: A(e.fullHeight ? "ff-full-height" : "")
         }, {
-          append: i(() => [
-            c("div", V, [
-              _(d, {
+          append: n(() => [
+            u("div", ne, [
+              l(v, {
                 variant: "text",
                 icon: e.mdiClose(),
-                onClick: t[0] || (t[0] = (L) => e.$emit("close"))
+                onClick: t[0] || (t[0] = (k) => e.$emit("close"))
               }, null, 8, ["icon"])
             ])
           ]),
-          default: i(() => [
-            _(h, null, {
-              default: i(() => [
-                u(e.$slots, "default")
+          default: n(() => [
+            l(_, null, {
+              default: n(() => [
+                b(e.$slots, "default")
               ]),
               _: 3
             }),
-            e.noFooter ? y("", !0) : (a(), m(C, { key: 0 }, {
-              default: i(() => [
-                u(e.$slots, "left-footer"),
-                _(b),
-                u(e.$slots, "footer")
+            e.noFooter ? V("", !0) : (o(), f(d, { key: 0 }, {
+              default: n(() => [
+                b(e.$slots, "left-footer"),
+                l($),
+                b(e.$slots, "footer")
               ]),
               _: 3
             }))
@@ -139,7 +139,7 @@ function H(e, t, o, s, n, l) {
     _: 3
   }, 8, ["model-value", "persistent", "fullscreen", "class", "content-class"]);
 }
-const W = /* @__PURE__ */ $(O, [["render", H]]), R = v({
+const Ce = /* @__PURE__ */ y(te, [["render", le]]), se = L({
   name: "AccountAvatar",
   props: {
     item: {
@@ -152,19 +152,19 @@ const W = /* @__PURE__ */ $(O, [["render", H]]), R = v({
     }
   }
 });
-function E(e, t, o, s, n, l) {
-  const d = r("v-avatar");
-  return a(), m(d, {
-    class: f(`ff-avatar avatar-${e.size}-${e.item.initials.length >= 3 ? "l" : "s"}`),
+function re(e, t, r, c, i, m) {
+  const v = s("v-avatar");
+  return o(), f(v, {
+    class: A(`ff-avatar avatar-${e.size}-${e.item.initials.length >= 3 ? "l" : "s"}`),
     size: e.size
   }, {
-    default: i(() => [
-      N(p(e.item.initials), 1)
+    default: n(() => [
+      C(p(e.item.initials), 1)
     ]),
     _: 1
   }, 8, ["class", "size"]);
 }
-const X = /* @__PURE__ */ $(R, [["render", E]]), I = (e) => e.surname ? `${e.name} ${e.surname}` : e.name, J = v({
+const oe = /* @__PURE__ */ y(se, [["render", re]]), w = (e) => e.surname ? `${e.name} ${e.surname}` : e.name, Ae = (e) => e == null ? "" : e.name != null && e.name !== "" ? e.surname != null && e.surname !== "" ? `${e.name.trim().substring(0, 1).toUpperCase()}${e.surname.trim().substring(0, 1).toUpperCase()}` : e.name.trim().substring(0, 1).toUpperCase() : e.surname != null && e.surname !== "" ? e.surname.trim().substring(0, 1).toUpperCase() : "", ae = L({
   name: "UserAvatar",
   props: {
     user: {
@@ -181,42 +181,391 @@ const X = /* @__PURE__ */ $(R, [["render", E]]), I = (e) => e.surname ? `${e.nam
     }
   },
   setup(e) {
-    return { fullName: z(() => I(e.user)) };
+    return { fullName: E(() => w(e.user)) };
   }
-}), M = { key: 1 };
-function Z(e, t, o, s, n, l) {
-  const d = r("v-img"), h = r("v-avatar");
-  return a(), m(h, {
+}), ie = { key: 1 };
+function ue(e, t, r, c, i, m) {
+  const v = s("v-img"), _ = s("v-avatar");
+  return o(), f(_, {
     color: e.user.avatar_thumb ? "light_grey_bg" : e.user.color ?? "primary",
-    class: f(`avatar-${e.size}-${e.user.initials.length >= 3 ? "l" : "s"}`),
+    class: A(`avatar-${e.size}-${e.user.initials.length >= 3 ? "l" : "s"}`),
     size: e.size
   }, {
-    default: i(() => [
-      e.user.avatar_thumb ? (a(), m(d, {
+    default: n(() => [
+      e.user.avatar_thumb ? (o(), f(v, {
         key: 0,
         alt: e.fullName,
         src: `${e.baseUrl}/${e.user.avatar_thumb}`
-      }, null, 8, ["alt", "src"])) : (a(), g("span", M, p(e.user.initials), 1))
+      }, null, 8, ["alt", "src"])) : (o(), g("span", ie, p(e.user.initials), 1))
     ]),
     _: 1
   }, 8, ["color", "class", "size"]);
 }
-const Y = /* @__PURE__ */ $(J, [["render", Z]]), j = (e) => e ? e.replace(/(?:\r\n|\r|\n)/g, "<br>") : "", x = (e) => JSON.parse(JSON.stringify(e)), ee = (e) => {
+const ce = /* @__PURE__ */ y(ae, [["render", ue]]), de = L({
+  name: "UserMenu",
+  components: { AccountAvatar: oe, UserAvatar: ce },
+  methods: {
+    mdiLogout() {
+      return x;
+    },
+    mdiAccount() {
+      return X;
+    },
+    mdiMenuDown() {
+      return ee;
+    },
+    mdiCheck() {
+      return Y;
+    },
+    formatFullName: w
+  },
+  props: {
+    currentUser: {
+      type: Object,
+      required: !0
+    },
+    currentAccount: {
+      type: Object,
+      default: null
+    },
+    currentLang: {
+      type: Object,
+      required: !0
+    },
+    accounts: {
+      type: Array,
+      required: !0
+    },
+    langs: {
+      type: Array,
+      required: !0
+    },
+    baseUrl: {
+      type: String,
+      required: !0
+    },
+    texts: {
+      type: Object,
+      required: !0
+    }
+  },
+  emits: [
+    "open-profile",
+    "select-account",
+    "switch-lang",
+    "log-out"
+  ],
+  setup(e, { emit: t }) {
+    const r = P(!1), c = P(!1), i = E(() => e.currentUser != null ? w(e.currentUser) : "-");
+    return { isOpen: r, userName: i, langMenu: c, selectAccount: (d) => {
+      t("select-account", d);
+    }, openProfile: () => {
+      t("open-profile"), r.value = !1;
+    }, switchLang: (d) => {
+      t("switch-lang", d);
+    }, logOut: () => {
+      t("log-out");
+    } };
+  }
+}), pe = { class: "ff-user-btn-text" }, me = { class: "name" }, ve = {
+  key: 0,
+  class: "comp"
+}, fe = { class: "as-avatar" }, ge = ["src"], _e = ["src"], $e = { class: "as-avatar" }, he = { class: "as-avatar" };
+function be(e, t, r, c, i, m) {
+  const v = s("UserAvatar"), _ = s("v-btn"), $ = s("v-list-subheader"), d = s("v-list-item"), N = s("AccountAvatar"), U = s("v-list-item-title"), k = s("v-icon"), M = s("v-list"), O = s("v-menu"), H = s("v-card-text"), q = s("v-card");
+  return o(), f(O, {
+    modelValue: e.isOpen,
+    "onUpdate:modelValue": t[2] || (t[2] = (h) => e.isOpen = h),
+    "close-on-content-click": !1
+  }, {
+    activator: n(({ props: h }) => [
+      l(_, R(h, { class: "ff-user-btn" }), {
+        default: n(() => [
+          l(v, {
+            size: 32,
+            user: e.currentUser,
+            "base-url": e.baseUrl + "/avatars"
+          }, null, 8, ["user", "base-url"]),
+          u("div", pe, [
+            u("div", me, p(e.userName), 1),
+            e.currentAccount ? (o(), g("div", ve, p(e.formatFullName(e.currentAccount)), 1)) : V("", !0)
+          ])
+        ]),
+        _: 2
+      }, 1040)
+    ]),
+    default: n(() => [
+      l(q, { class: "ff-user-manu-card" }, {
+        default: n(() => [
+          l(H, { class: "pa-0" }, {
+            default: n(() => [
+              l(M, null, {
+                default: n(() => {
+                  var h;
+                  return [
+                    l($, null, {
+                      default: n(() => [
+                        C(p(e.texts["Logged in as"]) + ":", 1)
+                      ]),
+                      _: 1
+                    }),
+                    l(d, {
+                      title: e.userName,
+                      subtitle: ((h = e.currentUser) == null ? void 0 : h.email) ?? ""
+                    }, {
+                      prepend: n(() => [
+                        l(v, {
+                          size: 32,
+                          user: e.currentUser,
+                          "base-url": e.baseUrl + "/avatars"
+                        }, null, 8, ["user", "base-url"])
+                      ]),
+                      _: 1
+                    }, 8, ["title", "subtitle"]),
+                    l($, null, {
+                      default: n(() => [
+                        C(p(e.texts["Choose active company"]) + ":", 1)
+                      ]),
+                      _: 1
+                    }),
+                    (o(!0), g(z, null, B(e.accounts, (a) => (o(), f(d, {
+                      key: a.id,
+                      onClick: (S) => e.selectAccount(a)
+                    }, {
+                      prepend: n(() => [
+                        l(N, { item: a }, null, 8, ["item"])
+                      ]),
+                      append: n(() => {
+                        var S;
+                        return [
+                          l(k, {
+                            color: a.id === (((S = e.currentAccount) == null ? void 0 : S.id) ?? 0) ? "primary" : "white",
+                            icon: e.mdiCheck()
+                          }, null, 8, ["color", "icon"])
+                        ];
+                      }),
+                      default: n(() => [
+                        l(U, null, {
+                          default: n(() => [
+                            C(p(e.formatFullName(a)), 1)
+                          ]),
+                          _: 2
+                        }, 1024)
+                      ]),
+                      _: 2
+                    }, 1032, ["onClick"]))), 128)),
+                    l($, null, {
+                      default: n(() => [
+                        C(p(e.texts.Actions) + ":", 1)
+                      ]),
+                      _: 1
+                    }),
+                    e.langs.length > 1 ? (o(), f(d, {
+                      key: 0,
+                      "append-icon": e.mdiMenuDown(),
+                      onClick: t[1] || (t[1] = (a) => e.langMenu = !0)
+                    }, {
+                      prepend: n(() => [
+                        u("div", fe, [
+                          u("img", {
+                            src: e.currentLang.icon,
+                            height: "15",
+                            width: "20",
+                            alt: ""
+                          }, null, 8, ge)
+                        ])
+                      ]),
+                      default: n(() => [
+                        l(U, null, {
+                          default: n(() => [
+                            l(O, {
+                              modelValue: e.langMenu,
+                              "onUpdate:modelValue": t[0] || (t[0] = (a) => e.langMenu = a),
+                              "close-on-content-click": !1
+                            }, {
+                              activator: n(({ props: a }) => [
+                                u("span", T(D(a)), p(e.currentLang.title), 17)
+                              ]),
+                              default: n(() => [
+                                l(M, null, {
+                                  default: n(() => [
+                                    (o(!0), g(z, null, B(e.langs, (a) => (o(), f(d, {
+                                      key: a.value,
+                                      title: a.title,
+                                      onClick: (S) => e.switchLang(a)
+                                    }, {
+                                      prepend: n(() => [
+                                        u("img", {
+                                          src: a.icon,
+                                          height: "18",
+                                          width: "24",
+                                          alt: "",
+                                          class: "mr-4"
+                                        }, null, 8, _e)
+                                      ]),
+                                      _: 2
+                                    }, 1032, ["title", "onClick"]))), 128))
+                                  ]),
+                                  _: 1
+                                })
+                              ]),
+                              _: 1
+                            }, 8, ["modelValue"])
+                          ]),
+                          _: 1
+                        })
+                      ]),
+                      _: 1
+                    }, 8, ["append-icon"])) : V("", !0),
+                    l(d, {
+                      title: e.texts["Profile settings"],
+                      onClick: e.openProfile
+                    }, {
+                      prepend: n(() => [
+                        u("div", $e, [
+                          l(k, {
+                            icon: e.mdiAccount()
+                          }, null, 8, ["icon"])
+                        ])
+                      ]),
+                      _: 1
+                    }, 8, ["title", "onClick"]),
+                    l(d, {
+                      title: e.texts["Log out"],
+                      onClick: e.logOut
+                    }, {
+                      prepend: n(() => [
+                        u("div", he, [
+                          l(k, {
+                            icon: e.mdiLogout()
+                          }, null, 8, ["icon"])
+                        ])
+                      ]),
+                      _: 1
+                    }, 8, ["title", "onClick"])
+                  ];
+                }),
+                _: 1
+              })
+            ]),
+            _: 1
+          })
+        ]),
+        _: 1
+      })
+    ]),
+    _: 1
+  }, 8, ["modelValue"]);
+}
+const Ue = /* @__PURE__ */ y(de, [["render", be]]), Se = (e) => e ? e.replace(/(?:\r\n|\r|\n)/g, "<br>") : "", Ve = (e) => JSON.parse(JSON.stringify(e)), Ne = (e) => {
   let t = document.cookie.match(new RegExp("(^|;\\s*)(" + e + ")=([^;]*)"));
   return t ? decodeURIComponent(t[3]) : null;
-}, te = (e, t, o, s) => {
-  let n, l;
-  return s == null && (s = "/"), l = "", o && (n = /* @__PURE__ */ new Date(), n.setTime(n.getTime() + o * 24 * 60 * 60 * 1e3), l = "; expires=" + n.toUTCString()), document.cookie = encodeURIComponent(e) + "=" + encodeURIComponent(t) + l + "; path=" + s, !0;
-};
+}, we = (e, t, r, c) => {
+  let i, m;
+  return c == null && (c = "/"), m = "", r && (i = /* @__PURE__ */ new Date(), i.setTime(i.getTime() + r * 24 * 60 * 60 * 1e3), m = "; expires=" + i.toUTCString()), document.cookie = encodeURIComponent(e) + "=" + encodeURIComponent(t) + m + "; path=" + c, !0;
+}, Me = (e, t) => {
+  for (const r of t) {
+    if (r === "/")
+      return e === "/";
+    if (e.startsWith(r))
+      return !0;
+  }
+  return !1;
+}, Oe = [
+  { title: "lng.sv-se", value: "sv_SE" },
+  // $t("lng.sv-se")
+  { title: "lng.sl-si", value: "sl_SI" },
+  // $t("lng.sl-si")
+  { title: "lng.sk-sk", value: "sk_SK" },
+  // $t("lng.sk-sk")
+  { title: "lng.uk-ua", value: "uk_UA" },
+  // $t("lng.uk-ua")
+  { title: "lng.tr-tr", value: "tr_TR" },
+  // $t("lng.tr-tr")
+  { title: "lng.bg-bg", value: "bg_BG" },
+  // $t("lng.bg-bg")
+  { title: "lng.bs-ba", value: "bs_BA" },
+  // $t("lng.bs-ba")
+  { title: "lng.cy-gb", value: "cy_GB" },
+  // $t("lng.cy-gb")
+  { title: "lng.cs-cz", value: "cs_CZ" },
+  // $t("lng.cs-cz")
+  { title: "lng.ga-ie", value: "ga_IE" },
+  // $t("lng.ga-ie")
+  { title: "lng.it-it", value: "it_IT" },
+  // $t("lng.it-it")
+  { title: "lng.mk-mk", value: "mk_MK" },
+  // $t("lng.mk-mk")
+  { title: "lng.lt-lt", value: "lt_LT" },
+  // $t("lng.lt-lt")
+  { title: "lng.lv-lv", value: "lv_LV" },
+  // $t("lng.lv-lv")
+  { title: "lng.et-ee", value: "et_EE" },
+  // $t("lng.et-ee")
+  { title: "lng.en-gb", value: "en_GB" },
+  // $t("lng.en-gb")
+  { title: "lng.es-es", value: "es_ES" },
+  // $t("lng.es-es")
+  { title: "lng.hr-hr", value: "hr_HR" },
+  // $t("lng.hr-hr")
+  { title: "lng.hu-hu", value: "hu_HU" },
+  // $t("lng.hu-hu")
+  { title: "lng.pl-pl", value: "pl_PL" },
+  // $t("lng.pl-pl")
+  { title: "lng.da-dk", value: "da_DK" },
+  // $t("lng.da-dk")
+  { title: "lng.el-gr", value: "el_GR" },
+  // $t("lng.el-gr")
+  { title: "lng.de-de", value: "de_DE" },
+  // $t("lng.de-de")
+  { title: "lng.fi-fi", value: "fi_FI" },
+  // $t("lng.fi-fi")
+  { title: "lng.fr-fr", value: "fr_FR" },
+  // $t("lng.fr-fr")
+  { title: "lng.nb-no", value: "nb_NO" },
+  // $t("lng.nb-no")
+  { title: "lng.nl-nl", value: "nl_NL" },
+  // $t("lng.nl-nl")
+  { title: "lng.ru-ru", value: "ru_RU" },
+  // $t("lng.ru-ru")
+  { title: "lng.ro-ro", value: "ro_RO" },
+  // $t("lng.ro-ro")
+  { title: "lng.pt-pt", value: "pt_PT" }
+  // $t("lng.pt-pt")
+], Pe = [
+  { title: "lngin.et-ee", value: "et_EE" },
+  // $t("lngin.et-ee")
+  { title: "lngin.lv-lv", value: "lv_LV" },
+  // $t("lngin.lv-lv")
+  { title: "lngin.lt-lt", value: "lt_LT" },
+  // $t("lngin.lt-lt")
+  { title: "lngin.en-gb", value: "en_GB" },
+  // $t("lngin.en-gb")
+  { title: "lngin.pl-pl", value: "pl_PL" },
+  // $t("lngin.pl-pl")
+  { title: "lngin.es-es", value: "es_ES" },
+  // $t("lngin.es-es")
+  { title: "lngin.sv-se", value: "sv_SE" },
+  // $t("lngin.sv-se")
+  { title: "lngin.it-it", value: "it_IT" },
+  // $t("lngin.it-it")
+  { title: "lngin.de-de", value: "de_DE" }
+  // $t("lngin.de-de")
+];
 export {
-  X as AccountAvatar,
-  W as CustomDialog,
-  Q as PageSubtitle,
-  K as PageTitle,
-  Y as UserAvatar,
-  x as deepClone,
-  I as formatFullName,
-  ee as getCookie,
-  j as nl2br,
-  te as setCookie
+  oe as AccountAvatar,
+  Ce as CustomDialog,
+  Pe as InLanguages,
+  Oe as Languages,
+  ke as PageSubtitle,
+  ye as PageTitle,
+  ce as UserAvatar,
+  Ue as UserMenu,
+  Ve as deepClone,
+  w as formatFullName,
+  Ae as formatInitials,
+  Ne as getCookie,
+  Me as isActive,
+  Se as nl2br,
+  we as setCookie
 };

package/dist/alytus-ff.umd.cjs

@@ -1 +1 @@
-(function(o,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(o=typeof globalThis<"u"?globalThis:o||self,e(o["Alytus FF"]={},o.Vue))})(this,function(o,e){"use strict";const m=e.defineComponent({name:"PageTitle",props:{title:{type:String,required:!0},description:{type:String,default:null}}}),i=(t,n)=>{const s=t.__vccOpts||t;for(const[r,l]of n)s[r]=l;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 g(t,n,s,r,l,a){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},firstPosition:{type:Boolean,default:!1}}}),h={class:"text-h6 font-weight-bold"};function y(t,n,s,r,l,a){return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([t.firstPosition?"mt-0":"mt-7","mb-4 ff-page-subtitle"])},[e.createElementVNode("div",h,e.toDisplayString(t.subtitle),1),e.createElementVNode("div",null,[e.renderSlot(t.$slots,"buttons")])],2)}const k=i(_,[["render",y]]);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 S=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},noFullScreen:{type:Boolean,default:!1},fullHeight:{type:Boolean,default:!1}}}),B={class:"close-btn"};function N(t,n,s,r,l,a){const c=e.resolveComponent("v-btn"),d=e.resolveComponent("v-card-text"),O=e.resolveComponent("v-spacer"),H=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&&!t.noFullScreen,class:e.normalizeClass([t.fullHeight?"ff-dialog":"ff-dialog ff-full-height"]),"content-class":t.fullHeight?"ff-full-height":"","onUpdate:modelValue":n[1]||(n[1]=J=>t.$emit("close"))},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"card",{},()=>[e.createVNode(R,{title:t.title,class:e.normalizeClass(t.fullHeight?"ff-full-height":"")},{append:e.withCtx(()=>[e.createElementVNode("div",B,[e.createVNode(c,{variant:"text",icon:t.mdiClose(),onClick:n[0]||(n[0]=J=>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(H,{key:0},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"left-footer"),e.createVNode(O),e.renderSlot(t.$slots,"footer")]),_:3}))]),_:3},8,["title","class"])])]),_:3},8,["model-value","persistent","fullscreen","class","content-class"])}const z=i(S,[["render",N]]),V=e.defineComponent({name:"AccountAvatar",props:{item:{type:Object,required:!0},size:{type:Number,default:32}}});function w(t,n,s,r,l,a){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(V,[["render",w]]),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))}}}),E={key:1};function D(t,n,s,r,l,a){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",E,e.toDisplayString(t.user.initials),1))]),_:1},8,["color","class","size"])}const T=i(A,[["render",D]]),U=t=>t?t.replace(/(?:\r\n|\r|\n)/g,"<br>"):"",P=t=>JSON.parse(JSON.stringify(t)),q=t=>{let n=document.cookie.match(new RegExp("(^|;\\s*)("+t+")=([^;]*)"));return n?decodeURIComponent(n[3]):null},F=(t,n,s,r)=>{let l,a;return r==null&&(r="/"),a="",s&&(l=new Date,l.setTime(l.getTime()+s*24*60*60*1e3),a="; expires="+l.toUTCString()),document.cookie=encodeURIComponent(t)+"="+encodeURIComponent(n)+a+"; path="+r,!0};o.AccountAvatar=L,o.CustomDialog=z,o.PageSubtitle=k,o.PageTitle=C,o.UserAvatar=T,o.deepClone=P,o.formatFullName=p,o.getCookie=q,o.nl2br=U,o.setCookie=F,Object.defineProperty(o,Symbol.toStringTag,{value:"Module"})});
+(function(l,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(l=typeof globalThis<"u"?globalThis:l||self,e(l["Alytus FF"]={},l.Vue))})(this,function(l,e){"use strict";const b=e.defineComponent({name:"PageTitle",props:{title:{type:String,required:!0},description:{type:String,default:null}}}),m=(t,n)=>{const o=t.__vccOpts||t;for(const[s,a]of n)o[s]=a;return o},L={class:"mt-6 mb-3 ff-page-title"},w={class:"text-h5 ff-title"},B={key:0,class:"text-body-2 ff-description"};function S(t,n,o,s,a,c){return e.openBlock(),e.createElementBlock("div",L,[e.createElementVNode("div",null,[e.createElementVNode("span",w,e.toDisplayString(t.title),1),t.description?(e.openBlock(),e.createElementBlock("div",B,e.toDisplayString(t.description),1)):e.createCommentVNode("",!0)]),e.createElementVNode("div",null,[e.renderSlot(t.$slots,"buttons")])])}const A=m(b,[["render",S]]),E=e.defineComponent({name:"PageSubtitle",props:{subtitle:{type:String,required:!0},firstPosition:{type:Boolean,default:!1}}}),U={class:"text-h6 font-weight-bold"};function D(t,n,o,s,a,c){return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([t.firstPosition?"mt-0":"mt-7","mb-4 ff-page-subtitle"])},[e.createElementVNode("div",U,e.toDisplayString(t.subtitle),1),e.createElementVNode("div",null,[e.renderSlot(t.$slots,"buttons")])],2)}const T=m(E,[["render",D]]);var z="M12,4A4,4 0 0,1 16,8A4,4 0 0,1 12,12A4,4 0 0,1 8,8A4,4 0 0,1 12,4M12,14C16.42,14 20,15.79 20,18V20H4V18C4,15.79 7.58,14 12,14Z",M="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z",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",O="M17 7L15.59 8.41L18.17 11H8V13H18.17L15.59 15.58L17 17L22 12M4 5H12V3H4C2.9 3 2 3.9 2 5V19C2 20.1 2.9 21 4 21H12V19H4V5Z",q="M7,10L12,15L17,10H7Z";const F=e.defineComponent({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},noFullScreen:{type:Boolean,default:!1},fullHeight:{type:Boolean,default:!1}}}),H={class:"close-btn"};function I(t,n,o,s,a,c){const d=e.resolveComponent("v-btn"),p=e.resolveComponent("v-card-text"),u=e.resolveComponent("v-spacer"),i=e.resolveComponent("v-card-actions"),k=e.resolveComponent("v-card"),C=e.resolveComponent("v-dialog");return e.openBlock(),e.createBlock(C,{"model-value":t.value,"max-width":"960",persistent:t.persistent,fullscreen:t.$vuetify.display.smAndDown&&!t.noFullScreen,class:e.normalizeClass([t.fullHeight?"ff-dialog":"ff-dialog ff-full-height"]),"content-class":t.fullHeight?"ff-full-height":"","onUpdate:modelValue":n[1]||(n[1]=g=>t.$emit("close"))},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"card",{},()=>[e.createVNode(k,{title:t.title,class:e.normalizeClass(t.fullHeight?"ff-full-height":"")},{append:e.withCtx(()=>[e.createElementVNode("div",H,[e.createVNode(d,{variant:"text",icon:t.mdiClose(),onClick:n[0]||(n[0]=g=>t.$emit("close"))},null,8,["icon"])])]),default:e.withCtx(()=>[e.createVNode(p,null,{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default")]),_:3}),t.noFooter?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(i,{key:0},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"left-footer"),e.createVNode(u),e.renderSlot(t.$slots,"footer")]),_:3}))]),_:3},8,["title","class"])])]),_:3},8,["model-value","persistent","fullscreen","class","content-class"])}const R=m(F,[["render",I]]),Z=e.defineComponent({name:"AccountAvatar",props:{item:{type:Object,required:!0},size:{type:Number,default:32}}});function v(t,n,o,s,a,c){const d=e.resolveComponent("v-avatar");return e.openBlock(),e.createBlock(d,{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 V=m(Z,[["render",v]]),_=t=>t.surname?`${t.name} ${t.surname}`:t.name,G=t=>t==null?"":t.name!=null&&t.name!==""?t.surname!=null&&t.surname!==""?`${t.name.trim().substring(0,1).toUpperCase()}${t.surname.trim().substring(0,1).toUpperCase()}`:t.name.trim().substring(0,1).toUpperCase():t.surname!=null&&t.surname!==""?t.surname.trim().substring(0,1).toUpperCase():"",K=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(()=>_(t.user))}}}),J={key:1};function W(t,n,o,s,a,c){const d=e.resolveComponent("v-img"),p=e.resolveComponent("v-avatar");return e.openBlock(),e.createBlock(p,{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(d,{key:0,alt:t.fullName,src:`${t.baseUrl}/${t.user.avatar_thumb}`},null,8,["alt","src"])):(e.openBlock(),e.createElementBlock("span",J,e.toDisplayString(t.user.initials),1))]),_:1},8,["color","class","size"])}const $=m(K,[["render",W]]),Q=e.defineComponent({name:"UserMenu",components:{AccountAvatar:V,UserAvatar:$},methods:{mdiLogout(){return O},mdiAccount(){return z},mdiMenuDown(){return q},mdiCheck(){return M},formatFullName:_},props:{currentUser:{type:Object,required:!0},currentAccount:{type:Object,default:null},currentLang:{type:Object,required:!0},accounts:{type:Array,required:!0},langs:{type:Array,required:!0},baseUrl:{type:String,required:!0},texts:{type:Object,required:!0}},emits:["open-profile","select-account","switch-lang","log-out"],setup(t,{emit:n}){const o=e.ref(!1),s=e.ref(!1),a=e.computed(()=>t.currentUser!=null?_(t.currentUser):"-");return{isOpen:o,userName:a,langMenu:s,selectAccount:i=>{n("select-account",i)},openProfile:()=>{n("open-profile"),o.value=!1},switchLang:i=>{n("switch-lang",i)},logOut:()=>{n("log-out")}}}}),X={class:"ff-user-btn-text"},Y={class:"name"},j={key:0,class:"comp"},x={class:"as-avatar"},ee=["src"],te=["src"],ne={class:"as-avatar"},le={class:"as-avatar"};function oe(t,n,o,s,a,c){const d=e.resolveComponent("UserAvatar"),p=e.resolveComponent("v-btn"),u=e.resolveComponent("v-list-subheader"),i=e.resolveComponent("v-list-item"),k=e.resolveComponent("AccountAvatar"),C=e.resolveComponent("v-list-item-title"),g=e.resolveComponent("v-icon"),N=e.resolveComponent("v-list"),y=e.resolveComponent("v-menu"),ue=e.resolveComponent("v-card-text"),fe=e.resolveComponent("v-card");return e.openBlock(),e.createBlock(y,{modelValue:t.isOpen,"onUpdate:modelValue":n[2]||(n[2]=f=>t.isOpen=f),"close-on-content-click":!1},{activator:e.withCtx(({props:f})=>[e.createVNode(p,e.mergeProps(f,{class:"ff-user-btn"}),{default:e.withCtx(()=>[e.createVNode(d,{size:32,user:t.currentUser,"base-url":t.baseUrl+"/avatars"},null,8,["user","base-url"]),e.createElementVNode("div",X,[e.createElementVNode("div",Y,e.toDisplayString(t.userName),1),t.currentAccount?(e.openBlock(),e.createElementBlock("div",j,e.toDisplayString(t.formatFullName(t.currentAccount)),1)):e.createCommentVNode("",!0)])]),_:2},1040)]),default:e.withCtx(()=>[e.createVNode(fe,{class:"ff-user-manu-card"},{default:e.withCtx(()=>[e.createVNode(ue,{class:"pa-0"},{default:e.withCtx(()=>[e.createVNode(N,null,{default:e.withCtx(()=>{var f;return[e.createVNode(u,null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.texts["Logged in as"])+":",1)]),_:1}),e.createVNode(i,{title:t.userName,subtitle:((f=t.currentUser)==null?void 0:f.email)??""},{prepend:e.withCtx(()=>[e.createVNode(d,{size:32,user:t.currentUser,"base-url":t.baseUrl+"/avatars"},null,8,["user","base-url"])]),_:1},8,["title","subtitle"]),e.createVNode(u,null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.texts["Choose active company"])+":",1)]),_:1}),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.accounts,r=>(e.openBlock(),e.createBlock(i,{key:r.id,onClick:h=>t.selectAccount(r)},{prepend:e.withCtx(()=>[e.createVNode(k,{item:r},null,8,["item"])]),append:e.withCtx(()=>{var h;return[e.createVNode(g,{color:r.id===(((h=t.currentAccount)==null?void 0:h.id)??0)?"primary":"white",icon:t.mdiCheck()},null,8,["color","icon"])]}),default:e.withCtx(()=>[e.createVNode(C,null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.formatFullName(r)),1)]),_:2},1024)]),_:2},1032,["onClick"]))),128)),e.createVNode(u,null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.texts.Actions)+":",1)]),_:1}),t.langs.length>1?(e.openBlock(),e.createBlock(i,{key:0,"append-icon":t.mdiMenuDown(),onClick:n[1]||(n[1]=r=>t.langMenu=!0)},{prepend:e.withCtx(()=>[e.createElementVNode("div",x,[e.createElementVNode("img",{src:t.currentLang.icon,height:"15",width:"20",alt:""},null,8,ee)])]),default:e.withCtx(()=>[e.createVNode(C,null,{default:e.withCtx(()=>[e.createVNode(y,{modelValue:t.langMenu,"onUpdate:modelValue":n[0]||(n[0]=r=>t.langMenu=r),"close-on-content-click":!1},{activator:e.withCtx(({props:r})=>[e.createElementVNode("span",e.normalizeProps(e.guardReactiveProps(r)),e.toDisplayString(t.currentLang.title),17)]),default:e.withCtx(()=>[e.createVNode(N,null,{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.langs,r=>(e.openBlock(),e.createBlock(i,{key:r.value,title:r.title,onClick:h=>t.switchLang(r)},{prepend:e.withCtx(()=>[e.createElementVNode("img",{src:r.icon,height:"18",width:"24",alt:"",class:"mr-4"},null,8,te)]),_:2},1032,["title","onClick"]))),128))]),_:1})]),_:1},8,["modelValue"])]),_:1})]),_:1},8,["append-icon"])):e.createCommentVNode("",!0),e.createVNode(i,{title:t.texts["Profile settings"],onClick:t.openProfile},{prepend:e.withCtx(()=>[e.createElementVNode("div",ne,[e.createVNode(g,{icon:t.mdiAccount()},null,8,["icon"])])]),_:1},8,["title","onClick"]),e.createVNode(i,{title:t.texts["Log out"],onClick:t.logOut},{prepend:e.withCtx(()=>[e.createElementVNode("div",le,[e.createVNode(g,{icon:t.mdiLogout()},null,8,["icon"])])]),_:1},8,["title","onClick"])]}),_:1})]),_:1})]),_:1})]),_:1},8,["modelValue"])}const re=m(Q,[["render",oe]]),ae=t=>t?t.replace(/(?:\r\n|\r|\n)/g,"<br>"):"",se=t=>JSON.parse(JSON.stringify(t)),ie=t=>{let n=document.cookie.match(new RegExp("(^|;\\s*)("+t+")=([^;]*)"));return n?decodeURIComponent(n[3]):null},ce=(t,n,o,s)=>{let a,c;return s==null&&(s="/"),c="",o&&(a=new Date,a.setTime(a.getTime()+o*24*60*60*1e3),c="; expires="+a.toUTCString()),document.cookie=encodeURIComponent(t)+"="+encodeURIComponent(n)+c+"; path="+s,!0},de=(t,n)=>{for(const o of n){if(o==="/")return t==="/";if(t.startsWith(o))return!0}return!1},me=[{title:"lng.sv-se",value:"sv_SE"},{title:"lng.sl-si",value:"sl_SI"},{title:"lng.sk-sk",value:"sk_SK"},{title:"lng.uk-ua",value:"uk_UA"},{title:"lng.tr-tr",value:"tr_TR"},{title:"lng.bg-bg",value:"bg_BG"},{title:"lng.bs-ba",value:"bs_BA"},{title:"lng.cy-gb",value:"cy_GB"},{title:"lng.cs-cz",value:"cs_CZ"},{title:"lng.ga-ie",value:"ga_IE"},{title:"lng.it-it",value:"it_IT"},{title:"lng.mk-mk",value:"mk_MK"},{title:"lng.lt-lt",value:"lt_LT"},{title:"lng.lv-lv",value:"lv_LV"},{title:"lng.et-ee",value:"et_EE"},{title:"lng.en-gb",value:"en_GB"},{title:"lng.es-es",value:"es_ES"},{title:"lng.hr-hr",value:"hr_HR"},{title:"lng.hu-hu",value:"hu_HU"},{title:"lng.pl-pl",value:"pl_PL"},{title:"lng.da-dk",value:"da_DK"},{title:"lng.el-gr",value:"el_GR"},{title:"lng.de-de",value:"de_DE"},{title:"lng.fi-fi",value:"fi_FI"},{title:"lng.fr-fr",value:"fr_FR"},{title:"lng.nb-no",value:"nb_NO"},{title:"lng.nl-nl",value:"nl_NL"},{title:"lng.ru-ru",value:"ru_RU"},{title:"lng.ro-ro",value:"ro_RO"},{title:"lng.pt-pt",value:"pt_PT"}],pe=[{title:"lngin.et-ee",value:"et_EE"},{title:"lngin.lv-lv",value:"lv_LV"},{title:"lngin.lt-lt",value:"lt_LT"},{title:"lngin.en-gb",value:"en_GB"},{title:"lngin.pl-pl",value:"pl_PL"},{title:"lngin.es-es",value:"es_ES"},{title:"lngin.sv-se",value:"sv_SE"},{title:"lngin.it-it",value:"it_IT"},{title:"lngin.de-de",value:"de_DE"}];l.AccountAvatar=V,l.CustomDialog=R,l.InLanguages=pe,l.Languages=me,l.PageSubtitle=T,l.PageTitle=A,l.UserAvatar=$,l.UserMenu=re,l.deepClone=se,l.formatFullName=_,l.formatInitials=G,l.getCookie=ie,l.isActive=de,l.nl2br=ae,l.setCookie=ce,Object.defineProperty(l,Symbol.toStringTag,{value:"Module"})});

package/dist/components/Nav/UserMenu.vue.d.ts

@@ -0,0 +1,143 @@
+import { PropType } from 'vue';
+import { IUser } from '../../types/User.ts';
+import { IAccount } from '../../types/Account.ts';
+import { LanguageAndFlag } from '../../types/Lang.ts';
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    currentUser: {
+        type: PropType<IUser>;
+        required: true;
+    };
+    currentAccount: {
+        type: PropType<IAccount>;
+        default: null;
+    };
+    currentLang: {
+        type: PropType<LanguageAndFlag>;
+        required: true;
+    };
+    accounts: {
+        type: PropType<IAccount[]>;
+        required: true;
+    };
+    langs: {
+        type: PropType<LanguageAndFlag[]>;
+        required: true;
+    };
+    baseUrl: {
+        type: StringConstructor;
+        required: true;
+    };
+    texts: {
+        type: PropType<{
+            [key: string]: string;
+        }>;
+        required: true;
+    };
+}>, {
+    isOpen: import('vue').Ref<boolean, boolean>;
+    userName: import('vue').ComputedRef<string>;
+    langMenu: import('vue').Ref<boolean, boolean>;
+    selectAccount: (account: IAccount) => void;
+    openProfile: () => void;
+    switchLang: (lang: LanguageAndFlag) => void;
+    logOut: () => void;
+}, {}, {}, {
+    mdiLogout(): string;
+    mdiAccount(): string;
+    mdiMenuDown(): string;
+    mdiCheck(): string;
+    formatFullName: (obj: {
+        name: string;
+        surname: string | null;
+    }) => string;
+}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("open-profile" | "select-account" | "switch-lang" | "log-out")[], "open-profile" | "select-account" | "switch-lang" | "log-out", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    currentUser: {
+        type: PropType<IUser>;
+        required: true;
+    };
+    currentAccount: {
+        type: PropType<IAccount>;
+        default: null;
+    };
+    currentLang: {
+        type: PropType<LanguageAndFlag>;
+        required: true;
+    };
+    accounts: {
+        type: PropType<IAccount[]>;
+        required: true;
+    };
+    langs: {
+        type: PropType<LanguageAndFlag[]>;
+        required: true;
+    };
+    baseUrl: {
+        type: StringConstructor;
+        required: true;
+    };
+    texts: {
+        type: PropType<{
+            [key: string]: string;
+        }>;
+        required: true;
+    };
+}>> & Readonly<{
+    "onOpen-profile"?: ((...args: any[]) => any) | undefined;
+    "onSelect-account"?: ((...args: any[]) => any) | undefined;
+    "onSwitch-lang"?: ((...args: any[]) => any) | undefined;
+    "onLog-out"?: ((...args: any[]) => any) | undefined;
+}>, {
+    currentAccount: IAccount;
+}, {}, {
+    AccountAvatar: 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>;
+    UserAvatar: 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>;
+}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/index.d.ts

@@ -3,11 +3,16 @@ 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 { default as UserMenu } from './components/Nav/UserMenu.vue';
 import { nl2br } from './utils/HtmlUtil.ts';
 import { deepClone } from './utils/ObjectUtil.ts';
 import { getCookie, setCookie } from './utils/CookieUtil.ts';
-import { formatFullName } from './utils/StringUtil.ts';
+import { formatFullName, formatInitials } from './utils/StringUtil.ts';
+import { isActive } from './utils/NavUtil.ts';
 import { NameValuePair } from './types/Base.ts';
 import { IAccount } from './types/Account.ts';
 import { IUser } from './types/User.ts';
-export { PageTitle, PageSubtitle, CustomDialog, AccountAvatar, UserAvatar, nl2br, deepClone, getCookie, setCookie, formatFullName, NameValuePair, IAccount, IUser };
+import { MenuItem } from './types/Nav.ts';
+import { Language, LanguageAndFlag } from './types/Lang.ts';
+import { Languages, InLanguages } from './utils/LangUtil.ts';
+export { PageTitle, PageSubtitle, CustomDialog, AccountAvatar, UserAvatar, UserMenu, nl2br, deepClone, getCookie, setCookie, formatFullName, formatInitials, isActive, NameValuePair, IAccount, IUser, MenuItem, Language, LanguageAndFlag, Languages, InLanguages };

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}.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-full-height{height:100%}.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}
+.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-full-height{height:100%}.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}.ff-user-btn .v-avatar{margin-right:8px}.ff-user-btn .v-avatar .v-icon{width:32px;height:32px}.ff-user-btn-text{display:flex;flex-direction:column;gap:2px;letter-spacing:.05em}.ff-user-btn-text .name{text-align:left;font-weight:600;text-transform:none}.ff-user-btn-text .comp{text-align:left;text-transform:none;font-size:12px;color:#424242}.ff-user-manu-card{min-width:280px}.ff-user-manu-card .v-card-item__prepend{padding-right:16px}.ff-user-manu-card .v-card-item__prepend .v-icon{width:32px;height:32px}.ff-user-manu-card .v-card-actions .v-btn{line-height:36px;text-transform:unset;letter-spacing:.05em}.ff-user-manu-card .as-avatar{width:32px;height:32px;display:flex;justify-content:center;align-items:center;margin-right:16px}

package/dist/types/Account.d.ts

@@ -1,4 +1,5 @@
 export interface IAccount {
+    id: number;
     name: string;
     surname: string | null;
     initials: string;

package/dist/types/Lang.d.ts

@@ -0,0 +1,7 @@
+export type Language = {
+    title: string;
+    value: string;
+};
+export type LanguageAndFlag = Language & {
+    icon: string;
+};

package/dist/types/Nav.d.ts

@@ -0,0 +1,6 @@
+export type MenuItem = {
+    icon: string;
+    text: string;
+    link: string;
+    active: boolean;
+};

package/dist/types/User.d.ts

@@ -4,4 +4,5 @@ export interface IUser {
     initials: string;
     color: string;
     avatar_thumb: string | null;
+    email: string;
 }

package/dist/utils/LangUtil.d.ts

@@ -0,0 +1,3 @@
+import { Language } from '../types/Lang.ts';
+export declare const Languages: Language[];
+export declare const InLanguages: Language[];

package/dist/utils/NavUtil.d.ts

@@ -0,0 +1 @@
+export declare const isActive: (route_path: string, links: string[]) => boolean;

package/dist/utils/StringUtil.d.ts

@@ -2,3 +2,7 @@ export declare const formatFullName: (obj: {
     name: string;
     surname: string | null;
 }) => string;
+export declare const formatInitials: (obj: {
+    name: string;
+    surname: string | null;
+}) => string;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "alytus-ff",
   "private": false,
-  "version": "0.1.25",
+  "version": "0.1.26",
   "type": "module",
   "files": [
     "dist",

package/src/components/Nav/UserMenu.vue

@@ -0,0 +1,161 @@
+<template>
+    <v-menu v-model="isOpen" :close-on-content-click="false">
+        <template v-slot:activator="{ props }">
+            <v-btn v-bind="props" class="ff-user-btn">
+                <UserAvatar :size="32" :user="currentUser" :base-url="baseUrl + '/avatars'" />
+                <div class="ff-user-btn-text">
+                    <div class="name">{{ userName }}</div>
+                    <div v-if="currentAccount" class="comp">{{ formatFullName(currentAccount) }}</div>
+                </div>
+            </v-btn>
+        </template>
+
+        <v-card class="ff-user-manu-card">
+            <v-card-text class="pa-0">
+                <v-list>
+                    <v-list-subheader>{{ texts['Logged in as'] }}:</v-list-subheader>
+                    <v-list-item :title="userName" :subtitle="currentUser?.email ?? ''">
+                        <template v-slot:prepend>
+                            <UserAvatar :size="32" :user="currentUser" :base-url="baseUrl + '/avatars'" />
+                        </template>
+                    </v-list-item>
+                    <v-list-subheader>{{ texts['Choose active company'] }}:</v-list-subheader>
+                    <v-list-item v-for="account in accounts" :key="account.id" @click="selectAccount(account)">
+                        <template v-slot:prepend>
+                            <AccountAvatar :item="account" />
+                        </template>
+                        <v-list-item-title>{{ formatFullName(account) }}</v-list-item-title>
+                        <template v-slot:append>
+                            <v-icon :color="account.id === (currentAccount?.id ?? 0) ? 'primary' : 'white'" :icon="mdiCheck()" />
+                        </template>
+                    </v-list-item>
+                    <v-list-subheader>{{ texts['Actions'] }}:</v-list-subheader>
+                    <v-list-item v-if="langs.length > 1" :append-icon="mdiMenuDown()" @click="langMenu = true">
+                        <template v-slot:prepend>
+                            <div class="as-avatar">
+                                <img :src="currentLang.icon" height="15" width="20" alt="" />
+                            </div>
+                        </template>
+                        <v-list-item-title>
+                            <v-menu v-model="langMenu" :close-on-content-click="false">
+                                <template v-slot:activator="{props}">
+                                    <span v-bind="props">{{currentLang.title}}</span>
+                                </template>
+                                <v-list>
+                                    <v-list-item v-for="lang in langs" :key="lang.value" :title="lang.title" @click="switchLang(lang)">
+                                        <template v-slot:prepend>
+                                            <img :src="lang.icon" height="18" width="24" alt="" class="mr-4" />
+                                        </template>
+                                    </v-list-item>
+                                </v-list>
+                            </v-menu>
+                        </v-list-item-title>
+                    </v-list-item>
+                    <v-list-item :title="texts['Profile settings']" @click="openProfile">
+                        <template v-slot:prepend>
+                            <div class="as-avatar">
+                                <v-icon :icon="mdiAccount()" />
+                            </div>
+                        </template>
+                    </v-list-item>
+                    <v-list-item :title="texts['Log out']" @click="logOut">
+                        <template v-slot:prepend>
+                            <div class="as-avatar">
+                                <v-icon :icon="mdiLogout()" />
+                            </div>
+                        </template>
+                    </v-list-item>
+                </v-list>
+            </v-card-text>
+        </v-card>
+    </v-menu>
+</template>
+
+<script lang="ts">
+import {computed, defineComponent, PropType, ref} from "vue"
+import UserAvatar from "../Avatar/UserAvatar.vue"
+import AccountAvatar from "../Avatar/AccountAvatar.vue"
+import {formatFullName} from "../../utils/StringUtil.ts";
+import {IUser} from "../../types/User.ts";
+import {IAccount} from "../../types/Account.ts";
+import {LanguageAndFlag} from "../../types/Lang.ts";
+import {mdiAccount, mdiCheck, mdiLogout, mdiMenuDown} from "@mdi/js";
+
+export default defineComponent({
+    name: "UserMenu",
+    components: {AccountAvatar, UserAvatar},
+    methods: {
+        mdiLogout() {
+            return mdiLogout
+        },
+        mdiAccount() {
+            return mdiAccount
+        },
+        mdiMenuDown() {
+            return mdiMenuDown
+        },
+        mdiCheck() {
+            return mdiCheck
+        },
+        formatFullName
+    },
+    props: {
+        currentUser: {
+            type: Object as PropType<IUser>,
+            required: true
+        },
+        currentAccount: {
+            type: Object as PropType<IAccount>,
+            default: null
+        },
+        currentLang: {
+            type: Object as PropType<LanguageAndFlag>,
+            required: true
+        },
+        accounts: {
+            type: Array as PropType<IAccount[]>,
+            required: true
+        },
+        langs: {
+            type: Array as PropType<LanguageAndFlag[]>,
+            required: true
+        },
+        baseUrl: {
+            type: String,
+            required: true
+        },
+        texts: {
+            type: Object as PropType<{ [key: string]: string }>,
+            required: true
+        }
+    },
+    emits: [
+      "open-profile",
+      "select-account",
+      "switch-lang",
+      "log-out"
+    ],
+    setup(props, {emit}) {
+        const isOpen = ref(false)
+        const langMenu = ref(false)
+
+        const userName = computed(() => props.currentUser != null ? formatFullName(props.currentUser) : '-')
+
+        const selectAccount = (account: IAccount) => {
+            emit("select-account", account)
+        }
+        const openProfile = () => {
+            emit("open-profile")
+            isOpen.value = false
+        }
+        const switchLang = (lang: LanguageAndFlag) => {
+            emit("switch-lang", lang)
+        }
+        const logOut = () => {
+            emit("log-out")
+        }
+
+        return {isOpen, userName, langMenu, selectAccount, openProfile, switchLang, logOut}
+    }
+})
+</script>