Adding UX React, Svelte, Vue recipes

symfony/ux-react/2.8/manifest.json

@@ -0,0 +1,5 @@
+{
+    "bundles": {
+        "Symfony\\UX\\React\\ReactBundle": ["all"]
+    }
+}

symfony/ux-react/2.9/assets/react/controllers/Hello.jsx

@@ -0,0 +1,5 @@
+import React from 'react';
+
+export default function (props) {
+    return <div>Hello {props.fullName}</div>;
+}

symfony/ux-react/2.9/manifest.json

@@ -0,0 +1,40 @@
+{
+    "bundles": {
+        "Symfony\\UX\\React\\ReactBundle": ["all"]
+    },
+    "copy-from-recipe": {
+        "assets/": "assets/"
+    },
+    "conflict": {
+        "symfony/webpack-encore-bundle": "<2.0",
+        "symfony/flex": "<1.20.0 || >=2.0.0,<2.3.0"
+    },
+    "add-lines": [
+        {
+            "file": "webpack.config.js",
+            "content": "\n    .enableReactPreset()",
+            "position": "after_target",
+            "target": ".splitEntryChunks()"
+        },
+        {
+            "file": "assets/app.js",
+            "content": "import { registerReactControllerComponents } from '@symfony/ux-react';",
+            "position": "top",
+            "warn_if_missing": true
+        },
+        {
+            "file": "assets/app.js",
+            "content": "registerReactControllerComponents(require.context('./react/controllers', true, /\\.(j|t)sx?$/));",
+            "position": "bottom",
+            "warn_if_missing": true,
+            "requires": "symfony/webpack-encore-bundle"
+        },
+        {
+            "file": "assets/app.js",
+            "content": "registerReactControllerComponents();",
+            "position": "bottom",
+            "warn_if_missing": true,
+            "requires": "symfony/asset-mapper"
+        }
+    ]
+}

symfony/ux-svelte/2.8/manifest.json

@@ -0,0 +1,5 @@
+{
+    "bundles": {
+        "Symfony\\UX\\Svelte\\SvelteBundle": ["all"]
+    }
+}

symfony/ux-svelte/2.9/assets/svelte/controllers/Hello.svelte

@@ -0,0 +1,5 @@
+<script>
+    export let name = "Svelte";
+</script>
+
+<div>Hello {name}</div>

symfony/ux-svelte/2.9/manifest.json

@@ -0,0 +1,40 @@
+{
+    "bundles": {
+        "Symfony\\UX\\Svelte\\SvelteBundle": ["all"]
+    },
+    "copy-from-recipe": {
+        "assets/": "assets/"
+    },
+    "conflict": {
+        "symfony/webpack-encore-bundle": "<2.0",
+        "symfony/flex": "<1.20.0 || >=2.0.0,<2.3.0"
+    },
+    "add-lines": [
+        {
+            "file": "webpack.config.js",
+            "content": "\n    .enableSvelte()",
+            "position": "after_target",
+            "target": ".splitEntryChunks()"
+        },
+        {
+            "file": "assets/app.js",
+            "content": "import { registerSvelteControllerComponents } from '@symfony/ux-svelte';",
+            "position": "top",
+            "warn_if_missing": true
+        },
+        {
+            "file": "assets/app.js",
+            "content": "registerSvelteControllerComponents(require.context('./svelte/controllers', true, /\\.svelte$/));",
+            "position": "bottom",
+            "warn_if_missing": true,
+            "requires": "symfony/webpack-encore-bundle"
+        },
+        {
+            "file": "assets/app.js",
+            "content": "registerSvelteControllerComponents();",
+            "position": "bottom",
+            "warn_if_missing": true,
+            "requires": "symfony/asset-mapper"
+        }
+    ]
+}

symfony/ux-vue/2.8/manifest.json

@@ -0,0 +1,5 @@
+{
+    "bundles": {
+        "Symfony\\UX\\Vue\\VueBundle": ["all"]
+    }
+}

symfony/ux-vue/2.9/assets/vue/controllers/Hello.vue

@@ -0,0 +1,9 @@
+<template>
+    <div>Hello {{ name }}!</div>
+</template>
+
+<script setup>
+    defineProps({
+        name: String
+    });
+</script>

symfony/ux-vue/2.9/manifest.json

@@ -0,0 +1,40 @@
+{
+    "bundles": {
+        "Symfony\\UX\\Vue\\VueBundle": ["all"]
+    },
+    "copy-from-recipe": {
+        "assets/": "assets/"
+    },
+    "conflict": {
+        "symfony/webpack-encore-bundle": "<2.0",
+        "symfony/flex": "<1.20.0 || >=2.0.0,<2.3.0"
+    },
+    "add-lines": [
+        {
+            "file": "webpack.config.js",
+            "content": "\n    .enableVueLoader()",
+            "position": "after_target",
+            "target": ".splitEntryChunks()"
+        },
+        {
+            "file": "assets/app.js",
+            "content": "import { registerVueControllerComponents } from '@symfony/ux-vue';",
+            "position": "top",
+            "warn_if_missing": true
+        },
+        {
+            "file": "assets/app.js",
+            "content": "registerVueControllerComponents(require.context('./vue/controllers', true, /\\.vue$/));",
+            "position": "bottom",
+            "warn_if_missing": true,
+            "requires": "symfony/webpack-encore-bundle"
+        },
+        {
+            "file": "assets/app.js",
+            "content": "registerVueControllerComponents();",
+            "position": "bottom",
+            "warn_if_missing": true,
+            "requires": "symfony/asset-mapper"
+        }
+    ]
+}