cax-design-system 2.0.0 → 2.1.0

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

@@ -187,7 +187,7 @@ 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,
@@ -223,7 +223,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/fesm2022/cax-design-system-togglebutton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cax-design-system-togglebutton.mjs","sources":["../../src/app/components/togglebutton/togglebutton.ts","../../src/app/components/togglebutton/cax-design-system-togglebutton.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { booleanAttribute, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, EventEmitter, forwardRef, Input, NgModule, numberAttribute, Output, QueryList, TemplateRef } from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { RippleModule } from 'cax-design-system/ripple';\nimport { ToggleButtonChangeEvent } from './togglebutton.interface';\nimport { Nullable } from 'cax-design-system/ts-helpers';\nimport { CaxTemplate, SharedModule } from 'cax-design-system/api';\nimport { AutoFocusModule } from 'cax-design-system/autofocus';\n\ntype ToggleButtonIconPosition = 'left' | 'right';\n\nexport const TOGGLEBUTTON_VALUE_ACCESSOR: any = {\n    provide: NG_VALUE_ACCESSOR,\n    useExisting: forwardRef(() => ToggleButton),\n    multi: true\n};\n/**\n * ToggleButton is used to select a boolean value using a button.\n * @group Components\n */\n@Component({\n    selector: 'p-toggleButton',\n    template: `\n        <div\n            [ngClass]=\"{ 'p-togglebutton p-button p-component': true, 'p-button-icon-only': onIcon && offIcon && !hasOnLabel && !hasOffLabel, 'p-highlight': checked, 'p-disabled': disabled }\"\n            [ngStyle]=\"style\"\n            [class]=\"styleClass\"\n            (click)=\"toggle($event)\"\n            (keydown)=\"onKeyDown($event)\"\n            [attr.tabindex]=\"disabled ? null : tabindex\"\n            role=\"switch\"\n            [attr.aria-checked]=\"checked\"\n            [attr.aria-labelledby]=\"ariaLabelledBy\"\n            [attr.aria-label]=\"ariaLabel\"\n            pRipple\n            [attr.data-pc-name]=\"'togglebutton'\"\n            [attr.data-pc-section]=\"'root'\"\n            pAutoFocus\n            [autofocus]=\"autofocus\"\n        >\n            @if (!iconTemplate) {\n                <span\n                    *ngIf=\"onIcon || offIcon\"\n                    [class]=\"checked ? this.onIcon : this.offIcon\"\n                    [ngClass]=\"{ 'p-button-icon': true, 'p-button-icon-left': iconPos === 'left', 'p-button-icon-right': iconPos === 'right' }\"\n                    [attr.data-pc-section]=\"'icon'\"\n                ></span>\n            } @else {\n                <ng-container *ngTemplateOutlet=\"iconTemplate; context: { $implicit: checked }\"></ng-container>\n            }\n            <span class=\"p-button-label\" *ngIf=\"onLabel || offLabel\" [attr.data-pc-section]=\"'label'\">{{ checked ? (hasOnLabel ? onLabel : '') : hasOffLabel ? offLabel : '' }}</span>\n        </div>\n    `,\n    providers: [TOGGLEBUTTON_VALUE_ACCESSOR],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    styleUrls: ['../button/button.scss'],\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class ToggleButton implements ControlValueAccessor {\n    /**\n     * Label for the on state.\n     * @group Props\n     */\n    @Input() onLabel: string | undefined;\n    /**\n     * Label for the off state.\n     * @group Props\n     */\n    @Input() offLabel: string | undefined;\n    /**\n     * Icon for the on state.\n     * @group Props\n     */\n    @Input() onIcon: string | undefined;\n    /**\n     * Icon for the off state.\n     * @group Props\n     */\n    @Input() offIcon: string | undefined;\n    /**\n     * Defines a string that labels the input for accessibility.\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     * When present, it specifies that the element should be disabled.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) disabled: boolean | undefined;\n    /**\n     * Inline style of the element.\n     * @group Props\n     */\n    @Input() style: any;\n    /**\n     * Style class of the element.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Identifier of the focus input to match a label defined for the component.\n     * @group Props\n     */\n    @Input() inputId: string | undefined;\n    /**\n     * Index of the element in tabbing order.\n     * @group Props\n     */\n    @Input({ transform: numberAttribute }) tabindex: number | undefined = 0;\n    /**\n     * Position of the icon.\n     * @group Props\n     */\n    @Input() iconPos: 'left' | 'right' = 'left';\n    /**\n     * When present, it specifies that the component should automatically get focus on load.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) autofocus: boolean | undefined;\n    /**\n     * Callback to invoke on value change.\n     * @param {ToggleButtonChangeEvent} event - Custom change event.\n     * @group Emits\n     */\n    @Output() onChange: EventEmitter<ToggleButtonChangeEvent> = new EventEmitter<ToggleButtonChangeEvent>();\n\n    @ContentChildren(CaxTemplate) templates!: QueryList<CaxTemplate>;\n\n    iconTemplate: Nullable<TemplateRef<any>>;\n\n    checked: boolean = false;\n\n    onModelChange: Function = () => {};\n\n    onModelTouched: Function = () => {};\n\n    constructor(public cd: ChangeDetectorRef) {}\n\n    ngAfterContentInit() {\n        this.templates.forEach((item) => {\n            switch (item.getType()) {\n                case 'icon':\n                    this.iconTemplate = item.template;\n                    break;\n                default:\n                    this.iconTemplate = item.template;\n                    break;\n            }\n        });\n    }\n\n    toggle(event: Event) {\n        if (!this.disabled) {\n            this.checked = !this.checked;\n            this.onModelChange(this.checked);\n            this.onModelTouched();\n            this.onChange.emit({\n                originalEvent: event,\n                checked: this.checked\n            });\n\n            this.cd.markForCheck();\n        }\n    }\n\n    onKeyDown(event: KeyboardEvent) {\n        switch (event.code) {\n            case 'Enter':\n                this.toggle(event);\n                event.preventDefault();\n                break;\n            case 'Space':\n                this.toggle(event);\n                event.preventDefault();\n                break;\n        }\n    }\n\n    onBlur() {\n        this.onModelTouched();\n    }\n\n    writeValue(value: any): void {\n        this.checked = value;\n        this.cd.markForCheck();\n    }\n\n    registerOnChange(fn: Function): void {\n        this.onModelChange = fn;\n    }\n\n    registerOnTouched(fn: Function): void {\n        this.onModelTouched = fn;\n    }\n\n    setDisabledState(val: boolean): void {\n        this.disabled = val;\n        this.cd.markForCheck();\n    }\n\n    get hasOnLabel(): boolean {\n        return (this.onLabel && this.onLabel.length > 0) as boolean;\n    }\n\n    get hasOffLabel(): boolean {\n        return (this.onLabel && this.onLabel.length > 0) as boolean;\n    }\n}\n\n@NgModule({\n    imports: [CommonModule, RippleModule, SharedModule, AutoFocusModule],\n    exports: [ToggleButton, SharedModule],\n    declarations: [ToggleButton]\n})\nexport class ToggleButtonModule {}\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-togglebutton.mjs","sources":["../../src/app/components/togglebutton/togglebutton.ts","../../src/app/components/togglebutton/cax-design-system-togglebutton.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { booleanAttribute, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, EventEmitter, forwardRef, Input, NgModule, numberAttribute, Output, QueryList, TemplateRef } from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { RippleModule } from 'cax-design-system/ripple';\nimport { ToggleButtonChangeEvent } from './togglebutton.interface';\nimport { Nullable } from 'cax-design-system/ts-helpers';\nimport { CaxTemplate, SharedModule } from 'cax-design-system/api';\nimport { AutoFocusModule } from 'cax-design-system/autofocus';\n\ntype ToggleButtonIconPosition = 'left' | 'right';\n\nexport const TOGGLEBUTTON_VALUE_ACCESSOR: any = {\n    provide: NG_VALUE_ACCESSOR,\n    useExisting: forwardRef(() => ToggleButton),\n    multi: true\n};\n/**\n * ToggleButton is used to select a boolean value using a button.\n * @group Components\n */\n@Component({\n    selector: 'p-toggleButton',\n    template: `\n        <div\n            [ngClass]=\"{ 'p-togglebutton p-button p-component': true, 'p-button-icon-only': onIcon && offIcon && !hasOnLabel && !hasOffLabel, 'p-highlight': checked, 'p-disabled': disabled }\"\n            [ngStyle]=\"style\"\n            [class]=\"styleClass\"\n            (click)=\"toggle($event)\"\n            (keydown)=\"onKeyDown($event)\"\n            [attr.tabindex]=\"disabled ? null : tabindex\"\n            role=\"switch\"\n            [attr.aria-checked]=\"checked\"\n            [attr.aria-labelledby]=\"ariaLabelledBy\"\n            [attr.aria-label]=\"ariaLabel\"\n            pRipple\n            [attr.data-pc-name]=\"'togglebutton'\"\n            [attr.data-pc-section]=\"'root'\"\n            pAutoFocus\n            [autofocus]=\"autofocus\"\n        >\n            @if (!iconTemplate) {\n                <span\n                    *ngIf=\"onIcon || offIcon\"\n                    [class]=\"checked ? this.onIcon : this.offIcon\"\n                    [ngClass]=\"{ 'p-button-icon': true, 'p-button-icon-left': iconPos === 'left', 'p-button-icon-right': iconPos === 'right' }\"\n                    [attr.data-pc-section]=\"'icon'\"\n                ></span>\n            } @else {\n                <ng-container *ngTemplateOutlet=\"iconTemplate; context: { $implicit: checked }\"></ng-container>\n            }\n            <span class=\"p-button-label\" *ngIf=\"onLabel || offLabel\" [attr.data-pc-section]=\"'label'\">{{ checked ? (hasOnLabel ? onLabel : '') : hasOffLabel ? offLabel : '' }}</span>\n        </div>\n    `,\n    providers: [TOGGLEBUTTON_VALUE_ACCESSOR],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    styleUrls: ['../button/button.scss'],\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class ToggleButton implements ControlValueAccessor {\n    /**\n     * Label for the on state.\n     * @group Props\n     */\n    @Input() onLabel: string | undefined;\n    /**\n     * Label for the off state.\n     * @group Props\n     */\n    @Input() offLabel: string | undefined;\n    /**\n     * Icon for the on state.\n     * @group Props\n     */\n    @Input() onIcon: string | undefined;\n    /**\n     * Icon for the off state.\n     * @group Props\n     */\n    @Input() offIcon: string | undefined;\n    /**\n     * Defines a string that labels the input for accessibility.\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     * When present, it specifies that the element should be disabled.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) disabled: boolean | undefined;\n    /**\n     * Inline style of the element.\n     * @group Props\n     */\n    @Input() style: any;\n    /**\n     * Style class of the element.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Identifier of the focus input to match a label defined for the component.\n     * @group Props\n     */\n    @Input() inputId: string | undefined;\n    /**\n     * Index of the element in tabbing order.\n     * @group Props\n     */\n    @Input({ transform: numberAttribute }) tabindex: number | undefined = 0;\n    /**\n     * Position of the icon.\n     * @group Props\n     */\n    @Input() iconPos: 'left' | 'right' = 'left';\n    /**\n     * When present, it specifies that the component should automatically get focus on load.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) autofocus: boolean | undefined;\n    /**\n     * Callback to invoke on value change.\n     * @param {ToggleButtonChangeEvent} event - Custom change event.\n     * @group Emits\n     */\n    @Output() onChange: EventEmitter<ToggleButtonChangeEvent> = new EventEmitter<ToggleButtonChangeEvent>();\n\n    @ContentChildren(CaxTemplate) templates!: QueryList<CaxTemplate>;\n\n    iconTemplate: Nullable<TemplateRef<any>>;\n\n    checked: boolean = false;\n\n    onModelChange: Function = () => {};\n\n    onModelTouched: Function = () => {};\n\n    constructor(public cd: ChangeDetectorRef) {}\n\n    ngAfterContentInit() {\n        this.templates.forEach((item) => {\n            switch (item.getType()) {\n                case 'icon':\n                    this.iconTemplate = item.template;\n                    break;\n                default:\n                    this.iconTemplate = item.template;\n                    break;\n            }\n        });\n    }\n\n    toggle(event: Event) {\n        if (!this.disabled) {\n            this.checked = !this.checked;\n            this.onModelChange(this.checked);\n            this.onModelTouched();\n            this.onChange.emit({\n                originalEvent: event,\n                checked: this.checked\n            });\n\n            this.cd.markForCheck();\n        }\n    }\n\n    onKeyDown(event: KeyboardEvent) {\n        switch (event.code) {\n            case 'Enter':\n                this.toggle(event);\n                event.preventDefault();\n                break;\n            case 'Space':\n                this.toggle(event);\n                event.preventDefault();\n                break;\n        }\n    }\n\n    onBlur() {\n        this.onModelTouched();\n    }\n\n    writeValue(value: any): void {\n        this.checked = value;\n        this.cd.markForCheck();\n    }\n\n    registerOnChange(fn: Function): void {\n        this.onModelChange = fn;\n    }\n\n    registerOnTouched(fn: Function): void {\n        this.onModelTouched = fn;\n    }\n\n    setDisabledState(val: boolean): void {\n        this.disabled = val;\n        this.cd.markForCheck();\n    }\n\n    get hasOnLabel(): boolean {\n        return (this.onLabel && this.onLabel.length > 0) as boolean;\n    }\n\n    get hasOffLabel(): boolean {\n        return (this.onLabel && this.onLabel.length > 0) as boolean;\n    }\n}\n\n@NgModule({\n    imports: [CommonModule, RippleModule, SharedModule, AutoFocusModule],\n    exports: [ToggleButton, SharedModule],\n    declarations: [ToggleButton]\n})\nexport class ToggleButtonModule {}\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-toggleswitch.mjs

@@ -5,6 +5,7 @@ import { CommonModule } from '@angular/common';
 import { FormsModule } from '@angular/forms';
 
 class ToggleSwitchComponent {
+    size = 'md';
     checked = false;
     disabled = false;
     iconClass = 'cax cax-check';
@@ -16,12 +17,14 @@ 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

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

@@ -1 +1 @@
-{"version":3,"file":"cax-design-system-toggleswitch.mjs","sources":["../../src/app/components/toggleswitch/toggleswitch.ts","../../src/app/components/toggleswitch/toggleswitch.html","../../src/app/components/toggleswitch/toggleswitch.module.ts","../../src/app/components/toggleswitch/cax-design-system-toggleswitch.ts"],"sourcesContent":["import { Component, Input, Output, EventEmitter } from '@angular/core';\n\n@Component({\n    selector: 'cax-toggleswitch',\n    templateUrl: './toggleswitch.html',\n    styleUrls: ['./toggleswitch.scss']\n})\nexport class ToggleSwitchComponent {\n    @Input() checked = false;\n    @Input() disabled = false;\n    @Input() iconClass: string = 'cax cax-check';\n    @Output() onChange = new EventEmitter<boolean>();\n    @Input() label: string | undefined;\n    @Input() events: {};\n\n    toggleChecked(event: Event) {\n        this.checked = (event.target as HTMLInputElement).checked;\n        this.onChange.emit(this.checked);\n    }\n}\n","<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","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\nimport { ToggleSwitchComponent } from './toggleswitch';\n\n@NgModule({\n    declarations: [ToggleSwitchComponent],\n    imports: [CommonModule, FormsModule],\n    exports: [ToggleSwitchComponent]\n})\nexport class ToggleSwitchModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;MAOa,qBAAqB,CAAA;IACrB,OAAO,GAAG,KAAK,CAAC;IAChB,QAAQ,GAAG,KAAK,CAAC;IACjB,SAAS,GAAW,eAAe,CAAC;AACnC,IAAA,QAAQ,GAAG,IAAI,YAAY,EAAW,CAAC;AACxC,IAAA,KAAK,CAAqB;AAC1B,IAAA,MAAM,CAAK;AAEpB,IAAA,aAAa,CAAC,KAAY,EAAA;QACtB,IAAI,CAAC,OAAO,GAAI,KAAK,CAAC,MAA2B,CAAC,OAAO,CAAC;QAC1D,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACpC;uGAXQ,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAArB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,qBAAqB,2MCPlC,iuDA2CA,EAAA,MAAA,EAAA,CAAA,6VAAA,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,CAAA,EAAA,CAAA,CAAA;;2FDpCa,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBALjC,SAAS;+BACI,kBAAkB,EAAA,QAAA,EAAA,iuDAAA,EAAA,MAAA,EAAA,CAAA,6VAAA,CAAA,EAAA,CAAA;8BAKnB,OAAO,EAAA,CAAA;sBAAf,KAAK;gBACG,QAAQ,EAAA,CAAA;sBAAhB,KAAK;gBACG,SAAS,EAAA,CAAA;sBAAjB,KAAK;gBACI,QAAQ,EAAA,CAAA;sBAAjB,MAAM;gBACE,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,MAAM,EAAA,CAAA;sBAAd,KAAK;;;MEHG,kBAAkB,CAAA;uGAAlB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAlB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,kBAAkB,iBAJZ,qBAAqB,CAAA,EAAA,OAAA,EAAA,CAC1B,YAAY,EAAE,WAAW,aACzB,qBAAqB,CAAA,EAAA,CAAA,CAAA;wGAEtB,kBAAkB,EAAA,OAAA,EAAA,CAHjB,YAAY,EAAE,WAAW,CAAA,EAAA,CAAA,CAAA;;2FAG1B,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAL9B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACN,YAAY,EAAE,CAAC,qBAAqB,CAAC;AACrC,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,WAAW,CAAC;oBACpC,OAAO,EAAE,CAAC,qBAAqB,CAAC;AACnC,iBAAA,CAAA;;;ACTD;;AAEG;;;;"}
+{"version":3,"file":"cax-design-system-toggleswitch.mjs","sources":["../../src/app/components/toggleswitch/toggleswitch.ts","../../src/app/components/toggleswitch/toggleswitch.html","../../src/app/components/toggleswitch/toggleswitch.module.ts","../../src/app/components/toggleswitch/cax-design-system-toggleswitch.ts"],"sourcesContent":["import { Component, Input, Output, EventEmitter } from '@angular/core';\n\n@Component({\n    selector: 'cax-toggleswitch',\n    templateUrl: './toggleswitch.html',\n    styleUrls: ['./toggleswitch.scss']\n})\nexport class ToggleSwitchComponent {\n    @Input() size: 'sm' | 'md' | 'lg' = 'md';\n    @Input() checked = false;\n    @Input() disabled = false;\n    @Input() iconClass: string = 'cax cax-check';\n    @Output() onChange = new EventEmitter<boolean>();\n    @Input() label: string | undefined;\n    @Input() events: {};\n\n    toggleChecked(event: Event) {\n        this.checked = (event.target as HTMLInputElement).checked;\n        this.onChange.emit(this.checked);\n    }\n}\n","<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","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\nimport { ToggleSwitchComponent } from './toggleswitch';\n\n@NgModule({\n    declarations: [ToggleSwitchComponent],\n    imports: [CommonModule, FormsModule],\n    exports: [ToggleSwitchComponent]\n})\nexport class ToggleSwitchModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;MAOa,qBAAqB,CAAA;IACrB,IAAI,GAAuB,IAAI,CAAC;IAChC,OAAO,GAAG,KAAK,CAAC;IAChB,QAAQ,GAAG,KAAK,CAAC;IACjB,SAAS,GAAW,eAAe,CAAC;AACnC,IAAA,QAAQ,GAAG,IAAI,YAAY,EAAW,CAAC;AACxC,IAAA,KAAK,CAAqB;AAC1B,IAAA,MAAM,CAAK;AAEpB,IAAA,aAAa,CAAC,KAAY,EAAA;QACtB,IAAI,CAAC,OAAO,GAAI,KAAK,CAAC,MAA2B,CAAC,OAAO,CAAC;QAC1D,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACpC;uGAZQ,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAArB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,qBAAqB,yNCPlC,m4DAgDA,EAAA,MAAA,EAAA,CAAA,6VAAA,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,CAAA,EAAA,CAAA,CAAA;;2FDzCa,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBALjC,SAAS;+BACI,kBAAkB,EAAA,QAAA,EAAA,m4DAAA,EAAA,MAAA,EAAA,CAAA,6VAAA,CAAA,EAAA,CAAA;8BAKnB,IAAI,EAAA,CAAA;sBAAZ,KAAK;gBACG,OAAO,EAAA,CAAA;sBAAf,KAAK;gBACG,QAAQ,EAAA,CAAA;sBAAhB,KAAK;gBACG,SAAS,EAAA,CAAA;sBAAjB,KAAK;gBACI,QAAQ,EAAA,CAAA;sBAAjB,MAAM;gBACE,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,MAAM,EAAA,CAAA;sBAAd,KAAK;;;MEJG,kBAAkB,CAAA;uGAAlB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAlB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,kBAAkB,iBAJZ,qBAAqB,CAAA,EAAA,OAAA,EAAA,CAC1B,YAAY,EAAE,WAAW,aACzB,qBAAqB,CAAA,EAAA,CAAA,CAAA;wGAEtB,kBAAkB,EAAA,OAAA,EAAA,CAHjB,YAAY,EAAE,WAAW,CAAA,EAAA,CAAA,CAAA;;2FAG1B,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAL9B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACN,YAAY,EAAE,CAAC,qBAAqB,CAAC;AACrC,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,WAAW,CAAC;oBACpC,OAAO,EAAE,CAAC,qBAAqB,CAAC;AACnC,iBAAA,CAAA;;;ACTD;;AAEG;;;;"}

package/inputmask/inputmask.d.ts

@@ -4,11 +4,6 @@ import { caxConfig, CaxTemplate } from 'cax-design-system/api';
 import { Nullable } from 'cax-design-system/ts-helpers';
 import { Caret } from './inputmask.interface';
 import * as i0 from "@angular/core";
-import * as i1 from "@angular/common";
-import * as i2 from "cax-design-system/inputtext";
-import * as i3 from "cax-design-system/autofocus";
-import * as i4 from "cax-design-system/icons/times";
-import * as i5 from "cax-design-system/api";
 export declare const INPUTMASK_VALUE_ACCESSOR: any;
 /**
  * InputMask component is used to enter input in a certain format such as numeric, date, currency, email and phone.
@@ -218,8 +213,18 @@ export declare class InputMask implements OnInit, ControlValueAccessor {
     androidChrome: boolean;
     focused: Nullable<boolean>;
     _variant: 'filled' | 'outlined';
+    label?: string;
+    leftIcon?: boolean;
+    rightIcon?: boolean;
+    clearIcon: boolean;
+    leftIconClass: string;
+    rightIconClass: string;
+    invalid: boolean;
+    errorText?: string;
+    successText?: string;
+    heightsize: 'sm' | 'md' | 'lg';
     get inputClass(): {
-        'p-inputmask': boolean;
+        'cax-inputmask': boolean;
     };
     constructor(document: Document, platformId: any, el: ElementRef, cd: ChangeDetectorRef, config: caxConfig);
     ngOnInit(): void;
@@ -252,7 +257,7 @@ export declare class InputMask implements OnInit, ControlValueAccessor {
     focus(): void;
     clear(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputMask, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputMask, "p-inputMask", never, { "type": { "alias": "type"; "required": false; }; "slotChar": { "alias": "slotChar"; "required": false; }; "autoClear": { "alias": "autoClear"; "required": false; }; "showClear": { "alias": "showClear"; "required": false; }; "style": { "alias": "style"; "required": false; }; "inputId": { "alias": "inputId"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "size": { "alias": "size"; "required": false; }; "maxlength": { "alias": "maxlength"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "title": { "alias": "title"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "ariaRequired": { "alias": "ariaRequired"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "unmask": { "alias": "unmask"; "required": false; }; "name": { "alias": "name"; "required": false; }; "required": { "alias": "required"; "required": false; }; "characterPattern": { "alias": "characterPattern"; "required": false; }; "autofocus": { "alias": "autofocus"; "required": false; }; "autoFocus": { "alias": "autoFocus"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "keepBuffer": { "alias": "keepBuffer"; "required": false; }; "mask": { "alias": "mask"; "required": false; }; }, { "onComplete": "onComplete"; "onFocus": "onFocus"; "onBlur": "onBlur"; "onInput": "onInput"; "onKeydown": "onKeydown"; "onClear": "onClear"; }, ["templates"], never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputMask, "cax-inputMask", never, { "type": { "alias": "type"; "required": false; }; "slotChar": { "alias": "slotChar"; "required": false; }; "autoClear": { "alias": "autoClear"; "required": false; }; "showClear": { "alias": "showClear"; "required": false; }; "style": { "alias": "style"; "required": false; }; "inputId": { "alias": "inputId"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "size": { "alias": "size"; "required": false; }; "maxlength": { "alias": "maxlength"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "title": { "alias": "title"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "ariaRequired": { "alias": "ariaRequired"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "unmask": { "alias": "unmask"; "required": false; }; "name": { "alias": "name"; "required": false; }; "required": { "alias": "required"; "required": false; }; "characterPattern": { "alias": "characterPattern"; "required": false; }; "autofocus": { "alias": "autofocus"; "required": false; }; "autoFocus": { "alias": "autoFocus"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "keepBuffer": { "alias": "keepBuffer"; "required": false; }; "mask": { "alias": "mask"; "required": false; }; "label": { "alias": "label"; "required": false; }; "leftIcon": { "alias": "leftIcon"; "required": false; }; "rightIcon": { "alias": "rightIcon"; "required": false; }; "clearIcon": { "alias": "clearIcon"; "required": false; }; "leftIconClass": { "alias": "leftIconClass"; "required": false; }; "rightIconClass": { "alias": "rightIconClass"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "errorText": { "alias": "errorText"; "required": false; }; "successText": { "alias": "successText"; "required": false; }; "heightsize": { "alias": "heightsize"; "required": false; }; }, { "onComplete": "onComplete"; "onFocus": "onFocus"; "onBlur": "onBlur"; "onInput": "onInput"; "onKeydown": "onKeydown"; "onClear": "onClear"; }, ["templates"], never, false, never>;
     static ngAcceptInputType_autoClear: unknown;
     static ngAcceptInputType_showClear: unknown;
     static ngAcceptInputType_size: unknown;
@@ -266,8 +271,3 @@ export declare class InputMask implements OnInit, ControlValueAccessor {
     static ngAcceptInputType_autoFocus: unknown;
     static ngAcceptInputType_keepBuffer: unknown;
 }
-export declare class InputMaskModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<InputMaskModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<InputMaskModule, [typeof InputMask], [typeof i1.CommonModule, typeof i2.InputTextModule, typeof i3.AutoFocusModule, typeof i4.TimesIcon], [typeof InputMask, typeof i5.SharedModule]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<InputMaskModule>;
-}

package/inputmask/inputmask.module.d.ts

@@ -0,0 +1,12 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./inputmask";
+import * as i2 from "@angular/common";
+import * as i3 from "cax-design-system/inputtext";
+import * as i4 from "cax-design-system/autofocus";
+import * as i5 from "cax-design-system/icons/times";
+import * as i6 from "cax-design-system/api";
+export declare class InputMaskModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputMaskModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<InputMaskModule, [typeof i1.InputMask], [typeof i2.CommonModule, typeof i3.InputTextModule, typeof i4.AutoFocusModule, typeof i5.TimesIcon], [typeof i1.InputMask, typeof i6.SharedModule]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<InputMaskModule>;
+}

package/inputmask/public_api.d.ts

@@ -1,2 +1,3 @@
 export * from './inputmask';
 export * from './inputmask.interface';
+export * from './inputmask.module';

package/inputtext/inputtext.component.d.ts

@@ -1,6 +1,7 @@
 import { EventEmitter } from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
 import * as i0 from "@angular/core";
-export declare class InputTextComponent {
+export declare class InputTextComponent implements ControlValueAccessor {
     value: string;
     placeholder: string;
     disabled: boolean;
@@ -23,6 +24,8 @@ export declare class InputTextComponent {
     style?: {
         [key: string]: string;
     };
+    size: 'sm' | 'md' | 'lg';
+    styleClass?: string;
     valueChange: EventEmitter<string>;
     private onChange;
     private onTouched;
@@ -30,8 +33,8 @@ export declare class InputTextComponent {
     registerOnChange(fn: (value: string) => void): void;
     registerOnTouched(fn: () => void): void;
     setDisabledState(isDisabled: boolean): void;
-    onInput(event: Event): void;
+    onInput(event: Event | string): void;
     clearInput(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputTextComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputTextComponent, "cax-inputtext", never, { "value": { "alias": "value"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "maxlength": { "alias": "maxlength"; "required": false; }; "successText": { "alias": "successText"; "required": false; }; "errorText": { "alias": "errorText"; "required": false; }; "showLabel": { "alias": "showLabel"; "required": false; }; "leftIcon": { "alias": "leftIcon"; "required": false; }; "rightIcon": { "alias": "rightIcon"; "required": false; }; "clearIcon": { "alias": "clearIcon"; "required": false; }; "label": { "alias": "label"; "required": false; }; "iconPath": { "alias": "iconPath"; "required": false; }; "disabledIcon": { "alias": "disabledIcon"; "required": false; }; "showIcon": { "alias": "showIcon"; "required": false; }; "iconClass": { "alias": "iconClass"; "required": false; }; "leftIconClass": { "alias": "leftIconClass"; "required": false; }; "rightIconClass": { "alias": "rightIconClass"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "required": { "alias": "required"; "required": false; }; "style": { "alias": "style"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputTextComponent, "cax-inputtext", never, { "value": { "alias": "value"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "maxlength": { "alias": "maxlength"; "required": false; }; "successText": { "alias": "successText"; "required": false; }; "errorText": { "alias": "errorText"; "required": false; }; "showLabel": { "alias": "showLabel"; "required": false; }; "leftIcon": { "alias": "leftIcon"; "required": false; }; "rightIcon": { "alias": "rightIcon"; "required": false; }; "clearIcon": { "alias": "clearIcon"; "required": false; }; "label": { "alias": "label"; "required": false; }; "iconPath": { "alias": "iconPath"; "required": false; }; "disabledIcon": { "alias": "disabledIcon"; "required": false; }; "showIcon": { "alias": "showIcon"; "required": false; }; "iconClass": { "alias": "iconClass"; "required": false; }; "leftIconClass": { "alias": "leftIconClass"; "required": false; }; "rightIconClass": { "alias": "rightIconClass"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "required": { "alias": "required"; "required": false; }; "style": { "alias": "style"; "required": false; }; "size": { "alias": "size"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, false, never>;
 }

package/messages/messages.d.ts

@@ -106,7 +106,7 @@ export declare class Messages implements AfterContentInit, OnDestroy {
         [x: string]: "sm" | "md" | "lg";
     };
     onItemClick(e: MouseEvent, item: ActionButtonItem): void;
-    getButtonSeverity(severity: 'success' | 'info' | 'error' | 'warn' | undefined): "success" | "primary" | "danger" | "warning";
+    getButtonSeverity(severity: 'success' | 'info' | 'error' | 'warn' | undefined, outlined?: boolean): "success" | "secondary" | "primary" | "danger" | "warning";
     static ɵfac: i0.ɵɵFactoryDeclaration<Messages, [{ optional: true; }, null, null, null]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<Messages, "cax-messages", never, { "value": { "alias": "value"; "required": false; }; "closable": { "alias": "closable"; "required": false; }; "style": { "alias": "style"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "enableService": { "alias": "enableService"; "required": false; }; "key": { "alias": "key"; "required": false; }; "escape": { "alias": "escape"; "required": false; }; "severity": { "alias": "severity"; "required": false; }; "size": { "alias": "size"; "required": false; }; "displayIcon": { "alias": "displayIcon"; "required": false; }; "showTransitionOptions": { "alias": "showTransitionOptions"; "required": false; }; "hideTransitionOptions": { "alias": "hideTransitionOptions"; "required": false; }; }, { "valueChange": "valueChange"; "onClose": "onClose"; }, ["templates"], never, true, never>;
     static ngAcceptInputType_closable: unknown;