@hywax/cms 0.0.1 → 0.0.2

package/.nuxt/cms/button-clear.ts

@@ -0,0 +1,5 @@
+export default {
+  "slots": {
+    "base": "p-0"
+  }
+}

package/.nuxt/cms/index.ts

@@ -0,0 +1 @@
+export { default as buttonClear } from './button-clear'

package/.nuxt/cms/prose/index.ts

@@ -0,0 +1 @@
+export { default as uploraImage } from './uplora-image'

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

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

package/.nuxt/cms.css

@@ -0,0 +1 @@
+@source "./cms";

package/dist/module.d.mts

@@ -1,6 +1,17 @@
 import * as _nuxt_schema from '@nuxt/schema';
+export * from '../dist/runtime/types/index.js';
 
 interface ModuleOptions {
+    /**
+     * Name of the module
+     * @defaultValue 'cms'
+     */
+    name?: string;
+    /**
+     * Prefix for the components
+     * @defaultValue 'C'
+     */
+    prefix?: string;
 }
 declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
 

package/dist/module.json

@@ -1,6 +1,6 @@
 {
   "name": "@hywax/cms",
-  "version": "0.0.0",
+  "version": "0.0.2",
   "configKey": "cms",
   "builder": {
     "@nuxt/module-builder": "1.0.1",

package/dist/module.mjs

@@ -1,7 +1,121 @@
-import { defineNuxtModule } from '@nuxt/kit';
+import { addTypeTemplate, addTemplate, defineNuxtModule, hasNuxtModule, installModule, createResolver, addComponentsDir, addImportsDir } from '@nuxt/kit';
+import { defu } from 'defu';
+import 'node:url';
+import { kebabCase } from 'scule';
 
 const name = "@hywax/cms";
-const version = "0.0.0";
+const version = "0.0.2";
+
+const buttonClear = {
+  slots: {
+    base: "p-0"
+  }
+};
+
+const theme = {
+  __proto__: null,
+  buttonClear: buttonClear
+};
+
+const uploraImage = {
+  slots: {
+    base: ""
+  }
+};
+
+const themeProse = {
+  __proto__: null,
+  uploraImage: uploraImage
+};
+
+function getTemplates(options) {
+  const templates = [];
+  function writeThemeTemplate(theme2, path) {
+    for (const component in theme2) {
+      templates.push({
+        filename: `cms/${path ? `${path}/` : ""}${kebabCase(component)}.ts`,
+        write: true,
+        getContents: async () => {
+          const template = theme2[component];
+          const result = typeof template === "function" ? template(options) : template;
+          const variants = Object.entries(result.variants || {}).filter(([_, values]) => {
+            const keys = Object.keys(values);
+            return keys.some((key) => key !== "true" && key !== "false");
+          }).map(([key]) => key);
+          let json = JSON.stringify(result, null, 2);
+          for (const variant of variants) {
+            json = json.replace(new RegExp(`("${variant}": "[^"]+")`, "g"), `$1 as typeof ${variant}[number]`);
+            json = json.replace(new RegExp(`("${variant}": \\[\\s*)((?:"[^"]+",?\\s*)+)(\\])`, "g"), (_, before, match, after) => {
+              const replaced = match.replace(/("[^"]+")/g, `$1 as typeof ${variant}[number]`);
+              return `${before}${replaced}${after}`;
+            });
+          }
+          function generateVariantDeclarations(variants2) {
+            return variants2.filter((variant) => json.includes(`as typeof ${variant}`)).map((variant) => {
+              const keys = Object.keys(result.variants[variant]);
+              return `const ${variant} = ${JSON.stringify(keys, null, 2)} as const`;
+            });
+          }
+          return [
+            ...generateVariantDeclarations(variants),
+            `export default ${json}`
+          ].join("\n\n");
+        }
+      });
+    }
+  }
+  writeThemeTemplate(themeProse, "prose");
+  writeThemeTemplate(theme);
+  templates.push({
+    filename: `cms/prose/index.ts`,
+    write: true,
+    getContents: () => Object.keys(themeProse).map((component) => `export { default as ${component} } from './${kebabCase(component)}'`).join("\n")
+  });
+  templates.push({
+    filename: "cms.css",
+    write: true,
+    getContents: () => `@source "./cms";`
+  });
+  templates.push({
+    filename: "cms/index.ts",
+    write: true,
+    getContents: () => {
+      return Object.keys(theme).map((component) => `export { default as ${component} } from './${kebabCase(component)}'`).join("\n");
+    }
+  });
+  templates.push({
+    filename: "types/cms.d.ts",
+    getContents: () => `import * as cms from '#build/cms'
+import type { TVConfig } from '@nuxt/ui'
+
+type AppConfigCMS = TVConfig<typeof cms>
+
+declare module '@nuxt/schema' {
+  interface AppConfigInput {
+    /**
+     * CMS theme configuration
+     */
+    cms?: AppConfigCMS
+  }
+}
+
+export {}
+`
+  });
+  return templates;
+}
+function addTemplates(options) {
+  const templates = getTemplates(options);
+  for (const template of templates) {
+    if (template.filename.endsWith(".d.ts")) {
+      addTypeTemplate(template);
+    } else {
+      addTemplate(template);
+    }
+  }
+}
+
+const icons = {};
 
 const module = defineNuxtModule({
   meta: {
@@ -9,8 +123,60 @@ const module = defineNuxtModule({
     version,
     configKey: "cms"
   },
-  defaults: {},
-  setup(_options, _nuxt) {
+  defaults: {
+    name: "cms",
+    prefix: "C"
+  },
+  async setup(options, nuxt) {
+    nuxt.options.appConfig.ui = defu(nuxt.options.appConfig.ui || {}, {
+      icons
+    });
+    nuxt.options.ui = defu(nuxt.options.ui || {}, {
+      colorMode: true,
+      fonts: true
+    });
+    nuxt.options.colorMode = defu(nuxt.options.colorMode || {}, {
+      storageKey: `${options.name}-color-mode`
+    });
+    nuxt.options.mdc = defu(nuxt.options.mdc || {}, {
+      components: {
+        map: {
+          "uplora-image": "ProseUploraImage"
+        }
+      }
+    });
+    nuxt.options.auth = defu(nuxt.options.auth || {}, {
+      name: `${options.name}-session`
+    });
+    if (!hasNuxtModule("@nuxt/ui-pro")) {
+      await installModule("@nuxt/ui-pro");
+    }
+    if (!hasNuxtModule("@nuxtjs/mdc")) {
+      await installModule("@nuxtjs/mdc");
+    }
+    if (!hasNuxtModule("@vueuse/nuxt")) {
+      await installModule("@vueuse/nuxt");
+    }
+    if (!hasNuxtModule("nuxt-auth-utils")) {
+      await installModule("nuxt-auth-utils");
+    }
+    const { resolve } = createResolver(import.meta.url);
+    nuxt.options.alias["#cms"] = resolve("./runtime");
+    nuxt.options.appConfig.cms = defu(nuxt.options.appConfig.cms || {}, {});
+    addComponentsDir({
+      path: resolve("./runtime/components"),
+      pathPrefix: false,
+      prefix: options?.prefix || "C",
+      ignore: ["prose/**"]
+    });
+    addComponentsDir({
+      path: resolve("./runtime/components/prose"),
+      prefix: "Prose",
+      pathPrefix: false,
+      global: true
+    });
+    addImportsDir(resolve("./runtime/composables"));
+    addTemplates(options);
   }
 });
 

package/dist/runtime/components/ButtonClear.vue

@@ -0,0 +1,36 @@
+<template>
+  <UButton
+    :class="ui.base({ class: [props.ui?.base, props.class] })"
+    :color="color"
+    :variant="variant"
+    :size="size"
+    :icon="icon || appConfig.ui.icons.close"
+    :aria-label="label"
+    :disabled="!modelValue"
+    @click.stop="emit('update:modelValue', resetValue)"
+  />
+</template>
+
+<script>
+import theme from "#build/cms/button-clear";
+import { useAppConfig } from "#imports";
+import { computed } from "vue";
+import { tv } from "../utils/tv";
+</script>
+
+<script setup>
+const props = defineProps({
+  icon: { type: String, required: false },
+  label: { type: String, required: false, default: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435" },
+  color: { type: null, required: false, default: "neutral" },
+  variant: { type: null, required: false, default: "link" },
+  size: { type: null, required: false, default: "sm" },
+  resetValue: { type: [String, Number, Boolean, null], required: false, skipCheck: true, default: void 0 },
+  class: { type: null, required: false },
+  ui: { type: null, required: false }
+});
+const emit = defineEmits(["update:modelValue"]);
+const modelValue = defineModel({ type: [String, Number, Boolean, null], skipCheck: true });
+const appConfig = useAppConfig();
+const ui = computed(() => tv({ extend: tv(theme), ...appConfig.cms?.buttonClear || {} })());
+</script>

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

@@ -0,0 +1,35 @@
+import type { AppConfig } from '@nuxt/schema';
+import type { ButtonProps } from '@nuxt/ui';
+import type { ComponentConfig } from '../types';
+import theme from '#build/cms/button-clear';
+export type ButtonClear = ComponentConfig<typeof theme, AppConfig, 'buttonClear'>;
+export type ResetValue = string | number | boolean | null | undefined;
+export interface ButtonClearProps {
+    icon?: string;
+    label?: string;
+    color?: ButtonProps['color'];
+    variant?: ButtonProps['variant'];
+    size?: ButtonProps['size'];
+    resetValue?: ResetValue;
+    class?: any;
+    ui?: ButtonClear['slots'];
+}
+export interface ButtonClearEmits {
+    'update:modelValue': [ResetValue];
+}
+declare const _default: import("vue").DefineComponent<ButtonClearProps & {
+    modelValue?: ResetValue;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (...args: unknown[]) => any;
+}, string, import("vue").PublicProps, Readonly<ButtonClearProps & {
+    modelValue?: ResetValue;
+}> & Readonly<{
+    "onUpdate:modelValue"?: ((...args: unknown[]) => any) | undefined;
+}>, {
+    size: "xs" | "sm" | "md" | "lg" | "xl";
+    color: "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral";
+    variant: "solid" | "outline" | "soft" | "subtle" | "ghost" | "link";
+    label: string;
+    resetValue: string | number | boolean | null;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

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

@@ -0,0 +1,24 @@
+<template>
+  <div :class="ui.base({ class: [props.ui?.base, props.class] })">
+    ...
+  </div>
+</template>
+
+<script>
+import theme from "#build/cms/prose/uplora-image";
+import { useAppConfig } from "#imports";
+import { computed } from "vue";
+import { tv } from "../../utils/tv";
+</script>
+
+<script setup>
+const props = defineProps({
+  image: { type: String, required: true },
+  alt: { type: String, required: true },
+  lqip: { type: String, required: false },
+  class: { type: null, required: false },
+  ui: { type: null, required: false }
+});
+const appConfig = useAppConfig();
+const ui = computed(() => tv({ extend: tv(theme), ...appConfig.cms?.prose?.uploraImage || {} })());
+</script>

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

@@ -0,0 +1,13 @@
+import type { AppConfig } from '@nuxt/schema';
+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;
+    class?: any;
+    ui?: ProseUploraImage['slots'];
+}
+declare const _default: import("vue").DefineComponent<ProseUploraImageProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseUploraImageProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/index.css

@@ -0,0 +1 @@
+@import "@nuxt/ui-pro";@import "#build/cms.css";@source "./components";

package/dist/runtime/types/app.config.d.ts

@@ -0,0 +1,6 @@
+declare module '#build/app.config' {
+  import type { AppConfig } from '@nuxt/schema'
+
+  const _default: AppConfig
+  export default _default
+}

package/dist/runtime/types/index.d.ts

@@ -0,0 +1,2 @@
+export * from '../components/ButtonClear.vue';
+export * from './utils';

package/dist/runtime/types/index.js

@@ -0,0 +1,2 @@
+export * from "../components/ButtonClear.vue";
+export * from "./utils.js";

package/dist/runtime/types/tv.d.ts

@@ -0,0 +1,53 @@
+import type { ClassValue, TVCompoundVariants, TVDefaultVariants, TVVariants } from 'tailwind-variants';
+/**
+ * Defines the AppConfig object based on the tailwind-variants configuration.
+ */
+export type TVConfig<T extends Record<string, any>> = {
+    [P in keyof T]?: {
+        [K in keyof T[P] as K extends 'base' | 'slots' | 'variants' | 'compoundVariants' | 'defaultVariants' ? K : never]?: K extends 'base' ? ClassValue : K extends 'slots' ? {
+            [S in keyof T[P]['slots']]?: ClassValue;
+        } : K extends 'variants' ? TVVariants<T[P]['slots'], ClassValue, T[P]['variants']> : K extends 'compoundVariants' ? TVCompoundVariants<T[P]['variants'], T[P]['slots'], ClassValue, object, undefined> : K extends 'defaultVariants' ? TVDefaultVariants<T[P]['variants'], T[P]['slots'], object, undefined> : never;
+    };
+};
+/**
+ * Utility type to flatten intersection types for better IDE hover information.
+ * @template T The type to flatten.
+ */
+type Id<T> = {} & {
+    [P in keyof T]: T[P];
+};
+type ComponentVariants<T extends {
+    variants?: Record<string, Record<string, any>>;
+}> = {
+    [K in keyof T['variants']]: keyof T['variants'][K];
+};
+type ComponentSlots<T extends {
+    slots?: Record<string, any>;
+}> = Id<{
+    [K in keyof T['slots']]?: ClassValue;
+}>;
+type GetComponentAppConfig<A, U extends string, K extends string> = A extends Record<U, Record<K, any>> ? A[U][K] : object;
+type ComponentAppConfig<T, A extends Record<string, any>, K extends string, U extends string = 'cms' | 'cms.prose'> = A & (U extends 'cms.prose' ? {
+    cms?: {
+        prose?: {
+            [k in K]?: Partial<T>;
+        };
+    };
+} : {
+    [key in Exclude<U, 'cms.prose'>]?: {
+        [k in K]?: Partial<T>;
+    };
+});
+/**
+ * Defines the configuration shape expected for a component.
+ * @template T The component's theme imported from `#build/cms/*`.
+ * @template A The base AppConfig type from `@nuxt/schema`.
+ * @template K The key identifying the component (e.g., 'badge').
+ * @template U The top-level key in AppConfig ('cms' or 'cms.prose').
+ */
+export type ComponentConfig<T extends Record<string, any>, A extends Record<string, any>, K extends string, U extends 'cms' | 'cms.prose' = 'cms'> = {
+    AppConfig: ComponentAppConfig<T, A, K, U>;
+    variants: ComponentVariants<T & GetComponentAppConfig<A, U, K>>;
+    slots: ComponentSlots<T>;
+};
+export {};

package/dist/runtime/types/utils.d.ts

@@ -0,0 +1,3 @@
+import type { AcceptableValue as _AcceptableValue } from 'reka-ui';
+export type AcceptableValue = Exclude<_AcceptableValue, Record<string, any>>;
+export * from './tv';

package/dist/runtime/types/utils.js

@@ -0,0 +1 @@
+export * from "./tv.js";

package/dist/runtime/utils/index.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/runtime/utils/tv.d.ts

@@ -0,0 +1 @@
+export declare const tv: import("tailwind-variants").CreateTV;

package/dist/runtime/utils/tv.js

@@ -0,0 +1,4 @@
+import appConfig from "#build/app.config";
+import { createTV } from "tailwind-variants";
+const appConfigTv = appConfig;
+export const tv = /* @__PURE__ */ createTV(appConfigTv.ui?.tv);

package/dist/types.d.mts

@@ -1,3 +1,5 @@
 export { default } from './module.mjs'
 
 export { type ModuleOptions } from './module.mjs'
+
+export * from '../dist/runtime/types/index.js'

package/package.json

@@ -1,27 +1,53 @@
 {
   "name": "@hywax/cms",
   "type": "module",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "Hywax CMS. ⚠️ This package is intended for internal use only.",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/hywax/cms.git"
   },
+  "imports": {
+    "#build/cms/*": "./.nuxt/cms/*.ts",
+    "#build/cms.css": "./.nuxt/cms.css"
+  },
   "exports": {
     ".": {
-      "types": "./dist/types.d.mts",
+      "types": "./dist/module.d.mts",
+      "style": "./dist/runtime/index.css",
       "import": "./dist/module.mjs"
+    },
+    "./runtime/*": "./dist/runtime/*",
+    "./utils": {
+      "types": "./dist/runtime/utils/index.d.ts",
+      "import": "./dist/runtime/utils/index.js"
+    },
+    "./utils/*": {
+      "types": "./dist/runtime/utils/*.d.ts",
+      "import": "./dist/runtime/utils/*.js"
     }
   },
   "main": "./dist/module.mjs",
   "typesVersions": {
     "*": {
       ".": [
-        "./dist/types.d.mts"
+        "./dist/module.d.mts"
+      ],
+      "./runtime/*": [
+        "./dist/runtime/*"
+      ],
+      "./utils": [
+        "./dist/runtime/utils/index.d.ts"
+      ],
+      "./utils/*": [
+        "./dist/runtime/utils/*.d.ts"
       ]
     }
   },
+  "style": "./dist/runtime/index.css",
   "files": [
+    ".nuxt/cms",
+    ".nuxt/cms.css",
     "dist"
   ],
   "dependencies": {
@@ -30,8 +56,11 @@
     "@nuxt/ui-pro": "^3.1.3",
     "@nuxtjs/mdc": "^0.17.0",
     "@unpress/mdc-prosemirror": "0.1.12-beta.2",
+    "@vueuse/nuxt": "^13.4.0",
     "defu": "^6.1.4",
-    "prosekit": "^0.13.6"
+    "nuxt-auth-utils": "^0.5.20",
+    "prosekit": "^0.13.6",
+    "zod": "^3.25.67"
   },
   "devDependencies": {
     "@antfu/eslint-config": "^4.14.1",
@@ -42,6 +71,7 @@
     "@nuxt/schema": "^3.17.5",
     "@nuxt/test-utils": "^3.19.1",
     "@types/node": "^22.14.0",
+    "@vue/test-utils": "^2.4.6",
     "changelogen": "^0.6.1",
     "eslint": "^9.29.0",
     "happy-dom": "^18.0.1",