Merge pull request #24 from wpdas/feat/tailwind-support

Feat: tailwind support

lib/actions/loadPreviousFileInfo.js

@@ -0,0 +1,13 @@
+const path = require("path");
+const fs = require("fs");
+
+const loadPreviousFileInfo = () => {
+  const filesInfoRaw = fs.readFileSync(path.join(`./build/filesInfo.json`));
+  const filesInfo = JSON.parse(filesInfoRaw);
+  return {
+    hasError: false,
+    fileSchemas: filesInfo,
+  };
+};
+
+module.exports = loadPreviousFileInfo;

lib/build.js

@@ -10,7 +10,7 @@ async function build(opts, changedFilePath) {
   if (!changedFilePath) {
     compile_files(opts);
   } else {
-    compile_changed_file(opts, changedFilePath);
+    await compile_changed_file(opts, changedFilePath);
   }
   generate_data_json();
 }

lib/compiler.js

@@ -1,4 +1,4 @@
-const { log, reset_name_counter } = require("./utils");
+const { log, reset_name_counter, is_script_file } = require("./utils");
 const path = require("path");
 const fs = require("fs");
 const loadFilesInfo = require("./actions/loadFilesInfo");
@@ -16,14 +16,15 @@ const injectFoundRegExps = require("./actions/injectFoundRegExps");
 const createSuspenseWidget = require("./actions/createSuspenseWidget");
 const { millisToMinutesAndSeconds } = require("./helpers");
 const loadCachedFilesInfo = require("./actions/loadCachedFilesInfo");
+const loadPreviousFileInfo = require("./actions/loadPreviousFileInfo");
 
 /**
  * Executa os comandos finais antes de gerar o bundle e arquivos/estrutura de esquemas finais
  * @param {{hasError: null;initialFileSchemas: {filePath: any;toImport: any;content: any;}[];fileSchemas: {filePath: string;toImport: string[];content: string;}[];orderedFilesToImport: string[];}} filesInfo
  * @param {*} opts Opcoes da CLI
  * @returns
  */
