@rws-framework/client 2.18.1 → 2.18.3

package/builder/webpack/rws.webpack.config.js

@@ -15,7 +15,6 @@ const { setComponentsChunks, scanComponents, generateRWSInfoFile, partedComponen
 const { getBuildConfig } = require('../../cfg/build_steps/webpack/_build_config');
 const { createWebpackConfig } = require('../../cfg/build_steps/webpack/_webpack_config');
 const { executeRWSStartActions, timingActions, devActions } = require('../../cfg/build_steps/webpack/_actions');
-const { webpackDevServer } = require('../../cfg/build_steps/webpack/_dev_servers');
 const { RWS_WEBPACK_PLUGINS_BAG, addStartPlugins } = require('../../cfg/build_steps/webpack/_plugins');
 
 

package/builder/webpack/scss/_import.js

@@ -14,7 +14,7 @@ function processImportPath(importPath, rwsWorkspaceDir, appRootDir, fileRootDir
     const workspaceDir = this.getRWSWorkspaceDir ? this.getRWSWorkspaceDir() : rwsWorkspaceDir;
     const appRoot = this.getRWSWorkspaceDir ? this.getRWSRootDir() : appRootDir;
   
-    if (importPath.split('')[0] === '~') {
+    if (importPath.split('')[0] === '~') {       
         return fillSCSSExt(replaceWithNodeModules(importPath, appRoot, null, true), noext);
     }
 
@@ -136,8 +136,7 @@ function detectImports(code) {
 }
 
 function replaceWithNodeModules(input, appRootDir, fileDir = null, absolute = false, token = '~') {
-    _scss_fs = _scss_fs_builder(this);
-   
+    _scss_fs = _scss_fs_builder(this);   
     return input.replace(token, absolute ? `${path.join(appRootDir, 'node_modules')}/` : this.node_modules_dir(fileDir ? fileDir : appRootDir));
 }
 

package/cfg/build_steps/webpack/_loaders.js

@@ -89,6 +89,8 @@ function getRWSLoaders(packageDir, executionDir, tsConfigData, appRootDir, entry
     },
   ];
 
+  console.log(loaders[2].include);
+
   return loaders;
 }
 
@@ -252,7 +254,7 @@ async function getTemplate(filePath, addDependency, templateName = null, isDev =
 
   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`;
+    htmlFastImports = `import * as T from '@microsoft/fast-element';\nimport { html, css, ref, when, repeat, slotted, children } from '@microsoft/fast-element'; \nimport './${templateName}.html';\n`;
     template = `                
 //@ts-ignore                
 let rwsTemplate: any = T.html\`${templateContent}\`;

package/cfg/build_steps/webpack/_webpack_config.js

@@ -54,7 +54,7 @@ async function createWebpackConfig({
                 path: false
             }
         },
-        devServer: hotReload ? getRWSHotReloadSetup(hotReloadPort, outputDir) : null,
+        devServer: hotReload ? getRWSHotReloadSetup(hotReloadPort, outputDir) : false,
         module: {
             rules: getRWSLoaders(_packageDir, executionDir, tsConfig, appRootDir, entrypoint),
         },

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@rws-framework/client",
     "private": false,
-    "version": "2.18.1",
+    "version": "2.18.3",
     "main": "src/index.ts",
     "scripts": {
         "docs": "typedoc --tsconfig ./tsconfig.json"
@@ -44,7 +44,8 @@
         "upload": "^1.3.2",
         "url-router": "^13.0.0",
         "uuid": "^9.0.1",
-        "v4": "^0.0.1"
+        "v4": "^0.0.1",
+        "scss-loading-animations": "^1.0.1"
     },
     "devDependencies": {
         "@types/dragula": "^3.7.4",

package/src/client/config.ts

@@ -152,11 +152,11 @@ async function start(this: RWSClientInstance, config: IRWSConfig = {}): Promise<
         await plugin.onClientStart();
     }
 
-    if(this.appConfig.get('hotReload')){
-        if (module.hot) {
-            module.hot.accept();
-        }
-    }
+    // if(this.appConfig.get('hotReload')){
+    //     if (module.hot) {
+    //         module.hot.accept();
+    //     }
+    // }
 
     return this;
 }

package/src/components/rws/loader/component.ts

@@ -1,8 +1,9 @@
 import { RWSView } from '../../_decorator';
 import { RWSViewComponent } from '../../_component';
+import { attr } from '@microsoft/fast-element';
 
-@RWSView('the-loader')
-class RWSLoader extends RWSViewComponent {
+@RWSView('rws-loader')
+class RWSLoader extends RWSViewComponent {    
     connectedCallback(): void {
         super.connectedCallback();
     }

package/src/components/rws/loader/styles/layout.scss

@@ -1,14 +1,14 @@
 //loader
 //save
-$loader-color: var(--primary-color, #eb7b13);
-$loader-size: 56px;
+$loader-color: var(--rws-loader-color, #eb7b13);
+$loader-size: 26px;
 $loader-height: 20px;
 $loader-border-size: 8px;
 $loader-gap: 12px;
 $loader-animation-duration: 1s;
 
-// @import "~/scss-loading-animations/src/loaders";
+@import "~/scss-loading-animations/src/loaders";
 
-// .loader {
-//   @include loader01;
-// }
+.loader {
+  @include loader06;
+}

package/src/components/rws/rws-modal/component.ts

@@ -5,8 +5,13 @@ import { RWSView} from '../../_decorator';
 @RWSView('rws-modal')
 class RWSModal extends RWSViewComponent {      
     @observable closeModal: () => void
+    @observable onShowModal: ($: ShadowRoot) => void
+
     connectedCallback(): void {
-        super.connectedCallback();        
+        super.connectedCallback(); 
+        if(this.onShowModal){
+            this.onShowModal(this.shadowRoot);
+        }       
     }
 }
 

package/src/services/ApiService.ts

@@ -45,7 +45,7 @@ type IBackendRoute = IHTTProute | IPrefixedHTTProutes;
 
 class ApiService extends TheService {
     static _DEFAULT: boolean = true;
-    private token?: string;    
+    public token?: string;    
 
     constructor(@ConfigService public config: ConfigServiceInstance) {
         super();        
@@ -60,7 +60,7 @@ class ApiService extends TheService {
 
     public async isGetTargetReachable(url: string, options: IAPIOptions = {}): Promise<boolean> {
         try {    
-            return !!(await calls.pureGet(url, options, this.token));
+            return !!(await calls.pureGet.bind(this)(url, options));
         } catch (error) {
             return false;
         }
@@ -89,16 +89,16 @@ class ApiService extends TheService {
     public delete = calls.delete;
 
     public back = {
-        get: <T>(routeName: string, options?: IAPIOptions): Promise<T> => calls.get(backend.getBackendUrl.bind(this)(routeName, options?.routeParams), options, this.token),
-        post: <T, P extends object = object>(routeName: string, payload?: P, options?: IAPIOptions): Promise<T> => calls.post(backend.getBackendUrl.bind(this)(routeName, options?.routeParams), payload, options, this.token),
-        put: <T, P extends object = object>(routeName: string, payload: P, options?: IAPIOptions): Promise<T> => calls.put(backend.getBackendUrl.bind(this)(routeName, options?.routeParams), payload, options, this.token),
-        delete: <T>(routeName: string, options?: IAPIOptions): Promise<T> => calls.delete(backend.getBackendUrl.bind(this)(routeName, options?.routeParams), options, this.token),
-        uploadFile: (routeName: string, file: File, onProgress: (progress: number) => void, options: IAPIOptions = {}, payload: any = {}): Promise<UploadResponse> => this.uploadFile(backend.getBackendUrl.bind(this)(routeName, options?.routeParams), file, onProgress, payload),
+        get: async <T>(routeName: string, options?: IAPIOptions, token?: string): Promise<T> => calls.get.bind(this)(backend.getBackendUrl.bind(this)(routeName, options?.routeParams), options) as Promise<T>,
+        post: async <T, P extends object = object>(routeName: string, payload?: P, options?: IAPIOptions): Promise<T> => calls.post.bind(this)(backend.getBackendUrl.bind(this)(routeName, options?.routeParams), payload, options) as Promise<T>,
+        put: async <T, P extends object = object>(routeName: string, payload: P, options?: IAPIOptions): Promise<T> => calls.put.bind(this)(backend.getBackendUrl.bind(this)(routeName, options?.routeParams), payload, options) as Promise<T>,
+        delete: async <T>(routeName: string, options?: IAPIOptions): Promise<T> => calls.delete.bind(this)(backend.getBackendUrl.bind(this)(routeName, options?.routeParams), options) as Promise<T>,
+        uploadFile: async (routeName: string, file: File, onProgress: (progress: number) => void, options: IAPIOptions = {}, payload: any = {}): Promise<UploadResponse> => this.uploadFile(backend.getBackendUrl.bind(this)(routeName, options?.routeParams), file, onProgress, payload),
     };
 
     async getResource(resourceName: string): Promise<IKDBTypesResponse>
     {        
-        return calls.get(`${this.config.get('backendUrl')}${this.config.get('apiPrefix') || ''}/api/rws/resource/${resourceName}`)
+        return calls.get.bind(this)(`${this.config.get('backendUrl')}${this.config.get('apiPrefix') || ''}/api/rws/resource/${resourceName}`) as Promise<IKDBTypesResponse>
     }
 }
 

package/src/services/_api/backend.ts

@@ -2,7 +2,7 @@ import { ApiServiceInstance, IBackendRoute, IHTTProute } from "../ApiService";
 import { ConfigServiceInstance } from "../ConfigService";
 
 export const backend = {
-    getBackendUrl(this: ApiServiceInstance, routeName: string, params: {[key: string]: string} = {})
+    getBackendUrl(this: ApiServiceInstance, routeName: string, params: {[key: string]: string} = {}): string
     {       
         const config = this.config;
         const routesPackage = config.get('backendRoutes');

package/src/services/_api/calls.ts

@@ -1,10 +1,11 @@
-import { IAPIOptions } from "../ApiService";
+import { ApiServiceInstance, IAPIOptions } from "../ApiService";
 
 const _DEFAULT_CONTENT_TYPE = 'application/json';
 
+type HeadersType = Headers | [string, string][] | Record<string, string>;
+
 export const calls = {
-    addHeader(headers: Headers | [string, string][] | {[key: string]: string}, key: string, val: string)
-    {
+    addHeader(headers: HeadersType, key: string, val: string): void {
         if (headers instanceof Headers) {
             headers.append(key, val);
         } else if (Array.isArray(headers)) {
@@ -13,29 +14,31 @@ export const calls = {
             headers[key] = val;
         }
     },
-    getHeaders(token: string = null, optHeaders: HeadersInit = {}): HeadersInit {
-        const headers: HeadersInit = { ...optHeaders };                
+
+    getHeaders(token: string | null = null, optHeaders: HeadersInit = {}): HeadersInit {
+        const headers: Record<string, string> = { ...(optHeaders as Record<string, string>) };
 
         if (!('Content-Type' in headers)) {
             this.addHeader(headers, 'Content-Type', _DEFAULT_CONTENT_TYPE);
-        }            
- 
+        }
+
         if (token) {
-            this.addHeader(headers, 'Authorization', `Bearer ${token}`);            
-        }        
+            this.addHeader(headers, 'Authorization', `Bearer ${token}`);
+        }
 
-        if((headers as any)['Content-Type']){
+        if (headers['Content-Type']) {
             this.addHeader(headers, 'Accept', '*/*');
-        }else{
-            this.addHeader(headers, 'Accept', (headers as any)['Content-Type']);
+        } else {
+            this.addHeader(headers, 'Accept', headers['Content-Type'] || _DEFAULT_CONTENT_TYPE);
         }
 
         return headers;
     },
-    async pureGet(url: string, options: IAPIOptions = {}, token: string = null): Promise<string> {
+
+    async pureGet(this: ApiServiceInstance, url: string, options: IAPIOptions = {}): Promise<string> {
         try {
             const response = await fetch(url, {
-                headers: this.getHeaders(token, options.headers),
+                headers: calls.getHeaders(this.token, options.headers),
             });
             return await response.text();
         } catch (error) {
@@ -43,53 +46,71 @@ export const calls = {
             throw error;
         }
     },
-    async get<T>(url: string, options: IAPIOptions = {}, token: string = null): Promise<T> {
+
+    async get<T>(this: ApiServiceInstance, url: string, options: IAPIOptions = {}): Promise<T> {
         try {
             const response = await fetch(url, {
-                headers: this.getHeaders(token, options.headers),
+                headers: calls.getHeaders(this.token, options.headers),
             });
-            return await response.json();
+            const data: T = await response.json();
+            return data;
         } catch (error) {
             console.error('GET request failed:', error);
             throw error;
         }
-    },    
-    async post<T, P extends object = object>(url: string, payload?: P, options: IAPIOptions = {}, token: string = null): Promise<T> {
+    },
+
+    async post<T, P extends object = object>(
+        this: ApiServiceInstance,
+        url: string,
+        payload?: P,
+        options: IAPIOptions = {}
+    ): Promise<T> {
         try {
             const response = await fetch(url, {
                 method: 'POST',
-                headers: this.getHeaders(token, options.headers),
+                headers: calls.getHeaders(this.token, options.headers),
                 body: payload ? JSON.stringify(payload) : null,
             });
-            return await response.json();
+            const data: T = await response.json();
+            return data;
         } catch (error) {
             console.error('POST request failed:', error);
             throw error;
         }
-    },    
-    async put<T, P extends object = object>(url: string, payload?: P, options: IAPIOptions = {}, token: string = null): Promise<T> {
+    },
+
+    async put<T, P extends object = object>(
+        this: ApiServiceInstance,
+        url: string,
+        payload: P,
+        options: IAPIOptions = {}
+    ): Promise<T> {
         try {
             const response = await fetch(url, {
                 method: 'PUT',
-                headers: this.getHeaders(token, options.headers),
-                body: payload ? JSON.stringify(payload) : null,
+                headers: calls.getHeaders(this.token, options.headers),
+                body: JSON.stringify(payload),
             });
-            return await response.json();
+            const data: T = await response.json();
+            return data;
         } catch (error) {
             console.error('PUT request failed:', error);
             throw error;
         }
-    },    
-    async delete<T>(url: string, options: IAPIOptions = {}, token: string = null): Promise<T> {
+    },
+
+    async delete<T>(this: ApiServiceInstance, url: string, options: IAPIOptions = {}): Promise<T> {
         try {
             const response = await fetch(url, {
                 method: 'DELETE',
-                headers: this.getHeaders(token, options.headers),
+                headers: calls.getHeaders(this.token, options.headers),
             });
-            return await response.json();
+            const data: T = await response.json();
+            return data;
         } catch (error) {
             console.error('DELETE request failed:', error);
             throw error;
         }
     }
-}
+};

package/cfg/build_steps/webpack/_dev_servers.js

@@ -1,15 +0,0 @@
-
-
-function webpackDevServer(BuildConfigurator, rwsFrontendConfig, cfgExport){
-    const backendUrl = BuildConfigurator.get('backendUrl') || rwsFrontendConfig.backendUrl;
-    const apiPort = BuildConfigurator.get('apiPort') || rwsFrontendConfig.apiPort;
-    
-    if (backendUrl && apiPort) {
-        // cfgExport.devServer = {
-        //   hot: true, // Enable hot module replacement
-        //   open: true, // Automatically open the browser
-        // }
-    }
-}
-
-module.exports = { webpackDevServer }