@xleddyl/nuxt-cms 0.9.3 → 0.10.0

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

@@ -1,5 +1,7 @@
 import type { FieldConfig } from '#nuxt-cms';
+import type { BreadcrumbItem } from '@xleddyl/443-components-vue';
 import type { CmsSearchFocus } from '../../../shared/search.js';
+import type { CmsResponseIssue } from '../../utils/ui.js';
 type __VLS_Props = {
     entryName: string;
     fieldKey: string;
@@ -7,26 +9,42 @@ type __VLS_Props = {
     title: string;
     content?: boolean;
     focus?: CmsSearchFocus | null;
+    locked?: string[];
+    readonly?: boolean;
+    tabQuery?: string;
+    trail?: BreadcrumbItem[];
 };
 declare function validate(): boolean;
+declare function setIssues(issues: CmsResponseIssue[]): void;
+declare function applyChange(values: Record<string, unknown>): void;
 type __VLS_ModelProps = {
     'state': Record<string, unknown>;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare var __VLS_1: {}, __VLS_3: {}, __VLS_15: {};
+declare var __VLS_10: {}, __VLS_19: {}, __VLS_49: {
+    compact: boolean;
+}, __VLS_222: {
+    locale: string;
+};
 type __VLS_Slots = {} & {
-    start?: (props: typeof __VLS_1) => any;
+    start?: (props: typeof __VLS_10) => any;
+} & {
+    status?: (props: typeof __VLS_19) => any;
 } & {
-    status?: (props: typeof __VLS_3) => any;
+    actions?: (props: typeof __VLS_49) => any;
 } & {
-    actions?: (props: typeof __VLS_15) => any;
+    'content-start'?: (props: typeof __VLS_222) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {
     validate: typeof validate;
+    setIssues: typeof setIssues;
+    applyChange: typeof applyChange;
     locale: import("vue").Ref<string, string>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    save: () => any;
     "update:state": (value: Record<string, unknown>) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onSave?: (() => any) | undefined;
     "onUpdate:state"?: ((value: Record<string, unknown>) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

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

@@ -1,40 +1,28 @@
 <template>
-   <KModal
+   <KFormModal
       :open="open"
       size="sm"
       :title="`Welcome to ${cmsBrand.title}`"
+      description="You signed in with a password that someone shared with you. Set your own password now, or keep this one. You can change it later in Settings, Account."
+      :form="form"
+      :guard="false"
       @update:open="(value) => !value && keep()"
    >
-      <KForm :form="form">
-         <p class="cms-settings-hint">
-            You signed in with a password that someone shared with you. Set your own password now,
-            or keep this one. You can change it later in Settings, Account.
-         </p>
-         <KFormField label="New password" name="password">
-            <KPasswordInput
-               v-model="form.values.password"
-               icon="key"
-               autocomplete="new-password"
-               :generate="generatePassword"
-               copy
-            />
-         </KFormField>
-         <KStack direction="row" justify="end" gap="sm" wrap>
-            <KButton
-               label="Keep current password"
-               variant="ghost"
-               tone="neutral"
-               :disabled="form.submitting.value"
-               @click="keep"
-            />
-            <KButton
-               type="submit"
-               label="Set password"
-               :disabled="(form.values.password ?? '').length < MIN_PASSWORD_LENGTH"
-            />
-         </KStack>
-      </KForm>
-   </KModal>
+      <KFormField label="New password" name="password" required>
+         <KPasswordInput
+            v-model="draft.password"
+            autocomplete="new-password"
+            :generate="generatePassword"
+            copy
+         />
+      </KFormField>
+      <template #footer="{ submit }">
+         <KButton variant="ghost" tone="neutral" :disabled="form.submitting.value" @click="keep">
+            Keep current password
+         </KButton>
+         <KButton :loading="form.submitting.value" @click="submit">Set password</KButton>
+      </template>
+   </KFormModal>
 </template>
 
 <script setup>
@@ -42,42 +30,36 @@ import { MIN_PASSWORD_LENGTH } from "#nuxt-cms";
 import { cmsBrand } from "#cms-brand";
 import {
   Button as KButton,
-  Form as KForm,
   FormField as KFormField,
-  Modal as KModal,
+  FormModal as KFormModal,
   PasswordInput as KPasswordInput,
-  Stack as KStack,
+  toast,
   useForm
 } from "@xleddyl/443-components-vue";
 import { computed, ref } from "#imports";
 import { generatePassword, useCmsAccount } from "../../composables/cms-account";
-import { useCmsToast } from "../../composables/cms-toast";
 import { cmsApi } from "../../utils/api";
-import { errorMessage } from "../../utils/ui";
 const { user, refresh } = useCmsAccount();
-const toast = useCmsToast();
 const dismissed = ref(false);
 const open = computed(() => !!user.value?.firstLogin && !dismissed.value);
+const draft = ref({ password: "" });
 const form = useForm({
-  schema: { password: { initial: () => "" } },
-  onSubmit: save
-});
-async function keep() {
-  dismissed.value = true;
-  await cmsApi("/api/cms/account/welcome", { method: "POST" }).catch(() => void 0);
-  await refresh();
-}
-async function save(values) {
-  try {
+  values: draft,
+  schema: { password: { required: true, minLength: MIN_PASSWORD_LENGTH, maxLength: 256 } },
+  guard: false,
+  onSubmit: async (values) => {
     await cmsApi("/api/cms/account/password", {
       method: "PUT",
       body: { newPassword: values.password }
     });
     dismissed.value = true;
     await refresh();
-    toast.add({ title: "Password set", color: "success" });
-  } catch (e) {
-    form.setError("", errorMessage(e) ?? "Password not set.");
+    toast.success("Password set");
   }
+});
+async function keep() {
+  dismissed.value = true;
+  await cmsApi("/api/cms/account/welcome", { method: "POST" }).catch(() => void 0);
+  await refresh();
 }
 </script>

package/dist/runtime/app/composables/cms-clipboard.d.ts

@@ -0,0 +1,8 @@
+import type { CmsClipboardNotice } from '../../shared/clipboard.js';
+import type { CmsBlockValue } from '../../shared/preview.js';
+export declare function useCmsClipboard(): {
+    items: import("vue").ComputedRef<CmsBlockValue[] | null>;
+    copy: (list: readonly CmsBlockValue[], event?: ClipboardEvent) => void;
+    read: (text?: string | null) => Promise<CmsBlockValue[] | null>;
+    notify: (notice: CmsClipboardNotice) => void;
+};

package/dist/runtime/app/composables/cms-clipboard.js

@@ -0,0 +1,38 @@
+import { computed, shallowRef } from "#imports";
+import { clipboardText, parseClipboardText } from "../../shared/clipboard.js";
+import { showCmsNotice } from "./cms-toast.js";
+const memory = shallowRef(null);
+async function readSystemClipboard() {
+  try {
+    return await navigator.clipboard.readText();
+  } catch {
+    return null;
+  }
+}
+export function useCmsClipboard() {
+  const items = computed(() => parseClipboardText(memory.value));
+  function copy(list, event) {
+    const text = clipboardText(list);
+    memory.value = text;
+    if (event?.clipboardData) {
+      event.clipboardData.setData("text/plain", text);
+      event.preventDefault();
+      return;
+    }
+    void navigator.clipboard?.writeText(text).catch(() => {
+    });
+  }
+  async function read(text) {
+    const source = text === void 0 ? await readSystemClipboard() : text;
+    const parsed = parseClipboardText(source);
+    if (parsed) {
+      memory.value = source;
+      return parsed;
+    }
+    return items.value;
+  }
+  function notify(notice) {
+    showCmsNotice(notice);
+  }
+  return { items, copy, read, notify };
+}

package/dist/runtime/app/composables/cms-confirm.d.ts

@@ -1,15 +1,13 @@
-export interface CmsConfirmLink {
-    title: string;
-    meta: string;
-    to: string;
-}
+import type { RecordListItem } from '@xleddyl/443-components-vue';
 export interface CmsConfirmGroup {
     title: string;
-    links: CmsConfirmLink[];
+    items: RecordListItem[];
+    note?: string;
 }
 export interface CmsConfirmOptions {
-    title?: string;
+    title: string;
+    description?: string;
     confirmLabel?: string;
     groups?: CmsConfirmGroup[];
 }
-export declare function useCmsConfirm(): (message: string, options?: CmsConfirmOptions) => Promise<boolean>;
+export declare function useCmsConfirm(): (options: CmsConfirmOptions) => Promise<boolean>;

package/dist/runtime/app/composables/cms-confirm.js

@@ -3,14 +3,12 @@ import { useConfirm } from "@xleddyl/443-components-vue";
 import CmsConfirmGroups from "../components/cms/ConfirmGroups.vue";
 export function useCmsConfirm() {
   const confirm = useConfirm();
-  return (message, options) => {
-    const groups = options?.groups;
+  return (options) => {
+    const groups = options.groups;
     const body = groups?.length ? (_props, { attrs }) => h(CmsConfirmGroups, { ...attrs, groups }) : void 0;
-    return confirm({
-      title: options?.title,
-      description: message,
-      confirmLabel: options?.confirmLabel,
-      tone: "danger",
+    return confirm.delete(options.title, {
+      description: options.description,
+      confirmLabel: options.confirmLabel,
       body: body ? markRaw(body) : void 0
     });
   };

package/dist/runtime/app/composables/cms-entry-disabled.d.ts

@@ -1,5 +1,5 @@
 import type { AsyncData } from 'nuxt/app';
-import type { CmsCollectionName, CmsCollectionTypes, CmsContentName, CmsContentTypes, CmsPagePath, CmsPageTypes, CmsSingleName, CmsSingleTypes } from '#cms-types';
+import type { CmsCollectionName, CmsCollectionTypes, CmsContentName, CmsContentRouteMatch, CmsContentTypes, CmsPagePath, CmsPageTypes, CmsSingleName, CmsSingleTypes } from '#cms-types';
 import type { CmsAsyncDataOptions } from './cms-query-disabled.js';
 export interface CmsSortInput<Entry> {
     field: Extract<keyof Entry, string>;
@@ -22,8 +22,12 @@ export interface CmsContentOptions<ResT, DefaultT> extends CmsAsyncDataOptions<R
     locale?: string;
 }
 export type CmsContentsOptions<ResT, DefaultT, Entry> = CmsCollectionOptions<ResT, DefaultT, Entry>;
+export interface CmsRouteOptions<ResT, DefaultT> extends CmsAsyncDataOptions<ResT, DefaultT> {
+    locale?: string;
+}
 export declare function useCmsSingle<K extends CmsSingleName, DefaultT = null>(name: K, options?: CmsSingleOptions<CmsSingleTypes[K] | null, DefaultT>): AsyncData<CmsSingleTypes[K] | DefaultT | null, Error | undefined>;
 export declare function useCmsCollection<K extends CmsCollectionName, DefaultT = CmsCollectionTypes[K][]>(name: K, options?: CmsCollectionOptions<CmsCollectionTypes[K][], DefaultT, CmsCollectionTypes[K]>): AsyncData<CmsCollectionTypes[K][] | DefaultT, Error | undefined>;
 export declare function useCmsContents<K extends CmsContentName, DefaultT = CmsContentTypes[K][]>(name: K, options?: CmsContentsOptions<CmsContentTypes[K][], DefaultT, CmsContentTypes[K]>): AsyncData<CmsContentTypes[K][] | DefaultT, Error | undefined>;
 export declare function useCmsContent<K extends CmsContentName, DefaultT = null>(name: K, slug: string, options?: CmsContentOptions<CmsContentTypes[K] | null, DefaultT>): AsyncData<CmsContentTypes[K] | DefaultT | null, Error | undefined>;
 export declare function useCmsPage<P extends CmsPagePath, DefaultT = null>(path: P, options?: CmsPageOptions<CmsPageTypes[P] | null, DefaultT>): AsyncData<CmsPageTypes[P] | DefaultT | null, Error | undefined>;
+export declare function useCmsRoute<DefaultT = null>(path: string, options?: CmsRouteOptions<CmsContentRouteMatch | null, DefaultT>): AsyncData<CmsContentRouteMatch | DefaultT | null, Error | undefined>;

package/dist/runtime/app/composables/cms-entry-disabled.js

@@ -36,3 +36,10 @@ export function useCmsPage(path, options = {}) {
     async () => fallback ? fallback() : null
   );
 }
+export function useCmsRoute(path, options = {}) {
+  const { locale, key, default: fallback } = options;
+  return useAsyncData(
+    key ?? `cms-route:${path}:${locale ?? ""}`,
+    async () => fallback ? fallback() : null
+  );
+}

package/dist/runtime/app/composables/cms-entry-form.d.ts

@@ -0,0 +1,15 @@
+import type { CmsEntry } from '#nuxt-cms';
+import type { FormErrors } from '@xleddyl/443-components-vue';
+import type { MaybeRefOrGetter, Ref } from 'vue';
+export interface CmsEntryFormOptions {
+    state: Ref<Record<string, unknown>>;
+    fields: MaybeRefOrGetter<CmsEntry['fields']>;
+    entryName?: MaybeRefOrGetter<string | undefined>;
+    drafts?: MaybeRefOrGetter<boolean | undefined>;
+    path?: MaybeRefOrGetter<string | undefined>;
+    onSubmit: (values: Record<string, unknown>) => unknown;
+    onInvalid?: (errors: FormErrors) => unknown;
+    guard?: boolean;
+}
+export declare function useCmsEntryForm(options: CmsEntryFormOptions): import("@xleddyl/443-components-vue").UseFormReturn<import("@xleddyl/443-components-vue").FormSchema, Record<string, unknown>>;
+export type CmsEntryForm = ReturnType<typeof useCmsEntryForm>;

package/dist/runtime/app/composables/cms-entry-form.js

@@ -0,0 +1,40 @@
+import { useForm } from "@xleddyl/443-components-vue";
+import { computed, toValue } from "#imports";
+import cmsConfig from "#cms-config";
+import { buildEntrySchema, entryValidationWarnings } from "../../shared/validation.js";
+import { useCmsRuntime } from "./cms-runtime.js";
+export function useCmsEntryForm(options) {
+  const { i18n } = useCmsRuntime();
+  const validate = computed(() => {
+    const name = toValue(options.entryName);
+    return name ? cmsConfig[name]?.validate : void 0;
+  });
+  const schema = computed(
+    () => buildEntrySchema(
+      {
+        fields: toValue(options.fields),
+        drafts: toValue(options.drafts),
+        validate: validate.value,
+        path: toValue(options.path),
+        config: cmsConfig
+      },
+      i18n
+    )
+  );
+  function warnings(values) {
+    return entryValidationWarnings(
+      { fields: toValue(options.fields), validate: validate.value },
+      values,
+      i18n,
+      toValue(options.path)
+    );
+  }
+  return useForm({
+    values: options.state,
+    validator: schema,
+    warnings,
+    onSubmit: options.onSubmit,
+    onInvalid: options.onInvalid,
+    guard: options.guard
+  });
+}

package/dist/runtime/app/composables/cms-entry-settings.d.ts

@@ -0,0 +1,30 @@
+import type { CmsEntry, CmsFormLayout } from '#nuxt-cms';
+import type { TabItem } from '@xleddyl/443-components-vue';
+import type { MaybeRefOrGetter } from 'vue';
+export type CmsEntrySettingsStatus = 'idle' | 'saving' | 'saved' | 'error';
+export type CmsEntrySettingsPart = 'columns' | 'layout';
+export declare const CMS_ENTRY_SETTINGS_TAB = "layouttab";
+export declare const CMS_ENTRY_SETTINGS_PANEL = "cms-entry-settings-panel";
+export declare const ENTRY_SETTINGS_STATUS_LABELS: Record<CmsEntrySettingsStatus, string>;
+export declare const CMS_ENTRY_KIND_ICONS: Record<CmsEntry['kind'], string>;
+export declare function useCmsSettingsEntries(): import("vue").ComputedRef<{
+    name: string;
+    label: string;
+    kind: string;
+    icon: string;
+}[]>;
+export declare function entrySettingsParts(name: string): TabItem[];
+export declare function useCmsEntrySettings(nameSource: MaybeRefOrGetter<string | undefined>): {
+    entry: import("vue").ComputedRef<CmsEntry | undefined>;
+    parts: import("vue").ComputedRef<TabItem[]>;
+    part: import("vue").WritableComputedRef<CmsEntrySettingsPart, CmsEntrySettingsPart>;
+    fields: import("vue").ComputedRef<Record<string, import("#nuxt-cms").FieldConfig>>;
+    columns: import("vue").ComputedRef<string[]>;
+    layout: import("vue").ComputedRef<CmsFormLayout>;
+    extraColumns: import("vue").ComputedRef<string[]>;
+    isCustom: import("vue").ComputedRef<boolean>;
+    status: import("vue").Ref<CmsEntrySettingsStatus, CmsEntrySettingsStatus>;
+    saveColumns: (value: string[]) => void;
+    saveLayout: (value: CmsFormLayout) => void;
+    resetPart: () => void;
+};

package/dist/runtime/app/composables/cms-entry-settings.js

@@ -0,0 +1,122 @@
+import { toast, useRouteState } from "@xleddyl/443-components-vue";
+import { computed, toValue, useState } from "#imports";
+import cmsConfig from "#cms-config";
+import { errorMessage } from "../utils/ui.js";
+import { useCmsPermissions } from "./cms-permissions.js";
+import { useCmsRuntime } from "./cms-runtime.js";
+import {
+  entryFields,
+  entryFormLayout,
+  entryListColumns,
+  listExtraColumns,
+  useCmsSettings
+} from "./cms-settings.js";
+export const CMS_ENTRY_SETTINGS_TAB = "layouttab";
+export const CMS_ENTRY_SETTINGS_PANEL = "cms-entry-settings-panel";
+export const ENTRY_SETTINGS_STATUS_LABELS = {
+  idle: "Changes save automatically",
+  saving: "Saving\u2026",
+  saved: "Saved",
+  error: "Not saved"
+};
+const KIND_LABELS = {
+  collection: "Collection",
+  single: "Single",
+  page: "Pages",
+  content: "Content"
+};
+export const CMS_ENTRY_KIND_ICONS = {
+  collection: "square-3-stack-3d",
+  single: "document-text",
+  page: "window",
+  content: "newspaper"
+};
+function configEntries() {
+  return Object.entries(cmsConfig);
+}
+export function useCmsSettingsEntries() {
+  const { can } = useCmsPermissions();
+  return computed(
+    () => can("settings.manage") ? configEntries().filter(([name]) => can(`${name}.read`)).map(([name, entry]) => ({
+      name,
+      label: entry.label,
+      kind: KIND_LABELS[entry.kind],
+      icon: entry.icon ?? CMS_ENTRY_KIND_ICONS[entry.kind]
+    })) : []
+  );
+}
+export function entrySettingsParts(name) {
+  const entry = cmsConfig[name];
+  if (!entry) return [];
+  return [
+    ...entry.kind === "collection" || entry.kind === "content" ? [{ value: "columns", label: "Table columns" }] : [],
+    { value: "layout", label: "Form layout" }
+  ];
+}
+export function useCmsEntrySettings(nameSource) {
+  const { settings, save, reset } = useCmsSettings();
+  const { i18n } = useCmsRuntime();
+  const status = useState("cms-entry-settings-status", () => "idle");
+  const tab = useRouteState(CMS_ENTRY_SETTINGS_TAB, { location: "hash", history: "replace" });
+  const name = computed(() => toValue(nameSource) ?? "");
+  const entry = computed(() => cmsConfig[name.value]);
+  const parts = computed(() => entrySettingsParts(name.value));
+  const part = computed({
+    get: () => {
+      const wanted = tab.value;
+      return parts.value.find((item) => item.value === wanted)?.value ?? parts.value[0]?.value ?? "layout";
+    },
+    set: (value) => {
+      tab.value = value === parts.value[0]?.value ? void 0 : value;
+    }
+  });
+  const fields = computed(() => entryFields(name.value));
+  const columns = computed(() => entryListColumns(name.value, settings.value, i18n));
+  const layout = computed(() => entryFormLayout(name.value, settings.value, fields.value));
+  const extraColumns = computed(() => listExtraColumns(name.value, i18n));
+  const isCustom = computed(() => {
+    const saved = settings.value[name.value];
+    return part.value === "columns" ? !!saved?.columns : !!saved?.layout;
+  });
+  function current() {
+    const saved = settings.value[name.value] ?? {};
+    return { columns: saved.columns, layout: saved.layout };
+  }
+  async function persist(next) {
+    status.value = "saving";
+    try {
+      if (!next.columns && !next.layout) await reset(name.value);
+      else await save(name.value, next);
+      status.value = "saved";
+    } catch (error) {
+      status.value = "error";
+      toast.error("Settings not saved", { description: errorMessage(error) });
+    }
+  }
+  function saveColumns(value) {
+    void persist({ ...current(), columns: value });
+  }
+  function saveLayout(value) {
+    void persist({ ...current(), layout: value });
+  }
+  function resetPart() {
+    const next = current();
+    if (part.value === "columns") next.columns = void 0;
+    else next.layout = void 0;
+    void persist(next);
+  }
+  return {
+    entry,
+    parts,
+    part,
+    fields,
+    columns,
+    layout,
+    extraColumns,
+    isCustom,
+    status,
+    saveColumns,
+    saveLayout,
+    resetPart
+  };
+}

package/dist/runtime/app/composables/cms-entry.d.ts

@@ -1,5 +1,5 @@
 import type { AsyncData } from 'nuxt/app';
-import type { CmsCollectionName, CmsCollectionTypes, CmsContentName, CmsContentTypes, CmsPagePath, CmsPageTypes, CmsSingleName, CmsSingleTypes } from '#cms-types';
+import type { CmsCollectionName, CmsCollectionTypes, CmsContentName, CmsContentRouteMatch, CmsContentTypes, CmsPagePath, CmsPageTypes, CmsSingleName, CmsSingleTypes } from '#cms-types';
 import type { CmsAsyncDataOptions } from './cms-query.js';
 export interface CmsSortInput<Entry> {
     field: Extract<keyof Entry, string>;
@@ -22,8 +22,12 @@ export interface CmsContentOptions<ResT, DefaultT> extends CmsAsyncDataOptions<R
     locale?: string;
 }
 export type CmsContentsOptions<ResT, DefaultT, Entry> = CmsCollectionOptions<ResT, DefaultT, Entry>;
+export interface CmsRouteOptions<ResT, DefaultT> extends CmsAsyncDataOptions<ResT, DefaultT> {
+    locale?: string;
+}
 export declare function useCmsSingle<K extends CmsSingleName, DefaultT = null>(name: K, options?: CmsSingleOptions<CmsSingleTypes[K] | null, DefaultT>): AsyncData<CmsSingleTypes[K] | DefaultT | null, Error | undefined>;
 export declare function useCmsCollection<K extends CmsCollectionName, DefaultT = CmsCollectionTypes[K][]>(name: K, options?: CmsCollectionOptions<CmsCollectionTypes[K][], DefaultT, CmsCollectionTypes[K]>): AsyncData<CmsCollectionTypes[K][] | DefaultT, Error | undefined>;
 export declare function useCmsContents<K extends CmsContentName, DefaultT = CmsContentTypes[K][]>(name: K, options?: CmsContentsOptions<CmsContentTypes[K][], DefaultT, CmsContentTypes[K]>): AsyncData<CmsContentTypes[K][] | DefaultT, Error | undefined>;
 export declare function useCmsContent<K extends CmsContentName, DefaultT = null>(name: K, slug: string, options?: CmsContentOptions<CmsContentTypes[K] | null, DefaultT>): AsyncData<CmsContentTypes[K] | DefaultT | null, Error | undefined>;
 export declare function useCmsPage<P extends CmsPagePath, DefaultT = null>(path: P, options?: CmsPageOptions<CmsPageTypes[P] | null, DefaultT>): AsyncData<CmsPageTypes[P] | DefaultT | null, Error | undefined>;
+export declare function useCmsRoute<DefaultT = null>(path: string, options?: CmsRouteOptions<CmsContentRouteMatch | null, DefaultT>): AsyncData<CmsContentRouteMatch | DefaultT | null, Error | undefined>;

package/dist/runtime/app/composables/cms-entry.js

@@ -3,10 +3,12 @@ import {
   cmsContentItemQueries,
   cmsContentQueries,
   cmsPageQueries,
+  cmsRouteEntries,
+  cmsRouteQuery,
   cmsSingleQueries
 } from "#cms-queries";
 import { useAsyncData } from "#imports";
-import { $cmsQuery } from "./cms-query.js";
+import { cmsPreviewKey, cmsPreviewToken, cmsQueryWithPreview } from "./cms-query.js";
 function unknownEntry(name) {
   throw new Error(`[nuxt-cms] no generated query for "${name}"; check cms.config.ts`);
 }
@@ -14,11 +16,12 @@ export function useCmsSingle(name, options = {}) {
   const { locale, key, default: fallback, ...asyncDataOptions } = options;
   const entryName = String(name);
   const query = cmsSingleQueries[entryName];
+  const preview = cmsPreviewToken();
   return useAsyncData(
-    key ?? `cms-single:${entryName}:${locale ?? ""}`,
+    key ?? cmsPreviewKey(`cms-single:${entryName}:${locale ?? ""}`, preview),
     async () => {
       if (!query) unknownEntry(entryName);
-      const result = await $cmsQuery(query, { locale });
+      const result = await cmsQueryWithPreview(query, { locale }, preview);
       return result?.[entryName] ?? null;
     },
     {
@@ -41,11 +44,12 @@ export function useCmsCollection(name, options = {}) {
   const entryName = String(name);
   const query = cmsCollectionQueries[entryName];
   const variables = { locale, filters, sort, limit, offset };
+  const preview = cmsPreviewToken();
   return useAsyncData(
-    key ?? `cms-collection:${entryName}:${JSON.stringify(variables)}`,
+    key ?? cmsPreviewKey(`cms-collection:${entryName}:${JSON.stringify(variables)}`, preview),
     async () => {
       if (!query) unknownEntry(entryName);
-      const result = await $cmsQuery(query, variables);
+      const result = await cmsQueryWithPreview(query, variables, preview);
       return result?.[entryName] ?? [];
     },
     {
@@ -68,11 +72,12 @@ export function useCmsContents(name, options = {}) {
   const entryName = String(name);
   const query = cmsContentQueries[entryName];
   const variables = { locale, filters, sort, limit, offset };
+  const preview = cmsPreviewToken();
   return useAsyncData(
-    key ?? `cms-contents:${entryName}:${JSON.stringify(variables)}`,
+    key ?? cmsPreviewKey(`cms-contents:${entryName}:${JSON.stringify(variables)}`, preview),
     async () => {
       if (!query) unknownEntry(entryName);
-      const result = await $cmsQuery(query, variables);
+      const result = await cmsQueryWithPreview(query, variables, preview);
       return result?.[entryName] ?? [];
     },
     {
@@ -85,11 +90,12 @@ export function useCmsContent(name, slug, options = {}) {
   const { locale, key, default: fallback, ...asyncDataOptions } = options;
   const entryName = String(name);
   const query = cmsContentItemQueries[entryName];
+  const preview = cmsPreviewToken();
   return useAsyncData(
-    key ?? `cms-content:${entryName}:${slug}:${locale ?? ""}`,
+    key ?? cmsPreviewKey(`cms-content:${entryName}:${slug}:${locale ?? ""}`, preview),
     async () => {
       if (!query) unknownEntry(entryName);
-      const result = await $cmsQuery(query, { slug, locale });
+      const result = await cmsQueryWithPreview(query, { slug, locale }, preview);
       return result?.item ?? null;
     },
     {
@@ -102,11 +108,12 @@ export function useCmsPage(path, options = {}) {
   const { locale, key, default: fallback, ...asyncDataOptions } = options;
   const pagePath = String(path);
   const query = cmsPageQueries[pagePath];
+  const preview = cmsPreviewToken();
   return useAsyncData(
-    key ?? `cms-page:${pagePath}:${locale ?? ""}`,
+    key ?? cmsPreviewKey(`cms-page:${pagePath}:${locale ?? ""}`, preview),
     async () => {
       if (!query) unknownEntry(pagePath);
-      const result = await $cmsQuery(query, { path: pagePath, locale });
+      const result = await cmsQueryWithPreview(query, { path: pagePath, locale }, preview);
       return result?.page ?? null;
     },
     {
@@ -115,3 +122,21 @@ export function useCmsPage(path, options = {}) {
     }
   );
 }
+export function useCmsRoute(path, options = {}) {
+  const { locale, key, default: fallback, ...asyncDataOptions } = options;
+  const preview = cmsPreviewToken();
+  return useAsyncData(
+    key ?? cmsPreviewKey(`cms-route:${path}:${locale ?? ""}`, preview),
+    async () => {
+      if (!cmsRouteQuery) return null;
+      const result = await cmsQueryWithPreview(cmsRouteQuery, { path, locale }, preview);
+      const entry = cmsRouteEntries.find((name) => result?.[name]);
+      if (!entry) return null;
+      return { entry, item: result[entry] };
+    },
+    {
+      default: fallback ?? (() => null),
+      ...asyncDataOptions
+    }
+  );
+}

package/dist/runtime/app/composables/cms-history.d.ts

@@ -0,0 +1,10 @@
+import type { CmsHistoryOptions } from '../../shared/history.js';
+export declare function useCmsHistory<S = number | null>(options: Omit<CmsHistoryOptions<S>, 'onUpdate'>): {
+    canUndo: Readonly<import("vue").Ref<boolean, boolean>>;
+    canRedo: Readonly<import("vue").Ref<boolean, boolean>>;
+    change: (key?: string, hold?: boolean) => void;
+    release: () => void;
+    undo: () => boolean;
+    redo: () => boolean;
+    reset: () => void;
+};