@spicainternational/ngx-sds-components 5.9.2 → 5.10.1

package/fesm2020/spicainternational-ngx-sds-components-src-lib-expansion-panel.mjs

@@ -4,31 +4,57 @@ import * as i2 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i1 from '@fortawesome/angular-fontawesome';
 import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
-import { faCaretDown, faCaretUp } from '@fortawesome/pro-solid-svg-icons';
+import { faChevronDown } from '@fortawesome/pro-regular-svg-icons';
 
-class ExpansionPanelComponent {
+class SdsExpansionPanelComponent {
     constructor() {
+        this.animateCaret = false;
+        /**
+         * toggles greyish background
+         *
+         * @memberof SdsExpansionPanelComponent
+         */
+        this.showBackground = true;
+        /**
+         * position caret next to header of on the far end of the component
+         *
+         * @type {('nextToHeader' | 'farEnd')}
+         * @memberof SdsExpansionPanelComponent
+         */
+        this.caretPlacement = 'nextToHeader';
         this.isOpen = false;
         this.isOpenChange = new EventEmitter();
-        this.cardIsClosedIcon = faCaretDown;
-        this.cardIsOpenIcon = faCaretUp;
+        this.caretIcon = faChevronDown;
     }
-    onToggleIsOpenClick() {
+    onToggleIsOpenClick(event) {
         this.isOpen = !this.isOpen;
         this.isOpenChange.emit(this.isOpen);
+        event.stopImmediatePropagation();
+    }
+    openPanel() {
+        if (!this.isOpen) {
+            this.isOpen = true;
+            this.isOpenChange.emit(this.isOpen);
+        }
     }
 }
-ExpansionPanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: ExpansionPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ExpansionPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: ExpansionPanelComponent, selector: "sds-expansion-panel", inputs: { headerText: "headerText", hideHeader: "hideHeader", headerId: "headerId", descriptionText: "descriptionText", isOpen: "isOpen" }, outputs: { isOpenChange: "isOpenChange" }, ngImport: i0, template: "<div class=\"bg-light border-secondary rounded p-4\">\r\n    <ng-container *ngIf=\"!hideHeader\">\r\n        <button\r\n        [id]=\"headerId\"\r\n        type=\"button\"\r\n        class=\"btn btn-link p-0\"\r\n        [ngClass]=\"isOpen ? 'mb-3' : 'mb-1'\"\r\n        (click)=\"onToggleIsOpenClick()\">\r\n        <span class=\"m-0 h4\">\r\n          {{ headerText }}\r\n          <fa-icon [icon]=\"isOpen ? cardIsOpenIcon : cardIsClosedIcon\"></fa-icon>\r\n        </span>\r\n      </button>\r\n    </ng-container>\r\n\r\n    <div *ngIf=\"!isOpen\">\r\n        {{ descriptionText}}\r\n      <ng-content select=\"[contentOnClosed]\"></ng-content>\r\n    </div>\r\n\r\n    <div *ngIf=\"isOpen\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  </div>\r\n", styles: [".h4{color:#6c757d}\n"], components: [{ type: i1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: ExpansionPanelComponent, decorators: [{
+SdsExpansionPanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsExpansionPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SdsExpansionPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsExpansionPanelComponent, selector: "sds-expansion-panel", inputs: { headerText: "headerText", hideHeader: "hideHeader", headerId: "headerId", animateCaret: "animateCaret", showBackground: "showBackground", caretPlacement: "caretPlacement", descriptionText: "descriptionText", isOpen: "isOpen" }, outputs: { isOpenChange: "isOpenChange" }, ngImport: i0, template: "<div\r\n    class=\"rounded expansion-panel\"\r\n    [class.background]=\"showBackground\"\r\n    [class.closed]=\"!isOpen\"\r\n    (click)=\"openPanel()\"\r\n>\r\n    <ng-container *ngIf=\"!hideHeader\">\r\n        <div\r\n            class=\"expansion-panel-header d-flex flex-row aligh-items-center\"\r\n        >\r\n            <button\r\n                type=\"button\"\r\n                class=\"btn btn-link\"\r\n                [id]=\"headerId\"\r\n                (click)=\"onToggleIsOpenClick($event)\"\r\n            >\r\n                <span class=\"header-text\">\r\n                    {{ headerText }}\r\n                </span>\r\n            </button>\r\n            <button\r\n                type=\"button\"\r\n                class=\"btn btn-link caret\"\r\n                [class.rotate]=\"animateCaret\"\r\n                [class.ml-2]=\"caretPlacement === 'nextToHeader'\"\r\n                [class.ml-auto]=\"caretPlacement === 'farEnd'\"\r\n                (click)=\"onToggleIsOpenClick($event)\"\r\n            >\r\n                <fa-icon [icon]=\"caretIcon\"></fa-icon>\r\n            </button>\r\n        </div>\r\n    </ng-container>\r\n\r\n    <div \r\n        *ngIf=\"!isOpen\"\r\n        class=\"mt-1\"\r\n        >\r\n        {{ descriptionText }}\r\n        <ng-content select=\"[contentOnClosed]\"></ng-content>\r\n    </div>\r\n\r\n    <div \r\n        *ngIf=\"isOpen\"\r\n        class=\"mt-1\"\r\n        >\r\n        <ng-content></ng-content>\r\n    </div>\r\n</div>\r\n", styles: [".expansion-panel .caret.rotate{transition:transform .2s linear}.expansion-panel.closed{cursor:pointer}.expansion-panel.closed .caret{transform:rotate(-180deg)}.expansion-panel.background{background-color:#f8f9fa;padding:1.5rem}.expansion-panel .expansion-panel-header .header-text{font-size:1.06rem;font-weight:600}.expansion-panel .expansion-panel-header button{text-decoration:none;padding:0;color:#212529}.expansion-panel .expansion-panel-header button:focus{box-shadow:none}\n"], components: [{ type: i1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsExpansionPanelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sds-expansion-panel', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"bg-light border-secondary rounded p-4\">\r\n    <ng-container *ngIf=\"!hideHeader\">\r\n        <button\r\n        [id]=\"headerId\"\r\n        type=\"button\"\r\n        class=\"btn btn-link p-0\"\r\n        [ngClass]=\"isOpen ? 'mb-3' : 'mb-1'\"\r\n        (click)=\"onToggleIsOpenClick()\">\r\n        <span class=\"m-0 h4\">\r\n          {{ headerText }}\r\n          <fa-icon [icon]=\"isOpen ? cardIsOpenIcon : cardIsClosedIcon\"></fa-icon>\r\n        </span>\r\n      </button>\r\n    </ng-container>\r\n\r\n    <div *ngIf=\"!isOpen\">\r\n        {{ descriptionText}}\r\n      <ng-content select=\"[contentOnClosed]\"></ng-content>\r\n    </div>\r\n\r\n    <div *ngIf=\"isOpen\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  </div>\r\n", styles: [".h4{color:#6c757d}\n"] }]
+            args: [{ selector: 'sds-expansion-panel', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n    class=\"rounded expansion-panel\"\r\n    [class.background]=\"showBackground\"\r\n    [class.closed]=\"!isOpen\"\r\n    (click)=\"openPanel()\"\r\n>\r\n    <ng-container *ngIf=\"!hideHeader\">\r\n        <div\r\n            class=\"expansion-panel-header d-flex flex-row aligh-items-center\"\r\n        >\r\n            <button\r\n                type=\"button\"\r\n                class=\"btn btn-link\"\r\n                [id]=\"headerId\"\r\n                (click)=\"onToggleIsOpenClick($event)\"\r\n            >\r\n                <span class=\"header-text\">\r\n                    {{ headerText }}\r\n                </span>\r\n            </button>\r\n            <button\r\n                type=\"button\"\r\n                class=\"btn btn-link caret\"\r\n                [class.rotate]=\"animateCaret\"\r\n                [class.ml-2]=\"caretPlacement === 'nextToHeader'\"\r\n                [class.ml-auto]=\"caretPlacement === 'farEnd'\"\r\n                (click)=\"onToggleIsOpenClick($event)\"\r\n            >\r\n                <fa-icon [icon]=\"caretIcon\"></fa-icon>\r\n            </button>\r\n        </div>\r\n    </ng-container>\r\n\r\n    <div \r\n        *ngIf=\"!isOpen\"\r\n        class=\"mt-1\"\r\n        >\r\n        {{ descriptionText }}\r\n        <ng-content select=\"[contentOnClosed]\"></ng-content>\r\n    </div>\r\n\r\n    <div \r\n        *ngIf=\"isOpen\"\r\n        class=\"mt-1\"\r\n        >\r\n        <ng-content></ng-content>\r\n    </div>\r\n</div>\r\n", styles: [".expansion-panel .caret.rotate{transition:transform .2s linear}.expansion-panel.closed{cursor:pointer}.expansion-panel.closed .caret{transform:rotate(-180deg)}.expansion-panel.background{background-color:#f8f9fa;padding:1.5rem}.expansion-panel .expansion-panel-header .header-text{font-size:1.06rem;font-weight:600}.expansion-panel .expansion-panel-header button{text-decoration:none;padding:0;color:#212529}.expansion-panel .expansion-panel-header button:focus{box-shadow:none}\n"] }]
         }], propDecorators: { headerText: [{
                 type: Input
             }], hideHeader: [{
                 type: Input
             }], headerId: [{
                 type: Input
+            }], animateCaret: [{
+                type: Input
+            }], showBackground: [{
+                type: Input
+            }], caretPlacement: [{
+                type: Input
             }], descriptionText: [{
                 type: Input
             }], isOpen: [{
@@ -41,28 +67,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
  * Expansion panel - provides an expandable details-summary view. Used for 'progressive disclosure'.
  *
  * @export
- * @class ExpansionPanelModule
+ * @class SdsExpansionPanelModule
  */
-class ExpansionPanelModule {
+class SdsExpansionPanelModule {
 }
-ExpansionPanelModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: ExpansionPanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ExpansionPanelModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: ExpansionPanelModule, declarations: [ExpansionPanelComponent], imports: [CommonModule,
-        FontAwesomeModule], exports: [ExpansionPanelComponent] });
-ExpansionPanelModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: ExpansionPanelModule, imports: [[
-            CommonModule,
-            FontAwesomeModule
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: ExpansionPanelModule, decorators: [{
+SdsExpansionPanelModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsExpansionPanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+SdsExpansionPanelModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsExpansionPanelModule, declarations: [SdsExpansionPanelComponent], imports: [CommonModule, FontAwesomeModule], exports: [SdsExpansionPanelComponent] });
+SdsExpansionPanelModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsExpansionPanelModule, imports: [[CommonModule, FontAwesomeModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsExpansionPanelModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [
-                        ExpansionPanelComponent
-                    ],
-                    imports: [
-                        CommonModule,
-                        FontAwesomeModule
-                    ],
-                    exports: [ExpansionPanelComponent]
+                    declarations: [SdsExpansionPanelComponent],
+                    imports: [CommonModule, FontAwesomeModule],
+                    exports: [SdsExpansionPanelComponent],
                 }]
         }] });
 
@@ -70,5 +87,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ExpansionPanelComponent, ExpansionPanelModule };
+export { SdsExpansionPanelComponent, SdsExpansionPanelModule };
 //# sourceMappingURL=spicainternational-ngx-sds-components-src-lib-expansion-panel.mjs.map

package/fesm2020/spicainternational-ngx-sds-components-src-lib-expansion-panel.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-expansion-panel.mjs","sources":["../../../projects/ngx-sds-components/src/lib/expansion-panel/expansion-panel.component.ts","../../../projects/ngx-sds-components/src/lib/expansion-panel/expansion-panel.component.html","../../../projects/ngx-sds-components/src/lib/expansion-panel/expansion-panel.module.ts","../../../projects/ngx-sds-components/src/lib/expansion-panel/spicainternational-ngx-sds-components-src-lib-expansion-panel.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';\r\nimport { IconDefinition, faCaretDown, faCaretUp } from '@fortawesome/pro-solid-svg-icons';\r\n\r\n@Component({\r\n  selector: 'sds-expansion-panel',\r\n  templateUrl: './expansion-panel.component.html',\r\n  styleUrls: ['./expansion-panel.component.scss'],\r\n  changeDetection: ChangeDetectionStrategy.OnPush\r\n})\r\n\r\nexport class ExpansionPanelComponent {\r\n    @Input() headerText?: string;\r\n    @Input() hideHeader?: boolean;\r\n    @Input() headerId?: string;\r\n\r\n    /**\r\n     * 'descriptionText' - text displayed when component is \"closed\".\r\n     *\r\n     * Note: Use ng-content 'contentOnClosed' if more complex use-case is needed\r\n     *\r\n     * @type {string}\r\n     * @memberof ExpansionPanelComponent\r\n     */\r\n    @Input() descriptionText?: string;\r\n\r\n    @Input() isOpen: boolean = false;\r\n    @Output() isOpenChange: EventEmitter<boolean> = new EventEmitter();\r\n\r\n    public cardIsClosedIcon: IconDefinition = faCaretDown;\r\n    public cardIsOpenIcon: IconDefinition = faCaretUp;\r\n\r\n    public onToggleIsOpenClick(): void {\r\n      this.isOpen = !this.isOpen;\r\n      this.isOpenChange.emit(this.isOpen);\r\n    }\r\n}\r\n","<div class=\"bg-light border-secondary rounded p-4\">\r\n    <ng-container *ngIf=\"!hideHeader\">\r\n        <button\r\n        [id]=\"headerId\"\r\n        type=\"button\"\r\n        class=\"btn btn-link p-0\"\r\n        [ngClass]=\"isOpen ? 'mb-3' : 'mb-1'\"\r\n        (click)=\"onToggleIsOpenClick()\">\r\n        <span class=\"m-0 h4\">\r\n          {{ headerText }}\r\n          <fa-icon [icon]=\"isOpen ? cardIsOpenIcon : cardIsClosedIcon\"></fa-icon>\r\n        </span>\r\n      </button>\r\n    </ng-container>\r\n\r\n    <div *ngIf=\"!isOpen\">\r\n        {{ descriptionText}}\r\n      <ng-content select=\"[contentOnClosed]\"></ng-content>\r\n    </div>\r\n\r\n    <div *ngIf=\"isOpen\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  </div>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\n\r\nimport { ExpansionPanelComponent } from './expansion-panel.component';\r\n/**\r\n * Expansion panel - provides an expandable details-summary view. Used for 'progressive disclosure'.\r\n *\r\n * @export\r\n * @class ExpansionPanelModule\r\n */\r\n@NgModule({\r\n  declarations: [\r\n    ExpansionPanelComponent\r\n  ],\r\n  imports: [\r\n    CommonModule,\r\n    FontAwesomeModule\r\n  ],\r\n  exports: [ExpansionPanelComponent]\r\n})\r\n\r\nexport class ExpansionPanelModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-expansion-panel.mjs","sources":["../../../projects/ngx-sds-components/src/lib/expansion-panel/expansion-panel.component.ts","../../../projects/ngx-sds-components/src/lib/expansion-panel/expansion-panel.component.html","../../../projects/ngx-sds-components/src/lib/expansion-panel/expansion-panel.module.ts","../../../projects/ngx-sds-components/src/lib/expansion-panel/spicainternational-ngx-sds-components-src-lib-expansion-panel.ts"],"sourcesContent":["import {\r\n    ChangeDetectionStrategy,\r\n    Component,\r\n    EventEmitter,\r\n    Input,\r\n    Output,\r\n} from '@angular/core';\r\nimport { faChevronDown, faChevronUp } from '@fortawesome/pro-regular-svg-icons';\r\nimport {\r\n    IconDefinition,\r\n    faCaretDown,\r\n    faCaretUp,\r\n} from '@fortawesome/pro-solid-svg-icons';\r\nimport { CaretPlacement } from './expansion-panel.types';\r\n\r\n@Component({\r\n    selector: 'sds-expansion-panel',\r\n    templateUrl: './expansion-panel.component.html',\r\n    styleUrls: ['./expansion-panel.component.scss'],\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class SdsExpansionPanelComponent {\r\n    @Input() headerText?: string;\r\n    @Input() hideHeader?: boolean;\r\n    @Input() headerId?: string;\r\n\r\n    @Input() animateCaret = false;\r\n\r\n    /**\r\n     * toggles greyish background\r\n     *\r\n     * @memberof SdsExpansionPanelComponent\r\n     */\r\n    @Input() showBackground = true;\r\n\r\n    /**\r\n     * position caret next to header of on the far end of the component\r\n     *\r\n     * @type {('nextToHeader' | 'farEnd')}\r\n     * @memberof SdsExpansionPanelComponent\r\n     */\r\n    @Input() caretPlacement: CaretPlacement = 'nextToHeader';\r\n\r\n    /**\r\n     * 'descriptionText' - text displayed when component is \"closed\".\r\n     *\r\n     * Note: Use ng-content 'contentOnClosed' if more complex use-case is needed\r\n     *\r\n     * @type {string}\r\n     * @memberof ExpansionPanelComponent\r\n     */\r\n    @Input() descriptionText?: string;\r\n\r\n    @Input() isOpen: boolean = false;\r\n    @Output() isOpenChange: EventEmitter<boolean> = new EventEmitter();\r\n\r\n    public caretIcon: IconDefinition = faChevronDown;\r\n\r\n    public onToggleIsOpenClick(event: MouseEvent): void {\r\n        this.isOpen = !this.isOpen;\r\n        this.isOpenChange.emit(this.isOpen);\r\n        event.stopImmediatePropagation();\r\n    }\r\n\r\n    public openPanel() {\r\n        if (!this.isOpen) {\r\n            this.isOpen = true;\r\n            this.isOpenChange.emit(this.isOpen);\r\n        }\r\n    }\r\n}\r\n","<div\r\n    class=\"rounded expansion-panel\"\r\n    [class.background]=\"showBackground\"\r\n    [class.closed]=\"!isOpen\"\r\n    (click)=\"openPanel()\"\r\n>\r\n    <ng-container *ngIf=\"!hideHeader\">\r\n        <div\r\n            class=\"expansion-panel-header d-flex flex-row aligh-items-center\"\r\n        >\r\n            <button\r\n                type=\"button\"\r\n                class=\"btn btn-link\"\r\n                [id]=\"headerId\"\r\n                (click)=\"onToggleIsOpenClick($event)\"\r\n            >\r\n                <span class=\"header-text\">\r\n                    {{ headerText }}\r\n                </span>\r\n            </button>\r\n            <button\r\n                type=\"button\"\r\n                class=\"btn btn-link caret\"\r\n                [class.rotate]=\"animateCaret\"\r\n                [class.ml-2]=\"caretPlacement === 'nextToHeader'\"\r\n                [class.ml-auto]=\"caretPlacement === 'farEnd'\"\r\n                (click)=\"onToggleIsOpenClick($event)\"\r\n            >\r\n                <fa-icon [icon]=\"caretIcon\"></fa-icon>\r\n            </button>\r\n        </div>\r\n    </ng-container>\r\n\r\n    <div \r\n        *ngIf=\"!isOpen\"\r\n        class=\"mt-1\"\r\n        >\r\n        {{ descriptionText }}\r\n        <ng-content select=\"[contentOnClosed]\"></ng-content>\r\n    </div>\r\n\r\n    <div \r\n        *ngIf=\"isOpen\"\r\n        class=\"mt-1\"\r\n        >\r\n        <ng-content></ng-content>\r\n    </div>\r\n</div>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\n\r\nimport { SdsExpansionPanelComponent } from './expansion-panel.component';\r\n/**\r\n * Expansion panel - provides an expandable details-summary view. Used for 'progressive disclosure'.\r\n *\r\n * @export\r\n * @class SdsExpansionPanelModule\r\n */\r\n@NgModule({\r\n    declarations: [SdsExpansionPanelComponent],\r\n    imports: [CommonModule, FontAwesomeModule],\r\n    exports: [SdsExpansionPanelComponent],\r\n})\r\nexport class SdsExpansionPanelModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2020/spicainternational-ngx-sds-components-src-lib-modal.mjs

@@ -95,9 +95,11 @@ class SdsDialogComponent {
         this.closeText = 'close';
         this.size = 'md';
         this.primaryButtonText = 'Ok';
-        this.secondaryButtonText = 'Cancel';
         this.primaryButtonClass = 'btn-primary';
+        this.primaryButtonType = 'button';
+        this.secondaryButtonText = 'Cancel';
         this.secondaryButtonClass = 'btn-secondary';
+        this.secondaryButtonType = 'button';
         this.showHeader = true;
         this.showCloseButton = true;
         this.showPrimaryButton = true;
@@ -143,7 +145,7 @@ class SdsDialogComponent {
     }
 }
 SdsDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SdsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsDialogComponent, selector: "sds-dialog", inputs: { title: "title", closeText: "closeText", size: "size", primaryButtonText: "primaryButtonText", secondaryButtonText: "secondaryButtonText", primaryButtonClass: "primaryButtonClass", secondaryButtonClass: "secondaryButtonClass", showHeader: "showHeader", showCloseButton: "showCloseButton", showPrimaryButton: "showPrimaryButton", showSecondaryButton: "showSecondaryButton" }, outputs: { dialogOpen: "dialogOpen", dialogClose: "dialogClose" }, viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true, static: true }], ngImport: i0, template: "<sds-modal\r\n    #modal\r\n    [modalTitle]=\"title\"\r\n    [size]=\"size\"\r\n    [showCloseButton]=\"showCloseButton\"\r\n    [showHeader]=\"showHeader\"\r\n    [translations]=\"{ close: closeText}\"\r\n    (closeClick)=\"onCloseClick()\"\r\n    (modalClose)=\"onModalClose()\"\r\n    (modalOpen)=\"onModalOpen()\"\r\n>\r\n    <div>\r\n        <ng-content></ng-content>\r\n    </div>\r\n\r\n    <ng-container #footer ngProjectAs='footer'>\r\n        <button\r\n            *ngIf=\"showSecondaryButton\"\r\n            class=\"btn\"\r\n            [class]=\"secondaryButtonClass\"\r\n            (click)=\"onSecondaryClick()\"\r\n        >{{secondaryButtonText}}</button>\r\n        <button\r\n            *ngIf=\"showPrimaryButton\"\r\n            class=\"btn\"\r\n            [class]=\"primaryButtonClass\"\r\n            (click)=\"onPrimaryClick()\"\r\n        >{{primaryButtonText}}</button>\r\n    </ng-container>\r\n</sds-modal>\r\n", styles: [""], components: [{ type: SdsModalComponent, selector: "sds-modal", inputs: ["modalTitle", "showHeader", "showFooter", "size", "modalDialogId", "showCloseButton", "translations", "isScrollable", "closeOnEscape"], outputs: ["modalOpen", "modalClose", "closeClick"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+SdsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsDialogComponent, selector: "sds-dialog", inputs: { title: "title", closeText: "closeText", size: "size", primaryButtonText: "primaryButtonText", primaryButtonClass: "primaryButtonClass", primaryButtonType: "primaryButtonType", secondaryButtonText: "secondaryButtonText", secondaryButtonClass: "secondaryButtonClass", secondaryButtonType: "secondaryButtonType", showHeader: "showHeader", showCloseButton: "showCloseButton", showPrimaryButton: "showPrimaryButton", showSecondaryButton: "showSecondaryButton" }, outputs: { dialogOpen: "dialogOpen", dialogClose: "dialogClose" }, viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true, static: true }], ngImport: i0, template: "<sds-modal\r\n    #modal\r\n    [modalTitle]=\"title\"\r\n    [size]=\"size\"\r\n    [showCloseButton]=\"showCloseButton\"\r\n    [showHeader]=\"showHeader\"\r\n    [translations]=\"{ close: closeText}\"\r\n    (closeClick)=\"onCloseClick()\"\r\n    (modalClose)=\"onModalClose()\"\r\n    (modalOpen)=\"onModalOpen()\"\r\n>\r\n    <div>\r\n        <ng-content></ng-content>\r\n    </div>\r\n\r\n    <ng-container #footer ngProjectAs='footer'>\r\n        <button\r\n            *ngIf=\"showSecondaryButton\"\r\n            class=\"btn\"\r\n            [class]=\"secondaryButtonClass\"\r\n            (click)=\"onSecondaryClick()\"\r\n        >{{secondaryButtonText}}</button>\r\n        <button\r\n            *ngIf=\"showPrimaryButton\"\r\n            class=\"btn\"\r\n            [class]=\"primaryButtonClass\"\r\n            (click)=\"onPrimaryClick()\"\r\n        >{{primaryButtonText}}</button>\r\n    </ng-container>\r\n</sds-modal>\r\n", styles: [""], components: [{ type: SdsModalComponent, selector: "sds-modal", inputs: ["modalTitle", "showHeader", "showFooter", "size", "modalDialogId", "showCloseButton", "translations", "isScrollable", "closeOnEscape"], outputs: ["modalOpen", "modalClose", "closeClick"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsDialogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'sds-dialog', template: "<sds-modal\r\n    #modal\r\n    [modalTitle]=\"title\"\r\n    [size]=\"size\"\r\n    [showCloseButton]=\"showCloseButton\"\r\n    [showHeader]=\"showHeader\"\r\n    [translations]=\"{ close: closeText}\"\r\n    (closeClick)=\"onCloseClick()\"\r\n    (modalClose)=\"onModalClose()\"\r\n    (modalOpen)=\"onModalOpen()\"\r\n>\r\n    <div>\r\n        <ng-content></ng-content>\r\n    </div>\r\n\r\n    <ng-container #footer ngProjectAs='footer'>\r\n        <button\r\n            *ngIf=\"showSecondaryButton\"\r\n            class=\"btn\"\r\n            [class]=\"secondaryButtonClass\"\r\n            (click)=\"onSecondaryClick()\"\r\n        >{{secondaryButtonText}}</button>\r\n        <button\r\n            *ngIf=\"showPrimaryButton\"\r\n            class=\"btn\"\r\n            [class]=\"primaryButtonClass\"\r\n            (click)=\"onPrimaryClick()\"\r\n        >{{primaryButtonText}}</button>\r\n    </ng-container>\r\n</sds-modal>\r\n", styles: [""] }]
@@ -155,12 +157,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
                 type: Input
             }], primaryButtonText: [{
                 type: Input
-            }], secondaryButtonText: [{
-                type: Input
             }], primaryButtonClass: [{
                 type: Input
+            }], primaryButtonType: [{
+                type: Input
+            }], secondaryButtonText: [{
+                type: Input
             }], secondaryButtonClass: [{
                 type: Input
+            }], secondaryButtonType: [{
+                type: Input
             }], showHeader: [{
                 type: Input
             }], showCloseButton: [{

package/fesm2020/spicainternational-ngx-sds-components-src-lib-modal.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-modal.mjs","sources":["../../../projects/ngx-sds-components/src/lib/modal/modal.component.ts","../../../projects/ngx-sds-components/src/lib/modal/modal.component.html","../../../projects/ngx-sds-components/src/lib/modal/dialog/dialog.component.ts","../../../projects/ngx-sds-components/src/lib/modal/dialog/dialog.component.html","../../../projects/ngx-sds-components/src/lib/modal/modal.module.ts","../../../projects/ngx-sds-components/src/lib/modal/spicainternational-ngx-sds-components-src-lib-modal.ts"],"sourcesContent":["import {\r\n    Component,\r\n    ElementRef,\r\n    Input,\r\n    OnInit,\r\n    Output,\r\n    ViewChild,\r\n    EventEmitter,\r\n    ContentChild,\r\n    HostListener,\r\n} from '@angular/core';\r\nimport { faXmark } from '@fortawesome/pro-regular-svg-icons';\r\nimport { ModalTranslations } from './modal.model';\r\n\r\n@Component({\r\n    selector: 'sds-modal',\r\n    templateUrl: './modal.component.html',\r\n    styleUrls: ['./modal.component.scss'],\r\n})\r\nexport class SdsModalComponent implements OnInit {\r\n    @ContentChild('header') headerContent: ElementRef = { nativeElement: undefined };\r\n\r\n    @Input() public modalTitle?: string;\r\n    @Input() public showHeader: boolean = true;\r\n    @Input() public showFooter: boolean = true;\r\n    @Input() public size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\r\n    @Input() public modalDialogId?: string;\r\n    @Input() public showCloseButton: boolean = true;\r\n\r\n    @Input() public translations: ModalTranslations;\r\n    @Input() public isScrollable = true;\r\n    @Input() public closeOnEscape = false;\r\n\r\n    @Output() public modalOpen: EventEmitter<void> = new EventEmitter<void>();\r\n    @Output() public modalClose: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n    @Output() public closeClick: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n    public closeIcon = faXmark;\r\n\r\n    @ViewChild('modal', { static: false }) private _modal: ElementRef | undefined;\r\n    \r\n\r\n    constructor() {\r\n        this.translations = {\r\n            close: undefined\r\n        }\r\n    }\r\n\r\n    ngOnInit(): void {}\r\n\r\n    public open(): void {\r\n        if (this._modal != undefined) {\r\n            this._modal.nativeElement.style.display = 'block';\r\n            this._modal.nativeElement.focus();\r\n            this.modalOpen.emit();\r\n        }\r\n    }\r\n\r\n    public close(): void {\r\n        if (this._modal != undefined) {\r\n            this._modal.nativeElement.style.display = 'none';\r\n            this.modalClose.emit();\r\n        }\r\n    }\r\n\r\n    public onCloseButtonClick(){\r\n        this.closeClick.emit();\r\n        this.close();\r\n    }\r\n\r\n    onKeydown(event: KeyboardEvent){\r\n        if (\r\n            event.code === 'Escape' &&\r\n            this. closeOnEscape && \r\n            this._modal != undefined && \r\n            this._modal.nativeElement.style.display === 'block'){\r\n                // console.log(`${this.constructor.name} got event: ${event.code}`);\r\n                this.close();\r\n        }\r\n    }\r\n}\r\n","<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\r\n    <div\r\n        class=\"modal-dialog modal-dialog-centered\"\r\n        [class.modal-dialog-scrollable] = \"isScrollable\"\r\n        [id]=\"modalDialogId\"\r\n        [ngClass]=\"'modal-' + size\"\r\n        role=\"document\"\r\n        >\r\n        <div class=\"modal-content\">\r\n\r\n            <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n                <ng-content select='header'></ng-content>\r\n            </div>             \r\n\r\n            <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n                <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n                <button \r\n                    *ngIf=\"showCloseButton\"\r\n                    type=\"button\" \r\n                    class=\"btn-close\" \r\n                    [title]=\"translations.close ?? ''\"\r\n                    (click)=\"onCloseButtonClick()\">\r\n                </button>\r\n            </div>\r\n\r\n            <div class=\"modal-body\">\r\n                <ng-content></ng-content>\r\n            </div>\r\n\r\n            <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n                <ng-content select=\"footer\"></ng-content>\r\n            </div>            \r\n        </div>\r\n    </div>\r\n</div>","import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';\r\nimport { SdsModalComponent } from '../modal.component';\r\n\r\ntype modalButton = 'primary' | 'secondary' | 'close';\r\n\r\n@Component({\r\n    selector: 'sds-dialog',\r\n    templateUrl: './dialog.component.html',\r\n    styleUrls: ['./dialog.component.scss'],\r\n})\r\nexport class SdsDialogComponent implements OnInit {\r\n    @Input() public title: string = '';\r\n    @Input() public closeText?: string = 'close';\r\n    @Input() public size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\r\n\r\n    @Input() public primaryButtonText: string = 'Ok';\r\n    @Input() public secondaryButtonText: string = 'Cancel';\r\n\r\n    @Input() public primaryButtonClass: string = 'btn-primary';\r\n    @Input() public secondaryButtonClass: string = 'btn-secondary';\r\n\r\n    @Input() public showHeader: boolean = true;\r\n    @Input() public showCloseButton: boolean = true;\r\n    @Input() public showPrimaryButton: boolean = true;\r\n    @Input() public showSecondaryButton: boolean = true;\r\n\r\n    @Output() public dialogOpen: EventEmitter<void> = new EventEmitter<void>();\r\n    @Output() public dialogClose: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n\r\n    @ViewChild('modal', { static: true }) private _modal: SdsModalComponent | undefined;\r\n\r\n    private _callback?: Function;\r\n    private _callbackData: any;\r\n\r\n    constructor() {}\r\n\r\n    ngOnInit(): void {}\r\n\r\n    public open(callback?: (button: modalButton, data: any) => void, data?: any): void{\r\n        this._callback = callback;\r\n        this._callbackData = data;\r\n\r\n        if (this._modal != undefined) {\r\n            this._modal.open();\r\n        }\r\n    }\r\n\r\n    private close(): void {\r\n        if (this._modal != undefined) {\r\n            this._modal.close();\r\n        }\r\n    }\r\n\r\n    public onSecondaryClick(): void {\r\n        if (this._callback) {\r\n            this._callback('secondary', this._callbackData);\r\n        }\r\n        this.close();\r\n    }\r\n\r\n    public onPrimaryClick(): void {\r\n        if (this._callback) {\r\n            this._callback('primary', this._callbackData);\r\n        }\r\n        this.close();\r\n    }\r\n\r\n    public onCloseClick(): void {\r\n        if (this._callback) {\r\n            this._callback('close', this._callbackData);\r\n        }\r\n    }\r\n\r\n    public onModalClose(): void {\r\n        this.dialogClose.emit();\r\n    }\r\n\r\n    public onModalOpen(): void {\r\n        this.dialogOpen.emit();\r\n    }    \r\n\r\n}\r\n\r\n\r\n\r\n","<sds-modal\r\n    #modal\r\n    [modalTitle]=\"title\"\r\n    [size]=\"size\"\r\n    [showCloseButton]=\"showCloseButton\"\r\n    [showHeader]=\"showHeader\"\r\n    [translations]=\"{ close: closeText}\"\r\n    (closeClick)=\"onCloseClick()\"\r\n    (modalClose)=\"onModalClose()\"\r\n    (modalOpen)=\"onModalOpen()\"\r\n>\r\n    <div>\r\n        <ng-content></ng-content>\r\n    </div>\r\n\r\n    <ng-container #footer ngProjectAs='footer'>\r\n        <button\r\n            *ngIf=\"showSecondaryButton\"\r\n            class=\"btn\"\r\n            [class]=\"secondaryButtonClass\"\r\n            (click)=\"onSecondaryClick()\"\r\n        >{{secondaryButtonText}}</button>\r\n        <button\r\n            *ngIf=\"showPrimaryButton\"\r\n            class=\"btn\"\r\n            [class]=\"primaryButtonClass\"\r\n            (click)=\"onPrimaryClick()\"\r\n        >{{primaryButtonText}}</button>\r\n    </ng-container>\r\n</sds-modal>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsModalComponent } from './modal.component';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\nimport { SdsDialogComponent } from './dialog/dialog.component';\r\nimport { A11yModule } from '@angular/cdk/a11y';\r\n\r\n\r\nconst components = [\r\n    SdsModalComponent,\r\n    SdsDialogComponent\r\n];\r\n\r\n@NgModule({\r\n  declarations: [\r\n    ...components\r\n  ],\r\n  imports: [\r\n    CommonModule,\r\n    A11yModule,\r\n    FontAwesomeModule\r\n  ],\r\n  exports: [\r\n    ...components\r\n]\r\n})\r\nexport class SdsModalModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.SdsModalComponent"],"mappings":"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"}
+{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-modal.mjs","sources":["../../../projects/ngx-sds-components/src/lib/modal/modal.component.ts","../../../projects/ngx-sds-components/src/lib/modal/modal.component.html","../../../projects/ngx-sds-components/src/lib/modal/dialog/dialog.component.ts","../../../projects/ngx-sds-components/src/lib/modal/dialog/dialog.component.html","../../../projects/ngx-sds-components/src/lib/modal/modal.module.ts","../../../projects/ngx-sds-components/src/lib/modal/spicainternational-ngx-sds-components-src-lib-modal.ts"],"sourcesContent":["import {\r\n    Component,\r\n    ElementRef,\r\n    Input,\r\n    OnInit,\r\n    Output,\r\n    ViewChild,\r\n    EventEmitter,\r\n    ContentChild,\r\n    HostListener,\r\n} from '@angular/core';\r\nimport { faXmark } from '@fortawesome/pro-regular-svg-icons';\r\nimport { ModalTranslations } from './modal.model';\r\n\r\n@Component({\r\n    selector: 'sds-modal',\r\n    templateUrl: './modal.component.html',\r\n    styleUrls: ['./modal.component.scss'],\r\n})\r\nexport class SdsModalComponent implements OnInit {\r\n    @ContentChild('header') headerContent: ElementRef = { nativeElement: undefined };\r\n\r\n    @Input() public modalTitle?: string;\r\n    @Input() public showHeader: boolean = true;\r\n    @Input() public showFooter: boolean = true;\r\n    @Input() public size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\r\n    @Input() public modalDialogId?: string;\r\n    @Input() public showCloseButton: boolean = true;\r\n\r\n    @Input() public translations: ModalTranslations;\r\n    @Input() public isScrollable = true;\r\n    @Input() public closeOnEscape = false;\r\n\r\n    @Output() public modalOpen: EventEmitter<void> = new EventEmitter<void>();\r\n    @Output() public modalClose: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n    @Output() public closeClick: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n    public closeIcon = faXmark;\r\n\r\n    @ViewChild('modal', { static: false }) private _modal: ElementRef | undefined;\r\n    \r\n\r\n    constructor() {\r\n        this.translations = {\r\n            close: undefined\r\n        }\r\n    }\r\n\r\n    ngOnInit(): void {}\r\n\r\n    public open(): void {\r\n        if (this._modal != undefined) {\r\n            this._modal.nativeElement.style.display = 'block';\r\n            this._modal.nativeElement.focus();\r\n            this.modalOpen.emit();\r\n        }\r\n    }\r\n\r\n    public close(): void {\r\n        if (this._modal != undefined) {\r\n            this._modal.nativeElement.style.display = 'none';\r\n            this.modalClose.emit();\r\n        }\r\n    }\r\n\r\n    public onCloseButtonClick(){\r\n        this.closeClick.emit();\r\n        this.close();\r\n    }\r\n\r\n    onKeydown(event: KeyboardEvent){\r\n        if (\r\n            event.code === 'Escape' &&\r\n            this. closeOnEscape && \r\n            this._modal != undefined && \r\n            this._modal.nativeElement.style.display === 'block'){\r\n                // console.log(`${this.constructor.name} got event: ${event.code}`);\r\n                this.close();\r\n        }\r\n    }\r\n}\r\n","<div #modal class=\"modal\" (keydown)=\"onKeydown($event)\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\r\n    <div\r\n        class=\"modal-dialog modal-dialog-centered\"\r\n        [class.modal-dialog-scrollable] = \"isScrollable\"\r\n        [id]=\"modalDialogId\"\r\n        [ngClass]=\"'modal-' + size\"\r\n        role=\"document\"\r\n        >\r\n        <div class=\"modal-content\">\r\n\r\n            <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\r\n                <ng-content select='header'></ng-content>\r\n            </div>             \r\n\r\n            <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\r\n                <h5 class=\"modal-title\">{{modalTitle}}</h5>\r\n                <button \r\n                    *ngIf=\"showCloseButton\"\r\n                    type=\"button\" \r\n                    class=\"btn-close\" \r\n                    [title]=\"translations.close ?? ''\"\r\n                    (click)=\"onCloseButtonClick()\">\r\n                </button>\r\n            </div>\r\n\r\n            <div class=\"modal-body\">\r\n                <ng-content></ng-content>\r\n            </div>\r\n\r\n            <div *ngIf=\"showFooter\" class=\"modal-footer\">\r\n                <ng-content select=\"footer\"></ng-content>\r\n            </div>            \r\n        </div>\r\n    </div>\r\n</div>","import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';\r\nimport { SdsModalComponent } from '../modal.component';\r\nimport { ButtonType } from './dialog.types';\r\n\r\ntype modalButton = 'primary' | 'secondary' | 'close';\r\n\r\n@Component({\r\n    selector: 'sds-dialog',\r\n    templateUrl: './dialog.component.html',\r\n    styleUrls: ['./dialog.component.scss'],\r\n})\r\nexport class SdsDialogComponent implements OnInit {\r\n    @Input() public title: string = '';\r\n    @Input() public closeText?: string = 'close';\r\n    @Input() public size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\r\n\r\n    @Input() public primaryButtonText: string = 'Ok';\r\n    @Input() public primaryButtonClass: string = 'btn-primary';\r\n    @Input() public primaryButtonType: ButtonType = 'button';\r\n    \r\n    @Input() public secondaryButtonText: string = 'Cancel';\r\n    @Input() public secondaryButtonClass: string = 'btn-secondary';\r\n    @Input() public secondaryButtonType: ButtonType = 'button';\r\n\r\n    @Input() public showHeader: boolean = true;\r\n    @Input() public showCloseButton: boolean = true;\r\n    @Input() public showPrimaryButton: boolean = true;\r\n    @Input() public showSecondaryButton: boolean = true;\r\n\r\n    @Output() public dialogOpen: EventEmitter<void> = new EventEmitter<void>();\r\n    @Output() public dialogClose: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n    @ViewChild('modal', { static: true }) private _modal: SdsModalComponent | undefined;\r\n\r\n    private _callback?: Function;\r\n    private _callbackData: any;\r\n\r\n    constructor() {}\r\n\r\n    ngOnInit(): void {}\r\n\r\n    public open(callback?: (button: modalButton, data: any) => void, data?: any): void{\r\n        this._callback = callback;\r\n        this._callbackData = data;\r\n\r\n        if (this._modal != undefined) {\r\n            this._modal.open();\r\n        }\r\n    }\r\n\r\n    private close(): void {\r\n        if (this._modal != undefined) {\r\n            this._modal.close();\r\n        }\r\n    }\r\n\r\n    public onSecondaryClick(): void {\r\n        if (this._callback) {\r\n            this._callback('secondary', this._callbackData);\r\n        }\r\n        this.close();\r\n    }\r\n\r\n    public onPrimaryClick(): void {\r\n        if (this._callback) {\r\n            this._callback('primary', this._callbackData);\r\n        }\r\n        this.close();\r\n    }\r\n\r\n    public onCloseClick(): void {\r\n        if (this._callback) {\r\n            this._callback('close', this._callbackData);\r\n        }\r\n    }\r\n\r\n    public onModalClose(): void {\r\n        this.dialogClose.emit();\r\n    }\r\n\r\n    public onModalOpen(): void {\r\n        this.dialogOpen.emit();\r\n    }    \r\n\r\n}\r\n\r\n\r\n\r\n","<sds-modal\r\n    #modal\r\n    [modalTitle]=\"title\"\r\n    [size]=\"size\"\r\n    [showCloseButton]=\"showCloseButton\"\r\n    [showHeader]=\"showHeader\"\r\n    [translations]=\"{ close: closeText}\"\r\n    (closeClick)=\"onCloseClick()\"\r\n    (modalClose)=\"onModalClose()\"\r\n    (modalOpen)=\"onModalOpen()\"\r\n>\r\n    <div>\r\n        <ng-content></ng-content>\r\n    </div>\r\n\r\n    <ng-container #footer ngProjectAs='footer'>\r\n        <button\r\n            *ngIf=\"showSecondaryButton\"\r\n            class=\"btn\"\r\n            [class]=\"secondaryButtonClass\"\r\n            (click)=\"onSecondaryClick()\"\r\n        >{{secondaryButtonText}}</button>\r\n        <button\r\n            *ngIf=\"showPrimaryButton\"\r\n            class=\"btn\"\r\n            [class]=\"primaryButtonClass\"\r\n            (click)=\"onPrimaryClick()\"\r\n        >{{primaryButtonText}}</button>\r\n    </ng-container>\r\n</sds-modal>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsModalComponent } from './modal.component';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\nimport { SdsDialogComponent } from './dialog/dialog.component';\r\nimport { A11yModule } from '@angular/cdk/a11y';\r\n\r\n\r\nconst components = [\r\n    SdsModalComponent,\r\n    SdsDialogComponent\r\n];\r\n\r\n@NgModule({\r\n  declarations: [\r\n    ...components\r\n  ],\r\n  imports: [\r\n    CommonModule,\r\n    A11yModule,\r\n    FontAwesomeModule\r\n  ],\r\n  exports: [\r\n    ...components\r\n]\r\n})\r\nexport class SdsModalModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.SdsModalComponent"],"mappings":"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"}

package/fesm2020/spicainternational-ngx-sds-components-src-lib-quick-info.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { ElementRef, Component, ChangeDetectionStrategy, Input, ViewChild, ContentChild, NgModule } from '@angular/core';
+import { EventEmitter, ElementRef, Component, ChangeDetectionStrategy, Input, Output, ViewChild, ContentChild, NgModule } from '@angular/core';
 import * as i3 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i1 from '@fortawesome/angular-fontawesome';
@@ -12,16 +12,20 @@ class SdsQuickInfoComponent {
         this.popoverMaxWidth = '20rem';
         this.popoverMinWidth = '';
         this.popoverWidth = '';
+        this.showEventName = 'dxhoverstart';
+        this.hideEventName = 'dxhoverend';
         this.mode = 'default';
+        this.hide = new EventEmitter();
+        this.show = new EventEmitter();
         this.customContent = { nativeElement: undefined };
-        this.hideEvent = { name: 'dxhoverend', delay: 200 };
-        this.showEvent = { name: 'dxhoverstart', delay: 200 };
+        this.showEvent = { name: this.showEventName, delay: 200 };
+        this.hideEvent = { name: this.hideEventName, delay: 200 };
     }
     ngOnChanges(changes) {
-        if (changes['showDelay']) {
+        if (changes['showDelay'] || changes['showEventName']) {
             this.setShowEvent();
         }
-        else if (changes['hideDelay']) {
+        else if (changes['hideDelay'] || changes['hideEventName']) {
             this.setHideEvent();
         }
     }
@@ -35,18 +39,40 @@ class SdsQuickInfoComponent {
             });
         }
     }
+    onHidden() {
+        this.hide.emit();
+    }
+    onShown() {
+        this.show.emit();
+    }
+    showInfo() {
+        if (this._popover) {
+            this._popover.instance.show();
+        }
+    }
+    hideInfo() {
+        if (this._popover) {
+            this._popover.instance.hide();
+        }
+    }
     setShowEvent() {
-        this.showEvent = { name: 'dxhoverstart', delay: this.showDelay ?? 200 };
+        this.showEvent = {
+            name: this.showEventName,
+            delay: this.showDelay ?? 200
+        };
     }
     setHideEvent() {
-        this.hideEvent = { name: 'dxhoverend', delay: this.hideDelay ?? 200 };
+        this.hideEvent = {
+            name: this.hideEventName,
+            delay: this.hideDelay ?? 200
+        };
     }
 }
 SdsQuickInfoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsQuickInfoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SdsQuickInfoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsQuickInfoComponent, selector: "sds-quick-info", inputs: { popoverMaxWidth: "popoverMaxWidth", popoverMinWidth: "popoverMinWidth", popoverWidth: "popoverWidth", showDelay: "showDelay", hideDelay: "hideDelay", mode: "mode" }, queries: [{ propertyName: "customContent", first: true, predicate: ["customContent"], descendants: true }], viewQueries: [{ propertyName: "buttonElementRef", first: true, predicate: ["popoverTarget"], descendants: true, read: ElementRef, static: true }], usesOnChanges: true, ngImport: i0, template: "<div #popoverTarget\r\n    class=\"d-inline\">\r\n\r\n    <fa-icon *ngIf=\"!customContent\"\r\n        [icon]=\"['far', 'info-circle']\"\r\n    > </fa-icon>\r\n\r\n    <ng-container *ngIf=\"customContent\" >\r\n        <ng-content select=\"customContent\"></ng-content>\r\n    </ng-container> \r\n</div>\r\n\r\n<dx-popover\r\n    class=\"d-inline\"\r\n    [target]=\"buttonElementRef?.nativeElement\"\r\n    [maxWidth]=\"popoverMaxWidth\"\r\n    [minWidth]=\"popoverMinWidth\"\r\n    [width]=\"popoverWidth\"\r\n    [showEvent]=\"showEvent\"\r\n    [hideEvent]=\"hideEvent\"\r\n    (onHiding)=\"onHiding($event)\"\r\n    [wrapperAttr]=\"{ class: 'sds-quick-info-popover' }\"\r\n>\r\n    <ng-content></ng-content>\r\n</dx-popover>", styles: ["dx-popover{display:inline}\n"], components: [{ type: i1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i2.DxPopoverComponent, selector: "dx-popover", inputs: ["animation", "closeOnOutsideClick", "container", "contentTemplate", "copyRootClassesToWrapper", "deferRendering", "disabled", "elementAttr", "height", "hideEvent", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showEvent", "showTitle", "target", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "onTitleRendered", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "disabledChange", "elementAttrChange", "heightChange", "hideEventChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showEventChange", "showTitleChange", "targetChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+SdsQuickInfoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsQuickInfoComponent, selector: "sds-quick-info", inputs: { popoverMaxWidth: "popoverMaxWidth", popoverMinWidth: "popoverMinWidth", popoverWidth: "popoverWidth", showDelay: "showDelay", showEventName: "showEventName", hideDelay: "hideDelay", hideEventName: "hideEventName", mode: "mode" }, outputs: { hide: "hide", show: "show" }, queries: [{ propertyName: "customContent", first: true, predicate: ["customContent"], descendants: true }], viewQueries: [{ propertyName: "_popover", first: true, predicate: ["popover"], descendants: true }, { propertyName: "buttonElementRef", first: true, predicate: ["popoverTarget"], descendants: true, read: ElementRef, static: true }], usesOnChanges: true, ngImport: i0, template: "<div #popoverTarget\r\n    class=\"d-inline\">\r\n\r\n    <fa-icon *ngIf=\"!customContent\"\r\n        [icon]=\"['far', 'info-circle']\"\r\n    > </fa-icon>\r\n\r\n    <ng-container *ngIf=\"customContent\" >\r\n        <ng-content select=\"customContent\"></ng-content>\r\n    </ng-container> \r\n</div>\r\n\r\n<dx-popover\r\n    #popover\r\n    class=\"d-inline\"\r\n    [target]=\"buttonElementRef?.nativeElement\"\r\n    [maxWidth]=\"popoverMaxWidth\"\r\n    [minWidth]=\"popoverMinWidth\"\r\n    [width]=\"popoverWidth\"\r\n    [showEvent]=\"showEvent\"\r\n    [hideEvent]=\"hideEvent\"\r\n    (onHiding)=\"onHiding($event)\"\r\n    (onShown)=\"onShown()\"\r\n    (onHidden)=\"onHidden()\"\r\n    [wrapperAttr]=\"{ class: 'sds-quick-info-popover' }\"\r\n>\r\n    <ng-content></ng-content>\r\n</dx-popover>", styles: ["dx-popover{display:inline}\n"], components: [{ type: i1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i2.DxPopoverComponent, selector: "dx-popover", inputs: ["animation", "closeOnOutsideClick", "container", "contentTemplate", "copyRootClassesToWrapper", "deferRendering", "disabled", "elementAttr", "height", "hideEvent", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showEvent", "showTitle", "target", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "onTitleRendered", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "disabledChange", "elementAttrChange", "heightChange", "hideEventChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showEventChange", "showTitleChange", "targetChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsQuickInfoComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sds-quick-info', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #popoverTarget\r\n    class=\"d-inline\">\r\n\r\n    <fa-icon *ngIf=\"!customContent\"\r\n        [icon]=\"['far', 'info-circle']\"\r\n    > </fa-icon>\r\n\r\n    <ng-container *ngIf=\"customContent\" >\r\n        <ng-content select=\"customContent\"></ng-content>\r\n    </ng-container> \r\n</div>\r\n\r\n<dx-popover\r\n    class=\"d-inline\"\r\n    [target]=\"buttonElementRef?.nativeElement\"\r\n    [maxWidth]=\"popoverMaxWidth\"\r\n    [minWidth]=\"popoverMinWidth\"\r\n    [width]=\"popoverWidth\"\r\n    [showEvent]=\"showEvent\"\r\n    [hideEvent]=\"hideEvent\"\r\n    (onHiding)=\"onHiding($event)\"\r\n    [wrapperAttr]=\"{ class: 'sds-quick-info-popover' }\"\r\n>\r\n    <ng-content></ng-content>\r\n</dx-popover>", styles: ["dx-popover{display:inline}\n"] }]
+            args: [{ selector: 'sds-quick-info', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #popoverTarget\r\n    class=\"d-inline\">\r\n\r\n    <fa-icon *ngIf=\"!customContent\"\r\n        [icon]=\"['far', 'info-circle']\"\r\n    > </fa-icon>\r\n\r\n    <ng-container *ngIf=\"customContent\" >\r\n        <ng-content select=\"customContent\"></ng-content>\r\n    </ng-container> \r\n</div>\r\n\r\n<dx-popover\r\n    #popover\r\n    class=\"d-inline\"\r\n    [target]=\"buttonElementRef?.nativeElement\"\r\n    [maxWidth]=\"popoverMaxWidth\"\r\n    [minWidth]=\"popoverMinWidth\"\r\n    [width]=\"popoverWidth\"\r\n    [showEvent]=\"showEvent\"\r\n    [hideEvent]=\"hideEvent\"\r\n    (onHiding)=\"onHiding($event)\"\r\n    (onShown)=\"onShown()\"\r\n    (onHidden)=\"onHidden()\"\r\n    [wrapperAttr]=\"{ class: 'sds-quick-info-popover' }\"\r\n>\r\n    <ng-content></ng-content>\r\n</dx-popover>", styles: ["dx-popover{display:inline}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { popoverMaxWidth: [{
                 type: Input
             }], popoverMinWidth: [{
@@ -55,10 +81,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
                 type: Input
             }], showDelay: [{
                 type: Input
+            }], showEventName: [{
+                type: Input
             }], hideDelay: [{
                 type: Input
+            }], hideEventName: [{
+                type: Input
             }], mode: [{
                 type: Input
+            }], hide: [{
+                type: Output
+            }], show: [{
+                type: Output
+            }], _popover: [{
+                type: ViewChild,
+                args: ['popover', { static: false }]
             }], buttonElementRef: [{
                 type: ViewChild,
                 args: ['popoverTarget', { read: ElementRef, static: true }]

package/fesm2020/spicainternational-ngx-sds-components-src-lib-quick-info.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-quick-info.mjs","sources":["../../../projects/ngx-sds-components/src/lib/quick-info/quick-info.component.ts","../../../projects/ngx-sds-components/src/lib/quick-info/quick-info.component.html","../../../projects/ngx-sds-components/src/lib/quick-info/quick-info.module.ts","../../../projects/ngx-sds-components/src/lib/quick-info/spicainternational-ngx-sds-components-src-lib-quick-info.ts"],"sourcesContent":["import {\r\n    ChangeDetectionStrategy,\r\n    Component,\r\n    ContentChild,\r\n    ElementRef,\r\n    Input,\r\n    OnChanges,\r\n    SimpleChanges,\r\n    ViewChild,\r\n} from '@angular/core';\r\n\r\n@Component({\r\n    selector: 'sds-quick-info',\r\n    templateUrl: './quick-info.component.html',\r\n    styleUrls: ['./quick-info.component.scss'],\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class SdsQuickInfoComponent implements OnChanges {\r\n    @Input() popoverMaxWidth: number | Function | string = '20rem';\r\n    @Input() popoverMinWidth: number | Function | string = '';\r\n    @Input() popoverWidth: number | Function | string = '';\r\n    @Input() showDelay?: number;\r\n    @Input() hideDelay?: number;\r\n    @Input() mode: 'default' | 'hint' = 'default'\r\n\r\n    @ViewChild('popoverTarget', { read: ElementRef, static: true }) public buttonElementRef?: ElementRef;\r\n    @ContentChild('customContent') customContent: ElementRef = { nativeElement: undefined };\r\n\r\n    public hideEvent: string | {\r\n        delay?: number;\r\n        name?: string;\r\n    };\r\n\r\n    public showEvent: string | {\r\n        delay?: number;\r\n        name?: string;\r\n    };    \r\n\r\n    constructor() {\r\n        this.hideEvent = { name: 'dxhoverend', delay: 200 };\r\n        this.showEvent = { name: 'dxhoverstart', delay: 200 };\r\n    }\r\n\r\n    ngOnChanges(changes: SimpleChanges): void {\r\n        if (changes['showDelay']) {\r\n            this.setShowEvent();\r\n        } else if (changes['hideDelay']) {\r\n            this.setHideEvent();\r\n        }        \r\n    }\r\n\r\n    onHiding(e: any) {\r\n        if (this.mode === 'default') {\r\n            const popoverContent = e.component.content().parentNode;\r\n            const isMouseInsidePopover = popoverContent.matches(':hover');\r\n            e.cancel = isMouseInsidePopover;\r\n\r\n            popoverContent.addEventListener('mouseleave', () => {\r\n                e.component.hide();\r\n            });\r\n        }\r\n    }\r\n\r\n    private setShowEvent(): void {\r\n        this.showEvent = { name: 'dxhoverstart', delay: this.showDelay ?? 200 };\r\n    }\r\n\r\n    private setHideEvent(): void {\r\n        this.hideEvent = { name: 'dxhoverend', delay: this.hideDelay ?? 200 };\r\n    }\r\n\r\n}\r\n","<div #popoverTarget\r\n    class=\"d-inline\">\r\n\r\n    <fa-icon *ngIf=\"!customContent\"\r\n        [icon]=\"['far', 'info-circle']\"\r\n    > </fa-icon>\r\n\r\n    <ng-container *ngIf=\"customContent\" >\r\n        <ng-content select=\"customContent\"></ng-content>\r\n    </ng-container> \r\n</div>\r\n\r\n<dx-popover\r\n    class=\"d-inline\"\r\n    [target]=\"buttonElementRef?.nativeElement\"\r\n    [maxWidth]=\"popoverMaxWidth\"\r\n    [minWidth]=\"popoverMinWidth\"\r\n    [width]=\"popoverWidth\"\r\n    [showEvent]=\"showEvent\"\r\n    [hideEvent]=\"hideEvent\"\r\n    (onHiding)=\"onHiding($event)\"\r\n    [wrapperAttr]=\"{ class: 'sds-quick-info-popover' }\"\r\n>\r\n    <ng-content></ng-content>\r\n</dx-popover>","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsQuickInfoComponent } from './quick-info.component';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\nimport { DxPopoverModule } from 'devextreme-angular/ui/popover';\r\n\r\n\r\nconst components = [SdsQuickInfoComponent];\r\n@NgModule({\r\n  declarations: [\r\n    ...components\r\n  ],\r\n  imports: [\r\n    CommonModule,\r\n    FontAwesomeModule,\r\n    DxPopoverModule,\r\n  ],\r\n  exports: [\r\n    ...components\r\n  ]\r\n})\r\nexport class SdsQuickInfoModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-quick-info.mjs","sources":["../../../projects/ngx-sds-components/src/lib/quick-info/quick-info.component.ts","../../../projects/ngx-sds-components/src/lib/quick-info/quick-info.component.html","../../../projects/ngx-sds-components/src/lib/quick-info/quick-info.module.ts","../../../projects/ngx-sds-components/src/lib/quick-info/spicainternational-ngx-sds-components-src-lib-quick-info.ts"],"sourcesContent":["import {\r\n    ChangeDetectionStrategy,\r\n    Component,\r\n    ContentChild,\r\n    ElementRef,\r\n    EventEmitter,\r\n    Input,\r\n    OnChanges,\r\n    Output,\r\n    SimpleChanges,\r\n    ViewChild,\r\n} from '@angular/core';\r\n\r\nimport { DxPopoverComponent } from 'devextreme-angular';\r\n\r\n@Component({\r\n    selector: 'sds-quick-info',\r\n    templateUrl: './quick-info.component.html',\r\n    styleUrls: ['./quick-info.component.scss'],\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class SdsQuickInfoComponent implements OnChanges {\r\n    @Input() popoverMaxWidth: number | Function | string = '20rem';\r\n    @Input() popoverMinWidth: number | Function | string = '';\r\n    @Input() popoverWidth: number | Function | string = '';\r\n    @Input() showDelay?: number;\r\n    @Input() showEventName: string = 'dxhoverstart';\r\n    @Input() hideDelay?: number;\r\n    @Input() hideEventName: string = 'dxhoverend';\r\n    @Input() mode: 'default' | 'hint' = 'default'\r\n    \r\n    @Output() hide = new EventEmitter();\r\n    @Output() show = new EventEmitter();\r\n\r\n    @ViewChild('popover', { static: false }) private _popover: DxPopoverComponent | undefined;\r\n    @ViewChild('popoverTarget', { read: ElementRef, static: true }) public buttonElementRef?: ElementRef;\r\n    @ContentChild('customContent') customContent: ElementRef = { nativeElement: undefined };\r\n\r\n    public hideEvent: string | {\r\n        delay?: number;\r\n        name?: string;\r\n    };\r\n\r\n    public showEvent: string | {\r\n        delay?: number;\r\n        name?: string;\r\n    };    \r\n\r\n    constructor() {\r\n        this.showEvent = { name: this.showEventName, delay: 200 };\r\n        this.hideEvent = { name: this.hideEventName, delay: 200 };\r\n    }\r\n\r\n    ngOnChanges(changes: SimpleChanges): void {\r\n        if (changes['showDelay'] || changes['showEventName']) {\r\n            this.setShowEvent();\r\n        } else if (changes['hideDelay'] || changes['hideEventName']) {\r\n            this.setHideEvent();\r\n        }        \r\n    }\r\n\r\n    onHiding(e: any) {\r\n        if (this.mode === 'default') {\r\n            const popoverContent = e.component.content().parentNode;\r\n            const isMouseInsidePopover = popoverContent.matches(':hover');\r\n            e.cancel = isMouseInsidePopover;\r\n\r\n            popoverContent.addEventListener('mouseleave', () => {\r\n                e.component.hide();\r\n            });\r\n        }\r\n    }\r\n\r\n    onHidden(){\r\n        this.hide.emit();\r\n    }\r\n\r\n    onShown(){\r\n        this.show.emit();\r\n    }\r\n\r\n    public showInfo(){\r\n        if (this._popover) {\r\n            this._popover.instance.show();\r\n        }\r\n    }\r\n\r\n    public hideInfo(){\r\n        if (this._popover) {\r\n            this._popover.instance.hide();\r\n        }\r\n    }\r\n\r\n    private setShowEvent(): void {\r\n        this.showEvent = { \r\n            name: this.showEventName, \r\n            delay: this.showDelay ?? 200 \r\n        };\r\n    }\r\n\r\n    private setHideEvent(): void {\r\n        this.hideEvent = { \r\n            name: this.hideEventName, \r\n            delay: this.hideDelay ?? 200 \r\n        };\r\n    }\r\n\r\n}\r\n","<div #popoverTarget\r\n    class=\"d-inline\">\r\n\r\n    <fa-icon *ngIf=\"!customContent\"\r\n        [icon]=\"['far', 'info-circle']\"\r\n    > </fa-icon>\r\n\r\n    <ng-container *ngIf=\"customContent\" >\r\n        <ng-content select=\"customContent\"></ng-content>\r\n    </ng-container> \r\n</div>\r\n\r\n<dx-popover\r\n    #popover\r\n    class=\"d-inline\"\r\n    [target]=\"buttonElementRef?.nativeElement\"\r\n    [maxWidth]=\"popoverMaxWidth\"\r\n    [minWidth]=\"popoverMinWidth\"\r\n    [width]=\"popoverWidth\"\r\n    [showEvent]=\"showEvent\"\r\n    [hideEvent]=\"hideEvent\"\r\n    (onHiding)=\"onHiding($event)\"\r\n    (onShown)=\"onShown()\"\r\n    (onHidden)=\"onHidden()\"\r\n    [wrapperAttr]=\"{ class: 'sds-quick-info-popover' }\"\r\n>\r\n    <ng-content></ng-content>\r\n</dx-popover>","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsQuickInfoComponent } from './quick-info.component';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\nimport { DxPopoverModule } from 'devextreme-angular/ui/popover';\r\n\r\n\r\nconst components = [SdsQuickInfoComponent];\r\n@NgModule({\r\n  declarations: [\r\n    ...components\r\n  ],\r\n  imports: [\r\n    CommonModule,\r\n    FontAwesomeModule,\r\n    DxPopoverModule,\r\n  ],\r\n  exports: [\r\n    ...components\r\n  ]\r\n})\r\nexport class SdsQuickInfoModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2020/spicainternational-ngx-sds-components-src-lib-side-bar.mjs

@@ -1,7 +1,10 @@
 import * as i0 from '@angular/core';
 import { Component, Input, NgModule } from '@angular/core';
-import * as i1 from '@angular/common';
+import * as i2 from '@angular/common';
 import { CommonModule } from '@angular/common';
+import { faChevronRight } from '@fortawesome/pro-regular-svg-icons';
+import * as i1 from '@fortawesome/angular-fontawesome';
+import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
 
 class SdsSideBarComponent {
     constructor() {
@@ -9,6 +12,7 @@ class SdsSideBarComponent {
         this.product = '';
         this.isMainSideBar = false;
         this.showSideBarToggleButton = false;
+        this.caretIcon = faChevronRight;
     }
     ngOnInit() { }
     toggleSideBar(state) {
@@ -21,16 +25,20 @@ class SdsSideBarComponent {
     }
 }
 SdsSideBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsSideBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SdsSideBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsSideBarComponent, selector: "sds-side-bar", inputs: { product: "product", isMainSideBar: "isMainSideBar", showSideBarToggleButton: "showSideBarToggleButton" }, ngImport: i0, template: "<!-- <div class=\"overflow-hidden w-100 h-100 d-block position-relative\"> -->\r\n    <aside\r\n        class=\"sds-side-bar \"\r\n        [class]=\"(product ? 'product-' + product : null)\"\r\n        [class.sds-main-side-bar] = \"isMainSideBar\"\r\n        [class.hide-sidebar]=\"!showSideBar\"\r\n    >\r\n        <div class=\"d-flex flex-column h-100\">\r\n            <div class=\"d-flex flex-column flex-grow-0 w-100 h-100\">\r\n                <div\r\n                    *ngIf=\"showSideBarToggleButton\"\r\n                    class=\"position-absolute d-md-none rounded-circle toggleSideBar d-flex justify-content-center justify-content-center align-items-center\"\r\n                    (click)=\"toggleSideBar()\"\r\n                >\r\n                    <i *ngIf=\"showSideBar\" class=\"fal fa-chevron-left\" title=\"hide menu\"></i>\r\n                    <i *ngIf=\"!showSideBar\" class=\"fal fa-bars\" title=\"show menu\"></i>\r\n                </div>\r\n\r\n                <!-- <a class=\"mt-1 mb-1\" routerLink=\"dashboard\">\r\n                    <img src=\"./assets/img/logo.svg\">\r\n                </a> -->\r\n\r\n                <!-- <div class=\"d-flex py-3 justify-content-center\">\r\n                   <img height=\"30\" src=\"assets/img/AllHoursLogoBigger.png\"> \r\n                </div>                 -->\r\n\r\n                <ng-content></ng-content>                \r\n            </div>\r\n        </div>\r\n    </aside>\r\n<!-- </div> -->", styles: [""], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+SdsSideBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsSideBarComponent, selector: "sds-side-bar", inputs: { product: "product", isMainSideBar: "isMainSideBar", showSideBarToggleButton: "showSideBarToggleButton", hideSideBarText: "hideSideBarText", showSideBarText: "showSideBarText" }, ngImport: i0, template: "<aside\r\n    class=\"sds-side-bar \"\r\n    [class]=\"(product ? 'product-' + product : null)\"\r\n    [class.sds-main-side-bar] = \"isMainSideBar\"\r\n    [class.hide-sidebar]=\"!showSideBar\"\r\n>\r\n    <div class=\"d-flex flex-column h-100\">\r\n        <div class=\"d-flex flex-column flex-grow-0 w-100 h-100\">\r\n            <div\r\n                *ngIf=\"showSideBarToggleButton\"\r\n                class=\"toggle-side-bar-button position-absolute d-md-none rounded-circle toggleSideBar d-flex justify-content-center justify-content-center align-items-center\"\r\n                [class.open]=\"showSideBar\"\r\n                [title]=\"showSideBar ? hideSideBarText : showSideBarText\"\r\n                (click)=\"toggleSideBar()\"\r\n            >\r\n                <div class=\"toggle-side-bar-icon\">\r\n                    <fa-icon [icon]=\"caretIcon\"></fa-icon>\r\n                </div>    \r\n            </div>\r\n\r\n            <ng-content></ng-content>                \r\n        </div>\r\n    </div>\r\n</aside>\r\n", styles: [".toggle-side-bar-button{transition:transform .2s linear}.toggle-side-bar-button.open .toggle-side-bar-icon{transform:rotate(-180deg)}\n"], components: [{ type: i1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsSideBarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sds-side-bar', template: "<!-- <div class=\"overflow-hidden w-100 h-100 d-block position-relative\"> -->\r\n    <aside\r\n        class=\"sds-side-bar \"\r\n        [class]=\"(product ? 'product-' + product : null)\"\r\n        [class.sds-main-side-bar] = \"isMainSideBar\"\r\n        [class.hide-sidebar]=\"!showSideBar\"\r\n    >\r\n        <div class=\"d-flex flex-column h-100\">\r\n            <div class=\"d-flex flex-column flex-grow-0 w-100 h-100\">\r\n                <div\r\n                    *ngIf=\"showSideBarToggleButton\"\r\n                    class=\"position-absolute d-md-none rounded-circle toggleSideBar d-flex justify-content-center justify-content-center align-items-center\"\r\n                    (click)=\"toggleSideBar()\"\r\n                >\r\n                    <i *ngIf=\"showSideBar\" class=\"fal fa-chevron-left\" title=\"hide menu\"></i>\r\n                    <i *ngIf=\"!showSideBar\" class=\"fal fa-bars\" title=\"show menu\"></i>\r\n                </div>\r\n\r\n                <!-- <a class=\"mt-1 mb-1\" routerLink=\"dashboard\">\r\n                    <img src=\"./assets/img/logo.svg\">\r\n                </a> -->\r\n\r\n                <!-- <div class=\"d-flex py-3 justify-content-center\">\r\n                   <img height=\"30\" src=\"assets/img/AllHoursLogoBigger.png\"> \r\n                </div>                 -->\r\n\r\n                <ng-content></ng-content>                \r\n            </div>\r\n        </div>\r\n    </aside>\r\n<!-- </div> -->", styles: [""] }]
+            args: [{ selector: 'sds-side-bar', template: "<aside\r\n    class=\"sds-side-bar \"\r\n    [class]=\"(product ? 'product-' + product : null)\"\r\n    [class.sds-main-side-bar] = \"isMainSideBar\"\r\n    [class.hide-sidebar]=\"!showSideBar\"\r\n>\r\n    <div class=\"d-flex flex-column h-100\">\r\n        <div class=\"d-flex flex-column flex-grow-0 w-100 h-100\">\r\n            <div\r\n                *ngIf=\"showSideBarToggleButton\"\r\n                class=\"toggle-side-bar-button position-absolute d-md-none rounded-circle toggleSideBar d-flex justify-content-center justify-content-center align-items-center\"\r\n                [class.open]=\"showSideBar\"\r\n                [title]=\"showSideBar ? hideSideBarText : showSideBarText\"\r\n                (click)=\"toggleSideBar()\"\r\n            >\r\n                <div class=\"toggle-side-bar-icon\">\r\n                    <fa-icon [icon]=\"caretIcon\"></fa-icon>\r\n                </div>    \r\n            </div>\r\n\r\n            <ng-content></ng-content>                \r\n        </div>\r\n    </div>\r\n</aside>\r\n", styles: [".toggle-side-bar-button{transition:transform .2s linear}.toggle-side-bar-button.open .toggle-side-bar-icon{transform:rotate(-180deg)}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { product: [{
                 type: Input
             }], isMainSideBar: [{
                 type: Input
             }], showSideBarToggleButton: [{
                 type: Input
+            }], hideSideBarText: [{
+                type: Input
+            }], showSideBarText: [{
+                type: Input
             }] } });
 
 const components = [
@@ -39,9 +47,9 @@ const components = [
 class SdsSideBarModule {
 }
 SdsSideBarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsSideBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-SdsSideBarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsSideBarModule, declarations: [SdsSideBarComponent], imports: [CommonModule], exports: [SdsSideBarComponent] });
+SdsSideBarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsSideBarModule, declarations: [SdsSideBarComponent], imports: [CommonModule, FontAwesomeModule], exports: [SdsSideBarComponent] });
 SdsSideBarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsSideBarModule, imports: [[
-            CommonModule
+            CommonModule, FontAwesomeModule
         ]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsSideBarModule, decorators: [{
             type: NgModule,
@@ -50,7 +58,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
                         ...components
                     ],
                     imports: [
-                        CommonModule
+                        CommonModule, FontAwesomeModule
                     ],
                     exports: [
                         ...components

package/fesm2020/spicainternational-ngx-sds-components-src-lib-side-bar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-side-bar.mjs","sources":["../../../projects/ngx-sds-components/src/lib/side-bar/side-bar.component.ts","../../../projects/ngx-sds-components/src/lib/side-bar/side-bar.component.html","../../../projects/ngx-sds-components/src/lib/side-bar/side-bar.module.ts","../../../projects/ngx-sds-components/src/lib/side-bar/spicainternational-ngx-sds-components-src-lib-side-bar.ts"],"sourcesContent":["import { Component, Input, OnInit } from '@angular/core';\r\n\r\n@Component({\r\n    selector: 'sds-side-bar',\r\n    templateUrl: './side-bar.component.html',\r\n    styleUrls: ['./side-bar.component.scss'],\r\n})\r\nexport class SdsSideBarComponent implements OnInit {\r\n\r\n    public showSideBar = false;\r\n\r\n    @Input() product:string = '';\r\n    @Input() isMainSideBar: boolean = false;\r\n    @Input() showSideBarToggleButton: boolean = false;\r\n\r\n    constructor() {}\r\n\r\n    ngOnInit(): void {}\r\n\r\n    public toggleSideBar(state?: boolean) {\r\n        if (state !== undefined) {\r\n            this.showSideBar = state;\r\n        } else {\r\n            this.showSideBar = !this.showSideBar;\r\n        }\r\n    }    \r\n}\r\n","<!-- <div class=\"overflow-hidden w-100 h-100 d-block position-relative\"> -->\r\n    <aside\r\n        class=\"sds-side-bar \"\r\n        [class]=\"(product ? 'product-' + product : null)\"\r\n        [class.sds-main-side-bar] = \"isMainSideBar\"\r\n        [class.hide-sidebar]=\"!showSideBar\"\r\n    >\r\n        <div class=\"d-flex flex-column h-100\">\r\n            <div class=\"d-flex flex-column flex-grow-0 w-100 h-100\">\r\n                <div\r\n                    *ngIf=\"showSideBarToggleButton\"\r\n                    class=\"position-absolute d-md-none rounded-circle toggleSideBar d-flex justify-content-center justify-content-center align-items-center\"\r\n                    (click)=\"toggleSideBar()\"\r\n                >\r\n                    <i *ngIf=\"showSideBar\" class=\"fal fa-chevron-left\" title=\"hide menu\"></i>\r\n                    <i *ngIf=\"!showSideBar\" class=\"fal fa-bars\" title=\"show menu\"></i>\r\n                </div>\r\n\r\n                <!-- <a class=\"mt-1 mb-1\" routerLink=\"dashboard\">\r\n                    <img src=\"./assets/img/logo.svg\">\r\n                </a> -->\r\n\r\n                <!-- <div class=\"d-flex py-3 justify-content-center\">\r\n                   <img height=\"30\" src=\"assets/img/AllHoursLogoBigger.png\"> \r\n                </div>                 -->\r\n\r\n                <ng-content></ng-content>                \r\n            </div>\r\n        </div>\r\n    </aside>\r\n<!-- </div> -->","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsSideBarComponent } from './side-bar.component';\r\n\r\n\r\n\r\nconst components = [\r\n    SdsSideBarComponent\r\n]\r\n@NgModule({\r\n  declarations: [\r\n    ...components\r\n  ],\r\n  imports: [\r\n    CommonModule\r\n  ],\r\n  exports: [\r\n    ...components\r\n  ]\r\n})\r\nexport class SdsSideBarModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;MAOa,mBAAmB,CAAA;AAQ5B,IAAA,WAAA,GAAA;QANO,IAAW,CAAA,WAAA,GAAG,KAAK,CAAC;QAElB,IAAO,CAAA,OAAA,GAAU,EAAE,CAAC;QACpB,IAAa,CAAA,aAAA,GAAY,KAAK,CAAC;QAC/B,IAAuB,CAAA,uBAAA,GAAY,KAAK,CAAC;KAElC;AAEhB,IAAA,QAAQ,MAAW;AAEZ,IAAA,aAAa,CAAC,KAAe,EAAA;QAChC,IAAI,KAAK,KAAK,SAAS,EAAE;AACrB,YAAA,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;AAC5B,SAAA;AAAM,aAAA;AACH,YAAA,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,CAAC,WAAW,CAAC;AACxC,SAAA;KACJ;;gHAlBQ,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAnB,mBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,mBAAmB,wKCPhC,+8CA8Be,EAAA,MAAA,EAAA,CAAA,EAAA,CAAA,EAAA,UAAA,EAAA,CAAA,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;2FDvBF,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAL/B,SAAS;+BACI,cAAc,EAAA,QAAA,EAAA,+8CAAA,EAAA,MAAA,EAAA,CAAA,EAAA,CAAA,EAAA,CAAA;0EAQf,OAAO,EAAA,CAAA;sBAAf,KAAK;gBACG,aAAa,EAAA,CAAA;sBAArB,KAAK;gBACG,uBAAuB,EAAA,CAAA;sBAA/B,KAAK;;;AEPV,MAAM,UAAU,GAAG;IACf,mBAAmB;CACtB,CAAA;MAYY,gBAAgB,CAAA;;6GAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAhB,gBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,gBAAgB,EAbzB,YAAA,EAAA,CAAA,mBAAmB,CAOnB,EAAA,OAAA,EAAA,CAAA,YAAY,aAPZ,mBAAmB,CAAA,EAAA,CAAA,CAAA;AAaV,gBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,gBAAgB,EAPlB,OAAA,EAAA,CAAA;YACP,YAAY;AACb,SAAA,CAAA,EAAA,CAAA,CAAA;2FAKU,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAX5B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,YAAY,EAAE;AACZ,wBAAA,GAAG,UAAU;AACd,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,YAAY;AACb,qBAAA;AACD,oBAAA,OAAO,EAAE;AACP,wBAAA,GAAG,UAAU;AACd,qBAAA;AACF,iBAAA,CAAA;;;ACnBD;;AAEG;;;;"}
+{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-side-bar.mjs","sources":["../../../projects/ngx-sds-components/src/lib/side-bar/side-bar.component.ts","../../../projects/ngx-sds-components/src/lib/side-bar/side-bar.component.html","../../../projects/ngx-sds-components/src/lib/side-bar/side-bar.module.ts","../../../projects/ngx-sds-components/src/lib/side-bar/spicainternational-ngx-sds-components-src-lib-side-bar.ts"],"sourcesContent":["import { Component, Input, OnInit } from '@angular/core';\r\nimport { IconDefinition, faChevronRight } from '@fortawesome/pro-regular-svg-icons';\r\n\r\n@Component({\r\n    selector: 'sds-side-bar',\r\n    templateUrl: './side-bar.component.html',\r\n    styleUrls: ['./side-bar.component.scss'],\r\n})\r\nexport class SdsSideBarComponent implements OnInit {\r\n\r\n    public showSideBar = false;\r\n\r\n    @Input() product:string = '';\r\n    @Input() isMainSideBar: boolean = false;\r\n    @Input() showSideBarToggleButton: boolean = false;\r\n\r\n    @Input() public hideSideBarText?: string;\r\n    @Input() public showSideBarText?: string;\r\n\r\n\r\n    public caretIcon: IconDefinition = faChevronRight;\r\n\r\n    constructor() {}\r\n\r\n    ngOnInit(): void {}\r\n\r\n    public toggleSideBar(state?: boolean) {\r\n        if (state !== undefined) {\r\n            this.showSideBar = state;\r\n        } else {\r\n            this.showSideBar = !this.showSideBar;\r\n        }\r\n    }    \r\n}\r\n","<aside\r\n    class=\"sds-side-bar \"\r\n    [class]=\"(product ? 'product-' + product : null)\"\r\n    [class.sds-main-side-bar] = \"isMainSideBar\"\r\n    [class.hide-sidebar]=\"!showSideBar\"\r\n>\r\n    <div class=\"d-flex flex-column h-100\">\r\n        <div class=\"d-flex flex-column flex-grow-0 w-100 h-100\">\r\n            <div\r\n                *ngIf=\"showSideBarToggleButton\"\r\n                class=\"toggle-side-bar-button position-absolute d-md-none rounded-circle toggleSideBar d-flex justify-content-center justify-content-center align-items-center\"\r\n                [class.open]=\"showSideBar\"\r\n                [title]=\"showSideBar ? hideSideBarText : showSideBarText\"\r\n                (click)=\"toggleSideBar()\"\r\n            >\r\n                <div class=\"toggle-side-bar-icon\">\r\n                    <fa-icon [icon]=\"caretIcon\"></fa-icon>\r\n                </div>    \r\n            </div>\r\n\r\n            <ng-content></ng-content>                \r\n        </div>\r\n    </div>\r\n</aside>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsSideBarComponent } from './side-bar.component';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\n\r\n\r\n\r\nconst components = [\r\n    SdsSideBarComponent\r\n]\r\n@NgModule({\r\n  declarations: [\r\n    ...components\r\n  ],\r\n  imports: [\r\n    CommonModule, FontAwesomeModule\r\n  ],\r\n  exports: [\r\n    ...components\r\n  ]\r\n})\r\nexport class SdsSideBarModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}