-function run_final_process(filesInfo, opts) {
+async function run_final_process(filesInfo, opts) {
   // Se não tiver erro
   if (filesInfo.hasError) {
     // Save bundle file with error info
@@ -55,7 +56,7 @@ function run_final_process(filesInfo, opts) {
   const modulesCodes = finishedSchemaProcessForWidgets.modulesCodes;
 
   // Alem VM -> Header contents
-  let bundleContent = alemFiles.loadHeaderFilesContent();
+  let bundleContent = await alemFiles.loadHeaderFilesContent();
 
   // Troca os recursos do Alem importados para usar o props.alem.<recurso>
   widgetsCodes = parseAlemFeatures(widgetsCodes);
@@ -160,7 +161,15 @@ function compile_files(opts) {
   run_final_process(filesInfo, opts);
 }
 
-function compile_changed_file(opts, changedFilePath) {
+async function compile_changed_file(opts, changedFilePath) {
+  // NOTE: only for .tsx, .ts, .jsx and .js
+  if (!is_script_file(changedFilePath)) {
+    // If its not a js/ts file, just load the previous filesInfo and proceed
+    const unchangedFilesInfo = loadPreviousFileInfo();
+    await run_final_process(unchangedFilesInfo, opts);
+    return;
+  }
+
   const showLogs = process.env.SHOW_EXECUTION_TIME === "true";
   if (showLogs) console.log("Processing files...");
   // Load project files
@@ -182,7 +191,7 @@ function compile_changed_file(opts, changedFilePath) {
   );
 
   // Executa processo final para gerar bundle e esquemas de arquivos
-  run_final_process(filesInfo, opts);
+  await run_final_process(filesInfo, opts);
 }
 
 module.exports = {

lib/config/alemFiles.js

@@ -3,8 +3,9 @@ const { process_file, removeComments } = require("../parse");
 const { for_rfile } = require("../utils");
 const { ALEM_VM_FOLDER } = require("../constants");
 const importableAlemFileSchemas = require("./importableAlemFileSchemas");
+const plugins = require("../../plugins");
 
-const loadHeaderFilesContent = () => {
+const loadHeaderFilesContent = async () => {
   // State
   let bundleFileBody = process_file(
     path.join(__dirname, "../", ALEM_VM_FOLDER, "state.ts"),
@@ -17,9 +18,17 @@ const loadHeaderFilesContent = () => {
   // Loop through all .css files inside the './src' and get their content
   bundleFileBody += "const alemCssBody = `";
   for_rfile(path.join(".", "src"), ["css", "sass"], (file) => {
-    const fileBody = process_file(file);
-    bundleFileBody += fileBody;
+    // Skip files if they need to be ignored
+    if (!plugins.ignoreCssFiles.includes(file)) {
+      const fileBody = process_file(file);
+      bundleFileBody += fileBody;
+    }
   });
+  // CSS content generated by plugins
+  const cssFromPlugins = await plugins.css();
+  bundleFileBody += cssFromPlugins;
+
+  // Closes the css content
   bundleFileBody += "`;";
 
   // Theme

lib/data.js

@@ -5,6 +5,7 @@
 const { removeComments } = require("./parse");
 const fs = require("fs");
 const path = require("path");
+const { has_special_characters, log } = require("./utils");
 
 const distFolder = process.env.DIST_FOLDER || "build";
 
@@ -32,20 +33,28 @@ function generate_data_json() {
       key === "compilerOptions" ||
       key === "options" ||
       key === "tags" ||
-      key === "modules"
+      key === "modules" ||
+      key === "plugins"
     ) {
       return;
     }
 
     metadataFields[key] = fileContent[key];
   });
 
+  // Check if project's name has special characters
+  if (has_special_characters(fileContent.name)) {
+    log.error("The project name cannot contain special characters.");
+    process.exit(1);
+  }
+
+  // Get the project name
+  const projectName = fileContent.name.replaceAll(" ", "-").toLowerCase();
+
   // data.json structure
   const data = {
     widget: {
-      [fileContent.isIndex
-        ? "Index"
-        : fileContent.name.replaceAll(" ", "-").toLowerCase()]: {
+      [fileContent.isIndex ? "Index" : projectName]: {
         metadata: {
           ...metadataFields,
         },

lib/dev.js

@@ -64,10 +64,12 @@ async function dev(opts) {
 
     // loading.finish();
     log.sucess(`Done.`);
+
     if (io) {
       const devJson = generateAllDevJson(NETWORK);
       io.emit("fileChange", devJson);
     }
+
     // loading.finish();
   });
 

lib/helpers.js

@@ -391,38 +391,6 @@ const getHtmlElementProps = (htmlElement) => {
   return foundProps;
 };
 
-/**
- * Extrai elementos html do texto
- *
- * Dado:
- *
- * <Banner>
- *  Alem is currently on version <span>{currentVersion}</span>.
- * </Banner>
- * <Watcher />
- * <Title bold={true} label="diga oi">Algo titulo</Title>
- *
- * Retorna: ["<Banner>", "<span>", "</span>", "</Banner>", "<Watcher />", "<Title bold={true} label=\"diga oi\">", "</Title>"]
- *
- * @param {string} texto
- * @returns
- */
-function extractHtmlElements(htmlText) {
-  // ATENÇAO: funcao deprecada. Prefira usar extractJSX e extractJSXElements
-  // Regex para encontrar elementos HTML
-  const regex = /<[^<>]+>/g;
-
-  // Executar a regex para encontrar todos os elementos HTML no texto
-  let elements = htmlText.match(regex) || [];
-  elements = elements.map((item) =>
-    item
-      .replaceAll(regexp.LINE_BREAKS, " ")
-      .replaceAll(regexp.MORE_THAN_ONE_SPACE, " "),
-  );
-
-  return elements;
-}
-
 /**
  * Extrai elementos html completos do texto
  *

lib/utils.js

@@ -197,6 +197,17 @@ const create_new_name = (_toLowerCase = false) => {
 
 const reset_name_counter = () => (nameChangeCounter = 0);
 
+const is_script_file = (fileDir) =>
+  fileDir.endsWith("tsx") ||
+  fileDir.endsWith("ts") ||
+  fileDir.endsWith("jsx") ||
+  fileDir.endsWith("js");
+
+const has_special_characters = (str) => {
+  const regex = /[^\w\s]/g;
+  return regex.test(str);
+};
+
 module.exports = {
   create_dist,
   for_rfile,
@@ -207,4 +218,6 @@ module.exports = {
   capitalize_first_letter,
   create_new_name,
   reset_name_counter,
+  is_script_file,
+  has_special_characters,
 };