@rws-framework/client 2.20.1 → 2.20.2

package/src/services/UtilsService.ts

@@ -1,60 +1,60 @@
-import TheService from './_service';
-import ApiService, {ApiServiceInstance} from './ApiService';
-
-import { RawSourceMap  } from 'source-map';
-
-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';
-
-        if (!isObject(target) || !isObject(source)) {
-            return source;
-        }
-
-        Object.keys(source).forEach(key => {
-            const targetValue = target[key];
-            const sourceValue = source[key];
-
-            if (Array.isArray(targetValue) && Array.isArray(sourceValue)) {
-                target[key] = targetValue.concat(sourceValue);
-            } else if (isObject(targetValue) && isObject(sourceValue)) {
-                target[key] = this.mergeDeep(Object.assign({}, targetValue), sourceValue);
-            } else {
-                target[key] = sourceValue;
-            }
-        });
-
-        return target;
-    }
-
-    async fetchSourceMap(jsFilePath: string): Promise<RawSourceMap> 
-    {
-        // Assuming the source map URL is the JS file URL with a '.map' extension
-        const sourceMapUrl = jsFilePath;
-
-        try {
-            const response = await fetch(sourceMapUrl);
-            if (!response.ok) {
-                throw new Error(`HTTP error! Status: ${response.status}`);
-            }
-            return await response.json();
-        } catch (error) {
-            console.error('Failed to fetch source map:', error);
-            return null;
-        }
-    }
-
-    async getCurrentLineNumber(error: Error = null): Promise<number> {
-        if(!error){
-            error = new Error();
-        }  
-        
-        return 0;
-    }    
-}
-
-export default UtilsService.getSingleton();
-
-export { UtilsService as UtilsServiceInstance };
+import TheService from './_service';
+import ApiService, {ApiServiceInstance} from './ApiService';
+
+import { RawSourceMap  } from 'source-map';
+
+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';
+
+        if (!isObject(target) || !isObject(source)) {
+            return source;
+        }
+
+        Object.keys(source).forEach(key => {
+            const targetValue = target[key];
+            const sourceValue = source[key];
+
+            if (Array.isArray(targetValue) && Array.isArray(sourceValue)) {
+                target[key] = targetValue.concat(sourceValue);
+            } else if (isObject(targetValue) && isObject(sourceValue)) {
+                target[key] = this.mergeDeep(Object.assign({}, targetValue), sourceValue);
+            } else {
+                target[key] = sourceValue;
+            }
+        });
+
+        return target;
+    }
+
+    async fetchSourceMap(jsFilePath: string): Promise<RawSourceMap> 
+    {
+        // Assuming the source map URL is the JS file URL with a '.map' extension
+        const sourceMapUrl = jsFilePath;
+
+        try {
+            const response = await fetch(sourceMapUrl);
+            if (!response.ok) {
+                throw new Error(`HTTP error! Status: ${response.status}`);
+            }
+            return await response.json();
+        } catch (error) {
+            console.error('Failed to fetch source map:', error);
+            return null;
+        }
+    }
+
+    async getCurrentLineNumber(error: Error = null): Promise<number> {
+        if(!error){
+            error = new Error();
+        }  
+        
+        return 0;
+    }    
+}
+
+export default UtilsService.getSingleton();
+
+export { UtilsService as UtilsServiceInstance };

package/src/services/_service.ts

