npm - dynamic-ds - Versions diffs - 1.0.1 → 1.0.2 - Mend

dynamic-ds 1.0.1 → 1.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/README.md +44 -11
package/fesm2022/dynamic-ds.mjs +61 -16
package/fesm2022/dynamic-ds.mjs.map +1 -1
package/lib/dynamic-ds.module.d.ts +23 -0
package/package.json +3 -3
package/public-api.d.ts +1 -0

package/README.md CHANGED Viewed

@@ -28,28 +28,43 @@ npm install dynamic-ds
 ### 🚀 Quick Start
-#### 1. Import Styles
+#### 1. Import Module
-Add the design system styles to your `angular.json`:
+In your `app.module.ts`:
-```json
-{
-  "styles": [
-    "node_modules/dynamic-ds/styles/system-design.scss"
-  ]
-}
+```typescript
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+import { DynamicDsModule } from 'dynamic-ds';
+import { AppComponent } from './app.component';
+@NgModule({
+  declarations: [AppComponent],
+  imports: [
+    BrowserModule,
+    DynamicDsModule.forRoot({
+      brand: '#2740B4',
+      primary: '#006BDF',
+      secondary: '#9F5100',
+      functional: '#006BDF',
+      utility: '#CF0026'
+    })
+  ],
+  bootstrap: [AppComponent]
+})
+export class AppModule { }
 ```
-#### 2. Provide Configuration (Optional)
-In your `app.config.ts` or module:
+**For standalone apps** (Angular 14+), in your `app.config.ts`:
 ```typescript
 import { ApplicationConfig } from '@angular/core';
