@vc-shell/framework 1.0.130 → 1.0.132

package/shared/modules/dynamic/components/fields/SelectField.ts

@@ -30,14 +30,17 @@ export default {
 
         slots:
           props.element.customTemplate &&
-          ["selected-item", "option"].reduce((obj, slot) => {
-            obj[slot] = (scope: TScope) =>
-              h(resolveComponent(props.element.customTemplate?.component as string), {
-                context: scope,
-                slotName: slot,
-              });
-            return obj;
-          }, {} as Record<string, (scope: TScope) => VNode>),
+          ["selected-item", "option"].reduce(
+            (obj, slot) => {
+              obj[slot] = (scope: TScope) =>
+                h(resolveComponent(props.element.customTemplate?.component as string), {
+                  context: scope,
+                  slotName: slot,
+                });
+              return obj;
+            },
+            {} as Record<string, (scope: TScope) => VNode>,
+          ),
       });
 
       const render = h(field.component as unknown as Component, field.props, field.slots);
@@ -52,7 +55,7 @@ export default {
                 rows: props.rows,
                 key: `${String(field.props.key)}_validation`,
               },
-              () => render
+              () => render,
             )
           : null;
       } else {

package/shared/modules/dynamic/components/fields/TextareaField.ts

@@ -30,7 +30,7 @@ export default {
                 rows: props.rows,
                 key: `${String(field.props.key)}_validation`,
               },
-              () => render
+              () => render,
             )
           : null;
       } else {

package/shared/modules/dynamic/components/fields/ValidationField.ts

@@ -1,5 +1,4 @@
 import { computed, h, unref, useSlots, defineComponent, ComputedRef } from "vue";
-import { unrefNested } from "../../helpers/unrefNested";
 import { Field } from "vee-validate";
 import { reactify } from "@vueuse/core";
 
@@ -17,7 +16,7 @@ export default defineComponent({
     const fieldKey = computed(() =>
       unref(props.props)?.multilanguage
         ? `${String(props.props?.key)}_${unref(props.props?.currentLanguage)}`
-        : String(props.props?.key)
+        : String(props.props?.key),
     );
 
     const fieldNameLang = reactify((name: string) => {
@@ -33,7 +32,9 @@ export default defineComponent({
           label: props.props?.label,
           key: fieldKey.value,
           name: fieldNameLang(
-            (props.rows ?? 1) > 1 && (props.index ?? 0) >= 0 ? props.props?.name + "_" + props.index : props.props?.name
+            (props.rows ?? 1) > 1 && (props.index ?? 0) >= 0
+              ? props.props?.name + "_" + props.index
+              : props.props?.name,
           ).value,
         },
         {
@@ -44,10 +45,10 @@ export default defineComponent({
                 error: !!errors.length,
                 errorMessage,
                 key: fieldKey.value + "_control",
-              })
+              }),
             );
           },
-        }
+        },
       );
   },
 });

package/shared/modules/dynamic/components/fields/props.ts

@@ -1,4 +1,4 @@
-import { ComputedRef, MaybeRef, PropType, UnwrapNestedRefs, VNode, VNodeArrayChildren } from "vue";
+import { ComputedRef, MaybeRef, PropType, UnwrapNestedRefs, VNode } from "vue";
 import { DetailsBladeContext } from "../../factories";
 import { IControlBaseOptions, IControlBaseProps } from "../../types/models";
 import { ControlSchema } from "../../types";
