dynamic-ds 1.0.1 → 1.0.3

package/fesm2022/dynamic-ds.mjs

@@ -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,45 @@ 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], 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 +370,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

@@ -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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"}
+{"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: [DynamicDsComponent],\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(\r\n    config?: SystemDesignConfig,\r\n  ): 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

@@ -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

@@ -1,6 +1,6 @@
 {
   "name": "dynamic-ds",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "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

@@ -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';