@transcommerce/cwm-shared 1.1.84 → 1.1.87

package/fesm2022/transcommerce-cwm-shared.mjs

@@ -48,8 +48,8 @@ class ExternalNavigationComponent {
             this.navigateToExternalUrl();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: ExternalNavigationComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.18", type: ExternalNavigationComponent, isStandalone: false, selector: "cwm-external-navigation", ngImport: i0, template: `<div class="container">
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: ExternalNavigationComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: ExternalNavigationComponent, isStandalone: false, selector: "cwm-external-navigation", ngImport: i0, template: `<div class="container">
     <h3>Enter the destination route, URL, or Href you want and press the button that uses the navigation method of your choosing:</h3>
     <input id="txtRoute" type="text" [(ngModel)]="route" placeholder="Enter the destination route, URL, or Href..."
            (keydown)="onKeyPress($event)"/>
@@ -60,7 +60,7 @@ class ExternalNavigationComponent {
     <button (click)="navigateToExternalHref()">Navigate to external Href</button>
   </div>`, isInline: true, dependencies: [{ kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: ExternalNavigationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: ExternalNavigationComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'cwm-external-navigation',
@@ -97,10 +97,10 @@ class NavigateToRouteComponent {
             this.navigateToRoute();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: NavigateToRouteComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.18", type: NavigateToRouteComponent, isStandalone: false, selector: "cwm-navigate-to-route", ngImport: i0, template: "<div class=\"container\">\n    <h2>Enter the route you want to navigate to:</h2>\n    <input id=\"txtRoute\" type=\"text\" [(ngModel)]=\"route\" placeholder=\"Enter Route...\"\n           (keydown)=\"onKeyPress($event)\"/>\n    <button (click)=\"navigateToRoute()\">Navigate</button>\n</div>\n``\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NavigateToRouteComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: NavigateToRouteComponent, isStandalone: false, selector: "cwm-navigate-to-route", ngImport: i0, template: "<div class=\"container\">\n    <h2>Enter the route you want to navigate to:</h2>\n    <input id=\"txtRoute\" type=\"text\" [(ngModel)]=\"route\" placeholder=\"Enter Route...\"\n           (keydown)=\"onKeyPress($event)\"/>\n    <button (click)=\"navigateToRoute()\">Navigate</button>\n</div>\n``\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: NavigateToRouteComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NavigateToRouteComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cwm-navigate-to-route', standalone: false, template: "<div class=\"container\">\n    <h2>Enter the route you want to navigate to:</h2>\n    <input id=\"txtRoute\" type=\"text\" [(ngModel)]=\"route\" placeholder=\"Enter Route...\"\n           (keydown)=\"onKeyPress($event)\"/>\n    <button (click)=\"navigateToRoute()\">Navigate</button>\n</div>\n``\n", styles: [":host{display:block}\n"] }]
         }], ctorParameters: () => [{ type: i1.Router }] });