@@ -6,27 +6,27 @@ import { ControlSchema } from "../../types";
 export default {
   baseProps: {
     type: Object as PropType<UnwrapNestedRefs<IControlBaseProps>>,
-    default: () => ({} as IControlBaseProps),
+    default: () => ({}) as IControlBaseProps,
   },
   baseOptions: {
     type: Object as PropType<IControlBaseOptions>,
-    default: () => ({} as IControlBaseOptions),
+    default: () => ({}) as IControlBaseOptions,
   },
   element: {
     type: Object as PropType<ControlSchema>,
-    default: () => ({} as ControlSchema),
+    default: () => ({}) as ControlSchema,
   },
   bladeContext: {
     type: Object as PropType<UnwrapNestedRefs<DetailsBladeContext>>,
-    default: () => ({} as DetailsBladeContext),
+    default: () => ({}) as DetailsBladeContext,
   },
   fields: {
     type: Object as PropType<ComputedRef<VNode[][]>>,
-    default: () => ({} as ComputedRef<VNode[][]>),
+    default: () => ({}) as ComputedRef<VNode[][]>,
   },
   formData: {
     type: Object as PropType<MaybeRef<Record<string, unknown>>>,
-    default: () => ({} as MaybeRef<Record<string, unknown>>),
+    default: () => ({}) as MaybeRef<Record<string, unknown>>,
   },
   fieldContext: {
     type: Object,

package/shared/modules/dynamic/factories/base/useDetailsFactory.ts

@@ -1,4 +1,4 @@
-import { computed, ref, watch } from "vue";
+import { ComputedRef, MaybeRef, computed, ref, watch } from "vue";
 import * as _ from "lodash-es";
 import { useForm, useIsFormDirty, useIsFormValid } from "vee-validate";
 import { useAsync, useLoading } from "../../../../../core/composables";
@@ -6,7 +6,7 @@ import type { ItemId, IValidationState, UseDetails } from "../types";
 import { createUnrefFn } from "@vueuse/core";
 
 export interface UseDetailsFactoryParams<Item> {
-  load: (args?: ItemId) => Promise<Item>;
+  load: (args?: ItemId) => Promise<Item | undefined>;
   saveChanges: (details: Item) => Promise<Item | void>;
   remove?: (args: ItemId) => Promise<void>;
 }
@@ -25,7 +25,7 @@ export const useDetailsFactory = <Item>(factoryParams: UseDetailsFactoryParams<I
 
     const { loading: itemLoading, action: load } = useAsync<ItemId>(async (args?: ItemId) => {
       item.value = await factoryParams.load(args);
-      resetModified(item.value);
+      item.value && resetModified(item.value);
     });
 
     const { loading: manageLoading, action: saveChanges } = useAsync<Item>(async (item) => {
@@ -72,7 +72,7 @@ export const useDetailsFactory = <Item>(factoryParams: UseDetailsFactoryParams<I
       }
 
       itemTemp.value = _.cloneDeep(data);
-    });
+    }) as (data: MaybeRef<Item | undefined> | ComputedRef<Item | undefined>, updateInitial?: MaybeRef<boolean>) => void;
 
     return {
       load,

package/shared/modules/dynamic/factories/base/useListFactory.ts

@@ -26,7 +26,7 @@ export interface IUseListOptions extends Pick<IQuery, "sort"> {
 }
 
 export const useListFactory = <Items extends Record<string, any>[], Query extends IQuery>(
-  factoryParams: UseListFactoryParams<Items, Query>
+  factoryParams: UseListFactoryParams<Items, Query>,
 ) => {
   return function useList(options?: IUseListOptions): UseList<Items, Query> {
     const pageSize = options?.pageSize || 20;

package/shared/modules/dynamic/factories/types/index.ts

@@ -26,7 +26,10 @@ export interface IValidationState<Item> {
   setFieldValue: FormContext["setFieldValue"];
   setValues: FormContext["setValues"];
   setErrors: FormContext["setErrors"];
-  resetModified: (data: MaybeRef<Item>, updateInitial?: MaybeRef<boolean>) => void;
+  resetModified: (
+    data: MaybeRef<Item | undefined> | ComputedRef<Item | undefined>,
+    updateInitial?: MaybeRef<boolean>,
+  ) => void;
   validate: FormContext["validate"];
 }
 
@@ -85,7 +88,7 @@ export interface DetailsBaseBladeScope extends BaseBladeScope {
       property: Record<string, any>,
       keyword?: string,
       locale?: string,
-    ) => Promise<Record<string, any>[]>;
+    ) => Promise<Record<string, any>[] | undefined>;
     getPropertyValue: (property: Record<string, any>, locale: string) => any;
     setPropertyValue: (data: {
       property: Record<string, any>;

package/shared/modules/dynamic/helpers/getters.ts

@@ -1,7 +1,7 @@
 import { reactify } from "@vueuse/core";
-import { toValue } from "vue";
 import * as _ from "lodash-es";
 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 export const getModel = reactify((property: string, context: Record<string, any>) => {
   if (property && context) {
     return _.get(context, property);

package/shared/modules/dynamic/helpers/nodeBuilder.ts

@@ -1,4 +1,4 @@
-import { unref, computed, toValue, h, UnwrapNestedRefs, MaybeRef, reactive, VNode, ref } from "vue";
+import { unref, computed, toValue, h, UnwrapNestedRefs, MaybeRef, reactive, VNode } from "vue";
 import FIELD_MAP from "../components/FIELD_MAP";
 import { ControlSchema } from "../types";
 import { IControlBaseProps, IControlBaseOptions } from "../types/models";
@@ -6,12 +6,11 @@ import { getModel } from "./getters";
 import { setModel } from "./setters";
 import { unwrapInterpolation } from "./unwrapInterpolation";
 import { DetailsBladeContext } from "../factories";
-import * as _ from "lodash-es";
 import { safeIn } from "./safeIn";
 
 function disabledHandler(
   disabled: { method?: string } | boolean,
-  context: UnwrapNestedRefs<DetailsBladeContext>
+  context: UnwrapNestedRefs<DetailsBladeContext>,
 ): boolean {
   if (!disabled) return false;
   if (typeof disabled === "boolean") return disabled;
@@ -24,7 +23,7 @@ function disabledHandler(
 function nodeBuilder<
   Context extends Record<string, unknown>,
   BContext extends UnwrapNestedRefs<DetailsBladeContext>,
-  FormData
+  FormData,
 >({
   controlSchema,
   parentId,
@@ -116,7 +115,7 @@ function nodeBuilder<
     visibility: computed(() =>
       safeIn("visibility", controlSchema) && controlSchema.visibility?.method
         ? bladeContext.scope?.[controlSchema.visibility?.method]
-        : true
+        : true,
     ),
   });
 
@@ -142,8 +141,8 @@ function nodeBuilder<
             bladeContext,
             currentLocale,
             formData,
-          })
-        )
+          }),
+        ),
       );
     }
 
@@ -156,7 +155,7 @@ function nodeBuilder<
           bladeContext,
           currentLocale,
           formData,
-        })
+        }),
       ),
     ];
   });

