@rws-framework/client 2.13.1 → 2.13.3

package/cfg/build_steps/vite/_loaders.ts

@@ -1,185 +1,188 @@
-import path from 'path';
-import fs from 'fs';
-import JSON5 from 'json5';
-import chalk from 'chalk';
-import { RWSScssPlugin } from './rws_scss_plugin';
-import { scssLoader, tsLoader, htmlLoader } from './loaders';
-import { HTMLLoaderParams, IRWSViteLoader, LoaderContent, SCSSLoaderParams, TSLoaderParams } from './loaders/loader.type';
-import { PluginOption } from 'vite';
-
-const scssPlugin = new RWSScssPlugin();
-
-interface RWSLoaderOptions {
-    packageDir: string;
-    nodeModulesPath: string;
-    cssOutputPath: string;
-    tsConfigPath: string;
-    dev: boolean;
-}
-
-interface ViewDecoratorData {
-    tagName: string;
-    className: string | null;
-    classNamePrefix: string | null;
-    decoratorArgs: any;
-}
-
-export function getRWSVitePlugins({ packageDir, nodeModulesPath, tsConfigPath, cssOutputPath, dev }: RWSLoaderOptions): PluginOption[] {
-    return [
-         tsLoader({dev, scssPlugin: scssPlugin}),  scssLoader({dev, scssPlugin: scssPlugin, cssOutputPath}), htmlLoader({dev})
-    ];
-}
-
-function _extractRWSViewDefs(fastOptions: Record<string, any> = {}, decoratorArgs: Record<string, any> = {}) {
-    const addedParamDefs: string[] = [];
-    const addedParams: string[] = [];
-
-    for (const key in fastOptions) {
-        addedParamDefs.push(`const ${key} = ${JSON.stringify(fastOptions[key])};`);
-        addedParams.push(key);
-    }
-
-    return [addedParamDefs, addedParams];
-}
-
-export function extractRWSViewArgs(content: string, noReplace = false): { viewDecoratorData: ViewDecoratorData, replacedDecorator: string | null } | null {
-    const viewReg = /@RWSView\(\s*["']([^"']+)["'](?:\s*,\s*([\s\S]*?))?\s*\)\s*(.*?\s+)?class\s+([a-zA-Z0-9_-]+)\s+extends\s+RWSViewComponent/gm;
-    let m;
-    let tagName: string | null = null;
-    let className: string | null = null;
-    let classNamePrefix: string | null = null;
-    let decoratorArgs: any = null;
-
-    const _defaultRWSLoaderOptions = {
-        templatePath: 'template.html',
-        stylesPath: 'styles.scss',
-        fastOptions: { shadowOptions: { mode: 'open' } }
-    };
-
-    while ((m = viewReg.exec(content)) !== null) {
-        if (m.index === viewReg.lastIndex) {
-            viewReg.lastIndex++;
-        }
-
-        m.forEach((match, groupIndex) => {
-            if (groupIndex === 1) {
-                tagName = match;
-            }
-            if (groupIndex === 2) {
-                if (match) {
-                    try {
-                        decoratorArgs = JSON5.parse(match);
-                    } catch(e) {
-                        console.log(chalk.red('Decorator options parse error: ') + e.message + '\n Problematic line:');
-                        console.log(`@RWSView(${tagName}, ${match})`);
-                        console.log(chalk.yellowBright(`Decorator options failed to parse for "${tagName}" component.`) + ' { decoratorArgs } defaulting to null.');
-                        console.log(match);
-                        throw new Error('Failed parsing @RWSView');
-                    }
-                }
-            }
-            if (groupIndex === 3) {
-                classNamePrefix = match || null;
-            }
-            if (groupIndex === 4) {
-                className = match;
-            }
-        });
-    }
-
-    if (!tagName) {
-        return null;
-    }
-
-    let processedContent = content;
-    let fastOptions = _defaultRWSLoaderOptions.fastOptions;
-    
-    if (decoratorArgs?.fastElementOptions) {
-        fastOptions = decoratorArgs.fastElementOptions;
-    }
-
-    let replacedDecorator: string | null = null;
-    
-    if (!noReplace) {
-        const [addedParamDefs, addedParams] = _extractRWSViewDefs(fastOptions, decoratorArgs);
-        const replacedViewDecoratorContent = processedContent.replace(
-            viewReg,
-            `@RWSView('$1', null, { template: rwsTemplate, styles${addedParams.length ? ', options: {' + (addedParams.join(', ')) + '}' : ''} })\n$3class $4 extends RWSViewComponent `
-        );
-        replacedDecorator = `${addedParamDefs.join('\n')}\n${replacedViewDecoratorContent}`;
-    }
-
-    return {
-        viewDecoratorData: {
-            tagName,
-            className,
-            classNamePrefix,
-            decoratorArgs
-        },
-        replacedDecorator
-    };
-}
-
-export async function getStyles(
-    filePath: string,
-    addDependency: (path: string) => void,
-    templateExists: boolean,
-    stylesPath: string | null = null,
-    isDev = false
-): Promise<string> {
-    if (!stylesPath) {
-        stylesPath = 'styles/layout.scss';
-    }
-
-    let styles = 'const styles: null = null;';
-    const stylesFilePath = path.dirname(filePath) + '/' + stylesPath;
-
-    if (fs.existsSync(stylesFilePath)) {
-        const scsscontent = fs.readFileSync(stylesFilePath, 'utf-8');
-
-        const codeData = await cssPlugin.compileScssCode(
-            scsscontent,
-            path.dirname(filePath) + '/styles'
-        );        
-
-        const cssCode = codeData.code;
-        styles = isDev ? `import './${stylesPath}';\n` : '';
-        
-        if (!templateExists) {
-            styles += `import { css } from '@microsoft/fast-element';\n`;
-        }
-        
-        styles += `const styles = ${templateExists ? 'T.' : ''}css\`${cssCode}\`;\n`;
-        addDependency(path.dirname(filePath) + '/' + stylesPath);
-    }
-
-    return styles;
-}
-
-export async function getTemplate(
-    filePath: string,
-    addDependency: (path: string) => void,
-    templateName: string | null = null,
-    isDev = false
-): Promise<[string, string | null, boolean]> {
-    if (!templateName) {
-        templateName = 'template';
-    }
-
-    const templatePath = path.dirname(filePath) + `/${templateName}.html`;
-    let htmlFastImports: string | null = null;
-    const templateExists = fs.existsSync(templatePath);
-    let template = 'const rwsTemplate: null = null;';
-
-    if (templateExists) {
-        const templateContent = fs.readFileSync(templatePath, 'utf-8').replace(/<!--[\s\S]*?-->/g, '');
-        htmlFastImports = `import * as T from '@microsoft/fast-element';\nimport './${templateName}.html';\n`;
-        template = `
-            //@ts-ignore
-            let rwsTemplate: any = T.html\`${templateContent}\`;
-        `;
-        addDependency(templatePath);
-    }
-
-    return [template, htmlFastImports, templateExists];
+import path from 'path';
+import fs from 'fs';
+import JSON5 from 'json5';
+import chalk from 'chalk';
+import { RWSScssPlugin } from '../../../builder/vite/rws_scss_plugin';
+import { scssLoader, tsLoader, htmlLoader } from '../../../builder/vite/loaders';
+import { HTMLLoaderParams, IRWSViteLoader, LoaderContent, SCSSLoaderParams, TSLoaderParams } from '../../../builder/vite/loaders/loader.type';
+import { PluginOption } from 'vite';
+
+
+interface RWSLoaderOptions {
+    packageDir: string;
+    nodeModulesPath: string;
+    cssOutputPath: string;
+    scssPlugin: RWSScssPlugin;
+    tsConfigPath: string;
+    dev: boolean;
+}
+
+interface ViewDecoratorData {
+    tagName: string;
+    className: string | null;
+    classNamePrefix: string | null;
+    decoratorArgs: any;
+}
+
+export function getRWSVitePlugins({ tsConfigPath, cssOutputPath, dev, scssPlugin }: RWSLoaderOptions): PluginOption[] {
+    return [
+        scssLoader({dev, scssPlugin: scssPlugin, cssOutputPath}), 
+        tsLoader({dev, scssPlugin: scssPlugin, tsConfigPath}),  
+        htmlLoader({dev})
+    ];
+}
+
+function _extractRWSViewDefs(fastOptions: Record<string, any> = {}, decoratorArgs: Record<string, any> = {}) {
+    const addedParamDefs: string[] = [];
+    const addedParams: string[] = [];
+
+    for (const key in fastOptions) {
+        addedParamDefs.push(`const ${key} = ${JSON.stringify(fastOptions[key])};`);
+        addedParams.push(key);
+    }
+
+    return [addedParamDefs, addedParams];
+}
+
+export function extractRWSViewArgs(content: string, noReplace = false): { viewDecoratorData: ViewDecoratorData, replacedDecorator: string | null } | null {
+    const viewReg = /@RWSView\(\s*["']([^"']+)["'](?:\s*,\s*([\s\S]*?))?\s*\)\s*(.*?\s+)?class\s+([a-zA-Z0-9_-]+)\s+extends\s+RWSViewComponent/gm;
+    let m;
+    let tagName: string | null = null;
+    let className: string | null = null;
+    let classNamePrefix: string | null = null;
+    let decoratorArgs: any = null;
+
+    const _defaultRWSLoaderOptions = {
+        templatePath: 'template.html',
+        stylesPath: 'styles.scss',
+        fastOptions: { shadowOptions: { mode: 'open' } }
+    };
+
+    while ((m = viewReg.exec(content)) !== null) {
+        if (m.index === viewReg.lastIndex) {
+            viewReg.lastIndex++;
+        }
+
+        m.forEach((match, groupIndex) => {
+            if (groupIndex === 1) {
+                tagName = match;
+            }
+            if (groupIndex === 2) {
+                if (match) {
+                    try {
+                        decoratorArgs = JSON5.parse(match);
+                    } catch(e) {
+                        console.log(chalk.red('Decorator options parse error: ') + e.message + '\n Problematic line:');
+                        console.log(`@RWSView(${tagName}, ${match})`);
+                        console.log(chalk.yellowBright(`Decorator options failed to parse for "${tagName}" component.`) + ' { decoratorArgs } defaulting to null.');
+                        console.log(match);
+                        throw new Error('Failed parsing @RWSView');
+                    }
+                }
+            }
+            if (groupIndex === 3) {
+                classNamePrefix = match || null;
+            }
+            if (groupIndex === 4) {
+                className = match;
+            }
+        });
+    }
+
+    if (!tagName) {
+        return null;
+    }
+
+    let processedContent = content;
+    let fastOptions = _defaultRWSLoaderOptions.fastOptions;
+    
+    if (decoratorArgs?.fastElementOptions) {
+        fastOptions = decoratorArgs.fastElementOptions;
+    }
+
+    let replacedDecorator: string | null = null;
+    
+    if (!noReplace) {
+        const [addedParamDefs, addedParams] = _extractRWSViewDefs(fastOptions, decoratorArgs);
+        const replacedViewDecoratorContent = processedContent.replace(
+            viewReg,
+            `@RWSView('$1', null, { template: rwsTemplate, styles${addedParams.length ? ', options: {' + (addedParams.join(', ')) + '}' : ''} })\n$3class $4 extends RWSViewComponent `
+        );
+        replacedDecorator = `${addedParamDefs.join('\n')}\n${replacedViewDecoratorContent}`;
+    }
+
+    return {
+        viewDecoratorData: {
+            tagName,
+            className,
+            classNamePrefix,
+            decoratorArgs
+        },
+        replacedDecorator
+    };
+}
+
+export async function getStyles(
+    scssPlugin: RWSScssPlugin,
+    filePath: string,
+    addDependency: (path: string) => void,
+    templateExists: boolean,
+    stylesPath: string | null = null,
+    isDev = false
+): Promise<string> {
+    if (!stylesPath) {
+        stylesPath = 'styles/layout.scss';
+    }
+
+    let styles = 'const styles: null = null;';
+    const stylesFilePath = path.dirname(filePath) + '/' + stylesPath;
+
+    if (fs.existsSync(stylesFilePath)) {
+        const scsscontent = fs.readFileSync(stylesFilePath, 'utf-8');
+
+        const codeData = await scssPlugin.compileScssCode(
+            scsscontent,
+            path.dirname(filePath) + '/styles'
+        );        
+
+        const cssCode = codeData.code;
+        styles = isDev ? `import './${stylesPath}';\n` : '';
+        
+        if (!templateExists) {
+            styles += `import { css } from '@microsoft/fast-element';\n`;
+        }
+        
+        styles += `const styles = ${templateExists ? 'T.' : ''}css\`${cssCode}\`;\n`;
+        addDependency(path.dirname(filePath) + '/' + stylesPath);
+    }
+
+    return styles;
+}
+
+export async function getTemplate(
+    filePath: string,
+    addDependency: (path: string) => void,
+    templateName: string | null = null,
+    isDev = false
+): Promise<[string, string | null, boolean]> {
+    if (!templateName) {
+        templateName = 'template';
+    }
+
+    const templatePath = path.dirname(filePath) + `/${templateName}.html`;
+    let htmlFastImports: string | null = null;
+    const templateExists = fs.existsSync(templatePath);
+    let template = 'const rwsTemplate: null = null;';
+
+    if (templateExists) {
+        const templateContent = fs.readFileSync(templatePath, 'utf-8').replace(/<!--[\s\S]*?-->/g, '');
+        htmlFastImports = `import * as T from '@microsoft/fast-element';\nimport './${templateName}.html';\n`;
+        template = `
+            //@ts-ignore
+            let rwsTemplate: any = T.html\`${templateContent}\`;
+        `;
+        addDependency(templatePath);
+    }
+
+    return [template, htmlFastImports, templateExists];
 }

package/cfg/build_steps/vite/index.ts

@@ -1,3 +1,3 @@
-import { createViteConfig } from './vite_config';
-
+import { createViteConfig } from './vite_config';
+
 export { createViteConfig };

package/cfg/build_steps/vite/types.ts

@@ -1,8 +1,8 @@
-export type RWSViteConfig = {
-    dev: boolean
-    cssOutputPath?: string,
-    tsConfigPath: string
-    defines?: {
-        [key: string]: string
-    }
+export type RWSViteConfig = {
+    dev: boolean
+    cssOutputPath?: string,
+    tsConfigPath: string
+    defines?: {
+        [key: string]: string
+    }
 }

package/cfg/build_steps/webpack/_actions.js

@@ -1,86 +1,86 @@
-const chalk = require('chalk');
-
-const { rwsRuntimeHelper } = require('@rws-framework/console');
-
-
-function executeRWSStartActions(WEBPACK_AFTER_ACTIONS, serviceWorkerPath, BuildConfigurator, rwsFrontConfig) {
-    if (serviceWorkerPath) {
-        WEBPACK_AFTER_ACTIONS.push({
-            type: 'service_worker',
-            actionHandler: serviceWorkerPath
-        });
-    }
-
-    const assetsToCopy = BuildConfigurator.get('copyAssets') || rwsFrontConfig.copyAssets;
-
-    if (!!assetsToCopy) {
-        WEBPACK_AFTER_ACTIONS.push({
-            type: 'copy',
-            actionHandler: assetsToCopy
-        });
-    }
-}
-
-
-function timingActions(WEBPACK_AFTER_ACTIONS, WEBPACK_AFTER_ERROR_ACTIONS, devDebug){
-    if(devDebug?.timing){
-        rwsRuntimeHelper.setRWSVar('_timer_css', 'none|0');
-    
-        WEBPACK_AFTER_ACTIONS.push({
-          type: 'custom',
-          actionHandler: () => {  
-            
-            const cssTimesList = rwsRuntimeHelper.getRWSVar('_timer_css');        
-            
-            if(cssTimesList){
-              const cssTime = cssTimesList.split('\n').map((elString) => {
-                const item = elString.split('|')[1];
-                return item === '' ? 0 : parseInt(item)
-              }).reduce((acc, curr) => acc + curr, 0);
-              rwsRuntimeHelper.setRWSVar('_timer_css', 'none|0');                 
-              console.log(chalk.yellow('[RWS BUILD] (after)'), `CSS TIME: ${Math.round(cssTime)}`);
-    
-            }
-          }
-        });
-      }
-    
-      WEBPACK_AFTER_ERROR_ACTIONS.push({
-        type: 'custom',
-        actionHandler: () => {
-          console.log('CUSTOM ERROR');
-          rwsRuntimeHelper.setRWSVar('_timer_css', 'none|0');
-        }
-      });
-}
-
-function devActions(WEBPACK_AFTER_ACTIONS, executionDir, devDebug){
-    const devExternalsVars = {
-        packed: [],
-        ignored: [],
-        frontendRequestContextCache: []
-      }
-    
-      if(devDebug?.build){
-        const debugDir = path.join(executionDir, '.debug');
-    
-        if(!fs.existsSync(debugDir)){
-          fs.mkdirSync(debugDir)
-        }
-    
-        WEBPACK_AFTER_ACTIONS.push({
-          type: 'custom',
-          actionHandler: () => {        
-            fs.writeFile(path.join(debugDir, 'in_vendors.json'), JSON.stringify(devExternalsVars.ignored, null, 2));
-            fs.writeFile(path.join(debugDir, 'rws_processed.json'), JSON.stringify(devExternalsVars.packed, null, 2));
-            fs.writeFile(path.join(debugDir, 'requestcache.json'), JSON.stringify(devExternalsVars.frontendRequestContextCache, null, 2));
-    
-            console.log(chalk.yellow('[RWS BUILD] (after)'), `packaging debug saved in: ${debugDir}`);
-          }
-        });
-      }
-
-      return devExternalsVars;
-}
-
+const chalk = require('chalk');
+
+const { rwsRuntimeHelper } = require('@rws-framework/console');
+
+
+function executeRWSStartActions(WEBPACK_AFTER_ACTIONS, serviceWorkerPath, BuildConfigurator, rwsFrontConfig) {
+    if (serviceWorkerPath) {
+        WEBPACK_AFTER_ACTIONS.push({
+            type: 'service_worker',
+            actionHandler: serviceWorkerPath
+        });
+    }
+
+    const assetsToCopy = BuildConfigurator.get('copyAssets') || rwsFrontConfig.copyAssets;
+
+    if (!!assetsToCopy) {
+        WEBPACK_AFTER_ACTIONS.push({
+            type: 'copy',
+            actionHandler: assetsToCopy
+        });
+    }
+}
+
+
+function timingActions(WEBPACK_AFTER_ACTIONS, WEBPACK_AFTER_ERROR_ACTIONS, devDebug){
+    if(devDebug?.timing){
+        rwsRuntimeHelper.setRWSVar('_timer_css', 'none|0');
+    
+        WEBPACK_AFTER_ACTIONS.push({
+          type: 'custom',
+          actionHandler: () => {  
+            
+            const cssTimesList = rwsRuntimeHelper.getRWSVar('_timer_css');        
+            
+            if(cssTimesList){
+              const cssTime = cssTimesList.split('\n').map((elString) => {
+                const item = elString.split('|')[1];
+                return item === '' ? 0 : parseInt(item)
+              }).reduce((acc, curr) => acc + curr, 0);
+              rwsRuntimeHelper.setRWSVar('_timer_css', 'none|0');                 
+              console.log(chalk.yellow('[RWS BUILD] (after)'), `CSS TIME: ${Math.round(cssTime)}`);
+    
+            }
+          }
+        });
+      }
+    
+      WEBPACK_AFTER_ERROR_ACTIONS.push({
+        type: 'custom',
+        actionHandler: () => {
+          console.log('CUSTOM ERROR');
+          rwsRuntimeHelper.setRWSVar('_timer_css', 'none|0');
+        }
+      });
+}
+
+function devActions(WEBPACK_AFTER_ACTIONS, executionDir, devDebug){
+    const devExternalsVars = {
+        packed: [],
+        ignored: [],
+        frontendRequestContextCache: []
+      }
+    
+      if(devDebug?.build){
+        const debugDir = path.join(executionDir, '.debug');
+    
+        if(!fs.existsSync(debugDir)){
+          fs.mkdirSync(debugDir)
+        }
+    
+        WEBPACK_AFTER_ACTIONS.push({
+          type: 'custom',
+          actionHandler: () => {        
+            fs.writeFile(path.join(debugDir, 'in_vendors.json'), JSON.stringify(devExternalsVars.ignored, null, 2));
+            fs.writeFile(path.join(debugDir, 'rws_processed.json'), JSON.stringify(devExternalsVars.packed, null, 2));
+            fs.writeFile(path.join(debugDir, 'requestcache.json'), JSON.stringify(devExternalsVars.frontendRequestContextCache, null, 2));
+    
+            console.log(chalk.yellow('[RWS BUILD] (after)'), `packaging debug saved in: ${debugDir}`);
+          }
+        });
+      }
+
+      return devExternalsVars;
+}
+
 module.exports = { devActions, timingActions, executeRWSStartActions }

package/cfg/build_steps/webpack/_aliases.js

@@ -1,10 +1,10 @@
-const path = require('path');
-
-function loadAliases(packageDir, nodeModulesPath, srcDir){    
-    return {
-        'src': srcDir + '/src',        
-        '@rws-framework/foundation': path.resolve(packageDir, 'foundation', 'rws-foundation.js')
-    }
-}
-
+const path = require('path');
+
+function loadAliases(packageDir, nodeModulesPath, srcDir){    
+    return {
+        'src': srcDir + '/src',        
+        '@rws-framework/foundation': path.resolve(packageDir, 'foundation', 'rws-foundation.js')
+    }
+}
+
 module.exports = { loadAliases }