@rws-framework/client 2.5.5 → 2.6.1

package/_tools.js

@@ -172,7 +172,7 @@ function findComponentFilesWithText(dir, text, ignored = [], fileList = []) {
       if (content.includes(text)) {
         const compInfo = extractComponentInfo(content);
         if (compInfo) {
-          const { tagName, className, options, isIgnored } = compInfo;
+          const { tagName, className, options, isIgnored, isOreo } = compInfo;
 
           if (isIgnored) {
             return;
@@ -187,7 +187,8 @@ function findComponentFilesWithText(dir, text, ignored = [], fileList = []) {
             className,
             sanitName: className.toLowerCase(),
             content,
-            isIgnored: options?.ignorePackaging
+            isIgnored: options?.ignorePackaging,
+            isOreo: options?.oreoMode
           });
         }
       }
@@ -341,44 +342,45 @@ function setupTsConfig(tsConfigPath, executionDir) {
 
   try {
     let tsConfig = JSON.parse(tsConfigContents);
-
+    
     const declarationsPath = path.resolve(__dirname, 'types') + '/declarations.d.ts';
     const testsPath = path.resolve(__dirname, 'tests');
     const declarationsPathMD5 = md5(fs.readFileSync(declarationsPath, 'utf-8'));
     const testsPathMD5 = fs.existsSync(testsPath) ? md5(fs.readFileSync(testsPath, 'utf-8')) : null;
 
+    const relativeDeclarationsPath = path.relative(path.dirname(tsConfigPath), declarationsPath);
+    const relativeTestsPath = path.relative(path.dirname(tsConfigPath), testsPath);
+
     const includedMD5 = [];
 
-    let changed = false;
+    let changed = false;    
 
-    const included = [];
 
     if (!Object.keys(tsConfig).includes('include')) {
       tsConfig['include'] = [];
     } else {
-      tsConfig['include'] = tsConfig['include'].map((inc) => fs.existsSync(rwsPath.relativize(tsConfig['include'], executionDir)))
-    }
+      tsConfig['include'] = tsConfig['include'].filter((inc) => fs.existsSync(rwsPath.relativize(inc, executionDir)))
+    }    
 
     if (!Object.keys(tsConfig).includes('exclude')) {
       tsConfig['exclude'] = [];
-    }
+    }  
 
-    if (!included.includes(declarationsPath) && !includedMD5.includes(declarationsPathMD5)) {
+       
+    if (!tsConfig['include'].includes(relativeDeclarationsPath)) {
       console.log(chalk.blueBright('[RWS TS CONFIG]'), 'adding RWS typescript declarations to project tsconfig.json');
-      included.push(declarationsPath);
-      includedMD5.push(md5(fs.readFileSync(declarationsPath, 'utf-8')));
+      tsConfig['include'].push(relativeDeclarationsPath);
+      includedMD5.push(md5(fs.readFileSync(declarationsPath, 'utf-8')));      
       changed = true;
-    }
-
-    tsConfig['include'] = included;
+    }    
 
-    if (testsPathMD5 && (!tsConfig['exclude'].includes(testsPath) && !included.includes(testsPathMD5))) {
+    if ((!tsConfig['exclude'].includes(relativeTestsPath))) {
       console.log(chalk.blueBright('[RWS TS CONFIG]'), 'adding RWS typescript exclusions to project tsconfig.json');
-      tsConfig['exclude'].push(testsPath);
+      tsConfig['exclude'].push(relativeTestsPath);      
       changed = true;
     }
 
-    if (changed) {
+    if (changed) {      
       fs.writeFileSync(tsConfigPath, JSON.stringify(tsConfig, null, 2));
       console.log(chalk.yellowBright('Typescript config file'), `"${chalk.blueBright(tsConfigPath)}"`, chalk.yellowBright('has been changed'));
     }

package/package.json

@@ -1,99 +1,100 @@
 {
-  "name": "@rws-framework/client",
-  "private": false,
-  "version": "2.5.5",
-  "main": "src/index.ts",
-  "scripts": {
-    "docs": "typedoc --tsconfig ./tsconfig.json"
-  },
-  "bin": {
-    "rws-client": "./console.js"
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/papablack/rws-client.git"
-  },
-  "keywords": [
-    "frontend",
-    "rws",
-    "client",
-    "typescript"
-  ],
-  "author": "papablack",
-  "license": "ISC",
-  "bugs": {
-    "url": "https://github.com/papablack/rws-client/issues"
-  },
-  "homepage": "https://github.com/papablack/rws-client#readme",
-  "dependencies": {
-    "@microsoft/fast-element": "^1.12.0",
-    "@microsoft/fast-foundation": "^2.46.2",
-    "@rws-framework/console": "^0.3.2",
-    "@types/moment": "^2.13.0",
-    "dragula": "^3.7.3",
-    "he": "^1.2.0",
-    "json5": "^2.2.3",
-    "lodash": "^4.17.21",
-    "moment": "^2.29.4",
-    "partial-json-parser": "^1.0.0",
-    "reflect-metadata": "^0.1.13",
-    "resolve-url-loader": "^5.0.0",
-    "sanitize-html": "^2.12.1",
-    "sass": "^1.69.7",
-    "scss-loading-animations": "^1.0.1",
-    "socket.io-client": "^4.7.2",
-    "ts-loader": "^9.4.4",
-    "tsc-watch": "^6.0.4",
-    "tslib": "^2.6.2",
-    "upload": "^1.3.2",
-    "url-router": "^13.0.0",
-    "uuid": "^9.0.1",
-    "v4": "^0.0.1"
-  },
-  "devDependencies": {
-    "@types/dragula": "^3.7.4",
-    "@types/eslint": "^6.0.0",
-    "@types/express-fileupload": "^1.4.4",
-    "@types/glob": "^8.1.0",
-    "@types/he": "^1.2.3",
-    "@types/sanitize-html": "^2.11.0",
-    "@types/uuid": "^9.0.7",
-    "@typescript-eslint/parser": "^5.0.0",
-    "clean-webpack-plugin": "^4.0.0",
-    "css-loader": "^6.8.1",
-    "css-minimizer-webpack-plugin": "^5.0.1",
-    "eslint": "^6.0.0",
-    "file-loader": "^6.2.0",
-    "html-webpack-plugin": "^5.5.3",
-    "loader-utils": "^3.2.1",
-    "mini-css-extract-plugin": "^2.7.6",
-    "minimatch": "^9.0.4",
-    "node-sass": "^9.0.0",
-    "sass-loader": "^13.3.2",
-    "source-map": "^0.7.4",
-    "style-loader": "^3.3.3",
-    "terser-webpack-plugin": "^5.3.9",
-    "ts-loader": "^9.4.4",
-    "ts-node": "^10.9.1",
-    "tsconfig-paths": "^4.2.0",
-    "tsconfig-paths-webpack-plugin": "^4.1.0",
-    "typedoc": "^0.25.4",
-    "typedoc-plugin-mermaid": "^1.10.0",
-    "typedoc-plugin-not-exported": "^0.1.6",
-    "typedoc-plugin-rename-defaults": "^0.7.0",
-    "typedoc-theme-hierarchy": "^4.1.2",
-    "typescript": "^5.1.6",
-    "url-loader": "^4.1.1",
-    "webpack": "^5.75.0",
-    "webpack-bundle-analyzer": "^4.10.1",
-    "webpack-cli": "^5.1.4",
-    "webpack-dev-server": "^4.15.1",
-    "webpack-node-externals": "^3.0.0"
-  },
-  "resolutions": {
-    "lodash": "^4.17.21"
-  },
-  "overrides": {
-    "lodash": "^4.17.21"
+    "name": "@rws-framework/client",
+    "private": false,
+    "version": "2.6.1",
+    "main": "src/index.ts",
+    "scripts": {
+      "docs": "typedoc --tsconfig ./tsconfig.json"
+    },
+    "bin": {
+      "rws-client": "./console.js"
+    },
+    "repository": {
+      "type": "git",
+      "url": "git+https://github.com/papablack/rws-client.git"
+    },
+    "keywords": [
+      "frontend",
+      "rws",
+      "client",
+      "typescript"
+    ],
+    "author": "papablack",
+    "license": "ISC",
+    "bugs": {
+      "url": "https://github.com/papablack/rws-client/issues"
+    },
+    "homepage": "https://github.com/papablack/rws-client#readme",
+    "dependencies": {
+      "@microsoft/fast-element": "^1.12.0",
+      "@microsoft/fast-foundation": "^2.46.2",
+      "@rws-framework/console": "^0.3.5",
+      "@types/moment": "^2.13.0",
+      "dragula": "^3.7.3",
+      "he": "^1.2.0",
+      "json5": "^2.2.3",
+      "lodash": "^4.17.21",
+      "moment": "^2.29.4",
+      "partial-json-parser": "^1.0.0",
+      "reflect-metadata": "^0.1.13",
+      "resolve-url-loader": "^5.0.0",
+      "sanitize-html": "^2.12.1",
+      "sass": "^1.69.7",
+      "scss-loading-animations": "^1.0.1",
+      "socket.io-client": "^4.7.2",      
+      "ts-loader": "^9.4.4",
+      "tsc-watch": "^6.0.4",
+      "tslib": "^2.6.2",
+      "upload": "^1.3.2",
+      "url-router": "^13.0.0",
+      "uuid": "^9.0.1",
+      "v4": "^0.0.1"
+    },
+    "devDependencies": {
+      "@types/dragula": "^3.7.4",
+      "@types/eslint": "^6.0.0",
+      "@types/express-fileupload": "^1.4.4",
+      "@types/glob": "^8.1.0",
+      "@types/he": "^1.2.3",
+      "@types/sanitize-html": "^2.11.0",
+      "@types/uuid": "^9.0.7",
+      "@typescript-eslint/parser": "^5.0.0",
+      "clean-webpack-plugin": "^4.0.0",
+      "css-loader": "^6.8.1",
+      "css-minimizer-webpack-plugin": "^5.0.1",
+      "eslint": "^6.0.0",
+      "file-loader": "^6.2.0",
+      "html-webpack-plugin": "^5.5.3",
+      "loader-utils": "^3.2.1",
+      "mini-css-extract-plugin": "^2.7.6",
+      "minimatch": "^9.0.4",
+      "node-sass": "^9.0.0",
+      "sass-loader": "^13.3.2",
+      "source-map": "^0.7.4",
+      "style-loader": "^3.3.3",
+      "terser-webpack-plugin": "^5.3.9",
+      "ts-loader": "^9.4.4",
+      "ts-node": "^10.9.1",
+      "tsconfig-paths": "^4.2.0",
+      "tsconfig-paths-webpack-plugin": "^4.1.0",
+      "typedoc": "^0.25.4",
+      "typedoc-plugin-mermaid": "^1.10.0",
+      "typedoc-plugin-not-exported": "^0.1.6",
+      "typedoc-plugin-rename-defaults": "^0.7.0",
+      "typedoc-theme-hierarchy": "^4.1.2",
+      "typescript": "^5.1.6",
+      "url-loader": "^4.1.1",
+      "webpack": "^5.75.0",
+      "webpack-bundle-analyzer": "^4.10.1",
+      "webpack-cli": "^5.1.4",
+      "webpack-dev-server": "^4.15.1",
+      "webpack-node-externals": "^3.0.0"
+    },
+    "resolutions": {
+      "lodash": "^4.17.21"
+    },
+    "overrides": {
+      "lodash": "^4.17.21"
+    }
   }
-}
+  

package/rws.webpack.config.js

@@ -18,17 +18,15 @@ const JsMinimizerPlugin = require('terser-webpack-plugin');
 const json5 = require('json5');
 const { rwsPath } = require('@rws-framework/console');
 
-
-
-const RWSWebpackWrapper = (config) => {  
-  const BuildConfigurator = new RWSConfigBuilder(RWSPath.findPackageDir(process.cwd()) + '/.rws.json', _DEFAULT_CONFIG);
+const RWSWebpackWrapper = (config) => {
+  const BuildConfigurator = new RWSConfigBuilder(RWSPath.findPackageDir(process.cwd()) + '/.rws.json', {..._DEFAULT_CONFIG, ...config});
 
   config.packageDir = RWSPath.findPackageDir(process.cwd());
 
   const executionDir = RWSPath.relativize(BuildConfigurator.get('executionDir') || config.executionDir || process.cwd(), config.packageDir);
 
   const isDev = BuildConfigurator.get('dev', config.dev);
-  const isHotReload = BuildConfigurator.get('hot', config.hot) ;
+  const isHotReload = BuildConfigurator.get('hot', config.hot);
   const isReport = BuildConfigurator.get('report', config.report);
   const isParted = BuildConfigurator.get('parted', config.parted || false);
 
@@ -45,14 +43,14 @@ const RWSWebpackWrapper = (config) => {
 
   const publicIndex = BuildConfigurator.get('publicIndex') || config.publicIndex;
 
-  
-  const tsConfigPath = rwsPath.relativize(BuildConfigurator.get('tsConfigPath') || config.tsConfigPath, executionDir);  
-  
+
+  const tsConfigPath = rwsPath.relativize(BuildConfigurator.get('tsConfigPath') || config.tsConfigPath, executionDir);
+
 
   RWSPath.removeDirectory(outputDir, true);
 
   console.log(chalk.green('Build started with'))
-  console.log({    
+  console.log({
     executionDir,
     tsConfigPath,
     outputDir,
@@ -60,9 +58,9 @@ const RWSWebpackWrapper = (config) => {
     publicDir,
     parted: isParted,
     partedPrefix,
-    partedDirUrlPrefix     
+    partedDirUrlPrefix
   });
-  
+
 
   //AFTER OPTION DEFINITIONS
 
@@ -91,7 +89,7 @@ const RWSWebpackWrapper = (config) => {
     }));
   }
 
-  WEBPACK_PLUGINS = [...WEBPACK_PLUGINS, new webpack.optimize.ModuleConcatenationPlugin(), ...overridePlugins];
+  WEBPACK_PLUGINS = [...WEBPACK_PLUGINS, ...overridePlugins];
 
 
   if (isReport) {
@@ -110,14 +108,14 @@ const RWSWebpackWrapper = (config) => {
 
   const assetsToCopy = BuildConfigurator.get('copyAssets') || config.copyAssets;
 
-  if (!!assetsToCopy) {    
+  if (!!assetsToCopy) {
     WEBPACK_AFTER_ACTIONS.push({
       type: 'copy',
       actionHandler: assetsToCopy
     });
   }
 
-  if (WEBPACK_AFTER_ACTIONS.length) {    
+  if (WEBPACK_AFTER_ACTIONS.length) {
     WEBPACK_PLUGINS.push(new RWSAfterPlugin({ actions: WEBPACK_AFTER_ACTIONS }));
   }
 
@@ -141,9 +139,11 @@ const RWSWebpackWrapper = (config) => {
     });
   }
 
-  const optimConfig = {
-    minimize: true,
-    minimizer: [
+  const optimConfig = {};
+
+  if(!isDev){
+    optimConfig.minimize = true;
+    optimConfig.minimizer = [
       new TerserPlugin({
         terserOptions: {
           keep_classnames: true, // Prevent mangling of class names
@@ -160,8 +160,9 @@ const RWSWebpackWrapper = (config) => {
         parallel: true,
       }),
       new CssMinimizerPlugin(),
-    ],
-  };
+    ];
+  }
+  
 
   if (isParted) {
     WEBPACK_PLUGINS.push(new webpack.BannerPlugin(tools.getPartedModeVendorsBannerParams(partedDirUrlPrefix, partedPrefix)));
@@ -215,7 +216,7 @@ const RWSWebpackWrapper = (config) => {
 
   const tsValidated = tools.setupTsConfig(tsConfigPath, executionDir);
 
-  if(!tsValidated){
+  if (!tsValidated) {
     throw new Error('RWS Webpack build failed.');
   }
 
@@ -237,31 +238,26 @@ const RWSWebpackWrapper = (config) => {
       modules: modules_setup,
       alias: {
         ...aliases
-      },
-      plugins: [
-        // new TsconfigPathsPlugin({configFile: config.tsConfigPath})
-      ]
+      }
     },
     module: {
-      rules: [
+      rules: [    
         {
           test: /\.html$/,
           use: [
-            path.resolve(__dirname, './webpack/rws_fast_html_loader.js')
+            path.resolve(__dirname, './webpack/loaders/rws_fast_html_loader.js')
           ],
         },
         {
           test: /\.css$/,
           use: [
-            'css-loader',
-            // path.resolve(__dirname, './webpack/rws_fast_css_loader.js')
+            'css-loader',            
           ],
         },
         {
           test: /\.scss$/,
-          use: [
-            // 'css-loader',
-            path.resolve(__dirname, './webpack/rws_fast_scss_loader.js'),
+          use: [            
+            path.resolve(__dirname, './webpack/loaders/rws_fast_scss_loader.js'),
           ],
         },
         {
@@ -271,12 +267,12 @@ const RWSWebpackWrapper = (config) => {
               loader: 'ts-loader',
               options: {
                 allowTsInNodeModules: true,
-                configFile: path.resolve(tsConfigPath)             
+                configFile: path.resolve(tsConfigPath)
               }
             },
             {
-              loader: path.resolve(__dirname, './webpack/rws_fast_ts_loader.js'),
-            }
+              loader: path.resolve(__dirname, './webpack/loaders/rws_fast_ts_loader.js'),
+            }            
           ],
           exclude: /node_modules\/(?!\@rws-framework\/client)/,
         }
@@ -286,6 +282,15 @@ const RWSWebpackWrapper = (config) => {
     optimization: optimConfig,
   }
 
+  // if(isDev){
+    cfgExport.module.rules.push({
+      test: /\.js$/,
+      use: [
+        path.resolve(__dirname, './webpack/loaders/rws_uncomments_loader.js'),                 
+      ],
+    })
+  // }
+
   if (isHotReload) {
     cfgExport.devServer = {
       hot: true,

package/src/client/components.ts

@@ -0,0 +1,46 @@
+import RWSWindow, { RWSWindowComponentRegister } from "../interfaces/RWSWindow";
+import { RWSClientInstance } from "../client";
+import RWSViewComponent, { IWithCompose } from "../components/_component";
+type RWSInfoType = { components: string[] };
+
+async function loadPartedComponents(this: RWSClientInstance): Promise<void> {
+    this.assignClientToBrowser();
+
+    const componentParts: RWSInfoType = await this.apiService.get<RWSInfoType>(this.appConfig.get('partedDirUrlPrefix') + '/rws_info.json');        
+
+    componentParts.components.forEach((componentName: string, key: number) => {
+        const partUrl = `${this.appConfig.get('partedDirUrlPrefix')}/${this.appConfig.get('partedPrefix')}.${componentName}.js`;
+
+        const script: HTMLScriptElement = document.createElement('script');
+        script.src = partUrl;
+        script.async = true;
+        script.type = 'text/javascript';
+        document.body.appendChild(script);
+
+        console.log(`Appended ${componentParts.components[key]} component (${partUrl})`);
+    });        
+}   
+
+function defineAllComponents() {
+    const richWindowComponents: RWSWindowComponentRegister = (window as Window & RWSWindow).RWS.components;
+
+    Object.keys(richWindowComponents).map(key => richWindowComponents[key].component).forEach((el: IWithCompose<RWSViewComponent>) => {
+        el.define(el as any, el.definition);
+    });
+}
+
+function getBinds(this: RWSClientInstance){
+    return {
+        loadPartedComponents: loadPartedComponents.bind(this)        
+    };
+}
+
+export default getBinds;
+
+const ComponentHelperStatic = {
+    defineAllComponents: defineAllComponents
+}
+
+export {
+ ComponentHelperStatic   
+}

package/src/client/config.ts

@@ -0,0 +1,120 @@
+import { IRWSConfig, IRWSUser } from "../index";
+import { RWSClientInstance } from "../client";
+import startClient from '../run';
+
+type RWSInfoType = { components: string[] };
+
+function getUser(this: RWSClientInstance): IRWSUser {
+
+    const localSaved = localStorage.getItem('the_rws_user');
+
+    if (localSaved) {
+        this.setUser(JSON.parse(localSaved) as IRWSUser);
+    }
+
+    return this.user;
+}
+
+function setUser(this: RWSClientInstance, user: IRWSUser): RWSClientInstance {
+    if (!user || !user?.jwt_token) {
+        console.warn('[RWS Client Warning]', 'Passed user is not valid', user);
+        return this;
+    }
+
+    this.user = user;
+
+    this.apiService.setToken(this.user.jwt_token);
+    this.wsService.setUser(this.user);
+
+    localStorage.setItem('the_rws_user', JSON.stringify(this.user));
+
+    return this;
+}
+
+function pushDataToServiceWorker(this: RWSClientInstance, type: string, data: any, asset_type: string = 'data_push'): void {
+    let tries = 0;
+
+    const doIt: () => void = () => {
+        try {
+            this.swService.sendDataToServiceWorker(type, data, asset_type);
+        } catch (e) {
+            if (tries < 3) {
+                setTimeout(() => { doIt(); }, 300);
+                tries++;
+            }
+        }
+    };
+
+    doIt();
+}
+
+function pushUserToServiceWorker(this: RWSClientInstance, userData: any) {
+    this.setUser(userData);
+    this.pushDataToServiceWorker('SET_USER', userData, 'logged_user');
+}
+
+function get(this: RWSClientInstance, key: string): any | null
+{
+    if(Object.keys(this.customServices).includes(key)){
+        return this.customServices[key];
+    }
+
+    if(Object.keys(this.defaultServices).includes(key)){
+        return this.defaultServices[key];
+    }
+
+    return null;
+}
+
+async function setup(this: RWSClientInstance, config: IRWSConfig = {}): Promise<IRWSConfig> {
+    if (this.isSetup) {
+        return this.config;
+    }
+
+    this.config = { ...this.config, ...config };
+    this.appConfig.mergeConfig(this.config);
+
+    if (this.appConfig.get('parted')) {
+        await this.loadPartedComponents();            
+    }       
+
+
+    this.isSetup = true;
+    return this.config;
+}
+
+async function start(this: RWSClientInstance, config: IRWSConfig = {}): Promise<RWSClientInstance> {
+    this.config = { ...this.config, ...config };
+
+    if (!this.isSetup) {
+        this.config = await this.setup(this.config);
+    }
+
+    if (Object.keys(config).length) {
+        this.appConfig.mergeConfig(this.config);
+    }        
+
+    if (this.config.user && !this.config.dontPushToSW) {
+        this.pushUserToServiceWorker(this.user);
+    }
+
+    await startClient(this.appConfig, this.wsService, this.notifyService, this.routingService);        
+
+    await this.initCallback();        
+
+    return this;
+}
+
+function getBinds(this: RWSClientInstance) {
+    return {
+        start: start.bind(this),
+        setup: setup.bind(this),
+        get: get.bind(this),
+        setUser: setUser.bind(this),
+        getUser: getUser.bind(this),
+        pushDataToServiceWorker: pushDataToServiceWorker.bind(this),
+        pushUserToServiceWorker: pushUserToServiceWorker.bind(this)
+    };
+}
+
+export default getBinds;

package/src/client/services.ts

@@ -0,0 +1,28 @@
+import { loadRWSRichWindow } from "../interfaces/RWSWindow";
+import { RWSClientInstance } from "../client";
+type RWSInfoType = { components: string[] };
+
+async function loadServices(this: RWSClientInstance){
+    const richWindow = loadRWSRichWindow();     
+
+    for (const serviceKey of Object.keys(richWindow.RWS._registered)){
+        const currentService = this._container.get(richWindow.RWS._registered[serviceKey]);
+
+        if(currentService.isInClient() && !Object.keys(this.customServices).includes(serviceKey)){                
+            this.customServices[serviceKey] = currentService;
+        }
+
+        if(currentService.isDefault() && !Object.keys(this.defaultServices).includes(serviceKey)){            
+            this.defaultServices[serviceKey] = currentService;                
+        }        
+    }
+}
+
+
+function getBinds(this: RWSClientInstance){
+    return {
+        loadServices: loadServices.bind(this),
+    };
+}
+
+export default getBinds;

package/src/client.ts

@@ -1,5 +1,5 @@
 import IRWSConfig from './interfaces/IRWSConfig';
-import startClient from './run';
+
 import RWSNotify from './types/RWSNotify';
 
 import ConfigService, { ConfigServiceInstance } from './services/ConfigService';
@@ -14,7 +14,7 @@ import { IBackendRoute } from './services/ApiService';
 import IRWSUser from './interfaces/IRWSUser';
 import RWSWindow, { RWSWindowComponentRegister, loadRWSRichWindow } from './interfaces/RWSWindow';
 
-import { DI, Container } from '@microsoft/fast-foundation';
+import { DI, Container, Registration } from '@microsoft/fast-foundation';
 
 import {
     IFrontRoutes
@@ -22,6 +22,11 @@ import {
 
 import RWSViewComponent, { IWithCompose } from './components/_component';
 import RWSContainer from './components/_container';
+import TheRWSService from './services/_service';
+
+import ComponentHelper, { ComponentHelperStatic } from './client/components';
+import ServicesHelper from './client/services';
+import ConfigHelper from './client/config';
 
 interface IHotModule extends NodeModule {
     hot?: {
@@ -36,19 +41,20 @@ type RWSInfoType = { components: string[] };
 type RWSEventListener = (event: CustomEvent) => void;
 
 class RWSClient {
-    private _container: Container;
-    private user: IRWSUser = null;
-
-    private config: IRWSConfig = {};
-    protected initCallback: () => Promise<void> = async () => { };
+    protected _container: Container;
+    protected user: IRWSUser = null;
+    
+    protected config: IRWSConfig = {};
+    protected isSetup = false;
+    protected devStorage: { [key: string]: any } = {};    
+    protected customServices: { [serviceName: string]: TheRWSService} = {};
+    protected defaultServices: { [serviceName: string]: TheRWSService} = {};
 
-    private isSetup = false;
-    protected devStorage: { [key: string]: any } = {};
+    private componentHelper = ComponentHelper.bind(this)();
+    private servicesHelper = ServicesHelper.bind(this)();
+    private configHelper = ConfigHelper.bind(this)();
 
-    private cfgSetupListener: RWSEventListener = (event: CustomEvent<{ callId: string }>) => {
-        console.log('Received custom event from web component:', event.detail);
-        // this.broadcastConfigForViewComponents();
-    };
+    protected initCallback: () => Promise<void> = async () => { };    
 
     constructor(
         @ConfigService public appConfig: ConfigServiceInstance,
@@ -61,62 +67,32 @@ class RWSClient {
         @NotifyService public notifyService: NotifyServiceInstance
     ) {
         this._container = RWSContainer();
-        this.user = this.getUser();
+        this.user = this.getUser();      
+        
+        this.loadServices();
 
         this.pushDataToServiceWorker('SET_WS_URL', { url: this.appConfig.get('wsUrl') }, 'ws_url');
 
         if (this.user) {
             this.pushUserToServiceWorker({ ...this.user, instructor: false });
-        }
+        }        
     }
 
     async setup(config: IRWSConfig = {}): Promise<IRWSConfig> {
-        if (this.isSetup) {
-            return this.config;
-        }
-
-        this.config = { ...this.config, ...config };
-        this.appConfig.mergeConfig(this.config);
-
-        // this.on<IRWSConfig>('rws_cfg_call', this.cfgSetupListener);
-
-        const hotModule: IHotModule = (module as IHotModule);
-
-        if (hotModule.hot) {
-            hotModule.hot.accept('./print.js', function () {
-                console.log('Accepting the updated module!');
-            });
-        }
-
-        if (this.appConfig.get('parted')) {
-            await this.loadPartedComponents();            
-        }
-
-
-        this.isSetup = true;
-        return this.config;
+        return this.configHelper.setup(config);
     }
 
     async start(config: IRWSConfig = {}): Promise<RWSClient> {
-        this.config = { ...this.config, ...config };
-
-        if (!this.isSetup) {
-            this.config = await this.setup(this.config);
-        }
-
-        if (Object.keys(config).length) {
-            this.appConfig.mergeConfig(this.config);
-        }        
-
-        if (this.config.user && !this.config.dontPushToSW) {
-            this.pushUserToServiceWorker(this.user);
-        }
-
-        await startClient(this.appConfig, this.wsService, this.notifyService, this.routingService);        
+        return this.configHelper.start(config);
+    }
 
-        await this.initCallback();        
+    private loadServices(){
+        return this.servicesHelper.loadServices();
+    }
 
-        return this;
+    get(key: string): any | null
+    {
+        return this.configHelper.get(key);
     }
 
     addRoutes(routes: IFrontRoutes) {
@@ -146,53 +122,20 @@ class RWSClient {
     }
 
     pushDataToServiceWorker(type: string, data: any, asset_type: string = 'data_push'): void {
-        let tries = 0;
-
-        const doIt: () => void = () => {
-            try {
-                this.swService.sendDataToServiceWorker(type, data, asset_type);
-            } catch (e) {
-                if (tries < 3) {
-                    setTimeout(() => { doIt(); }, 300);
-                    tries++;
-                }
-            }
-        };
-
-        doIt();
+        this.configHelper.pushDataToServiceWorker(type, data, asset_type);
+
     }
 
     pushUserToServiceWorker(userData: any) {
-        this.setUser(userData);
-        this.pushDataToServiceWorker('SET_USER', userData, 'logged_user');
+        this.configHelper.pushUserToServiceWorker(userData);
     }
 
     getUser(): IRWSUser {
-
-        const localSaved = localStorage.getItem('the_rws_user');
-
-        if (localSaved) {
-            this.setUser(JSON.parse(localSaved) as IRWSUser);
-        }
-
-        return this.user;
+        return this.configHelper.getUser();
     }
 
     setUser(user: IRWSUser): RWSClient {
-        if (!user || !user?.jwt_token) {
-            console.warn('[RWS Client Warning]', 'Passed user is not valid', user);
-            return this;
-        }
-
-        this.user = user;
-
-        this.apiService.setToken(this.user.jwt_token);
-        this.wsService.setUser(this.user);
-
-        localStorage.setItem('the_rws_user', JSON.stringify(this.user));
-
-
-        return this;
+        return this.configHelper.setUser(user);
     }
 
     getConfig(): ConfigServiceInstance {
@@ -219,29 +162,11 @@ class RWSClient {
     }
 
     async loadPartedComponents(): Promise<void> {
-        this.assignClientToBrowser();
-
-        const componentParts: RWSInfoType = await this.apiService.get<RWSInfoType>(this.appConfig.get('partedDirUrlPrefix') + '/rws_info.json');        
-
-        componentParts.components.forEach((componentName: string, key: number) => {
-            const partUrl = `${this.appConfig.get('partedDirUrlPrefix')}/${this.appConfig.get('partedPrefix')}.${componentName}.js`;
-
-            const script: HTMLScriptElement = document.createElement('script');
-            script.src = partUrl;
-            script.async = true;
-            script.type = 'text/javascript';
-            document.body.appendChild(script);
-
-            console.log(`Appended ${componentParts.components[key]} component (${partUrl})`);
-        });        
+        return this.componentHelper.loadPartedComponents();
     }   
     
     async onDOMLoad(): Promise<void> {
-        return new Promise<void>((resolve) => {
-            document.addEventListener('DOMContentLoaded', () => {
-                resolve();
-            });
-        });
+        return this.domService.onDOMLoad()
     }
 
     assignClientToBrowser(): void {
@@ -261,30 +186,17 @@ class RWSClient {
         return window;
     }
 
-
-    private broadcastConfigForViewComponents(): void {
-        document.dispatchEvent(new CustomEvent<{ config: IRWSConfig }>('rws_cfg_broadcast', { detail: { config: this.appConfig.getData() } }));
-    }
-
     static getDI(): typeof DI {
         return DI;
     }
 
     static defineAllComponents() {
-        const richWindowComponents: RWSWindowComponentRegister = (window as Window & RWSWindow).RWS.components;
-
-        Object.keys(richWindowComponents).map(key => richWindowComponents[key].component).forEach((el: IWithCompose<RWSViewComponent>) => {
-            el.define(el as any, el.definition);
-        });
+        ComponentHelperStatic.defineAllComponents();
     }
 
     
     defineComponents(){
-        const richWindowComponents: RWSWindowComponentRegister = (window as Window & RWSWindow).RWS.components;
-
-        Object.keys(richWindowComponents).map(key => richWindowComponents[key].component).forEach((el: IWithCompose<RWSViewComponent>) => {
-            el.define(el as any, el.definition);
-        });
+        ComponentHelperStatic.defineAllComponents();
     }
 }
 

package/src/components/_component.ts

@@ -82,7 +82,7 @@ abstract class RWSViewComponent extends FoundationElement implements IRWSViewCom
                 if (this.fileAssets[file]) {
                     return;
                 }
-                this.utilsService.getFileContents(this.config.get('pubUrlFilePrefix') + file).then((response: string) => {
+                this.apiService.pureGet(this.config.get('pubUrlFilePrefix') + file).then((response: string) => {
                     this.fileAssets = { ...this.fileAssets, [file]: html`${response}` };
                 });
             });

package/src/components/_decorator.ts

@@ -7,7 +7,8 @@ interface RWSDecoratorOptions {
     template?: string,
     styles?: string,
     fastElementOptions?: any,
-    ignorePackaging?: boolean
+    ignorePackaging?: boolean,
+    oreoMode?: boolean
 }
 
 //const _PARAMTYPES_METADATA_KEY = 'design:paramtypes';

package/src/interfaces/IRWSConfig.ts

@@ -2,6 +2,7 @@ import { IFrontRoutes } from '../services/RoutingService';
 import RWSViewComponent from '../components/_component';
 
 export default interface IRWSConfig {
+    dev?: boolean
     defaultLayout?: typeof RWSViewComponent
     backendUrl?: string
     wsUrl?: string

package/src/services/ApiService.ts

@@ -35,7 +35,8 @@ type IBackendRoute = IHTTProute | IPrefixedHTTProutes;
 
 const _DEFAULT_CONTENT_TYPE = 'application/json';
 
-class ApiServiceInstance extends TheService {
+class ApiService extends TheService {
+    static _DEFAULT: boolean = true;
     private token?: string;    
 
     constructor(@ConfigService private config: ConfigServiceInstance) {
@@ -238,5 +239,5 @@ class ApiServiceInstance extends TheService {
     }
 }
 
-export default ApiServiceInstance.getSingleton();
-export { IBackendRoute, RequestOptions, ApiServiceInstance, IHTTProute, IPrefixedHTTProutes };
+export default ApiService.getSingleton();
+export { IBackendRoute, RequestOptions, ApiService as ApiServiceInstance, IHTTProute, IPrefixedHTTProutes };

package/src/services/ConfigService.ts

@@ -9,6 +9,7 @@ const __SENT_TO_COMPONENTS: string[] = [];
 
 @RWSFillBuild()
 class ConfigService extends TheService {  
+    static _DEFAULT: boolean = false;
     static isLoaded: boolean = false;
     
     _DEFAULTS: Partial<IRWSConfig> = {};
@@ -32,21 +33,31 @@ class ConfigService extends TheService {
         const isInData: boolean = Object.keys(this.data).includes(key);
         const isInBuildVars: boolean = Object.keys(this._BUILD_OVERRIDE).includes(key);
 
+        let isDev = false;
+
+        if((Object.keys(this._BUILD_OVERRIDE).includes('dev'))){
+            isDev = Object.keys(this._BUILD_OVERRIDE).includes('dev') && this._BUILD_OVERRIDE.dev;
+        }
+
         if(!isInData){        
             let defaultVal = null;
 
             if(isInDefaults){
                 defaultVal = this._DEFAULTS[key];                   
-            }            
-            
-            if(isInBuildVars && !!this._BUILD_OVERRIDE[key]){
-                defaultVal = this._BUILD_OVERRIDE[key];
-            }
+            }                             
                         
             if(defaultVal && defaultVal[0] === '@'){
                 defaultVal = this.data[((defaultVal as string).slice(1)) as keyof IRWSConfig];
             }
 
+            if(isInBuildVars && Object.keys(this._BUILD_OVERRIDE).includes(key)){
+                if(isDev){
+                    console.warn(`.rws.json override [${key}]:`), this._BUILD_OVERRIDE[key];
+                }
+
+                defaultVal = this._BUILD_OVERRIDE[key];
+            }
+
             return defaultVal;
         }        
 

package/src/services/DOMService.ts

@@ -9,7 +9,8 @@ type DOMOutputType<T extends Element> = NodeListOf<T> | T | null;
 declare let trustedTypes: TrustedTypePolicyFactory;
 
 
-class DOMServiceInstance extends RWSService {
+class DOMService extends RWSService {
+    static _DEFAULT: boolean = true;
     parse$<T extends Element>(input: NodeListOf<T>, directReturn: boolean = false): DOMOutputType<T> {    
         if(input.length > 1 || directReturn) {
             return input;
@@ -83,9 +84,18 @@ class DOMServiceInstance extends RWSService {
 
         return sanitized;
     }
+
+    async onDOMLoad(): Promise<void>
+    {
+        return new Promise<void>((resolve) => {
+            document.addEventListener('DOMContentLoaded', () => {
+                resolve();
+            });
+        });
+    }
 }
 
-const DOMService = DOMServiceInstance.getSingleton();
 
-export default DOMService;
-export { DOMOutputType, DOMServiceInstance, TagsProcessorType }; 
+
+export default DOMService.getSingleton();
+export { DOMOutputType, DOMService, TagsProcessorType, DOMService as DOMServiceInstance }; 

package/src/services/NotifyService.ts

@@ -4,7 +4,8 @@ import TheService from './_service';
  * @class
  * @extends TheService
  */
-class NotifyServiceInstance extends TheService {
+class NotifyService extends TheService {
+    static _DEFAULT: boolean = true;
     private notifier: RWSNotify;
 
     public setNotifier(notifier: RWSNotify)
@@ -43,7 +44,5 @@ class NotifyServiceInstance extends TheService {
     }
 }
 
-const NotifyService = NotifyServiceInstance.getSingleton();
-
-export default NotifyService;
-export { NotifyServiceInstance };
+export default NotifyService.getSingleton();
+export { NotifyService as NotifyServiceInstance };

package/src/services/RoutingService.ts

@@ -9,6 +9,7 @@ import ConfigService, { ConfigServiceInstance } from './ConfigService';
 type IFrontRoutes = Record<string, unknown>; 
 
 class RoutingService extends TheService {
+    static _DEFAULT: boolean = true;
     private router: Router<any>;
     private routes: IFrontRoutes;
 

package/src/services/ServiceWorkerService.ts

@@ -2,6 +2,7 @@ import RWSService from '@rws-framework/client/src/services/_service';
 
 
 class ServiceWorkerService extends RWSService {   
+    static _DEFAULT: boolean = true;
     async registerServiceWorker(): Promise<void>
     {
         await ServiceWorkerService.registerServiceWorker();

package/src/services/UtilsService.ts

@@ -3,19 +3,8 @@ import ApiService, {ApiServiceInstance} from './ApiService';
 
 import { RawSourceMap  } from 'source-map';
 
-class UtilsService extends TheService {
-    private apiService: ApiServiceInstance;
-
-    constructor(@ApiService apiService: ApiServiceInstance){
-        super();
-        this.apiService = apiService;
-    }
-
-    async getFileContents(filePath: string): Promise<string>
-    {    
-        return this.apiService.pureGet(filePath);
-    }
-    
+class UtilsService extends TheService {    
+    static _DEFAULT: boolean = true;
     mergeDeep<T>(target: T | any, source: T  | any): T 
     {
         const isObject = (obj: any) => obj && typeof obj === 'object';

package/src/services/WSService.ts

@@ -22,6 +22,7 @@ const  wsLog = async (fakeError: Error, text: any, socketId: string = null, isEr
 };
 
 class WSService extends TheService {
+    static _DEFAULT: boolean = true;
     static websocket_instance: Socket;
     private _ws: Socket | null = null;
   

package/src/services/_service.ts

@@ -10,6 +10,8 @@ export interface IWithDI<T> {
 
 export default abstract class TheRWSService {
     _RELOADABLE: boolean = false;
+    static _IN_CLIENT: boolean = false;
+    static _DEFAULT: boolean = false;
 
     constructor() {    
     }
@@ -47,4 +49,14 @@ export default abstract class TheRWSService {
 
         return interf;
     }
+
+    isDefault(): boolean
+    {
+        return (this as any).constructor._DEFAULT;
+    }
+    
+    isInClient(): boolean
+    {
+        return (this as any).constructor._IN_CLIENT;
+    }
 }

package/webpack/index.js

@@ -1,10 +1,8 @@
-const cssLoader = require('./rws_fast_css_loader');
-const scssLoader = require('./rws_fast_scss_loader');
-const htmlLoader = require('./rws_fast_html_loader');
-const tsLoader = require('./rws_fast_ts_loader');
+const scssLoader = require('./loaders/rws_fast_scss_loader');
+const htmlLoader = require('./loaders/rws_fast_html_loader');
+const tsLoader = require('./loaders/rws_fast_ts_loader');
 
-module.exports = {
-    cssLoader,
+module.exports = {    
     scssLoader,
     htmlLoader,
     tsLoader

package/webpack/{rws_fast_scss_loader.js → loaders/rws_fast_scss_loader.js}

@@ -1,10 +1,10 @@
-const RWSPlugin = require("./rws_plugin");
+const RWSCssPlugin = require("../rws_scss_plugin");
 const path = require('path');
 const cssLoader = require('css-loader');
 
 module.exports = function(content) {
     const callback = this.async();
-    const plugin = new RWSPlugin();
+    const plugin = new RWSCssPlugin();
     const filePath = this.resourcePath;
 
     const options = this.getOptions() || { minify: false };

package/webpack/{rws_fast_ts_loader.js → loaders/rws_fast_ts_loader.js}

@@ -2,8 +2,8 @@
 const path = require('path');
 const fs = require('fs');
 const ts = require('typescript');
-const tools = require('../_tools');
-const RWSPlugin = require("./rws_plugin");
+const tools = require('../../_tools');
+
 
 const _defaultRWSLoaderOptions = {
     templatePath: 'template.html',
@@ -11,23 +11,6 @@ const _defaultRWSLoaderOptions = {
     fastOptions: {  shadowOptions: { mode: 'open' }  }
 }
 
-function toJsonString(str) {
-    // Replace single quotes with double quotes
-    str = str.replace(/'/g, '"');
-
-    // Add double quotes around keys
-    str = str.replace(/([a-zA-Z0-9_]+)(?=\s*:)/g, '"$1"');
-
-    try {
-        // Parse the string as JSON and then stringify it to get a JSON string
-        const jsonObj = JSON.parse(str);
-        return JSON.stringify(jsonObj);
-    } catch (error) {
-        console.error("Error in parsing:", error);
-        return null;
-    }
-}
-
 module.exports = async function(content) {    
     let processedContent = content;
     const filePath = this.resourcePath;
@@ -95,7 +78,7 @@ module.exports = async function(content) {
 
             replaced = modifiedContent;
             replaced = replaced.replace(`@RWSView('${tagName}')`, '');
-            const plugin = new RWSPlugin();
+            
             let styles = 'const styles: null = null;'
 
             if(fs.existsSync(path.dirname(filePath) + '/styles')){
@@ -112,13 +95,9 @@ module.exports = async function(content) {
 
                 let htmlContent = fs.readFileSync(templatePath, 'utf-8');
 
-                // try {
-                //     htmlContent = await htmlMinify(htmlContent, {
-                //         collapseWhitespace: true,     
-                //     });
-                // } catch(e){
-                //     console.error(e);
-                // }
+                if(!isDev){
+                    htmlContent = htmlContent.replace(/\n/g, '');
+                }
 
                 template = `import './${templateName}.html';
                 //@ts-ignore            

package/webpack/loaders/rws_uncomments_loader.js

@@ -0,0 +1,35 @@
+
+
+const path = require('path');
+const Terser = require('terser');
+
+async function removeCommentsFromFile(code, inputSourceMap) {        
+    const callback = this.async();
+    const sourceMap = this.sourceMap;
+    // Configure Terser to remove comments
+    try {
+        const minifyOptions = {
+          format: {
+            comments: false // Remove all comments
+          },
+          sourceMap: sourceMap
+            ? {
+                content: inputSourceMap || false,
+                url: 'out.js.map'
+              }
+            : false
+        };
+    
+        // Minify source code
+        const result = await Terser.minify(code, minifyOptions);
+    
+        // Pass along the source map if enabled
+        callback(null, result.code, result.map || inputSourceMap);
+      } catch (err) {
+        callback(err);
+      }
+}
+
+module.exports = async function (source, inputSourceMap) {    
+    return await removeCommentsFromFile.bind(this)(source, inputSourceMap);
+};

package/webpack/{rws_plugin.js → rws_scss_plugin.js}

@@ -15,7 +15,7 @@ const log = (args) => {
     console.log(args);
   }
 }
-class RWSPlugin {
+class RWSScssPlugin {
   autoCompile = [];
 
   constructor(params){
@@ -326,4 +326,4 @@ class RWSPlugin {
   }
 }
 
-module.exports = RWSPlugin;
+module.exports = RWSScssPlugin;

package/webpack/rws_fast_css_loader.js

@@ -1,16 +0,0 @@
-// custom-css-loader.js
-const RWSPlugin = require("./rws_plugin");
-const plugin = new RWSPlugin();
-
-module.exports = function(content) {  
-
-    if(this.resourcePath == '/app/frontend/src/styles/main.scss'){
-        console.log('zzzzz',content, plugin.checkForImporterType(this._module, 'ts'));
-    }
-
-    if(!plugin.checkForImporterType(this._module, 'ts')){
-        return content;
-    }
-    
-    return `import { css } from '@microsoft/fast-element';\nexport default css\`${content}\`;`;
-};