@xleddyl/nuxt-cms 0.9.3 → 0.10.0

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

@@ -4,29 +4,23 @@
       :subtitle="subtitle"
       :size="size"
       :logo="logo"
+      :icon="CMS_BRAND_ICON"
       :hide-text="hideText"
       show-name
-   >
-      <template #mark>
-         <svg class="cms-brand-glyph" viewBox="0 0 16 16" fill="none">
-            <path
-               d="M4.5 5.5h7M4.5 8h7M4.5 10.5h4"
-               stroke="currentColor"
-               stroke-width="1.5"
-               stroke-linecap="round"
-            />
-         </svg>
-      </template>
-   </KBrand>
+   />
 </template>
 
 <script setup>
-import { Brand as KBrand } from "@xleddyl/443-components-vue";
+import { Brand as KBrand, provideIcons } from "@xleddyl/443-components-vue";
 import { cmsBrand } from "#cms-brand";
 defineProps({
   size: { type: String, required: false, default: "md" },
   subtitle: { type: String, required: false },
   hideText: { type: Boolean, required: false }
 });
+const CMS_BRAND_ICON = "cms-brand";
+provideIcons({
+  [CMS_BRAND_ICON]: '<svg viewBox="0 0 16 16" fill="none"><path d="M4.5 5.5h7M4.5 8h7M4.5 10.5h4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>'
+});
 const logo = cmsBrand.logo.kind === "svg" ? cmsBrand.logo.markup : cmsBrand.logo.kind === "image" ? cmsBrand.logo.src : void 0;
 </script>

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

@@ -1,20 +1,22 @@
 <template>
-   <div class="cms-confirm-groups">
-      <section v-for="group in groups" :key="group.title" class="cms-confirm-group">
-         <h3 class="cms-confirm-group-title" :title="group.title">{{ group.title }}</h3>
-         <ul class="cms-confirm-list">
-            <li v-for="link in group.links" :key="link.to + link.meta">
-               <NuxtLink :to="link.to" class="cms-confirm-link" @click="emit('close')">
-                  <span class="cms-confirm-link-title">{{ link.title }}</span>
-                  <span class="cms-confirm-link-meta">{{ link.meta }}</span>
-               </NuxtLink>
-            </li>
-         </ul>
-      </section>
-   </div>
+   <KStack gap="md">
+      <KStack v-for="group in groups" :key="group.title" as="section" gap="xs">
+         <KTooltip :text="group.title">
+            <h3 class="cms-confirm-group-title k-mono">{{ group.title }}</h3>
+         </KTooltip>
+         <KRecordList :items="group.items" :label="group.title" @row-click="emit('close')" />
+         <KFieldMessage v-if="group.note" tone="neutral" :icon="false" :message="group.note" />
+      </KStack>
+   </KStack>
 </template>
 
 <script setup>
+import {
+  FieldMessage as KFieldMessage,
+  RecordList as KRecordList,
+  Stack as KStack,
+  Tooltip as KTooltip
+} from "@xleddyl/443-components-vue";
 defineProps({
   groups: { type: Array, required: true }
 });

package/dist/runtime/app/components/cms/{BlockPalette.vue.d.ts → EditorHistory.d.vue.ts}

