@xleddyl/nuxt-cms 0.1.61 → 0.2.1

package/dist/runtime/app/components/cms/Modal.vue

@@ -27,7 +27,8 @@
 </template>
 
 <script setup>
-import { onBeforeUnmount, watch } from "#imports";
+import { watch } from "#imports";
+import { useCmsOverlay } from "../../composables/cms-overlay";
 defineProps({
   title: { type: String, required: false },
   size: { type: String, required: false }
@@ -37,19 +38,14 @@ const emit = defineEmits(["after:leave"]);
 function close() {
   open.value = false;
 }
-function onKeydown(event) {
-  if (event.key === "Escape") close();
-}
+const overlay = useCmsOverlay(close);
 watch(open, (value, previous) => {
   if (import.meta.server) return;
   if (value) {
-    document.addEventListener("keydown", onKeydown);
+    overlay.activate();
   } else {
-    document.removeEventListener("keydown", onKeydown);
+    overlay.deactivate();
     if (previous) emit("after:leave");
   }
 });
-onBeforeUnmount(() => {
-  if (import.meta.client) document.removeEventListener("keydown", onKeydown);
-});
 </script>

package/dist/runtime/app/components/cms/PageHeader.d.vue.ts

@@ -4,13 +4,15 @@ export interface CmsBreadcrumbLink {
 }
 type __VLS_Props = {
     title: string;
+    icon?: string;
+    description?: string;
     links?: CmsBreadcrumbLink[];
 };
-declare var __VLS_12: {}, __VLS_14: {};
+declare var __VLS_17: {}, __VLS_19: {};
 type __VLS_Slots = {} & {
-    badge?: (props: typeof __VLS_12) => any;
+    badge?: (props: typeof __VLS_17) => any;
 } & {
-    default?: (props: typeof __VLS_14) => any;
+    default?: (props: typeof __VLS_19) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/runtime/app/components/cms/PageHeader.vue

@@ -4,14 +4,22 @@
          <nav v-if="links?.length" class="cms-breadcrumb">
             <template v-for="link in links" :key="link.to">
                <NuxtLink :to="link.to" class="cms-breadcrumb-link">{{ link.label }}</NuxtLink>
-               <CmsIcon name="chevron-right" class="cms-breadcrumb-separator size-2.5" />
+               <CmsIcon name="chevron-right" class="cms-breadcrumb-separator size-3" />
             </template>
          </nav>
-         <div class="cms-actions">
-            <h1 class="cms-title cms-title-md">
-               {{ title }}
-            </h1>
-            <slot name="badge" />
+         <div class="cms-page-title-row">
+            <span v-if="icon" class="cms-page-icon">
+               <CmsIcon :name="icon" class="size-[18px]" />
+            </span>
+            <div class="cms-page-title-text">
+               <div class="cms-actions">
+                  <h1 class="cms-title cms-title-md">
+                     {{ title }}
+                  </h1>
+                  <slot name="badge" />
+               </div>
+               <p v-if="description" class="cms-page-description">{{ description }}</p>
+            </div>
          </div>
       </div>
       <slot />
@@ -21,6 +29,8 @@
 <script setup>
 defineProps({
   title: { type: String, required: true },
+  icon: { type: String, required: false },
+  description: { type: String, required: false },
   links: { type: Array, required: false }
 });
 </script>

package/dist/runtime/app/components/cms/PageHeader.vue.d.ts

@@ -4,13 +4,15 @@ export interface CmsBreadcrumbLink {
 }
 type __VLS_Props = {
     title: string;
+    icon?: string;
+    description?: string;
     links?: CmsBreadcrumbLink[];
 };
-declare var __VLS_12: {}, __VLS_14: {};
+declare var __VLS_17: {}, __VLS_19: {};
 type __VLS_Slots = {} & {
-    badge?: (props: typeof __VLS_12) => any;
+    badge?: (props: typeof __VLS_17) => any;
 } & {
-    default?: (props: typeof __VLS_14) => any;
+    default?: (props: typeof __VLS_19) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/runtime/app/components/cms/PasswordInput.d.vue.ts

@@ -0,0 +1,17 @@
+type __VLS_Props = {
+    generate?: boolean;
+    copy?: boolean;
+    placeholder?: string;
+    autocomplete?: string;
+};
+type __VLS_ModelProps = {
+    modelValue: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/cms/PasswordInput.vue

@@ -0,0 +1,81 @@
+<template>
+   <CmsInput
+      v-model="model"
+      :type="visible ? 'text' : 'password'"
+      icon="key"
+      class="cms-password-input"
+      :autocomplete="autocomplete ?? 'new-password'"
+      :placeholder="placeholder"
+   >
+      <template #trailing>
+         <span class="cms-password-actions">
+            <button
+               type="button"
+               class="cms-password-action"
+               :title="visible ? 'Hide password' : 'Show password'"
+               :aria-label="visible ? 'Hide password' : 'Show password'"
+               @click="visible = !visible"
+            >
+               <CmsIcon :name="visible ? 'eye-slash' : 'eye'" class="size-4" />
+            </button>
+            <button
+               v-if="generate"
+               type="button"
+               class="cms-password-action"
+               title="Generate a password"
+               aria-label="Generate a password"
+               @click="regenerate"
+            >
+               <CmsIcon name="sparkles" class="size-4" />
+            </button>
+            <button
+               v-if="copy"
+               type="button"
+               class="cms-password-action"
+               :class="{ 'is-done': copied }"
+               :title="copied ? 'Copied' : 'Copy password'"
+               :aria-label="copied ? 'Copied' : 'Copy password'"
+               :disabled="!model"
+               @click="copyPassword"
+            >
+               <CmsIcon
+                  :name="copied ? 'clipboard-document-check' : 'clipboard-document'"
+                  class="size-4"
+               />
+            </button>
+         </span>
+      </template>
+   </CmsInput>
+</template>
+
+<script setup>
+import { ref } from "#imports";
+import { generatePassword } from "../../composables/cms-account";
+defineProps({
+  generate: { type: Boolean, required: false },
+  copy: { type: Boolean, required: false },
+  placeholder: { type: String, required: false },
+  autocomplete: { type: String, required: false }
+});
+const model = defineModel({ type: String, ...{ required: true } });
+const visible = ref(false);
+const copied = ref(false);
+let copiedTimer;
+function regenerate() {
+  model.value = generatePassword();
+  visible.value = true;
+}
+async function copyPassword() {
+  if (!model.value) return;
+  try {
+    await navigator.clipboard.writeText(model.value);
+    copied.value = true;
+    clearTimeout(copiedTimer);
+    copiedTimer = setTimeout(() => {
+      copied.value = false;
+    }, 1600);
+  } catch {
+    copied.value = false;
+  }
+}
+</script>

package/dist/runtime/app/components/cms/PasswordInput.vue.d.ts

@@ -0,0 +1,17 @@
+type __VLS_Props = {
+    generate?: boolean;
+    copy?: boolean;
+    placeholder?: string;
+    autocomplete?: string;
+};
+type __VLS_ModelProps = {
+    modelValue: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/cms/RelationField.vue

@@ -22,7 +22,7 @@
 
 <script setup>
 import { isTranslatableField } from "#nuxt-cms";
-import { computed, onMounted, ref, watch } from "#imports";
+import { computed, onBeforeUnmount, onMounted, ref, watch } from "#imports";
 import cmsConfig from "#cms-config";
 import { useCmsRuntime } from "../../composables/cms-runtime";
 import { useCmsToast } from "../../composables/cms-toast";
@@ -40,22 +40,26 @@ const fetched = ref([]);
 const selectedRows = ref(/* @__PURE__ */ new Map());
 const loading = ref(true);
 const searchTerm = ref("");
+let fetchRequest = 0;
 async function fetchOptions() {
+  const request = ++fetchRequest;
   loading.value = true;
   try {
     const term = searchTerm.value.trim();
     const page = await $fetch(endpoint, {
       query: { light: "true", limit: 25, ...term ? { search: term } : {} }
     });
+    if (request !== fetchRequest) return;
     fetched.value = page.items;
   } catch (err) {
+    if (request !== fetchRequest) return;
     toast.add({
       title: "Loading failed",
       description: errorMessage(err),
       color: "error"
     });
   } finally {
-    loading.value = false;
+    if (request === fetchRequest) loading.value = false;
   }
 }
 let searchTimer;
@@ -63,6 +67,7 @@ watch(searchTerm, () => {
   clearTimeout(searchTimer);
   searchTimer = setTimeout(() => void fetchOptions(), 300);
 });
+onBeforeUnmount(() => clearTimeout(searchTimer));
 const selectedIds = computed(() => {
   if (props.multiple) return model.value ?? [];
   return model.value ? [model.value] : [];

package/dist/runtime/app/components/cms/SelectMenu.d.vue.ts

@@ -7,7 +7,6 @@ type __VLS_Props = {
     multiple?: boolean;
     ignoreFilter?: boolean;
     loading?: boolean;
-    size?: string;
     placeholder?: string;
 };
 type __VLS_ModelProps = {

package/dist/runtime/app/components/cms/SelectMenu.vue

@@ -1,10 +1,6 @@
 <template>
    <div ref="root" class="relative w-full">
-      <div
-         class="cms-field flex flex-wrap items-center gap-1"
-         :class="`cms-field-${size ?? 'md'}`"
-         @click="focusInput"
-      >
+      <div class="cms-field cms-field-md flex flex-wrap items-center gap-1" @click="focusInput">
          <template v-if="multiple">
             <span v-for="value in modelArray" :key="value" class="cms-tag">
                {{ labelFor(value) }}
@@ -25,11 +21,9 @@
             @input="onInput"
             @focus="onFocus"
          />
-         <CmsIcon
-            v-if="loading"
-            name="arrow-path"
-            class="cms-selectmenu-affix ml-auto size-4 animate-spin"
-         />
+         <span v-if="loading" class="cms-selectmenu-affix ml-auto flex">
+            <CmsIcon name="arrow-path" class="size-4 animate-spin" />
+         </span>
          <button
             v-else
             type="button"
@@ -72,7 +66,6 @@ const props = defineProps({
   multiple: { type: Boolean, required: false },
   ignoreFilter: { type: Boolean, required: false },
   loading: { type: Boolean, required: false },
-  size: { type: String, required: false },
   placeholder: { type: String, required: false }
 });
 const model = defineModel({ type: [String, Array, null] });

package/dist/runtime/app/components/cms/SelectMenu.vue.d.ts

@@ -7,7 +7,6 @@ type __VLS_Props = {
     multiple?: boolean;
     ignoreFilter?: boolean;
     loading?: boolean;
-    size?: string;
     placeholder?: string;
 };
 type __VLS_ModelProps = {

package/dist/runtime/app/components/cms/SettingsAccount.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/cms/SettingsAccount.vue

@@ -0,0 +1,138 @@
+<template>
+   <div class="cms-settings-entry">
+      <div class="cms-settings-entry-header">
+         <div class="cms-settings-heading">
+            <h2 class="cms-title cms-title-sm">Account</h2>
+            <p class="cms-settings-hint">Your profile and your password.</p>
+         </div>
+      </div>
+
+      <div class="cms-account-card">
+         <span class="cms-avatar is-lg">{{ initial }}</span>
+         <div class="cms-account-text">
+            <span class="cms-account-name">{{ displayName }}</span>
+            <span class="cms-account-email">{{ email }}</span>
+         </div>
+         <span class="cms-badge is-muted">{{ isSuperAdmin ? "Super admin" : "Admin" }}</span>
+      </div>
+
+      <CmsAlert v-if="isSuperAdmin" color="neutral" title="Environment account">
+         This account signs in with the credentials of the environment variables
+         (NUXT_CMS_ADMIN_EMAIL and NUXT_CMS_ADMIN_PASSWORD). Change them there. Only this account
+         can manage users.
+      </CmsAlert>
+
+      <template v-else>
+         <div class="cms-settings-group">
+            <div class="cms-settings-heading">
+               <p class="cms-settings-label">Profile</p>
+               <p class="cms-settings-hint">The name shows in the sidebar.</p>
+            </div>
+            <CmsForm :state="profile" @submit="saveProfile">
+               <div class="cms-form-row" style="--cms-row-cols: 2">
+                  <CmsFormField label="Name" name="name">
+                     <CmsInput v-model="profile.name" placeholder="Your name" autocomplete="name" />
+                  </CmsFormField>
+                  <CmsFormField label="Email" name="email">
+                     <CmsInput :model-value="email" disabled />
+                  </CmsFormField>
+               </div>
+               <div class="cms-actions is-end">
+                  <CmsButton
+                     type="submit"
+                     label="Save profile"
+                     size="sm"
+                     :loading="savingProfile"
+                     :disabled="profile.name === (user?.name ?? '')"
+                  />
+               </div>
+            </CmsForm>
+         </div>
+
+         <div class="cms-settings-group">
+            <div class="cms-settings-heading">
+               <p class="cms-settings-label">Password</p>
+               <p class="cms-settings-hint">
+                  At least {{ MIN_PASSWORD_LENGTH }} characters. Use the sparkle button to generate
+                  one.
+               </p>
+            </div>
+            <CmsForm :state="password" @submit="savePassword">
+               <CmsAlert v-if="passwordError" color="error" :title="passwordError" />
+               <CmsFormField label="Current password" name="current">
+                  <CmsPasswordInput
+                     v-model="password.current"
+                     autocomplete="current-password"
+                     placeholder="••••••••"
+                  />
+               </CmsFormField>
+               <CmsFormField label="New password" name="next">
+                  <CmsPasswordInput v-model="password.next" generate copy />
+               </CmsFormField>
+               <div class="cms-actions is-end">
+                  <CmsButton
+                     type="submit"
+                     label="Change password"
+                     size="sm"
+                     :loading="savingPassword"
+                     :disabled="!password.current || password.next.length < MIN_PASSWORD_LENGTH"
+                  />
+               </div>
+            </CmsForm>
+         </div>
+      </template>
+   </div>
+</template>
+
+<script setup>
+import { MIN_PASSWORD_LENGTH } from "#nuxt-cms";
+import { ref, watch } from "#imports";
+import { useCmsAccount } from "../../composables/cms-account";
+import { useCmsToast } from "../../composables/cms-toast";
+import { cmsApi } from "../../utils/api";
+import { errorMessage } from "../../utils/ui";
+const { user, email, isSuperAdmin, displayName, initial, refresh } = useCmsAccount();
+const toast = useCmsToast();
+const profile = ref({ name: user.value?.name ?? "" });
+watch(
+  () => user.value?.name,
+  (name) => {
+    profile.value.name = name ?? "";
+  }
+);
+const savingProfile = ref(false);
+async function saveProfile() {
+  savingProfile.value = true;
+  try {
+    await cmsApi("/api/cms/account", {
+      method: "PUT",
+      body: { name: profile.value.name || null }
+    });
+    await refresh();
+    toast.add({ title: "Profile saved", color: "success" });
+  } catch (error) {
+    toast.add({ title: "Profile not saved", description: errorMessage(error), color: "error" });
+  } finally {
+    savingProfile.value = false;
+  }
+}
+const password = ref({ current: "", next: "" });
+const passwordError = ref(null);
+const savingPassword = ref(false);
+async function savePassword() {
+  savingPassword.value = true;
+  passwordError.value = null;
+  try {
+    await cmsApi("/api/cms/account/password", {
+      method: "PUT",
+      body: { currentPassword: password.value.current, newPassword: password.value.next }
+    });
+    password.value = { current: "", next: "" };
+    toast.add({ title: "Password changed", color: "success" });
+  } catch (error) {
+    passwordError.value = errorMessage(error) ?? "Password not changed.";
+  } finally {
+    savingPassword.value = false;
+  }
+}
+</script>

package/dist/runtime/app/components/cms/SettingsAccount.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/cms/SettingsColumns.d.vue.ts

@@ -0,0 +1,16 @@
+import type { FieldConfig } from '#nuxt-cms';
+type __VLS_Props = {
+    fields: Record<string, FieldConfig>;
+    extra: string[];
+};
+type __VLS_ModelProps = {
+    modelValue: string[];
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string[]) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/cms/SettingsColumns.vue

@@ -0,0 +1,102 @@
+<template>
+   <div class="cms-settings-columns">
+      <p class="cms-settings-hint">
+         Choose the columns of the table. Drag the visible columns to change their order.
+      </p>
+      <ul class="cms-settings-list">
+         <li
+            v-for="(key, index) in model"
+            :key="key"
+            class="cms-settings-item is-draggable"
+            :class="{
+  'is-dragging': dragging === key,
+  'is-drop-before': dropIndex === index && dragging !== key
+}"
+            draggable="true"
+            @dragstart="onDragStart($event, key)"
+            @dragover.prevent="dropIndex = index"
+            @drop.prevent="onDrop(index)"
+            @dragend="onDragEnd"
+         >
+            <CmsIcon name="bars-2" class="cms-settings-grip size-4" />
+            <CmsIcon :name="iconOf(key)" class="cms-settings-item-icon size-4" />
+            <span class="cms-settings-item-label">{{ labelOf(key) }}</span>
+            <CmsSwitch
+               :model-value="true"
+               :aria-label="`Hide ${labelOf(key)}`"
+               :disabled="model.length === 1"
+               @update:model-value="hide(key)"
+            />
+         </li>
+         <li
+            v-if="dragging"
+            class="cms-settings-drop-end"
+            :class="{ 'is-over': dropIndex === model.length }"
+            @dragover.prevent="dropIndex = model.length"
+            @drop.prevent="onDrop(model.length)"
+         />
+      </ul>
+
+      <template v-if="hidden.length">
+         <p class="cms-settings-subtitle">Hidden</p>
+         <ul class="cms-settings-list">
+            <li v-for="key in hidden" :key="key" class="cms-settings-item is-muted">
+               <CmsIcon :name="iconOf(key)" class="cms-settings-item-icon size-4" />
+               <span class="cms-settings-item-label">{{ labelOf(key) }}</span>
+               <CmsSwitch
+                  :model-value="false"
+                  :aria-label="`Show ${labelOf(key)}`"
+                  @update:model-value="show(key)"
+               />
+            </li>
+         </ul>
+      </template>
+   </div>
+</template>
+
+<script setup>
+import { computed, ref } from "#imports";
+import { fieldIcon } from "../../utils/ui";
+const props = defineProps({
+  fields: { type: Object, required: true },
+  extra: { type: Array, required: true }
+});
+const model = defineModel({ type: Array, ...{ required: true } });
+const available = computed(() => [...Object.keys(props.fields), ...props.extra]);
+const hidden = computed(() => available.value.filter((key) => !model.value.includes(key)));
+function labelOf(key) {
+  return props.fields[key]?.label ?? (key === "status" ? "Status" : key);
+}
+function iconOf(key) {
+  const field = props.fields[key];
+  return field ? fieldIcon(field) : "check-circle";
+}
+function hide(key) {
+  if (model.value.length === 1) return;
+  model.value = model.value.filter((k) => k !== key);
+}
+function show(key) {
+  model.value = [...model.value, key];
+}
+const dragging = ref(null);
+const dropIndex = ref(null);
+function onDragStart(event, key) {
+  dragging.value = key;
+  event.dataTransfer?.setData("text/plain", key);
+  if (event.dataTransfer) event.dataTransfer.effectAllowed = "move";
+}
+function onDrop(index) {
+  const key = dragging.value;
+  if (key) {
+    const next = model.value.filter((k) => k !== key);
+    const from = model.value.indexOf(key);
+    next.splice(from < index ? index - 1 : index, 0, key);
+    model.value = next;
+  }
+  onDragEnd();
+}
+function onDragEnd() {
+  dragging.value = null;
+  dropIndex.value = null;
+}
+</script>

package/dist/runtime/app/components/cms/SettingsColumns.vue.d.ts

@@ -0,0 +1,16 @@
+import type { FieldConfig } from '#nuxt-cms';
+type __VLS_Props = {
+    fields: Record<string, FieldConfig>;
+    extra: string[];
+};
+type __VLS_ModelProps = {
+    modelValue: string[];
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string[]) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/cms/SettingsEntry.d.vue.ts

@@ -0,0 +1,6 @@
+type __VLS_Props = {
+    name: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;