@ayu-sh-kr/dota-preloader-plugin 0.0.1

package/LICENSE.txt

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) [2024] [Ayush Jaiswal]
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/index.d.ts

@@ -0,0 +1,10 @@
+import { Plugin as Plugin_2 } from 'vite';
+
+declare function dotaVitePreloader({ root }: PluginConfig): Plugin_2;
+export default dotaVitePreloader;
+
+declare type PluginConfig = {
+    root?: string;
+};
+
+export { }

package/dist/index.js

@@ -0,0 +1,160 @@
+"use strict";
+const fg = require("fast-glob");
+const promises = require("node:fs/promises");
+const core = require("@swc/core");
+class ComponentScanPath {
+  static SOURCE_PAGE_DIRECTORY_SCAN_PATH = "./src/pages/**/*.page.ts";
+  static SOURCE_COMPONENT_DIRECTORY_SCAN_PATH = "./src/components/**/*.component.ts";
+  static SOURCE_ROOT_DIRECTORY_SCAN_PATH = "./src/**/*.component.ts";
+}
+class ASTFilterConstants {
+  static COMPONENT_DECORATOR_NAME = "Component";
+  static CLASS_RENDER_METHOD_NAME = "render";
+  static COMPONENT_TAG_NAME_PROPERTY = "selector";
+}
+class VirtualImportID {
+  static DOTA_COMPONENTS = "virtual:dota-components";
+  static RESOLVED_DOTA_COMPONENTS = "\0virtual:dota-components";
+}
+class ASTHelperUtils {
+  static getExportDeclarations(body) {
+    return body.filter((item) => item.type === "ExportDeclaration");
+  }
+  static getClassDeclarations(nodes) {
+    return nodes.filter((item) => item.declaration.type === "ClassDeclaration").map((item) => item.declaration);
+  }
+  static getDecorators(classDecl) {
+    return classDecl.decorators || [];
+  }
+  static getClassName(classDecl) {
+    if (classDecl.identifier) {
+      return classDecl.identifier.value;
+    }
+    return null;
+  }
+  static getDecoratorName(decorator) {
+    if (decorator.expression.type === "CallExpression") {
+      const callee = decorator.expression.callee;
+      if (callee.type === "Identifier") {
+        return callee.value;
+      }
+    }
+    if (decorator.expression.type === "Identifier") {
+      return decorator.expression.value;
+    }
+    return null;
+  }
+  static getDecoratorArguments(decorator) {
+    if (decorator.expression.type === "CallExpression") {
+      return decorator.expression.arguments;
+    }
+    return [];
+  }
+  static getKeyValuePropertyFromObject(expression, fieldName) {
+    for (const prop of expression.properties) {
+      if (prop.type === "KeyValueProperty" && prop.key.type === "Identifier" && prop.key.value === fieldName) {
+        return prop;
+      }
+    }
+    return null;
+  }
+}
+function extractComponentCandidateFromClassDeclaration(classDecl) {
+  const decorators = ASTHelperUtils.getDecorators(classDecl);
+  for (const decorator of decorators) {
+    const decoratorName = ASTHelperUtils.getDecoratorName(decorator);
+    if (decoratorName && decoratorName === ASTFilterConstants.COMPONENT_DECORATOR_NAME) {
+      const args = ASTHelperUtils.getDecoratorArguments(decorator);
+      if (args.length > 0 && args[0].expression.type === "ObjectExpression") {
+        const componentExpression = args[0].expression;
+        const componentSelector = ASTHelperUtils.getKeyValuePropertyFromObject(componentExpression, ASTFilterConstants.COMPONENT_TAG_NAME_PROPERTY);
+        if (componentSelector.value.type === "StringLiteral") {
+          const tagName = componentSelector.value.value;
+          const className = ASTHelperUtils.getClassName(classDecl);
+          if (className) {
+            return {
+              name: className,
+              filePath: "",
+              tagName
+            };
+          }
+        }
+      }
+    }
+  }
+  return null;
+}
+function extractComponentCandidateFromAst(ast) {
+  const body = ast.body;
+  const exportDeclarations = ASTHelperUtils.getExportDeclarations(body);
+  const classDeclarations = ASTHelperUtils.getClassDeclarations(exportDeclarations);
+  return classDeclarations.map((classDecl) => extractComponentCandidateFromClassDeclaration(classDecl));
+}
+async function scanDotaComponents(root) {
+  const files = await fg([
+    ComponentScanPath.SOURCE_ROOT_DIRECTORY_SCAN_PATH,
+    ComponentScanPath.SOURCE_COMPONENT_DIRECTORY_SCAN_PATH,
+    ComponentScanPath.SOURCE_PAGE_DIRECTORY_SCAN_PATH
+  ], { cwd: root, absolute: false });
+  const candidated = [];
+  for (const file of files) {
+    const code = await promises.readFile(file, "utf-8");
+    let ast;
+    try {
+      ast = await core.parse(code, { syntax: "typescript", decorators: true });
+    } catch (e) {
+      console.log(`Failed to parse ${file}: ${e}`);
+      continue;
+    }
+    const candidates = extractComponentCandidateFromAst(ast).map((candidate) => ({ ...candidate, filePath: file }));
+    candidated.push(...candidates);
+  }
+  return candidated;
+}
+async function prepareComponentImports(candidates) {
+  const importStatementTemplate = "import { %s } from '%s';";
+  return candidates.map((candidate) => {
+    const filePath = candidate.filePath;
+    const componentName = candidate.name;
+    const importPath = filePath.startsWith("./") ? filePath : `./${filePath}`;
+    return importStatementTemplate.replace("%s", componentName).replace("%s", importPath);
+  }).join("\n");
+}
+async function prepareComponentExports(candidates) {
+  const exportStatementTemplate = "export default [%s]";
+  const componentNames = candidates.map((candidate) => candidate.name).join(", ");
+  return exportStatementTemplate.replace("%s", componentNames);
+}
+async function resolveComponentExport(candidates) {
+  const imports = await prepareComponentImports(candidates);
+  const exports2 = await prepareComponentExports(candidates);
+  return `${imports}
+
+${exports2}`;
+}
+function dotaVitePreloader({ root = process.cwd() }) {
+  let cachedCandidates = null;
+  async function ensureCandidatesLoaded() {
+    if (!cachedCandidates) {
+      cachedCandidates = await scanDotaComponents(root);
+    }
+    return cachedCandidates;
+  }
+  return {
+    name: "vite-plugin-dota-preloader",
+    resolveId(id) {
+      if (id === VirtualImportID.DOTA_COMPONENTS) return VirtualImportID.RESOLVED_DOTA_COMPONENTS;
+      return null;
+    },
+    async load(id) {
+      if (id !== VirtualImportID.RESOLVED_DOTA_COMPONENTS) return null;
+      const candidates = await ensureCandidatesLoaded();
+      return await resolveComponentExport(candidates);
+    },
+    async buildStart() {
+      cachedCandidates = await scanDotaComponents(root);
+      console.log(`Loaded Dota Component Candidates: ${cachedCandidates.length} components found.`);
+    }
+  };
+}
+module.exports = dotaVitePreloader;

