@storepress/create-plugin-html 0.0.6 → 0.1.0

package/README.md

@@ -13,10 +13,9 @@ npx -y @wordpress/create-block@latest --template @storepress/create-plugin-html
 Navigate to the newly created folder and get started.
 
 ```
-npm i                        # Install dependencies
-npm run packages-update      # Update package dependency
-npm run build                # Build the javascript
-npx -y http-server           # Start Server
+npm i && npm run packages-update   # Install dependencies and Update package dependency
+npm run build                      # Build the javascript
+npx -y http-server                 # Start Server
 ```
 
 ## Development

package/index.js

@@ -38,8 +38,8 @@ module.exports = {
         customScripts      : {
             'postinstall' : 'git init -q && rimraf .husky && npx husky init && echo "npx lint-staged" > .husky/pre-commit',
 
-            'prebuild' : 'rimraf build',
-            'build'    : 'npm run start -- --no-watch && wp-scripts build --webpack-copy-php --experimental-modules',
+            'prebuild' : 'rimraf build && npm run external:build',
+            'build'    : 'wp-scripts build --webpack-copy-php --experimental-modules',
 
             'check-engines'  : 'wp-scripts check-engines',
             'check-licenses' : 'wp-scripts check-licenses',
@@ -73,10 +73,16 @@ module.exports = {
             'test:e2e'  : 'wp-scripts test-e2e',
             'test:unit' : 'wp-scripts test-unit-js',
 
-            'start' : 'rimraf build && wp-scripts start --webpack-copy-php --experimental-modules',
+            "external:dev": "wp-scripts start --no-watch --config tools/webpack.config.externals.js --experimental-modules --webpack-no-externals",
+            "external:build": "wp-scripts build --config tools/webpack.config.externals.js --experimental-modules --webpack-no-externals",
+
+            'prestart' : 'rimraf build && npm run external:dev',
+            'start' : 'wp-scripts start --webpack-copy-php --experimental-modules',
         },
         npmDependencies    : [
             '@storepress/utils',
+            '@wordpress/element',
+            '@wordpress/interactivity',
         ],
         npmDevDependencies : [
             '@wordpress/scripts',
@@ -109,7 +115,7 @@ module.exports = {
             'zip'           : [
                 'build/**',
                 'index.html',
-                'global-style.css',
+                'index-module.html',
             ],
         },
         transformer        : (view) => {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@storepress/create-plugin-html",
-	"version": "0.0.6",
+	"version": "0.1.0",
 	"description": "A template to be used with `@wordpress/create-block` to create a StorePress HTML based JS Extension.",
 	"author": "StorePress",
 	"main": "index.js",

package/plugin-templates/.eslintrc.js.mustache

@@ -161,6 +161,7 @@ module.exports = {
 			'lodash',
 			'jquery',
 			'@storepress/utils',
+			'@storepress/html-plugin', // See: getWebPackAlias() from tools/webpack-helpers.js
 			'@utils', // See: getWebPackAlias() from tools/webpack-helpers.js
 		],
 		'import/resolver': {

package/plugin-templates/index-module.html.mustache

@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<title>Standalone WordPress Package Usages</title>
+
+	<script type="importmap">
+		{
+			"imports": {
+				"@storepress/utils": "./build/storepress-utils-module.js"
+			}
+		}
+	</script>
+
+	<link rel="modulepreload" href="./build/storepress-utils-module.js" fetchpriority="low"/>
+</head>
+
+<body>
+
+<h2>StorePress Example as Module:</h2>
+
+<div data-storepress-plugin="{'greet': 'Hello'}">Hello ( Check Browser Console )</div>
+
+<p><a href="./index.html">Check using storepress plugin as script</a></p>
+
+<script type="module" src="./build/module-example.js"></script>
+
+</body>
+</html>

package/plugin-templates/index.html.mustache

@@ -3,35 +3,58 @@
 <head>
 	<meta charset="UTF-8">
 	<meta name="viewport" content="width=device-width, initial-scale=1.0">
-	<title>{{title}}</title>
-	<link rel="stylesheet" href="./global-style.css" />
-	<link rel="stylesheet" href="./build/style-plugin.css" />
-
-    <script type="importmap">
-        {
-          "imports":
-              {
-                  "@storepress/utils":"./build/storepress-utils-module.js"
-                  "@huggingface/transformers":"https://esm.sh/@huggingface/transformers"
-                  "@babycommando/entity-db":"https://esm.sh/@babycommando/entity-db"
-              }
-        }
-    </script>
-
-    <link rel="modulepreload" href="./build/storepress-utils-module.js" />
-    <link rel="modulepreload" href="https://esm.sh/@huggingface/transformers" />
-    <link rel="modulepreload" href="https://esm.sh/@babycommando/entity-db" />
-
-    <script type="module" src="./custom-module.js"></script>
+	<title>Standalone WordPress Package Usages</title>
+
+	<script type="importmap">
+		{
+			"imports": {
+				"@wordpress/interactivity": "./build/externals/modules/wp-interactivity.js"
+			}
+		}
+	</script>
+
+	<link rel="modulepreload" href="./build/externals/modules/wp-interactivity.js" fetchpriority="low"/>
 </head>
 
 <body>
 
-<div class="wrapper">
-	<div data-{{kebabSlug}}="{'greet': 'Hello'}">Hello ( Check Browser Console )</div>
+<h1>Example of WordPress Package Usage as Standalone</h1>
+<div id="wrapper"></div>
+
+
+<div
+	data-wp-interactive="my-app"
+	data-wp-context='{ "isOpen": false }'
+>
+	<h2>Interactive Counter: <span data-wp-text="state.count"></span></h2>
+	<button data-wp-on--click="actions.increment">+</button>
+	<button data-wp-on--click="actions.decrement">−</button>
+
+	<hr>
+
+	<button data-wp-on--click="actions.toggle">
+		<span data-wp-text="state.toggleText"></span>
+	</button>
+	<p data-wp-bind--hidden="!context.isOpen">
+		Hello from the Interactivity API! 🎉
+	</p>
 </div>
 
+
+<h2>StorePress Example:</h2>
+
+<div data-storepress-plugin="{'greet': 'Hello'}">Hello ( Check Browser Console )</div>
+
+<p><a href="./index-module.html">Check using storepress plugin as module</a></p>
+
+<script src="./build/externals/scripts/react-jsx-runtime.js"></script>
+<script src="./build/externals/scripts/wp-element.js"></script>
+<script src="./build/react-example.js"></script>
+
 <script src="./build/storepress-utils.js"></script>
-<script src="./build/plugin.js"></script>
+<script src="./build/script-example.js"></script>
+
+<script type="module" src="./build/interactive-example.js"></script>
+
 </body>
-</html>
+</html>

package/plugin-templates/src/interactive/index.js.mustache

@@ -0,0 +1,19 @@
+import { store, getContext } from '@wordpress/interactivity';
+
+const { state } = store('my-app', {
+	state: {
+		count: 0,
+		get toggleText() {
+			const ctx = getContext();
+			return ctx.isOpen ? 'Hide' : 'Show';
+		},
+	},
+	actions: {
+		increment() { state.count++; },
+		decrement() { state.count--; },
+		toggle() {
+			const ctx = getContext();
+			ctx.isOpen = !ctx.isOpen;
+		},
+	},
+});

package/plugin-templates/src/react/index.js.mustache

@@ -0,0 +1,38 @@
+import { createRoot, useState, StrictMode } from '@wordpress/element';
+
+const App = () => {
+	const [count, setCount]         = useState(0);
+	const [isVisible, setIsVisible] = useState(false);
+
+	const toggleVisible = () => setIsVisible(!isVisible);
+
+	const toggleText = isVisible ? 'Hide' : 'Show';
+
+	const toggleStyle = {
+		display : isVisible ? 'block' : 'none'
+	}
+
+	return (
+		<div>
+			<h2>React Counter: {count}</h2>
+
+			<button onClick={() => setCount(count + 1)}>+</button>
+
+			<button onClick={() => setCount(count - 1)}>-</button>
+
+			<hr/>
+
+			<button onClick={toggleVisible}> {toggleText} </button>
+
+			<p style={toggleStyle}>
+				Hello from the React API! 🎉
+			</p>
+		</div>
+	);
+};
+
+const container = document.getElementById('wrapper');
+if (container) {
+	const root = createRoot(container);
+	root.render(<StrictMode><App/></StrictMode>);
+}

package/{block-templates → plugin-templates/src/storepress}/Plugin.js.mustache

@@ -10,7 +10,7 @@ export function Plugin (element, options) {
   const PRIVATE = {}
 
   // Collecting settings from html attribute
-  const ATTRIBUTE = 'plugin-settings' // html data-plugin-settings
+  const ATTRIBUTE = 'storepress-plugin' // html data-plugin-settings
 
   const CLASSES = {
     NEW: 'new-class',
@@ -86,4 +86,4 @@ export function Plugin (element, options) {
   }
 
   return init()
-}
+}

package/plugin-templates/src/storepress/index.js.mustache

@@ -0,0 +1,20 @@
+/**
+ * External dependencies
+ */
+import { createStorePressPlugin } from '@storepress/utils';
+
+/**
+ * Internal dependencies
+ */
+import { Plugin } from './Plugin';
+
+const HtmlPlugin = createStorePressPlugin({
+	selector  : '[data-storepress-plugin]',
+	options   : {},
+	plugin    : Plugin,
+	namespace : 'html',
+});
+
+HtmlPlugin.setup();
+
+export default HtmlPlugin;

package/plugin-templates/src/storepress/script.js.mustache

@@ -0,0 +1,9 @@
+/**
+ * External dependencies
+ */
+
+import HtmlPlugin from '@storepress/html-plugin';
+
+document.addEventListener('DOMContentLoaded', () => {
+	HtmlPlugin.init();
+});

package/{block-templates → plugin-templates/src/storepress}/style.scss.mustache

@@ -4,7 +4,7 @@
 
 $default-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 
-:where([data-{{kebabSlug}}]) {
+:where([data-storepress-plugin]) {
   font-family: $default-font;
 
   @include plugin.init();
@@ -12,4 +12,4 @@ $default-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-San
   & {
     --custom-variable: 1px;
   }
-}
+}

package/plugin-templates/tools/webpack-helpers.js.mustache

@@ -19,22 +19,17 @@ const scriptHandleMap = {
 };
 
 const externalModulesMap = {
-          //  1. static import.
-          // '@wordpress/a11y': 'import @wordpress/a11y',
-          // '@storepress/utils': 'import @storepress/utils',
 
-          // view.js <script type="module" src="./view.js"></script>
-          // import { ... } from '@storepress/utils';
+    //	'module @wordpress/a11y'  →  import * as X from '@wordpress/a11y'
+    //  'import @wordpress/a11y'  →  module.exports = import('@wordpress/a11y')
 
-          // 2. dynamic import.
-          // '@storepress/utils': 'module @storepress/utils',
+    '@storepress/utils' : 'module @storepress/utils',
 
-          // view.js <script type="module" src="./view.js"></script>
-          // import('@storepress/utils').then(()=>{});
-          // OR
-          // const config = await fetch('../config.json').then(response => response.json());
-          // const driver = await import(`@storepress/utils`);
-          // driver.connect();
+    // import('@storepress/utils').then(()=>{});
+    // OR
+    // const config = await fetch('../config.json').then(response => response.json());
+    // const driver = await import(`@storepress/utils`);
+    // driver.connect();
 
     /*
           ```html
@@ -51,29 +46,7 @@ const externalModulesMap = {
               <link rel="modulepreload" href="http://example.com/wp-includes/js/dist/script-modules/interactivity/index.min.js" fetchpriority="low" />
               <link rel="modulepreload" href="./build/storepress-utils-module.js" fetchpriority="low" />
               ```*/
-
-          // in view.js
-          // ```js
-          // "import" prefix — static import (top-level, resolved at load time)
-          // import { store, getContext } from '@wordpress/a11y';
-          // ```
-
-          // dynamic import.
-          // @see: https://github.com/WordPress/gutenberg/blob/trunk/packages/block-library/src/query/view.js#L40
-          // ```js
-          //  import('@wordpress/interactivity-router').then({});
-          // ```
-          // '@wordpress/interactivity-router': 'import @wordpress/interactivity-router',
-
-          // view.js
-
-          // "import" prefix — static import (top-level, resolved at load time)
-          //  import { store, getContext } from '@wordpress/interactivity';
-
-          // "module" prefix — dynamic import (lazy, resolved at runtime)
-          // const loadRouter = () => import('@wordpress/interactivity-router');
-      }
-;
+};
 
 /**
  * Default request to global transformation
@@ -145,7 +118,7 @@ function getWebPackAlias() {
         //'@storepress/icons': getFile('packages/icons'),
         //'@storepress/utils': getFile('packages/utils'),
         //'@storepress/components': getFile('packages/components'),
-        '@{{kebabNamespace}}/{{kebabSlug}}' : getFile('index.js'),
+        '@storepress/html-plugin' : getFile('storepress/index.js'),
     };
 }
 

package/plugin-templates/tools/webpack.config.externals.js.mustache

@@ -0,0 +1,131 @@
+const [
+		  defaultJSConfig,
+		  defaultModuleConfig,
+	  ]                                            = require('@wordpress/scripts/config/webpack.config');
+const {
+		  requestToExternal,
+		  requestToHandle,
+		  requestToExternalModule,
+		  getFile,
+		  getRootFile,
+		  getWebPackAlias,
+	  }                                            = require('./webpack-helpers');
+const WoocommerceDependencyExtractionWebpackPlugin = require('@woocommerce/dependency-extraction-webpack-plugin');
+const DependencyExtractionWebpackPlugin            = require('@wordpress/dependency-extraction-webpack-plugin');
+const RemoveEmptyScriptsPlugin                     = require('webpack-remove-empty-scripts');
+const webpack                                      = require('webpack');
+
+// Helper to route files to the correct directory
+
+const getOutputFilename = (pathData) => {
+
+	const condition = (pathData.chunk.name.startsWith('wp-') || pathData.chunk.name.startsWith('react-'))
+
+	return condition
+		? `externals/scripts/[name].js`
+		: '[name].js';
+};
+
+const getOutputFilenameAsModule = (pathData) => {
+
+	const condition = (pathData.chunk.name.startsWith('wp-') || pathData.chunk.name.startsWith('react-'))
+
+	return condition
+		? `externals/modules/[name].js`
+		: '[name].js';
+};
+
+const scriptConfig = {
+	...defaultJSConfig,
+	entry : {
+		'wp-element'        : {
+			import  : '@wordpress/element',
+			library : {
+				name : ['wp', 'element'],
+				type : 'window'
+			}
+		},
+		'react-jsx-runtime' : {
+			import  : 'react/jsx-runtime',
+			library : {
+				name : ['ReactJSXRuntime'],
+				type : 'window',
+			}
+		},
+	},
+
+	output : {
+		...defaultJSConfig.output,
+		filename : getOutputFilename,
+	},
+
+	resolve : {
+		...defaultJSConfig.resolve,
+		alias : {
+			...defaultJSConfig.resolve.alias,
+			...getWebPackAlias(),
+		},
+	},
+
+	plugins : [
+		...defaultJSConfig.plugins,
+		...defaultJSConfig.plugins.filter(
+			(plugin) =>
+				plugin.constructor.name !== 'DependencyExtractionWebpackPlugin'
+		),
+		new webpack.optimize.LimitChunkCountPlugin({maxChunks : 1}),
+	],
+};
+
+const moduleConfig = {
+	...defaultModuleConfig,
+	entry : {
+		// ...defaultModuleConfig.entry(),
+		// 'custom-module': getFile( 'custom-module.js' ),
+		/*'storepress-utils-module': {
+			import: '@storepress/utils/build-module/index.js',
+			library: {
+				type: 'module',
+			},
+		}*/
+
+		'wp-interactivity' : {
+			import  : '@wordpress/interactivity',
+			library : {
+				type : 'module'
+			}
+		},
+	},
+
+	output : {
+		...defaultModuleConfig.output,
+		filename : getOutputFilenameAsModule,
+	},
+
+	resolve : {
+		...defaultModuleConfig.resolve,
+		alias : {
+			...defaultModuleConfig.resolve.alias,
+			...getWebPackAlias(),
+		},
+	},
+
+	plugins : [
+		...defaultModuleConfig.plugins,
+
+		...defaultModuleConfig.plugins.filter(
+			(plugin) =>
+				plugin.constructor.name !== 'DependencyExtractionWebpackPlugin'
+		),
+
+		new webpack.optimize.LimitChunkCountPlugin({maxChunks : 1}),
+
+		// Removes the empty `.js` files generated by webpack but
+		// sets it after WP has generated its `*.asset.php` file.
+		new RemoveEmptyScriptsPlugin({
+			stage : RemoveEmptyScriptsPlugin.STAGE_AFTER_PROCESS_PLUGINS,
+		}),
+	],
+};
+
+module.exports = [scriptConfig, moduleConfig];

package/plugin-templates/webpack.config.js.mustache

@@ -1,104 +1,114 @@
 const [
-	defaultJSConfig,
-	defaultModuleConfig,
-] = require( '@wordpress/scripts/config/webpack.config' );
+          defaultJSConfig,
+          defaultModuleConfig,
+      ]                                            = require('@wordpress/scripts/config/webpack.config');
 const {
-	requestToExternal,
-	requestToHandle,
-	requestToExternalModule,
-	getFile,
-	getRootFile,
-	getWebPackAlias,
-} = require( './tools/webpack-helpers' );
-const WoocommerceDependencyExtractionWebpackPlugin = require( '@woocommerce/dependency-extraction-webpack-plugin' );
-const DependencyExtractionWebpackPlugin = require( '@wordpress/dependency-extraction-webpack-plugin' );
-const RemoveEmptyScriptsPlugin = require( 'webpack-remove-empty-scripts' );
+          requestToExternal,
+          requestToHandle,
+          requestToExternalModule,
+          getFile,
+          getRootFile,
+          getWebPackAlias,
+      }                                            = require('./tools/webpack-helpers');
+const WoocommerceDependencyExtractionWebpackPlugin = require('@woocommerce/dependency-extraction-webpack-plugin');
+const DependencyExtractionWebpackPlugin            = require('@wordpress/dependency-extraction-webpack-plugin');
+const RemoveEmptyScriptsPlugin                     = require('webpack-remove-empty-scripts');
 
 const scriptConfig = {
-	...defaultJSConfig,
-	entry: {
-		[`plugin`]: [
-			getRootFile('style.scss'),
-			getRootFile('script.js'),
+    ...defaultJSConfig,
+    entry : {
+        [`react-example`]             : [
+            getFile('react/index.js'),
         ],
-        'storepress-utils': {
-			import: '@storepress/utils/build-module/index.js',
-			library: {
-				name: ['StorePress','Utils'],
-				type: 'window'
-			},
-		}
-	},
 
-	resolve: {
-		...defaultJSConfig.resolve,
-		alias: {
-			...defaultJSConfig.resolve.alias,
-			...getWebPackAlias(),
-		},
-	},
+        'storepress-utils' : {
+            import  : '@storepress/utils/build-module/index.js',
+            library : {
+                name    : ['StorePress', 'Utils'],
+                type : 'window',
+            },
+        },
 
-	plugins: [
-		// ...defaultJSConfig.plugins,
-		...defaultJSConfig.plugins.filter(
-			( plugin ) =>
-				plugin.constructor.name !== 'DependencyExtractionWebpackPlugin'
-		),
-		new WoocommerceDependencyExtractionWebpackPlugin( {
-			requestToExternal,
-			requestToHandle,
-			requestToExternalModule,
-		} ),
+        [`script-example`] : [
+            getFile('storepress/style.scss'),
+            getFile('storepress/script.js'),
+        ],
+    },
 
-		// Removes the empty `.js` files generated by webpack but
-		// sets it after WP has generated its `*.asset.php` file.
-		new RemoveEmptyScriptsPlugin( {
-			stage: RemoveEmptyScriptsPlugin.STAGE_AFTER_PROCESS_PLUGINS,
-		} ),
-	]
-};
+    resolve : {
+        ...defaultJSConfig.resolve,
+        alias : {
+            ...defaultJSConfig.resolve.alias,
+            ...getWebPackAlias(),
+        },
+    },
+
+    plugins : [
+        ...defaultJSConfig.plugins,
+        ...defaultJSConfig.plugins.filter(
+            (plugin) =>
+                plugin.constructor.name !== 'DependencyExtractionWebpackPlugin'
+        ),
+
+        new DependencyExtractionWebpackPlugin({
+            requestToExternal,
+            requestToHandle,
+            requestToExternalModule,
+        }),
+
+        // Removes the empty `.js` files generated by webpack but
+        // sets it after WP has generated its `*.asset.php` file.
+        new RemoveEmptyScriptsPlugin({
+            stage : RemoveEmptyScriptsPlugin.STAGE_AFTER_PROCESS_PLUGINS,
+        }),
+    ],
+}
 
 const moduleConfig = {
-	...defaultModuleConfig,
-	output: { ...defaultModuleConfig.output, module: true },
-	experiments: { outputModule: true },
-	entry: {
-		// ...defaultModuleConfig.entry(),
-		// 'custom-module': getFile( 'custom-module.js' ),
-        /*'storepress-utils-module': {
+    ...defaultModuleConfig,
+    entry : {
+        'interactive-example' : getFile('interactive/index.js'),
+        'storepress-utils-module': {
             import: '@storepress/utils/build-module/index.js',
             library: {
                 type: 'module',
             },
-        }*/
-	},
+        },
+
+        [`module-example`] : [
+            getFile('storepress/style.scss'),
+            getFile('storepress/script.js'),
+        ],
+    },
+
+    resolve : {
+        ...defaultModuleConfig.resolve,
+        alias : {
+            ...defaultModuleConfig.resolve.alias,
+            ...getWebPackAlias(),
+        },
+    },
+
+    plugins : [
+        ...defaultModuleConfig.plugins,
 
-	resolve: {
-		...defaultModuleConfig.resolve,
-		alias: {
-			...defaultModuleConfig.resolve.alias,
-			...getWebPackAlias(),
-		},
-	},
+        ...defaultModuleConfig.plugins.filter(
+            (plugin) =>
+                plugin.constructor.name !== 'DependencyExtractionWebpackPlugin'
+        ),
 
-	plugins: [
-		// ...defaultModuleConfig.plugins,
-		...defaultModuleConfig.plugins.filter(
-			( plugin ) =>
-				plugin.constructor.name !== 'DependencyExtractionWebpackPlugin'
-		),
-		new DependencyExtractionWebpackPlugin( {
-			requestToExternal,
-			requestToHandle,
-			requestToExternalModule,
-		} ),
+        new DependencyExtractionWebpackPlugin({
+            requestToExternal,
+            requestToHandle,
+            requestToExternalModule,
+        }),
 
-		// Removes the empty `.js` files generated by webpack but
-		// sets it after WP has generated its `*.asset.php` file.
-		new RemoveEmptyScriptsPlugin( {
-			stage: RemoveEmptyScriptsPlugin.STAGE_AFTER_PROCESS_PLUGINS,
-		} ),
-	],
+        // Removes the empty `.js` files generated by webpack but
+        // sets it after WP has generated its `*.asset.php` file.
+        new RemoveEmptyScriptsPlugin({
+            stage : RemoveEmptyScriptsPlugin.STAGE_AFTER_PROCESS_PLUGINS,
+        }),
+    ],
 };
 