package/shared/modules/dynamic/helpers/override.ts

@@ -29,7 +29,7 @@ const upsertHelper = (overrides: OverridesSchema, schemaCopy: { [key: string]: D
           if (Array.isArray(valueByPath) && valueByPath.length && typeof args.value === "object" && "index" in args) {
             const findIndex = _.findIndex(valueByPath, { id: args.value.id });
 
-            const spliced = valueByPath /* @ts-ignore */
+            const spliced = valueByPath /* @ts-expect-error  - toSpliced is not parsed correctly by ts */
               .toSpliced(findIndex >= 0 ? findIndex : args.index, findIndex >= 0 ? 1 : 0, args.value);
             _.set(clonedSchema, args.path, spliced);
           } else {

package/shared/modules/dynamic/helpers/toolbarReducer.ts

@@ -38,6 +38,6 @@ export const toolbarReducer = (args: {
       }
 
       return acc;
-    }, [] as IBladeToolbar[])
+    }, [] as IBladeToolbar[]),
   );
 };

package/shared/modules/dynamic/index.ts

@@ -8,7 +8,6 @@ import { reactiveComputed } from "@vueuse/core";
 import { kebabToPascal } from "../../../core/utilities";
 import { BladeInstanceConstructor } from "../../index";
 import { createAppModule } from "../../../core/plugins";
