Added logic of creating block from scratch.

create-block.js

@@ -17,7 +17,7 @@ const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 
 const isDev = process.env.NODE_ENV === 'development'; // Check README file in case you get "missing files" error.
-const blocksRegistry = isDev ? 'https://axe-web-blocks-registry.captain.devdevdev.life' : 'https://axe-web-blocks-registry.captain.devdevdev.life';
+const blocksRegistry = isDev ? 'http://localhost:3020' : 'https://axe-web-blocks-registry.captain.devdevdev.life';
 const blocksDirectory = isDev ? 'blocks/' : '';
 
 if (isDev) {
@@ -74,6 +74,19 @@ async function getBlockSourceFiles(blockName) {
     throw new Error("⚠️ [ERROR]", responseData.message || "Server side error.");
   }
 
+  const data = {
+    title: responseData.title,
+    name: responseData.name,
+    preview_image: responseData.preview_image,
+    remToPx: responseData.config.remToPx ?? 16,
+    blockFilename: responseData.name,
+    blockClassName: responseData.name,
+    blockGroupName: responseData.project,
+    version: responseData.version,
+    devToolSource: defaultGitRepo,
+  };
+
+  if (responseData.downloadUrl) {
     console.log(`⬇️ Downloading v${responseData.version}`);
     const zipFile = await downloadFile(responseData.downloadUrl, responseData.name + '.zip');
 
@@ -88,16 +101,11 @@ async function getBlockSourceFiles(blockName) {
     } catch (e) {
       throw e;
     }
+  } else {
+    await createSourceFiles(data, __dirname, `${blocksDirectory}${responseData.name}`);
+  }
 
-
+  await createTechnicalFiles(data, __dirname, `${blocksDirectory}${responseData.name}`);
-  await createTechnicalFiles({
-    title: responseData.title,
-    name: responseData.name,
-    blockFilename: responseData.name,
-    blockGroupName: responseData.project,
-    version: responseData.version,
-    devToolSource: defaultGitRepo,
-  }, __dirname, `${blocksDirectory}${responseData.name}`);
 
   if (responseData.config.design_files) {
     await downloadDesignFiles(responseData.name, responseData.config.design_files);
@@ -186,6 +194,30 @@ async function downloadFile(url, fileName) {
   })
 }
 
+export async function createSourceFiles(data, baseDir, distPath) {
+  const pathDist = distPath + '/src'; //path.join(baseDir, distPath);
+  const generatorsPath = path.join(baseDir, 'generators/block/templates/src');
+
+  const store = memFs.create();
+  const filesystem = editor.create(store);
+
+  const files = [
+    {from: 'template.template.hbs', to: `${data.name}.template.hbs`},
+    {from: 'styles/template.scss', to: `styles/${data.name}.scss`},
+    {from: 'scripts/template.js', to: `scripts/${data.name}.js`},
+    'images/demo.jpeg',
+  ];
+
+  for (let file of files) {
+    const from = typeof file !== 'string' ? `${generatorsPath}/${file.from}` : `${generatorsPath}/${file}`;
+    const to = typeof file !== 'string' ? `${pathDist}/${file.to}` : `${pathDist}/${file}`;
+
+    await filesystem.copyTplAsync(from, to, data);
+  }
+
+  return filesystem.commit(); // Promise
+}
+
 export async function createTechnicalFiles(data, baseDir, distPath) {
   const pathDist = distPath; //path.join(baseDir, distPath);
   const generatorsPath = path.join(baseDir, 'generators/block/templates');

generators/block/templates/block.json

@@ -4,7 +4,7 @@
 	"title": "<%= title %>",
 	"categories": [],
 	"icon": "shortcode",
-	"preview_image": "",
+	"preview_image": "<%= preview_image %>",
 	"field_groups": [
 		{
 			"name": "content",

layouts/scripts/toolbar/data-options/DataOptions.jsx

@@ -103,7 +103,7 @@ function DataOptions(props = {}) {
     dataOptions.sort((a, b) => b.widthDimension - a.widthDimension);
 
     return dataOptions.find((item) => {
-      return item.widthDimension === 414;
+      return item.widthDimension; // first
     });
   }
 }