@hywax/cms 1.10.1 → 2.0.1

package/dist/runtime/components/InputUploraImage.vue

@@ -0,0 +1,181 @@
+<template>
+  <Primitive :as="as" :class="ui.root({ class: [props.ui?.root, props.class] })">
+    <template v-if="modelValue.image">
+      <UPopover
+        :content="{ align: 'center', side: 'top', sideOffset: 8 }"
+        :ui="{ content: 'p-1' }"
+      >
+        <CUploraImage
+          :image="modelValue.image"
+          :alt="modelValue.alt"
+          :color="modelValue.color"
+          :lqip="modelValue.lqip"
+          :class="ui.image({ class: [props.ui?.image] })"
+        />
+
+        <div v-if="!modelValue.alt" :class="ui.imageActionsWarning({ class: [props.ui?.imageActionsWarning] })">
+          <UIcon :name="appConfig.ui.icons.warning" class="size-4" />
+        </div>
+
+        <template #content>
+          <div class="flex items-center gap-0.5">
+            <UPopover :ui="{ content: 'p-1' }" @update:open="syncState">
+              <UButton
+                color="neutral"
+                size="sm"
+                variant="ghost"
+                :icon="appConfig.ui.icons.editLine"
+              />
+              <template #content>
+                <UTextarea
+                  v-model="state.alt"
+                  placeholder="Введите описание..."
+                  autoresize
+                  variant="none"
+                  size="xs"
+                />
+              </template>
+            </UPopover>
+
+            <UButton
+              color="neutral"
+              size="sm"
+              variant="ghost"
+              :icon="appConfig.ui.icons.refresh"
+              @click="resetState()"
+            />
+
+            <ButtonDeleteConfirm
+              color="error"
+              size="sm"
+              variant="ghost"
+              label=""
+              :icon="appConfig.ui.icons.trash"
+              @confirm="deleteExecute(modelValue.image)"
+            />
+          </div>
+        </template>
+      </UPopover>
+    </template>
+    <div v-else :id="id" :class="ui.uploader({ class: [props.ui?.uploader] })">
+      <template v-if="uploadStatus === 'pending'">
+        <UIcon :name="appConfig.ui.icons.loading" :class="ui.uploaderPendingIcon({ class: [props.ui?.uploaderPendingIcon] })" />
+      </template>
+      <template v-else-if="uploadStatus === 'idle'">
+        <button
+          type="button"
+          :class="ui.uploaderIdleButton({ class: [props.ui?.uploaderIdleButton] })"
+          :disabled="disabled"
+          v-bind="ariaAttrs"
+          @click="open"
+        >
+          <UAvatar :icon="appConfig.ui.icons.image" size="lg" />
+
+          <p :class="ui.uploaderIdleText({ class: [props.ui?.uploaderIdleText] })">
+            Загрузить изображение
+          </p>
+          <p :class="ui.uploaderIdleExtensions({ class: [props.ui?.uploaderIdleExtensions] })">
+            {{ extensions }}
+          </p>
+        </button>
+      </template>
+      <template v-else-if="uploadStatus === 'error'">
+        <p :class="ui.uploaderErrorText({ class: [props.ui?.uploaderErrorText] })">
+          Произошла ошибка при загрузке изображения
+        </p>
+        <div :class="ui.uploaderErrorActions({ class: [props.ui?.uploaderErrorActions] })">
+          <UButton
+            label="Отменить"
+            variant="ghost"
+            color="neutral"
+            @click="resetUpload"
+          />
+          <UButton
+            label="Повторить"
+            variant="soft"
+            color="neutral"
+            @click="uploadExecute"
+          />
+        </div>
+      </template>
+    </div>
+  </Primitive>
+</template>
+
+<script>
+import theme from "#build/cms/input-uplora-image";
+import { useAppConfig, useFormField, useUploraDelete, useUploraUpload } from "#imports";
+import { imagesExtensions } from "@uplora/formats";
+import { Primitive } from "reka-ui";
+import { computed, reactive, useId } from "vue";
+import { tv } from "../tv";
+import ButtonDeleteConfirm from "./ButtonDeleteConfirm.vue";
+</script>
+
+<script setup>
+const props = defineProps({
+  showExtensions: { type: Boolean, required: false, default: true },
+  id: { type: String, required: false },
+  name: { type: String, required: false },
+  disabled: { type: Boolean, required: false },
+  as: { type: null, required: false },
+  class: { type: null, required: false },
+  ui: { type: null, required: false }
+});
+const emit = defineEmits(["upload", "delete"]);
+const modelValue = defineModel({ type: Object, ...{
+  default: () => ({
+    image: void 0,
+    alt: void 0,
+    lqip: void 0,
+    color: void 0
+  })
+} });
+const appConfig = useAppConfig();
+const extensions = computed(() => imagesExtensions.filter((extension) => extension !== "jpeg").join(", "));
+const state = reactive({
+  alt: modelValue.value.alt
+});
+const { id: _id, disabled, emitFormChange, emitFormInput, ariaAttrs } = useFormField(props);
+const id = _id.value ?? useId();
+const { open, execute: uploadExecute, status: uploadStatus, reset: resetUpload, onUploaded } = useUploraUpload({
+  accept: "image/*"
+});
+const { execute: deleteExecute, onDeleted } = useUploraDelete();
+function syncState() {
+  modelValue.value = {
+    ...modelValue.value,
+    alt: state.alt || void 0
+  };
+}
+function resetState() {
+  modelValue.value = {
+    image: void 0,
+    alt: void 0,
+    lqip: void 0,
+    color: void 0
+  };
+  emitFormChange();
+  emitFormInput();
+}
+onUploaded((file) => {
+  modelValue.value = {
+    ...modelValue.value,
+    image: file.id,
+    lqip: file.lqip,
+    color: file.color
+  };
+  emit("upload", modelValue.value);
+  emitFormChange();
+  emitFormInput();
+});
+onDeleted(() => {
+  resetUpload();
+  resetState();
+  emit("delete");
+});
+const ui = computed(() => tv({ extend: tv(theme), ...appConfig.cms?.inputUploraImage || {} })({
+  disabled: disabled.value,
+  uploaded: modelValue.value.image !== ""
+}));
+</script>