-import { BladeMenu } from "../../../core/types";
 import { ComponentProps } from "./../../utilities/vueUtils";
 
 interface Registered {
@@ -70,6 +69,7 @@ const register = (
 
   const BladeInstanceConstructor = defineComponent({
     ...bladeComponent,
+    name: bladeName,
     isWorkspace: "isWorkspace" in json.settings && json.settings.isWorkspace,
     menuItem: ("menuItem" in json.settings && json.settings.menuItem) ?? undefined,
     setup: (props: ComponentProps<typeof bladeComponent>, ctx) =>
@@ -104,7 +104,7 @@ const register = (
 };
 
 const handleError = (errorKey: string, schema: { [key: string]: DynamicSchema }, text?: string) => {
-  console.error(
+  return console.error(
     `Module initialization aborted. '${errorKey}' key not found in files: ${Object.keys(schema).join(
       ", ",
     )}. '${errorKey}' key ${text}`,
@@ -130,42 +130,38 @@ export const createDynamicAppModule = (args: {
       "must be included in one of this files to initialize module workspace blade",
     );
 
-  if (moduleInitializer && everyHasTemplate) {
-    let schemaCopy = _.cloneDeep({ ...args.schema });
-
-    if (args.overrides) {
-      schemaCopy = handleOverrides(args.overrides, schemaCopy);
-    }
-
-    return {
-      install(app: App, options: { router: any }) {
-        const bladePages = { ...pages };
-        const appModuleContent = {
-          locales: args?.locales,
-          notificationTemplates: args?.notificationTemplates,
-          moduleComponents: args?.moduleComponents,
-        };
-        Object.entries(schemaCopy).forEach(([, JsonSchema], index) => {
-          const blade = register(
-            {
-              app,
-              component: bladePages[
-                JsonSchema.settings.component as keyof typeof bladePages
-              ] as BladeInstanceConstructor,
-              composables: { ...args.composables },
-              json: JsonSchema,
-              options,
-            },
-            index === 0 ? appModuleContent : undefined,
-          );
-
-          if (!blade) {
-            return;
-          }
-        });
-      },
-    };
+  let schemaCopy = _.cloneDeep({ ...args.schema });
+
+  if (args.overrides) {
+    schemaCopy = handleOverrides(args.overrides, schemaCopy);
   }
+
+  return {
+    install(app: App, options: { router: any }) {
+      const bladePages = { ...pages };
+      const appModuleContent = {
+        locales: args?.locales,
+        notificationTemplates: args?.notificationTemplates,
+        moduleComponents: args?.moduleComponents,
+      };
+      Object.entries(schemaCopy).forEach(([, JsonSchema], index) => {
+        const blade = register(
+          {
+            app,
+            component: bladePages[JsonSchema.settings.component as keyof typeof bladePages] as BladeInstanceConstructor,
+            composables: { ...args.composables },
+            json: JsonSchema,
+            options,
+          },
+          index === 0 ? appModuleContent : undefined,
+        );
+
+        if (!blade) {
+          return;
+        }
+      });
+    },
+  };
 };
 
 export * from "./pages";

package/shared/modules/dynamic/pages/dynamic-blade-form.vue

@@ -278,7 +278,7 @@ onBeforeMount(async () => {
   if (props.composables) await init();
 });
 
-onBeforeRouteLeave(async (to, from) => {
+onBeforeRouteLeave(async (to) => {
   if (
     currentBladeNavigationData.value?.fullPath &&
     !to.path.includes(currentBladeNavigationData.value?.fullPath) &&

package/shared/modules/dynamic/pages/dynamic-blade-list.vue

@@ -135,7 +135,6 @@ import {
   Ref,
   computed,
   inject,
-  onMounted,
   reactive,
   ref,
   resolveComponent,

package/shared/modules/dynamic/types/models.ts

@@ -1,5 +1,5 @@
-import { ComputedRef, Raw, Component } from "vue";
 /* eslint-disable @typescript-eslint/no-explicit-any */
+import { ComputedRef, Raw } from "vue";
 import {
   VcButton,
   VcCard,

package/shared/pages/LoginPage/components/login/Login.vue

@@ -205,7 +205,7 @@ let useLogin;
 const signInResult = ref({ succeeded: true }) as Ref<SignInResult & { status?: number; error?: any }>;
 const requestPassResult = ref<RequestPasswordResult>({ succeeded: true });
 const forgotPasswordRequestSent = ref(false);
-const { signIn, loading, externalSignIn, getExternalLoginProviders, isAuthenticated } = useUser();
+const { signIn, loading, externalSignIn, getExternalLoginProviders } = useUser();
 const isLogin = ref(true);
 const isValid = useIsFormValid();
 const isDirty = useIsFormDirty();

package/ui/components/atoms/vc-label/vc-label.vue

@@ -49,8 +49,8 @@ withDefaults(defineProps<Props>(), {
 });
 
 defineSlots<{
-  default: (props: any) => any;
-  tooltip?: (props: any) => any;
+  default: void;
+  tooltip?: void;
 }>();
 
 const tooltipVisible = ref(false);

package/ui/components/atoms/vc-progress/vc-progress.vue

@@ -36,18 +36,22 @@ withDefaults(defineProps<Props>(), {
 
 @keyframes change {
   from {
-    background-position: 0 0, left;
+    background-position:
+      0 0,
+      left;
   }
   to {
-    background-position: 30px 0, left;
+    background-position:
+      30px 0,
+      left;
   }
 }
 
 .vc-progress {
   &.striped {
     .vc-progress__value {
-      background: linear-gradient(45deg, transparent 50%, #acd2f2 50%, #acd2f2 75%, transparent 75%) left/30px 30px
-          repeat-x,
+      background:
+        linear-gradient(45deg, transparent 50%, #acd2f2 50%, #acd2f2 75%, transparent 75%) left/30px 30px repeat-x,
         #e1f0fe;
       animation: change 1s linear infinite;
     }

package/ui/components/molecules/vc-editor/vc-editor.vue

@@ -52,7 +52,6 @@
 <script lang="ts" setup>
 import { QuillEditor } from "@vueup/vue-quill";
 import "@vueup/vue-quill/dist/vue-quill.snow.css";
-import { useUser } from "./../../../../core/composables";
 import { ref, unref, watch, onMounted } from "vue";
 import ImageUploader from "quill-image-uploader";
 import { VcLabel, VcHint } from "./../../";

package/ui/components/molecules/vc-file-upload/vc-file-upload.vue

@@ -90,7 +90,7 @@ const isDragging = ref(false);
 // Prepare field-level validation
 const { errorMessage, handleChange, validate } = useField(
   `${props.name === "Gallery" ? instance?.uid : props.name}`,
-  internalRules
+  internalRules,
 );
 
 const uploader = ref();

package/ui/components/molecules/vc-input/vc-input.vue

@@ -170,7 +170,7 @@
 </template>
 <!-- eslint-disable @typescript-eslint/no-explicit-any -->
 <script lang="ts" setup>
-import { computed, ref, unref, watch, MaybeRef } from "vue";
+import { computed, ref, unref, watch } from "vue";
 import { VcLabel, VcIcon, VcHint } from "./../../";
 import moment from "moment";
 
@@ -358,7 +358,7 @@ watch(
       temp.value = mutatedModel.value;
     }
   },
-  { immediate: true }
+  { immediate: true },
 );
 
 // Handle input event and emit changes
@@ -444,7 +444,9 @@ function onReset() {
   &__input {
     &:-webkit-autofill,
     &:-webkit-autofill:focus {
-      transition: background-color 600000s 0s, color 600000s 0s;
+      transition:
+        background-color 600000s 0s,
+        color 600000s 0s;
     }
     &[data-autocompleted] {
       background-color: transparent !important;

package/ui/components/molecules/vc-input-currency/vc-input-currency.stories.ts

@@ -1,6 +1,5 @@
 import type { Meta, StoryObj } from "@storybook/vue3";
 import { VcInputCurrency } from "./";
-import { VcSelect, VcInput } from "./../../";
 import { ref } from "vue";
 
 const meta: Meta<typeof VcInputCurrency> = {

package/ui/components/molecules/vc-input-currency/vc-input-currency.vue

@@ -175,7 +175,7 @@ const { inputRef, setOptions, numberValue } = useCurrencyInput(
     currencyDisplay: CurrencyDisplay.hidden,
     hideGroupingSeparatorOnFocus: false,
   },
-  false
+  false,
 );
 
 // Change currency settings
@@ -189,7 +189,7 @@ watch(
         currencyDisplay: CurrencyDisplay.hidden,
         hideGroupingSeparatorOnFocus: false,
       });
-  }
+  },
 );
 
 watch(numberValue, (value) => {

package/ui/components/molecules/vc-multivalue/vc-multivalue.vue

@@ -118,7 +118,7 @@
   </div>
 </template>
 <!-- eslint-disable @typescript-eslint/no-explicit-any -->
-<script lang="ts" setup generic="T extends {id?: string; alias?: string, languageCode?: string, value?: string}">
+<script lang="ts" setup generic="T extends { id?: string; alias?: string; languageCode?: string; value?: string }">
 import { unref, nextTick, ref, computed } from "vue";
 import { vOnClickOutside } from "@vueuse/components";
 import { useFloating, UseFloatingReturn, offset, flip, shift, autoUpdate, MiddlewareState } from "@floating-ui/vue";

package/ui/components/molecules/vc-select/vc-select.vue

@@ -257,7 +257,7 @@
 </template>
 
 <!-- eslint-disable @typescript-eslint/no-explicit-any -->
-<script lang="ts" setup generic="T, P extends { results?: T[] | any; totalCount?: number }">
+<script lang="ts" setup generic="T, P extends { results?: T[]; totalCount?: number }">
 import { ref, computed, watch, nextTick, Ref, toRefs } from "vue";
 import { vOnClickOutside } from "@vueuse/components";
 import * as _ from "lodash-es";
@@ -278,8 +278,8 @@ type FloatingInstanceType = UseFloatingReturn & {
     };
   };
 };
-
-type Option = T & P["results"][number];
+type ArrayElementType<T> = T extends Array<infer U> ? U : never;
+type Option = T & ArrayElementType<Required<P>["results"]>;
 
 defineSlots<{
   /**
@@ -484,11 +484,7 @@ const emit = defineEmits<{
    * Emitted when the component needs to change the model; Is also used by v-model
    */
 
-  "update:modelValue": [
-    inputValue: MaybeArray<
-      string | Option | (T & P["results"][number] & object)[keyof T | keyof P["results"][number]]
-    > | null,
-  ];
+  "update:modelValue": [inputValue: MaybeArray<string | Option> | null];
   /**
    * Emitted when user wants to filter a value
    */
@@ -572,12 +568,16 @@ watch(
           );
 
           if (typeof data === "object" && !Array.isArray(data) && "results" in data) {
-            defaultValue.value = data.results?.filter((x: any) => x[props.optionValue as keyof T] === props.modelValue);
+            defaultValue.value = data.results?.filter(
+              (x) => x[props.optionValue as keyof T] === props.modelValue,
+            ) as Option[];
           } else if (Array.isArray(data)) {
             defaultValue.value = data?.filter((x) => x[props.optionValue as keyof T] === props.modelValue);
           }
         } else if (props.options && Array.isArray(props.options)) {
-          defaultValue.value = props.options.filter((x) => x[props.optionValue as keyof T] === props.modelValue);
+          defaultValue.value = props.options.filter(
+            (x) => x[props.optionValue as keyof T] === props.modelValue,
+          ) as Option[];
         }
       }
     }
@@ -592,13 +592,13 @@ watch(
       try {
         listLoading.value = true;
         const data = await props.options();
-        optionsList.value = data.results;
+        optionsList.value = data.results as Option[];
         totalItems.value = data.totalCount;
       } finally {
         listLoading.value = false;
       }
     } else if (props.options && Array.isArray(props.options)) {
-      optionsList.value = props.options;
+      optionsList.value = props.options as Option[];
     }
   },
   { immediate: true },
@@ -626,7 +626,7 @@ async function onLoadMore() {
     try {
       listLoading.value = true;
       const data = await props.options(filterString.value, optionsList.value.length);
-      optionsList.value.push(...data.results);
+      optionsList.value.push(...(data.results as Option[]));
     } finally {
       listLoading.value = false;
     }
@@ -820,7 +820,7 @@ function toggleOption(opt: Option) {
     return;
   }
 
-  const optValue = getOptionValue.value(opt);
+  const optValue = getOptionValue.value(opt) as Option[];
 
   if (props.multiple !== true) {
     if (innerValue.value.length === 0 || _.isEqual(getOptionValue.value(innerValue.value[0]), optValue) !== true) {
@@ -832,7 +832,7 @@ function toggleOption(opt: Option) {
 
   if (innerValue.value.length === 0) {
     const val = props.emitValue === true ? optValue : opt;
-    emit("update:modelValue", props.multiple === true ? [val] : val);
+    emit("update:modelValue", props.multiple === true ? ([val] as Option[]) : (val as Option));
     return;
   }
 

package/ui/components/molecules/vc-textarea/vc-textarea.vue

@@ -84,7 +84,7 @@ watch(
   () => props.modelValue,
   (value) => {
     emit("update:modelValue", value);
-  }
+  },
 );
 
 // Handle input event to propertly validate value and emit changes

package/ui/components/organisms/vc-app/_internal/vc-app-bar/vc-app-bar.vue

@@ -73,7 +73,7 @@ import { useBladeNavigation } from "./../../../../../../shared";
 import { ref, watch, nextTick } from "vue";
 
 export interface Props {
-  logo: string;
+  logo?: string;
   title?: string;
 }