@@ -1,12 +1,13 @@
-import type { BlockConfig } from '#nuxt-cms';
 type __VLS_Props = {
-    blocks: Record<string, BlockConfig>;
-    label?: string;
+    canUndo: boolean;
+    canRedo: boolean;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    pick: (type: string) => any;
+    undo: () => any;
+    redo: () => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onPick?: ((type: string) => any) | undefined;
+    onUndo?: (() => any) | undefined;
+    onRedo?: (() => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

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

@@ -0,0 +1,34 @@
+<template>
+   <KTooltip text="Undo" shortcut="mod+z">
+      <KButton
+         :icon="cmsIcon('arrow-uturn-left')"
+         size="sm"
+         variant="ghost"
+         tone="neutral"
+         aria-label="Undo"
+         :disabled="!canUndo"
+         @click="emit('undo')"
+      />
+   </KTooltip>
+   <KTooltip text="Redo" shortcut="mod+shift+z">
+      <KButton
+         :icon="cmsIcon('arrow-uturn-right')"
+         size="sm"
+         variant="ghost"
+         tone="neutral"
+         aria-label="Redo"
+         :disabled="!canRedo"
+         @click="emit('redo')"
+      />
+   </KTooltip>
+</template>
+
+<script setup>
+import { Button as KButton, Tooltip as KTooltip } from "@xleddyl/443-components-vue";
+import { cmsIcon } from "../../utils/ui";
+defineProps({
+  canUndo: { type: Boolean, required: true },
+  canRedo: { type: Boolean, required: true }
+});
+const emit = defineEmits(["undo", "redo"]);
+</script>

package/dist/runtime/app/components/cms/{BlockPalette.d.vue.ts → EditorHistory.vue.d.ts}

@@ -1,12 +1,13 @@
-import type { BlockConfig } from '#nuxt-cms';
 type __VLS_Props = {
-    blocks: Record<string, BlockConfig>;
-    label?: string;
+    canUndo: boolean;
+    canRedo: boolean;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    pick: (type: string) => any;
+    undo: () => any;
+    redo: () => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onPick?: ((type: string) => any) | undefined;
+    onUndo?: (() => any) | undefined;
+    onRedo?: (() => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

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

@@ -1,24 +1,30 @@
 import type { CmsEntry } from '#nuxt-cms';
+import type { CmsSearchFocus } from '../../../shared/search.js';
 type __VLS_Props = {
     collection: string;
     config: CmsEntry;
     entryId: string | null;
-    initial?: Record<string, unknown> | null;
+    duplicateId?: string | null;
+    focus?: CmsSearchFocus | null;
 };
 type __VLS_ModelProps = {
     'open'?: boolean;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    duplicate: (id: string) => any;
+    created: (id: string) => any;
+    missing: () => any;
+    saved: (id: string) => any;
     "update:open": (value: boolean) => any;
-    saved: () => any;
     deleted: () => any;
-    duplicate: (values: Record<string, unknown>) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onDuplicate?: ((id: string) => any) | undefined;
+    onCreated?: ((id: string) => any) | undefined;
+    onMissing?: (() => any) | undefined;
+    onSaved?: ((id: string) => any) | undefined;
     "onUpdate:open"?: ((value: boolean) => any) | undefined;
-    onSaved?: (() => any) | undefined;
     onDeleted?: (() => any) | undefined;
-    onDuplicate?: ((values: Record<string, unknown>) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

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

@@ -1,115 +1,138 @@
 <template>
-   <KDrawer v-model:open="open" :title="title" size="lg" :before-close="confirmClose">
+   <KFormDrawer
+      v-model:open="open"
+      size="lg"
+      :title="title"
+      :tabs="drawerTabs"
+      :tab-route="CMS_ENTRY_TAB_ROUTE_KEY"
+      :form="form"
+      :loading="loading"
+      :creating="isNew"
+      :readonly="!!lock"
+      :deletable="!isNew && canDelete"
+      @delete="remove"
+   >
       <template v-if="drafts && !loading" #title-trailing>
-         <KBadge
-            dot
-            :tone="published ? 'success' : 'neutral'"
-            :variant="published ? 'soft' : 'outline'"
-            :label="published ? 'Published' : 'Draft'"
-         />
+         <CmsStatusBadge :published="savedStatus === 'published'" />
       </template>
 
-      <KStack v-if="loading" align="center" justify="center" class="cms-drawer-loading">
-         <KSpinner size="lg" label="Loading" />
-      </KStack>
-
-      <CmsEntryForm
-         v-else
-         v-model="formState"
-         :fields="config.fields"
-         :tabs="config.tabs"
-         :entry-name="collection"
-         :drafts="drafts"
-         :form-id="FORM_ID"
-         :loading="saving"
-         :footer="false"
-         @submit="save"
-         @error="revertStatus"
-      />
+      <template v-if="!loading" #actions>
+         <CmsTranslationMenu
+            v-model="formState"
+            :fields="config.fields"
+            :disabled="!!lock"
+            size="sm"
+         />
+         <KButton
+            v-if="!isNew && canCreate"
+            variant="soft"
+            tone="neutral"
+            size="sm"
+            :icon="cmsIcon('document-duplicate')"
+            :disabled="form.dirty.value"
+            disabled-reason="Save the changes first"
+            @click="emit('duplicate', String(entryId))"
+         >
+            Duplicate
+         </KButton>
+         <KButton
+            v-if="drafts && !lock && canPublish"
+            variant="soft"
+            tone="neutral"
+            size="sm"
+            :icon="cmsIcon(published ? 'pencil-square' : 'check-circle')"
+            :loading="form.submitting.value"
+            @click="togglePublished"
+         >
+            {{ published ? "Make draft" : "Publish" }}
+         </KButton>
+      </template>
 
-      <template #footer>
-         <KStack direction="row" justify="between" gap="sm" wrap class="cms-drawer-actions">
-            <KStack v-if="!isNew" direction="row" gap="sm">
-               <KButton
-                  label="Delete"
-                  icon="trash"
-                  variant="ghost"
-                  tone="danger"
-                  :disabled="saving || loading"
-                  @click="remove"
-               />
-               <KButton
-                  label="Duplicate"
-                  :icon="cmsIcon('document-duplicate')"
-                  variant="ghost"
-                  tone="neutral"
-                  :disabled="saving || loading"
-                  @click="duplicate"
-               />
-            </KStack>
-            <span v-else />
-            <KStack direction="row" gap="sm">
-               <KButton
-                  v-if="drafts"
-                  type="submit"
-                  :form="FORM_ID"
-                  :label="published ? 'Make draft' : 'Publish'"
-                  variant="soft"
-                  :loading="saving"
-                  :disabled="loading"
-                  @click="togglePublished"
-               />
-               <KButton
-                  type="submit"
-                  :form="FORM_ID"
-                  label="Save"
-                  :loading="saving"
-                  :disabled="loading"
-               />
-            </KStack>
-         </KStack>
+      <template #default="{ tab }">
+         <CmsEntryForm
+            ref="formRef"
+            v-model="formState"
+            :form="form"
+            :tab="tab === void 0 ? void 0 : String(tab)"
+            :fields="config.fields"
+            :tabs="config.tabs"
+            :entry-name="collection"
+            :lock="lock"
+            :locked="locked"
+            :focus="focus"
+            @update:tab="selectTab"
+         />
       </template>
-   </KDrawer>
+   </KFormDrawer>
 </template>
 
 <script setup>
-import { isTranslatableField, selectDisplayValue } from "#nuxt-cms";
+import { fieldTab, isTranslatableField, selectDisplayValue } from "#nuxt-cms";
 import {
-  Badge as KBadge,
   Button as KButton,
-  Drawer as KDrawer,
-  Spinner as KSpinner,
-  Stack as KStack
+  FormDrawer as KFormDrawer,
+  toast,
+  useConfirm,
+  useRouteState
 } from "@xleddyl/443-components-vue";
-import { computed, ref, watch } from "#imports";
+import { computed, nextTick, ref, watch } from "#imports";
 import { duplicateEntryValues } from "../../../shared/duplicate";
-import { useCmsConfirm } from "../../composables/cms-confirm";
+import { entryDefaults, lockedFieldKeys } from "../../../shared/field-options";
+import { cloneState, mergeSavedState } from "../../../shared/save-state";
+import { CMS_ENTRY_TAB_ROUTE_KEY } from "../../../shared/search";
+import { useCmsEntryForm } from "../../composables/cms-entry-form";
+import { useCmsPermissions } from "../../composables/cms-permissions";
 import { useCmsRuntime } from "../../composables/cms-runtime";
-import { useCmsToast } from "../../composables/cms-toast";
 import { cmsApi } from "../../utils/api";
 import { cmsIcon, errorMessage } from "../../utils/ui";
-const FORM_ID = "cms-entry-drawer-form";
 const props = defineProps({
   collection: { type: String, required: true },
   config: { type: Object, required: true },
   entryId: { type: [String, null], required: true },
-  initial: { type: [Object, null], required: false }
+  duplicateId: { type: [String, null], required: false, default: null },
+  focus: { type: [Object, null], required: false, default: null }
 });
 const open = defineModel("open", { type: Boolean, ...{ default: false } });
-const emit = defineEmits(["saved", "deleted", "duplicate"]);
-const toast = useCmsToast();
-const confirmAction = useCmsConfirm();
+const emit = defineEmits(["saved", "created", "deleted", "duplicate", "missing"]);
+const confirm = useConfirm();
+const routeTab = useRouteState(CMS_ENTRY_TAB_ROUTE_KEY, { location: "hash", history: "replace" });
 const endpoint = computed(() => `/api/cms/admin/${props.collection}`);
 const isNew = computed(() => props.entryId === null);
 const drafts = computed(() => !!props.config.drafts);
 const formKeys = computed(
   () => drafts.value ? [...Object.keys(props.config.fields), "status"] : Object.keys(props.config.fields)
 );
-const { i18n: contentI18n } = useCmsRuntime();
+const { i18n } = useCmsRuntime();
 const loading = ref(false);
-const saving = ref(false);
 const formState = ref({});
-const snapshot = ref("");
+const savedState = ref({});
+const loadedId = ref(null);
+const formRef = ref(null);
+const savedStatus = computed(() => savedState.value.status);
+function emptyState() {
+  return Object.fromEntries(formKeys.value.map((key) => [key, null]));
+}
+function newState() {
+  return { ...emptyState(), ...entryDefaults(props.config.fields, i18n, { local: true }) };
+}
+function pickFields(row) {
+  return Object.fromEntries(formKeys.value.map((key) => [key, row[key] ?? null]));
+}
+const { can, entryLock } = useCmsPermissions();
+const canPublish = computed(() => can(`${props.collection}.publish`));
+const canCreate = computed(() => can(`${props.collection}.create`));
+const canDelete = computed(
+  () => can(`${props.collection}.delete`) && (!drafts.value || canPublish.value || savedStatus.value !== "published")
+);
+const lock = computed(
+  () => loading.value ? null : entryLock(props.collection, props.config, {
+    isNew: isNew.value,
+    status: savedStatus.value
+  })
+);
+const locked = computed(
+  () => isNew.value ? [] : lockedFieldKeys(props.config.fields, savedState.value)
+);
 const entryName = computed(() => {
   const key = props.config.titleField;
   const field = key ? props.config.fields[key] : void 0;
@@ -117,121 +140,129 @@ const entryName = computed(() => {
   if (!field || value == null || value === "") return "";
   if (isTranslatableField(field)) {
     const record = value;
-    return record[contentI18n.defaultLocale] ?? Object.values(record)[0] ?? "";
+    return record[i18n.defaultLocale] ?? Object.values(record)[0] ?? "";
   }
   if (field.type === "select") return selectDisplayValue(field, value);
   return String(value);
 });
 const title = computed(() => {
-  if (isNew.value) return props.initial ? "Duplicate entry" : "Add entry";
+  if (isNew.value) return props.duplicateId ? "Duplicate entry" : "Add entry";
   return entryName.value || "Untitled";
 });
-function emptyState() {
-  return Object.fromEntries(formKeys.value.map((key) => [key, null]));
-}
-function pickFields(row) {
-  return Object.fromEntries(formKeys.value.map((key) => [key, row[key] ?? null]));
+const drawerTabs = computed(() => {
+  const tabs = props.config.tabs ?? [];
+  if (tabs.length < 2) return void 0;
+  return tabs.map((tab) => ({
+    value: tab.id,
+    label: tab.label,
+    fields: Object.entries(props.config.fields).filter(([, field]) => fieldTab(field, tabs) === tab.id).map(([key]) => key)
+  }));
+});
+function selectTab(value) {
+  routeTab.value = value === drawerTabs.value?.[0]?.value ? void 0 : value;
 }
-function setState(state) {
-  formState.value = state;
-  snapshot.value = JSON.stringify(state);
+const published = computed(() => formState.value.status === "published");
+function revertStatus() {
+  if (drafts.value) formState.value.status = savedState.value.status ?? null;
 }
-const dirty = computed(() => JSON.stringify(formState.value) !== snapshot.value);
-const published = computed({
-  get: () => formState.value.status === "published",
-  set: (value) => {
-    formState.value.status = value ? "published" : "draft";
+const form = useCmsEntryForm({
+  state: formState,
+  fields: () => props.config.fields,
+  entryName: () => props.collection,
+  drafts,
+  onSubmit: save,
+  onInvalid: (errors) => {
+    revertStatus();
+    formRef.value?.revealErrors(errors);
   }
 });
 function togglePublished() {
-  published.value = !published.value;
+  formState.value.status = published.value ? "draft" : "published";
+  void form.submit();
 }
-function revertStatus() {
-  if (!drafts.value) return;
-  formState.value.status = JSON.parse(snapshot.value).status ?? null;
+function applyState(saved, current = saved) {
+  savedState.value = saved;
+  form.reset(saved);
+  if (current !== saved) formState.value = current;
 }
 let loadRequest = 0;
 async function load() {
   const request = ++loadRequest;
   const id = props.entryId;
-  if (id === null) {
+  const source = id === null ? props.duplicateId : id;
+  const isStale = () => request !== loadRequest || props.entryId !== id || !open.value;
+  loadedId.value = id;
+  if (!source) {
     loading.value = false;
-    setState(emptyState());
-    if (props.initial) formState.value = { ...emptyState(), ...pickFields(props.initial) };
+    applyState(newState());
     return;
   }
-  const isStale = () => request !== loadRequest || props.entryId !== id || !open.value;
   loading.value = true;
   try {
-    const entry = await cmsApi(`${endpoint.value}/${id}`);
+    const entry = await cmsApi(`${endpoint.value}/${source}`);
     if (isStale()) return;
-    setState(pickFields(entry));
+    if (id === null) {
+      applyState(newState(), {
+        ...emptyState(),
+        ...pickFields(duplicateEntryValues(props.config, entry))
+      });
+    } else {
+      applyState(pickFields(entry));
+    }
   } catch (error) {
     if (isStale()) return;
-    toast.add({
-      title: "Could not load entry",
-      description: errorMessage(error),
-      color: "error"
-    });
-    open.value = false;
+    toast.error("Could not load entry", { description: errorMessage(error) });
+    emit("missing");
   } finally {
     if (request === loadRequest) loading.value = false;
   }
 }
 watch(
-  () => [open.value, props.entryId, props.initial],
-  ([isOpen]) => {
-    if (isOpen) load();
+  () => [open.value, props.entryId, props.duplicateId],
+  ([isOpen], previous) => {
+    if (!isOpen) return;
+    if (previous?.[0] && props.entryId !== null && loadedId.value === props.entryId) return;
+    void load();
   },
   { immediate: true }
 );
-function confirmClose() {
-  return !dirty.value || confirmAction("You have unsaved changes. Close anyway?");
-}
-async function save() {
-  if (saving.value) return;
-  saving.value = true;
+async function save(values) {
+  const submitted = cloneState(values);
   try {
-    await (isNew.value ? cmsApi(endpoint.value, { method: "POST", body: formState.value }) : cmsApi(`${endpoint.value}/${props.entryId}`, {
-      method: "PUT",
-      body: formState.value
-    }));
-    snapshot.value = JSON.stringify(formState.value);
-    toast.add({ title: "Saved", color: "success" });
-    emit("saved");
-    open.value = false;
+    const row = await (isNew.value ? cmsApi(endpoint.value, { method: "POST", body: submitted }) : cmsApi(`${endpoint.value}/${props.entryId}`, { method: "PUT", body: submitted }));
+    const saved = pickFields(row ?? submitted);
+    const merged = mergeSavedState(submitted, formState.value, saved);
+    const id = row?.id != null ? String(row.id) : props.entryId;
+    applyState(saved, merged.state);
+    loadedId.value = id;
+    if (merged.clean) {
+      toast.success("Saved");
+      if (id) emit("saved", id);
+      open.value = false;
+      return;
+    }
+    toast.success("Saved", { description: "Changes made while saving are not saved yet." });
+    if (id && isNew.value) emit("created", id);
+    else if (id) emit("saved", id);
   } catch (error) {
     revertStatus();
-    toast.add({
-      title: "Save failed",
-      description: errorMessage(error),
-      color: "error"
-    });
-  } finally {
-    saving.value = false;
+    throw error;
   }
 }
-async function duplicate() {
-  if (dirty.value && !await confirmAction("You have unsaved changes. Duplicate the saved entry anyway?"))
-    return;
-  emit("duplicate", duplicateEntryValues(props.config, JSON.parse(snapshot.value)));
-}
 async function remove() {
-  if (!await confirmAction("Delete this row?")) return;
-  saving.value = true;
+  if (!await confirm.delete("Delete this entry?", {
+    description: entryName.value ? `"${entryName.value}" is deleted for good.` : "The entry is deleted for good."
+  }))
+    return;
   try {
     await cmsApi(`${endpoint.value}/${props.entryId}`, { method: "DELETE" });
-    snapshot.value = JSON.stringify(formState.value);
+    form.markClean();
+    toast.success("Entry deleted");
     emit("deleted");
+    await nextTick();
     open.value = false;
   } catch (error) {
-    toast.add({
-      title: "Delete failed",
-      description: errorMessage(error),
-      color: "error"
-    });
-  } finally {
-    saving.value = false;
+    toast.error("Delete failed", { description: errorMessage(error) });
   }
 }
 </script>

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

@@ -1,24 +1,30 @@
 import type { CmsEntry } from '#nuxt-cms';
+import type { CmsSearchFocus } from '../../../shared/search.js';
 type __VLS_Props = {
     collection: string;
     config: CmsEntry;
     entryId: string | null;
-    initial?: Record<string, unknown> | null;
+    duplicateId?: string | null;
+    focus?: CmsSearchFocus | null;
 };
 type __VLS_ModelProps = {
     'open'?: boolean;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    duplicate: (id: string) => any;
+    created: (id: string) => any;
+    missing: () => any;
+    saved: (id: string) => any;
     "update:open": (value: boolean) => any;
-    saved: () => any;
     deleted: () => any;
-    duplicate: (values: Record<string, unknown>) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onDuplicate?: ((id: string) => any) | undefined;
+    onCreated?: ((id: string) => any) | undefined;
+    onMissing?: (() => any) | undefined;
+    onSaved?: ((id: string) => any) | undefined;
     "onUpdate:open"?: ((value: boolean) => any) | undefined;
-    onSaved?: (() => any) | undefined;
     onDeleted?: (() => any) | undefined;
-    onDuplicate?: ((values: Record<string, unknown>) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;