@@ -1,65 +1,65 @@
-import RWSContainer, { DI, InterfaceSymbol, Key, Registration } from '../components/_container';
-import { loadRWSRichWindow } from '../types/RWSWindow';
-
-export interface IWithDI<T> {
-    new (...args: any[]): T;
-    getSingleton: <T extends Key>(this: IWithDI<T>) => InterfaceSymbol<T>;
-    register: <T extends Key>(this: IWithDI<T>) => void;    
-}
-
-export default abstract class TheRWSService {
-    _RELOADABLE: boolean = false;
-    static _IN_CLIENT: boolean = false;
-    static _DEFAULT: boolean = false;
-
-    constructor() {    
-    }
-
-    register<T extends Key>(this: IWithDI<T>): void 
-    {
-        this.getSingleton();
-    }
-    
-    getSingleton<T extends Key>(this: IWithDI<T>): InterfaceSymbol<T> 
-    {
-        return this.getSingleton();
-    }
-
-    public static register<T extends Key>(this: IWithDI<T>): void
-    {                                        
-        this.getSingleton();
-    }
-    
-    public static getSingleton<T extends Key>(this: IWithDI<T>, serviceName: string = null): InterfaceSymbol<T>
-    {                  
-        const richWindow = loadRWSRichWindow();        
-
-        if(!serviceName){
-            serviceName = this.name;
-        }
-
-        if(Object.keys(richWindow.RWS._registered).includes(serviceName)){            
-            return richWindow.RWS._registered[serviceName];        
-        }
-
-        const interf = DI.createInterface<T>(serviceName);
-   
-        RWSContainer().register(
-            Registration.singleton(interf, this)
-        );
-
-        richWindow.RWS._registered[serviceName] = interf;
-
-        return interf;
-    }
-
-    isDefault(): boolean
-    {
-        return (this as any).constructor._DEFAULT;
-    }
-    
-    isInClient(): boolean
-    {
-        return (this as any).constructor._IN_CLIENT;
-    }
+import RWSContainer, { DI, InterfaceSymbol, Key, Registration } from '../components/_container';
+import { loadRWSRichWindow } from '../types/RWSWindow';
+
+export interface IWithDI<T> {
+    new (...args: any[]): T;
+    getSingleton: <T extends Key>(this: IWithDI<T>) => InterfaceSymbol<T>;
+    register: <T extends Key>(this: IWithDI<T>) => void;    
+}
+
+export default abstract class TheRWSService {
+    _RELOADABLE: boolean = false;
+    static _IN_CLIENT: boolean = false;
+    static _DEFAULT: boolean = false;
+
+    constructor() {    
+    }
+
+    register<T extends Key>(this: IWithDI<T>): void 
+    {
+        this.getSingleton();
+    }
+    
+    getSingleton<T extends Key>(this: IWithDI<T>): InterfaceSymbol<T> 
+    {
+        return this.getSingleton();
+    }
+
+    public static register<T extends Key>(this: IWithDI<T>): void
+    {                                        
+        this.getSingleton();
+    }
+    
+    public static getSingleton<T extends Key>(this: IWithDI<T>, serviceName: string = null): InterfaceSymbol<T>
+    {                  
+        const richWindow = loadRWSRichWindow();        
+
+        if(!serviceName){
+            serviceName = this.name;
+        }
+
+        if(Object.keys(richWindow.RWS._registered).includes(serviceName)){            
+            return richWindow.RWS._registered[serviceName];        
+        }
+
+        const interf = DI.createInterface<T>(serviceName);
+   
+        RWSContainer().register(
+            Registration.singleton(interf, this)
+        );
+
+        richWindow.RWS._registered[serviceName] = interf;
+
+        return interf;
+    }
+
+    isDefault(): boolean
+    {
+        return (this as any).constructor._DEFAULT;
+    }
+    
+    isInClient(): boolean
+    {
+        return (this as any).constructor._IN_CLIENT;
+    }
 }

package/src/styles/README.md

@@ -1,158 +1,158 @@
-# RWS Grid System
-A flexible SASS-based grid system providing responsive column layouts with simple syntax.
-
-## Table of Contents
-- [Installation](#installation)
-- [Breakpoints](#breakpoints)
-- [Basic Usage](#basic-usage)
-- [Mixins](#mixins)
-- [Examples](#examples)
-
-## Installation
-Import the mixins file into your SASS project:
-
-```scss
-@import '@rws-mixins';
-```
-
-## Breakpoints
-The system uses three main breakpoint values:
-
-| Name | Default Width | CSS Variable |
-|------|---------------|-------------|
-| md   | 1200px       | --rws-md-width |
-| sm   | 992px        | --rws-sm-width |
-| xs   | 768px        | --rws-xs-width |
-
-Breakpoints can be customized using CSS variables or directly in the `$breakpoints` map.
-
-## Basic Usage
-
-### Grid Container
-```scss
-.container {
-@include rws-gr; // Basic flex container
-@include rws-gr-gap(20px); // Adds gaps between columns
-}
-```
-
-### Responsive Columns
-```scss
-.column {
-@include rws-gr-col(3, 4, 6, 12);
-// 3 columns on large screens
-// 4 columns on medium screens (< 1200px)
-// 6 columns on small screens (< 992px)
-// 12 columns on extra small screens (< 768px)
-}
-```
-
-## Mixins
-
-### rws-gr
-Creates a basic flexbox container with wrap enabled.
-```scss
-@include rws-gr;
-```
-
-### rws-gr-gap($gap)
-Adds spacing between columns.
-```scss
-@include rws-gr-gap(20px);
-```
-
-### rws-gr-col($lg, $md, $sm, $xs)
-Defines column width for different breakpoints.
-- `$lg`: width for large screens (default 12)
-- `$md`: width for medium screens (optional)
-- `$sm`: width for small screens (optional)
-- `$xs`: width for extra small screens (optional)
-
-### rws-gr-align($h, $v)
-Controls alignment of items in the container.
-- `$h`: horizontal alignment (default flex-start)
-- `$v`: vertical alignment (default top)
-
-### rws-gr-center
-Centers the container relative to its parent.
-
-## Examples
-
-### Basic Layout with Gaps
-```scss
-.container {
-@include rws-gr;
-@include rws-gr-gap(20px);
-@include rws-gr-center;
-
-.column {
-  @include rws-gr-col(4, 6, 12);
-}
-}
-```
-
-### Aligned Layout
-```scss
-.aligned-container {
-@include rws-gr;
-@include rws-gr-align(center, center);
-
-.column {
-  @include rws-gr-col(3);
-}
-}
-```
-
-### Complete Responsive Layout Example
-```scss
-.page-layout {
-@include rws-gr;
-@include rws-gr-gap(30px);
-@include rws-gr-center;
-
-.sidebar {
-  @include rws-gr-col(3, 4, 12);
-}
-
-.main-content {
-  @include rws-gr-col(9, 8, 12);
-}
-
-.footer {
-  @include rws-gr-col(12);
-}
-}
-```
-
-## Advanced Tips
-
-### Custom Breakpoints
-You can override default breakpoints using CSS variables:
-```css
-:root {
---rws-md-width: 1400px;
---rws-sm-width: 1024px;
---rws-xs-width: 800px;
-}
-```
-
-### Column Calculation
-The system uses a 12-column grid by default. Column widths are calculated using:
-```scss
-width = (100% / 12) * columns
-```
-
-### Best Practices
-1. Always start with mobile layout first
-2. Use semantic class names
-3. Avoid deeply nested grids
-4. Consider using the gap mixin for consistent spacing
-5. Test layouts across different screen sizes
-
-## Browser Support
-This grid system relies on modern CSS features including:
-- Flexbox
-- CSS Custom Properties (CSS Variables)
-- CSS calc()
-
+# RWS Grid System
+A flexible SASS-based grid system providing responsive column layouts with simple syntax.
+
+## Table of Contents
+- [Installation](#installation)
+- [Breakpoints](#breakpoints)
+- [Basic Usage](#basic-usage)
+- [Mixins](#mixins)
+- [Examples](#examples)
+
+## Installation
+Import the mixins file into your SASS project:
+
+```scss
+@import '@rws-mixins';
+```
+
+## Breakpoints
+The system uses three main breakpoint values:
+
+| Name | Default Width | CSS Variable |
+|------|---------------|-------------|
+| md   | 1200px       | --rws-md-width |
+| sm   | 992px        | --rws-sm-width |
+| xs   | 768px        | --rws-xs-width |
+
+Breakpoints can be customized using CSS variables or directly in the `$breakpoints` map.
+
+## Basic Usage
+
+### Grid Container
+```scss
+.container {
+@include rws-gr; // Basic flex container
+@include rws-gr-gap(20px); // Adds gaps between columns
+}
+```
+
+### Responsive Columns
+```scss
+.column {
+@include rws-gr-col(3, 4, 6, 12);
+// 3 columns on large screens
+// 4 columns on medium screens (< 1200px)
+// 6 columns on small screens (< 992px)
+// 12 columns on extra small screens (< 768px)
+}
+```
+
+## Mixins
+
+### rws-gr
+Creates a basic flexbox container with wrap enabled.
+```scss
+@include rws-gr;
+```
+
+### rws-gr-gap($gap)
+Adds spacing between columns.
+```scss
+@include rws-gr-gap(20px);
+```
+
+### rws-gr-col($lg, $md, $sm, $xs)
+Defines column width for different breakpoints.
+- `$lg`: width for large screens (default 12)
+- `$md`: width for medium screens (optional)
+- `$sm`: width for small screens (optional)
+- `$xs`: width for extra small screens (optional)
+
+### rws-gr-align($h, $v)
+Controls alignment of items in the container.
+- `$h`: horizontal alignment (default flex-start)
+- `$v`: vertical alignment (default top)
+
+### rws-gr-center
+Centers the container relative to its parent.
+
+## Examples
+
+### Basic Layout with Gaps
+```scss
+.container {
+@include rws-gr;
+@include rws-gr-gap(20px);
+@include rws-gr-center;
+
+.column {
+  @include rws-gr-col(4, 6, 12);
+}
+}
+```
+
+### Aligned Layout
+```scss
+.aligned-container {
+@include rws-gr;
+@include rws-gr-align(center, center);
+
+.column {
+  @include rws-gr-col(3);
+}
+}
+```
+
+### Complete Responsive Layout Example
+```scss
+.page-layout {
+@include rws-gr;
+@include rws-gr-gap(30px);
+@include rws-gr-center;
+
+.sidebar {
+  @include rws-gr-col(3, 4, 12);
+}
+
+.main-content {
+  @include rws-gr-col(9, 8, 12);
+}
+
+.footer {
+  @include rws-gr-col(12);
+}
+}
+```
+
+## Advanced Tips
+
+### Custom Breakpoints
+You can override default breakpoints using CSS variables:
+```css
+:root {
+--rws-md-width: 1400px;
+--rws-sm-width: 1024px;
+--rws-xs-width: 800px;
+}
+```
+
+### Column Calculation
+The system uses a 12-column grid by default. Column widths are calculated using:
+```scss
+width = (100% / 12) * columns
+```
+
+### Best Practices
+1. Always start with mobile layout first
+2. Use semantic class names
+3. Avoid deeply nested grids
+4. Consider using the gap mixin for consistent spacing
+5. Test layouts across different screen sizes
+
+## Browser Support
+This grid system relies on modern CSS features including:
+- Flexbox
+- CSS Custom Properties (CSS Variables)
+- CSS calc()
+
 Ensure your target browsers support these features or include appropriate fallbacks.

package/src/styles/_darkreader.scss

@@ -1,30 +1,30 @@
-$darkreader-base-globals: (
-    'neutral-background': var(--rws-darkreader-neutral-background, #212222),
-    'neutral-text': var(--rws-darkreader-neutral-text, #eae3d9),
-    'selection-background': var(--rws-darkreader-selection-background, #165aaa),
-    'selection-text': var(--rws-darkreader-selection-text, #624e2f)
-);
-
-$darkreader-elements: ('text', 'bg', 'border', 'neutral', 'selection');
-
-@mixin darkreader-for-var($element, $variable_name, $color){
-    --darkreader-#{$element}--#{$variable_name}: #{$color};
-}
-
-@mixin darkreader-for-varmap($element, $variable-map){
-    @each $key, $value in $variable-map {
-        @include darkreader-for-var($element, $key, $value);
-    }
-}
-
-@mixin darkreader-all-for-varmap($variable-map){
-    @each $element in $darkreader-elements {
-        @include darkreader-for-varmap($element, $variable-map);
-    }
-}
-
-@mixin darkreader-global(){
-    @each $field, $color in $darkreader-base-globals {
-        --darkreader-#{$field}: #{$color};
-    }
-}
+$darkreader-base-globals: (
+    'neutral-background': var(--rws-darkreader-neutral-background, #212222),
+    'neutral-text': var(--rws-darkreader-neutral-text, #eae3d9),
+    'selection-background': var(--rws-darkreader-selection-background, #165aaa),
+    'selection-text': var(--rws-darkreader-selection-text, #624e2f)
+);
+
+$darkreader-elements: ('text', 'bg', 'border', 'neutral', 'selection');
+
+@mixin darkreader-for-var($element, $variable_name, $color){
+    --darkreader-#{$element}--#{$variable_name}: #{$color};
+}
+
+@mixin darkreader-for-varmap($element, $variable-map){
+    @each $key, $value in $variable-map {
+        @include darkreader-for-var($element, $key, $value);
+    }
+}
+
+@mixin darkreader-all-for-varmap($variable-map){
+    @each $element in $darkreader-elements {
+        @include darkreader-for-varmap($element, $variable-map);
+    }
+}
+
+@mixin darkreader-global(){
+    @each $field, $color in $darkreader-base-globals {
+        --darkreader-#{$field}: #{$color};
+    }
+}