cax-design-system 2.0.0 → 2.1.0

package/esm2022/togglebutton/togglebutton.mjs

@@ -186,7 +186,7 @@ export class ToggleButton {
             }
             <span class="p-button-label" *ngIf="onLabel || offLabel" [attr.data-pc-section]="'label'">{{ checked ? (hasOnLabel ? onLabel : '') : hasOffLabel ? offLabel : '' }}</span>
         </div>
-    `, isInline: true, styles: ["@layer cax{.cax-button{margin:0;display:flex;justify-content:center;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;vertical-align:bottom;text-align:center;overflow:hidden;position:relative}.cax-button-label{flex:1 1 auto}.cax-button-icon-right{order:1}.cax-button:disabled{cursor:default;pointer-events:none}.cax-button-icon-only{justify-content:center}.cax-button-icon-only:after{content:\"p\";visibility:hidden;clip:rect(0 0 0 0);width:0}.cax-button-vertical{flex-direction:column}.cax-button-icon-bottom{order:2}.cax-button-group .cax-button{margin:0}.cax-button.cax-button-loading{opacity:1!important}.cax-button-group .cax-button:focus,.cax-button-group cax-button:focus .cax-button,.cax-buttonset .cax-button:focus,.cax-buttonset cax-button:focus .cax-button{position:relative;z-index:1}.cax-button-group .cax-button:not(:last-child),.cax-button-group .cax-button:not(:last-child):hover,.cax-button-group cax-button:not(:last-child) .cax-button,.cax-button-group cax-button:not(:last-child) .cax-button:hover,.cax-buttonset .cax-button:not(:last-child),.cax-buttonset .cax-button:not(:last-child):hover,.cax-buttonset cax-button:not(:last-child) .cax-button,.cax-buttonset cax-button:not(:last-child) .cax-button:hover{border-right:0 none}.cax-button-group .cax-button:not(:first-of-type):not(:last-of-type),.cax-button-group cax-button:not(:first-of-type):not(:last-of-type) .cax-button,.cax-buttonset .cax-button:not(:first-of-type):not(:last-of-type),.cax-buttonset cax-button:not(:first-of-type):not(:last-of-type) .cax-button{border-radius:0}.cax-button-group .cax-button:first-of-type:not(:only-of-type),.cax-button-group cax-button:first-of-type:not(:only-of-type) .cax-button,.cax-buttonset .cax-button:first-of-type:not(:only-of-type),.cax-buttonset cax-button:first-of-type:not(:only-of-type) .cax-button{border-top-right-radius:0;border-bottom-right-radius:0}.cax-button-group .cax-button:last-of-type:not(:only-of-type),.cax-button-group cax-button:last-of-type:not(:only-of-type) .cax-button,.cax-buttonset .cax-button:last-of-type:not(:only-of-type),.cax-buttonset cax-button:last-of-type:not(:only-of-type) .cax-button{border-top-left-radius:0;border-bottom-left-radius:0}cax-button[iconpos=right] spinnericon{order:1}.cax-button-content-wrapper{display:inline-flex;align-items:center;gap:1rem;max-width:fit-content}.cax-button-icon-left,.cax-button-icon-right,.cax-button-label{flex:0 0 auto}.center-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center}.spin{display:inline-block;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    `, isInline: true, styles: ["@layer cax{.cax-button{margin:0;display:flex;justify-content:center;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;vertical-align:bottom;text-align:center;overflow:hidden;position:relative}.cax-button-label{flex:1 1 auto}.cax-button-icon-right{order:1}.cax-button:disabled{cursor:default;pointer-events:none}.cax-button-icon-only{justify-content:center}.cax-button-icon-only:after{content:\"p\";visibility:hidden;clip:rect(0 0 0 0);width:0}.cax-button-vertical{flex-direction:column}.cax-button-icon-bottom{order:2}.cax-button-group .cax-button{margin:0}.cax-button.cax-button-loading{opacity:1!important}.cax-button-group .cax-button:focus,.cax-button-group cax-button:focus .cax-button,.cax-buttonset .cax-button:focus,.cax-buttonset cax-button:focus .cax-button{position:relative;z-index:1}.cax-button-group .cax-button:not(:last-child),.cax-button-group .cax-button:not(:last-child):hover,.cax-button-group cax-button:not(:last-child) .cax-button,.cax-button-group cax-button:not(:last-child) .cax-button:hover,.cax-buttonset .cax-button:not(:last-child),.cax-buttonset .cax-button:not(:last-child):hover,.cax-buttonset cax-button:not(:last-child) .cax-button,.cax-buttonset cax-button:not(:last-child) .cax-button:hover{border-right:0 none}.cax-button-group .cax-button:not(:first-of-type):not(:last-of-type),.cax-button-group cax-button:not(:first-of-type):not(:last-of-type) .cax-button,.cax-buttonset .cax-button:not(:first-of-type):not(:last-of-type),.cax-buttonset cax-button:not(:first-of-type):not(:last-of-type) .cax-button{border-radius:0}.cax-button-group .cax-button:first-of-type:not(:only-of-type),.cax-button-group cax-button:first-of-type:not(:only-of-type) .cax-button,.cax-buttonset .cax-button:first-of-type:not(:only-of-type),.cax-buttonset cax-button:first-of-type:not(:only-of-type) .cax-button{border-top-right-radius:0;border-bottom-right-radius:0}.cax-button-group .cax-button:last-of-type:not(:only-of-type),.cax-button-group cax-button:last-of-type:not(:only-of-type) .cax-button,.cax-buttonset .cax-button:last-of-type:not(:only-of-type),.cax-buttonset cax-button:last-of-type:not(:only-of-type) .cax-button{border-top-left-radius:0;border-bottom-left-radius:0}cax-button[iconpos=right] spinnericon{order:1}.cax-button-content-wrapper{display:inline-flex;align-items:center;gap:1rem;max-width:fit-content;position:relative}.cax-button-loading-container{display:flex;align-items:center;justify-content:center;width:100%;position:absolute}.cax-button-icon-left,.cax-button-icon-right,.cax-button-label{flex:0 0 auto}.center-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center}.cax-main-loader{display:flex;justify-content:center;align-items:center;background:transparent}.cax-main-loader .cax-button-sm{height:32px!important;padding:var(--space-100) var(--space-150) var(--space-100) var(--space-150)!important;gap:var(--space-75)}.cax-main-loader .cax-button-md{height:40px!important;padding:var(--space-100) var(--space-200) var(--space-100) var(--space-200)!important;gap:var(--space-100)}.cax-main-loader .cax-button-lg{height:48px!important;padding:var(--space-100) var(--space-200) var(--space-100) var(--space-200)!important;gap:var(--space-100)}.spin{display:inline-block;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: ToggleButton, decorators: [{
             type: Component,
@@ -222,7 +222,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImpor
         </div>
     `, providers: [TOGGLEBUTTON_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'cax-element'
-                    }, styles: ["@layer cax{.cax-button{margin:0;display:flex;justify-content:center;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;vertical-align:bottom;text-align:center;overflow:hidden;position:relative}.cax-button-label{flex:1 1 auto}.cax-button-icon-right{order:1}.cax-button:disabled{cursor:default;pointer-events:none}.cax-button-icon-only{justify-content:center}.cax-button-icon-only:after{content:\"p\";visibility:hidden;clip:rect(0 0 0 0);width:0}.cax-button-vertical{flex-direction:column}.cax-button-icon-bottom{order:2}.cax-button-group .cax-button{margin:0}.cax-button.cax-button-loading{opacity:1!important}.cax-button-group .cax-button:focus,.cax-button-group cax-button:focus .cax-button,.cax-buttonset .cax-button:focus,.cax-buttonset cax-button:focus .cax-button{position:relative;z-index:1}.cax-button-group .cax-button:not(:last-child),.cax-button-group .cax-button:not(:last-child):hover,.cax-button-group cax-button:not(:last-child) .cax-button,.cax-button-group cax-button:not(:last-child) .cax-button:hover,.cax-buttonset .cax-button:not(:last-child),.cax-buttonset .cax-button:not(:last-child):hover,.cax-buttonset cax-button:not(:last-child) .cax-button,.cax-buttonset cax-button:not(:last-child) .cax-button:hover{border-right:0 none}.cax-button-group .cax-button:not(:first-of-type):not(:last-of-type),.cax-button-group cax-button:not(:first-of-type):not(:last-of-type) .cax-button,.cax-buttonset .cax-button:not(:first-of-type):not(:last-of-type),.cax-buttonset cax-button:not(:first-of-type):not(:last-of-type) .cax-button{border-radius:0}.cax-button-group .cax-button:first-of-type:not(:only-of-type),.cax-button-group cax-button:first-of-type:not(:only-of-type) .cax-button,.cax-buttonset .cax-button:first-of-type:not(:only-of-type),.cax-buttonset cax-button:first-of-type:not(:only-of-type) .cax-button{border-top-right-radius:0;border-bottom-right-radius:0}.cax-button-group .cax-button:last-of-type:not(:only-of-type),.cax-button-group cax-button:last-of-type:not(:only-of-type) .cax-button,.cax-buttonset .cax-button:last-of-type:not(:only-of-type),.cax-buttonset cax-button:last-of-type:not(:only-of-type) .cax-button{border-top-left-radius:0;border-bottom-left-radius:0}cax-button[iconpos=right] spinnericon{order:1}.cax-button-content-wrapper{display:inline-flex;align-items:center;gap:1rem;max-width:fit-content}.cax-button-icon-left,.cax-button-icon-right,.cax-button-label{flex:0 0 auto}.center-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center}.spin{display:inline-block;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}}\n"] }]
+                    }, styles: ["@layer cax{.cax-button{margin:0;display:flex;justify-content:center;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;vertical-align:bottom;text-align:center;overflow:hidden;position:relative}.cax-button-label{flex:1 1 auto}.cax-button-icon-right{order:1}.cax-button:disabled{cursor:default;pointer-events:none}.cax-button-icon-only{justify-content:center}.cax-button-icon-only:after{content:\"p\";visibility:hidden;clip:rect(0 0 0 0);width:0}.cax-button-vertical{flex-direction:column}.cax-button-icon-bottom{order:2}.cax-button-group .cax-button{margin:0}.cax-button.cax-button-loading{opacity:1!important}.cax-button-group .cax-button:focus,.cax-button-group cax-button:focus .cax-button,.cax-buttonset .cax-button:focus,.cax-buttonset cax-button:focus .cax-button{position:relative;z-index:1}.cax-button-group .cax-button:not(:last-child),.cax-button-group .cax-button:not(:last-child):hover,.cax-button-group cax-button:not(:last-child) .cax-button,.cax-button-group cax-button:not(:last-child) .cax-button:hover,.cax-buttonset .cax-button:not(:last-child),.cax-buttonset .cax-button:not(:last-child):hover,.cax-buttonset cax-button:not(:last-child) .cax-button,.cax-buttonset cax-button:not(:last-child) .cax-button:hover{border-right:0 none}.cax-button-group .cax-button:not(:first-of-type):not(:last-of-type),.cax-button-group cax-button:not(:first-of-type):not(:last-of-type) .cax-button,.cax-buttonset .cax-button:not(:first-of-type):not(:last-of-type),.cax-buttonset cax-button:not(:first-of-type):not(:last-of-type) .cax-button{border-radius:0}.cax-button-group .cax-button:first-of-type:not(:only-of-type),.cax-button-group cax-button:first-of-type:not(:only-of-type) .cax-button,.cax-buttonset .cax-button:first-of-type:not(:only-of-type),.cax-buttonset cax-button:first-of-type:not(:only-of-type) .cax-button{border-top-right-radius:0;border-bottom-right-radius:0}.cax-button-group .cax-button:last-of-type:not(:only-of-type),.cax-button-group cax-button:last-of-type:not(:only-of-type) .cax-button,.cax-buttonset .cax-button:last-of-type:not(:only-of-type),.cax-buttonset cax-button:last-of-type:not(:only-of-type) .cax-button{border-top-left-radius:0;border-bottom-left-radius:0}cax-button[iconpos=right] spinnericon{order:1}.cax-button-content-wrapper{display:inline-flex;align-items:center;gap:1rem;max-width:fit-content;position:relative}.cax-button-loading-container{display:flex;align-items:center;justify-content:center;width:100%;position:absolute}.cax-button-icon-left,.cax-button-icon-right,.cax-button-label{flex:0 0 auto}.center-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center}.cax-main-loader{display:flex;justify-content:center;align-items:center;background:transparent}.cax-main-loader .cax-button-sm{height:32px!important;padding:var(--space-100) var(--space-150) var(--space-100) var(--space-150)!important;gap:var(--space-75)}.cax-main-loader .cax-button-md{height:40px!important;padding:var(--space-100) var(--space-200) var(--space-100) var(--space-200)!important;gap:var(--space-100)}.cax-main-loader .cax-button-lg{height:48px!important;padding:var(--space-100) var(--space-200) var(--space-100) var(--space-200)!important;gap:var(--space-100)}.spin{display:inline-block;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { onLabel: [{
                 type: Input
             }], offLabel: [{

package/esm2022/toggleswitch/toggleswitch.mjs

@@ -2,6 +2,7 @@ import { Component, Input, Output, EventEmitter } from '@angular/core';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
 export class ToggleSwitchComponent {
+    size = 'md';
     checked = false;
     disabled = false;
     iconClass = 'cax cax-check';
@@ -13,12 +14,14 @@ export class ToggleSwitchComponent {
         this.onChange.emit(this.checked);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: ToggleSwitchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: ToggleSwitchComponent, selector: "cax-toggleswitch", inputs: { checked: "checked", disabled: "disabled", iconClass: "iconClass", label: "label", events: "events" }, outputs: { onChange: "onChange" }, ngImport: i0, template: "<div\r\n  class=\"cax-toggleswitch-container\"\r\n  [ngClass]=\"{ 'cax-toggleswitch-container-disabled': disabled }\"\r\n>\r\n  <span class=\"cax-toggle-label\" *ngIf=\"label\">{{ label }}</span>\r\n  <label\r\n    class=\"cax-toggleswitchmaindiv\"\r\n    [ngClass]=\"{ 'cax-toggleswitchmaindiv-disabled': disabled }\"\r\n  >\r\n    <input\r\n      type=\"checkbox\"\r\n      [checked]=\"checked\"\r\n      [disabled]=\"disabled\"\r\n      (change)=\"toggleChecked($event)\"\r\n      class=\"cax-toggleswitch\"\r\n    />\r\n    <div class=\"cax-toggleswitch-track\"></div>\r\n    <div\r\n      class=\"cax-toggle-thumb\"\r\n      [ngClass]=\"{\r\n        'cax-toggle-thumb-checked': checked\r\n      }\"\r\n    >\r\n      <ng-container *ngIf=\"checked\">\r\n        <svg\r\n          width=\"11\"\r\n          height=\"7\"\r\n          viewBox=\"0 0 11 8\"\r\n          fill=\"none\"\r\n          xmlns=\"http://www.w3.org/2000/svg\"\r\n          class=\"cax-toggle-icon-active\"\r\n        >\r\n          <path\r\n            d=\"M10.0915 0.951972L10.0867 0.946075L10.0813 0.940568C9.90076 0.753564 9.61034 0.753146 9.42927 0.939309L4.16201 6.22962L1.58507 3.63469C1.40401 3.44841 1.11351 3.44879 0.932892 3.63584C0.755703 3.81933 0.755703 4.10875 0.932892 4.29224L0.932878 4.29225L0.934851 4.29424L3.58046 6.95832C3.73676 7.11955 3.94983 7.2 4.1473 7.2C4.36196 7.2 4.55963 7.11773 4.71406 6.9584L10.0468 1.60234C10.2436 1.4199 10.2421 1.1339 10.0915 0.951972ZM4.2327 6.30081L4.2317 6.2998C4.23206 6.30015 4.23237 6.30049 4.23269 6.30082L4.2327 6.30081Z\"\r\n            fill=\"#1644e7\"\r\n            stroke=\"#1644e7\"\r\n            stroke-width=\"0.4\"\r\n          />\r\n        </svg>\r\n      </ng-container>\r\n    </div>\r\n  </label>\r\n</div>\r\n", styles: ["@layer cax{.cax-toggleswitch-container{display:flex;align-items:center;gap:.5rem}.cax-toggleswitch-container-disabled{opacity:.6;pointer-events:none}.cax-toggleswitchmaindiv{display:inline-flex;align-items:center;position:relative}.cax-toggleswitchmaindiv-disabled{opacity:.6}.cax-toggleswitch{display:none}.cax-toggle-icon-active{display:flex}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: ToggleSwitchComponent, selector: "cax-toggleswitch", inputs: { size: "size", checked: "checked", disabled: "disabled", iconClass: "iconClass", label: "label", events: "events" }, outputs: { onChange: "onChange" }, ngImport: i0, template: "<div\r\n  class=\"cax-toggleswitch-container\"\r\n  [ngClass]=\"{\r\n    'cax-toggleswitch-container-disabled': disabled,\r\n    'cax-toggleswitch-size-sm': size === 'sm',\r\n    'cax-toggleswitch-size-md': size === 'md',\r\n    'cax-toggleswitch-size-lg': size === 'lg'\r\n  }\"\r\n>\r\n  <span class=\"cax-toggle-label\" *ngIf=\"label\">{{ label }}</span>\r\n  <label\r\n    class=\"cax-toggleswitchmaindiv\"\r\n    [ngClass]=\"{ 'cax-toggleswitchmaindiv-disabled': disabled }\"\r\n  >\r\n    <input\r\n      type=\"checkbox\"\r\n      [checked]=\"checked\"\r\n      [disabled]=\"disabled\"\r\n      (change)=\"toggleChecked($event)\"\r\n      class=\"cax-toggleswitch\"\r\n    />\r\n    <div class=\"cax-toggleswitch-track\"></div>\r\n    <div\r\n      class=\"cax-toggle-thumb\"\r\n      [ngClass]=\"{\r\n        'cax-toggle-thumb-checked': checked\r\n      }\"\r\n    >\r\n      <ng-container *ngIf=\"checked\">\r\n        <svg\r\n          width=\"11\"\r\n          height=\"7\"\r\n          viewBox=\"0 0 11 8\"\r\n          fill=\"none\"\r\n          xmlns=\"http://www.w3.org/2000/svg\"\r\n          class=\"cax-toggle-icon-active\"\r\n        >\r\n          <path\r\n            d=\"M10.0915 0.951972L10.0867 0.946075L10.0813 0.940568C9.90076 0.753564 9.61034 0.753146 9.42927 0.939309L4.16201 6.22962L1.58507 3.63469C1.40401 3.44841 1.11351 3.44879 0.932892 3.63584C0.755703 3.81933 0.755703 4.10875 0.932892 4.29224L0.932878 4.29225L0.934851 4.29424L3.58046 6.95832C3.73676 7.11955 3.94983 7.2 4.1473 7.2C4.36196 7.2 4.55963 7.11773 4.71406 6.9584L10.0468 1.60234C10.2436 1.4199 10.2421 1.1339 10.0915 0.951972ZM4.2327 6.30081L4.2317 6.2998C4.23206 6.30015 4.23237 6.30049 4.23269 6.30082L4.2327 6.30081Z\"\r\n            fill=\"#1644e7\"\r\n            stroke=\"#1644e7\"\r\n            stroke-width=\"0.4\"\r\n          />\r\n        </svg>\r\n      </ng-container>\r\n    </div>\r\n  </label>\r\n</div>\r\n", styles: ["@layer cax{.cax-toggleswitch-container{display:flex;align-items:center;gap:.5rem}.cax-toggleswitch-container-disabled{opacity:.6;pointer-events:none}.cax-toggleswitchmaindiv{display:inline-flex;align-items:center;position:relative}.cax-toggleswitchmaindiv-disabled{opacity:.6}.cax-toggleswitch{display:none}.cax-toggle-icon-active{display:flex}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: ToggleSwitchComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cax-toggleswitch', template: "<div\r\n  class=\"cax-toggleswitch-container\"\r\n  [ngClass]=\"{ 'cax-toggleswitch-container-disabled': disabled }\"\r\n>\r\n  <span class=\"cax-toggle-label\" *ngIf=\"label\">{{ label }}</span>\r\n  <label\r\n    class=\"cax-toggleswitchmaindiv\"\r\n    [ngClass]=\"{ 'cax-toggleswitchmaindiv-disabled': disabled }\"\r\n  >\r\n    <input\r\n      type=\"checkbox\"\r\n      [checked]=\"checked\"\r\n      [disabled]=\"disabled\"\r\n      (change)=\"toggleChecked($event)\"\r\n      class=\"cax-toggleswitch\"\r\n    />\r\n    <div class=\"cax-toggleswitch-track\"></div>\r\n    <div\r\n      class=\"cax-toggle-thumb\"\r\n      [ngClass]=\"{\r\n        'cax-toggle-thumb-checked': checked\r\n      }\"\r\n    >\r\n      <ng-container *ngIf=\"checked\">\r\n        <svg\r\n          width=\"11\"\r\n          height=\"7\"\r\n          viewBox=\"0 0 11 8\"\r\n          fill=\"none\"\r\n          xmlns=\"http://www.w3.org/2000/svg\"\r\n          class=\"cax-toggle-icon-active\"\r\n        >\r\n          <path\r\n            d=\"M10.0915 0.951972L10.0867 0.946075L10.0813 0.940568C9.90076 0.753564 9.61034 0.753146 9.42927 0.939309L4.16201 6.22962L1.58507 3.63469C1.40401 3.44841 1.11351 3.44879 0.932892 3.63584C0.755703 3.81933 0.755703 4.10875 0.932892 4.29224L0.932878 4.29225L0.934851 4.29424L3.58046 6.95832C3.73676 7.11955 3.94983 7.2 4.1473 7.2C4.36196 7.2 4.55963 7.11773 4.71406 6.9584L10.0468 1.60234C10.2436 1.4199 10.2421 1.1339 10.0915 0.951972ZM4.2327 6.30081L4.2317 6.2998C4.23206 6.30015 4.23237 6.30049 4.23269 6.30082L4.2327 6.30081Z\"\r\n            fill=\"#1644e7\"\r\n            stroke=\"#1644e7\"\r\n            stroke-width=\"0.4\"\r\n          />\r\n        </svg>\r\n      </ng-container>\r\n    </div>\r\n  </label>\r\n</div>\r\n", styles: ["@layer cax{.cax-toggleswitch-container{display:flex;align-items:center;gap:.5rem}.cax-toggleswitch-container-disabled{opacity:.6;pointer-events:none}.cax-toggleswitchmaindiv{display:inline-flex;align-items:center;position:relative}.cax-toggleswitchmaindiv-disabled{opacity:.6}.cax-toggleswitch{display:none}.cax-toggle-icon-active{display:flex}}\n"] }]
-        }], propDecorators: { checked: [{
+            args: [{ selector: 'cax-toggleswitch', template: "<div\r\n  class=\"cax-toggleswitch-container\"\r\n  [ngClass]=\"{\r\n    'cax-toggleswitch-container-disabled': disabled,\r\n    'cax-toggleswitch-size-sm': size === 'sm',\r\n    'cax-toggleswitch-size-md': size === 'md',\r\n    'cax-toggleswitch-size-lg': size === 'lg'\r\n  }\"\r\n>\r\n  <span class=\"cax-toggle-label\" *ngIf=\"label\">{{ label }}</span>\r\n  <label\r\n    class=\"cax-toggleswitchmaindiv\"\r\n    [ngClass]=\"{ 'cax-toggleswitchmaindiv-disabled': disabled }\"\r\n  >\r\n    <input\r\n      type=\"checkbox\"\r\n      [checked]=\"checked\"\r\n      [disabled]=\"disabled\"\r\n      (change)=\"toggleChecked($event)\"\r\n      class=\"cax-toggleswitch\"\r\n    />\r\n    <div class=\"cax-toggleswitch-track\"></div>\r\n    <div\r\n      class=\"cax-toggle-thumb\"\r\n      [ngClass]=\"{\r\n        'cax-toggle-thumb-checked': checked\r\n      }\"\r\n    >\r\n      <ng-container *ngIf=\"checked\">\r\n        <svg\r\n          width=\"11\"\r\n          height=\"7\"\r\n          viewBox=\"0 0 11 8\"\r\n          fill=\"none\"\r\n          xmlns=\"http://www.w3.org/2000/svg\"\r\n          class=\"cax-toggle-icon-active\"\r\n        >\r\n          <path\r\n            d=\"M10.0915 0.951972L10.0867 0.946075L10.0813 0.940568C9.90076 0.753564 9.61034 0.753146 9.42927 0.939309L4.16201 6.22962L1.58507 3.63469C1.40401 3.44841 1.11351 3.44879 0.932892 3.63584C0.755703 3.81933 0.755703 4.10875 0.932892 4.29224L0.932878 4.29225L0.934851 4.29424L3.58046 6.95832C3.73676 7.11955 3.94983 7.2 4.1473 7.2C4.36196 7.2 4.55963 7.11773 4.71406 6.9584L10.0468 1.60234C10.2436 1.4199 10.2421 1.1339 10.0915 0.951972ZM4.2327 6.30081L4.2317 6.2998C4.23206 6.30015 4.23237 6.30049 4.23269 6.30082L4.2327 6.30081Z\"\r\n            fill=\"#1644e7\"\r\n            stroke=\"#1644e7\"\r\n            stroke-width=\"0.4\"\r\n          />\r\n        </svg>\r\n      </ng-container>\r\n    </div>\r\n  </label>\r\n</div>\r\n", styles: ["@layer cax{.cax-toggleswitch-container{display:flex;align-items:center;gap:.5rem}.cax-toggleswitch-container-disabled{opacity:.6;pointer-events:none}.cax-toggleswitchmaindiv{display:inline-flex;align-items:center;position:relative}.cax-toggleswitchmaindiv-disabled{opacity:.6}.cax-toggleswitch{display:none}.cax-toggle-icon-active{display:flex}}\n"] }]
+        }], propDecorators: { size: [{
+                type: Input
+            }], checked: [{
                 type: Input
             }], disabled: [{
                 type: Input
@@ -31,4 +34,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImpor
             }], events: [{
                 type: Input
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9nZ2xlc3dpdGNoLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2FwcC9jb21wb25lbnRzL3RvZ2dsZXN3aXRjaC90b2dnbGVzd2l0Y2gudHMiLCIuLi8uLi8uLi9zcmMvYXBwL2NvbXBvbmVudHMvdG9nZ2xlc3dpdGNoL3RvZ2dsZXN3aXRjaC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQUUsTUFBTSxlQUFlLENBQUM7OztBQU92RSxNQUFNLE9BQU8scUJBQXFCO0lBQ3JCLE9BQU8sR0FBRyxLQUFLLENBQUM7SUFDaEIsUUFBUSxHQUFHLEtBQUssQ0FBQztJQUNqQixTQUFTLEdBQVcsZUFBZSxDQUFDO0lBQ25DLFFBQVEsR0FBRyxJQUFJLFlBQVksRUFBVyxDQUFDO0lBQ3hDLEtBQUssQ0FBcUI7SUFDMUIsTUFBTSxDQUFLO0lBRXBCLGFBQWEsQ0FBQyxLQUFZO1FBQ3RCLElBQUksQ0FBQyxPQUFPLEdBQUksS0FBSyxDQUFDLE1BQTJCLENBQUMsT0FBTyxDQUFDO1FBQzFELElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUNyQyxDQUFDO3VHQVhRLHFCQUFxQjsyRkFBckIscUJBQXFCLDJNQ1BsQyxpdURBMkNBOzsyRkRwQ2EscUJBQXFCO2tCQUxqQyxTQUFTOytCQUNJLGtCQUFrQjs4QkFLbkIsT0FBTztzQkFBZixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csU0FBUztzQkFBakIsS0FBSztnQkFDSSxRQUFRO3NCQUFqQixNQUFNO2dCQUNFLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxNQUFNO3NCQUFkLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPdXRwdXQsIEV2ZW50RW1pdHRlciB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgICBzZWxlY3RvcjogJ2NheC10b2dnbGVzd2l0Y2gnLFxuICAgIHRlbXBsYXRlVXJsOiAnLi90b2dnbGVzd2l0Y2guaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vdG9nZ2xlc3dpdGNoLnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBUb2dnbGVTd2l0Y2hDb21wb25lbnQge1xuICAgIEBJbnB1dCgpIGNoZWNrZWQgPSBmYWxzZTtcbiAgICBASW5wdXQoKSBkaXNhYmxlZCA9IGZhbHNlO1xuICAgIEBJbnB1dCgpIGljb25DbGFzczogc3RyaW5nID0gJ2NheCBjYXgtY2hlY2snO1xuICAgIEBPdXRwdXQoKSBvbkNoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4oKTtcbiAgICBASW5wdXQoKSBsYWJlbDogc3RyaW5nIHwgdW5kZWZpbmVkO1xuICAgIEBJbnB1dCgpIGV2ZW50czoge307XG5cbiAgICB0b2dnbGVDaGVja2VkKGV2ZW50OiBFdmVudCkge1xuICAgICAgICB0aGlzLmNoZWNrZWQgPSAoZXZlbnQudGFyZ2V0IGFzIEhUTUxJbnB1dEVsZW1lbnQpLmNoZWNrZWQ7XG4gICAgICAgIHRoaXMub25DaGFuZ2UuZW1pdCh0aGlzLmNoZWNrZWQpO1xuICAgIH1cbn1cbiIsIjxkaXZcclxuICBjbGFzcz1cImNheC10b2dnbGVzd2l0Y2gtY29udGFpbmVyXCJcclxuICBbbmdDbGFzc109XCJ7ICdjYXgtdG9nZ2xlc3dpdGNoLWNvbnRhaW5lci1kaXNhYmxlZCc6IGRpc2FibGVkIH1cIlxyXG4+XHJcbiAgPHNwYW4gY2xhc3M9XCJjYXgtdG9nZ2xlLWxhYmVsXCIgKm5nSWY9XCJsYWJlbFwiPnt7IGxhYmVsIH19PC9zcGFuPlxyXG4gIDxsYWJlbFxyXG4gICAgY2xhc3M9XCJjYXgtdG9nZ2xlc3dpdGNobWFpbmRpdlwiXHJcbiAgICBbbmdDbGFzc109XCJ7ICdjYXgtdG9nZ2xlc3dpdGNobWFpbmRpdi1kaXNhYmxlZCc6IGRpc2FibGVkIH1cIlxyXG4gID5cclxuICAgIDxpbnB1dFxyXG4gICAgICB0eXBlPVwiY2hlY2tib3hcIlxyXG4gICAgICBbY2hlY2tlZF09XCJjaGVja2VkXCJcclxuICAgICAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCJcclxuICAgICAgKGNoYW5nZSk9XCJ0b2dnbGVDaGVja2VkKCRldmVudClcIlxyXG4gICAgICBjbGFzcz1cImNheC10b2dnbGVzd2l0Y2hcIlxyXG4gICAgLz5cclxuICAgIDxkaXYgY2xhc3M9XCJjYXgtdG9nZ2xlc3dpdGNoLXRyYWNrXCI+PC9kaXY+XHJcbiAgICA8ZGl2XHJcbiAgICAgIGNsYXNzPVwiY2F4LXRvZ2dsZS10aHVtYlwiXHJcbiAgICAgIFtuZ0NsYXNzXT1cIntcclxuICAgICAgICAnY2F4LXRvZ2dsZS10aHVtYi1jaGVja2VkJzogY2hlY2tlZFxyXG4gICAgICB9XCJcclxuICAgID5cclxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImNoZWNrZWRcIj5cclxuICAgICAgICA8c3ZnXHJcbiAgICAgICAgICB3aWR0aD1cIjExXCJcclxuICAgICAgICAgIGhlaWdodD1cIjdcIlxyXG4gICAgICAgICAgdmlld0JveD1cIjAgMCAxMSA4XCJcclxuICAgICAgICAgIGZpbGw9XCJub25lXCJcclxuICAgICAgICAgIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIlxyXG4gICAgICAgICAgY2xhc3M9XCJjYXgtdG9nZ2xlLWljb24tYWN0aXZlXCJcclxuICAgICAgICA+XHJcbiAgICAgICAgICA8cGF0aFxyXG4gICAgICAgICAgICBkPVwiTTEwLjA5MTUgMC45NTE5NzJMMTAuMDg2NyAwLjk0NjA3NUwxMC4wODEzIDAuOTQwNTY4QzkuOTAwNzYgMC43NTM1NjQgOS42MTAzNCAwLjc1MzE0NiA5LjQyOTI3IDAuOTM5MzA5TDQuMTYyMDEgNi4yMjk2MkwxLjU4NTA3IDMuNjM0NjlDMS40MDQwMSAzLjQ0ODQxIDEuMTEzNTEgMy40NDg3OSAwLjkzMjg5MiAzLjYzNTg0QzAuNzU1NzAzIDMuODE5MzMgMC43NTU3MDMgNC4xMDg3NSAwLjkzMjg5MiA0LjI5MjI0TDAuOTMyODc4IDQuMjkyMjVMMC45MzQ4NTEgNC4yOTQyNEwzLjU4MDQ2IDYuOTU4MzJDMy43MzY3NiA3LjExOTU1IDMuOTQ5ODMgNy4yIDQuMTQ3MyA3LjJDNC4zNjE5NiA3LjIgNC41NTk2MyA3LjExNzczIDQuNzE0MDYgNi45NTg0TDEwLjA0NjggMS42MDIzNEMxMC4yNDM2IDEuNDE5OSAxMC4yNDIxIDEuMTMzOSAxMC4wOTE1IDAuOTUxOTcyWk00LjIzMjcgNi4zMDA4MUw0LjIzMTcgNi4yOTk4QzQuMjMyMDYgNi4zMDAxNSA0LjIzMjM3IDYuMzAwNDkgNC4yMzI2OSA2LjMwMDgyTDQuMjMyNyA2LjMwMDgxWlwiXHJcbiAgICAgICAgICAgIGZpbGw9XCIjMTY0NGU3XCJcclxuICAgICAgICAgICAgc3Ryb2tlPVwiIzE2NDRlN1wiXHJcbiAgICAgICAgICAgIHN0cm9rZS13aWR0aD1cIjAuNFwiXHJcbiAgICAgICAgICAvPlxyXG4gICAgICAgIDwvc3ZnPlxyXG4gICAgICA8L25nLWNvbnRhaW5lcj5cclxuICAgIDwvZGl2PlxyXG4gIDwvbGFiZWw+XHJcbjwvZGl2PlxyXG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9nZ2xlc3dpdGNoLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2FwcC9jb21wb25lbnRzL3RvZ2dsZXN3aXRjaC90b2dnbGVzd2l0Y2gudHMiLCIuLi8uLi8uLi9zcmMvYXBwL2NvbXBvbmVudHMvdG9nZ2xlc3dpdGNoL3RvZ2dsZXN3aXRjaC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQUUsTUFBTSxlQUFlLENBQUM7OztBQU92RSxNQUFNLE9BQU8scUJBQXFCO0lBQ3JCLElBQUksR0FBdUIsSUFBSSxDQUFDO0lBQ2hDLE9BQU8sR0FBRyxLQUFLLENBQUM7SUFDaEIsUUFBUSxHQUFHLEtBQUssQ0FBQztJQUNqQixTQUFTLEdBQVcsZUFBZSxDQUFDO0lBQ25DLFFBQVEsR0FBRyxJQUFJLFlBQVksRUFBVyxDQUFDO0lBQ3hDLEtBQUssQ0FBcUI7SUFDMUIsTUFBTSxDQUFLO0lBRXBCLGFBQWEsQ0FBQyxLQUFZO1FBQ3RCLElBQUksQ0FBQyxPQUFPLEdBQUksS0FBSyxDQUFDLE1BQTJCLENBQUMsT0FBTyxDQUFDO1FBQzFELElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUNyQyxDQUFDO3VHQVpRLHFCQUFxQjsyRkFBckIscUJBQXFCLHlOQ1BsQyxtNERBZ0RBOzsyRkR6Q2EscUJBQXFCO2tCQUxqQyxTQUFTOytCQUNJLGtCQUFrQjs4QkFLbkIsSUFBSTtzQkFBWixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0ksUUFBUTtzQkFBakIsTUFBTTtnQkFDRSxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csTUFBTTtzQkFBZCxLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgT3V0cHV0LCBFdmVudEVtaXR0ZXIgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdjYXgtdG9nZ2xlc3dpdGNoJyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vdG9nZ2xlc3dpdGNoLmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL3RvZ2dsZXN3aXRjaC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgVG9nZ2xlU3dpdGNoQ29tcG9uZW50IHtcbiAgICBASW5wdXQoKSBzaXplOiAnc20nIHwgJ21kJyB8ICdsZycgPSAnbWQnO1xuICAgIEBJbnB1dCgpIGNoZWNrZWQgPSBmYWxzZTtcbiAgICBASW5wdXQoKSBkaXNhYmxlZCA9IGZhbHNlO1xuICAgIEBJbnB1dCgpIGljb25DbGFzczogc3RyaW5nID0gJ2NheCBjYXgtY2hlY2snO1xuICAgIEBPdXRwdXQoKSBvbkNoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4oKTtcbiAgICBASW5wdXQoKSBsYWJlbDogc3RyaW5nIHwgdW5kZWZpbmVkO1xuICAgIEBJbnB1dCgpIGV2ZW50czoge307XG5cbiAgICB0b2dnbGVDaGVja2VkKGV2ZW50OiBFdmVudCkge1xuICAgICAgICB0aGlzLmNoZWNrZWQgPSAoZXZlbnQudGFyZ2V0IGFzIEhUTUxJbnB1dEVsZW1lbnQpLmNoZWNrZWQ7XG4gICAgICAgIHRoaXMub25DaGFuZ2UuZW1pdCh0aGlzLmNoZWNrZWQpO1xuICAgIH1cbn1cbiIsIjxkaXZcclxuICBjbGFzcz1cImNheC10b2dnbGVzd2l0Y2gtY29udGFpbmVyXCJcclxuICBbbmdDbGFzc109XCJ7XHJcbiAgICAnY2F4LXRvZ2dsZXN3aXRjaC1jb250YWluZXItZGlzYWJsZWQnOiBkaXNhYmxlZCxcclxuICAgICdjYXgtdG9nZ2xlc3dpdGNoLXNpemUtc20nOiBzaXplID09PSAnc20nLFxyXG4gICAgJ2NheC10b2dnbGVzd2l0Y2gtc2l6ZS1tZCc6IHNpemUgPT09ICdtZCcsXHJcbiAgICAnY2F4LXRvZ2dsZXN3aXRjaC1zaXplLWxnJzogc2l6ZSA9PT0gJ2xnJ1xyXG4gIH1cIlxyXG4+XHJcbiAgPHNwYW4gY2xhc3M9XCJjYXgtdG9nZ2xlLWxhYmVsXCIgKm5nSWY9XCJsYWJlbFwiPnt7IGxhYmVsIH19PC9zcGFuPlxyXG4gIDxsYWJlbFxyXG4gICAgY2xhc3M9XCJjYXgtdG9nZ2xlc3dpdGNobWFpbmRpdlwiXHJcbiAgICBbbmdDbGFzc109XCJ7ICdjYXgtdG9nZ2xlc3dpdGNobWFpbmRpdi1kaXNhYmxlZCc6IGRpc2FibGVkIH1cIlxyXG4gID5cclxuICAgIDxpbnB1dFxyXG4gICAgICB0eXBlPVwiY2hlY2tib3hcIlxyXG4gICAgICBbY2hlY2tlZF09XCJjaGVja2VkXCJcclxuICAgICAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCJcclxuICAgICAgKGNoYW5nZSk9XCJ0b2dnbGVDaGVja2VkKCRldmVudClcIlxyXG4gICAgICBjbGFzcz1cImNheC10b2dnbGVzd2l0Y2hcIlxyXG4gICAgLz5cclxuICAgIDxkaXYgY2xhc3M9XCJjYXgtdG9nZ2xlc3dpdGNoLXRyYWNrXCI+PC9kaXY+XHJcbiAgICA8ZGl2XHJcbiAgICAgIGNsYXNzPVwiY2F4LXRvZ2dsZS10aHVtYlwiXHJcbiAgICAgIFtuZ0NsYXNzXT1cIntcclxuICAgICAgICAnY2F4LXRvZ2dsZS10aHVtYi1jaGVja2VkJzogY2hlY2tlZFxyXG4gICAgICB9XCJcclxuICAgID5cclxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImNoZWNrZWRcIj5cclxuICAgICAgICA8c3ZnXHJcbiAgICAgICAgICB3aWR0aD1cIjExXCJcclxuICAgICAgICAgIGhlaWdodD1cIjdcIlxyXG4gICAgICAgICAgdmlld0JveD1cIjAgMCAxMSA4XCJcclxuICAgICAgICAgIGZpbGw9XCJub25lXCJcclxuICAgICAgICAgIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIlxyXG4gICAgICAgICAgY2xhc3M9XCJjYXgtdG9nZ2xlLWljb24tYWN0aXZlXCJcclxuICAgICAgICA+XHJcbiAgICAgICAgICA8cGF0aFxyXG4gICAgICAgICAgICBkPVwiTTEwLjA5MTUgMC45NTE5NzJMMTAuMDg2NyAwLjk0NjA3NUwxMC4wODEzIDAuOTQwNTY4QzkuOTAwNzYgMC43NTM1NjQgOS42MTAzNCAwLjc1MzE0NiA5LjQyOTI3IDAuOTM5MzA5TDQuMTYyMDEgNi4yMjk2MkwxLjU4NTA3IDMuNjM0NjlDMS40MDQwMSAzLjQ0ODQxIDEuMTEzNTEgMy40NDg3OSAwLjkzMjg5MiAzLjYzNTg0QzAuNzU1NzAzIDMuODE5MzMgMC43NTU3MDMgNC4xMDg3NSAwLjkzMjg5MiA0LjI5MjI0TDAuOTMyODc4IDQuMjkyMjVMMC45MzQ4NTEgNC4yOTQyNEwzLjU4MDQ2IDYuOTU4MzJDMy43MzY3NiA3LjExOTU1IDMuOTQ5ODMgNy4yIDQuMTQ3MyA3LjJDNC4zNjE5NiA3LjIgNC41NTk2MyA3LjExNzczIDQuNzE0MDYgNi45NTg0TDEwLjA0NjggMS42MDIzNEMxMC4yNDM2IDEuNDE5OSAxMC4yNDIxIDEuMTMzOSAxMC4wOTE1IDAuOTUxOTcyWk00LjIzMjcgNi4zMDA4MUw0LjIzMTcgNi4yOTk4QzQuMjMyMDYgNi4zMDAxNSA0LjIzMjM3IDYuMzAwNDkgNC4yMzI2OSA2LjMwMDgyTDQuMjMyNyA2LjMwMDgxWlwiXHJcbiAgICAgICAgICAgIGZpbGw9XCIjMTY0NGU3XCJcclxuICAgICAgICAgICAgc3Ryb2tlPVwiIzE2NDRlN1wiXHJcbiAgICAgICAgICAgIHN0cm9rZS13aWR0aD1cIjAuNFwiXHJcbiAgICAgICAgICAvPlxyXG4gICAgICAgIDwvc3ZnPlxyXG4gICAgICA8L25nLWNvbnRhaW5lcj5cclxuICAgIDwvZGl2PlxyXG4gIDwvbGFiZWw+XHJcbjwvZGl2PlxyXG4iXX0=

package/fesm2022/cax-design-system-avatar.mjs

@@ -74,13 +74,13 @@ class Avatar {
         this.onImageError.emit(event);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: Avatar, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: Avatar, isStandalone: true, selector: "cax-avatar", inputs: { label: "label", icon: "icon", image: "image", avatarSize: "avatarSize", shape: "shape", style: "style", styleClass: "styleClass", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy" }, outputs: { onImageError: "onImageError" }, host: { classAttribute: "cax-element" }, ngImport: i0, template: "<div [ngClass]=\"containerClass()\" [class]=\"styleClass\" [ngStyle]=\"style\" [attr.aria-labelledby]=\"ariaLabelledBy\" [attr.aria-label]=\"ariaLabel\" [attr.data-pc-name]=\"'avatar'\">\r\n    <ng-content></ng-content>\r\n    <span class=\"cax-avatar-text\" *ngIf=\"label; else iconTemplate\">{{ label }}</span>\r\n    <ng-template #iconTemplate><span [class]=\"icon\" [ngClass]=\"'cax-avatar-icon'\" *ngIf=\"icon; else imageTemplate\"></span></ng-template>\r\n    <ng-template #imageTemplate><img [src]=\"image\" *ngIf=\"image\" (error)=\"imageError($event)\" [attr.aria-label]=\"ariaLabel\" /></ng-template>\r\n</div>\r\n", styles: ["@layer cax{.cax-avatar{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;font-size:14px;line-height:20px;font-weight:700}.cax-avatar.cax-avatar-image{background-color:transparent}.cax-avatar.cax-avatar-circle{border-radius:50%}.cax-avatar .cax-avatar-icon{font-size:14px}.cax-avatar img{width:100%;height:100%;border-radius:8px}.cax-avatar.cax-avatar-circle img{border-radius:50%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: Avatar, isStandalone: true, selector: "cax-avatar", inputs: { label: "label", icon: "icon", image: "image", avatarSize: "avatarSize", shape: "shape", style: "style", styleClass: "styleClass", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy" }, outputs: { onImageError: "onImageError" }, host: { classAttribute: "cax-element" }, ngImport: i0, template: "<div [ngClass]=\"containerClass()\" [class]=\"styleClass\" [ngStyle]=\"style\" [attr.aria-labelledby]=\"ariaLabelledBy\" [attr.aria-label]=\"ariaLabel\" [attr.data-pc-name]=\"'avatar'\">\r\n    <ng-content></ng-content>\r\n    <span class=\"cax-avatar-text\" *ngIf=\"label; else iconTemplate\">{{ label }}</span>\r\n    <ng-template #iconTemplate><span [class]=\"icon\" [ngClass]=\"'cax-avatar-icon'\" *ngIf=\"icon; else imageTemplate\"></span></ng-template>\r\n    <ng-template #imageTemplate><img [src]=\"image\" *ngIf=\"image\" (error)=\"imageError($event)\" [attr.aria-label]=\"ariaLabel\" /></ng-template>\r\n</div>\r\n", styles: ["@layer cax{.cax-avatar{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;font-size:14px;line-height:20px;font-weight:700}.cax-avatar.cax-avatar-image{background-color:transparent}.cax-avatar.cax-avatar-circle{border-radius:50%!important}.cax-avatar .cax-avatar-icon{font-size:14px}.cax-avatar img{width:100%;height:100%;border-radius:8px}.cax-avatar.cax-avatar-circle img{border-radius:50%!important}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: Avatar, decorators: [{
             type: Component,
             args: [{ selector: 'cax-avatar', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [CommonModule], host: {
                         class: 'cax-element'
-                    }, template: "<div [ngClass]=\"containerClass()\" [class]=\"styleClass\" [ngStyle]=\"style\" [attr.aria-labelledby]=\"ariaLabelledBy\" [attr.aria-label]=\"ariaLabel\" [attr.data-pc-name]=\"'avatar'\">\r\n    <ng-content></ng-content>\r\n    <span class=\"cax-avatar-text\" *ngIf=\"label; else iconTemplate\">{{ label }}</span>\r\n    <ng-template #iconTemplate><span [class]=\"icon\" [ngClass]=\"'cax-avatar-icon'\" *ngIf=\"icon; else imageTemplate\"></span></ng-template>\r\n    <ng-template #imageTemplate><img [src]=\"image\" *ngIf=\"image\" (error)=\"imageError($event)\" [attr.aria-label]=\"ariaLabel\" /></ng-template>\r\n</div>\r\n", styles: ["@layer cax{.cax-avatar{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;font-size:14px;line-height:20px;font-weight:700}.cax-avatar.cax-avatar-image{background-color:transparent}.cax-avatar.cax-avatar-circle{border-radius:50%}.cax-avatar .cax-avatar-icon{font-size:14px}.cax-avatar img{width:100%;height:100%;border-radius:8px}.cax-avatar.cax-avatar-circle img{border-radius:50%}}\n"] }]
+                    }, template: "<div [ngClass]=\"containerClass()\" [class]=\"styleClass\" [ngStyle]=\"style\" [attr.aria-labelledby]=\"ariaLabelledBy\" [attr.aria-label]=\"ariaLabel\" [attr.data-pc-name]=\"'avatar'\">\r\n    <ng-content></ng-content>\r\n    <span class=\"cax-avatar-text\" *ngIf=\"label; else iconTemplate\">{{ label }}</span>\r\n    <ng-template #iconTemplate><span [class]=\"icon\" [ngClass]=\"'cax-avatar-icon'\" *ngIf=\"icon; else imageTemplate\"></span></ng-template>\r\n    <ng-template #imageTemplate><img [src]=\"image\" *ngIf=\"image\" (error)=\"imageError($event)\" [attr.aria-label]=\"ariaLabel\" /></ng-template>\r\n</div>\r\n", styles: ["@layer cax{.cax-avatar{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;font-size:14px;line-height:20px;font-weight:700}.cax-avatar.cax-avatar-image{background-color:transparent}.cax-avatar.cax-avatar-circle{border-radius:50%!important}.cax-avatar .cax-avatar-icon{font-size:14px}.cax-avatar img{width:100%;height:100%;border-radius:8px}.cax-avatar.cax-avatar-circle img{border-radius:50%!important}}\n"] }]
         }], propDecorators: { label: [{
                 type: Input
             }], icon: [{

package/fesm2022/cax-design-system-avatar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cax-design-system-avatar.mjs","sources":["../../src/app/components/avatar/avatar.ts","../../src/app/components/avatar/avatar.html","../../src/app/components/avatar/avatar.module.ts","../../src/app/components/avatar/cax-design-system-avatar.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core';\n/**\n * Avatar represents people using icons, labels and images.\n * @group Components\n */\n@Component({\n    selector: 'cax-avatar',\n    templateUrl: './avatar.html',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./avatar.scss'],\n    standalone: true,\n    imports: [CommonModule],\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class Avatar {\n    /**\n     * Defines the text to display.\n     * @group Props\n     */\n    @Input() label: string | undefined;\n    /**\n     * Defines the icon to display.\n     * @group Props\n     */\n    @Input() icon: string | undefined;\n    /**\n     * Defines the image to display.\n     * @group Props\n     */\n    @Input() image: string | undefined;\n    /**\n     * Size of the element.\n     * @group Props\n     */\n    @Input() avatarSize: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | undefined = 'md';\n    /**\n     * Shape of the element.\n     * @group Props\n     */\n    @Input() shape: 'square' | 'circle' | undefined = 'square';\n    /**\n     * Inline style of the element.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * Class of the element.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Establishes a string value that labels the component.\n     * @group Props\n     */\n    @Input() ariaLabel: string | undefined;\n    /**\n     * Establishes relationships between the component and label(s) where its value should be one or more element IDs.\n     * @group Props\n     */\n    @Input() ariaLabelledBy: string | undefined;\n    /**\n     * This event is triggered if an error occurs while loading an image file.\n     * @param {Event} event - Browser event.\n     * @group Emits\n     */\n    @Output() onImageError: EventEmitter<Event> = new EventEmitter<Event>();\n\n    containerClass() {\n        return {\n            'cax-avatar cax-component': true,\n            'cax-avatar-image': this.image != null,\n            'cax-avatar-circle': this.shape === 'circle',\n            'cax-avatar-xs': this.avatarSize === 'xs',\n            'cax-avatar-sm': this.avatarSize === 'sm',\n            'cax-avatar-lg': this.avatarSize === 'lg',\n            'cax-avatar-xl': this.avatarSize === 'xl'\n        };\n    }\n\n    imageError(event: Event) {\n        this.onImageError.emit(event);\n    }\n}\n","<div [ngClass]=\"containerClass()\" [class]=\"styleClass\" [ngStyle]=\"style\" [attr.aria-labelledby]=\"ariaLabelledBy\" [attr.aria-label]=\"ariaLabel\" [attr.data-pc-name]=\"'avatar'\">\r\n    <ng-content></ng-content>\r\n    <span class=\"cax-avatar-text\" *ngIf=\"label; else iconTemplate\">{{ label }}</span>\r\n    <ng-template #iconTemplate><span [class]=\"icon\" [ngClass]=\"'cax-avatar-icon'\" *ngIf=\"icon; else imageTemplate\"></span></ng-template>\r\n    <ng-template #imageTemplate><img [src]=\"image\" *ngIf=\"image\" (error)=\"imageError($event)\" [attr.aria-label]=\"ariaLabel\" /></ng-template>\r\n</div>\r\n","import { NgModule } from '@angular/core';\nimport { Avatar } from './avatar';\n\n@NgModule({\n    imports: [Avatar],\n    exports: [Avatar]\n})\nexport class AvatarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"cax-design-system-avatar.mjs","sources":["../../src/app/components/avatar/avatar.ts","../../src/app/components/avatar/avatar.html","../../src/app/components/avatar/avatar.module.ts","../../src/app/components/avatar/cax-design-system-avatar.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core';\n/**\n * Avatar represents people using icons, labels and images.\n * @group Components\n */\n@Component({\n    selector: 'cax-avatar',\n    templateUrl: './avatar.html',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./avatar.scss'],\n    standalone: true,\n    imports: [CommonModule],\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class Avatar {\n    /**\n     * Defines the text to display.\n     * @group Props\n     */\n    @Input() label: string | undefined;\n    /**\n     * Defines the icon to display.\n     * @group Props\n     */\n    @Input() icon: string | undefined;\n    /**\n     * Defines the image to display.\n     * @group Props\n     */\n    @Input() image: string | undefined;\n    /**\n     * Size of the element.\n     * @group Props\n     */\n    @Input() avatarSize: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | undefined = 'md';\n    /**\n     * Shape of the element.\n     * @group Props\n     */\n    @Input() shape: 'square' | 'circle' | undefined = 'square';\n    /**\n     * Inline style of the element.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * Class of the element.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Establishes a string value that labels the component.\n     * @group Props\n     */\n    @Input() ariaLabel: string | undefined;\n    /**\n     * Establishes relationships between the component and label(s) where its value should be one or more element IDs.\n     * @group Props\n     */\n    @Input() ariaLabelledBy: string | undefined;\n    /**\n     * This event is triggered if an error occurs while loading an image file.\n     * @param {Event} event - Browser event.\n     * @group Emits\n     */\n    @Output() onImageError: EventEmitter<Event> = new EventEmitter<Event>();\n\n    containerClass() {\n        return {\n            'cax-avatar cax-component': true,\n            'cax-avatar-image': this.image != null,\n            'cax-avatar-circle': this.shape === 'circle',\n            'cax-avatar-xs': this.avatarSize === 'xs',\n            'cax-avatar-sm': this.avatarSize === 'sm',\n            'cax-avatar-lg': this.avatarSize === 'lg',\n            'cax-avatar-xl': this.avatarSize === 'xl'\n        };\n    }\n\n    imageError(event: Event) {\n        this.onImageError.emit(event);\n    }\n}\n","<div [ngClass]=\"containerClass()\" [class]=\"styleClass\" [ngStyle]=\"style\" [attr.aria-labelledby]=\"ariaLabelledBy\" [attr.aria-label]=\"ariaLabel\" [attr.data-pc-name]=\"'avatar'\">\r\n    <ng-content></ng-content>\r\n    <span class=\"cax-avatar-text\" *ngIf=\"label; else iconTemplate\">{{ label }}</span>\r\n    <ng-template #iconTemplate><span [class]=\"icon\" [ngClass]=\"'cax-avatar-icon'\" *ngIf=\"icon; else imageTemplate\"></span></ng-template>\r\n    <ng-template #imageTemplate><img [src]=\"image\" *ngIf=\"image\" (error)=\"imageError($event)\" [attr.aria-label]=\"ariaLabel\" /></ng-template>\r\n</div>\r\n","import { NgModule } from '@angular/core';\nimport { Avatar } from './avatar';\n\n@NgModule({\n    imports: [Avatar],\n    exports: [Avatar]\n})\nexport class AvatarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;AAEA;;;AAGG;MAaU,MAAM,CAAA;AACf;;;AAGG;AACM,IAAA,KAAK,CAAqB;AACnC;;;AAGG;AACM,IAAA,IAAI,CAAqB;AAClC;;;AAGG;AACM,IAAA,KAAK,CAAqB;AACnC;;;AAGG;IACM,UAAU,GAAiD,IAAI,CAAC;AACzE;;;AAGG;IACM,KAAK,GAAoC,QAAQ,CAAC;AAC3D;;;AAGG;AACM,IAAA,KAAK,CAA8C;AAC5D;;;AAGG;AACM,IAAA,UAAU,CAAqB;AACxC;;;AAGG;AACM,IAAA,SAAS,CAAqB;AACvC;;;AAGG;AACM,IAAA,cAAc,CAAqB;AAC5C;;;;AAIG;AACO,IAAA,YAAY,GAAwB,IAAI,YAAY,EAAS,CAAC;IAExE,cAAc,GAAA;QACV,OAAO;AACH,YAAA,0BAA0B,EAAE,IAAI;AAChC,YAAA,kBAAkB,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI;AACtC,YAAA,mBAAmB,EAAE,IAAI,CAAC,KAAK,KAAK,QAAQ;AAC5C,YAAA,eAAe,EAAE,IAAI,CAAC,UAAU,KAAK,IAAI;AACzC,YAAA,eAAe,EAAE,IAAI,CAAC,UAAU,KAAK,IAAI;AACzC,YAAA,eAAe,EAAE,IAAI,CAAC,UAAU,KAAK,IAAI;AACzC,YAAA,eAAe,EAAE,IAAI,CAAC,UAAU,KAAK,IAAI;SAC5C,CAAC;KACL;AAED,IAAA,UAAU,CAAC,KAAY,EAAA;AACnB,QAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KACjC;uGAnEQ,MAAM,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;2FAAN,MAAM,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,IAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,UAAA,EAAA,YAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,OAAA,EAAA,UAAA,EAAA,YAAA,EAAA,SAAA,EAAA,WAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,EAAA,OAAA,EAAA,EAAA,YAAA,EAAA,cAAA,EAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,aAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EClBnB,knBAMA,EAAA,MAAA,EAAA,CAAA,wbAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDOc,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAKb,MAAM,EAAA,UAAA,EAAA,CAAA;kBAZlB,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,YAAY,EAEL,eAAA,EAAA,uBAAuB,CAAC,MAAM,iBAChC,iBAAiB,CAAC,IAAI,EAAA,UAAA,EAEzB,IAAI,EAAA,OAAA,EACP,CAAC,YAAY,CAAC,EACjB,IAAA,EAAA;AACF,wBAAA,KAAK,EAAE,aAAa;AACvB,qBAAA,EAAA,QAAA,EAAA,knBAAA,EAAA,MAAA,EAAA,CAAA,wbAAA,CAAA,EAAA,CAAA;8BAOQ,KAAK,EAAA,CAAA;sBAAb,KAAK;gBAKG,IAAI,EAAA,CAAA;sBAAZ,KAAK;gBAKG,KAAK,EAAA,CAAA;sBAAb,KAAK;gBAKG,UAAU,EAAA,CAAA;sBAAlB,KAAK;gBAKG,KAAK,EAAA,CAAA;sBAAb,KAAK;gBAKG,KAAK,EAAA,CAAA;sBAAb,KAAK;gBAKG,UAAU,EAAA,CAAA;sBAAlB,KAAK;gBAKG,SAAS,EAAA,CAAA;sBAAjB,KAAK;gBAKG,cAAc,EAAA,CAAA;sBAAtB,KAAK;gBAMI,YAAY,EAAA,CAAA;sBAArB,MAAM;;;ME9DE,YAAY,CAAA;uGAAZ,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;wGAAZ,YAAY,EAAA,OAAA,EAAA,CAHX,MAAM,CAAA,EAAA,OAAA,EAAA,CACN,MAAM,CAAA,EAAA,CAAA,CAAA;AAEP,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,YAAY,YAHX,MAAM,CAAA,EAAA,CAAA,CAAA;;2FAGP,YAAY,EAAA,UAAA,EAAA,CAAA;kBAJxB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACN,OAAO,EAAE,CAAC,MAAM,CAAC;oBACjB,OAAO,EAAE,CAAC,MAAM,CAAC;AACpB,iBAAA,CAAA;;;ACND;;AAEG;;;;"}

package/fesm2022/cax-design-system-avatargroup.mjs

@@ -2,6 +2,7 @@ import * as i0 from '@angular/core';
 import { Component, ChangeDetectionStrategy, ViewEncapsulation, Input, NgModule } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
+import { AvatarModule } from 'cax-design-system/avatar';
 
 /**
  * AvatarGroup is a helper component for Avatar.
@@ -19,36 +20,29 @@ class AvatarGroup {
      */
     style;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: AvatarGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: AvatarGroup, selector: "p-avatarGroup", inputs: { styleClass: "styleClass", style: "style" }, host: { classAttribute: "cax-element" }, ngImport: i0, template: `
-        <div [ngClass]="'p-avatar-group p-component'" [class]="styleClass" [ngStyle]="style">
-            <ng-content></ng-content>
-        </div>
-    `, isInline: true, styles: ["@layer cax{.p-avatar-group p-avatar+p-avatar{margin-left:-1rem}.p-avatar-group{display:flex;align-items:center}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: AvatarGroup, selector: "cax-avatarGroup", inputs: { styleClass: "styleClass", style: "style" }, host: { classAttribute: "cax-element" }, ngImport: i0, template: "<div [ngClass]=\"'cax-avatar-group cax-component'\" [class]=\"styleClass\" [ngStyle]=\"style\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: ["@layer cax{.cax-avatar-group cax-avatar+cax-avatar{margin-left:-1rem}.cax-avatar-group{display:flex;align-items:center}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: AvatarGroup, decorators: [{
             type: Component,
-            args: [{ selector: 'p-avatarGroup', template: `
-        <div [ngClass]="'p-avatar-group p-component'" [class]="styleClass" [ngStyle]="style">
-            <ng-content></ng-content>
-        </div>
-    `, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+            args: [{ selector: 'cax-avatarGroup', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'cax-element'
-                    }, styles: ["@layer cax{.p-avatar-group p-avatar+p-avatar{margin-left:-1rem}.p-avatar-group{display:flex;align-items:center}}\n"] }]
+                    }, template: "<div [ngClass]=\"'cax-avatar-group cax-component'\" [class]=\"styleClass\" [ngStyle]=\"style\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: ["@layer cax{.cax-avatar-group cax-avatar+cax-avatar{margin-left:-1rem}.cax-avatar-group{display:flex;align-items:center}}\n"] }]
         }], propDecorators: { styleClass: [{
                 type: Input
             }], style: [{
                 type: Input
             }] } });
+
 class AvatarGroupModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: AvatarGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.9", ngImport: i0, type: AvatarGroupModule, declarations: [AvatarGroup], imports: [CommonModule], exports: [AvatarGroup] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: AvatarGroupModule, imports: [CommonModule] });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.9", ngImport: i0, type: AvatarGroupModule, declarations: [AvatarGroup], imports: [CommonModule, AvatarModule], exports: [AvatarGroup, AvatarModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: AvatarGroupModule, imports: [CommonModule, AvatarModule, AvatarModule] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: AvatarGroupModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [CommonModule],
-                    exports: [AvatarGroup],
+                    imports: [CommonModule, AvatarModule],
+                    exports: [AvatarGroup, AvatarModule],
                     declarations: [AvatarGroup]
                 }]
         }] });

package/fesm2022/cax-design-system-avatargroup.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cax-design-system-avatargroup.mjs","sources":["../../src/app/components/avatargroup/avatargroup.ts","../../src/app/components/avatargroup/cax-design-system-avatargroup.ts"],"sourcesContent":["import { NgModule, Component, ChangeDetectionStrategy, ViewEncapsulation, Input } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n/**\n * AvatarGroup is a helper component for Avatar.\n * @group Components\n */\n@Component({\n    selector: 'p-avatarGroup',\n    template: `\n        <div [ngClass]=\"'p-avatar-group p-component'\" [class]=\"styleClass\" [ngStyle]=\"style\">\n            <ng-content></ng-content>\n        </div>\n    `,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./avatargroup.css'],\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class AvatarGroup {\n    /**\n     * Style class of the component\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Inline style of the component.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n}\n\n@NgModule({\n    imports: [CommonModule],\n    exports: [AvatarGroup],\n    declarations: [AvatarGroup]\n})\nexport class AvatarGroupModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;AAEA;;;AAGG;MAeU,WAAW,CAAA;AACpB;;;AAGG;AACM,IAAA,UAAU,CAAqB;AACxC;;;AAGG;AACM,IAAA,KAAK,CAA8C;uGAVnD,WAAW,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAX,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,WAAW,EAZV,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,EAAA,UAAA,EAAA,YAAA,EAAA,KAAA,EAAA,OAAA,EAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,aAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;;;AAIT,IAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,oHAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAQQ,WAAW,EAAA,UAAA,EAAA,CAAA;kBAdvB,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,eAAe,EACf,QAAA,EAAA,CAAA;;;;AAIT,IAAA,CAAA,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,iBAChC,iBAAiB,CAAC,IAAI,EAE/B,IAAA,EAAA;AACF,wBAAA,KAAK,EAAE,aAAa;AACvB,qBAAA,EAAA,MAAA,EAAA,CAAA,oHAAA,CAAA,EAAA,CAAA;8BAOQ,UAAU,EAAA,CAAA;sBAAlB,KAAK;gBAKG,KAAK,EAAA,CAAA;sBAAb,KAAK;;MAQG,iBAAiB,CAAA;uGAAjB,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAjB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,iBAAiB,EAlBjB,YAAA,EAAA,CAAA,WAAW,CAcV,EAAA,OAAA,EAAA,CAAA,YAAY,aAdb,WAAW,CAAA,EAAA,CAAA,CAAA;AAkBX,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,iBAAiB,YAJhB,YAAY,CAAA,EAAA,CAAA,CAAA;;2FAIb,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAL7B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACN,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,WAAW,CAAC;oBACtB,YAAY,EAAE,CAAC,WAAW,CAAC;AAC9B,iBAAA,CAAA;;;ACrCD;;AAEG;;;;"}
+{"version":3,"file":"cax-design-system-avatargroup.mjs","sources":["../../src/app/components/avatargroup/avatargroup.ts","../../src/app/components/avatargroup/avatargroup.html","../../src/app/components/avatargroup/avatargroup.module.ts","../../src/app/components/avatargroup/cax-design-system-avatargroup.ts"],"sourcesContent":["import { Component, ChangeDetectionStrategy, ViewEncapsulation, Input } from '@angular/core';\n/**\n * AvatarGroup is a helper component for Avatar.\n * @group Components\n */\n@Component({\n    selector: 'cax-avatarGroup',\n    templateUrl: './avatargroup.html',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./avatargroup.scss'],\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class AvatarGroup {\n    /**\n     * Style class of the component\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Inline style of the component.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n}\n","<div [ngClass]=\"'cax-avatar-group cax-component'\" [class]=\"styleClass\" [ngStyle]=\"style\">\r\n  <ng-content></ng-content>\r\n</div>\r\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { AvatarGroup } from './avatargroup';\nimport { AvatarModule } from 'cax-design-system/avatar';\n\n@NgModule({\n    imports: [CommonModule, AvatarModule],\n    exports: [AvatarGroup, AvatarModule],\n    declarations: [AvatarGroup]\n})\nexport class AvatarGroupModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;AACA;;;AAGG;MAWU,WAAW,CAAA;AACpB;;;AAGG;AACM,IAAA,UAAU,CAAqB;AACxC;;;AAGG;AACM,IAAA,KAAK,CAA8C;uGAVnD,WAAW,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAX,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,WAAW,sJCfxB,8IAGA,EAAA,MAAA,EAAA,CAAA,4HAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FDYa,WAAW,EAAA,UAAA,EAAA,CAAA;kBAVvB,SAAS;+BACI,iBAAiB,EAAA,eAAA,EAEV,uBAAuB,CAAC,MAAM,iBAChC,iBAAiB,CAAC,IAAI,EAE/B,IAAA,EAAA;AACF,wBAAA,KAAK,EAAE,aAAa;AACvB,qBAAA,EAAA,QAAA,EAAA,8IAAA,EAAA,MAAA,EAAA,CAAA,4HAAA,CAAA,EAAA,CAAA;8BAOQ,UAAU,EAAA,CAAA;sBAAlB,KAAK;gBAKG,KAAK,EAAA,CAAA;sBAAb,KAAK;;;MEfG,iBAAiB,CAAA;uGAAjB,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;wGAAjB,iBAAiB,EAAA,YAAA,EAAA,CAFX,WAAW,CAFhB,EAAA,OAAA,EAAA,CAAA,YAAY,EAAE,YAAY,CAAA,EAAA,OAAA,EAAA,CAC1B,WAAW,EAAE,YAAY,CAAA,EAAA,CAAA,CAAA;AAG1B,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,iBAAiB,EAJhB,OAAA,EAAA,CAAA,YAAY,EAAE,YAAY,EACb,YAAY,CAAA,EAAA,CAAA,CAAA;;2FAG1B,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAL7B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,YAAY,CAAC;AACrC,oBAAA,OAAO,EAAE,CAAC,WAAW,EAAE,YAAY,CAAC;oBACpC,YAAY,EAAE,CAAC,WAAW,CAAC;AAC9B,iBAAA,CAAA;;;ACTD;;AAEG;;;;"}

package/fesm2022/cax-design-system-badge.mjs

@@ -25,7 +25,7 @@ class Badge {
         return {
             'cax-badge cax-component': true,
             'cax-badge-no-gutter': this.value != undefined && String(this.value).length === 1,
-            [`cax-badge-${this.size}`]: this.size,
+            [`cax-badge-${this.badgeSize}`]: this.badgeSize,
             [`cax-badge-${this.severity}`]: this.severity
         };
     }

package/fesm2022/cax-design-system-badge.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cax-design-system-badge.mjs","sources":["../../src/app/components/badge/badge.ts","../../src/app/components/badge/badge.html","../../src/app/components/badge/badge.directive.ts","../../src/app/components/badge/badge.module.ts","../../src/app/components/badge/cax-design-system-badge.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Input, ViewEncapsulation } from '@angular/core';\n\n@Component({\n    selector: 'cax-badge',\n    templateUrl: './badge.html',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./badge.scss'],\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class Badge {\n    @Input() styleClass: string | undefined;\n    @Input() style: { [klass: string]: any } | null | undefined;\n    @Input() badgeSize: 'xs' | 'sm' | 'md' | 'lg' = 'md';\n    @Input() severity: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger' = 'primary';\n    @Input() value: string | number | null | undefined;\n    @Input() badgeDisabled: boolean = false;\n\n    @Input() public set size(value: 'xs' | 'sm' | 'md' | 'lg') {\n        this._size = value;\n        console.warn('size property is deprecated and will removed in v18, use badgeSize instead.');\n    }\n    get size() {\n        return this._size;\n    }\n    private _size: 'xs' | 'sm' | 'md' | 'lg' = 'md';\n\n    containerClass() {\n        return {\n            'cax-badge cax-component': true,\n            'cax-badge-no-gutter': this.value != undefined && String(this.value).length === 1,\n            [`cax-badge-${this.size}`]: this.size,\n            [`cax-badge-${this.severity}`]: this.severity\n        };\n    }\n}\n","<span\r\n  *ngIf=\"!badgeDisabled\"\r\n  [ngClass]=\"containerClass()\"\r\n  [class]=\"styleClass\"\r\n  [ngStyle]=\"style\"\r\n>\r\n  {{ value }}\r\n</span>\r\n","import { AfterViewInit, Directive, ElementRef, Inject, Input, OnChanges, Renderer2, SimpleChanges } from '@angular/core';\nimport { DOCUMENT } from '@angular/common';\nimport { DomHandler } from 'cax-design-system/dom';\nimport { UniqueComponentId } from 'cax-design-system/utils';\n\n@Directive({\n    selector: '[caxBadge]',\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class BadgeDirective implements OnChanges, AfterViewInit {\n    @Input('badgeDisabled') public disabled: boolean;\n    @Input() public badgeSize: 'xs' | 'sm' | 'md' | 'lg' | undefined;\n    @Input() public set size(value: 'xs' | 'sm' | 'md' | 'lg') {\n        this._size = value;\n        console.warn('size property is deprecated and will removed in v18, use badgeSize instead.');\n    }\n    get size() {\n        return this._size;\n    }\n    private _size: 'xs' | 'sm' | 'md' | 'lg' | undefined;\n    @Input() public severity: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger' = 'primary';\n    @Input() public value: string | number;\n    @Input() badgeStyle: { [klass: string]: any } | null | undefined;\n    @Input() badgeStyleClass: string;\n\n    private id!: string;\n    badgeEl: HTMLElement;\n\n    private get activeElement(): HTMLElement {\n        return this.el.nativeElement.nodeName.indexOf('-') !== -1 ? this.el.nativeElement.firstChild : this.el.nativeElement;\n    }\n\n    private get canUpdateBadge(): boolean {\n        return this.id && !this.disabled;\n    }\n\n    constructor(\n        @Inject(DOCUMENT) private document: Document,\n        public el: ElementRef,\n        private renderer: Renderer2\n    ) {}\n\n    public ngOnChanges(changes: SimpleChanges): void {\n        if (changes.disabled || changes.badgeDisabled) {\n            this.toggleDisableState();\n        }\n        if (!this.canUpdateBadge) {\n            return;\n        }\n        if (changes.severity) {\n            this.setSeverity(changes.severity.previousValue);\n        }\n        if (changes.size || changes.badgeSize) {\n            this.setSizeClasses();\n        }\n        if (changes.value) {\n            this.setValue();\n        }\n        if (changes.badgeStyle || changes.badgeStyleClass) {\n            this.applyStyles();\n        }\n    }\n\n    public ngAfterViewInit(): void {\n        this.id = UniqueComponentId() + '_badge';\n        this.renderBadgeContent();\n    }\n\n    private setValue(element?: HTMLElement): void {\n        const badge = element ?? this.document.getElementById(this.id);\n\n        if (!badge) {\n            return;\n        }\n\n        if (this.value != null) {\n            if (DomHandler.hasClass(badge, 'cax-badge-dot')) {\n                DomHandler.removeClass(badge, 'cax-badge-dot');\n            }\n\n            if (this.value && String(this.value).length === 1) {\n                DomHandler.addClass(badge, 'cax-badge-no-gutter');\n            } else {\n                DomHandler.removeClass(badge, 'cax-badge-no-gutter');\n            }\n        } else {\n            if (!DomHandler.hasClass(badge, 'cax-badge-dot')) {\n                DomHandler.addClass(badge, 'cax-badge-dot');\n            }\n\n            DomHandler.removeClass(badge, 'cax-badge-no-gutter');\n        }\n\n        badge.innerHTML = '';\n        const badgeValue = this.value != null ? String(this.value) : '';\n        this.renderer.appendChild(badge, this.document.createTextNode(badgeValue));\n    }\n\n    private setSizeClasses(element?: HTMLElement): void {\n        const badge = element ?? this.document.getElementById(this.id);\n\n        if (!badge) {\n            return;\n        }\n        // Remove any existing size classes\n        ['xs', 'sm', 'md', 'lg'].forEach((s) => DomHandler.removeClass(badge, `cax-badge-${s}`));\n        const sizeToUse = this.badgeSize || this.size;\n        if (sizeToUse) {\n            DomHandler.addClass(badge, `cax-badge-${sizeToUse}`);\n        }\n    }\n\n    private renderBadgeContent(): void {\n        if (this.disabled) {\n            return;\n        }\n\n        const el = this.activeElement;\n        const badge = this.document.createElement('span');\n        badge.id = this.id;\n        badge.className = 'cax-badge cax-component';\n\n        this.setSeverity(null, badge);\n        this.setSizeClasses(badge);\n        this.setValue(badge);\n        DomHandler.addClass(el, 'cax-overlay-badge');\n        this.renderer.appendChild(el, badge);\n        this.badgeEl = badge;\n        this.applyStyles();\n    }\n\n    private applyStyles(): void {\n        if (this.badgeEl && this.badgeStyle && typeof this.badgeStyle === 'object') {\n            for (const [key, value] of Object.entries(this.badgeStyle)) {\n                this.renderer.setStyle(this.badgeEl, key, value);\n            }\n        }\n        if (this.badgeEl && this.badgeStyleClass) {\n            this.badgeEl.classList.add(...this.badgeStyleClass.split(' '));\n        }\n    }\n\n    private setSeverity(oldSeverity?: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger', element?: HTMLElement): void {\n        const badge = element ?? this.document.getElementById(this.id);\n\n        if (!badge) {\n            return;\n        }\n\n        if (this.severity) {\n            DomHandler.addClass(badge, `cax-badge-${this.severity}`);\n        }\n\n        if (oldSeverity) {\n            DomHandler.removeClass(badge, `cax-badge-${oldSeverity}`);\n        }\n    }\n\n    private toggleDisableState(): void {\n        if (!this.id) {\n            return;\n        }\n\n        if (this.disabled) {\n            const badge = this.activeElement?.querySelector(`#${this.id}`);\n\n            if (badge) {\n                this.renderer.removeChild(this.activeElement, badge);\n            }\n        } else {\n            this.renderBadgeContent();\n        }\n    }\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { Badge } from './badge';\nimport { BadgeDirective } from './badge.directive';\nimport { SharedModule } from 'cax-design-system/api';\n\n@NgModule({\n    imports: [CommonModule, SharedModule],\n    exports: [Badge, BadgeDirective],\n    declarations: [Badge, BadgeDirective]\n})\nexport class BadgeModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;;;MAYa,KAAK,CAAA;AACL,IAAA,UAAU,CAAqB;AAC/B,IAAA,KAAK,CAA8C;IACnD,SAAS,GAA8B,IAAI,CAAC;IAC5C,QAAQ,GAAwE,SAAS,CAAC;AAC1F,IAAA,KAAK,CAAqC;IAC1C,aAAa,GAAY,KAAK,CAAC;IAExC,IAAoB,IAAI,CAAC,KAAgC,EAAA;AACrD,QAAA,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;AACnB,QAAA,OAAO,CAAC,IAAI,CAAC,6EAA6E,CAAC,CAAC;KAC/F;AACD,IAAA,IAAI,IAAI,GAAA;QACJ,OAAO,IAAI,CAAC,KAAK,CAAC;KACrB;IACO,KAAK,GAA8B,IAAI,CAAC;IAEhD,cAAc,GAAA;QACV,OAAO;AACH,YAAA,yBAAyB,EAAE,IAAI;AAC/B,YAAA,qBAAqB,EAAE,IAAI,CAAC,KAAK,IAAI,SAAS,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC;YACjF,CAAC,CAAA,UAAA,EAAa,IAAI,CAAC,IAAI,EAAE,GAAG,IAAI,CAAC,IAAI;YACrC,CAAC,CAAA,UAAA,EAAa,IAAI,CAAC,QAAQ,EAAE,GAAG,IAAI,CAAC,QAAQ;SAChD,CAAC;KACL;uGAxBQ,KAAK,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAL,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAK,4PCZlB,mKAQA,EAAA,MAAA,EAAA,CAAA,4YAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FDIa,KAAK,EAAA,UAAA,EAAA,CAAA;kBAVjB,SAAS;+BACI,WAAW,EAAA,eAAA,EAEJ,uBAAuB,CAAC,MAAM,iBAChC,iBAAiB,CAAC,IAAI,EAE/B,IAAA,EAAA;AACF,wBAAA,KAAK,EAAE,aAAa;AACvB,qBAAA,EAAA,QAAA,EAAA,mKAAA,EAAA,MAAA,EAAA,CAAA,4YAAA,CAAA,EAAA,CAAA;8BAGQ,UAAU,EAAA,CAAA;sBAAlB,KAAK;gBACG,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,SAAS,EAAA,CAAA;sBAAjB,KAAK;gBACG,QAAQ,EAAA,CAAA;sBAAhB,KAAK;gBACG,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,aAAa,EAAA,CAAA;sBAArB,KAAK;gBAEc,IAAI,EAAA,CAAA;sBAAvB,KAAK;;;METG,cAAc,CAAA;AA4BO,IAAA,QAAA,CAAA;AACnB,IAAA,EAAA,CAAA;AACC,IAAA,QAAA,CAAA;AA7BmB,IAAA,QAAQ,CAAU;AACjC,IAAA,SAAS,CAAwC;IACjE,IAAoB,IAAI,CAAC,KAAgC,EAAA;AACrD,QAAA,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;AACnB,QAAA,OAAO,CAAC,IAAI,CAAC,6EAA6E,CAAC,CAAC;KAC/F;AACD,IAAA,IAAI,IAAI,GAAA;QACJ,OAAO,IAAI,CAAC,KAAK,CAAC;KACrB;AACO,IAAA,KAAK,CAAwC;IACrC,QAAQ,GAAwE,SAAS,CAAC;AAC1F,IAAA,KAAK,CAAkB;AAC9B,IAAA,UAAU,CAA8C;AACxD,IAAA,eAAe,CAAS;AAEzB,IAAA,EAAE,CAAU;AACpB,IAAA,OAAO,CAAc;AAErB,IAAA,IAAY,aAAa,GAAA;AACrB,QAAA,OAAO,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,UAAU,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;KACxH;AAED,IAAA,IAAY,cAAc,GAAA;QACtB,OAAO,IAAI,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;KACpC;AAED,IAAA,WAAA,CAC8B,QAAkB,EACrC,EAAc,EACb,QAAmB,EAAA;QAFD,IAAQ,CAAA,QAAA,GAAR,QAAQ,CAAU;QACrC,IAAE,CAAA,EAAA,GAAF,EAAE,CAAY;QACb,IAAQ,CAAA,QAAA,GAAR,QAAQ,CAAW;KAC3B;AAEG,IAAA,WAAW,CAAC,OAAsB,EAAA;QACrC,IAAI,OAAO,CAAC,QAAQ,IAAI,OAAO,CAAC,aAAa,EAAE;YAC3C,IAAI,CAAC,kBAAkB,EAAE,CAAC;SAC7B;AACD,QAAA,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;YACtB,OAAO;SACV;AACD,QAAA,IAAI,OAAO,CAAC,QAAQ,EAAE;YAClB,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;SACpD;QACD,IAAI,OAAO,CAAC,IAAI,IAAI,OAAO,CAAC,SAAS,EAAE;YACnC,IAAI,CAAC,cAAc,EAAE,CAAC;SACzB;AACD,QAAA,IAAI,OAAO,CAAC,KAAK,EAAE;YACf,IAAI,CAAC,QAAQ,EAAE,CAAC;SACnB;QACD,IAAI,OAAO,CAAC,UAAU,IAAI,OAAO,CAAC,eAAe,EAAE;YAC/C,IAAI,CAAC,WAAW,EAAE,CAAC;SACtB;KACJ;IAEM,eAAe,GAAA;AAClB,QAAA,IAAI,CAAC,EAAE,GAAG,iBAAiB,EAAE,GAAG,QAAQ,CAAC;QACzC,IAAI,CAAC,kBAAkB,EAAE,CAAC;KAC7B;AAEO,IAAA,QAAQ,CAAC,OAAqB,EAAA;AAClC,QAAA,MAAM,KAAK,GAAG,OAAO,IAAI,IAAI,CAAC,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QAE/D,IAAI,CAAC,KAAK,EAAE;YACR,OAAO;SACV;AAED,QAAA,IAAI,IAAI,CAAC,KAAK,IAAI,IAAI,EAAE;YACpB,IAAI,UAAU,CAAC,QAAQ,CAAC,KAAK,EAAE,eAAe,CAAC,EAAE;AAC7C,gBAAA,UAAU,CAAC,WAAW,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC;aAClD;AAED,YAAA,IAAI,IAAI,CAAC,KAAK,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,EAAE;AAC/C,gBAAA,UAAU,CAAC,QAAQ,CAAC,KAAK,EAAE,qBAAqB,CAAC,CAAC;aACrD;iBAAM;AACH,gBAAA,UAAU,CAAC,WAAW,CAAC,KAAK,EAAE,qBAAqB,CAAC,CAAC;aACxD;SACJ;aAAM;YACH,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,KAAK,EAAE,eAAe,CAAC,EAAE;AAC9C,gBAAA,UAAU,CAAC,QAAQ,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC;aAC/C;AAED,YAAA,UAAU,CAAC,WAAW,CAAC,KAAK,EAAE,qBAAqB,CAAC,CAAC;SACxD;AAED,QAAA,KAAK,CAAC,SAAS,GAAG,EAAE,CAAC;QACrB,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,IAAI,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;AAChE,QAAA,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,CAAC;KAC9E;AAEO,IAAA,cAAc,CAAC,OAAqB,EAAA;AACxC,QAAA,MAAM,KAAK,GAAG,OAAO,IAAI,IAAI,CAAC,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QAE/D,IAAI,CAAC,KAAK,EAAE;YACR,OAAO;SACV;;QAED,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,UAAU,CAAC,WAAW,CAAC,KAAK,EAAE,CAAA,UAAA,EAAa,CAAC,CAAA,CAAE,CAAC,CAAC,CAAC;QACzF,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,IAAI,CAAC;QAC9C,IAAI,SAAS,EAAE;YACX,UAAU,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAa,UAAA,EAAA,SAAS,CAAE,CAAA,CAAC,CAAC;SACxD;KACJ;IAEO,kBAAkB,GAAA;AACtB,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;YACf,OAAO;SACV;AAED,QAAA,MAAM,EAAE,GAAG,IAAI,CAAC,aAAa,CAAC;QAC9B,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;AAClD,QAAA,KAAK,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC;AACnB,QAAA,KAAK,CAAC,SAAS,GAAG,yBAAyB,CAAC;AAE5C,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;AAC9B,QAAA,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAC3B,QAAA,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;AACrB,QAAA,UAAU,CAAC,QAAQ,CAAC,EAAE,EAAE,mBAAmB,CAAC,CAAC;QAC7C,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC;AACrC,QAAA,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACrB,IAAI,CAAC,WAAW,EAAE,CAAC;KACtB;IAEO,WAAW,GAAA;AACf,QAAA,IAAI,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,UAAU,IAAI,OAAO,IAAI,CAAC,UAAU,KAAK,QAAQ,EAAE;AACxE,YAAA,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE;AACxD,gBAAA,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,EAAE,GAAG,EAAE,KAAK,CAAC,CAAC;aACpD;SACJ;QACD,IAAI,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,eAAe,EAAE;AACtC,YAAA,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC;SAClE;KACJ;IAEO,WAAW,CAAC,WAAiF,EAAE,OAAqB,EAAA;AACxH,QAAA,MAAM,KAAK,GAAG,OAAO,IAAI,IAAI,CAAC,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QAE/D,IAAI,CAAC,KAAK,EAAE;YACR,OAAO;SACV;AAED,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;YACf,UAAU,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAa,UAAA,EAAA,IAAI,CAAC,QAAQ,CAAE,CAAA,CAAC,CAAC;SAC5D;QAED,IAAI,WAAW,EAAE;YACb,UAAU,CAAC,WAAW,CAAC,KAAK,EAAE,CAAa,UAAA,EAAA,WAAW,CAAE,CAAA,CAAC,CAAC;SAC7D;KACJ;IAEO,kBAAkB,GAAA;AACtB,QAAA,IAAI,CAAC,IAAI,CAAC,EAAE,EAAE;YACV,OAAO;SACV;AAED,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACf,YAAA,MAAM,KAAK,GAAG,IAAI,CAAC,aAAa,EAAE,aAAa,CAAC,CAAA,CAAA,EAAI,IAAI,CAAC,EAAE,CAAA,CAAE,CAAC,CAAC;YAE/D,IAAI,KAAK,EAAE;gBACP,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC;aACxD;SACJ;aAAM;YACH,IAAI,CAAC,kBAAkB,EAAE,CAAC;SAC7B;KACJ;AAnKQ,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,cAAc,kBA4BX,QAAQ,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,UAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,SAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;2FA5BX,cAAc,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,QAAA,EAAA,CAAA,eAAA,EAAA,UAAA,CAAA,EAAA,SAAA,EAAA,WAAA,EAAA,IAAA,EAAA,MAAA,EAAA,QAAA,EAAA,UAAA,EAAA,KAAA,EAAA,OAAA,EAAA,UAAA,EAAA,YAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,aAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAAd,cAAc,EAAA,UAAA,EAAA,CAAA;kBAN1B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,YAAY;AACtB,oBAAA,IAAI,EAAE;AACF,wBAAA,KAAK,EAAE,aAAa;AACvB,qBAAA;AACJ,iBAAA,CAAA;;0BA6BQ,MAAM;2BAAC,QAAQ,CAAA;0FA3BW,QAAQ,EAAA,CAAA;sBAAtC,KAAK;uBAAC,eAAe,CAAA;gBACN,SAAS,EAAA,CAAA;sBAAxB,KAAK;gBACc,IAAI,EAAA,CAAA;sBAAvB,KAAK;gBAQU,QAAQ,EAAA,CAAA;sBAAvB,KAAK;gBACU,KAAK,EAAA,CAAA;sBAApB,KAAK;gBACG,UAAU,EAAA,CAAA;sBAAlB,KAAK;gBACG,eAAe,EAAA,CAAA;sBAAvB,KAAK;;;MCdG,WAAW,CAAA;uGAAX,WAAW,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;wGAAX,WAAW,EAAA,YAAA,EAAA,CAFL,KAAK,EAAE,cAAc,CAAA,EAAA,OAAA,EAAA,CAF1B,YAAY,EAAE,YAAY,CAAA,EAAA,OAAA,EAAA,CAC1B,KAAK,EAAE,cAAc,CAAA,EAAA,CAAA,CAAA;wGAGtB,WAAW,EAAA,OAAA,EAAA,CAJV,YAAY,EAAE,YAAY,CAAA,EAAA,CAAA,CAAA;;2FAI3B,WAAW,EAAA,UAAA,EAAA,CAAA;kBALvB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,YAAY,CAAC;AACrC,oBAAA,OAAO,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC;AAChC,oBAAA,YAAY,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC;AACxC,iBAAA,CAAA;;;ACVD;;AAEG;;;;"}
+{"version":3,"file":"cax-design-system-badge.mjs","sources":["../../src/app/components/badge/badge.ts","../../src/app/components/badge/badge.html","../../src/app/components/badge/badge.directive.ts","../../src/app/components/badge/badge.module.ts","../../src/app/components/badge/cax-design-system-badge.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Input, ViewEncapsulation } from '@angular/core';\n\n@Component({\n    selector: 'cax-badge',\n    templateUrl: './badge.html',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./badge.scss'],\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class Badge {\n    @Input() styleClass: string | undefined;\n    @Input() style: { [klass: string]: any } | null | undefined;\n    @Input() badgeSize: 'xs' | 'sm' | 'md' | 'lg' = 'md';\n    @Input() severity: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger' = 'primary';\n    @Input() value: string | number | null | undefined;\n    @Input() badgeDisabled: boolean = false;\n\n    @Input() public set size(value: 'xs' | 'sm' | 'md' | 'lg') {\n        this._size = value;\n        console.warn('size property is deprecated and will removed in v18, use badgeSize instead.');\n    }\n    get size() {\n        return this._size;\n    }\n    private _size: 'xs' | 'sm' | 'md' | 'lg' = 'md';\n\n    containerClass() {\n        return {\n            'cax-badge cax-component': true,\n            'cax-badge-no-gutter': this.value != undefined && String(this.value).length === 1,\n            [`cax-badge-${this.badgeSize}`]: this.badgeSize,\n            [`cax-badge-${this.severity}`]: this.severity\n        };\n    }\n}\n","<span\r\n  *ngIf=\"!badgeDisabled\"\r\n  [ngClass]=\"containerClass()\"\r\n  [class]=\"styleClass\"\r\n  [ngStyle]=\"style\"\r\n>\r\n  {{ value }}\r\n</span>\r\n","import { AfterViewInit, Directive, ElementRef, Inject, Input, OnChanges, Renderer2, SimpleChanges } from '@angular/core';\nimport { DOCUMENT } from '@angular/common';\nimport { DomHandler } from 'cax-design-system/dom';\nimport { UniqueComponentId } from 'cax-design-system/utils';\n\n@Directive({\n    selector: '[caxBadge]',\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class BadgeDirective implements OnChanges, AfterViewInit {\n    @Input('badgeDisabled') public disabled: boolean;\n    @Input() public badgeSize: 'xs' | 'sm' | 'md' | 'lg' | undefined;\n    @Input() public set size(value: 'xs' | 'sm' | 'md' | 'lg') {\n        this._size = value;\n        console.warn('size property is deprecated and will removed in v18, use badgeSize instead.');\n    }\n    get size() {\n        return this._size;\n    }\n    private _size: 'xs' | 'sm' | 'md' | 'lg' | undefined;\n    @Input() public severity: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger' = 'primary';\n    @Input() public value: string | number;\n    @Input() badgeStyle: { [klass: string]: any } | null | undefined;\n    @Input() badgeStyleClass: string;\n\n    private id!: string;\n    badgeEl: HTMLElement;\n\n    private get activeElement(): HTMLElement {\n        return this.el.nativeElement.nodeName.indexOf('-') !== -1 ? this.el.nativeElement.firstChild : this.el.nativeElement;\n    }\n\n    private get canUpdateBadge(): boolean {\n        return this.id && !this.disabled;\n    }\n\n    constructor(\n        @Inject(DOCUMENT) private document: Document,\n        public el: ElementRef,\n        private renderer: Renderer2\n    ) {}\n\n    public ngOnChanges(changes: SimpleChanges): void {\n        if (changes.disabled || changes.badgeDisabled) {\n            this.toggleDisableState();\n        }\n        if (!this.canUpdateBadge) {\n            return;\n        }\n        if (changes.severity) {\n            this.setSeverity(changes.severity.previousValue);\n        }\n        if (changes.size || changes.badgeSize) {\n            this.setSizeClasses();\n        }\n        if (changes.value) {\n            this.setValue();\n        }\n        if (changes.badgeStyle || changes.badgeStyleClass) {\n            this.applyStyles();\n        }\n    }\n\n    public ngAfterViewInit(): void {\n        this.id = UniqueComponentId() + '_badge';\n        this.renderBadgeContent();\n    }\n\n    private setValue(element?: HTMLElement): void {\n        const badge = element ?? this.document.getElementById(this.id);\n\n        if (!badge) {\n            return;\n        }\n\n        if (this.value != null) {\n            if (DomHandler.hasClass(badge, 'cax-badge-dot')) {\n                DomHandler.removeClass(badge, 'cax-badge-dot');\n            }\n\n            if (this.value && String(this.value).length === 1) {\n                DomHandler.addClass(badge, 'cax-badge-no-gutter');\n            } else {\n                DomHandler.removeClass(badge, 'cax-badge-no-gutter');\n            }\n        } else {\n            if (!DomHandler.hasClass(badge, 'cax-badge-dot')) {\n                DomHandler.addClass(badge, 'cax-badge-dot');\n            }\n\n            DomHandler.removeClass(badge, 'cax-badge-no-gutter');\n        }\n\n        badge.innerHTML = '';\n        const badgeValue = this.value != null ? String(this.value) : '';\n        this.renderer.appendChild(badge, this.document.createTextNode(badgeValue));\n    }\n\n    private setSizeClasses(element?: HTMLElement): void {\n        const badge = element ?? this.document.getElementById(this.id);\n\n        if (!badge) {\n            return;\n        }\n        // Remove any existing size classes\n        ['xs', 'sm', 'md', 'lg'].forEach((s) => DomHandler.removeClass(badge, `cax-badge-${s}`));\n        const sizeToUse = this.badgeSize || this.size;\n        if (sizeToUse) {\n            DomHandler.addClass(badge, `cax-badge-${sizeToUse}`);\n        }\n    }\n\n    private renderBadgeContent(): void {\n        if (this.disabled) {\n            return;\n        }\n\n        const el = this.activeElement;\n        const badge = this.document.createElement('span');\n        badge.id = this.id;\n        badge.className = 'cax-badge cax-component';\n\n        this.setSeverity(null, badge);\n        this.setSizeClasses(badge);\n        this.setValue(badge);\n        DomHandler.addClass(el, 'cax-overlay-badge');\n        this.renderer.appendChild(el, badge);\n        this.badgeEl = badge;\n        this.applyStyles();\n    }\n\n    private applyStyles(): void {\n        if (this.badgeEl && this.badgeStyle && typeof this.badgeStyle === 'object') {\n            for (const [key, value] of Object.entries(this.badgeStyle)) {\n                this.renderer.setStyle(this.badgeEl, key, value);\n            }\n        }\n        if (this.badgeEl && this.badgeStyleClass) {\n            this.badgeEl.classList.add(...this.badgeStyleClass.split(' '));\n        }\n    }\n\n    private setSeverity(oldSeverity?: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger', element?: HTMLElement): void {\n        const badge = element ?? this.document.getElementById(this.id);\n\n        if (!badge) {\n            return;\n        }\n\n        if (this.severity) {\n            DomHandler.addClass(badge, `cax-badge-${this.severity}`);\n        }\n\n        if (oldSeverity) {\n            DomHandler.removeClass(badge, `cax-badge-${oldSeverity}`);\n        }\n    }\n\n    private toggleDisableState(): void {\n        if (!this.id) {\n            return;\n        }\n\n        if (this.disabled) {\n            const badge = this.activeElement?.querySelector(`#${this.id}`);\n\n            if (badge) {\n                this.renderer.removeChild(this.activeElement, badge);\n            }\n        } else {\n            this.renderBadgeContent();\n        }\n    }\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { Badge } from './badge';\nimport { BadgeDirective } from './badge.directive';\nimport { SharedModule } from 'cax-design-system/api';\n\n@NgModule({\n    imports: [CommonModule, SharedModule],\n    exports: [Badge, BadgeDirective],\n    declarations: [Badge, BadgeDirective]\n})\nexport class BadgeModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/cax-design-system-button.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { EventEmitter, booleanAttribute, numberAttribute, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, Output, ContentChildren, Directive, Inject, NgModule } from '@angular/core';
 import { CaxTemplate, SharedModule } from 'cax-design-system/api';
-import { NgIf, NgTemplateOutlet, NgStyle, NgClass, DOCUMENT } from '@angular/common';
+import { NgIf, NgStyle, NgClass, NgTemplateOutlet, DOCUMENT } from '@angular/common';
 import { Ripple } from 'cax-design-system/ripple';
 import { AutoFocus } from 'cax-design-system/autofocus';
 import { SpinnerIcon } from 'cax-design-system/icons/spinner';
@@ -28,7 +28,7 @@ class Button {
     outlined = false;
     link = false;
     tabindex;
-    size;
+    size = 'medium';
     style;
     styleClass;
     badgeClass;
@@ -79,6 +79,7 @@ class Button {
             'cax-button-text': this.text,
             'cax-button-outlined': this.outlined,
             'cax-button-sm': this.size === 'small',
+            'cax-button-md': this.size === 'medium',
             'cax-button-lg': this.size === 'large',
             'cax-button-plain': this.plain,
             [`${this.styleClass}`]: this.styleClass
@@ -112,14 +113,14 @@ class Button {
         this.el.nativeElement.firstChild.focus();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: Button, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.2.9", type: Button, isStandalone: true, selector: "cax-button", inputs: { type: "type", iconPos: "iconPos", icon: "icon", badge: "badge", rightIcon: "rightIcon", leftIcon: "leftIcon", label: "label", disabled: ["disabled", "disabled", booleanAttribute], loading: ["loading", "loading", booleanAttribute], loadingIcon: "loadingIcon", raised: ["raised", "raised", booleanAttribute], rounded: ["rounded", "rounded", booleanAttribute], text: ["text", "text", booleanAttribute], plain: ["plain", "plain", booleanAttribute], severity: "severity", outlined: ["outlined", "outlined", booleanAttribute], link: ["link", "link", booleanAttribute], tabindex: ["tabindex", "tabindex", numberAttribute], size: "size", style: "style", styleClass: "styleClass", badgeClass: "badgeClass", ariaLabel: "ariaLabel", autofocus: ["autofocus", "autofocus", booleanAttribute] }, outputs: { onClick: "onClick", onFocus: "onFocus", onBlur: "onBlur" }, host: { properties: { "class.cax-disabled": "disabled" }, classAttribute: "cax-element" }, queries: [{ propertyName: "templates", predicate: CaxTemplate }], ngImport: i0, template: "<button\r\n    [attr.type]=\"type\"\r\n    [attr.aria-label]=\"ariaLabel\"\r\n    [ngStyle]=\"style\"\r\n    [disabled]=\"disabled || loading\"\r\n    [ngClass]=\"buttonClass\"\r\n    (click)=\"onClick.emit($event)\"\r\n    (focus)=\"onFocus.emit($event)\"\r\n    (blur)=\"onBlur.emit($event)\"\r\n    caxRipple\r\n    [attr.data-pc-name]=\"'button'\"\r\n    [attr.data-pc-section]=\"'root'\"\r\n    [attr.tabindex]=\"tabindex\"\r\n    caxAutoFocus\r\n    [autofocus]=\"autofocus\"\r\n>\r\n    <!-- Center Icon when there's no label -->\r\n    <ng-container *ngIf=\"!label\">\r\n        <span *ngIf=\"loading\" class=\"cax-button-icon-center spin\" [ngClass]=\"icon\" [attr.aria-hidden]=\"true\"></span>\r\n        <span *ngIf=\"!loading && icon\" class=\"cax-button-icon-center\" [ngClass]=\"icon\"></span>\r\n    </ng-container>\r\n\r\n    <!-- Left and Right Icons with Label -->\r\n    <ng-container class=\"cax-button-content-wrapper\" *ngIf=\"label\">\r\n        <!-- Left Icon or Loading Spinner -->\r\n        <ng-container *ngIf=\"loading\">\r\n            <ng-container *ngIf=\"!loadingIconTemplate\">\r\n                <span *ngIf=\"loadingIcon\" [ngClass]=\"iconClass()\" [attr.aria-hidden]=\"true\" [attr.data-pc-section]=\"'loadingicon'\"></span>\r\n                <SpinnerIcon *ngIf=\"!loadingIcon\" [styleClass]=\"spinnerIconClass()\" [spin]=\"true\" [attr.aria-hidden]=\"true\" [attr.data-pc-section]=\"'loadingicon'\" />\r\n            </ng-container>\r\n            <ng-template [ngIf]=\"loadingIconTemplate\" *ngTemplateOutlet=\"loadingIconTemplate; context: { class: iconClass() }\"></ng-template>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"!loading && leftIcon\">\r\n            <span class=\"cax-button-icon-left\" [ngClass]=\"leftIcon\"></span>\r\n        </ng-container>\r\n\r\n        <!-- Label -->\r\n        <span class=\"cax-button-label\">{{ label }}</span>\r\n\r\n        <!-- Right Icon -->\r\n        <ng-container *ngIf=\"rightIcon\">\r\n            <span class=\"cax-button-icon-right\" [ngClass]=\"rightIcon\"></span>\r\n        </ng-container>\r\n    </ng-container>\r\n\r\n    <!-- Badge -->\r\n    <span [ngClass]=\"badgeStyleClass()\" [class]=\"badgeClass\" *ngIf=\"badge\" [attr.data-pc-section]=\"'badge'\">{{ badge }}</span>\r\n</button>\r\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: Ripple, selector: "[caxRipple]" }, { kind: "directive", type: AutoFocus, selector: "[caxAutoFocus]", inputs: ["autofocus"] }, { kind: "component", type: SpinnerIcon, selector: "SpinnerIcon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.2.9", type: Button, isStandalone: true, selector: "cax-button", inputs: { type: "type", iconPos: "iconPos", icon: "icon", badge: "badge", rightIcon: "rightIcon", leftIcon: "leftIcon", label: "label", disabled: ["disabled", "disabled", booleanAttribute], loading: ["loading", "loading", booleanAttribute], loadingIcon: "loadingIcon", raised: ["raised", "raised", booleanAttribute], rounded: ["rounded", "rounded", booleanAttribute], text: ["text", "text", booleanAttribute], plain: ["plain", "plain", booleanAttribute], severity: "severity", outlined: ["outlined", "outlined", booleanAttribute], link: ["link", "link", booleanAttribute], tabindex: ["tabindex", "tabindex", numberAttribute], size: "size", style: "style", styleClass: "styleClass", badgeClass: "badgeClass", ariaLabel: "ariaLabel", autofocus: ["autofocus", "autofocus", booleanAttribute] }, outputs: { onClick: "onClick", onFocus: "onFocus", onBlur: "onBlur" }, host: { properties: { "class.cax-disabled": "disabled" }, classAttribute: "cax-element" }, queries: [{ propertyName: "templates", predicate: CaxTemplate }], ngImport: i0, template: "<button\r\n    [attr.type]=\"type\"\r\n    [attr.aria-label]=\"ariaLabel\"\r\n    [ngStyle]=\"style\"\r\n    [disabled]=\"disabled || loading\"\r\n    [ngClass]=\"buttonClass\"\r\n    (click)=\"onClick.emit($event)\"\r\n    (focus)=\"onFocus.emit($event)\"\r\n    (blur)=\"onBlur.emit($event)\"\r\n    caxRipple\r\n    [attr.data-pc-name]=\"'button'\"\r\n    [attr.data-pc-section]=\"'root'\"\r\n    [attr.tabindex]=\"tabindex\"\r\n    caxAutoFocus\r\n    [autofocus]=\"autofocus\"\r\n>\r\n    <ng-container *ngIf=\"loading\" class=\"cax-button-content-wrapper\">\r\n        <ng-container class=\"cax-button-loading-container\">\r\n            <SpinnerIcon [styleClass]=\"spinnerIconClass()\" class=\"cax-main-loader cax-button-label\" [spin]=\"true\" [attr.aria-hidden]=\"true\" [attr.data-pc-section]=\"'loadingicon'\" />\r\n        </ng-container>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"!loading\">\r\n        <!-- Center Icon when there's no label -->\r\n        <ng-container *ngIf=\"!label\">\r\n            <span *ngIf=\"icon\" class=\"cax-button-icon-center\" [ngClass]=\"icon\"></span>\r\n        </ng-container>\r\n\r\n        <!-- Left and Right Icons with Label -->\r\n        <ng-container class=\"cax-button-content-wrapper\" *ngIf=\"label\">\r\n            <!-- Left Icon -->\r\n            <ng-container *ngIf=\"leftIcon\">\r\n                <span class=\"cax-button-icon-left\" [ngClass]=\"leftIcon\"></span>\r\n            </ng-container>\r\n            <!-- Label -->\r\n            <span class=\"cax-button-label\">{{ label }}</span>\r\n            <!-- Right Icon -->\r\n            <ng-container *ngIf=\"rightIcon\">\r\n                <span class=\"cax-button-icon-right\" [ngClass]=\"rightIcon\"></span>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n    <!-- Badge -->\r\n    <span [ngClass]=\"badgeStyleClass()\" [class]=\"badgeClass\" *ngIf=\"badge\" [attr.data-pc-section]=\"'badge'\">{{ badge }}</span>\r\n</button>\r\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: Ripple, selector: "[caxRipple]" }, { kind: "directive", type: AutoFocus, selector: "[caxAutoFocus]", inputs: ["autofocus"] }, { kind: "component", type: SpinnerIcon, selector: "SpinnerIcon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: Button, decorators: [{
             type: Component,
             args: [{ selector: 'cax-button', standalone: true, imports: [NgIf, NgTemplateOutlet, NgStyle, NgClass, Ripple, AutoFocus, SpinnerIcon], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'cax-element',
                         '[class.cax-disabled]': 'disabled' || 'loading'
-                    }, template: "<button\r\n    [attr.type]=\"type\"\r\n    [attr.aria-label]=\"ariaLabel\"\r\n    [ngStyle]=\"style\"\r\n    [disabled]=\"disabled || loading\"\r\n    [ngClass]=\"buttonClass\"\r\n    (click)=\"onClick.emit($event)\"\r\n    (focus)=\"onFocus.emit($event)\"\r\n    (blur)=\"onBlur.emit($event)\"\r\n    caxRipple\r\n    [attr.data-pc-name]=\"'button'\"\r\n    [attr.data-pc-section]=\"'root'\"\r\n    [attr.tabindex]=\"tabindex\"\r\n    caxAutoFocus\r\n    [autofocus]=\"autofocus\"\r\n>\r\n    <!-- Center Icon when there's no label -->\r\n    <ng-container *ngIf=\"!label\">\r\n        <span *ngIf=\"loading\" class=\"cax-button-icon-center spin\" [ngClass]=\"icon\" [attr.aria-hidden]=\"true\"></span>\r\n        <span *ngIf=\"!loading && icon\" class=\"cax-button-icon-center\" [ngClass]=\"icon\"></span>\r\n    </ng-container>\r\n\r\n    <!-- Left and Right Icons with Label -->\r\n    <ng-container class=\"cax-button-content-wrapper\" *ngIf=\"label\">\r\n        <!-- Left Icon or Loading Spinner -->\r\n        <ng-container *ngIf=\"loading\">\r\n            <ng-container *ngIf=\"!loadingIconTemplate\">\r\n                <span *ngIf=\"loadingIcon\" [ngClass]=\"iconClass()\" [attr.aria-hidden]=\"true\" [attr.data-pc-section]=\"'loadingicon'\"></span>\r\n                <SpinnerIcon *ngIf=\"!loadingIcon\" [styleClass]=\"spinnerIconClass()\" [spin]=\"true\" [attr.aria-hidden]=\"true\" [attr.data-pc-section]=\"'loadingicon'\" />\r\n            </ng-container>\r\n            <ng-template [ngIf]=\"loadingIconTemplate\" *ngTemplateOutlet=\"loadingIconTemplate; context: { class: iconClass() }\"></ng-template>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"!loading && leftIcon\">\r\n            <span class=\"cax-button-icon-left\" [ngClass]=\"leftIcon\"></span>\r\n        </ng-container>\r\n\r\n        <!-- Label -->\r\n        <span class=\"cax-button-label\">{{ label }}</span>\r\n\r\n        <!-- Right Icon -->\r\n        <ng-container *ngIf=\"rightIcon\">\r\n            <span class=\"cax-button-icon-right\" [ngClass]=\"rightIcon\"></span>\r\n        </ng-container>\r\n    </ng-container>\r\n\r\n    <!-- Badge -->\r\n    <span [ngClass]=\"badgeStyleClass()\" [class]=\"badgeClass\" *ngIf=\"badge\" [attr.data-pc-section]=\"'badge'\">{{ badge }}</span>\r\n</button>\r\n" }]
+                    }, template: "<button\r\n    [attr.type]=\"type\"\r\n    [attr.aria-label]=\"ariaLabel\"\r\n    [ngStyle]=\"style\"\r\n    [disabled]=\"disabled || loading\"\r\n    [ngClass]=\"buttonClass\"\r\n    (click)=\"onClick.emit($event)\"\r\n    (focus)=\"onFocus.emit($event)\"\r\n    (blur)=\"onBlur.emit($event)\"\r\n    caxRipple\r\n    [attr.data-pc-name]=\"'button'\"\r\n    [attr.data-pc-section]=\"'root'\"\r\n    [attr.tabindex]=\"tabindex\"\r\n    caxAutoFocus\r\n    [autofocus]=\"autofocus\"\r\n>\r\n    <ng-container *ngIf=\"loading\" class=\"cax-button-content-wrapper\">\r\n        <ng-container class=\"cax-button-loading-container\">\r\n            <SpinnerIcon [styleClass]=\"spinnerIconClass()\" class=\"cax-main-loader cax-button-label\" [spin]=\"true\" [attr.aria-hidden]=\"true\" [attr.data-pc-section]=\"'loadingicon'\" />\r\n        </ng-container>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"!loading\">\r\n        <!-- Center Icon when there's no label -->\r\n        <ng-container *ngIf=\"!label\">\r\n            <span *ngIf=\"icon\" class=\"cax-button-icon-center\" [ngClass]=\"icon\"></span>\r\n        </ng-container>\r\n\r\n        <!-- Left and Right Icons with Label -->\r\n        <ng-container class=\"cax-button-content-wrapper\" *ngIf=\"label\">\r\n            <!-- Left Icon -->\r\n            <ng-container *ngIf=\"leftIcon\">\r\n                <span class=\"cax-button-icon-left\" [ngClass]=\"leftIcon\"></span>\r\n            </ng-container>\r\n            <!-- Label -->\r\n            <span class=\"cax-button-label\">{{ label }}</span>\r\n            <!-- Right Icon -->\r\n            <ng-container *ngIf=\"rightIcon\">\r\n                <span class=\"cax-button-icon-right\" [ngClass]=\"rightIcon\"></span>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n    <!-- Badge -->\r\n    <span [ngClass]=\"badgeStyleClass()\" [class]=\"badgeClass\" *ngIf=\"badge\" [attr.data-pc-section]=\"'badge'\">{{ badge }}</span>\r\n</button>\r\n" }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { type: [{
                 type: Input
             }], iconPos: [{