package/dist/index.mjs

@@ -0,0 +1,161 @@
+import fg from "fast-glob";
+import { readFile } from "node:fs/promises";
+import { parse } from "@swc/core";
+class ComponentScanPath {
+  static SOURCE_PAGE_DIRECTORY_SCAN_PATH = "./src/pages/**/*.page.ts";
+  static SOURCE_COMPONENT_DIRECTORY_SCAN_PATH = "./src/components/**/*.component.ts";
+  static SOURCE_ROOT_DIRECTORY_SCAN_PATH = "./src/**/*.component.ts";
+}
+class ASTFilterConstants {
+  static COMPONENT_DECORATOR_NAME = "Component";
+  static CLASS_RENDER_METHOD_NAME = "render";
+  static COMPONENT_TAG_NAME_PROPERTY = "selector";
+}
+class VirtualImportID {
+  static DOTA_COMPONENTS = "virtual:dota-components";
+  static RESOLVED_DOTA_COMPONENTS = "\0virtual:dota-components";
+}
+class ASTHelperUtils {
+  static getExportDeclarations(body) {
+    return body.filter((item) => item.type === "ExportDeclaration");
+  }
+  static getClassDeclarations(nodes) {
+    return nodes.filter((item) => item.declaration.type === "ClassDeclaration").map((item) => item.declaration);
+  }
+  static getDecorators(classDecl) {
+    return classDecl.decorators || [];
+  }
+  static getClassName(classDecl) {
+    if (classDecl.identifier) {
+      return classDecl.identifier.value;
+    }
+    return null;
+  }
+  static getDecoratorName(decorator) {
+    if (decorator.expression.type === "CallExpression") {
+      const callee = decorator.expression.callee;
+      if (callee.type === "Identifier") {
+        return callee.value;
+      }
+    }
+    if (decorator.expression.type === "Identifier") {
+      return decorator.expression.value;
+    }
+    return null;
+  }
+  static getDecoratorArguments(decorator) {
+    if (decorator.expression.type === "CallExpression") {
+      return decorator.expression.arguments;
+    }
+    return [];
+  }
+  static getKeyValuePropertyFromObject(expression, fieldName) {
+    for (const prop of expression.properties) {
+      if (prop.type === "KeyValueProperty" && prop.key.type === "Identifier" && prop.key.value === fieldName) {
+        return prop;
+      }
+    }
+    return null;
+  }
+}
+function extractComponentCandidateFromClassDeclaration(classDecl) {
+  const decorators = ASTHelperUtils.getDecorators(classDecl);
+  for (const decorator of decorators) {
+    const decoratorName = ASTHelperUtils.getDecoratorName(decorator);
+    if (decoratorName && decoratorName === ASTFilterConstants.COMPONENT_DECORATOR_NAME) {
+      const args = ASTHelperUtils.getDecoratorArguments(decorator);
+      if (args.length > 0 && args[0].expression.type === "ObjectExpression") {
+        const componentExpression = args[0].expression;
+        const componentSelector = ASTHelperUtils.getKeyValuePropertyFromObject(componentExpression, ASTFilterConstants.COMPONENT_TAG_NAME_PROPERTY);
+        if (componentSelector.value.type === "StringLiteral") {
+          const tagName = componentSelector.value.value;
+          const className = ASTHelperUtils.getClassName(classDecl);
+          if (className) {
+            return {
+              name: className,
+              filePath: "",
+              tagName
+            };
+          }
+        }
+      }
+    }
+  }
+  return null;
+}
+function extractComponentCandidateFromAst(ast) {
+  const body = ast.body;
+  const exportDeclarations = ASTHelperUtils.getExportDeclarations(body);
+  const classDeclarations = ASTHelperUtils.getClassDeclarations(exportDeclarations);
+  return classDeclarations.map((classDecl) => extractComponentCandidateFromClassDeclaration(classDecl));
+}
+async function scanDotaComponents(root) {
+  const files = await fg([
+    ComponentScanPath.SOURCE_ROOT_DIRECTORY_SCAN_PATH,
+    ComponentScanPath.SOURCE_COMPONENT_DIRECTORY_SCAN_PATH,
+    ComponentScanPath.SOURCE_PAGE_DIRECTORY_SCAN_PATH
+  ], { cwd: root, absolute: false });
+  const candidated = [];
+  for (const file of files) {
+    const code = await readFile(file, "utf-8");
+    let ast;
+    try {
+      ast = await parse(code, { syntax: "typescript", decorators: true });
+    } catch (e) {
+      console.log(`Failed to parse ${file}: ${e}`);
+      continue;
+    }
+    const candidates = extractComponentCandidateFromAst(ast).map((candidate) => ({ ...candidate, filePath: file }));
+    candidated.push(...candidates);
+  }
+  return candidated;
+}
+async function prepareComponentImports(candidates) {
+  const importStatementTemplate = "import { %s } from '%s';";
+  return candidates.map((candidate) => {
+    const filePath = candidate.filePath;
+    const componentName = candidate.name;
+    const importPath = filePath.startsWith("./") ? filePath : `./${filePath}`;
+    return importStatementTemplate.replace("%s", componentName).replace("%s", importPath);
+  }).join("\n");
+}
+async function prepareComponentExports(candidates) {
+  const exportStatementTemplate = "export default [%s]";
+  const componentNames = candidates.map((candidate) => candidate.name).join(", ");
+  return exportStatementTemplate.replace("%s", componentNames);
+}
+async function resolveComponentExport(candidates) {
+  const imports = await prepareComponentImports(candidates);
+  const exports = await prepareComponentExports(candidates);
+  return `${imports}
+
+${exports}`;
+}
+function dotaVitePreloader({ root = process.cwd() }) {
+  let cachedCandidates = null;
+  async function ensureCandidatesLoaded() {
+    if (!cachedCandidates) {
+      cachedCandidates = await scanDotaComponents(root);
+    }
+    return cachedCandidates;
+  }
+  return {
+    name: "vite-plugin-dota-preloader",
+    resolveId(id) {
+      if (id === VirtualImportID.DOTA_COMPONENTS) return VirtualImportID.RESOLVED_DOTA_COMPONENTS;
+      return null;
+    },
+    async load(id) {
+      if (id !== VirtualImportID.RESOLVED_DOTA_COMPONENTS) return null;
+      const candidates = await ensureCandidatesLoaded();
+      return await resolveComponentExport(candidates);
+    },
+    async buildStart() {
+      cachedCandidates = await scanDotaComponents(root);
+      console.log(`Loaded Dota Component Candidates: ${cachedCandidates.length} components found.`);
+    }
+  };
+}
+export {
+  dotaVitePreloader as default
+};