+import { provideAnimations } from '@angular/platform-browser/animations';
 import { SYSTEM_DESIGN_CONFIG } from 'dynamic-ds';
 export const appConfig: ApplicationConfig = {
   providers: [
+    provideAnimations(),
     {
       provide: SYSTEM_DESIGN_CONFIG,
       useValue: {
@@ -64,6 +79,24 @@ export const appConfig: ApplicationConfig = {
 };
 ```
+#### 2. Import Styles
+Add the design system styles to your `angular.json`:
+```json
+{
+  "styles": [
+    "node_modules/dynamic-ds/src/lib/styles/system-design.scss"
+  ]
+}
+```
+Or import directly in your `styles.scss`:
+```scss
+@import 'dynamic-ds/src/lib/styles/system-design.scss';
+```
 #### 3. Initialize Theme
 In your `app.component.ts`:

package/fesm2022/dynamic-ds.mjs CHANGED Viewed

@@ -1,7 +1,25 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, Optional, Inject, Injectable, Component } from '@angular/core';
+import { Component, InjectionToken, Optional, Inject, Injectable, NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
 import { of } from 'rxjs';
+class DynamicDsComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DynamicDsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.18", type: DynamicDsComponent, isStandalone: true, selector: "lib-dynamic-ds", ngImport: i0, template: `
+    <p>
+      fis-ds works!
+    </p>
+  `, isInline: true, styles: [""] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DynamicDsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-dynamic-ds', imports: [], template: `
+    <p>
+      fis-ds works!
+    </p>
+  ` }]
+        }] });
 // Token để inject config (Cầu nối giữa App và Lib)
 const SYSTEM_DESIGN_CONFIG = new InjectionToken('SYSTEM_DESIGN_CONFIG');
@@ -303,21 +321,48 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
                     args: [SYSTEM_DESIGN_CONFIG]
                 }] }] });
-class DynamicDsComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DynamicDsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.18", type: DynamicDsComponent, isStandalone: true, selector: "lib-dynamic-ds", ngImport: i0, template: `
-    <p>
-      fis-ds works!
-    </p>
-  `, isInline: true, styles: [""] });
+class DynamicDsModule {
+    /**
+     * Use this method in your app.module.ts to configure the Design System
+     * @param config SystemDesignConfig with your custom colors
+     * @example
+     * DynamicDsModule.forRoot({
+     *   brand: '#006BDF',
+     *   primary: '#006BDF',
+     *   secondary: '#9F5100',
+     *   functional: '#006BDF',
+     *   utility: '#CF0026'
+     * })
+     */
+    static forRoot(config) {
+        return {
+            ngModule: DynamicDsModule,
+            providers: [
+                DynamicDsService,
+                {
+                    provide: SYSTEM_DESIGN_CONFIG,
+                    useValue: config || {}
+                }
+            ]
+        };
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DynamicDsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.18", ngImport: i0, type: DynamicDsModule, imports: [CommonModule,
+            DynamicDsComponent // Standalone component
+        ], exports: [DynamicDsComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DynamicDsModule, imports: [CommonModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DynamicDsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-dynamic-ds', imports: [], template: `
-    <p>
-      fis-ds works!
-    </p>
-  ` }]
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DynamicDsModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        DynamicDsComponent // Standalone component
+                    ],
+                    exports: [
+                        DynamicDsComponent
+                    ]
+                }]
         }] });
 /*
@@ -328,5 +373,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
  * Generated bundle index. Do not edit.
  */
-export { DynamicDsComponent, DynamicDsService, SYSTEM_DESIGN_CONFIG };
+export { DynamicDsComponent, DynamicDsModule, DynamicDsService, SYSTEM_DESIGN_CONFIG };
 //# sourceMappingURL=dynamic-ds.mjs.map

package/fesm2022/dynamic-ds.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dynamic-ds.mjs","sources":["../../../projects/dynamic-ds/src/lib/dynamic-ds.config.ts","../../../projects/dynamic-ds/src/lib/dynamic-ds.service.ts","../../../projects/dynamic-ds/src/lib/dynamic-ds.component.ts","../../../projects/dynamic-ds/src/public-api.ts","../../../projects/dynamic-ds/src/dynamic-ds.ts"],"sourcesContent":["import { InjectionToken } from '@angular/core';\r\n\r\n// Interface định nghĩa các màu cần thiết\r\nexport interface SystemDesignConfig {\r\n brand?: string;\r\n primary?: string;\r\n secondary?: string;\r\n functional?: string;\r\n utility?: string;\r\n}\r\n\r\n// Token để inject config (Cầu nối giữa App và Lib)\r\nexport const SYSTEM_DESIGN_CONFIG = new InjectionToken<SystemDesignConfig>(\r\n 'SYSTEM_DESIGN_CONFIG',\r\n);\r\n","import { Inject, Injectable, Optional } from '@angular/core';\r\nimport { SYSTEM_DESIGN_CONFIG, SystemDesignConfig } from './dynamic-ds.config';\r\nimport { Observable, of } from 'rxjs';\r\n\r\n@Injectable({\r\n providedIn: 'root',\r\n})\r\nexport class DynamicDsService {\r\n // Default colors\r\n private readonly DEFAULT_BRAND = '#006BDF';\r\n private readonly DEFAULT_PRIMARY = '#006BDF';\r\n private readonly DEFAULT_SECONDARY = '#9F5100';\r\n private readonly DEFAULT_FUNCTIONAL = '#006BDF';\r\n private readonly DEFAULT_UTILITY = '#CF0026';\r\n\r\n constructor(\r\n @Optional()\r\n @Inject(SYSTEM_DESIGN_CONFIG)\r\n private readonly config: SystemDesignConfig,\r\n ) {}\r\n\r\n /*\r\n Initialize theme colors from system config\r\n * Call this method during app initialization (e.g., in APP_INITIALIZER)\r\n * Each color is processed independently - uses fetched value if available, otherwise uses default\r\n * @returns Observable that completes when theme initialization is done\r\n /\r\n initializeTheme(): Observable<any> {\r\n console.log('[SystemDesignService] Initializing theme...');\r\n\r\n try {\r\n const brandColor = this.config?.brand;\r\n const primaryColor = this.config?.primary;\r\n const secondaryColor = this.config?.secondary;\r\n const functionalColor = this.config?.functional;\r\n const utilityColor = this.config?.utility;\r\n\r\n // Process each color individually - use fetched value OR default\r\n this.applyColorOrDefault(brandColor, 'brand', this.DEFAULT_BRAND);\r\n this.applyColorOrDefault(primaryColor, 'primary', this.DEFAULT_PRIMARY);\r\n this.applyColorOrDefault(\r\n secondaryColor,\r\n 'secondary',\r\n this.DEFAULT_SECONDARY,\r\n );\r\n this.applyColorOrDefault(\r\n functionalColor,\r\n 'functional',\r\n this.DEFAULT_FUNCTIONAL,\r\n );\r\n this.applyColorOrDefault(utilityColor, 'utility', this.DEFAULT_UTILITY);\r\n\r\n console.log('[SystemDesignService] Theme initialization completed');\r\n return of(true);\r\n } catch (error) {\r\n // If entire fetch fails, fallback to all defaults\r\n console.warn(\r\n '[SystemDesignService] Failed to fetch theme config, using all defaults',\r\n error,\r\n );\r\n this.resetToDefaults();\r\n return of(false);\r\n }\r\n }\r\n\r\n /\r\n Reload theme colors from latest system config\r\n * This is a convenience method that's equivalent to initializeTheme()\r\n * but with a more descriptive name for runtime reloading\r\n \r\n Usage: After updating theme config, call this to apply new colors\r\n * @returns Observable that completes when theme is reloaded\r\n /\r\n reloadThemeFromConfig(): Observable<any> {\r\n console.log('[SystemDesignService] Reloading theme from current config...');\r\n return this.initializeTheme();\r\n }\r\n\r\n /\r\n Apply color if valid, otherwise use default\r\n * @param fetchedColor Color fetched from config (may be null/undefined/invalid)\r\n * @param type Color type\r\n * @param defaultColor Default color to use as fallback\r\n /\r\n private applyColorOrDefault(\r\n fetchedColor: string \| null \| undefined,\r\n type: 'primary' \| 'secondary' \| 'brand' \| 'functional' \| 'utility',\r\n defaultColor: string,\r\n ): void {\r\n // Check if fetched color exists and is valid\r\n if (fetchedColor && this.isValidHexColor(fetchedColor)) {\r\n this.setColorPalette(fetchedColor, type);\r\n console.log(\r\n `[SystemDesignService] Applied ${type}: ${fetchedColor} (from config)`,\r\n );\r\n } else {\r\n this.setColorPalette(defaultColor, type);\r\n const reason = !fetchedColor ? 'not found' : 'invalid format';\r\n console.log(\r\n `[SystemDesignService] Applied ${type}: ${defaultColor} (default - ${reason})`,\r\n );\r\n }\r\n }\r\n\r\n /\r\n Set color and generate full palette (900 -> 50)\r\n * @param color Hex color value (e.g., '#006BDF')\r\n * @param type Type of color ('primary' \| 'secondary' \| 'brand')\r\n /\r\n private setColorPalette(\r\n color: string,\r\n type: 'primary' \| 'secondary' \| 'brand' \| 'functional' \| 'utility',\r\n ): void {\r\n if (!this.isValidHexColor(color)) {\r\n console.error(`[SystemDesignService] Invalid color format: ${color}`);\r\n return;\r\n }\r\n\r\n // Set base color (600)\r\n document.documentElement.style.setProperty(`--${type}-color`, color);\r\n document.documentElement.style.setProperty(`--${type}-600`, color);\r\n\r\n // Set RGB for base color\r\n const rgb = this.hexToRgb(color);\r\n if (rgb) {\r\n const rgbValue = `${rgb.r}, ${rgb.g}, ${rgb.b}`;\r\n document.documentElement.style.setProperty(\r\n `--${type}-color-rgb`,\r\n rgbValue,\r\n );\r\n document.documentElement.style.setProperty(`--${type}-600-rgb`, rgbValue);\r\n }\r\n\r\n // Generate and set full palette\r\n const palette = this.generateColorPalette(color);\r\n\r\n Object.entries(palette).forEach(([shade, hexColor]) => {\r\n document.documentElement.style.setProperty(\r\n `--${type}-${shade}`,\r\n hexColor,\r\n );\r\n\r\n // Set RGB variant for each shade\r\n const shadeRgb = this.hexToRgb(hexColor);\r\n if (shadeRgb) {\r\n document.documentElement.style.setProperty(\r\n `--${type}-${shade}-rgb`,\r\n `${shadeRgb.r}, ${shadeRgb.g}, ${shadeRgb.b}`,\r\n );\r\n }\r\n });\r\n\r\n console.log(\r\n `[SystemDesignService] ${type} color palette generated from: ${color}`,\r\n );\r\n }\r\n\r\n /\r\n Generate color palette from base color\r\n * Creates all shades matching system-design.scss $shade-offsets\r\n * Uses RGB mix algorithm (mix with white/black) for accurate colors\r\n * @param baseColor Hex color string\r\n * @returns Object with shade keys and hex color values\r\n /\r\n private generateColorPalette(baseColor: string): Record<string, string> {\r\n const rgb = this.hexToRgb(baseColor);\r\n if (!rgb) {\r\n console.error('[SystemDesignService] Failed to convert color to RGB');\r\n return {};\r\n }\r\n\r\n // Shade offsets matching system-design.scss\r\n // Negative values = mix with black (darken)\r\n // Positive values = mix with white (lighten)\r\n const shadeOffsets: Record<string, number> = {\r\n '900': -73.5, // Darkest\r\n '875': -62.5,\r\n '850': -47.0,\r\n '800': -34.5,\r\n '700': -18.5,\r\n // '600' is the base color (0%), set separately\r\n '500': 17.5,\r\n '400': 33.0,\r\n '300': 53.0,\r\n '200': 72.0,\r\n '100': 85.0,\r\n '50': 89.5,\r\n '25': 93.5,\r\n '10': 97.0, // Lightest\r\n };\r\n\r\n const palette: Record<string, string> = {};\r\n\r\n Object.entries(shadeOffsets).forEach(([shade, offset]) => {\r\n palette[shade] = this.mixColor(rgb, offset);\r\n });\r\n\r\n return palette;\r\n }\r\n\r\n /\r\n Mix base color with white or black\r\n * @param baseRgb Base color RGB\r\n * @param weight Percentage to mix (-100 to 100)\r\n * Negative = mix with black (darken)\r\n * Positive = mix with white (lighten)\r\n * @returns Hex color string\r\n /\r\n private mixColor(\r\n baseRgb: { r: number; g: number; b: number },\r\n weight: number,\r\n ): string {\r\n const white = { r: 255, g: 255, b: 255 };\r\n const black = { r: 0, g: 0, b: 0 };\r\n\r\n let mixWith: { r: number; g: number; b: number };\r\n let mixWeight: number;\r\n\r\n if (weight > 0) {\r\n // Positive weight = mix with white (lighten)\r\n mixWith = white;\r\n mixWeight = weight / 100;\r\n } else {\r\n // Negative weight = mix with black (darken)\r\n mixWith = black;\r\n mixWeight = Math.abs(weight) / 100;\r\n }\r\n\r\n // Mix formula: result = base (1 - weight) + mixWith * weight\r\n const r = Math.round(baseRgb.r * (1 - mixWeight) + mixWith.r * mixWeight);\r\n const g = Math.round(baseRgb.g * (1 - mixWeight) + mixWith.g * mixWeight);\r\n const b = Math.round(baseRgb.b * (1 - mixWeight) + mixWith.b * mixWeight);\r\n\r\n return this.rgbToHex({ r, g, b });\r\n }\r\n\r\n /*\r\n Convert RGB to HEX\r\n * @param rgb RGB object\r\n * @returns Hex color string\r\n /\r\n private rgbToHex(rgb: { r: number; g: number; b: number }): string {\r\n const toHex = (n: number): string => {\r\n const hex = Math.max(0, Math.min(255, n)).toString(16);\r\n return hex.length === 1 ? '0' + hex : hex;\r\n };\r\n return `#${toHex(rgb.r)}${toHex(rgb.g)}${toHex(rgb.b)}`;\r\n }\r\n\r\n /\r\n Update system design colors dynamically\r\n * Call this when user changes theme colors in settings\r\n * Only updates colors that are provided and valid\r\n * @param colors Object containing colors to update (optional properties)\r\n /\r\n updateSystemDesignColor(colors: {\r\n primaryColor?: string;\r\n secondaryColor?: string;\r\n brandColor?: string;\r\n functionalColor?: string;\r\n utilityColor?: string;\r\n }): void {\r\n console.log('[SystemDesignService] Updating colors:', colors);\r\n\r\n // Update each color if provided and valid\r\n if (colors.brandColor) {\r\n if (this.isValidHexColor(colors.brandColor)) {\r\n this.setColorPalette(colors.brandColor, 'brand');\r\n } else {\r\n console.warn(\r\n '[SystemDesignService] Invalid brand color format:',\r\n colors.brandColor,\r\n );\r\n }\r\n }\r\n\r\n if (colors.primaryColor) {\r\n if (this.isValidHexColor(colors.primaryColor)) {\r\n this.setColorPalette(colors.primaryColor, 'primary');\r\n } else {\r\n console.warn(\r\n '[SystemDesignService] Invalid primary color format:',\r\n colors.primaryColor,\r\n );\r\n }\r\n }\r\n\r\n if (colors.secondaryColor) {\r\n if (this.isValidHexColor(colors.secondaryColor)) {\r\n this.setColorPalette(colors.secondaryColor, 'secondary');\r\n } else {\r\n console.warn(\r\n '[SystemDesignService] Invalid secondary color format:',\r\n colors.secondaryColor,\r\n );\r\n }\r\n }\r\n\r\n if (colors.functionalColor) {\r\n if (this.isValidHexColor(colors.functionalColor)) {\r\n this.setColorPalette(colors.functionalColor, 'functional');\r\n } else {\r\n console.warn(\r\n '[SystemDesignService] Invalid functional color format:',\r\n colors.functionalColor,\r\n );\r\n }\r\n }\r\n\r\n if (colors.utilityColor) {\r\n if (this.isValidHexColor(colors.utilityColor)) {\r\n this.setColorPalette(colors.utilityColor, 'utility');\r\n } else {\r\n console.warn(\r\n '[SystemDesignService] Invalid utility color format:',\r\n colors.utilityColor,\r\n );\r\n }\r\n }\r\n }\r\n\r\n /\r\n Get current theme colors\r\n * @returns Object with current brand, primary, secondary, functional, and utility colors\r\n /\r\n getCurrentColors(): {\r\n brand: string;\r\n primary: string;\r\n secondary: string;\r\n functional: string;\r\n utility: string;\r\n } {\r\n const style = getComputedStyle(document.documentElement);\r\n return {\r\n brand: style.getPropertyValue('--brand-color').trim(),\r\n primary: style.getPropertyValue('--primary-color').trim(),\r\n secondary: style.getPropertyValue('--secondary-color').trim(),\r\n functional: style.getPropertyValue('--functional-color').trim(),\r\n utility: style.getPropertyValue('--utility-color').trim(),\r\n };\r\n }\r\n\r\n /\r\n Reset to default colors\r\n /\r\n resetToDefaults(): void {\r\n console.log('[SystemDesignService] Resetting to default colors');\r\n this.setColorPalette(this.DEFAULT_BRAND, 'brand');\r\n this.setColorPalette(this.DEFAULT_PRIMARY, 'primary');\r\n this.setColorPalette(this.DEFAULT_SECONDARY, 'secondary');\r\n this.setColorPalette(this.DEFAULT_FUNCTIONAL, 'functional');\r\n this.setColorPalette(this.DEFAULT_UTILITY, 'utility');\r\n }\r\n\r\n // ============================================================================\r\n // COLOR CONVERSION UTILITIES\r\n // ============================================================================\r\n\r\n /\r\n Validate hex color format\r\n * @param hex Color string to validate\r\n * @returns true if valid hex color\r\n /\r\n private isValidHexColor(hex: string): boolean {\r\n return /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.test(hex);\r\n }\r\n\r\n /\r\n Convert HEX to RGB\r\n * @param hex Hex color string (e.g., '#006BDF')\r\n * @returns RGB object or null if invalid\r\n /\r\n private hexToRgb(hex: string): { r: number; g: number; b: number } \| null {\r\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\r\n return result\r\n ? {\r\n r: parseInt(result[1], 16),\r\n g: parseInt(result[2], 16),\r\n b: parseInt(result[3], 16),\r\n }\r\n : null;\r\n }\r\n}\r\n","import { Component } from '@angular/core';\r\n\r\n@Component({\r\n selector: 'lib-dynamic-ds',\r\n imports: [],\r\n template: `\r\n <p>\r\n fis-ds works!\r\n </p>\r\n `,\r\n styles: ``\r\n})\r\nexport class DynamicDsComponent {\r\n\r\n}\r\n","/\r\n * Public API Surface of dynamic-ds\r\n /\r\n\r\nexport from './lib/dynamic-ds.service';\r\nexport * from './lib/dynamic-ds.component';\r\nexport * from './lib/dynamic-ds.config';\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"dynamic-ds.mjs","sources":["../../../projects/dynamic-ds/src/lib/dynamic-ds.component.ts","../../../projects/dynamic-ds/src/lib/dynamic-ds.config.ts","../../../projects/dynamic-ds/src/lib/dynamic-ds.service.ts","../../../projects/dynamic-ds/src/lib/dynamic-ds.module.ts","../../../projects/dynamic-ds/src/public-api.ts","../../../projects/dynamic-ds/src/dynamic-ds.ts"],"sourcesContent":["import { Component } from '@angular/core';\r\n\r\n@Component({\r\n selector: 'lib-dynamic-ds',\r\n imports: [],\r\n template: `\r\n <p>\r\n fis-ds works!\r\n </p>\r\n `,\r\n styles: ``\r\n})\r\nexport class DynamicDsComponent {\r\n\r\n}\r\n","import { InjectionToken } from '@angular/core';\r\n\r\n// Interface định nghĩa các màu cần thiết\r\nexport interface SystemDesignConfig {\r\n brand?: string;\r\n primary?: string;\r\n secondary?: string;\r\n functional?: string;\r\n utility?: string;\r\n}\r\n\r\n// Token để inject config (Cầu nối giữa App và Lib)\r\nexport const SYSTEM_DESIGN_CONFIG = new InjectionToken<SystemDesignConfig>(\r\n 'SYSTEM_DESIGN_CONFIG',\r\n);\r\n","import { Inject, Injectable, Optional } from '@angular/core';\r\nimport { SYSTEM_DESIGN_CONFIG, SystemDesignConfig } from './dynamic-ds.config';\r\nimport { Observable, of } from 'rxjs';\r\n\r\n@Injectable({\r\n providedIn: 'root',\r\n})\r\nexport class DynamicDsService {\r\n // Default colors\r\n private readonly DEFAULT_BRAND = '#006BDF';\r\n private readonly DEFAULT_PRIMARY = '#006BDF';\r\n private readonly DEFAULT_SECONDARY = '#9F5100';\r\n private readonly DEFAULT_FUNCTIONAL = '#006BDF';\r\n private readonly DEFAULT_UTILITY = '#CF0026';\r\n\r\n constructor(\r\n @Optional()\r\n @Inject(SYSTEM_DESIGN_CONFIG)\r\n private readonly config: SystemDesignConfig,\r\n ) {}\r\n\r\n /*\r\n Initialize theme colors from system config\r\n * Call this method during app initialization (e.g., in APP_INITIALIZER)\r\n * Each color is processed independently - uses fetched value if available, otherwise uses default\r\n * @returns Observable that completes when theme initialization is done\r\n /\r\n initializeTheme(): Observable<any> {\r\n console.log('[SystemDesignService] Initializing theme...');\r\n\r\n try {\r\n const brandColor = this.config?.brand;\r\n const primaryColor = this.config?.primary;\r\n const secondaryColor = this.config?.secondary;\r\n const functionalColor = this.config?.functional;\r\n const utilityColor = this.config?.utility;\r\n\r\n // Process each color individually - use fetched value OR default\r\n this.applyColorOrDefault(brandColor, 'brand', this.DEFAULT_BRAND);\r\n this.applyColorOrDefault(primaryColor, 'primary', this.DEFAULT_PRIMARY);\r\n this.applyColorOrDefault(\r\n secondaryColor,\r\n 'secondary',\r\n this.DEFAULT_SECONDARY,\r\n );\r\n this.applyColorOrDefault(\r\n functionalColor,\r\n 'functional',\r\n this.DEFAULT_FUNCTIONAL,\r\n );\r\n this.applyColorOrDefault(utilityColor, 'utility', this.DEFAULT_UTILITY);\r\n\r\n console.log('[SystemDesignService] Theme initialization completed');\r\n return of(true);\r\n } catch (error) {\r\n // If entire fetch fails, fallback to all defaults\r\n console.warn(\r\n '[SystemDesignService] Failed to fetch theme config, using all defaults',\r\n error,\r\n );\r\n this.resetToDefaults();\r\n return of(false);\r\n }\r\n }\r\n\r\n /\r\n Reload theme colors from latest system config\r\n * This is a convenience method that's equivalent to initializeTheme()\r\n * but with a more descriptive name for runtime reloading\r\n \r\n Usage: After updating theme config, call this to apply new colors\r\n * @returns Observable that completes when theme is reloaded\r\n /\r\n reloadThemeFromConfig(): Observable<any> {\r\n console.log('[SystemDesignService] Reloading theme from current config...');\r\n return this.initializeTheme();\r\n }\r\n\r\n /\r\n Apply color if valid, otherwise use default\r\n * @param fetchedColor Color fetched from config (may be null/undefined/invalid)\r\n * @param type Color type\r\n * @param defaultColor Default color to use as fallback\r\n /\r\n private applyColorOrDefault(\r\n fetchedColor: string \| null \| undefined,\r\n type: 'primary' \| 'secondary' \| 'brand' \| 'functional' \| 'utility',\r\n defaultColor: string,\r\n ): void {\r\n // Check if fetched color exists and is valid\r\n if (fetchedColor && this.isValidHexColor(fetchedColor)) {\r\n this.setColorPalette(fetchedColor, type);\r\n console.log(\r\n `[SystemDesignService] Applied ${type}: ${fetchedColor} (from config)`,\r\n );\r\n } else {\r\n this.setColorPalette(defaultColor, type);\r\n const reason = !fetchedColor ? 'not found' : 'invalid format';\r\n console.log(\r\n `[SystemDesignService] Applied ${type}: ${defaultColor} (default - ${reason})`,\r\n );\r\n }\r\n }\r\n\r\n /\r\n Set color and generate full palette (900 -> 50)\r\n * @param color Hex color value (e.g., '#006BDF')\r\n * @param type Type of color ('primary' \| 'secondary' \| 'brand')\r\n /\r\n private setColorPalette(\r\n color: string,\r\n type: 'primary' \| 'secondary' \| 'brand' \| 'functional' \| 'utility',\r\n ): void {\r\n if (!this.isValidHexColor(color)) {\r\n console.error(`[SystemDesignService] Invalid color format: ${color}`);\r\n return;\r\n }\r\n\r\n // Set base color (600)\r\n document.documentElement.style.setProperty(`--${type}-color`, color);\r\n document.documentElement.style.setProperty(`--${type}-600`, color);\r\n\r\n // Set RGB for base color\r\n const rgb = this.hexToRgb(color);\r\n if (rgb) {\r\n const rgbValue = `${rgb.r}, ${rgb.g}, ${rgb.b}`;\r\n document.documentElement.style.setProperty(\r\n `--${type}-color-rgb`,\r\n rgbValue,\r\n );\r\n document.documentElement.style.setProperty(`--${type}-600-rgb`, rgbValue);\r\n }\r\n\r\n // Generate and set full palette\r\n const palette = this.generateColorPalette(color);\r\n\r\n Object.entries(palette).forEach(([shade, hexColor]) => {\r\n document.documentElement.style.setProperty(\r\n `--${type}-${shade}`,\r\n hexColor,\r\n );\r\n\r\n // Set RGB variant for each shade\r\n const shadeRgb = this.hexToRgb(hexColor);\r\n if (shadeRgb) {\r\n document.documentElement.style.setProperty(\r\n `--${type}-${shade}-rgb`,\r\n `${shadeRgb.r}, ${shadeRgb.g}, ${shadeRgb.b}`,\r\n );\r\n }\r\n });\r\n\r\n console.log(\r\n `[SystemDesignService] ${type} color palette generated from: ${color}`,\r\n );\r\n }\r\n\r\n /\r\n Generate color palette from base color\r\n * Creates all shades matching system-design.scss $shade-offsets\r\n * Uses RGB mix algorithm (mix with white/black) for accurate colors\r\n * @param baseColor Hex color string\r\n * @returns Object with shade keys and hex color values\r\n /\r\n private generateColorPalette(baseColor: string): Record<string, string> {\r\n const rgb = this.hexToRgb(baseColor);\r\n if (!rgb) {\r\n console.error('[SystemDesignService] Failed to convert color to RGB');\r\n return {};\r\n }\r\n\r\n // Shade offsets matching system-design.scss\r\n // Negative values = mix with black (darken)\r\n // Positive values = mix with white (lighten)\r\n const shadeOffsets: Record<string, number> = {\r\n '900': -73.5, // Darkest\r\n '875': -62.5,\r\n '850': -47.0,\r\n '800': -34.5,\r\n '700': -18.5,\r\n // '600' is the base color (0%), set separately\r\n '500': 17.5,\r\n '400': 33.0,\r\n '300': 53.0,\r\n '200': 72.0,\r\n '100': 85.0,\r\n '50': 89.5,\r\n '25': 93.5,\r\n '10': 97.0, // Lightest\r\n };\r\n\r\n const palette: Record<string, string> = {};\r\n\r\n Object.entries(shadeOffsets).forEach(([shade, offset]) => {\r\n palette[shade] = this.mixColor(rgb, offset);\r\n });\r\n\r\n return palette;\r\n }\r\n\r\n /\r\n Mix base color with white or black\r\n * @param baseRgb Base color RGB\r\n * @param weight Percentage to mix (-100 to 100)\r\n * Negative = mix with black (darken)\r\n * Positive = mix with white (lighten)\r\n * @returns Hex color string\r\n /\r\n private mixColor(\r\n baseRgb: { r: number; g: number; b: number },\r\n weight: number,\r\n ): string {\r\n const white = { r: 255, g: 255, b: 255 };\r\n const black = { r: 0, g: 0, b: 0 };\r\n\r\n let mixWith: { r: number; g: number; b: number };\r\n let mixWeight: number;\r\n\r\n if (weight > 0) {\r\n // Positive weight = mix with white (lighten)\r\n mixWith = white;\r\n mixWeight = weight / 100;\r\n } else {\r\n // Negative weight = mix with black (darken)\r\n mixWith = black;\r\n mixWeight = Math.abs(weight) / 100;\r\n }\r\n\r\n // Mix formula: result = base (1 - weight) + mixWith * weight\r\n const r = Math.round(baseRgb.r * (1 - mixWeight) + mixWith.r * mixWeight);\r\n const g = Math.round(baseRgb.g * (1 - mixWeight) + mixWith.g * mixWeight);\r\n const b = Math.round(baseRgb.b * (1 - mixWeight) + mixWith.b * mixWeight);\r\n\r\n return this.rgbToHex({ r, g, b });\r\n }\r\n\r\n /*\r\n Convert RGB to HEX\r\n * @param rgb RGB object\r\n * @returns Hex color string\r\n /\r\n private rgbToHex(rgb: { r: number; g: number; b: number }): string {\r\n const toHex = (n: number): string => {\r\n const hex = Math.max(0, Math.min(255, n)).toString(16);\r\n return hex.length === 1 ? '0' + hex : hex;\r\n };\r\n return `#${toHex(rgb.r)}${toHex(rgb.g)}${toHex(rgb.b)}`;\r\n }\r\n\r\n /\r\n Update system design colors dynamically\r\n * Call this when user changes theme colors in settings\r\n * Only updates colors that are provided and valid\r\n * @param colors Object containing colors to update (optional properties)\r\n /\r\n updateSystemDesignColor(colors: {\r\n primaryColor?: string;\r\n secondaryColor?: string;\r\n brandColor?: string;\r\n functionalColor?: string;\r\n utilityColor?: string;\r\n }): void {\r\n console.log('[SystemDesignService] Updating colors:', colors);\r\n\r\n // Update each color if provided and valid\r\n if (colors.brandColor) {\r\n if (this.isValidHexColor(colors.brandColor)) {\r\n this.setColorPalette(colors.brandColor, 'brand');\r\n } else {\r\n console.warn(\r\n '[SystemDesignService] Invalid brand color format:',\r\n colors.brandColor,\r\n );\r\n }\r\n }\r\n\r\n if (colors.primaryColor) {\r\n if (this.isValidHexColor(colors.primaryColor)) {\r\n this.setColorPalette(colors.primaryColor, 'primary');\r\n } else {\r\n console.warn(\r\n '[SystemDesignService] Invalid primary color format:',\r\n colors.primaryColor,\r\n );\r\n }\r\n }\r\n\r\n if (colors.secondaryColor) {\r\n if (this.isValidHexColor(colors.secondaryColor)) {\r\n this.setColorPalette(colors.secondaryColor, 'secondary');\r\n } else {\r\n console.warn(\r\n '[SystemDesignService] Invalid secondary color format:',\r\n colors.secondaryColor,\r\n );\r\n }\r\n }\r\n\r\n if (colors.functionalColor) {\r\n if (this.isValidHexColor(colors.functionalColor)) {\r\n this.setColorPalette(colors.functionalColor, 'functional');\r\n } else {\r\n console.warn(\r\n '[SystemDesignService] Invalid functional color format:',\r\n colors.functionalColor,\r\n );\r\n }\r\n }\r\n\r\n if (colors.utilityColor) {\r\n if (this.isValidHexColor(colors.utilityColor)) {\r\n this.setColorPalette(colors.utilityColor, 'utility');\r\n } else {\r\n console.warn(\r\n '[SystemDesignService] Invalid utility color format:',\r\n colors.utilityColor,\r\n );\r\n }\r\n }\r\n }\r\n\r\n /\r\n Get current theme colors\r\n * @returns Object with current brand, primary, secondary, functional, and utility colors\r\n /\r\n getCurrentColors(): {\r\n brand: string;\r\n primary: string;\r\n secondary: string;\r\n functional: string;\r\n utility: string;\r\n } {\r\n const style = getComputedStyle(document.documentElement);\r\n return {\r\n brand: style.getPropertyValue('--brand-color').trim(),\r\n primary: style.getPropertyValue('--primary-color').trim(),\r\n secondary: style.getPropertyValue('--secondary-color').trim(),\r\n functional: style.getPropertyValue('--functional-color').trim(),\r\n utility: style.getPropertyValue('--utility-color').trim(),\r\n };\r\n }\r\n\r\n /\r\n Reset to default colors\r\n /\r\n resetToDefaults(): void {\r\n console.log('[SystemDesignService] Resetting to default colors');\r\n this.setColorPalette(this.DEFAULT_BRAND, 'brand');\r\n this.setColorPalette(this.DEFAULT_PRIMARY, 'primary');\r\n this.setColorPalette(this.DEFAULT_SECONDARY, 'secondary');\r\n this.setColorPalette(this.DEFAULT_FUNCTIONAL, 'functional');\r\n this.setColorPalette(this.DEFAULT_UTILITY, 'utility');\r\n }\r\n\r\n // ============================================================================\r\n // COLOR CONVERSION UTILITIES\r\n // ============================================================================\r\n\r\n /\r\n Validate hex color format\r\n * @param hex Color string to validate\r\n * @returns true if valid hex color\r\n /\r\n private isValidHexColor(hex: string): boolean {\r\n return /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.test(hex);\r\n }\r\n\r\n /\r\n Convert HEX to RGB\r\n * @param hex Hex color string (e.g., '#006BDF')\r\n * @returns RGB object or null if invalid\r\n /\r\n private hexToRgb(hex: string): { r: number; g: number; b: number } \| null {\r\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\r\n return result\r\n ? {\r\n r: parseInt(result[1], 16),\r\n g: parseInt(result[2], 16),\r\n b: parseInt(result[3], 16),\r\n }\r\n : null;\r\n }\r\n}\r\n","import { NgModule, ModuleWithProviders } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { DynamicDsComponent } from './dynamic-ds.component';\r\nimport { DynamicDsService } from './dynamic-ds.service';\r\nimport { SYSTEM_DESIGN_CONFIG, SystemDesignConfig } from './dynamic-ds.config';\r\n\r\n@NgModule({\r\n imports: [\r\n CommonModule,\r\n DynamicDsComponent // Standalone component\r\n ],\r\n exports: [\r\n DynamicDsComponent\r\n ]\r\n})\r\nexport class DynamicDsModule {\r\n /\r\n Use this method in your app.module.ts to configure the Design System\r\n * @param config SystemDesignConfig with your custom colors\r\n * @example\r\n * DynamicDsModule.forRoot({\r\n * brand: '#006BDF',\r\n * primary: '#006BDF',\r\n * secondary: '#9F5100',\r\n * functional: '#006BDF',\r\n * utility: '#CF0026'\r\n * })\r\n /\r\n static forRoot(config?: SystemDesignConfig): ModuleWithProviders<DynamicDsModule> {\r\n return {\r\n ngModule: DynamicDsModule,\r\n providers: [\r\n DynamicDsService,\r\n {\r\n provide: SYSTEM_DESIGN_CONFIG,\r\n useValue: config \|\| {}\r\n }\r\n ]\r\n };\r\n }\r\n}\r\n","/\r\n * Public API Surface of dynamic-ds\r\n /\r\n\r\nexport from './lib/dynamic-ds.module';\r\nexport * from './lib/dynamic-ds.service';\r\nexport * from './lib/dynamic-ds.component';\r\nexport * from './lib/dynamic-ds.config';\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}

package/lib/dynamic-ds.module.d.ts ADDED Viewed

@@ -0,0 +1,23 @@
+import { ModuleWithProviders } from '@angular/core';
+import { SystemDesignConfig } from './dynamic-ds.config';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "./dynamic-ds.component";
+export declare class DynamicDsModule {
+    /**
+     * Use this method in your app.module.ts to configure the Design System
+     * @param config SystemDesignConfig with your custom colors
+     * @example
+     * DynamicDsModule.forRoot({
+     *   brand: '#006BDF',
+     *   primary: '#006BDF',
+     *   secondary: '#9F5100',
+     *   functional: '#006BDF',
+     *   utility: '#CF0026'
+     * })
+     */
+    static forRoot(config?: SystemDesignConfig): ModuleWithProviders<DynamicDsModule>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DynamicDsModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DynamicDsModule, never, [typeof i1.CommonModule, typeof i2.DynamicDsComponent], [typeof i2.DynamicDsComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<DynamicDsModule>;
+}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "dynamic-ds",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "A fully dynamic Design System Core Library for Angular",
   "author": "Lê Minh Bảo <leminhbao.work@gmail.com>",
   "contributors": [
@@ -19,8 +19,8 @@
   ],
   "license": "MIT",
   "peerDependencies": {
-    "@angular/common": "^14.0.0",
-    "@angular/core": "^14.0.0"
+    "@angular/common": ">=14.0.0",
+    "@angular/core": ">=14.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.0"

package/public-api.d.ts CHANGED Viewed

@@ -1,3 +1,4 @@
+export * from './lib/dynamic-ds.module';
 export * from './lib/dynamic-ds.service';
 export * from './lib/dynamic-ds.component';
 export * from './lib/dynamic-ds.config';