@hywax/cms 3.4.1 → 3.4.3

package/.nuxt/cms/config.ts

@@ -3,11 +3,14 @@ const cmsConfig = {
   "formats": {
     "serverDateTime": "YYYY-MM-DD HH:mm:ss"
   },
-  "prose": {
-    "enabled": true,
+  "components": {
     "uploraImage": {
-      "formats": [],
-      "sizes": []
+      "formats": []
+    },
+    "prose": {
+      "uploraImage": {
+        "sizes": []
+      }
     }
   }
 }

package/.nuxt/cms/prose/uplora-image.ts

@@ -1,5 +1,5 @@
 export default {
   "slots": {
-    "base": ""
+    "base": "rounded-lg"
   }
 }

package/.nuxt/cms.css

@@ -4,9 +4,10 @@
 @source "./cms/form-slug.ts";
 @source "./cms/form-uplora-image.ts";
 @source "./cms/uplora-image.ts";
+@source "./cms/button-delete-confirm.ts";
+@source "./cms/modal-confirm.ts";
 @source "./cms/form-seo.ts";
 @source "./cms/table-panel.ts";
-@source "./cms/modal-confirm.ts";
 @source "./cms/table-search-input.ts";
 
     

package/dist/module.d.mts

@@ -50,14 +50,20 @@ interface CMSCoreOptions {
     formats?: {
         serverDateTime?: string;
     };
-    /**
-     * Prose configuration
-     */
-    prose?: {
-        enabled?: boolean;
+    components?: {
+        /**
+         * Uplora image configuration
+         */
         uploraImage?: {
             formats?: ImageFormat[];
-            sizes?: ImageSize[];
+        };
+        /**
+         * Prose configuration
+         */
+        prose?: {
+            uploraImage?: {
+                sizes?: ImageSize[];
+            };
         };
     };
 }

package/dist/module.json

@@ -1,6 +1,6 @@
 {
   "name": "@hywax/cms",
-  "version": "3.4.1",
+  "version": "3.4.3",
   "configKey": "cms",
   "builder": {
     "@nuxt/module-builder": "1.0.2",

package/dist/module.mjs

@@ -7,7 +7,7 @@ import { pascalCase, kebabCase, camelCase } from 'scule';
 import { globSync } from 'tinyglobby';
 
 const name = "@hywax/cms";
-const version = "3.4.1";
+const version = "3.4.3";
 
 function createContext(options, nuxt) {
   const { resolve } = createResolver(import.meta.url);
@@ -31,6 +31,19 @@ const defaultModuleOptions = {
   envPrefix: "APP_",
   unovis: false,
   componentDetection: true,
+  components: {
+    uploraImage: {
+      formats: []
+    },
+    prose: {
+      uploraImage: {
+        sizes: []
+      }
+    }
+  },
+  formats: {
+    serverDateTime: "YYYY-MM-DD HH:mm:ss"
+  },
   httpStatuses: {
     badRequest: {
       code: 400,
@@ -80,16 +93,6 @@ const defaultModuleOptions = {
       code: 503,
       message: "\u0421\u0435\u0440\u0432\u0438\u0441 \u043D\u0435\u0434\u043E\u0441\u0442\u0443\u043F\u0435\u043D"
     }
-  },
-  formats: {
-    serverDateTime: "YYYY-MM-DD HH:mm:ss"
-  },
-  prose: {
-    enabled: true,
-    uploraImage: {
-      formats: [],
-      sizes: []
-    }
   }
 };
 
@@ -560,7 +563,7 @@ const theme = {
 
 const uploraImage = {
   slots: {
-    base: ""
+    base: "rounded-lg"
   }
 };
 
@@ -607,7 +610,7 @@ async function getAppTemplates({ options, resolve, nuxt, detectedComponents: con
     }
   }
   async function generateSources() {
-    const sources2 = [];
+    const sources = [];
     const layers = getLayerDirectories(nuxt).map((layer) => layer.app);
     if (options.componentDetection) {
       const detectedComponents = await detectUsedComponents({
@@ -628,14 +631,12 @@ async function getAppTemplates({ options, resolve, nuxt, detectedComponents: con
           logger.success(`CMS detected ${detectedComponents.size} components in use (including dependencies)`);
         }
         previousDetectedComponents = detectedComponents;
-        if (options.prose?.enabled) {
-          sources2.push('@source "./cms/prose";');
-        }
+        sources.push('@source "./cms/prose";');
         for (const component of detectedComponents) {
           const kebabComponent = kebabCase(component);
           const camelComponent = camelCase(component);
           if (theme[camelComponent]) {
-            sources2.push(`@source "./cms/${kebabComponent}.ts";`);
+            sources.push(`@source "./cms/${kebabComponent}.ts";`);
           }
           contextDetectedComponents.add(component);
         }
@@ -644,27 +645,26 @@ async function getAppTemplates({ options, resolve, nuxt, detectedComponents: con
           logger.info("CMS detected no components in use, including all components");
         }
         previousDetectedComponents = /* @__PURE__ */ new Set();
-        sources2.push('@source "./cms";');
+        sources.push('@source "./cms";');
       }
     } else {
-      sources2.push('@source "./cms";');
+      sources.push('@source "./cms";');
     }
-    return sources2.join("\n");
-  }
-  if (options.prose?.enabled) {
-    templates.push({
-      filename: `cms/prose/index.ts`,
-      write: true,
-      getContents: () => Object.keys(themeProse).map((component) => `export { default as ${component} } from './${kebabCase(component)}'`).join("\n")
-    });
-    writeThemeTemplate(themeProse, "prose");
+    return sources.join("\n");
   }
+  templates.push({
+    filename: `cms/prose/index.ts`,
+    write: true,
+    getContents: () => Object.keys(themeProse).map((component) => `export { default as ${component} } from './${kebabCase(component)}'`).join("\n")
+  });
+  writeThemeTemplate(themeProse, "prose");
   writeThemeTemplate(theme);
-  const sources = await generateSources();
+  await generateSources();
   templates.push({
     filename: "cms.css",
     write: true,
     getContents: async () => {
+      const sources = await generateSources();
       return `${sources}
 ${options.unovis ? `
     @layer components {
@@ -704,7 +704,7 @@ ${options.unovis ? `
     write: true,
     getContents: () => [
       ...Object.keys(theme).map((component) => `export { default as ${component} } from './${kebabCase(component)}'`),
-      ...options.prose?.enabled ? [`export * as prose from './prose'`] : []
+      `export * as prose from './prose'`
     ].join("\n")
   });
   templates.push({
@@ -744,7 +744,7 @@ export {}
       const config = {
         name: options.name,
         formats: options.formats,
-        prose: options.prose
+        components: options.components
       };
       return `const cmsConfig = ${JSON.stringify(config, null, 2)}
 

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

@@ -4,10 +4,10 @@ import type { ComponentProps } from 'vue-component-type-helpers';
 import type { ComponentConfig } from '../types';
 import type { ModalConfirmEmits, ModalConfirmProps } from './ModalConfirm.vue';
 import theme from '#build/cms/button-delete-confirm';
-import ModalConfirm from './ModalConfirm.vue';
+import CModalConfirm from './ModalConfirm.vue';
 type ButtonDelete = ComponentConfig<typeof theme, AppConfig, 'buttonDelete'>;
 export interface ButtonDeleteProps extends Pick<ModalConfirmProps, 'onConfirm'> {
-    modalProps?: Omit<ModalProps & ComponentProps<typeof ModalConfirm>, 'title' | 'message' | 'onConfirm' | 'confirmButton'>;
+    modalProps?: Omit<ModalProps & ComponentProps<typeof CModalConfirm>, 'title' | 'message' | 'onConfirm' | 'confirmButton'>;
     confirmText?: string;
     confirmLabel?: string;
     title?: string;

package/dist/runtime/components/ButtonDeleteConfirm.vue

@@ -24,7 +24,7 @@ import theme from "#build/cms/button-delete-confirm";
 import { useAppConfig, useOverlay } from "#imports";
 import { computed } from "vue";
 import { tv } from "../tv";
-import ModalConfirm from "./ModalConfirm.vue";
+import CModalConfirm from "./ModalConfirm.vue";
 </script>
 
 <script setup>
@@ -46,7 +46,7 @@ const props = defineProps({
 });
 defineEmits(["confirm", "close"]);
 const appConfig = useAppConfig();
-const modal = useOverlay().create(ModalConfirm);
+const modal = useOverlay().create(CModalConfirm);
 function handleDeleteClick() {
   return modal.open({
     ...props.modalProps,

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

@@ -4,10 +4,10 @@ import type { ComponentProps } from 'vue-component-type-helpers';
 import type { ComponentConfig } from '../types';
 import type { ModalConfirmEmits, ModalConfirmProps } from './ModalConfirm.vue';
 import theme from '#build/cms/button-delete-confirm';
-import ModalConfirm from './ModalConfirm.vue';
+import CModalConfirm from './ModalConfirm.vue';
 type ButtonDelete = ComponentConfig<typeof theme, AppConfig, 'buttonDelete'>;
 export interface ButtonDeleteProps extends Pick<ModalConfirmProps, 'onConfirm'> {
-    modalProps?: Omit<ModalProps & ComponentProps<typeof ModalConfirm>, 'title' | 'message' | 'onConfirm' | 'confirmButton'>;
+    modalProps?: Omit<ModalProps & ComponentProps<typeof CModalConfirm>, 'title' | 'message' | 'onConfirm' | 'confirmButton'>;
     confirmText?: string;
     confirmLabel?: string;
     title?: string;

package/dist/runtime/components/EditorFull.vue

@@ -72,7 +72,7 @@
 }"
     >
       <template #link>
-        <EditorLinkPopover :editor="editor" />
+        <CEditorLinkPopover :editor="editor" />
       </template>
     </UEditorToolbar>
 
@@ -93,7 +93,7 @@ import { useEditorDragHandle } from "../composables/useEditorDragHandle";
 import { useEditorSuggestions } from "../composables/useEditorSuggestions";
 import { useEditorToolbar } from "../composables/useEditorToolbar";
 import { UploraImage as UploraImageExtension, UploraImageHandlers } from "../editor/uplora-image/EditorUploraImage";
-import EditorLinkPopover from "./EditorLinkPopover.vue";
+import CEditorLinkPopover from "./EditorLinkPopover.vue";
 </script>
 
 <script setup>

package/dist/runtime/components/FormUploraImage.vue

@@ -27,7 +27,7 @@
                   @click="resetState()"
                 />
 
-                <ButtonDeleteConfirm
+                <CButtonDeleteConfirm
                   color="error"
                   size="sm"
                   variant="ghost"
@@ -103,7 +103,7 @@ import { imagesExtensions } from "@uplora/formats";
 import { computed, useId } from "vue";
 import { z } from "zod";
 import { tv } from "../tv";
-import ButtonDeleteConfirm from "./ButtonDeleteConfirm.vue";
+import CButtonDeleteConfirm from "./ButtonDeleteConfirm.vue";
 </script>
 
 <script setup>

package/dist/runtime/components/TablePanel.vue

@@ -16,18 +16,18 @@
         <template #right>
           <slot name="toolbar-right" />
 
-          <TableColumnVisibility
+          <CTableColumnVisibility
             v-model:visibility="columnVisibility"
             v-model:order="columnOrder"
             :table="tableRef?.tableApi"
             :storage-key="storageKey"
           />
-          <TableColumnSorting
+          <CTableColumnSorting
             :model-value="sorting"
             :table="tableRef?.tableApi"
             @update:model-value="emit('update:sorting', $event)"
           />
-          <TableFilters
+          <CTableFilters
             v-if="props.filtersSource"
             :model-value="props.filters"
             :schema="props.filtersSchema"
@@ -43,7 +43,7 @@
             >
               <slot :name="pageTableSlot" v-bind="slotData" />
             </template>
-          </TableFilters>
+          </CTableFilters>
         </template>
       </UDashboardToolbar>
     </template>
@@ -137,9 +137,9 @@ 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";
+import CTableColumnSorting from "./TableColumnSorting.vue";
+import CTableColumnVisibility from "./TableColumnVisibility.vue";
+import CTableFilters from "./TableFilters.vue";
 </script>
 
 <script setup>

package/dist/runtime/components/TablePreviewLink.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="relative flex items-center gap-2">
     <div v-if="image" class="overflow-hidden rounded-lg shrink-0">
-      <UploraImage
+      <CUploraImage
         v-bind="image"
         :sizes="[{ width: 32, height: 32, descriptor: '1x' }]"
         :ui="{ picture: 'aspect-square' }"
@@ -27,7 +27,7 @@
 </template>
 
 <script setup>
-import UploraImage from "./UploraImage.vue";
+import CUploraImage from "./UploraImage.vue";
 defineProps({
   to: { type: null, required: false },
   target: { type: [String, Object, null], required: false },

package/dist/runtime/components/UploraImage.vue

@@ -33,7 +33,7 @@
 
 <script>
 import theme from "#build/cms/uplora-image";
-import { useAppConfig, useHead, useNuxtApp } from "#imports";
+import { getCmsConfig, useAppConfig, useHead, useNuxtApp } from "#imports";
 import { computed, onMounted, useTemplateRef } from "vue";
 import { tv } from "../tv";
 import { buildUploraImage } from "../utils";
@@ -55,11 +55,13 @@ const props = defineProps({
   ui: { type: null, required: false }
 });
 const emit = defineEmits(["load", "error"]);
+const appConfig = useAppConfig();
+const cmsConfig = getCmsConfig();
 const nuxtApp = useNuxtApp();
 const initialLoad = nuxtApp.isHydrating;
 const image = computed(() => buildUploraImage({
   id: props.image,
-  formats: props.formats,
+  formats: props.formats ?? cmsConfig?.components?.uploraImage?.formats,
   sizes: props.sizes
 }));
 const sources = computed(() => {
@@ -106,6 +108,5 @@ onMounted(() => {
     emit("error", event);
   };
 });
-const appConfig = useAppConfig();
 const ui = computed(() => tv({ extend: tv(theme), ...appConfig.cms?.uploraImage || {} })());
 </script>

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

@@ -1,11 +1,12 @@
 import type { AppConfig } from '@nuxt/schema';
-import type { ComponentConfig } from '../../types';
+import type { ComponentConfig, ImageSize } 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;
     color?: string;
+    sizes?: ImageSize[];
     class?: any;
     ui?: ProseUploraImage['slots'];
 }

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

@@ -5,7 +5,6 @@
     :class="ui.base({ class: [props.ui?.base, props.class] })"
     :alt="alt"
     :color="color"
-    :formats="formats"
     :sizes="sizes"
   />
 </template>
@@ -23,12 +22,12 @@ const props = defineProps({
   image: { type: String, required: false },
   alt: { type: String, required: false },
   color: { type: String, required: false },
+  sizes: { type: Array, 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 sizes = props.sizes ?? cmsConfig?.components?.prose?.uploraImage?.sizes;
 const ui = computed(() => tv({ extend: tv(theme), ...appConfig.cms?.prose?.uploraImage || {} })());
 </script>

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

@@ -1,11 +1,12 @@
 import type { AppConfig } from '@nuxt/schema';
-import type { ComponentConfig } from '../../types';
+import type { ComponentConfig, ImageSize } 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;
     color?: string;
+    sizes?: ImageSize[];
     class?: any;
     ui?: ProseUploraImage['slots'];
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hywax/cms",
   "type": "module",
-  "version": "3.4.1",
+  "version": "3.4.3",
   "description": "Hywax CMS. ⚠️ This package is intended for internal use only.",
   "imports": {
     "#build/cms/*": "./.nuxt/cms/*.ts",