package/dist/runtime/components/InputUploraImage.vue.d.ts

@@ -0,0 +1,40 @@
+import type { AppConfig } from '@nuxt/schema';
+import type { ComponentConfig } from '../types';
+import theme from '#build/cms/input-uplora-image';
+type InputUploraImage = ComponentConfig<typeof theme, AppConfig, 'inputUploraImage'>;
+export interface InputUploraImageProps {
+    showExtensions?: boolean;
+    id?: string;
+    name?: string;
+    disabled?: boolean;
+    as?: any;
+    class?: any;
+    ui?: InputUploraImage['slots'];
+}
+export interface InputUploraImageEmits {
+    upload: [InputUploraImageModelValue];
+    delete: [];
+}
+export interface InputUploraImageModelValue {
+    image?: string;
+    alt?: string;
+    color?: string;
+    lqip?: string;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<InputUploraImageProps & {
+    modelValue?: InputUploraImageModelValue;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    delete: () => any;
+    "update:modelValue": (value: InputUploraImageModelValue) => any;
+    upload: (args_0: InputUploraImageModelValue) => any;
+}, string, import("vue").PublicProps, Readonly<InputUploraImageProps & {
+    modelValue?: InputUploraImageModelValue;
+}> & Readonly<{
+    onDelete?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: InputUploraImageModelValue) => any) | undefined;
+    onUpload?: ((args_0: InputUploraImageModelValue) => any) | undefined;
+}>, {
+    showExtensions: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/ModalConfirm.d.vue.ts

@@ -9,7 +9,6 @@ export interface ModalConfirmProps {
     confirmText?: string;
     confirmLabel?: string;
     color?: ButtonProps['color'];
-    variant?: ButtonProps['variant'];
     size?: ButtonProps['size'];
     onConfirm?: () => Promise<any> | any;
     class?: any;

package/dist/runtime/components/ModalConfirm.vue

@@ -48,7 +48,6 @@
         :disabled="state.confirmTextValue !== confirmText"
         :loading="form?.loading"
         :color="color"
-        :variant="variant"
         :size="size"
       />
       <UButton
@@ -56,7 +55,6 @@
         label="Подтвердить"
         loading-auto
         :color="color"
-        :variant="variant"
         :size="size"
         @click="handleConfirmClick()"
       />
@@ -66,7 +64,8 @@
 
 <script>
 import theme from "#build/cms/modal-confirm";
-import { computed, reactive, useAppConfig, useTemplateRef } from "#imports";
+import { useAppConfig } from "#imports";
+import { computed, reactive, useTemplateRef } from "vue";
 import { tv } from "../tv";
 </script>
 
@@ -77,7 +76,6 @@ const props = defineProps({
   confirmText: { type: String, required: false },
   confirmLabel: { type: String, required: false, default: "\u041F\u043E\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u0442\u044C" },
   color: { type: null, required: false },
-  variant: { type: null, required: false },
   size: { type: null, required: false, default: "lg" },
   onConfirm: { type: Function, required: false },
   class: { type: null, required: false },

package/dist/runtime/components/ModalConfirm.vue.d.ts

@@ -9,7 +9,6 @@ export interface ModalConfirmProps {
     confirmText?: string;
     confirmLabel?: string;
     color?: ButtonProps['color'];
-    variant?: ButtonProps['variant'];
     size?: ButtonProps['size'];
     onConfirm?: () => Promise<any> | any;
     class?: any;

package/dist/runtime/components/TableColumnVisibility.vue

@@ -47,11 +47,10 @@
 </template>
 
 <script setup>
-import { useAppConfig, useRoute } from "#imports";
+import { getCmsStorageKey, useAppConfig, useRoute } from "#imports";
 import { syncRef, useLocalStorage } from "@vueuse/core";
 import { useSortable } from "@vueuse/integrations/useSortable";
 import { computed, ref, useTemplateRef, watch } from "vue";
-import { getCmsStorageKey } from "../utils";
 const props = defineProps({
   storageKey: { type: String, required: false, default: () => useRoute().name },
   table: { type: Object, required: false }

package/dist/runtime/components/TableFilters.d.vue.ts

@@ -1,7 +1,7 @@
 import type { FormData, FormFieldProps, FormProps, FormSchema, SelectItem, SelectProps, SelectValue } from '@nuxt/ui';
 import type { MaybeRef, VNode } from 'vue';
 import type { KeysMatching } from '../types';
-import type { Props as DatePickerProps } from './DatePicker.vue';
+import type { DatePickerProps } from './DatePicker.vue';
 type EnumSelectItem = SelectValue | Required<Pick<Extract<SelectItem, object>, 'value' | 'label'>>;
 interface Presets {
     Input: {

package/dist/runtime/components/TableFilters.vue

@@ -53,7 +53,7 @@
         <UButton
           color="neutral"
           label="Сбросить"
-          variant="outline"
+          variant="ghost"
           @click="reset"
         />
 
@@ -69,55 +69,56 @@
 </template>
 
 <script>
-import { LazyCDatePicker, LazyUCheckbox, LazyUInput, LazyUSelect, LazyUSwitch, UForm } from "#components";
+import { UCheckbox, UForm, UInput, USelect, USwitch } from "#components";
 import { useAppConfig } from "#imports";
 import { useCloned } from "@vueuse/core";
-import copy from "fast-copy";
+import { copy } from "fast-copy";
 import { deepEqual } from "fast-equals";
 import { computed, h, nextTick, ref, toValue, unref, useId, useTemplateRef, watch } from "vue";
+import CDatePicker from "./DatePicker.vue";
 const presets = {
-  Date: (state, field) => h(LazyCDatePicker, {
+  Date: (state, field) => h(CDatePicker, {
     "modelValue": state[field.name],
     "withTime": toValue(field.withTime),
     "onUpdate:modelValue": (value) => state[field.name] = value
   }),
-  DateRange: (state, field) => h(LazyCDatePicker, {
+  DateRange: (state, field) => h(CDatePicker, {
     "modelValue": state[field.name],
     "range": true,
     "withTime": unref(field.withTime),
     "onUpdate:modelValue": (value) => state[field.name] = value
   }),
-  Input: (state, field) => h(LazyUInput, {
+  Input: (state, field) => h(UInput, {
     "modelValue": state[field.name],
     "modelModifiers": { trim: true, optional: true },
     "placeholder": unref(field.placeholder) ?? `\u0412\u0432\u0435\u0434\u0438\u0442\u0435 ${field.label?.toLowerCase() ?? "\u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435"}`,
     "onUpdate:modelValue": (value) => state[field.name] = value
   }, {}),
-  InputNumber: (state, field) => h(LazyUInput, {
+  InputNumber: (state, field) => h(UInput, {
     "modelValue": state[field.name],
     "modelModifiers": { number: true, optional: true },
     "placeholder": unref(field.placeholder) ?? `\u0412\u0432\u0435\u0434\u0438\u0442\u0435 ${field.label?.toLowerCase() ?? "\u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435"}`,
     "onUpdate:modelValue": (value) => state[field.name] = value
   }, {}),
-  Select: (state, field) => h(LazyUSelect, {
+  Select: (state, field) => h(USelect, {
     "modelValue": state[field.name],
     "items": unref(field.items),
     "placeholder": unref(field.placeholder) ?? `\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 ${field.label?.toLowerCase() ?? "\u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435"}`,
     "onUpdate:modelValue": (value) => state[field.name] = value
   }, {}),
-  MultiSelect: (state, field) => h(LazyUSelect, {
+  MultiSelect: (state, field) => h(USelect, {
     "modelValue": state[field.name],
     "items": unref(field.items),
     "placeholder": unref(field.placeholder) ?? `\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 ${field.label?.toLowerCase() ?? "\u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435"}`,
     "multiple": true,
     "onUpdate:modelValue": (value) => state[field.name] = value
   }, {}),
-  Checkbox: (state, field) => h(LazyUCheckbox, {
+  Checkbox: (state, field) => h(UCheckbox, {
     "modelValue": state[field.name],
     "label": unref(field.label),
     "onUpdate:modelValue": (value) => state[field.name] = Boolean(value) || void 0
   }),
-  Switch: (state, field) => h(LazyUSwitch, {
+  Switch: (state, field) => h(USwitch, {
     "modelValue": state[field.name],
     "label": unref(field.label),
     "onUpdate:modelValue": (value) => state[field.name] = value || void 0

package/dist/runtime/components/TableFilters.vue.d.ts

@@ -1,7 +1,7 @@
 import type { FormData, FormFieldProps, FormProps, FormSchema, SelectItem, SelectProps, SelectValue } from '@nuxt/ui';
 import type { MaybeRef, VNode } from 'vue';
 import type { KeysMatching } from '../types';
-import type { Props as DatePickerProps } from './DatePicker.vue';
+import type { DatePickerProps } from './DatePicker.vue';
 type EnumSelectItem = SelectValue | Required<Pick<Extract<SelectItem, object>, 'value' | 'label'>>;
 interface Presets {
     Input: {

package/dist/runtime/components/TablePanel.vue

@@ -128,15 +128,15 @@
 
 <script>
 import theme from "#build/cms/table-panel";
-import { LazyCModalConfirm, LazyUDropdownMenu, UButton, UCheckbox, UTable } from "#components";
-import { useAppConfig } from "#imports";
-import { useOverlay } from "@nuxt/ui/composables/useOverlay";
+import { UButton, UCheckbox, UDropdownMenu, UTable } from "#components";
+import { useAppConfig, useOverlay } from "#imports";
 import { getGroupedRowModel } from "@tanstack/vue-table";
 import { reactivePick } from "@vueuse/core";
 import { defu } from "defu";
 import { useForwardProps } from "reka-ui";
 import { computed, h, ref, useTemplateRef, watch } from "vue";
 import { tv } from "../tv";
+import CModalConfirm from "./ModalConfirm.vue";
 import TableColumnSorting from "./TableColumnSorting.vue";
 import TableColumnVisibility from "./TableColumnVisibility.vue";
 import TableFilters from "./TableFilters.vue";
@@ -187,7 +187,7 @@ watch(() => props.resetRowSelection && props.data, (value) => {
 watch(() => props.data, () => {
   tableRef.value?.tableRef?.parentElement?.scrollTo({ top: 0 });
 });
-const modalConfirm = useOverlay().create(LazyCModalConfirm);
+const modalConfirm = useOverlay().create(CModalConfirm);
 function createActionCell(action) {
   if (action.visibility && !action.visibility()) {
     return;
@@ -205,7 +205,7 @@ function createActionCell(action) {
       onClick: () => modalConfirm.open(defu(action.delete, {
         title: "\u0423\u0434\u0430\u043B\u0435\u043D\u0438\u0435",
         message: "\u0412\u044B \u0434\u0435\u0438\u0306\u0441\u0442\u0432\u0438\u0442\u0435\u043B\u044C\u043D\u043E \u0445\u043E\u0442\u0438\u0442\u0435 \u0443\u0434\u0430\u043B\u0438\u0442\u044C \u044D\u043B\u0435\u043C\u0435\u043D\u0442?",
-        confirmButton: { color: "error", label: "\u0423\u0434\u0430\u043B\u0438\u0442\u044C" }
+        color: "error"
       }))
     };
   }
@@ -229,7 +229,7 @@ const tableColumns = computed(() => {
           return;
         }
         return h(
-          LazyUDropdownMenu,
+          UDropdownMenu,
           {
             items,
             content: { align: "end" }

package/dist/runtime/components/UploraImage.d.vue.ts

@@ -5,10 +5,11 @@ import theme from '#build/cms/uplora-image';
 export type UploraImage = ComponentConfig<typeof theme, AppConfig, 'uploraImage'>;
 export interface UploraImageProps {
     image: string;
-    alt: string;
+    alt?: string;
     formats?: ImageFormat[];
     sizes?: ImageSize[];
     lqip?: string;
+    color?: string;
     loading?: 'lazy' | 'eager';
     preload?: boolean | {
         fetchPriority: 'auto' | 'high' | 'low';

package/dist/runtime/components/UploraImage.vue

@@ -1,10 +1,11 @@
 <template>
   <figure :class="ui.root({ class: [props.ui?.root, props.class] })">
     <div
-      v-if="lqip"
+      v-if="lqip || color"
       :class="ui.lqip({ class: props.ui?.lqip })"
       :style="{
-  backgroundImage: `url(${lqip})`
+  backgroundColor: color,
+  backgroundImage: lqip ? `url(${lqip})` : void 0
 }"
     />
     <picture :class="ui.picture({ class: props.ui?.picture })">
@@ -32,7 +33,8 @@
 
 <script>
 import theme from "#build/cms/uplora-image";
-import { computed, onMounted, useAppConfig, useHead, useNuxtApp, useTemplateRef } from "#imports";
+import { useAppConfig, useHead, useNuxtApp } from "#imports";
+import { computed, onMounted, useTemplateRef } from "vue";
 import { tv } from "../tv";
 import { buildUploraImage } from "../utils";
 </script>
@@ -40,10 +42,11 @@ import { buildUploraImage } from "../utils";
 <script setup>
 const props = defineProps({
   image: { type: String, required: true },
-  alt: { type: String, required: true },
+  alt: { type: String, required: false },
   formats: { type: Array, required: false },
   sizes: { type: Array, required: false },
   lqip: { type: String, required: false },
+  color: { type: String, required: false },
   loading: { type: String, required: false, default: "lazy" },
   preload: { type: [Boolean, Object], required: false },
   nonce: { type: String, required: false },

package/dist/runtime/components/UploraImage.vue.d.ts

@@ -5,10 +5,11 @@ import theme from '#build/cms/uplora-image';
 export type UploraImage = ComponentConfig<typeof theme, AppConfig, 'uploraImage'>;
 export interface UploraImageProps {
     image: string;
-    alt: string;
+    alt?: string;
     formats?: ImageFormat[];
     sizes?: ImageSize[];
     lqip?: string;
+    color?: string;
     loading?: 'lazy' | 'eager';
     preload?: boolean | {
         fetchPriority: 'auto' | 'high' | 'low';

package/dist/runtime/components/prose/UploraImage.d.vue.ts

@@ -3,9 +3,9 @@ import type { ComponentConfig } from '../../types';
 import theme from '#build/cms/prose/uplora-image';
 export type ProseUploraImage = ComponentConfig<typeof theme, AppConfig, 'uploraImage', 'cms.prose'>;
 export interface ProseUploraImageProps {
-    image: string;
-    alt: string;
-    lqip?: string;
+    image?: string;
+    alt?: string;
+    color?: string;
     class?: any;
     ui?: ProseUploraImage['slots'];
 }

package/dist/runtime/components/prose/UploraImage.vue

@@ -4,25 +4,31 @@
     :image="image"
     :class="ui.base({ class: [props.ui?.base, props.class] })"
     :alt="alt"
-    :lqip="lqip"
+    :color="color"
+    :formats="formats"
+    :sizes="sizes"
   />
 </template>
 
 <script>
 import theme from "#build/cms/prose/uplora-image";
-import { computed, useAppConfig } from "#imports";
+import { getCmsConfig, useAppConfig } from "#imports";
+import { computed } from "vue";
 import { tv } from "../../tv";
 import BaseUploraImage from "../UploraImage.vue";
 </script>
 
 <script setup>
 const props = defineProps({
-  image: { type: String, required: true },
-  alt: { type: String, required: true },
-  lqip: { type: String, required: false },
+  image: { type: String, required: false },
+  alt: { type: String, required: false },
+  color: { type: String, required: false },
   class: { type: null, required: false },
   ui: { type: null, required: false }
 });
 const appConfig = useAppConfig();
+const cmsConfig = getCmsConfig();
+const formats = cmsConfig?.prose?.uploraImage?.formats.length > 0 ? cmsConfig?.prose?.uploraImage?.formats : void 0;
+const sizes = cmsConfig?.prose?.uploraImage?.sizes.length > 0 ? cmsConfig?.prose?.uploraImage?.sizes : void 0;
 const ui = computed(() => tv({ extend: tv(theme), ...appConfig.cms?.prose?.uploraImage || {} })());
 </script>

package/dist/runtime/components/prose/UploraImage.vue.d.ts

@@ -3,9 +3,9 @@ import type { ComponentConfig } from '../../types';
 import theme from '#build/cms/prose/uplora-image';
 export type ProseUploraImage = ComponentConfig<typeof theme, AppConfig, 'uploraImage', 'cms.prose'>;
 export interface ProseUploraImageProps {
-    image: string;
-    alt: string;
-    lqip?: string;
+    image?: string;
+    alt?: string;
+    color?: string;
     class?: any;
     ui?: ProseUploraImage['slots'];
 }

package/dist/runtime/composables/useEditorDragHandle.d.ts

@@ -1,6 +1,7 @@
 import type { DropdownMenuItem, EditorCustomHandlers } from '@nuxt/ui';
 import type { Editor, JSONContent } from '@tiptap/vue-3';
-export declare function useEditorDragHandle<T extends EditorCustomHandlers>(customHandlers?: T): {
+import type { MaybeRefOrGetter } from 'vue';
+export declare function useEditorDragHandle<T extends EditorCustomHandlers>(customHandlers?: MaybeRefOrGetter<T>): {
     selectedNode: import("vue").Ref<{
         node: JSONContent | null;
         pos: number;

package/dist/runtime/composables/useEditorDragHandle.js

@@ -1,7 +1,7 @@
 import { useAppConfig } from "#imports";
 import { mapEditorItems } from "@nuxt/ui/utils/editor";
 import { upperFirst } from "scule";
-import { ref } from "vue";
+import { ref, toValue } from "vue";
 export function useEditorDragHandle(customHandlers) {
   const appConfig = useAppConfig();
   const selectedNode = ref();
@@ -82,7 +82,7 @@ export function useEditorDragHandle(customHandlers) {
           icon: appConfig.ui.icons.trash
         }
       ]
-    ], customHandlers);
+    ], toValue(customHandlers));
   };
   const onNodeChange = (event) => {
     selectedNode.value = event;

package/dist/runtime/composables/useEditorSuggestions.d.ts

@@ -1,5 +1,6 @@
 import type { EditorCustomHandlers } from '@nuxt/ui';
-export declare function useEditorSuggestions<T extends EditorCustomHandlers>(_customHandlers?: T): {
+import type { MaybeRefOrGetter } from 'vue';
+export declare function useEditorSuggestions<T extends EditorCustomHandlers>(_customHandlers?: MaybeRefOrGetter<T>): {
     items: (({
         type: "label";
         label: string;
@@ -64,5 +65,10 @@ export declare function useEditorSuggestions<T extends EditorCustomHandlers>(_cu
         label: string;
         icon: any;
         type?: undefined;
+    } | {
+        kind: "uplora-image";
+        label: string;
+        icon: any;
+        type?: undefined;
     })[])[];
 };

package/dist/runtime/composables/useEditorSuggestions.js

@@ -15,7 +15,8 @@ export function useEditorSuggestions(_customHandlers) {
     ],
     [
       { type: "label", label: "\u0412\u0441\u0442\u0430\u0432\u0438\u0442\u044C" },
-      { kind: "horizontalRule", label: "\u0413\u043E\u0440\u0438\u0437\u043E\u043D\u0442\u0430\u043B\u044C\u043D\u0430\u044F \u043B\u0438\u043D\u0438\u044F", icon: appConfig.ui.icons.horizontalRule }
+      { kind: "horizontalRule", label: "\u0413\u043E\u0440\u0438\u0437\u043E\u043D\u0442\u0430\u043B\u044C\u043D\u0430\u044F \u043B\u0438\u043D\u0438\u044F", icon: appConfig.ui.icons.horizontalRule },
+      { kind: "uplora-image", label: "\u0418\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0435", icon: appConfig.ui.icons.image }
     ]
   ];
   return {

package/dist/runtime/composables/useEditorToolbar.d.ts

@@ -1,6 +1,7 @@
 import type { EditorCustomHandlers, EditorToolbarItem } from '@nuxt/ui';
 import type { Editor } from '@tiptap/vue-3';
-export declare function useEditorToolbar<T extends EditorCustomHandlers>(_customHandlers?: T): {
+import type { MaybeRefOrGetter } from 'vue';
+export declare function useEditorToolbar<T extends EditorCustomHandlers>(_customHandlers?: MaybeRefOrGetter<T>): {
     toolbarItems: EditorToolbarItem<T>[][];
     bubbleToolbarItems: import("vue").ComputedRef<({
         label: string;

package/dist/runtime/composables/useFormState.js

@@ -1,11 +1,11 @@
 import { createEventHook, useCloned } from "@vueuse/core";
-import clone from "fast-copy";
+import { copy } from "fast-copy";
 import { computed, ref, toValue } from "vue";
 import { useNotification } from "./useNotification.js";
 export function useFormState(schema, source = {}, options) {
   const notification = useNotification();
   const submitHook = createEventHook();
-  const { cloned: state, isModified, sync: reset } = useCloned(source, { clone });
+  const { cloned: state, isModified, sync: reset } = useCloned(source, { clone: copy });
   const isLoading = ref(false);
   const onSubmit = async (event) => {
     isLoading.value = true;

package/dist/runtime/composables/useModal.js

@@ -1,4 +1,4 @@
-import { useOverlay } from "@nuxt/ui/composables/useOverlay";
+import { useOverlay } from "#imports";
 import { toValue } from "vue";
 export function useModal(component, defaultProps) {
   const { open: _open, close } = useOverlay().create(component);