package/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "@ayu-sh-kr/dota-preloader-plugin",
+  "private": false,
+  "publishConfig": {
+    "access": "public"
+  },
+  "version": "0.0.1",
+  "description": "dota-vite-preloader-plugin is a Vite plugin that preloads Web Components for Dota Core Web Apps. It scans the specified directory for Web Component files, generates a preload script, and injects it into the HTML. This ensures that Web Components are loaded and ready to use when the application starts.",
+  "author": {
+    "name": "ayu-sh-kr",
+    "email": "akjaiswal2003@gmail.com",
+    "url": "https://linkedin.com/in/ayu-sh-kr"
+  },
+  "license": "MIT",
+  "keywords": [
+    "Dota Core Plugins",
+    "Web Components",
+    "Web Component Loader"
+  ],
+  "type": "module",
+  "types": "./dist/index.d.ts",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "module": "./dist/index.mjs",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js",
+      "default": "./dist/index.js"
+    }
+  },
+  "dependencies": {
+    "@swc/core": "^1.13.5",
+    "fast-glob": "^3.3.3",
+    "magic-string": "^0.30.21"
+  },
+  "files": [
+    "dist/",
+    "README.md",
+    "package.json"
+  ],
+  "scripts": {
+    "build": "tsc && vite build",
+    "release": "pnpm run build && changeset publish"
+  }
+}