-module.exports = [ scriptConfig, moduleConfig ];
+module.exports = [scriptConfig, moduleConfig];

package/block-templates/index.js.mustache

@@ -1,20 +0,0 @@
-/**
- * External dependencies
- */
-import { createStorePressPlugin } from '@storepress/utils';
-
-/**
- * Internal dependencies
- */
-import { Plugin } from './Plugin';
-
-const {{pascaleSlug}} = createStorePressPlugin( {
-	selector: '[data-{{kebabSlug}}]',
-	options: {},
-	plugin: Plugin,
-	namespace: '{{pascaleSlug}}',
-} );
-
-{{pascaleSlug}}.setup();
-
-export default {{pascaleSlug}};

package/plugin-templates/global-style.css.mustache

@@ -1,14 +0,0 @@
-body {
-    font-family: sans-serif;
-}
-
-.wrapper {
-    width: 80%;
-    height: 80dvh;
-
-    display: flex;
-    justify-content: center;
-    align-items: center;
-
-    margin-inline: auto;
-}

package/plugin-templates/script.js.mustache

@@ -1,8 +0,0 @@
-/**
- * External dependencies
- */
-import {{pascaleSlug}} from '@{{kebabNamespace}}/{{kebabSlug}}';
-
-document.addEventListener( 'DOMContentLoaded', () => {
-  {{pascaleSlug}}.init();
-} );

package/plugin-templates/style.scss.mustache

@@ -1,10 +0,0 @@
-@charset "UTF-8";
-
-@use "./src/mixins" as plugin;
-
-:where([data-{{kebabSlug}}]) {
-  @include plugin.init();
-  & {
-    --custom-variable: 1px;
-  }
-}