@vc-shell/framework 1.0.69 → 1.0.71

package/shared/components/user-dropdown-button/user-dropdown-button.vue

@@ -0,0 +1,124 @@
+<template>
+  <div
+    v-on-click-outside="onClose"
+    class="user-dropdown-button"
+    :class="{
+      'user-dropdown-button_active': accountMenuVisible,
+      'user-dropdown-button_no-pointer': $isMobile.value,
+    }"
+    @click.stop="toggleAccountMenuVisible"
+  >
+    <div
+      class="user-dropdown-button__avatar"
+      :style="{ 'background-image': `url(${avatar})` }"
+    ></div>
+    <div class="tw-grow tw-basis-0 tw-ml-3 tw-overflow-hidden">
+      <div class="user-dropdown-button__name tw-truncate">
+        {{ name }}
+      </div>
+      <div class="user-dropdown-button__role">
+        {{ role }}
+      </div>
+    </div>
+    <div
+      v-if="menuItems && menuItems.length"
+      class="user-dropdown-button__chevron"
+    >
+      <VcIcon
+        icon="fas fa-chevron-down"
+        size="xl"
+      ></VcIcon>
+    </div>
+    <div
+      v-if="menuItems && accountMenuVisible"
+      class="user-dropdown-button__menu"
+      @click.stop="accountMenuVisible = false"
+    >
+      <div
+        v-for="(item, i) in menuItems"
+        :key="`menu_item_${i}`"
+        class="user-dropdown-button__menu-item"
+        @click="item.hasOwnProperty('clickHandler') ? item.clickHandler() : null"
+      >
+        {{ item.title }}
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { ref } from "vue";
+import { vOnClickOutside } from "@vueuse/components";
+import { BladeMenu } from "./../../../core/types";
+
+export interface Props {
+  avatar: string;
+  name: string;
+  role: string;
+  menuItems?: BladeMenu[];
+}
+const props = withDefaults(defineProps<Props>(), {
+  menuItems: () => [],
+});
+
+const accountMenuVisible = ref(false);
+
+const toggleAccountMenuVisible = () => {
+  if (props.menuItems && props.menuItems.length) {
+    accountMenuVisible.value = !accountMenuVisible.value;
+  }
+};
+
+const onClose = () => {
+  accountMenuVisible.value = false;
+};
+</script>
+
+<style lang="scss">
+.user-dropdown-button {
+  @apply tw-w-[240px] tw-border-l tw-border-solid tw-border-l-[color:var(--app-bar-divider-color)] tw-px-4 tw-cursor-pointer
+    tw-relative tw-flex tw-justify-between tw-items-center tw-h-full;
+
+  &_no-pointer {
+    @apply tw-cursor-default;
+  }
+
+  &:hover,
+  &_active {
+    @apply tw-bg-[color:var(--app-bar-toolbar-icon-background-hover)];
+  }
+
+  &__avatar {
+    @apply tw-rounded-full tw-overflow-hidden tw-w-[34px] tw-h-[34px] tw-bg-[color:var(--app-bar-account-info-role-color)]
+      tw-bg-cover tw-bg-center tw-shrink-0;
+  }
+
+  &__name {
+    @apply tw-text-base tw-text-[color:var(--app-bar-account-info-name-color)];
+  }
+
+  &__role {
+    @apply tw-text-base tw-text-[color:var(--app-bar-account-info-role-color)];
+  }
+
+  &__chevron {
+    @apply tw-text-[#7e8e9d] [transition:transform_0.2s_ease] [transition:color_0.2s_ease];
+  }
+
+  &:hover &__chevron {
+    @apply tw-text-[color:#34414f];
+  }
+
+  &_active &__chevron {
+    @apply -tw-scale-y-100;
+  }
+
+  &__menu {
+    @apply tw-absolute -tw-left-px tw-right-0 tw-top-[var(--app-bar-height)] tw-bg-white tw-z-[10000] tw-shadow-[0_-6px_6px_white,1px_1px_22px_rgba(126,142,157,0.2)];
+
+    &-item {
+      @apply tw-p-3 tw-text-lg tw-text-black tw-border-l tw-border-solid tw-border-l-[#eef0f2] tw-border-b tw-border-b-[#eef0f2] tw-bg-white hover:tw-bg-[#eff7fc];
+    }
+  }
+}
+</style>

package/shared/index.ts

@@ -3,22 +3,28 @@ import { AssetsDetailsModule } from "./modules/assets";
 import { VcAppSwitcherComponent } from "./components/app-switcher";
 import { VcBladeNavigationComponent } from "./components/blade-navigation";
 import { AssetsManagerModule } from "./modules/assets-manager";
-import { VcNotificationComponent } from "./components/notifications";
+import { VcPopupHandler } from "./components/popup-handler";
+import * as locales from "./locales";
+import { i18n } from "./../core/plugins";
 
 export const SharedModule = {
   install(app: App): void {
+    // Load locales
+    if (locales) {
+      Object.entries(locales).forEach(([key, message]) => {
+        i18n.global.mergeLocaleMessage(key, message);
+      });
+    }
+
     app
       .use(AssetsDetailsModule)
       .use(AssetsManagerModule)
       .use(VcBladeNavigationComponent)
       .use(VcAppSwitcherComponent)
-      .use(VcNotificationComponent);
+      .use(VcPopupHandler);
   },
 };
 
-export * from "./modules/assets";
-export * from "./modules/assets-manager";
-
-export * from "./components/app-switcher";
-export * from "./components/blade-navigation";
-export * from "./components/notifications";
+export * from "./modules";
+export * from "./components";
+export * from "./pages";

package/shared/locales/en.json

@@ -0,0 +1,35 @@
+{
+  "COMPONENTS": {
+    "CHANGE_PASSWORD": {
+      "TITLE": "Change password",
+      "CURRENT_PASSWORD": {
+        "LABEL": "Current password",
+        "PLACEHOLDER": "Enter password"
+      },
+      "NEW_PASSWORD": {
+        "LABEL": "New password",
+        "PLACEHOLDER": "Enter password"
+      },
+      "CONFIRM_PASSWORD": {
+        "LABEL": "Confirm password",
+        "PLACEHOLDER": "Confirm password"
+      },
+      "CANCEL": "Cancel",
+      "SAVE": "Update",
+      "ERRORS": {
+        "Repeat-password": "Passwords are not same",
+        "Equal-passwords": "The new password must not match the old one",
+        "Invalid-token": "Token is invalid or expired",
+        "Password-too-weak": "New password does not comply one or more password security policies:",
+        "PasswordTooShort": "Passwords too short",
+        "PasswordRequiresUniqueChars": "Passwords must use different characters",
+        "PasswordRequiresLower": "Passwords must have at least one lowercase ('a'-'z')",
+        "PasswordRequiresUpper": "Passwords must have at least one uppercase ('A'-'Z')",
+        "PasswordRequiresDigit": "Passwords must have at least one digit ('0'-'9')",
+        "PasswordRequiresNonAlphanumeric": "Passwords must have at least one non alphanumeric character",
+        "Incorrect password.": "You entered an incorrect password",
+        "You have used this password in the past. Choose another one.": "You have used this password in the past. Choose another one."
+      }
+    }
+  }
+}

package/shared/locales/index.ts

@@ -0,0 +1,2 @@
+import * as en from "./en.json";
+export { en };

package/shared/modules/assets/components/assets-details/assets-details.vue

@@ -4,17 +4,11 @@
     :subtitle="$t('ASSETS.PAGES.DETAILS.SUBTITLE')"
     :expanded="expanded"
     :closable="closable"
-    :toolbarItems="bladeToolbar"
+    :toolbar-items="bladeToolbar"
     @close="$emit('close:blade')"
     @expand="$emit('expand:blade')"
     @collapse="$emit('collapse:blade')"
   >
-    <template
-      v-slot:error
-      v-if="$slots['error']"
-    >
-      <slot name="error"></slot>
-    </template>
     <!-- Blade contents -->
     <div class="tw-flex tw-grow-1 tw-border-t tw-border-solid tw-border-t-[#eaedf3]">
       <div class="assets-details__content tw-grow tw-basis-0 tw-w-full">
@@ -62,9 +56,9 @@
                           icon="far fa-copy"
                           size="m"
                           class="tw-ml-2"
-                          variant="onlytext"
-                          @click="copyLink(defaultAsset.url)"
+                          text
                           title="Copy link"
+                          @click="copyLink(defaultAsset.url)"
                         ></VcButton>
                       </div>
                     </VcCol>
@@ -73,39 +67,39 @@
               </VcRow>
 
               <Field
+                v-slot="{ errorMessage, handleChange, errors }"
                 :label="$t('ASSETS.PAGES.DETAILS.FIELDS.NAME.TITLE')"
                 name="asset_name"
                 rules="required"
-                :modelValue="defaultAsset.name"
-                v-slot="{ errorMessage, handleChange, errors }"
+                :model-value="defaultAsset.name"
               >
                 <VcInput
+                  v-model="assetNameClean"
                   class="tw-mb-4"
                   :label="$t('ASSETS.PAGES.DETAILS.FIELDS.NAME.TITLE')"
-                  v-model="assetNameClean"
-                  @update:modelValue="handleChange"
                   clearable
                   required
                   :error="!!errors.length"
                   :error-message="errorMessage"
                   :placeholder="$t('ASSETS.PAGES.DETAILS.FIELDS.NAME.PLACEHOLDER')"
                   :disabled="readonly"
+                  @update:model-value="handleChange"
                 ></VcInput>
               </Field>
               <VcInput
+                v-if="assetType === 'Image'"
+                v-model="defaultAsset.altText"
                 class="tw-mb-4"
                 :label="$t('ASSETS.PAGES.DETAILS.FIELDS.ALT.TITLE')"
-                v-model="defaultAsset.altText"
                 clearable
                 :placeholder="$t('ASSETS.PAGES.DETAILS.FIELDS.ALT.PLACEHOLDER')"
                 :tooltip="$t('ASSETS.PAGES.DETAILS.FIELDS.ALT.TOOLTIP')"
-                v-if="assetType === 'Image'"
                 :disabled="readonly"
               ></VcInput>
               <VcTextarea
+                v-model="defaultAsset.description"
                 class="tw-mb-4"
                 :label="$t('ASSETS.PAGES.DETAILS.FIELDS.DESCRIPTION.TITLE')"
-                v-model="defaultAsset.description"
                 :placeholder="$t('ASSETS.PAGES.DETAILS.FIELDS.DESCRIPTION.PLACEHOLDER')"
                 :disabled="readonly"
               ></VcTextarea>
@@ -139,6 +133,8 @@ export interface Props {
 
 export interface Emits {
   (event: "close:blade"): void;
+  (event: "expand:blade"): void;
+  (event: "collapse:blade"): void;
 }
 
 const props = withDefaults(defineProps<Props>(), {

package/shared/modules/assets-manager/components/assets-manager/assets-manager.vue

@@ -3,18 +3,12 @@
     :title="$t('ASSETS_MANAGER.TITLE')"
     :expanded="expanded"
     :closable="closable"
-    :toolbarItems="bladeToolbar"
-    @close="$emit('close:blade')"
+    :toolbar-items="bladeToolbar"
     width="70%"
+    @close="$emit('close:blade')"
     @expand="$emit('expand:blade')"
     @collapse="$emit('collapse:blade')"
   >
-    <template
-      v-slot:error
-      v-if="$slots['error']"
-    >
-      <slot name="error"></slot>
-    </template>
     <div
       class="tw-relative tw-h-full"
       @dragover.prevent.stop="dragOver"
@@ -25,20 +19,20 @@
       <VcTable
         :columns="columns"
         :expanded="expanded"
-        stateKey="assets_manager"
-        :reorderableRows="!readonly"
+        state-key="assets_manager"
+        :reorderable-rows="!readonly"
         :items="defaultAssets"
         :header="false"
         :footer="false"
-        :itemActionBuilder="!readonly && actionBuilder"
+        :item-action-builder="!readonly && actionBuilder"
         :multiselect="!readonly"
         class="tw-h-full tw-w-full"
         @item-click="onItemClick"
         @row:reorder="sortAssets"
-        @selectionChanged="onSelectionChanged"
+        @selection-changed="onSelectionChanged"
       >
         <!-- Empty template -->
-        <template v-slot:empty>
+        <template #empty>
           <div class="tw-w-full tw-h-full tw-box-border tw-flex tw-flex-col tw-items-center tw-justify-center">
             <VcIcon
               icon="fas fa-cloud-upload-alt"
@@ -52,14 +46,14 @@
         </template>
 
         <!-- Override size column -->
-        <template v-slot:item_size="{ item }">
+        <template #item_size="{ item }">
           <div>
             {{ readableSize(item.size) }}
           </div>
         </template>
 
         <!-- Override url column -->
-        <template v-slot:item_url="{ item }">
+        <template #item_url="{ item }">
           <div class="tw-flex tw-items-center tw-justify-center">
             <template v-if="isImage(item.name)">
               <VcImage
@@ -80,14 +74,14 @@
         </template>
 
         <!-- Overide order column -->
-        <template v-slot:item_sortOrder="{ item }">
+        <template #item_sortOrder="{ item }">
           <div>
             {{ item.sortOrder }}
           </div>
         </template>
 
         <!-- Mobile -->
-        <template v-slot:mobile-item="{ item }">
+        <template #mobile-item="{ item }">
           <div class="tw-border-b tw-border-solid tw-border-b-[#e3e7ec] tw-p-3 tw-flex tw-flex-nowrap">
             <template v-if="isImage(item.name)">
               <VcImage
@@ -112,19 +106,19 @@
               </div>
               <div class="tw-mt-3 tw-w-full tw-flex tw-justify-between">
                 <div class="tw-truncate tw-grow tw-basis-0 tw-mr-2">
-                  <VcHint>{{ $t("ASSETS_MANAGER.TABLE.SIZE") }}</VcHint>
+                  <VcHint>{{ $t("ASSETS_MANAGER.TABLE.HEADER.SIZE") }}</VcHint>
                   <div class="tw-truncate tw-mt-1">
                     {{ readableSize(item.size) }}
                   </div>
                 </div>
                 <div class="tw-truncate tw-grow tw-basis-0 tw-mr-2">
-                  <VcHint>{{ $t("ASSETS_MANAGER.TABLE.CREATED_DATE") }}</VcHint>
+                  <VcHint>{{ $t("ASSETS_MANAGER.TABLE.HEADER.CREATED_DATE") }}</VcHint>
                   <div class="tw-truncate tw-mt-1">
                     {{ item.createdDate && moment(item.createdDate).fromNow() }}
                   </div>
                 </div>
                 <div class="tw-truncate tw-grow tw-basis-0 tw-mr-2">
-                  <VcHint>{{ $t("ASSETS_MANAGER.TABLE.SORT_ORDER") }}</VcHint>
+                  <VcHint>{{ $t("ASSETS_MANAGER.TABLE.HEADER.SORT_ORDER") }}</VcHint>
                   <div class="tw-truncate tw-mt-1">
                     {{ item.sortOrder }}
                   </div>
@@ -140,18 +134,18 @@
       ref="uploader"
       type="file"
       hidden
-      @change="inputUpload"
       multiple
       name="assets_manager"
+      @change="inputUpload"
     />
   </VcBlade>
 </template>
 
 <script setup lang="ts">
 import { Asset, IActionBuilderResult, IBladeToolbar, ITableColumns } from "../../../../../core/types";
-import { ref, computed, onMounted, shallowRef, unref, watch } from "vue";
+import { ref, computed, onMounted, unref, watch, markRaw } from "vue";
 import { useI18n } from "vue-i18n";
-import { IBladeEvent, IParentCallArgs } from "./../../../../../shared";
+import { IParentCallArgs, useBladeNavigation } from "./../../../../../shared";
 import moment from "moment";
 import Assets from "./../../../assets/components/assets-details/assets-details.vue";
 import { isImage, getFileThumbnail, readableSize } from "./../../../../utilities/assets";
@@ -164,7 +158,7 @@ export interface Props {
     assets: Asset[];
     assetsEditHandler: (assets: Asset[]) => Asset[];
     assetsUploadHandler: (files: FileList) => Promise<Asset[]>;
-    assetsRemoveHandler: (assets: Asset[]) => Asset[];
+    assetsRemoveHandler: (assets: Asset[]) => Promise<Asset[]>;
     disabled: boolean;
   };
 }
@@ -172,7 +166,8 @@ export interface Props {
 export interface Emits {
   (event: "parent:call", args: IParentCallArgs): void;
   (event: "close:blade"): void;
-  (event: "open:blade", blade: IBladeEvent): void;
+  (event: "expand:blade"): void;
+  (event: "collapse:blade"): void;
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -195,6 +190,8 @@ const readonly = computed(() => props.options.disabled);
 let assetsCopy;
 const modified = ref(false);
 
+const { openBlade } = useBladeNavigation();
+
 const bladeToolbar = ref<IBladeToolbar[]>([
   {
     id: "save",
@@ -218,9 +215,9 @@ const bladeToolbar = ref<IBladeToolbar[]>([
     id: "delete",
     title: computed(() => t("ASSETS_MANAGER.TOOLBAR.DELETE")),
     icon: "fas fa-trash",
-    clickHandler() {
+    async clickHandler() {
       if (props.options.assetsRemoveHandler && typeof props.options.assetsRemoveHandler === "function") {
-        defaultAssets.value = props.options.assetsRemoveHandler(selectedItems.value);
+        defaultAssets.value = await props.options.assetsRemoveHandler(selectedItems.value);
       }
     },
     disabled: computed(() => !selectedItems.value.length || readonly.value),
@@ -338,9 +335,9 @@ async function inputUpload(event: Event) {
 }
 
 function onItemClick(item: Asset) {
-  emit("open:blade", {
-    component: shallowRef(Assets),
-    bladeOptions: {
+  openBlade({
+    blade: markRaw(Assets),
+    options: {
       asset: unref(item),
       disabled: readonly.value,
       assetEditHandler: (asset: Asset) => {
@@ -355,8 +352,8 @@ function onItemClick(item: Asset) {
           defaultAssets.value = props.options.assetsEditHandler(mutated);
         }
       },
-      assetRemoveHandler: (asset: Asset) => {
-        defaultAssets.value = props.options.assetsRemoveHandler([asset]);
+      assetRemoveHandler: async (asset: Asset) => {
+        defaultAssets.value = await props.options.assetsRemoveHandler([asset]);
       },
     },
   });
@@ -367,7 +364,7 @@ const onSelectionChanged = (items: Asset[]) => {
 };
 
 const actionBuilder = (): IActionBuilderResult[] => {
-  let result = [];
+  const result = [];
 
   result.push({
     icon: "fas fa-edit",
@@ -382,8 +379,8 @@ const actionBuilder = (): IActionBuilderResult[] => {
     title: computed(() => t("ASSETS_MANAGER.TABLE.ACTIONS.DELETE")),
     variant: "danger",
     leftActions: true,
-    clickHandler(item: Asset) {
-      defaultAssets.value = props.options.assetsRemoveHandler([item]);
+    async clickHandler(item: Asset) {
+      defaultAssets.value = await props.options.assetsRemoveHandler([item]);
       selectedItems.value = [];
     },
   });

package/shared/modules/index.ts

@@ -0,0 +1,2 @@
+export * from "./assets";
+export * from "./assets-manager";

package/shared/pages/InvitePage/components/index.ts

@@ -0,0 +1 @@
+export * from "./invite";

package/shared/pages/InvitePage/components/invite/Invite.vue

@@ -0,0 +1,172 @@
+<template>
+  <div class="vc-app tw-w-full tw-h-full tw-box-border tw-flex tw-flex-col tw-m-0 vc-theme_light">
+    <VcLoading
+      v-if="loading"
+      active
+    ></VcLoading>
+
+    <VcLoginForm
+      logo="/assets/logo-white.svg"
+      background="/assets/background.jpg"
+      :title="$t('INVITATION.TITLE')"
+    >
+      <VcForm>
+        <VcInput
+          class="tw-mb-4 tw-mt-1"
+          :label="$t('INVITATION.FIELDS.EMAIL.LABEL')"
+          :model-value="userName"
+          name="username"
+          disabled
+        ></VcInput>
+        <Field
+          v-slot="{ field, errorMessage, handleChange, errors }"
+          :label="$t('INVITATION.FIELDS.PASSWORD.LABEL')"
+          :model-value="form.password"
+          rules="required"
+          name="password"
+        >
+          <VcInput
+            v-bind="field"
+            ref="passwordField"
+            v-model="form.password"
+            class="tw-mb-4 tw-mt-1"
+            :label="$t('INVITATION.FIELDS.PASSWORD.LABEL')"
+            :placeholder="$t('INVITATION.FIELDS.PASSWORD.PLACEHOLDER')"
+            type="password"
+            :disabled="!form.tokenIsValid"
+            :error="!!errors.length"
+            :error-message="errorMessage"
+            required
+            @update:model-value="
+              (e) => {
+                handleChange(e);
+                validate();
+              }
+            "
+          ></VcInput>
+        </Field>
+        <Field
+          v-slot="{ field, errorMessage, handleChange, errors }"
+          :label="$t('INVITATION.FIELDS.CONFIRM_PASSWORD.LABEL')"
+          :model-value="form.confirmPassword"
+          rules="required"
+          name="confirm_password"
+        >
+          <VcInput
+            v-bind="field"
+            ref="confirmPasswordField"
+            v-model="form.confirmPassword"
+            class="tw-mb-4"
+            :label="$t('INVITATION.FIELDS.CONFIRM_PASSWORD.LABEL')"
+            :placeholder="$t('INVITATION.FIELDS.CONFIRM_PASSWORD.PLACEHOLDER')"
+            :disabled="!form.tokenIsValid"
+            type="password"
+            :error="!!errors.length"
+            :error-message="errorMessage"
+            required
+            @update:model-value="
+              (e) => {
+                handleChange(e);
+                validate();
+              }
+            "
+            @keyup.enter="acceptInvitation"
+          ></VcInput>
+        </Field>
+        <div class="tw-flex tw-justify-center tw-items-center tw-pt-2">
+          <span
+            v-if="$isDesktop.value"
+            class="tw-grow tw-basis-0"
+          ></span>
+          <vc-button
+            :disabled="loading || !form.isValid || !form.tokenIsValid"
+            @click="acceptInvitation"
+          >
+            {{ $t("INVITATION.ACCEPT_INVITATION") }}
+          </vc-button>
+        </div>
+
+        <VcHint
+          v-for="error in form.errors"
+          :key="error"
+          class="tw-mt-3"
+          style="color: #f14e4e"
+        >
+          <!-- TODO: stylizing-->
+          {{ $t(`INVITATION.ERRORS.${error}`) }}
+        </VcHint>
+      </VcForm>
+    </VcLoginForm>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { reactive, onMounted, computed } from "vue";
+import { useRouter } from "vue-router";
+import { useIsFormValid, Field, useIsFormDirty, useForm } from "vee-validate";
+import { useUser } from "./../../../../../core/composables";
+
+useForm({ validateOnMount: false });
+
+const props = defineProps({
+  userId: {
+    type: String,
+    default: undefined,
+  },
+  userName: {
+    type: String,
+    default: undefined,
+  },
+  token: {
+    type: String,
+    default: undefined,
+  },
+});
+const { validateToken, validatePassword, resetPasswordByToken, signIn, loading } = useUser();
+const router = useRouter();
+const isFormValid = useIsFormValid();
+const isDirty = useIsFormDirty();
+const form = reactive({
+  isValid: false,
+  tokenIsValid: false,
+  errors: [],
+  password: "",
+  confirmPassword: "",
+});
+
+const isDisabled = computed(() => {
+  return !isDirty.value || !isFormValid.value;
+});
+
+onMounted(async () => {
+  form.tokenIsValid = await validateToken(props.userId, props.token);
+  if (!form.tokenIsValid) {
+    form.errors.push("Invalid-token");
+  }
+});
+
+const validate = async () => {
+  if (form.tokenIsValid) {
+    const errors = (await validatePassword(form.password)).errors;
+    form.errors = errors.map((x) => x.code);
+    if (form.confirmPassword && form.confirmPassword !== form.password) {
+      form.errors.push("Repeat-password");
+    }
+    form.isValid = form.errors.length == 0 && !isDisabled.value;
+  }
+};
+
+const acceptInvitation = async () => {
+  const result = await resetPasswordByToken(props.userId, form.password, props.token);
+  if (result.succeeded) {
+    const result = await signIn(props.userName, form.password);
+    if (result.succeeded) {
+      router.push("/");
+    } else {
+      form.errors = [result.errorCode];
+    }
+  } else {
+    form.errors = result.errors;
+  }
+};
+</script>

package/shared/pages/InvitePage/components/invite/index.ts

@@ -0,0 +1,3 @@
+import _Invite from "./Invite.vue";
+
+export const Invite = _Invite as typeof _Invite;