Add support for Vue and Nuxt SDKs

.github/workflows/deploy-release.yaml

@@ -15,4 +15,4 @@ jobs:
         npm run build
       prepare-script: >-
         cp package.json LICENSE README.md build/ &&
-        npm --prefix build pkg delete dependencies
+        npm --prefix build pkg delete dependencies devDependencies

package.json

@@ -95,5 +95,8 @@
   "files": [
     "**/*.js",
     "**/*.ts"
-  ]
+  ],
+  "overrides": {
+    "lodash": "^4.17.24"
+  }
 }

src/application/model/platform.ts

@@ -1,6 +1,8 @@
 export enum Platform {
     NEXTJS = 'nextjs',
+    NUXT = 'nuxt',
     REACT = 'react',
+    VUE = 'vue',
     JAVASCRIPT = 'javascript',
 }
 
@@ -10,9 +12,15 @@ export namespace Platform {
             case Platform.NEXTJS:
                 return 'Next.js';
 
+            case Platform.NUXT:
+                return 'Nuxt';
+
             case Platform.REACT:
                 return 'React';
 
+            case Platform.VUE:
+                return 'Vue';
+
             case Platform.JAVASCRIPT:
                 return 'JavaScript';
         }

src/application/project/code/generation/example.ts

@@ -4,6 +4,7 @@ export enum CodeLanguage {
     JAVASCRIPT_XML = 'jsx',
     TYPESCRIPT = 'typescript',
     TYPESCRIPT_XML = 'tsx',
+    VUE = 'vue',
 }
 
 export type ExampleFile = {

src/application/project/code/generation/slot/plugNuxtExampleGenerator.ts

@@ -0,0 +1,17 @@
+import {VueExampleGenerator} from './vueExampleGenerator';
+import type {SlotDefinition} from './slotExampleGenerator';
+import type {CodeWriter} from '@/application/project/code/generation/codeWritter';
+
+export class PlugNuxtExampleGenerator extends VueExampleGenerator {
+    protected writeSlotScript(writer: CodeWriter, definition: SlotDefinition): void {
+        this.writeScriptOpening(writer);
+
+        writer.write(`const {data} = await useContent('${definition.id}@${definition.version}');`);
+
+        this.writeScriptClosing(writer);
+    }
+
+    protected writePageScript(): void {
+        // Nuxt auto-imports components from `components/`, so the page needs no script section.
+    }
+}

src/application/project/code/generation/slot/plugVueExampleGenerator.ts

@@ -0,0 +1,31 @@
+import {VueExampleGenerator} from './vueExampleGenerator';
+import type {SlotFile} from './vueExampleGenerator';
+import type {SlotDefinition} from './slotExampleGenerator';
+import type {CodeWriter} from '@/application/project/code/generation/codeWritter';
+
+export class PlugVueExampleGenerator extends VueExampleGenerator {
+    protected writeSlotScript(writer: CodeWriter, definition: SlotDefinition): void {
+        const variable = this.options.contentVariable;
+        const dataBinding = variable === 'data' ? variable : `data: ${variable}`;
+
+        this.writeScriptOpening(writer);
+
+        writer.write("import {useContent} from '@croct/plug-vue';")
+            .newLine()
+            .write(`const {${dataBinding}, isLoading} = useContent('${definition.id}@${definition.version}');`);
+
+        this.writeScriptClosing(writer);
+    }
+
+    protected writePageScript(writer: CodeWriter, slot: SlotFile): void {
+        this.writeScriptOpening(writer);
+
+        writer.write(`import ${slot.name} from '${slot.importPath}';`);
+
+        this.writeScriptClosing(writer);
+    }
+
+    protected override getLoadingFlag(): string {
+        return 'isLoading';
+    }
+}