New canary release (0.1.5)

.gitignore

@@ -222,4 +222,7 @@ $RECYCLE.BIN/
 # Temp directory
 /tmp
 
-# End of https://www.toptal.com/developers/gitignore/api/windows,macos,node,visualstudiocode
+# End of https://www.toptal.com/developers/gitignore/api/windows,macos,node,visualstudiocode
+
+# Mendix Widget schema file
+custom_widget.xsd

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@repixelcorp/hyper-pwt",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "A faster, more modern, superior alternative for Mendix PWT.",
   "repository": {
     "type": "git",
@@ -10,7 +10,8 @@
     "build": "rslib build",
     "watch": "rslib build --watch",
     "start": "pnpm build && node ./dist/cli.js",
-    "package": "pnpm build && pnpm pack"
+    "package": "pnpm build && pnpm pack",
+    "prepare": "node ./tools/copy-widget-schema.js"
   },
   "main": "dist/index.cjs",
   "module": "dist/index.mjs",
@@ -38,20 +39,23 @@
     "@rslib/core": "0.12.2",
     "@types/node": "22.17.2",
     "type-fest": "4.41.0",
-    "typescript": "^5.9.2"
+    "typescript": "5.9.2"
   },
   "dependencies": {
     "@vitejs/plugin-react-swc": "4.0.1",
     "chalk": "5.6.0",
     "commander": "14.0.0",
+    "fast-xml-parser": "5.2.5",
+    "mendix": "10.24.77222",
     "vite": "7.1.3",
     "zip-a-folder": "3.1.9"
   },
   "files": [
     "dist/**/*",
     "package.json",
     "LICENSE",
-    "src/configurations/hotReload/**/*"
+    "src/configurations/hotReload/**/*",
+    "custom_widget.xsd"
   ],
   "publishConfig": {
     "access": "public",

src/commands/build/web/index.ts

@@ -12,9 +12,28 @@ import getWidgetName from '../../../utils/getWidgetName';
 import getWidgetPackageJson from '../../../utils/getWidgetPackageJson';
 import getMendixWidgetDirectory from '../../../utils/getMendixWidgetDirectory';
 import getViteUserConfiguration from '../../../utils/getViteUserConfiguration';
+import { generateTypesFromFile } from '../../../type-generator';
 
 const buildWebCommand = async (isProduction: boolean = false) => {
-  // try {
+  try {
+    showMessage('Generate types');
+
+    const widgetName = await getWidgetName();
+    const originWidgetXmlPath = path.join(PROJECT_DIRECTORY, `src/${widgetName}.xml`);
+    const typingsPath = path.join(PROJECT_DIRECTORY, 'typings');
+    const typingsDirExists = await pathIsExists(typingsPath);
+
+    if (typingsDirExists) {
+      await fs.rm(typingsPath, { recursive: true, force: true });
+    }
+
+    await fs.mkdir(typingsPath);
+
+    const newTypingsFilePath = path.join(typingsPath, `${widgetName}Props.d.ts`);
+    const typingContents = await generateTypesFromFile(originWidgetXmlPath, 'web');
+
+    await fs.writeFile(newTypingsFilePath, typingContents);
+
     showMessage('Remove previous builds');
 
     const distDir = path.join(PROJECT_DIRECTORY, DIST_DIRECTORY_NAME);
@@ -46,10 +65,8 @@ const buildWebCommand = async (isProduction: boolean = false) => {
       resultViteConfig = await getViteDefaultConfig(false);
     }
 
-    const widgetName = await getWidgetName();
     const originPackageXmlPath = path.join(PROJECT_DIRECTORY, 'src/package.xml');
     const destPackageXmlPath = path.join(WEB_OUTPUT_DIRECTORY, 'package.xml');
-    const originWidgetXmlPath = path.join(PROJECT_DIRECTORY, `src/${widgetName}.xml`);
     const destWidgetXmlPath = path.join(WEB_OUTPUT_DIRECTORY, `${widgetName}.xml`);
 
     await fs.copyFile(originPackageXmlPath, destPackageXmlPath);
@@ -94,9 +111,9 @@ const buildWebCommand = async (isProduction: boolean = false) => {
     await fs.copyFile(mpkFileDestPath, mendixMpkFileDestPath);
 
     showMessage(`${COLOR_GREEN('Build complete.')}`);
-  // } catch (error) {
-    // showMessage(`${COLOR_ERROR('Build failed.')}\nError occurred: ${COLOR_ERROR((error as Error).stack)}`);
-  // }
+  } catch (error) {
+    showMessage(`${COLOR_ERROR('Build failed.')}\nError occurred: ${COLOR_ERROR((error as Error).stack)}`);
+  }
 };
 
 export default buildWebCommand;

src/commands/start/web/index.ts

@@ -10,11 +10,32 @@ import pathIsExists from "../../../utils/pathIsExists";
 import { getViteDefaultConfig } from '../../../configurations/vite';
 import getWidgetName from '../../../utils/getWidgetName';
 import getViteUserConfiguration from '../../../utils/getViteUserConfiguration';
+import { generateTypesFromFile } from '../../../type-generator';
+
+const generateTyping = async () => {
+  const widgetName = await getWidgetName();
+  const originWidgetXmlPath = path.join(PROJECT_DIRECTORY, `src/${widgetName}.xml`);
+  const typingsPath = path.join(PROJECT_DIRECTORY, 'typings');
+  const typingsDirExists = await pathIsExists(typingsPath);
+
+  if (typingsDirExists) {
+    await fs.rm(typingsPath, { recursive: true, force: true });
+  }
+
+  await fs.mkdir(typingsPath);
+
+  const newTypingsFilePath = path.join(typingsPath, `${widgetName}Props.d.ts`);
+  const typingContents = await generateTypesFromFile(originWidgetXmlPath, 'web');
+
+  await fs.writeFile(newTypingsFilePath, typingContents);
+};
 
 const startWebCommand = async () => {
   try {
     showMessage('Start widget server');
 
+    await generateTyping();
+
     const customViteConfigPath = path.join(PROJECT_DIRECTORY, VITE_CONFIGURATION_FILENAME);
     const viteConfigIsExists = await pathIsExists(customViteConfigPath);
     let resultViteConfig: UserConfig;
@@ -362,66 +383,16 @@ const startWebCommand = async () => {
             }
           }
         },
-        // {
-        //   name: 'mendix-hotreload-react',
-        //   enforce: 'pre',
-        //   transform(code, id) {
-        //     if (!id.includes('node_modules') && /\.(tsx?|jsx?)$/.test(id)) {
-        //       let transformedCode = code;
-
-        //       transformedCode = transformedCode.replace(
-        //         /import\s+(\w+)\s+from\s+['"]react['"]/g,
-        //         'const $1 = window.React'
-        //       );
-
-        //       transformedCode = transformedCode.replace(
-        //         /import\s+\*\s+as\s+(\w+)\s+from\s+['"]react['"]/g,
-        //         'const $1 = window.React'
-        //       );
-
-        //       transformedCode = transformedCode.replace(
-        //         /import\s+{([^}]+)}\s+from\s+['"]react['"]/g,
-        //         (match, imports) => {
-        //           const cleanImports = imports.replace(/\s+/g, ' ').trim();
-        //           return `const { ${cleanImports} } = window.React`;
-        //         }
-        //       );
-
-        //       transformedCode = transformedCode.replace(
-        //         /import\s+(\w+)\s*,\s*{([^}]+)}\s+from\s+['"]react['"]/g,
-        //         (match, defaultImport, namedImports) => {
-        //           const cleanImports = namedImports.replace(/\s+/g, ' ').trim();
-        //           return `const ${defaultImport} = window.React;\nconst { ${cleanImports} } = window.React`;
-        //         }
-        //       );
-
-        //       transformedCode = transformedCode.replace(
-        //         /import\s+(\w+)\s+from\s+['"]react-dom['"]/g,
-        //         'const $1 = window.ReactDOM'
-        //       );
-
-        //       transformedCode = transformedCode.replace(
-        //         /import\s+{([^}]+)}\s+from\s+['"]react-dom['"]/g,
-        //         'const { $1 } = window.ReactDOM'
-        //       );
-
-        //       transformedCode = transformedCode.replace(
-        //         /import\s+{([^}]+)}\s+from\s+['"]react-dom\/client['"]/g,
-        //         'const { $1 } = window.ReactDOM'
-        //       );
-
-        //       transformedCode = transformedCode.replace(
-        //         /import\s+type\s+{([^}]+)}\s+from\s+['"]react['"]/g,
-        //         '// Type import removed: $1'
-        //       );
-
-        //       return {
-        //         code: transformedCode,
-        //         map: null
-        //       };
-        //     }
-        //   },
-        // },
+        {
+          name: 'mendix-xml-watch-plugin',
+          configureServer(server) {
+            server.watcher.on('change', (file) => {
+              if (file.endsWith('xml')) {
+                generateTyping();
+              }
+            });
+          }
+        }
       ]
     });