@@ -134,10 +134,10 @@ class PageNotFoundComponent {
             }
         }, 1000);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: PageNotFoundComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.18", type: PageNotFoundComponent, isStandalone: false, selector: "cwm-page-not-found", ngImport: i0, template: "<div class=\"not-found-container\">\n  <div class=\"not-found-card\">\n    <div class=\"emoji-icon\">\uD83D\uDD0E</div>\n    <div class=\"error-code\">404</div>\n    <h1 class=\"error-title\">Page Not Found</h1>\n    <p class=\"error-description\">\n      The page you're looking for doesn't exist or has been moved. Let's get you back on track!\n    </p>\n\n    <div class=\"button-group\">\n      <a routerLink=\"/\" class=\"btn btn-primary\">\uD83C\uDFE0 Go to Home</a>\n      <a routerLink=\"/dashboard\" class=\"btn btn-secondary\">\uD83D\uDCCA Dashboard</a>\n      <a href=\"javascript:history.back()\" class=\"btn btn-outline\">\u2190 Go Back</a>\n      <a href=\"mailto:support@cheapweedmenu.com?subject=Broken%20link%20-%20404&body=I%20found%20a%20broken%20link\" class=\"btn btn-ghost\">\uD83D\uDCE7 Report Issue</a>\n    </div>\n\n    <div class=\"redirect-info\">\n      <small class=\"redirect-timer\">You will be redirected to home in <span class=\"timer-badge\">{{ redirectCountdown }}</span> seconds</small>\n      <div class=\"breadcrumb\">\n        Requested URL: <code>{{ requestedUrl }}</code>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".menu{color:#fff}.menu-bg{background-color:#333}.hybrid{color:#375b2b}.hybrid-bg{background-color:#375b2b}.shake{color:#4e544c}.shake-bg{background-color:#4e544c}.indica{color:#1c2e16}.indica-bg{background-color:#1c2e16}.sativa{color:#d7d0c4}.sativa-bg{background-color:#d7d0c4}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.not-found-container{min-height:70vh;display:flex;align-items:center;justify-content:center;padding:24px;background:linear-gradient(135deg,#1c2e16,#375b2b)}.not-found-card{max-width:720px;width:100%;text-align:center;border-radius:12px;box-shadow:0 8px 30px #0000004d;padding:36px;background:linear-gradient(180deg,#d7d0c4,#e8e2d8);animation:fadeInUp .6s ease-out}.emoji-icon{font-size:80px;line-height:1;margin-bottom:16px;animation:float 3s ease-in-out infinite;display:inline-block}.error-code{margin:0;font-size:48px;font-weight:700;color:#1c2e16;letter-spacing:-1px}.error-title{margin:8px 0;font-size:28px;font-weight:600;color:#1c2e16}.error-description{color:#4e544c;margin:12px 0 28px;line-height:1.6;font-size:16px}.button-group{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:32px 0}.btn{padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:600;font-size:14px;transition:all .5s ease;cursor:pointer;border:none;display:inline-block}.btn-primary{background-color:#1c2e16;color:#d7d0c4;transition-property:all;transition-duration:.5s}.btn-primary:hover{background-color:#160816;color:#d7d0c4;transform:translateY(-2px);box-shadow:0 4px 12px #1c2e1666}.btn-secondary{background-color:#375b2b;color:#d7d0c4;transition-property:all;transition-duration:.5s}.btn-secondary:hover{background-color:#1c2e16;color:#d7d0c4;transform:translateY(-2px)}.btn-outline{background-color:#d7d0c4;color:#1c2e16;transition-property:all;transition-duration:.5s}.btn-outline:hover{background-color:#1c2e16;color:#d7d0c4;transform:translateY(-2px)}.btn-ghost{background:transparent;border:2px solid #1c2e16;color:#1c2e16;transition-property:all;transition-duration:.5s}.btn-ghost:hover{border-color:#375b2b;background-color:#375b2b;color:#d7d0c4;transform:translateY(-2px)}.redirect-info{margin-top:24px;padding-top:24px;border-top:2px solid #1c2e16}.redirect-timer{font-size:14px;color:#4e544c;margin-top:12px}.timer-badge{display:inline-block;background-color:#1c2e16;color:#d7d0c4;padding:4px 10px;border-radius:4px;font-weight:600;margin-left:4px}.breadcrumb{margin-top:20px;font-size:12px;color:#4e544c}.breadcrumb code{background-color:#1c2e16;color:#d7d0c4;padding:2px 6px;border-radius:4px}\n"], dependencies: [{ kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: PageNotFoundComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: PageNotFoundComponent, isStandalone: false, selector: "cwm-page-not-found", ngImport: i0, template: "<div class=\"not-found-container\">\n  <div class=\"not-found-card\">\n    <div class=\"emoji-icon\">\uD83D\uDD0E</div>\n    <div class=\"error-code\">404</div>\n    <h1 class=\"error-title\">Page Not Found</h1>\n    <p class=\"error-description\">\n      The page you're looking for doesn't exist or has been moved. Let's get you back on track!\n    </p>\n\n    <div class=\"button-group\">\n      <a routerLink=\"/\" class=\"btn btn-primary\">\uD83C\uDFE0 Go to Home</a>\n      <a routerLink=\"/dashboard\" class=\"btn btn-secondary\">\uD83D\uDCCA Dashboard</a>\n      <a href=\"javascript:history.back()\" class=\"btn btn-outline\">\u2190 Go Back</a>\n      <a href=\"mailto:support@cheapweedmenu.com?subject=Broken%20link%20-%20404&body=I%20found%20a%20broken%20link\" class=\"btn btn-ghost\">\uD83D\uDCE7 Report Issue</a>\n    </div>\n\n    <div class=\"redirect-info\">\n      <small class=\"redirect-timer\">You will be redirected to home in <span class=\"timer-badge\">{{ redirectCountdown }}</span> seconds</small>\n      <div class=\"breadcrumb\">\n        Requested URL: <code>{{ requestedUrl }}</code>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".menu{color:#fff}.menu-bg{background-color:#333}.hybrid{color:#375b2b}.hybrid-bg{background-color:#375b2b}.shake{color:#4e544c}.shake-bg{background-color:#4e544c}.indica{color:#1c2e16}.indica-bg{background-color:#1c2e16}.sativa{color:#d7d0c4}.sativa-bg{background-color:#d7d0c4}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.not-found-container{min-height:70vh;display:flex;align-items:center;justify-content:center;padding:24px;background:linear-gradient(135deg,#1c2e16,#375b2b)}.not-found-card{max-width:720px;width:100%;text-align:center;border-radius:12px;box-shadow:0 8px 30px #0000004d;padding:36px;background:linear-gradient(180deg,#d7d0c4,#e8e2d8);animation:fadeInUp .6s ease-out}.emoji-icon{font-size:80px;line-height:1;margin-bottom:16px;animation:float 3s ease-in-out infinite;display:inline-block}.error-code{margin:0;font-size:48px;font-weight:700;color:#1c2e16;letter-spacing:-1px}.error-title{margin:8px 0;font-size:28px;font-weight:600;color:#1c2e16}.error-description{color:#4e544c;margin:12px 0 28px;line-height:1.6;font-size:16px}.button-group{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:32px 0}.btn{padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:600;font-size:14px;transition:all .5s ease;cursor:pointer;border:none;display:inline-block}.btn-primary{background-color:#1c2e16;color:#d7d0c4;transition-property:all;transition-duration:.5s}.btn-primary:hover{background-color:#160816;color:#d7d0c4;transform:translateY(-2px);box-shadow:0 4px 12px #1c2e1666}.btn-secondary{background-color:#375b2b;color:#d7d0c4;transition-property:all;transition-duration:.5s}.btn-secondary:hover{background-color:#1c2e16;color:#d7d0c4;transform:translateY(-2px)}.btn-outline{background-color:#d7d0c4;color:#1c2e16;transition-property:all;transition-duration:.5s}.btn-outline:hover{background-color:#1c2e16;color:#d7d0c4;transform:translateY(-2px)}.btn-ghost{background:transparent;border:2px solid #1c2e16;color:#1c2e16;transition-property:all;transition-duration:.5s}.btn-ghost:hover{border-color:#375b2b;background-color:#375b2b;color:#d7d0c4;transform:translateY(-2px)}.redirect-info{margin-top:24px;padding-top:24px;border-top:2px solid #1c2e16}.redirect-timer{font-size:14px;color:#4e544c;margin-top:12px}.timer-badge{display:inline-block;background-color:#1c2e16;color:#d7d0c4;padding:4px 10px;border-radius:4px;font-weight:600;margin-left:4px}.breadcrumb{margin-top:20px;font-size:12px;color:#4e544c}.breadcrumb code{background-color:#1c2e16;color:#d7d0c4;padding:2px 6px;border-radius:4px}\n"], dependencies: [{ kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: PageNotFoundComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: PageNotFoundComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cwm-page-not-found', standalone: false, template: "<div class=\"not-found-container\">\n  <div class=\"not-found-card\">\n    <div class=\"emoji-icon\">\uD83D\uDD0E</div>\n    <div class=\"error-code\">404</div>\n    <h1 class=\"error-title\">Page Not Found</h1>\n    <p class=\"error-description\">\n      The page you're looking for doesn't exist or has been moved. Let's get you back on track!\n    </p>\n\n    <div class=\"button-group\">\n      <a routerLink=\"/\" class=\"btn btn-primary\">\uD83C\uDFE0 Go to Home</a>\n      <a routerLink=\"/dashboard\" class=\"btn btn-secondary\">\uD83D\uDCCA Dashboard</a>\n      <a href=\"javascript:history.back()\" class=\"btn btn-outline\">\u2190 Go Back</a>\n      <a href=\"mailto:support@cheapweedmenu.com?subject=Broken%20link%20-%20404&body=I%20found%20a%20broken%20link\" class=\"btn btn-ghost\">\uD83D\uDCE7 Report Issue</a>\n    </div>\n\n    <div class=\"redirect-info\">\n      <small class=\"redirect-timer\">You will be redirected to home in <span class=\"timer-badge\">{{ redirectCountdown }}</span> seconds</small>\n      <div class=\"breadcrumb\">\n        Requested URL: <code>{{ requestedUrl }}</code>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".menu{color:#fff}.menu-bg{background-color:#333}.hybrid{color:#375b2b}.hybrid-bg{background-color:#375b2b}.shake{color:#4e544c}.shake-bg{background-color:#4e544c}.indica{color:#1c2e16}.indica-bg{background-color:#1c2e16}.sativa{color:#d7d0c4}.sativa-bg{background-color:#d7d0c4}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.not-found-container{min-height:70vh;display:flex;align-items:center;justify-content:center;padding:24px;background:linear-gradient(135deg,#1c2e16,#375b2b)}.not-found-card{max-width:720px;width:100%;text-align:center;border-radius:12px;box-shadow:0 8px 30px #0000004d;padding:36px;background:linear-gradient(180deg,#d7d0c4,#e8e2d8);animation:fadeInUp .6s ease-out}.emoji-icon{font-size:80px;line-height:1;margin-bottom:16px;animation:float 3s ease-in-out infinite;display:inline-block}.error-code{margin:0;font-size:48px;font-weight:700;color:#1c2e16;letter-spacing:-1px}.error-title{margin:8px 0;font-size:28px;font-weight:600;color:#1c2e16}.error-description{color:#4e544c;margin:12px 0 28px;line-height:1.6;font-size:16px}.button-group{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:32px 0}.btn{padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:600;font-size:14px;transition:all .5s ease;cursor:pointer;border:none;display:inline-block}.btn-primary{background-color:#1c2e16;color:#d7d0c4;transition-property:all;transition-duration:.5s}.btn-primary:hover{background-color:#160816;color:#d7d0c4;transform:translateY(-2px);box-shadow:0 4px 12px #1c2e1666}.btn-secondary{background-color:#375b2b;color:#d7d0c4;transition-property:all;transition-duration:.5s}.btn-secondary:hover{background-color:#1c2e16;color:#d7d0c4;transform:translateY(-2px)}.btn-outline{background-color:#d7d0c4;color:#1c2e16;transition-property:all;transition-duration:.5s}.btn-outline:hover{background-color:#1c2e16;color:#d7d0c4;transform:translateY(-2px)}.btn-ghost{background:transparent;border:2px solid #1c2e16;color:#1c2e16;transition-property:all;transition-duration:.5s}.btn-ghost:hover{border-color:#375b2b;background-color:#375b2b;color:#d7d0c4;transform:translateY(-2px)}.redirect-info{margin-top:24px;padding-top:24px;border-top:2px solid #1c2e16}.redirect-timer{font-size:14px;color:#4e544c;margin-top:12px}.timer-badge{display:inline-block;background-color:#1c2e16;color:#d7d0c4;padding:4px 10px;border-radius:4px;font-weight:600;margin-left:4px}.breadcrumb{margin-top:20px;font-size:12px;color:#4e544c}.breadcrumb code{background-color:#1c2e16;color:#d7d0c4;padding:2px 6px;border-radius:4px}\n"] }]
         }], ctorParameters: () => [{ type: i1.Router }] });
@@ -339,10 +339,10 @@ class ClassLoggerService {
             console.log(`${this.prefix} Trace: ${message}`, optionalParams);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: ClassLoggerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: ClassLoggerService });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: ClassLoggerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: ClassLoggerService });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: ClassLoggerService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: ClassLoggerService, decorators: [{
             type: Injectable
         }], ctorParameters: () => [] });
 
@@ -576,10 +576,10 @@ class DbKeys {
     static SHOW_DASHBOARD_NOTIFICATIONS = 'show_dashboard_notifications';
     static SHOW_DASHBOARD_TODO = 'show_dashboard_todo';
     static SHOW_DASHBOARD_BANNER = 'show_dashboard_banner';
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DbKeys, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DbKeys });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DbKeys, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DbKeys });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: DbKeys, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DbKeys, decorators: [{
             type: Injectable
         }] });
 
@@ -1266,10 +1266,10 @@ class Utilities {
     static convertToAbsoluteUrl(url) {
         return Utilities.testIsAbsoluteUrl(url) ? url : '//' + url;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: Utilities, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: Utilities });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: Utilities, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: Utilities });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: Utilities, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: Utilities, decorators: [{
             type: Injectable
         }] });
 
@@ -1732,6 +1732,1030 @@ const CONFIGURATION_SCHEMA = {
     ]
 };
 
+var NamedColors;
+(function (NamedColors) {
+    // Basic colors
+    NamedColors["White"] = "white";
+    NamedColors["Black"] = "black";
+    NamedColors["Red"] = "red";
+    NamedColors["Green"] = "green";
+    NamedColors["Blue"] = "blue";
+    NamedColors["Yellow"] = "yellow";
+    NamedColors["Cyan"] = "cyan";
+    NamedColors["Magenta"] = "magenta";
+    NamedColors["Lime"] = "lime";
+    NamedColors["Maroon"] = "maroon";
+    NamedColors["Navy"] = "navy";
+    NamedColors["Olive"] = "olive";
+    NamedColors["Purple"] = "purple";
+    NamedColors["Teal"] = "teal";
+    NamedColors["Silver"] = "silver";
+    NamedColors["Gray"] = "gray";
+    NamedColors["Grey"] = "grey";
+    // Extended colors
+    NamedColors["AliceBlue"] = "aliceblue";
+    NamedColors["AntiqueWhite"] = "antiquewhite";
+    NamedColors["Aqua"] = "aqua";
+    NamedColors["Aquamarine"] = "aquamarine";
+    NamedColors["Azure"] = "azure";
+    NamedColors["Beige"] = "beige";
+    NamedColors["Bisque"] = "bisque";
+    NamedColors["BlanchedAlmond"] = "blanchedalmond";
+    NamedColors["BlueViolet"] = "blueviolet";
+    NamedColors["Brown"] = "brown";
+    NamedColors["BurlyWood"] = "burlywood";
+    NamedColors["CadetBlue"] = "cadetblue";
+    NamedColors["Chartreuse"] = "chartreuse";
+    NamedColors["Chocolate"] = "chocolate";
+    NamedColors["Coral"] = "coral";
+    NamedColors["CornflowerBlue"] = "cornflowerblue";
+    NamedColors["Cornsilk"] = "cornsilk";
+    NamedColors["Crimson"] = "crimson";
+    NamedColors["DarkBlue"] = "darkblue";
+    NamedColors["DarkCyan"] = "darkcyan";
+    NamedColors["DarkGoldenRod"] = "darkgoldenrod";
+    NamedColors["DarkGray"] = "darkgray";
+    NamedColors["DarkGrey"] = "darkgrey";
+    NamedColors["DarkGreen"] = "darkgreen";
+    NamedColors["DarkKhaki"] = "darkkhaki";
+    NamedColors["DarkMagenta"] = "darkmagenta";
+    NamedColors["DarkOliveGreen"] = "darkolivegreen";
+    NamedColors["DarkOrange"] = "darkorange";
+    NamedColors["DarkOrchid"] = "darkorchid";
+    NamedColors["DarkRed"] = "darkred";
+    NamedColors["DarkSalmon"] = "darksalmon";
+    NamedColors["DarkSeaGreen"] = "darkseagreen";
+    NamedColors["DarkSlateBlue"] = "darkslateblue";
+    NamedColors["DarkSlateGray"] = "darkslategray";
+    NamedColors["DarkSlateGrey"] = "darkslategrey";
+    NamedColors["DarkTurquoise"] = "darkturquoise";
+    NamedColors["DarkViolet"] = "darkviolet";
+    NamedColors["DeepPink"] = "deeppink";
+    NamedColors["DeepSkyBlue"] = "deepskyblue";
+    NamedColors["DimGray"] = "dimgray";
+    NamedColors["DimGrey"] = "dimgrey";
+    NamedColors["DodgerBlue"] = "dodgerblue";
+    NamedColors["FireBrick"] = "firebrick";
+    NamedColors["FloralWhite"] = "floralwhite";
+    NamedColors["ForestGreen"] = "forestgreen";
+    NamedColors["Fuchsia"] = "fuchsia";
+    NamedColors["Gainsboro"] = "gainsboro";
+    NamedColors["GhostWhite"] = "ghostwhite";
+    NamedColors["Gold"] = "gold";
+    NamedColors["GoldenRod"] = "goldenrod";
+    NamedColors["GreenYellow"] = "greenyellow";
+    NamedColors["Honeydew"] = "honeydew";
+    NamedColors["HotPink"] = "hotpink";
+    NamedColors["IndianRed"] = "indianred";
+    NamedColors["Indigo"] = "indigo";
+    NamedColors["Ivory"] = "ivory";
+    NamedColors["Khaki"] = "khaki";
+    NamedColors["Lavender"] = "lavender";
+    NamedColors["LavenderBlush"] = "lavenderblush";
+    NamedColors["LawnGreen"] = "lawngreen";
+    NamedColors["LemonChiffon"] = "lemonchiffon";
+    NamedColors["LightBlue"] = "lightblue";
+    NamedColors["LightCoral"] = "lightcoral";
+    NamedColors["LightCyan"] = "lightcyan";
+    NamedColors["LightGoldenRodYellow"] = "lightgoldenrodyellow";
+    NamedColors["LightGray"] = "lightgray";
+    NamedColors["LightGrey"] = "lightgrey";
+    NamedColors["LightGreen"] = "lightgreen";
+    NamedColors["LightPink"] = "lightpink";
+    NamedColors["LightSalmon"] = "lightsalmon";
+    NamedColors["LightSeaGreen"] = "lightseagreen";
+    NamedColors["LightSkyBlue"] = "lightskyblue";
+    NamedColors["LightSlateGray"] = "lightslategray";
+    NamedColors["LightSlateGrey"] = "lightslategrey";
+    NamedColors["LightSteelBlue"] = "lightsteelblue";
+    NamedColors["LightYellow"] = "lightyellow";
+    NamedColors["LimeGreen"] = "limegreen";
+    NamedColors["Linen"] = "linen";
+    NamedColors["MediumAquaMarine"] = "mediumaquamarine";
+    NamedColors["MediumBlue"] = "mediumblue";
+    NamedColors["MediumOrchid"] = "mediumorchid";
+    NamedColors["MediumPurple"] = "mediumpurple";
+    NamedColors["MediumSeaGreen"] = "mediumseagreen";
+    NamedColors["MediumSlateBlue"] = "mediumslateblue";
+    NamedColors["MediumSpringGreen"] = "mediumspringgreen";
+    NamedColors["MediumTurquoise"] = "mediumturquoise";
+    NamedColors["MediumVioletRed"] = "mediumvioletred";
+    NamedColors["MidnightBlue"] = "midnightblue";
+    NamedColors["MintCream"] = "mintcream";
+    NamedColors["MistyRose"] = "mistyrose";
+    NamedColors["Moccasin"] = "moccasin";
+    NamedColors["NavajoWhite"] = "navajowhite";
+    NamedColors["OldLace"] = "oldlace";
+    NamedColors["OliveDrab"] = "olivedrab";
+    NamedColors["Orange"] = "orange";
+    NamedColors["OrangeRed"] = "orangered";
+    NamedColors["Orchid"] = "orchid";
+    NamedColors["PaleGoldenRod"] = "palegoldenrod";
+    NamedColors["PaleGreen"] = "palegreen";
+    NamedColors["PaleTurquoise"] = "paleturquoise";
+    NamedColors["PaleVioletRed"] = "palevioletred";
+    NamedColors["PapayaWhip"] = "papayawhip";
+    NamedColors["PeachPuff"] = "peachpuff";
+    NamedColors["Peru"] = "peru";
+    NamedColors["Pink"] = "pink";
+    NamedColors["Plum"] = "plum";
+    NamedColors["PowderBlue"] = "powderblue";
+    NamedColors["RosyBrown"] = "rosybrown";
+    NamedColors["RoyalBlue"] = "royalblue";
+    NamedColors["SaddleBrown"] = "saddlebrown";
+    NamedColors["Salmon"] = "salmon";
+    NamedColors["SandyBrown"] = "sandybrown";
+    NamedColors["SeaGreen"] = "seagreen";
+    NamedColors["SeaShell"] = "seashell";
+    NamedColors["Sienna"] = "sienna";
+    NamedColors["SkyBlue"] = "skyblue";
+    NamedColors["SlateBlue"] = "slateblue";
+    NamedColors["SlateGray"] = "slategray";
+    NamedColors["SlateGrey"] = "slategrey";
+    NamedColors["Snow"] = "snow";
+    NamedColors["SpringGreen"] = "springgreen";
+    NamedColors["SteelBlue"] = "steelblue";
+    NamedColors["Tan"] = "tan";
+    NamedColors["Thistle"] = "thistle";
+    NamedColors["Tomato"] = "tomato";
+    NamedColors["Turquoise"] = "turquoise";
+    NamedColors["Violet"] = "violet";
+    NamedColors["Wheat"] = "wheat";
+    NamedColors["WhiteSmoke"] = "whitesmoke";
+    NamedColors["YellowGreen"] = "yellowgreen";
+    NamedColors["Transparent"] = "transparent";
+})(NamedColors || (NamedColors = {}));
+/**
+ * Comprehensive mapping of CSS named colors to their hex values.
+ * Based on CSS Color Module Level 4 specification.
+ */
+const NAMED_COLOR_MAP = {
+    // Basic colors
+    'black': '#000000',
+    'white': '#FFFFFF',
+    'red': '#FF0000',
+    'green': '#008000',
+    'blue': '#0000FF',
+    'yellow': '#FFFF00',
+    'cyan': '#00FFFF',
+    'magenta': '#FF00FF',
+    'lime': '#00FF00',
+    'maroon': '#800000',
+    'navy': '#000080',
+    'olive': '#808000',
+    'purple': '#800080',
+    'teal': '#008080',
+    'silver': '#C0C0C0',
+    'gray': '#808080',
+    'grey': '#808080',
+    // Extended colors
+    'aliceblue': '#F0F8FF',
+    'antiquewhite': '#FAEBD7',
+    'aqua': '#00FFFF',
+    'aquamarine': '#7FFFD4',
+    'azure': '#F0FFFF',
+    'beige': '#F5F5DC',
+    'bisque': '#FFE4C4',
+    'blanchedalmond': '#FFEBCD',
+    'blueviolet': '#8A2BE2',
+    'brown': '#A52A2A',
+    'burlywood': '#DEB887',
+    'cadetblue': '#5F9EA0',
+    'chartreuse': '#7FFF00',
+    'chocolate': '#D2691E',
+    'coral': '#FF7F50',
+    'cornflowerblue': '#6495ED',
+    'cornsilk': '#FFF8DC',
+    'crimson': '#DC143C',
+    'darkblue': '#00008B',
+    'darkcyan': '#008B8B',
+    'darkgoldenrod': '#B8860B',
+    'darkgray': '#A9A9A9',
+    'darkgrey': '#A9A9A9',
+    'darkgreen': '#006400',
+    'darkkhaki': '#BDB76B',
+    'darkmagenta': '#8B008B',
+    'darkolivegreen': '#556B2F',
+    'darkorange': '#FF8C00',
+    'darkorchid': '#9932CC',
+    'darkred': '#8B0000',
+    'darksalmon': '#E9967A',
+    'darkseagreen': '#8FBC8F',
+    'darkslateblue': '#483D8B',
+    'darkslategray': '#2F4F4F',
+    'darkslategrey': '#2F4F4F',
+    'darkturquoise': '#00CED1',
+    'darkviolet': '#9400D3',
+    'deeppink': '#FF1493',
+    'deepskyblue': '#00BFFF',
+    'dimgray': '#696969',
+    'dimgrey': '#696969',
+    'dodgerblue': '#1E90FF',
+    'firebrick': '#B22222',
+    'floralwhite': '#FFFAF0',
+    'forestgreen': '#228B22',
+    'fuchsia': '#FF00FF',
+    'gainsboro': '#DCDCDC',
+    'ghostwhite': '#F8F8FF',
+    'gold': '#FFD700',
+    'goldenrod': '#DAA520',
+    'greenyellow': '#ADFF2F',
+    'honeydew': '#F0FFF0',
+    'hotpink': '#FF69B4',
+    'indianred': '#CD5C5C',
+    'indigo': '#4B0082',
+    'ivory': '#FFFFF0',
+    'khaki': '#F0E68C',
+    'lavender': '#E6E6FA',
+    'lavenderblush': '#FFF0F5',
+    'lawngreen': '#7CFC00',
+    'lemonchiffon': '#FFFACD',
+    'lightblue': '#ADD8E6',
+    'lightcoral': '#F08080',
+    'lightcyan': '#E0FFFF',
+    'lightgoldenrodyellow': '#FAFAD2',
+    'lightgray': '#D3D3D3',
+    'lightgrey': '#D3D3D3',
+    'lightgreen': '#90EE90',
+    'lightpink': '#FFB6C1',
+    'lightsalmon': '#FFA07A',
+    'lightseagreen': '#20B2AA',
+    'lightskyblue': '#87CEFA',
+    'lightslategray': '#778899',
+    'lightslategrey': '#778899',
+    'lightsteelblue': '#B0C4DE',
+    'lightyellow': '#FFFFE0',
+    'limegreen': '#32CD32',
+    'linen': '#FAF0E6',
+    'mediumaquamarine': '#66CDAA',
+    'mediumblue': '#0000CD',
+    'mediumorchid': '#BA55D3',
+    'mediumpurple': '#9370DB',
+    'mediumseagreen': '#3CB371',
+    'mediumslateblue': '#7B68EE',
+    'mediumspringgreen': '#00FA9A',
+    'mediumturquoise': '#48D1CC',
+    'mediumvioletred': '#C71585',
+    'midnightblue': '#191970',
+    'mintcream': '#F5FFFA',
+    'mistyrose': '#FFE4E1',
+    'moccasin': '#FFE4B5',
+    'navajowhite': '#FFDEAD',
+    'oldlace': '#FDF5E6',
+    'olivedrab': '#6B8E23',
+    'orange': '#FFA500',
+    'orangered': '#FF4500',
+    'orchid': '#DA70D6',
+    'palegoldenrod': '#EEE8AA',
+    'palegreen': '#98FB98',
+    'paleturquoise': '#AFEEEE',
+    'palevioletred': '#DB7093',
+    'papayawhip': '#FFEFD5',
+    'peachpuff': '#FFDAB9',
+    'peru': '#CD853F',
+    'pink': '#FFC0CB',
+    'plum': '#DDA0DD',
+    'powderblue': '#B0E0E6',
+    'rosybrown': '#BC8F8F',
+    'royalblue': '#4169E1',
+    'saddlebrown': '#8B4513',
+    'salmon': '#FA8072',
+    'sandybrown': '#F4A460',
+    'seagreen': '#2E8B57',
+    'seashell': '#FFF5EE',
+    'sienna': '#A0522D',
+    'skyblue': '#87CEEB',
+    'slateblue': '#6A5ACD',
+    'slategray': '#708090',
+    'slategrey': '#708090',
+    'snow': '#FFFAFA',
+    'springgreen': '#00FF7F',
+    'steelblue': '#4682B4',
+    'tan': '#D2B48C',
+    'thistle': '#D8BFD8',
+    'tomato': '#FF6347',
+    'turquoise': '#40E0D0',
+    'violet': '#EE82EE',
+    'wheat': '#F5DEB3',
+    'whitesmoke': '#F5F5F5',
+    'yellowgreen': '#9ACD32',
+    'transparent': '#00000000'
+};
+/**
+ * Converts a named color to its hex representation
+ * @param colorName - CSS named color (case-insensitive)
+ * @returns Hex color string or null if color name is not recognized
+ */
+function namedColorToHex(colorName) {
+    return NAMED_COLOR_MAP[colorName] || null;
+}
+/**
+ * Checks if a string is a valid CSS named color
+ * @param colorName - String to check
+ * @returns True if it's a valid named color
+ */
+function isNamedColor(colorName) {
+    const normalized = colorName.toLowerCase().trim();
+    return normalized in NAMED_COLOR_MAP;
+}
+/**
+ * Gets all available named color names
+ * @returns Array of all CSS named color names
+ */
+function getNamedColors() {
+    return Object.keys(NAMED_COLOR_MAP);
+}
+
+class RgbaColorStyle {
+    ngOnStyle(ngStyle) {
+        if (ngStyle) {
+            ngStyle['color'] = this.toCssString();
+        }
+        return ngStyle;
+    }
+    r;
+    g;
+    b;
+    a;
+    /* Static method to create an RGBAColor instance from a hex color string.
+     * Supports both short (#RGB, #RGBA) and full (#RRGGBB, #RRGGBBAA) hex formats.
+     */
+    static fromHexColor(hexColor) {
+        // Remove the # if present
+        const hex = hexColor.replace('#', '');
+        // Parse the hex values
+        let r, g, b, a = 1;
+        if (hex.length === 3 || hex.length === 4) {
+            // Short format: #RGB or #RGBA
+            r = parseInt(hex[0] + hex[0], 16);
+            g = parseInt(hex[1] + hex[1], 16);
+            b = parseInt(hex[2] + hex[2], 16);
+            if (hex.length === 4) {
+                a = parseInt(hex[3] + hex[3], 16) / 255;
+            }
+        }
+        else if (hex.length === 6 || hex.length === 8) {
+            // Full format: #RRGGBB or #RRGGBBAA
+            r = parseInt(hex.substring(0, 2), 16);
+            g = parseInt(hex.substring(2, 4), 16);
+            b = parseInt(hex.substring(4, 6), 16);
+            if (hex.length === 8) {
+                a = parseInt(hex.substring(6, 8), 16) / 255;
+            }
+        }
+        else {
+            throw new Error(`Invalid hex color format: ${hexColor}`);
+        }
+        const rgba = new RgbaColorStyle();
+        rgba.r = r;
+        rgba.g = g;
+        rgba.b = b;
+        rgba.a = a;
+        return rgba;
+    }
+    /* Static method to create an RGBAColor instance from a CSS named color.
+     * Supports all standard CSS named colors (case-insensitive).
+     * @param colorName - CSS named color (e.g., 'red', 'blue', 'cornflowerblue')
+     * @returns RGBAColor instance
+     * @throws Error if the color name is not recognized
+     */
+    static fromNamedColor(colorName) {
+        const hexColor = namedColorToHex(colorName);
+        if (!hexColor) {
+            throw new Error(`Unknown named color: ${colorName}`);
+        }
+        return RgbaColorStyle.fromHexColor(hexColor);
+    }
+    /* Method to convert the RGBAColor instance back to a hex color string.
+     * If includeAlpha is true, the alpha value will be included in the hex string.
+     */
+    toHexColor(includeAlpha = false) {
+        const toHex = (value) => {
+            return Math.round(value).toString(16).padStart(2, '0');
+        };
+        const r = toHex(this.r);
+        const g = toHex(this.g);
+        const b = toHex(this.b);
+        let hexColor;
+        if (includeAlpha) {
+            const a = toHex(this.a * 255); // Convert 0-1 to 0-255
+            hexColor = `#${r}${g}${b}${a}`;
+        }
+        else {
+            hexColor = `#${r}${g}${b}`;
+        }
+        return hexColor;
+    }
+    /* Method to convert the RGBAColor instance to a CSS rgba() string.
+     * @returns CSS rgba string (e.g., "rgba(255, 0, 0, 1)")
+     */
+    toCssString() {
+        return `rgba(${Math.round(this.r)}, ${Math.round(this.g)}, ${Math.round(this.b)}, ${this.a})`;
+    }
+    /* Method to attempt to find the closest named color for this RGBA color.
+     * Only works for fully opaque colors (alpha = 1).
+     * @returns Named color string or null if no exact match found or color has alpha
+     */
+    toNamedColor() {
+        // Only match fully opaque colors
+        if (this.a !== 1) {
+            return null;
+        }
+        const hexColor = this.toHexColor(false).toLowerCase();
+        // Find exact match
+        for (const [name, hex] of Object.entries(NAMED_COLOR_MAP)) {
+            if (hex.toLowerCase() === hexColor) {
+                return name;
+            }
+        }
+        return null;
+    }
+}
+
+/**
+ * A unified Color class that can represent colors as Named, Hex, or RGBA formats
+ * and provides conversion methods between all formats.
+ */
+class ColorStyle {
+    _value;
+    constructor(value) {
+        this._value = value;
+    }
+    ngOnStyle(ngStyle) {
+        return {
+            ...ngStyle,
+            color: this.toCssString()
+        };
+    }
+    /**
+     * Gets the original color value
+     */
+    get value() {
+        return this._value;
+    }
+    /**
+     * Creates a Color from a named color string
+     */
+    static fromNamedColor(colorName) {
+        const normalized = colorName.toLowerCase().trim();
+        if (!isNamedColor(normalized)) {
+            throw new Error(`Unknown named color: ${colorName}`);
+        }
+        return new ColorStyle(normalized);
+    }
+    /**
+     * Creates a Color from a hex color string
+     */
+    static fromHexColor(hexColor) {
+        return new ColorStyle(hexColor);
+    }
+    /**
+     * Creates a Color from an RGBAColor object
+     */
+    static fromRGBAColor(rgba) {
+        return new ColorStyle(rgba);
+    }
+    /**
+     * Creates a Color from RGB values
+     */
+    static fromRGB(r, g, b, a = 1) {
+        const rgba = new RgbaColorStyle();
+        rgba.r = Math.max(0, Math.min(255, Math.round(r)));
+        rgba.g = Math.max(0, Math.min(255, Math.round(g)));
+        rgba.b = Math.max(0, Math.min(255, Math.round(b)));
+        rgba.a = Math.max(0, Math.min(1, a));
+        return new ColorStyle(rgba);
+    }
+    /**
+     * Parses a CSS color string (hex, named, or rgba)
+     */
+    static parse(colorString) {
+        const trimmed = colorString.trim();
+        // Check if it's a named color
+        if (isNamedColor(trimmed)) {
+            return ColorStyle.fromNamedColor(trimmed);
+        }
+        // Check if it's a hex color
+        if (trimmed.startsWith('#')) {
+            return ColorStyle.fromHexColor(trimmed);
+        }
+        // Check if it's an rgba/rgb string
+        const rgbaMatch = trimmed.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)/);
+        if (rgbaMatch) {
+            const r = parseInt(rgbaMatch[1], 10);
+            const g = parseInt(rgbaMatch[2], 10);
+            const b = parseInt(rgbaMatch[3], 10);
+            const a = rgbaMatch[4] ? parseFloat(rgbaMatch[4]) : 1;
+            return ColorStyle.fromRGB(r, g, b, a);
+        }
+        throw new Error(`Invalid color string: ${colorString}`);
+    }
+    /**
+     * Checks if the current value is a named color
+     */
+    isNamedColor() {
+        return typeof this._value === 'string' && !this._value.startsWith('#');
+    }
+    /**
+     * Checks if the current value is a hex color
+     */
+    isHexColor() {
+        return typeof this._value === 'string' && this._value.startsWith('#');
+    }
+    /**
+     * Checks if the current value is an RGBA color object
+     */
+    isRGBAColor() {
+        return this._value instanceof RgbaColorStyle;
+    }
+    /**
+     * Converts to hex color format
+     */
+    toHexColor(includeAlpha = false) {
+        if (this.isHexColor()) {
+            return this._value;
+        }
+        const rgba = this.toRGBAColor();
+        return rgba.toHexColor(includeAlpha);
+    }
+    /**
+     * Converts to RGBA color object
+     */
+    toRGBAColor() {
+        if (this.isRGBAColor()) {
+            return this._value;
+        }
+        if (this.isNamedColor()) {
+            return RgbaColorStyle.fromNamedColor(this._value);
+        }
+        if (this.isHexColor()) {
+            return RgbaColorStyle.fromHexColor(this._value);
+        }
+        throw new Error('Invalid color value');
+    }
+    /**
+     * Attempts to convert to a named color (only for exact matches)
+     */
+    toNamedColor() {
+        if (this.isNamedColor()) {
+            return this._value;
+        }
+        const rgba = this.toRGBAColor();
+        return rgba.toNamedColor();
+    }
+    /**
+     * Converts to CSS string format (hex, named, or rgba)
+     */
+    toCssString() {
+        if (this.isNamedColor()) {
+            return this._value;
+        }
+        if (this.isHexColor()) {
+            return this._value;
+        }
+        if (this.isRGBAColor()) {
+            return this._value.toCssString();
+        }
+        return this.toRGBAColor().toCssString();
+    }
+    /**
+     * Returns the best CSS string representation (named if possible, otherwise hex)
+     */
+    toString() {
+        const namedColor = this.toNamedColor();
+        if (namedColor) {
+            return namedColor;
+        }
+        return this.toHexColor();
+    }
+    /**
+     * Lightens the color by a percentage
+     */
+    lighten(percentage) {
+        const rgba = this.toRGBAColor();
+        const amount = percentage / 100;
+        const lightened = new RgbaColorStyle();
+        lightened.r = Math.min(255, Math.round(rgba.r + (255 - rgba.r) * amount));
+        lightened.g = Math.min(255, Math.round(rgba.g + (255 - rgba.g) * amount));
+        lightened.b = Math.min(255, Math.round(rgba.b + (255 - rgba.b) * amount));
+        lightened.a = rgba.a;
+        return new ColorStyle(lightened);
+    }
+    /**
+     * Darkens the color by a percentage
+     */
+    darken(percentage) {
+        const rgba = this.toRGBAColor();
+        const amount = percentage / 100;
+        const darkened = new RgbaColorStyle();
+        darkened.r = Math.max(0, Math.round(rgba.r * (1 - amount)));
+        darkened.g = Math.max(0, Math.round(rgba.g * (1 - amount)));
+        darkened.b = Math.max(0, Math.round(rgba.b * (1 - amount)));
+        darkened.a = rgba.a;
+        return new ColorStyle(darkened);
+    }
+    /**
+     * Adjusts the alpha channel
+     */
+    withAlpha(alpha) {
+        const rgba = this.toRGBAColor();
+        const adjusted = new RgbaColorStyle();
+        adjusted.r = rgba.r;
+        adjusted.g = rgba.g;
+        adjusted.b = rgba.b;
+        adjusted.a = Math.max(0, Math.min(1, alpha));
+        return new ColorStyle(adjusted);
+    }
+    /**
+     * Checks if two colors are equal
+     */
+    equals(other) {
+        const thisRGBA = this.toRGBAColor();
+        const otherRGBA = other.toRGBAColor();
+        return thisRGBA.r === otherRGBA.r &&
+            thisRGBA.g === otherRGBA.g &&
+            thisRGBA.b === otherRGBA.b &&
+            thisRGBA.a === otherRGBA.a;
+    }
+    /**
+     * Creates a copy of the color
+     */
+    clone() {
+        if (this.isRGBAColor()) {
+            const rgba = this._value;
+            const cloned = new RgbaColorStyle();
+            cloned.r = rgba.r;
+            cloned.g = rgba.g;
+            cloned.b = rgba.b;
+            cloned.a = rgba.a;
+            return new ColorStyle(cloned);
+        }
+        return new ColorStyle(this._value);
+    }
+}
+const DEFAULT_FORECOLOR = ColorStyle.fromNamedColor("black");
+const DEFAULT_BACKCOLOR = ColorStyle.fromNamedColor("white");
+
+class CoordinatesStyle {
+    top;
+    left;
+    ngOnStyle(ngStyle) {
+        if (this.top)
+            ngStyle['top'] = typeof this.top === 'number' ? `${this.top}px` : this.top;
+        if (this.left)
+            ngStyle['left'] = typeof this.left === 'number' ? `${this.left}px` : this.left;
+        return ngStyle;
+    }
+}
+const DEFAULT_COORDINATES = new CoordinatesStyle();
+DEFAULT_COORDINATES.top = 0;
+DEFAULT_COORDINATES.left = 0;
+
+class FontStyle {
+    family;
+    size;
+    italic;
+    bold;
+    underline;
+    ngOnStyle(ngStyle) {
+        if (this.family)
+            ngStyle['fontFamily'] = this.family;
+        if (this.size)
+            ngStyle['fontSize'] = `${this.size}px`;
+        ngStyle['fontStyle'] = this.italic ? 'italic' : 'normal';
+        ngStyle['fontWeight'] = this.bold ? 'bold' : 'normal';
+        ngStyle['textDecoration'] = this.underline ? 'underline' : 'none';
+        return ngStyle;
+    }
+}
+const DEFAULT_FONT = new FontStyle();
+DEFAULT_FONT.family = '"Newake-Regular", sans-serif';
+DEFAULT_FONT.size = 16;
+DEFAULT_FONT.italic = false;
+DEFAULT_FONT.bold = true;
+DEFAULT_FONT.underline = false;
+
+/**
+ * Converts a hex color to RGBA format
+ * @param hex - Hex color string (e.g., "#FF0000" or "#FF0000FF")
+ * @returns RGBAColor object with r, g, b (0-255) and a (0-1)
+ */
+function hexToRGBA(hex) {
+    // Remove the # if present
+    let hexValue = hex.replace('#', '');
+    // Handle shorthand hex (e.g., #FFF)
+    if (hexValue.length === 3) {
+        hexValue = hexValue.split('').map(char => char + char).join('');
+    }
+    // Parse RGB values
+    const r = parseInt(hexValue.substring(0, 2), 16);
+    const g = parseInt(hexValue.substring(2, 4), 16);
+    const b = parseInt(hexValue.substring(4, 6), 16);
+    // Parse alpha value if present (8-character hex)
+    let a = 1;
+    if (hexValue.length === 8) {
+        a = parseInt(hexValue.substring(6, 8), 16) / 255;
+    }
+    const rgba = new RgbaColorStyle();
+    rgba.r = r;
+    rgba.g = g;
+    rgba.b = b;
+    rgba.a = a;
+    return rgba;
+}
+/**
+ * Converts RGBA values to hex color format
+ * @param r - Red value (0-255)
+ * @param g - Green value (0-255)
+ * @param b - Blue value (0-255)
+ * @param a - Alpha value (0-1), optional
+ * @returns Hex color string (e.g., "#FF0000" or "#FF0000FF" if alpha < 1)
+ */
+function rgbaToHex(r, g, b, a = 1) {
+    // Clamp values to valid ranges
+    r = Math.max(0, Math.min(255, Math.round(r)));
+    g = Math.max(0, Math.min(255, Math.round(g)));
+    b = Math.max(0, Math.min(255, Math.round(b)));
+    a = Math.max(0, Math.min(1, a));
+    // Convert to hex
+    const rHex = r.toString(16).padStart(2, '0');
+    const gHex = g.toString(16).padStart(2, '0');
+    const bHex = b.toString(16).padStart(2, '0');
+    // Include alpha if not fully opaque
+    if (a < 1) {
+        const aHex = Math.round(a * 255).toString(16).padStart(2, '0');
+        return `#${rHex}${gHex}${bHex}${aHex}`;
+    }
+    return `#${rHex}${gHex}${bHex}`;
+}
+/**
+ * Converts an RGBAColor object to hex color format
+ * @param rgba - RGBAColor object
+ * @returns Hex color string
+ */
+function rgbaObjectToHex(rgba) {
+    return rgbaToHex(rgba.r, rgba.g, rgba.b, rgba.a);
+}
+/**
+ * Converts an RGBAColor object to CSS rgba() string format
+ * @param rgba - RGBAColor object
+ * @returns CSS rgba string (e.g., "rgba(255, 0, 0, 1)")
+ */
+function rgbaToCssString(rgba) {
+    return `rgba(${rgba.r}, ${rgba.g}, ${rgba.b}, ${rgba.a})`;
+}
+/**
+ * Parses a CSS rgba() or rgb() string to RGBAColor object
+ * @param cssString - CSS color string (e.g., "rgba(255, 0, 0, 1)" or "rgb(255, 0, 0)")
+ * @returns RGBAColor object or null if parsing fails
+ */
+function cssStringToRGBA(cssString) {
+    // Match rgba(r, g, b, a) or rgb(r, g, b)
+    const rgbaMatch = cssString.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)/);
+    if (!rgbaMatch) {
+        return null;
+    }
+    const r = parseInt(rgbaMatch[1], 10);
+    const g = parseInt(rgbaMatch[2], 10);
+    const b = parseInt(rgbaMatch[3], 10);
+    const a = rgbaMatch[4] ? parseFloat(rgbaMatch[4]) : 1;
+    const rgba = new RgbaColorStyle();
+    rgba.r = r;
+    rgba.g = g;
+    rgba.b = b;
+    rgba.a = a;
+    return rgba;
+}
+/**
+ * Creates an RGBAColor object from individual values
+ * @param r - Red value (0-255)
+ * @param g - Green value (0-255)
+ * @param b - Blue value (0-255)
+ * @param a - Alpha value (0-1), defaults to 1
+ * @returns RGBAColor object
+ */
+function createRGBA(r, g, b, a = 1) {
+    const rgba = new RgbaColorStyle();
+    rgba.r = Math.max(0, Math.min(255, Math.round(r)));
+    rgba.g = Math.max(0, Math.min(255, Math.round(g)));
+    rgba.b = Math.max(0, Math.min(255, Math.round(b)));
+    rgba.a = Math.max(0, Math.min(1, a));
+    return rgba;
+}
+/**
+ * Clones an RGBAColor object
+ * @param rgba - RGBAColor object to clone
+ * @returns New RGBAColor object with same values
+ */
+function cloneRGBA(rgba) {
+    const clone = new RgbaColorStyle();
+    clone.r = rgba.r;
+    clone.g = rgba.g;
+    clone.b = rgba.b;
+    clone.a = rgba.a;
+    return clone;
+}
+/**
+ * Checks if two RGBAColor objects are equal
+ * @param rgba1 - First RGBAColor object
+ * @param rgba2 - Second RGBAColor object
+ * @returns True if all values are equal
+ */
+function rgbaEquals(rgba1, rgba2) {
+    return rgba1.r === rgba2.r &&
+        rgba1.g === rgba2.g &&
+        rgba1.b === rgba2.b &&
+        rgba1.a === rgba2.a;
+}
+/**
+ * Adjusts the alpha channel of an RGBA color
+ * @param rgba - Original RGBAColor object
+ * @param alpha - New alpha value (0-1)
+ * @returns New RGBAColor object with adjusted alpha
+ */
+function adjustAlpha(rgba, alpha) {
+    const result = new RgbaColorStyle();
+    result.r = rgba.r;
+    result.g = rgba.g;
+    result.b = rgba.b;
+    result.a = Math.max(0, Math.min(1, alpha));
+    return result;
+}
+/**
+ * Lightens an RGBA color by a percentage
+ * @param rgba - Original RGBAColor object
+ * @param percentage - Amount to lighten (0-100)
+ * @returns New RGBAColor object that is lighter
+ */
+function lightenRGBA(rgba, percentage) {
+    const amount = percentage / 100;
+    const result = new RgbaColorStyle();
+    result.r = Math.min(255, Math.round(rgba.r + (255 - rgba.r) * amount));
+    result.g = Math.min(255, Math.round(rgba.g + (255 - rgba.g) * amount));
+    result.b = Math.min(255, Math.round(rgba.b + (255 - rgba.b) * amount));
+    result.a = rgba.a;
+    return result;
+}
+/**
+ * Darkens an RGBA color by a percentage
+ * @param rgba - Original RGBAColor object
+ * @param percentage - Amount to darken (0-100)
+ * @returns New RGBAColor object that is darker
+ */
+function darkenRGBA(rgba, percentage) {
+    const amount = percentage / 100;
+    const result = new RgbaColorStyle();
+    result.r = Math.max(0, Math.round(rgba.r * (1 - amount)));
+    result.g = Math.max(0, Math.round(rgba.g * (1 - amount)));
+    result.b = Math.max(0, Math.round(rgba.b * (1 - amount)));
+    result.a = rgba.a;
+    return result;
+}
+/**
+ * Converts a CSS named color to hex format
+ * @param colorName - CSS named color (case-insensitive, e.g., 'red', 'cornflowerblue')
+ * @returns Hex color string
+ * @throws Error if the color name is not recognized
+ */
+function namedColorToHexColor(colorName) {
+    const hexColor = namedColorToHex(colorName);
+    if (!hexColor) {
+        throw new Error(`Unknown named color: ${colorName}`);
+    }
+    return hexColor;
+}
+/**
+ * Converts a CSS named color to RGBA format
+ * @param colorName - CSS named color (case-insensitive)
+ * @returns RGBAColor object
+ * @throws Error if the color name is not recognized
+ */
+function namedColorToRGBA(colorName) {
+    const hexColor = namedColorToHexColor(colorName);
+    return hexToRGBA(hexColor);
+}
+/**
+ * Checks if a string is a valid CSS named color
+ * @param colorName - String to check
+ * @returns True if it's a valid named color
+ */
+function isValidNamedColor(colorName) {
+    return isNamedColor(colorName);
+}
+/**
+ * Attempts to find the closest named color for a given hex color
+ * @param hexColor - Hex color to match
+ * @returns Named color string or null if no close match found
+ */
+function hexToNamedColor(hexColor) {
+    const normalized = hexColor.toLowerCase().replace('#', '');
+    const targetHex = normalized.length === 6 ? `#${normalized}` : null;
+    if (!targetHex) {
+        return null; // Can't match colors with alpha or short format
+    }
+    // Find exact match
+    for (const [name, hex] of Object.entries(NAMED_COLOR_MAP)) {
+        if (hex.toLowerCase() === targetHex.toLowerCase()) {
+            return name;
+        }
+    }
+    return null;
+}
+/**
+ * Attempts to find the closest named color for a given RGBA color
+ * @param rgba - RGBAColor to match
+ * @returns Named color string or null if no close match found
+ */
+function rgbaToNamedColor(rgba) {
+    // Only match fully opaque colors
+    if (rgba.a !== 1) {
+        return null;
+    }
+    const hexColor = rgbaObjectToHex(rgba);
+    return hexToNamedColor(hexColor);
+}
+
+var Justifications;
+(function (Justifications) {
+    Justifications["Left"] = "left";
+    Justifications["Right"] = "right";
+    Justifications["Center"] = "center";
+    Justifications["Fully"] = "fully";
+})(Justifications || (Justifications = {}));
+
+class SizeStyle {
+    ngOnStyle(ngStyle) {
+        if (this.width) {
+            if (ngStyle) {
+                ngStyle['width'] = typeof this.width === 'number' ? `${this.width}px` : this.width;
+            }
+        }
+        if (this.height) {
+            if (ngStyle) {
+                ngStyle['height'] = typeof this.height === 'number' ? `${this.height}px` : this.height;
+            }
+        }
+        return ngStyle;
+    }
+    width;
+    height;
+}
+const DEFAULT_SIZE = new SizeStyle();
+DEFAULT_SIZE.width = 100;
+DEFAULT_SIZE.height = 100;
+
+class ImageStyle {
+    href;
+    justification;
+    size;
+    coordinates;
+    ngOnStyle(ngStyle) {
+        if (this.href) {
+            ngStyle['backgroundImage'] = `url(${this.href})`;
+        }
+        if (this.justification) {
+            ngStyle['backgroundPosition'] = this.justification;
+        }
+        if (this.size) {
+            this.size.ngOnStyle(ngStyle);
+        }
+        if (this.coordinates) {
+            this.coordinates.ngOnStyle(ngStyle);
+        }
+        return ngStyle;
+    }
+}
+const DEFAULT_IMAGE = new ImageStyle();
+DEFAULT_IMAGE.href = "assets/images/default-category.png";
+DEFAULT_IMAGE.justification = Justifications.Left;
+DEFAULT_IMAGE.size = DEFAULT_SIZE;
+DEFAULT_IMAGE.coordinates = DEFAULT_COORDINATES;
+
+class TextStyle {
+    font;
+    textColor;
+    backgroundColor;
+    watermark;
+    image;
+    value;
+    ngOnStyle(ngStyle) {
+        return {
+            ...(ngStyle),
+            ...(this.font ? this.font.ngOnStyle(ngStyle) : {}),
+            ...(this.textColor ? { color: this.textColor.toCssString() } : {}),
+            ...(this.backgroundColor ? { backgroundColor: this.backgroundColor.toCssString() } : {}),
+            ...(this.image ? this.image.ngOnStyle(ngStyle) : {}),
+        };
+    }
+}
+const DEFAULT_TEXT_STYLE = new TextStyle();
+DEFAULT_TEXT_STYLE.value = 'Default Category';
+DEFAULT_TEXT_STYLE.font = DEFAULT_FONT;
+DEFAULT_TEXT_STYLE.textColor = DEFAULT_BACKCOLOR;
+DEFAULT_TEXT_STYLE.backgroundColor = DEFAULT_FORECOLOR;
+DEFAULT_TEXT_STYLE.watermark = "Category Name";
+DEFAULT_TEXT_STYLE.image = DEFAULT_IMAGE;
+
 const EXAMPLE_CREATE_SUBSCRIPTION_REQUEST = {
     "creditCard": {
         "firstName": "John",
@@ -1757,17 +2781,56 @@ class Category {
     id;
     name;
     description;
-    static MapToString(from) {
-        return from.name;
+    toString() {
+        return this.name;
     }
-    static MapFromString(from) {
-        const to = new Category();
-        to.name = from;
-        to.description = from;
-        return to;
+    static newCategory(categoryName, categoryDescription = undefined) {
+        const category = new Category();
+        category.name = categoryName;
+        category.description = categoryDescription || categoryName;
+        return category;
     }
 }
 
+const DEFAULT_CATEGORY_SLIDE = {
+    name: (() => {
+        const style = new TextStyle();
+        style.value = 'Default Category';
+        style.font = DEFAULT_FONT;
+        style.textColor = ColorStyle.fromNamedColor("black");
+        style.backgroundColor = ColorStyle.fromNamedColor("white");
+        style.watermark = "Category Name";
+        style.image = undefined;
+        return style;
+    })(),
+    description: (() => {
+        const style = new TextStyle();
+        style.value = 'Default Description';
+        style.font = DEFAULT_FONT;
+        style.textColor = ColorStyle.fromRGB(0, 0, 0, 1);
+        style.backgroundColor = ColorStyle.fromRGB(255, 255, 255, 1);
+        style.watermark = "Category Description";
+        style.image = undefined;
+        return style;
+    })(),
+    picture: (() => {
+        const image = new ImageStyle();
+        image.href = "assets/images/default-category.png";
+        image.justification = Justifications.Left;
+        const coords = new CoordinatesStyle();
+        coords.top = 0;
+        coords.left = 0;
+        image.coordinates = coords;
+        const size = new SizeStyle();
+        size.width = 100;
+        size.height = 100;
+        image.size = size;
+        return image;
+    })(),
+    backgroundColor: ColorStyle.fromHexColor("#FFFFFF"),
+    selected: false
+};
+
 var UserTypes;
 (function (UserTypes) {
     UserTypes["User"] = "User";
@@ -1790,43 +2853,45 @@ class Profile {
     companyName;
     promoCode;
     employeeType;
-    static MapFromCustomer(from) {
-        const to = new Profile();
-        to.id = from.id;
-        to.displayName = from.displayName;
-        to.jobTitle = from.jobTitle;
-        to.companyName = from.companyName;
-        to.mail = from.emailAddress;
-        to.businessPhones = [from.phoneNumber];
-        return to;
+    static newProfile(from) {
+        const newProfile = new Profile();
+        newProfile.id = from.id;
+        newProfile.displayName = from.displayName;
+        newProfile.jobTitle = from.jobTitle;
+        newProfile.companyName = from.companyName;
+        newProfile.mail = from.emailAddress;
+        newProfile.businessPhones = [from.phoneNumber];
+        return newProfile;
     }
-    static MapToCustomer(from) {
+    toCustomer() {
         const to = new Customer();
-        to.id = from.id || "";
-        to.displayName = from.displayName || "";
-        to.jobTitle = from.jobTitle || "";
-        to.companyName = from.companyName || "";
-        to.emailAddress = from.mail || "";
+        to.id = this.id || "";
+        to.displayName = this.displayName || "";
+        to.jobTitle = this.jobTitle || "";
+        to.companyName = this.companyName || "";
+        to.emailAddress = this.mail || "";
         to.userType = UserTypes.Administrator;
         to.apiClientId = "5dd15878-aa4c-4adf-8650-b931f32a7b67";
         to.apiLocationId = "10f19fc5-31d0-4d76-bad4-ad593c9803ae";
         return to;
     }
 }
-const DEFAULT_PROFILE = {
-    "companyName": "Test Weed Dispensary",
-    "businessPhones": ["503.555.1212"],
-    "displayName": "Demo User",
-    "givenName": "Demo",
-    "id": "1",
-    "jobTitle": "Budtender",
-    "mail": "demo@app.cheapweedmenu.com",
-    "mobilePhone": "503.555.1212",
-    "photoUrl": "",
-    "preferredLanguage": "en-us",
-    "surname": "User",
-    "userPrincipalName": "demo@app.cheapweedmenu.com"
-};
+const DEFAULT_PROFILE = (() => {
+    const profile = new Profile();
+    profile.companyName = DEFAULT_COMPANY_NAME;
+    profile.businessPhones = ["503.555.1212"];
+    profile.displayName = "Demo User";
+    profile.givenName = "Demo";
+    profile.id = "1";
+    profile.jobTitle = "Budtender";
+    profile.mail = "demo@app.cheapweedmenu.com";
+    profile.mobilePhone = "503.555.1212";
+    profile.photoUrl = "";
+    profile.preferredLanguage = "en-us";
+    profile.surname = "User";
+    profile.userPrincipalName = "demo@app.cheapweedmenu.com";
+    return profile;
+})();
 
 class Customer {
     id;
@@ -27641,36 +28706,6 @@ const DEFAULT_INVENTORY_API_RESPONSE = {
     ]
 };
 
-var Justifications;
-(function (Justifications) {
-    Justifications["Left"] = "left";
-    Justifications["Right"] = "right";
-    Justifications["Center"] = "center";
-    Justifications["Absolute"] = "absolute";
-})(Justifications || (Justifications = {}));
-
-var LoggingVerbosity;
-(function (LoggingVerbosity) {
-    LoggingVerbosity["Error"] = "Error";
-    LoggingVerbosity["Warning"] = "Warn";
-    LoggingVerbosity["Debug"] = "Debug";
-    LoggingVerbosity["Information"] = "Info";
-    LoggingVerbosity["None"] = "None";
-})(LoggingVerbosity || (LoggingVerbosity = {}));
-
-var NamedColors;
-(function (NamedColors) {
-    NamedColors["Red"] = "red";
-    NamedColors["Green"] = "green";
-    NamedColors["Blue"] = "blue";
-    NamedColors["Yellow"] = "yellow";
-    NamedColors["Black"] = "black";
-    NamedColors["White"] = "white";
-})(NamedColors || (NamedColors = {}));
-
-class OnElementStyle {
-}
-
 class Product {
     id;
     name;
@@ -27678,22 +28713,23 @@ class Product {
     brand;
     price;
     thcPercentage;
+    cbdPercentage;
     category;
     quantity;
     type;
     pictureURL;
     terpenes;
-    static FromFlowhubProduct(from) {
+    static newProduct(from) {
         const to = new Product();
         to.id = from.productId;
         to.name = from.productName;
         to.description = from.productDescription;
-        to.brand = from.brand;
+        to.brand = from.brand ?? "";
         to.price = from.postTaxPriceInPennies;
         to.thcPercentage = 30;
-        to.category = from.category;
+        to.category = Category.newCategory(from.category ?? "Uncategorized");
         to.quantity = from.quantity;
-        to.pictureURL = from.productPictureURL;
+        to.pictureURL = from.productPictureURL ?? undefined;
         to.terpenes = from.terpenes;
         return to;
     }
@@ -27707,10 +28743,10 @@ class SafeHtmlPipe {
     transform(value) {
         return this.sanitizer.bypassSecurityTrustHtml(value);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SafeHtmlPipe, deps: [{ token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
-    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.18", ngImport: i0, type: SafeHtmlPipe, isStandalone: false, name: "safeHtml" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: SafeHtmlPipe, deps: [{ token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.19", ngImport: i0, type: SafeHtmlPipe, isStandalone: false, name: "safeHtml" });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SafeHtmlPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: SafeHtmlPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'safeHtml',
@@ -27719,8 +28755,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
         }], ctorParameters: () => [{ type: i1$1.DomSanitizer }] });
 
 class CwmSharedModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: CwmSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.18", ngImport: i0, type: CwmSharedModule, declarations: [ExternalNavigationComponent,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: CwmSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.19", ngImport: i0, type: CwmSharedModule, declarations: [ExternalNavigationComponent,
             NavigateToRouteComponent,
             PageNotFoundComponent,
             SafeHtmlPipe], imports: [CommonModule,
@@ -27734,7 +28770,7 @@ class CwmSharedModule {
             NavigateToRouteComponent,
             PageNotFoundComponent,
             SafeHtmlPipe] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: CwmSharedModule, imports: [CommonModule,
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: CwmSharedModule, imports: [CommonModule,
             RouterModule,
             MsalModule,
             BrowserModule,
@@ -27742,7 +28778,7 @@ class CwmSharedModule {
             RouterModule,
             MsalModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: CwmSharedModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: CwmSharedModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -27924,10 +28960,10 @@ class ConfigService {
         this.logger.info("Saved Configuration to Azure App Configuration");
         this.logger.methodName = "";
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: ConfigService, deps: [{ token: AUTH_CONFIG }, { token: ClassLoggerService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: ConfigService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: ConfigService, deps: [{ token: AUTH_CONFIG }, { token: ClassLoggerService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: ConfigService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: ConfigService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: ConfigService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -27958,10 +28994,10 @@ class BaseApiService {
         this.httpClient = httpClient;
         this.logger = logger;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: BaseApiService, deps: [{ token: DOCUMENT }, { token: ConfigService }, { token: i2$1.HttpClient }, { token: ClassLoggerService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: BaseApiService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: BaseApiService, deps: [{ token: DOCUMENT }, { token: ConfigService }, { token: i2$1.HttpClient }, { token: ClassLoggerService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: BaseApiService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: BaseApiService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: BaseApiService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -28014,23 +29050,23 @@ class InventoryApiService extends BaseApiService {
         if (productApiResponse.status != HttpStatusCode.Ok) {
             throw new Error(`ProductApiResponse status:  ${productApiResponse.status}`);
         }
-        const allProducts = productApiResponse.data.map((value) => Product.FromFlowhubProduct(value))
-            .sort((a, b) => a.category.localeCompare(b.category));
+        const allProducts = productApiResponse.data.map((value) => Product.newProduct(value))
+            .sort((a, b) => a.category.name.localeCompare(b.category.name));
         const allCategories = keys(countBy(allProducts, (product) => product.category))
-            .map((category) => Category.MapFromString(category));
+            .map((category) => Category.newCategory(category));
         const productsByAllCategories = [];
         allCategories.sort().forEach(category => productsByAllCategories.push({
             key: category.name,
-            value: allProducts.filter((product) => product.category === category.name &&
+            value: allProducts.filter((product) => product.category.name === category.name &&
                 product.quantity > 0).sort()
         }));
         return productsByAllCategories;
     }
     ;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: InventoryApiService, deps: [{ token: DOCUMENT }, { token: ConfigService }, { token: i2$1.HttpClient }, { token: ClassLoggerService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: InventoryApiService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: InventoryApiService, deps: [{ token: DOCUMENT }, { token: ConfigService }, { token: i2$1.HttpClient }, { token: ClassLoggerService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: InventoryApiService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: InventoryApiService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: InventoryApiService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -28311,10 +29347,10 @@ class LocalStorageService {
             this.initEvent.complete();
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: LocalStorageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: LocalStorageService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: LocalStorageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: LocalStorageService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: LocalStorageService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: LocalStorageService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -28413,10 +29449,10 @@ class LogService {
             console.error(this.prefix + " Error: " + message, optionalParams);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: LogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: LogService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: LogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: LogService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: LogService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: LogService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -28446,10 +29482,10 @@ class SubscriptionApiService extends BaseApiService {
             this.logger.endOfMethod();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SubscriptionApiService, deps: [{ token: DOCUMENT }, { token: ConfigService }, { token: i2$1.HttpClient }, { token: ClassLoggerService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SubscriptionApiService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: SubscriptionApiService, deps: [{ token: DOCUMENT }, { token: ConfigService }, { token: i2$1.HttpClient }, { token: ClassLoggerService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: SubscriptionApiService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: SubscriptionApiService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: SubscriptionApiService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -28468,5 +29504,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { API_CONFIG_SCHEMA, AUTH_CONFIG, AUTH_CONFIG_SCHEMA, BaseApiService, CAROUSEL_CONFIG_SCHEMA, CONFIGURATION_SCHEMA, Category, ClassLoggerService, ConfigService, Customer, CwmSharedModule, DEFAULT_API_CONFIG, DEFAULT_AUTH_CONFIG, DEFAULT_CAROUSEL_CONFIG, DEFAULT_COMPANY_NAME, DEFAULT_CONFIGURATION, DEFAULT_CUSTOMER, DEFAULT_INVENTORY_API_RESPONSE, DEFAULT_MENU_BOARD_CONFIG, DEFAULT_PROFILE, DEFAULT_SLIDE, DEFAULT_SUBSCRIPTION_CONFIG, DbKeys, EXAMPLE_CREATE_SUBSCRIPTION_REQUEST, ExternalNavigationComponent, InventoryApiService, Justifications, LocalStorageService, LogService, LoggingVerbosity, MENU_BOARD_CONFIG_SCHEMA, MockConfig, MockCustomer, MockInventoryApiResponse, MockProfile, NamedColors, NavigateToRouteComponent, OnElementStyle, PageNotFoundComponent, Product, Profile, SLIDE_SCHEMA, SUBSCRIPTION_CONFIG_SCHEMA, SafeHtmlPipe, Stack, SubscriptionApiService, TimeSpan, TimeSpanOverflowError, UserTypes, Utilities, decodeToken, doWithLock, isTokenValid, msalGuardConfigFactory, msalInstanceFactory, msalInterceptorConfigFactory, waitFor };
+export { API_CONFIG_SCHEMA, AUTH_CONFIG, AUTH_CONFIG_SCHEMA, BaseApiService, CAROUSEL_CONFIG_SCHEMA, CONFIGURATION_SCHEMA, Category, ClassLoggerService, ColorStyle, ConfigService, CoordinatesStyle, Customer, CwmSharedModule, DEFAULT_API_CONFIG, DEFAULT_AUTH_CONFIG, DEFAULT_BACKCOLOR, DEFAULT_CAROUSEL_CONFIG, DEFAULT_CATEGORY_SLIDE, DEFAULT_COMPANY_NAME, DEFAULT_CONFIGURATION, DEFAULT_COORDINATES, DEFAULT_CUSTOMER, DEFAULT_FONT, DEFAULT_FORECOLOR, DEFAULT_IMAGE, DEFAULT_INVENTORY_API_RESPONSE, DEFAULT_MENU_BOARD_CONFIG, DEFAULT_PROFILE, DEFAULT_SIZE, DEFAULT_SLIDE, DEFAULT_SUBSCRIPTION_CONFIG, DEFAULT_TEXT_STYLE, DbKeys, EXAMPLE_CREATE_SUBSCRIPTION_REQUEST, ExternalNavigationComponent, FontStyle, ImageStyle, InventoryApiService, Justifications, LocalStorageService, LogService, MENU_BOARD_CONFIG_SCHEMA, MockConfig, MockCustomer, MockInventoryApiResponse, MockProfile, NavigateToRouteComponent, PageNotFoundComponent, Product, Profile, RgbaColorStyle, SLIDE_SCHEMA, SUBSCRIPTION_CONFIG_SCHEMA, SafeHtmlPipe, SizeStyle, Stack, SubscriptionApiService, TextStyle, TimeSpan, TimeSpanOverflowError, UserTypes, Utilities, adjustAlpha, cloneRGBA, createRGBA, cssStringToRGBA, darkenRGBA, decodeToken, doWithLock, hexToNamedColor, hexToRGBA, isTokenValid, isValidNamedColor, lightenRGBA, msalGuardConfigFactory, msalInstanceFactory, msalInterceptorConfigFactory, namedColorToHexColor, namedColorToRGBA, rgbaEquals, rgbaObjectToHex, rgbaToCssString, rgbaToHex, rgbaToNamedColor, waitFor };
 //# sourceMappingURL=transcommerce-cwm-shared.mjs.map