@spicainternational/ngx-sds-components 2.5.1 → 2.6.0

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

@@ -1 +1 @@
-{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-avatar.mjs","sources":["../../../projects/ngx-sds-components/src/lib/avatar/avatar.component.ts","../../../projects/ngx-sds-components/src/lib/avatar/avatar.component.html","../../../projects/ngx-sds-components/src/lib/avatar/avatar-group.component.ts","../../../projects/ngx-sds-components/src/lib/avatar/avatar-group.component.html","../../../projects/ngx-sds-components/src/lib/avatar/avatar.module.ts","../../../projects/ngx-sds-components/src/lib/avatar/spicainternational-ngx-sds-components-src-lib-avatar.ts"],"sourcesContent":["import {\r\n    AfterViewInit,\r\n    Component,\r\n    Input,\r\n    OnChanges,\r\n    OnInit,\r\n    SimpleChanges,\r\n} from '@angular/core';\r\n\r\n@Component({\r\n    selector: 'sds-avatar',\r\n    templateUrl: './avatar.component.html',\r\n    styleUrls: ['./avatar.component.scss'],\r\n})\r\nexport class SdsAvatarComponent implements AfterViewInit, OnChanges {\r\n    @Input() text: string = '';\r\n    @Input() colorKey: string = '';\r\n    @Input() pictureUri: string = '';\r\n    @Input() showHint: boolean = false;\r\n    @Input() borderStyle: 'solid' | 'dashed' | 'dotted' | 'none' = 'none';\r\n    @Input() borderColor?: string;\r\n    @Input() initialsText?: string;\r\n    @Input() cursor?: string;\r\n\r\n    public isPictureReady: boolean = false;\r\n    public initials: string = '';\r\n\r\n    constructor() {}\r\n\r\n    ngAfterViewInit() {\r\n        this.loadUserPicture();\r\n    }\r\n\r\n    ngOnChanges(changes: SimpleChanges) {\r\n        if (\r\n            changes['text'] &&\r\n            changes['text'].currentValue != changes['text'].previousValue &&\r\n            this.initialsText == undefined\r\n        ) {\r\n            this.extractInitials();\r\n        }\r\n\r\n        if (\r\n            changes['pictureUri'] &&\r\n            changes['pictureUri'].currentValue !=\r\n                changes['pictureUri'].previousValue\r\n        ) {\r\n            this.loadUserPicture();\r\n        }\r\n\r\n        if (changes['initialsText'] && this.initialsText) {\r\n            this.initials = this.initialsText;\r\n        }\r\n    }\r\n\r\n    public setColorClass(): string {\r\n        if (this.colorKey) {\r\n            return 'color' + this.getColorIndex(this.colorKey);\r\n        }\r\n        return 'color18';\r\n    }\r\n\r\n    private extractInitials(): void {\r\n        this.initials = this.text\r\n            ? this.text\r\n                  .toUpperCase()\r\n                  .split(' ')\r\n                  .map((n) => n[0])\r\n                  .slice(0, 2)\r\n                  .join('')\r\n            : '';\r\n    }\r\n\r\n    private getColorIndex(s: string): number {\r\n        const length = 10;\r\n        if (!s) {\r\n            return 0;\r\n        }\r\n        let sumOfChars = s\r\n            .split('')\r\n            .map((x) => x.charCodeAt(0))\r\n            .reduce((a, b) => a + b, 0);\r\n        return sumOfChars % length;\r\n    }\r\n\r\n    public loadUserPicture() {\r\n        if (this.pictureUri && this.pictureUri !== '') {\r\n            this.isPictureReady = true;\r\n        } else {\r\n            this.isPictureReady = false;\r\n        }\r\n    }\r\n}\r\n","<div\r\n    class=\"avatar circle d-flex justify-content-center align-items-center\"\r\n    [class.hasPicture]=\"isPictureReady\"\r\n    [ngClass]=\"setColorClass()\"\r\n    [title]=\"showHint ? text : ''\"\r\n    [style.border-style]=\"borderStyle.toString()\"\r\n    [style.border-color]=\"borderColor\"\r\n    [style.cursor]=\"cursor ? cursor : 'default'\"\r\n>\r\n    <span \r\n        *ngIf=\"!isPictureReady\" \r\n        class=\"initials\"\r\n        >\r\n        {{ initials }}\r\n    </span>\r\n\r\n    <img \r\n        *ngIf=\"isPictureReady\" \r\n        [src]=\"pictureUri\"\r\n        alt=\"\" />\r\n</div>\r\n","import { Component, Input, OnChanges, OnInit, SimpleChanges, ViewChild } from '@angular/core';\nimport { PopoverDirective } from 'ngx-bootstrap/popover';\nimport { AvatarModel } from './avatar-group.model';\n\n@Component({\n    selector: 'sds-avatar-group',\n    templateUrl: './avatar-group.component.html',\n    styleUrls: ['./avatar-group.component.scss'],\n})\nexport class SdsAvatarGroupComponent implements OnInit, OnChanges {\n    @ViewChild('popover', {static: false}) private _popover: PopoverDirective | undefined;\n\n    @Input() public stacked: boolean = false;\n    @Input() public maxCount?: number;\n    @Input() public fontSize: number = 2;\n    @Input() public borderColor?: string;\n    @Input() public data: Array<AvatarModel> = [];\n\n    public overflow: Array<AvatarModel> = [];\n    public inflow: Array<AvatarModel> = [];\n\n\n    public overflowCountDisplay: string = '';\n    public overFlowBorderStyle: 'solid' | 'none' = 'none';\n\n    constructor() {}\n\n    ngOnChanges(changes: SimpleChanges): void {\n        if (changes['data'] || changes['maxCount']){\n            if (this.maxCount && this.data) {\n                this.overflow = [...this.data];\n                this.inflow = this.overflow.splice(0, this.maxCount);\n                console.log(this.overflow.length);\n                this.overflowCountDisplay = `+${Math.min(99, this.overflow.length)}`;\n                this.overFlowBorderStyle = this.data.filter(x => x.borderStyle).length > 0 ? 'solid' : 'none';\n            } else {\n                this.inflow = [...this.data];\n            }\n        }\n    }\n\n    ngOnInit(): void {}\n\n    public overflowAvatarClicked(event: MouseEvent) {\n        this._popover?.show();\n    }\n\n}\n","<div class=\"d-flex avatar-group-container\">\n    <sds-avatar *ngFor=\"let avatar of inflow\"\n        [text]=\"avatar.text\"\n        [colorKey]=\"avatar.colorKey\"\n        [borderColor]=\"borderColor\"\n        [borderStyle]=\"avatar.borderStyle ? avatar.borderStyle : 'none'\"\n        [pictureUri]=\"avatar.pictureUri ?? ''\"\n        [showHint]=\"true\"\n        [style.font-size.rem]=\"fontSize\"\n        [style.margin-right.rem]=\"stacked ? fontSize/-3 : fontSize/15\"\n        >\n    </sds-avatar>\n        \n    <sds-avatar \n        *ngIf=\"overflow.length > 0\"\n        class=\"overflow\"\n        [initialsText]=\"overflowCountDisplay\"\n        [borderColor]=\"borderColor\"\n        [borderStyle]=\"overFlowBorderStyle\"\n        cursor=\"pointer\"\n        [style.font-size.rem]=\"fontSize\"\n\n        [popover]=\"avatarGroupPopupTemplate\"\n        placement=\"bottom\"\n        [outsideClick]=\"true\"\n        container=\"body\"\n        triggers=\"\" \n        #popover=\"bs-popover\"\n        (click)=\"overflowAvatarClicked($event)\"\n        >\n    </sds-avatar>\n</div>\n\n<ng-template #avatarGroupPopupTemplate>\n    <div class=\"overflow-avatars-container rounded\">\n        <div *ngFor=\"let avatar of overflow\"\n            class=\"d-flex align-items-center pl-3 py-2 pr-5 my-2 overflow-avatar-container\" >\n            <sds-avatar\n                [text]=\"avatar.text\"\n                [colorKey]=\"avatar.colorKey\"\n                [borderStyle]=\"avatar.borderStyle ? avatar.borderStyle : 'none'\"\n                [pictureUri]=\"avatar.pictureUri ?? ''\"\n                borderColor=\"transparent\"\n                [style.font-size.rem]=\"1.8\" \n            >\n            </sds-avatar>\n            <div class=\"ml-3\">{{avatar.text}}</div>\n        </div>\n    </div>\n</ng-template>","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\n\r\nimport { PopoverModule } from 'ngx-bootstrap/popover';\r\n\r\nimport { SdsAvatarComponent } from './avatar.component';\r\nimport { SdsAvatarGroupComponent } from './avatar-group.component';\r\n\r\n\r\nconst components = [\r\n    SdsAvatarComponent,\r\n    SdsAvatarGroupComponent\r\n];\r\n@NgModule({\r\n  declarations: [\r\n    ...components\r\n  ],\r\n  imports: [\r\n    CommonModule,\r\n    PopoverModule.forRoot()\r\n\r\n  ],\r\n  exports: [\r\n      ...components\r\n  ]\r\n})\r\nexport class SdsAvatarModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.SdsAvatarComponent","i2","i1"],"mappings":"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"}
+{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-avatar.mjs","sources":["../../../projects/ngx-sds-components/src/lib/avatar/avatar.component.ts","../../../projects/ngx-sds-components/src/lib/avatar/avatar.component.html","../../../projects/ngx-sds-components/src/lib/avatar/avatar-group.component.ts","../../../projects/ngx-sds-components/src/lib/avatar/avatar-group.component.html","../../../projects/ngx-sds-components/src/lib/avatar/avatar.module.ts","../../../projects/ngx-sds-components/src/lib/avatar/spicainternational-ngx-sds-components-src-lib-avatar.ts"],"sourcesContent":["import {\r\n    AfterViewInit,\r\n    Component,\r\n    Input,\r\n    OnChanges,\r\n    OnInit,\r\n    SimpleChanges,\r\n} from '@angular/core';\r\n\r\n@Component({\r\n    selector: 'sds-avatar',\r\n    templateUrl: './avatar.component.html',\r\n    styleUrls: ['./avatar.component.scss'],\r\n})\r\nexport class SdsAvatarComponent implements AfterViewInit, OnChanges {\r\n    @Input() text: string = '';\r\n    @Input() colorKey: string = '';\r\n    @Input() pictureUri: string = '';\r\n    @Input() showHint: boolean = false;\r\n    @Input() borderStyle: 'solid' | 'dashed' | 'dotted' | 'none' = 'none';\r\n    @Input() borderColor?: string;\r\n    @Input() initialsText?: string;\r\n    @Input() cursor?: string;\r\n\r\n    public isPictureReady: boolean = false;\r\n    public initials: string = '';\r\n\r\n    constructor() {}\r\n\r\n    ngAfterViewInit() {\r\n        this.loadUserPicture();\r\n    }\r\n\r\n    ngOnChanges(changes: SimpleChanges) {\r\n        if (\r\n            changes['text'] &&\r\n            changes['text'].currentValue != changes['text'].previousValue &&\r\n            this.initialsText == undefined\r\n        ) {\r\n            this.extractInitials();\r\n        }\r\n\r\n        if (\r\n            changes['pictureUri'] &&\r\n            changes['pictureUri'].currentValue !=\r\n                changes['pictureUri'].previousValue\r\n        ) {\r\n            this.loadUserPicture();\r\n        }\r\n\r\n        if (changes['initialsText'] && this.initialsText) {\r\n            this.initials = this.initialsText;\r\n        }\r\n    }\r\n\r\n    public setColorClass(): string {\r\n        if (this.colorKey) {\r\n            return 'color' + this.getColorIndex(this.colorKey);\r\n        }\r\n        return 'color18';\r\n    }\r\n\r\n    private extractInitials(): void {\r\n        this.initials = this.text\r\n            ? this.text\r\n                  .toUpperCase()\r\n                  .split(' ')\r\n                  .map((n) => n[0])\r\n                  .slice(0, 2)\r\n                  .join('')\r\n            : '';\r\n    }\r\n\r\n    private getColorIndex(s: string): number {\r\n        const length = 10;\r\n        if (!s) {\r\n            return 0;\r\n        }\r\n        let sumOfChars = s\r\n            .split('')\r\n            .map((x) => x.charCodeAt(0))\r\n            .reduce((a, b) => a + b, 0);\r\n        return sumOfChars % length;\r\n    }\r\n\r\n    public loadUserPicture() {\r\n        if (this.pictureUri && this.pictureUri !== '') {\r\n            this.isPictureReady = true;\r\n        } else {\r\n            this.isPictureReady = false;\r\n        }\r\n    }\r\n}\r\n","<div\r\n    class=\"avatar circle d-flex justify-content-center align-items-center\"\r\n    [class.hasPicture]=\"isPictureReady\"\r\n    [ngClass]=\"setColorClass()\"\r\n    [title]=\"showHint ? text : ''\"\r\n    [style.border-style]=\"borderStyle.toString()\"\r\n    [style.border-color]=\"borderColor\"\r\n    [style.cursor]=\"cursor ? cursor : 'default'\"\r\n>\r\n    <span \r\n        *ngIf=\"!isPictureReady\" \r\n        class=\"initials\"\r\n        >\r\n        {{ initials }}\r\n    </span>\r\n\r\n    <img \r\n        *ngIf=\"isPictureReady\" \r\n        [src]=\"pictureUri\"\r\n        alt=\"\" />\r\n</div>\r\n","import { Component, Input, OnChanges, OnInit, SimpleChanges, ViewChild } from '@angular/core';\nimport { PopoverDirective } from 'ngx-bootstrap/popover';\nimport { AvatarModel } from './avatar-group.model';\n\n@Component({\n    selector: 'sds-avatar-group',\n    templateUrl: './avatar-group.component.html',\n    styleUrls: ['./avatar-group.component.scss'],\n})\nexport class SdsAvatarGroupComponent implements OnInit, OnChanges {\n    @ViewChild('popover', {static: false}) private _popover: PopoverDirective | undefined;\n\n    @Input() public stacked: boolean = false;\n    @Input() public maxCount?: number;\n    @Input() public fontSize: number = 2;\n    @Input() public borderColor?: string;\n    @Input() public data: Array<AvatarModel> = [];\n\n    public overflow: Array<AvatarModel> = [];\n    public inflow: Array<AvatarModel> = [];\n\n\n    public overflowCountDisplay: string = '';\n    public overFlowBorderStyle: 'solid' | 'none' = 'none';\n\n    constructor() {}\n\n    ngOnChanges(changes: SimpleChanges): void {\n        if (changes['data'] || changes['maxCount']){\n            if (this.maxCount && this.data) {\n                this.overflow = [...this.data];\n                this.inflow = this.overflow.splice(0, this.maxCount);\n                console.log(this.overflow.length);\n                this.overflowCountDisplay = `+${Math.min(99, this.overflow.length)}`;\n                this.overFlowBorderStyle = this.data.filter(x => x.borderStyle).length > 0 ? 'solid' : 'none';\n            } else {\n                this.inflow = [...this.data];\n            }\n        }\n    }\n\n    ngOnInit(): void {}\n\n    public overflowAvatarClicked(event: MouseEvent) {\n        this._popover?.show();\n    }\n\n}\n","<div class=\"d-flex avatar-group-container\">\n    <sds-avatar *ngFor=\"let avatar of inflow\"\n        [text]=\"avatar.text\"\n        [colorKey]=\"avatar.colorKey\"\n        [borderColor]=\"borderColor\"\n        [borderStyle]=\"avatar.borderStyle ? avatar.borderStyle : 'none'\"\n        [pictureUri]=\"avatar.pictureUri ?? ''\"\n        [showHint]=\"true\"\n        [style.font-size.rem]=\"fontSize\"\n        [style.margin-right.rem]=\"stacked ? fontSize/-3 : fontSize/15\"\n        >\n    </sds-avatar>\n        \n    <sds-avatar \n        *ngIf=\"overflow.length > 0\"\n        class=\"overflow\"\n        [initialsText]=\"overflowCountDisplay\"\n        [borderColor]=\"borderColor\"\n        [borderStyle]=\"overFlowBorderStyle\"\n        cursor=\"pointer\"\n        [style.font-size.rem]=\"fontSize\"\n\n        [popover]=\"avatarGroupPopupTemplate\"\n        placement=\"bottom\"\n        [outsideClick]=\"true\"\n        container=\"body\"\n        triggers=\"\" \n        #popover=\"bs-popover\"\n        (click)=\"overflowAvatarClicked($event)\"\n        >\n    </sds-avatar>\n</div>\n\n<ng-template #avatarGroupPopupTemplate>\n    <div class=\"overflow-avatars-container rounded\">\n        <div *ngFor=\"let avatar of overflow\"\n            class=\"d-flex align-items-center pl-3 py-2 pr-5 my-2 overflow-avatar-container\" >\n            <sds-avatar\n                [text]=\"avatar.text\"\n                [colorKey]=\"avatar.colorKey\"\n                [borderStyle]=\"avatar.borderStyle ? avatar.borderStyle : 'none'\"\n                [pictureUri]=\"avatar.pictureUri ?? ''\"\n                borderColor=\"transparent\"\n                [style.font-size.rem]=\"1.8\" \n            >\n            </sds-avatar>\n            <div class=\"ml-3\">{{avatar.text}}</div>\n        </div>\n    </div>\n</ng-template>","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\n\r\nimport { PopoverModule } from 'ngx-bootstrap/popover';\r\n\r\nimport { SdsAvatarComponent } from './avatar.component';\r\nimport { SdsAvatarGroupComponent } from './avatar-group.component';\r\n\r\n\r\nconst components = [\r\n    SdsAvatarComponent,\r\n    SdsAvatarGroupComponent\r\n];\r\n@NgModule({\r\n  declarations: [\r\n    ...components\r\n  ],\r\n  imports: [\r\n    CommonModule,\r\n    PopoverModule\r\n\r\n  ],\r\n  exports: [\r\n      ...components\r\n  ]\r\n})\r\nexport class SdsAvatarModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.SdsAvatarComponent","i2"],"mappings":"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"}

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

@@ -54,11 +54,12 @@ class SdsColorPickerModule {
 }
 SdsColorPickerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsColorPickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
 SdsColorPickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsColorPickerModule, declarations: [SdsColorPickerComponent], imports: [CommonModule,
-        FontAwesomeModule, i3.BsDropdownModule], exports: [SdsColorPickerComponent] });
+        FontAwesomeModule,
+        BsDropdownModule], exports: [SdsColorPickerComponent] });
 SdsColorPickerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsColorPickerModule, imports: [[
             CommonModule,
             FontAwesomeModule,
-            BsDropdownModule.forRoot()
+            BsDropdownModule
         ]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsColorPickerModule, decorators: [{
             type: NgModule,
@@ -69,7 +70,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
                     imports: [
                         CommonModule,
                         FontAwesomeModule,
-                        BsDropdownModule.forRoot()
+                        BsDropdownModule
                     ],
                     exports: [
                         ...components

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

@@ -1 +1 @@
-{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-color-picker.mjs","sources":["../../../projects/ngx-sds-components/src/lib/color-picker/color-picker.component.ts","../../../projects/ngx-sds-components/src/lib/color-picker/color-picker.component.html","../../../projects/ngx-sds-components/src/lib/color-picker/color-picker.module.ts","../../../projects/ngx-sds-components/src/lib/color-picker/spicainternational-ngx-sds-components-src-lib-color-picker.ts"],"sourcesContent":["import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';\nimport { faCheck } from '@fortawesome/pro-solid-svg-icons';\n\n\n@Component({\n    selector: 'sds-color-picker',\n    templateUrl: './color-picker.component.html',\n    styleUrls: ['./color-picker.component.scss'],\n})\nexport class SdsColorPickerComponent implements OnInit, OnChanges {\n    @Input() colors: Array<string> = [];\n    @Input() disabled: boolean = false;\n    @Input() selectedColor?: string;\n    @Input() defaultColor?: string;\n    @Output() selectedColorChange: EventEmitter<string>;\n    @Input() style: 'inline' | 'dropdown' = 'inline'\n\n    public checkIcon = faCheck;\n    public dropdownGridTemplateColumns?: string;\n\n    constructor() {\n        this.selectedColorChange = new EventEmitter<string>();\n    }\n    ngOnChanges(changes: SimpleChanges): void {\n        if (changes['colors']) {\n            const gridSize = Math.ceil(Math.sqrt(this.colors.length));\n            this.dropdownGridTemplateColumns = `repeat(${gridSize}, 1fr)`;\n        }\n    }\n\n    ngOnInit(): void {}\n\n    public selectColor(color: string): void {\n        if (!this.disabled) {\n            this.selectedColor = color;\n            this.selectedColorChange.emit(color);\n        }\n    }\n}\n","<div\n    *ngIf=\"style === 'inline'\"\n    class=\"color-tiles-container-inline\">\n    <div\n        *ngFor=\"let color of colors\"\n        [style.background-color]=\"color\"\n        class=\"color-tile\"\n        (click)=\"selectColor(color)\"\n    >\n        <fa-icon\n            *ngIf=\"selectedColor === color\"\n            [icon]=\"checkIcon\"\n        >\n        </fa-icon>\n    </div>\n</div>\n\n<div\n    *ngIf=\"style === 'dropdown'\"\n    class=\"btn-group\"\n    dropdown\n>\n    <button\n        dropdownToggle\n        type=\"button\"\n        class=\"btn dropdown-toggle d-flex align-items-center\"\n        aria-controls=\"dropdown-basic\"\n    >\n        <div\n            class=\"color-tile\"\n            [style.background-color]=\"selectedColor || defaultColor\"\n            [class.undefined-color]=\"!(selectedColor || defaultColor)\"\n        >\n        </div>\n        <div class=\"caret\"></div>\n    </button>\n\n    <div\n        *dropdownMenu\n        class=\"dropdown-menu\"\n        role=\"menu\"\n        aria-labelledby=\"app-switcher-button\"\n    >\n        <div\n            class=\"color-tiles-container-square\"\n            [ngStyle]=\"{ 'grid-template-columns': dropdownGridTemplateColumns}\"\n        >\n            <div\n                *ngFor=\"let color of colors\"\n                [style.background-color]=\"color\"\n                class=\"color-tile rounded-circle\"\n                (click)=\"selectColor(color)\"\n            >\n                <fa-icon\n                    *ngIf=\"selectedColor === color\"\n                    [icon]=\"checkIcon\"\n                >\n                </fa-icon>\n            </div>\n        </div>\n\n    </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { SdsColorPickerComponent } from './color-picker.component';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\nimport { BsDropdownModule } from 'ngx-bootstrap/dropdown';\n\n\nconst components = [SdsColorPickerComponent];\n@NgModule({\n  declarations: [\n    ...components\n  ],\n  imports: [\n    CommonModule,\n    FontAwesomeModule,\n    BsDropdownModule.forRoot()\n  ],\n  exports: [\n      ...components\n  ]\n})\nexport class SdsColorPickerModule { }\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-color-picker.mjs","sources":["../../../projects/ngx-sds-components/src/lib/color-picker/color-picker.component.ts","../../../projects/ngx-sds-components/src/lib/color-picker/color-picker.component.html","../../../projects/ngx-sds-components/src/lib/color-picker/color-picker.module.ts","../../../projects/ngx-sds-components/src/lib/color-picker/spicainternational-ngx-sds-components-src-lib-color-picker.ts"],"sourcesContent":["import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';\nimport { faCheck } from '@fortawesome/pro-solid-svg-icons';\n\n\n@Component({\n    selector: 'sds-color-picker',\n    templateUrl: './color-picker.component.html',\n    styleUrls: ['./color-picker.component.scss'],\n})\nexport class SdsColorPickerComponent implements OnInit, OnChanges {\n    @Input() colors: Array<string> = [];\n    @Input() disabled: boolean = false;\n    @Input() selectedColor?: string;\n    @Input() defaultColor?: string;\n    @Output() selectedColorChange: EventEmitter<string>;\n    @Input() style: 'inline' | 'dropdown' = 'inline'\n\n    public checkIcon = faCheck;\n    public dropdownGridTemplateColumns?: string;\n\n    constructor() {\n        this.selectedColorChange = new EventEmitter<string>();\n    }\n    ngOnChanges(changes: SimpleChanges): void {\n        if (changes['colors']) {\n            const gridSize = Math.ceil(Math.sqrt(this.colors.length));\n            this.dropdownGridTemplateColumns = `repeat(${gridSize}, 1fr)`;\n        }\n    }\n\n    ngOnInit(): void {}\n\n    public selectColor(color: string): void {\n        if (!this.disabled) {\n            this.selectedColor = color;\n            this.selectedColorChange.emit(color);\n        }\n    }\n}\n","<div\n    *ngIf=\"style === 'inline'\"\n    class=\"color-tiles-container-inline\">\n    <div\n        *ngFor=\"let color of colors\"\n        [style.background-color]=\"color\"\n        class=\"color-tile\"\n        (click)=\"selectColor(color)\"\n    >\n        <fa-icon\n            *ngIf=\"selectedColor === color\"\n            [icon]=\"checkIcon\"\n        >\n        </fa-icon>\n    </div>\n</div>\n\n<div\n    *ngIf=\"style === 'dropdown'\"\n    class=\"btn-group\"\n    dropdown\n>\n    <button\n        dropdownToggle\n        type=\"button\"\n        class=\"btn dropdown-toggle d-flex align-items-center\"\n        aria-controls=\"dropdown-basic\"\n    >\n        <div\n            class=\"color-tile\"\n            [style.background-color]=\"selectedColor || defaultColor\"\n            [class.undefined-color]=\"!(selectedColor || defaultColor)\"\n        >\n        </div>\n        <div class=\"caret\"></div>\n    </button>\n\n    <div\n        *dropdownMenu\n        class=\"dropdown-menu\"\n        role=\"menu\"\n        aria-labelledby=\"app-switcher-button\"\n    >\n        <div\n            class=\"color-tiles-container-square\"\n            [ngStyle]=\"{ 'grid-template-columns': dropdownGridTemplateColumns}\"\n        >\n            <div\n                *ngFor=\"let color of colors\"\n                [style.background-color]=\"color\"\n                class=\"color-tile rounded-circle\"\n                (click)=\"selectColor(color)\"\n            >\n                <fa-icon\n                    *ngIf=\"selectedColor === color\"\n                    [icon]=\"checkIcon\"\n                >\n                </fa-icon>\n            </div>\n        </div>\n\n    </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { SdsColorPickerComponent } from './color-picker.component';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\nimport { BsDropdownModule } from 'ngx-bootstrap/dropdown';\n\n\nconst components = [SdsColorPickerComponent];\n@NgModule({\n  declarations: [\n    ...components\n  ],\n  imports: [\n    CommonModule,\n    FontAwesomeModule,\n    BsDropdownModule\n  ],\n  exports: [\n      ...components\n  ]\n})\nexport class SdsColorPickerModule { }\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

@@ -15,6 +15,7 @@ class SdsModalComponent {
         this.showCloseButton = true;
         this.modalOpen = new EventEmitter();
         this.modalClose = new EventEmitter();
+        this.closeClick = new EventEmitter();
         this.closeIcon = faXmark;
     }
     ngOnInit() { }
@@ -30,12 +31,16 @@ class SdsModalComponent {
             this.modalClose.emit();
         }
     }
+    onCloseButtonClick() {
+        this.closeClick.emit();
+        this.close();
+    }
 }
 SdsModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SdsModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsModalComponent, selector: "sds-modal", inputs: { modalTitle: "modalTitle", showHeader: "showHeader", showFooter: "showFooter", closeText: "closeText", size: "size", modalDialogId: "modalDialogId", showCloseButton: "showCloseButton" }, outputs: { modalOpen: "modalOpen", modalClose: "modalClose" }, queries: [{ propertyName: "headerContent", first: true, predicate: ["header"], descendants: true }], viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true }], ngImport: i0, template: "<div #modal class=\"modal\">\n    <div\n        class=\"modal-dialog modal-dialog-centered modal-dialog-scrollable\"\n        [id]=\"modalDialogId\"\n        [ngClass]=\"'modal-' + size\"\n        role=\"document\"\n    >\n        <div class=\"modal-content\">\n\n            <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\n                <ng-content select='header'></ng-content>\n            </div>             \n\n            <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\n                <h5 class=\"modal-title\">{{modalTitle}}</h5>\n                <button \n                    *ngIf=\"showCloseButton\"\n                    type=\"button\" \n                    class=\"close\" \n                    [title]=\"closeText\"\n                    (click)=\"close()\">\n                    <fa-icon [icon]=\"closeIcon\"></fa-icon>\n                </button>\n            </div>\n\n            <div class=\"modal-body\">\n                <ng-content></ng-content>\n            </div>\n\n            <div *ngIf=\"showFooter\" class=\"modal-footer\">\n                <ng-content select=\"footer\"></ng-content>\n            </div>            \n        </div>\n    </div>\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\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.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+SdsModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsModalComponent, selector: "sds-modal", inputs: { modalTitle: "modalTitle", showHeader: "showHeader", showFooter: "showFooter", closeText: "closeText", size: "size", modalDialogId: "modalDialogId", showCloseButton: "showCloseButton" }, outputs: { modalOpen: "modalOpen", modalClose: "modalClose", closeClick: "closeClick" }, queries: [{ propertyName: "headerContent", first: true, predicate: ["header"], descendants: true }], viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true }], ngImport: i0, template: "<div #modal class=\"modal\">\n    <div\n        class=\"modal-dialog modal-dialog-centered modal-dialog-scrollable\"\n        [id]=\"modalDialogId\"\n        [ngClass]=\"'modal-' + size\"\n        role=\"document\"\n    >\n        <div class=\"modal-content\">\n\n            <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\n                <ng-content select='header'></ng-content>\n            </div>             \n\n            <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\n                <h5 class=\"modal-title\">{{modalTitle}}</h5>\n                <button \n                    *ngIf=\"showCloseButton\"\n                    type=\"button\" \n                    class=\"close\" \n                    [title]=\"closeText ? closeText : ''\"\n                    (click)=\"onCloseButtonClick()\">\n                    <fa-icon [icon]=\"closeIcon\"></fa-icon>\n                </button>\n            </div>\n\n            <div class=\"modal-body\">\n                <ng-content></ng-content>\n            </div>\n\n            <div *ngIf=\"showFooter\" class=\"modal-footer\">\n                <ng-content select=\"footer\"></ng-content>\n            </div>            \n        </div>\n    </div>\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\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.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sds-modal', template: "<div #modal class=\"modal\">\n    <div\n        class=\"modal-dialog modal-dialog-centered modal-dialog-scrollable\"\n        [id]=\"modalDialogId\"\n        [ngClass]=\"'modal-' + size\"\n        role=\"document\"\n    >\n        <div class=\"modal-content\">\n\n            <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\n                <ng-content select='header'></ng-content>\n            </div>             \n\n            <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\n                <h5 class=\"modal-title\">{{modalTitle}}</h5>\n                <button \n                    *ngIf=\"showCloseButton\"\n                    type=\"button\" \n                    class=\"close\" \n                    [title]=\"closeText\"\n                    (click)=\"close()\">\n                    <fa-icon [icon]=\"closeIcon\"></fa-icon>\n                </button>\n            </div>\n\n            <div class=\"modal-body\">\n                <ng-content></ng-content>\n            </div>\n\n            <div *ngIf=\"showFooter\" class=\"modal-footer\">\n                <ng-content select=\"footer\"></ng-content>\n            </div>            \n        </div>\n    </div>\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"] }]
+            args: [{ selector: 'sds-modal', template: "<div #modal class=\"modal\">\n    <div\n        class=\"modal-dialog modal-dialog-centered modal-dialog-scrollable\"\n        [id]=\"modalDialogId\"\n        [ngClass]=\"'modal-' + size\"\n        role=\"document\"\n    >\n        <div class=\"modal-content\">\n\n            <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\n                <ng-content select='header'></ng-content>\n            </div>             \n\n            <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\n                <h5 class=\"modal-title\">{{modalTitle}}</h5>\n                <button \n                    *ngIf=\"showCloseButton\"\n                    type=\"button\" \n                    class=\"close\" \n                    [title]=\"closeText ? closeText : ''\"\n                    (click)=\"onCloseButtonClick()\">\n                    <fa-icon [icon]=\"closeIcon\"></fa-icon>\n                </button>\n            </div>\n\n            <div class=\"modal-body\">\n                <ng-content></ng-content>\n            </div>\n\n            <div *ngIf=\"showFooter\" class=\"modal-footer\">\n                <ng-content select=\"footer\"></ng-content>\n            </div>            \n        </div>\n    </div>\n</div>", styles: [".modal{background:rgba(0,0,0,.5)}.modal.in{opacity:1}.modal.in .modal-dialog{transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { headerContent: [{
                 type: ContentChild,
                 args: ['header']
@@ -57,6 +62,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
                 type: Output
             }], modalClose: [{
                 type: Output
+            }], closeClick: [{
+                type: Output
             }], _modal: [{
                 type: ViewChild,
                 args: ['modal', { static: false }]
@@ -65,30 +72,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
 class SdsDialogComponent {
     constructor() {
         this.title = '';
+        this.closeText = 'close';
         this.size = 'md';
-        this.isOpen = false;
-        this.primaryButtonText = 'Primary button';
-        this.secondaryButtonText = 'Secondary button';
+        this.primaryButtonText = 'Ok';
+        this.secondaryButtonText = 'Cancel';
         this.primaryButtonClass = 'btn-primary';
-        this.primaryClick = new EventEmitter();
         this.secondaryButtonClass = 'btn-secondary';
-        this.secondaryClick = new EventEmitter();
-        this.showSecondaryButton = true;
-        this.showCloseButton = true;
         this.showHeader = true;
-    }
-    ngOnChanges(changes) {
-        if (changes['isOpen']) {
-            if (this.isOpen) {
-                this.open();
-            }
-            else {
-                this.close();
-            }
-        }
+        this.showCloseButton = true;
+        this.showSecondaryButton = true;
     }
     ngOnInit() { }
-    open() {
+    open(callback, data) {
+        this._callback = callback;
+        this._callbackData = data;
         if (this._modal != undefined) {
             this._modal.open();
         }
@@ -99,44 +96,47 @@ class SdsDialogComponent {
         }
     }
     onSecondaryClick() {
-        this.secondaryClick.emit();
+        if (this._callback) {
+            this._callback('secondary', this._callbackData);
+        }
         this.close();
     }
     onPrimaryClick() {
-        this.primaryClick.emit();
+        if (this._callback) {
+            this._callback('primary', this._callbackData);
+        }
         this.close();
     }
+    onCloseClick() {
+        if (this._callback) {
+            this._callback('close', this._callbackData);
+        }
+    }
 }
 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", isOpen: "isOpen", primaryButtonText: "primaryButtonText", secondaryButtonText: "secondaryButtonText", primaryButtonClass: "primaryButtonClass", secondaryButtonClass: "secondaryButtonClass", showSecondaryButton: "showSecondaryButton", showCloseButton: "showCloseButton", showHeader: "showHeader" }, outputs: { primaryClick: "primaryClick", secondaryClick: "secondaryClick" }, viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<sds-modal\n    #modal\n    [modalTitle]=\"title\"\n    [size]=\"size\"\n    [closeText]=\"closeText\"\n    [showCloseButton]=\"showCloseButton\"\n    [showHeader]=\"showHeader\"\n>\n    <div>\n        <ng-content></ng-content>\n    </div>\n\n    <ng-container #footer ngProjectAs='footer'>\n        <button\n            *ngIf=\"showSecondaryButton\"\n            class=\"btn\"\n            [class]=\"secondaryButtonClass\"\n            (click)=\"onSecondaryClick()\"\n        >{{secondaryButtonText}}</button>\n        <button\n            class=\"btn\"\n            [class]=\"primaryButtonClass\"\n            (click)=\"onPrimaryClick()\"\n        >{{primaryButtonText}}</button>\n    </ng-container>\n</sds-modal>", styles: [""], components: [{ type: SdsModalComponent, selector: "sds-modal", inputs: ["modalTitle", "showHeader", "showFooter", "closeText", "size", "modalDialogId", "showCloseButton"], outputs: ["modalOpen", "modalClose"] }], 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", secondaryButtonText: "secondaryButtonText", primaryButtonClass: "primaryButtonClass", secondaryButtonClass: "secondaryButtonClass", showHeader: "showHeader", showCloseButton: "showCloseButton", showSecondaryButton: "showSecondaryButton" }, viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true, static: true }], ngImport: i0, template: "<sds-modal\n    #modal\n    [modalTitle]=\"title\"\n    [size]=\"size\"\n    [closeText]=\"closeText\"\n    [showCloseButton]=\"showCloseButton\"\n    [showHeader]=\"showHeader\"\n    (closeClick)=\"onCloseClick()\"\n>\n    <div>\n        <ng-content></ng-content>\n    </div>\n\n    <ng-container #footer ngProjectAs='footer'>\n        <button\n            *ngIf=\"showSecondaryButton\"\n            class=\"btn\"\n            [class]=\"secondaryButtonClass\"\n            (click)=\"onSecondaryClick()\"\n        >{{secondaryButtonText}}</button>\n        <button\n            class=\"btn\"\n            [class]=\"primaryButtonClass\"\n            (click)=\"onPrimaryClick()\"\n        >{{primaryButtonText}}</button>\n    </ng-container>\n</sds-modal>", styles: [""], components: [{ type: SdsModalComponent, selector: "sds-modal", inputs: ["modalTitle", "showHeader", "showFooter", "closeText", "size", "modalDialogId", "showCloseButton"], 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\n    #modal\n    [modalTitle]=\"title\"\n    [size]=\"size\"\n    [closeText]=\"closeText\"\n    [showCloseButton]=\"showCloseButton\"\n    [showHeader]=\"showHeader\"\n>\n    <div>\n        <ng-content></ng-content>\n    </div>\n\n    <ng-container #footer ngProjectAs='footer'>\n        <button\n            *ngIf=\"showSecondaryButton\"\n            class=\"btn\"\n            [class]=\"secondaryButtonClass\"\n            (click)=\"onSecondaryClick()\"\n        >{{secondaryButtonText}}</button>\n        <button\n            class=\"btn\"\n            [class]=\"primaryButtonClass\"\n            (click)=\"onPrimaryClick()\"\n        >{{primaryButtonText}}</button>\n    </ng-container>\n</sds-modal>", styles: [""] }]
+            args: [{ selector: 'sds-dialog', template: "<sds-modal\n    #modal\n    [modalTitle]=\"title\"\n    [size]=\"size\"\n    [closeText]=\"closeText\"\n    [showCloseButton]=\"showCloseButton\"\n    [showHeader]=\"showHeader\"\n    (closeClick)=\"onCloseClick()\"\n>\n    <div>\n        <ng-content></ng-content>\n    </div>\n\n    <ng-container #footer ngProjectAs='footer'>\n        <button\n            *ngIf=\"showSecondaryButton\"\n            class=\"btn\"\n            [class]=\"secondaryButtonClass\"\n            (click)=\"onSecondaryClick()\"\n        >{{secondaryButtonText}}</button>\n        <button\n            class=\"btn\"\n            [class]=\"primaryButtonClass\"\n            (click)=\"onPrimaryClick()\"\n        >{{primaryButtonText}}</button>\n    </ng-container>\n</sds-modal>", styles: [""] }]
         }], ctorParameters: function () { return []; }, propDecorators: { title: [{
                 type: Input
             }], closeText: [{
                 type: Input
             }], size: [{
                 type: Input
-            }], isOpen: [{
-                type: Input
             }], primaryButtonText: [{
                 type: Input
             }], secondaryButtonText: [{
                 type: Input
             }], primaryButtonClass: [{
                 type: Input
-            }], primaryClick: [{
-                type: Output
             }], secondaryButtonClass: [{
                 type: Input
-            }], secondaryClick: [{
-                type: Output
-            }], showSecondaryButton: [{
+            }], showHeader: [{
                 type: Input
             }], showCloseButton: [{
                 type: Input
-            }], showHeader: [{
+            }], showSecondaryButton: [{
                 type: Input
             }], _modal: [{
                 type: ViewChild,

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} from '@angular/core';\r\nimport { faXmark } from '@fortawesome/pro-regular-svg-icons';\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 closeText?: string;\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    @Output() public modalOpen: EventEmitter<void> = new EventEmitter<void>();\r\n    @Output() public modalClose: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n    public closeIcon = faXmark;\r\n\r\n\r\n    @ViewChild('modal', { static: false }) private _modal: ElementRef | undefined;\r\n    \r\n\r\n    constructor() {}\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.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","<div #modal class=\"modal\">\n    <div\n        class=\"modal-dialog modal-dialog-centered modal-dialog-scrollable\"\n        [id]=\"modalDialogId\"\n        [ngClass]=\"'modal-' + size\"\n        role=\"document\"\n    >\n        <div class=\"modal-content\">\n\n            <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\n                <ng-content select='header'></ng-content>\n            </div>             \n\n            <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\n                <h5 class=\"modal-title\">{{modalTitle}}</h5>\n                <button \n                    *ngIf=\"showCloseButton\"\n                    type=\"button\" \n                    class=\"close\" \n                    [title]=\"closeText\"\n                    (click)=\"close()\">\n                    <fa-icon [icon]=\"closeIcon\"></fa-icon>\n                </button>\n            </div>\n\n            <div class=\"modal-body\">\n                <ng-content></ng-content>\n            </div>\n\n            <div *ngIf=\"showFooter\" class=\"modal-footer\">\n                <ng-content select=\"footer\"></ng-content>\n            </div>            \n        </div>\n    </div>\n</div>","import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';\nimport { SdsModalComponent } from '../modal.component';\n\n@Component({\n    selector: 'sds-dialog',\n    templateUrl: './dialog.component.html',\n    styleUrls: ['./dialog.component.scss'],\n})\nexport class SdsDialogComponent implements OnInit, OnChanges {\n    @Input() public title: string = '';\n    @Input() public closeText?: string;\n    @Input() public size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\n    @Input() public isOpen: boolean = false;\n    \n    @Input() public primaryButtonText: string = 'Primary button';\n    @Input() public secondaryButtonText: string = 'Secondary button';\n\n    @Input() public primaryButtonClass: string = 'btn-primary';\n    @Output() public primaryClick: EventEmitter<void> = new EventEmitter();\n\n    @Input() public secondaryButtonClass: string = 'btn-secondary';    \n    @Output() public secondaryClick: EventEmitter<void> = new EventEmitter();\n    @Input() public showSecondaryButton: boolean = true;\n\n    @Input() public showCloseButton: boolean = true;\n    @Input() public showHeader: boolean = true;\n\n    @ViewChild('modal', { static: true }) private _modal: SdsModalComponent | undefined;\n\n    constructor() {}\n    ngOnChanges(changes: SimpleChanges): void {\n        if (changes['isOpen']) {\n            if (this.isOpen) {\n                this.open();\n            } else {\n                this.close();\n            }\n\n        }\n\n    }\n\n    ngOnInit(): void {}\n\n\n    public open(): void {\n        if (this._modal != undefined) {\n            this._modal.open();\n        }\n    }\n\n    public close(): void {\n        if (this._modal != undefined) {\n            this._modal.close();\n        }        \n    }\n\n    public onSecondaryClick(): void {\n        this.secondaryClick.emit();\n        this.close();\n    }\n\n    public onPrimaryClick(): void {\n        this.primaryClick.emit();\n        this.close();\n    }    \n\n\n}\n\n\n\n","<sds-modal\n    #modal\n    [modalTitle]=\"title\"\n    [size]=\"size\"\n    [closeText]=\"closeText\"\n    [showCloseButton]=\"showCloseButton\"\n    [showHeader]=\"showHeader\"\n>\n    <div>\n        <ng-content></ng-content>\n    </div>\n\n    <ng-container #footer ngProjectAs='footer'>\n        <button\n            *ngIf=\"showSecondaryButton\"\n            class=\"btn\"\n            [class]=\"secondaryButtonClass\"\n            (click)=\"onSecondaryClick()\"\n        >{{secondaryButtonText}}</button>\n        <button\n            class=\"btn\"\n            [class]=\"primaryButtonClass\"\n            (click)=\"onPrimaryClick()\"\n        >{{primaryButtonText}}</button>\n    </ng-container>\n</sds-modal>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { SdsModalComponent } from './modal.component';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\nimport { SdsDialogComponent } from './dialog/dialog.component';\n\n\nconst components = [\n    SdsModalComponent,\n    SdsDialogComponent\n];\n\n@NgModule({\n  declarations: [\n    ...components\n  ],\n  imports: [\n    CommonModule,\n    FontAwesomeModule\n  ],\n  exports: [\n    ...components\n]\n})\nexport class SdsModalModule { }\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} from '@angular/core';\r\nimport { faXmark } from '@fortawesome/pro-regular-svg-icons';\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 closeText?: string;\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    @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\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.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","<div #modal class=\"modal\">\n    <div\n        class=\"modal-dialog modal-dialog-centered modal-dialog-scrollable\"\n        [id]=\"modalDialogId\"\n        [ngClass]=\"'modal-' + size\"\n        role=\"document\"\n    >\n        <div class=\"modal-content\">\n\n            <div *ngIf=\"showHeader && headerContent\" class=\"modal-header\">\n                <ng-content select='header'></ng-content>\n            </div>             \n\n            <div *ngIf=\"showHeader && !headerContent\" class=\"modal-header\">\n                <h5 class=\"modal-title\">{{modalTitle}}</h5>\n                <button \n                    *ngIf=\"showCloseButton\"\n                    type=\"button\" \n                    class=\"close\" \n                    [title]=\"closeText ? closeText : ''\"\n                    (click)=\"onCloseButtonClick()\">\n                    <fa-icon [icon]=\"closeIcon\"></fa-icon>\n                </button>\n            </div>\n\n            <div class=\"modal-body\">\n                <ng-content></ng-content>\n            </div>\n\n            <div *ngIf=\"showFooter\" class=\"modal-footer\">\n                <ng-content select=\"footer\"></ng-content>\n            </div>            \n        </div>\n    </div>\n</div>","import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';\nimport { SdsModalComponent } from '../modal.component';\n\ntype modalButton = 'primary' | 'secondary' | 'close';\n\n@Component({\n    selector: 'sds-dialog',\n    templateUrl: './dialog.component.html',\n    styleUrls: ['./dialog.component.scss'],\n})\nexport class SdsDialogComponent implements OnInit {\n    @Input() public title: string = '';\n    @Input() public closeText?: string = 'close';\n    @Input() public size: 'sm' | 'md' | 'lg' | 'xl' = 'md';\n    \n    @Input() public primaryButtonText: string = 'Ok';\n    @Input() public secondaryButtonText: string = 'Cancel';\n\n    @Input() public primaryButtonClass: string = 'btn-primary';\n    @Input() public secondaryButtonClass: string = 'btn-secondary';    \n    \n    @Input() public showHeader: boolean = true;\n    @Input() public showCloseButton: boolean = true;\n    @Input() public showSecondaryButton: boolean = true;\n\n    @ViewChild('modal', { static: true }) private _modal: SdsModalComponent | undefined;\n\n    private _callback?: Function;\n    private _callbackData: any;\n\n    constructor() {}\n\n    ngOnInit(): void {}\n\n    public open(callback?: (button: modalButton, data: any) => void, data?: any): void{\n        this._callback = callback;\n        this._callbackData = data;\n\n        if (this._modal != undefined) {\n            this._modal.open();\n        }\n    }\n\n    private close(): void {\n        if (this._modal != undefined) {\n            this._modal.close();\n        }        \n    }\n\n    public onSecondaryClick(): void {\n        if (this._callback) {\n            this._callback('secondary', this._callbackData);\n        }\n        this.close();\n    }\n\n    public onPrimaryClick(): void {\n        if (this._callback) {\n            this._callback('primary', this._callbackData);\n        }\n        this.close();\n    }    \n\n    public onCloseClick(): void {\n        if (this._callback) {\n            this._callback('close', this._callbackData);\n        }\n    }\n\n}\n\n\n\n","<sds-modal\n    #modal\n    [modalTitle]=\"title\"\n    [size]=\"size\"\n    [closeText]=\"closeText\"\n    [showCloseButton]=\"showCloseButton\"\n    [showHeader]=\"showHeader\"\n    (closeClick)=\"onCloseClick()\"\n>\n    <div>\n        <ng-content></ng-content>\n    </div>\n\n    <ng-container #footer ngProjectAs='footer'>\n        <button\n            *ngIf=\"showSecondaryButton\"\n            class=\"btn\"\n            [class]=\"secondaryButtonClass\"\n            (click)=\"onSecondaryClick()\"\n        >{{secondaryButtonText}}</button>\n        <button\n            class=\"btn\"\n            [class]=\"primaryButtonClass\"\n            (click)=\"onPrimaryClick()\"\n        >{{primaryButtonText}}</button>\n    </ng-container>\n</sds-modal>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { SdsModalComponent } from './modal.component';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\nimport { SdsDialogComponent } from './dialog/dialog.component';\n\n\nconst components = [\n    SdsModalComponent,\n    SdsDialogComponent\n];\n\n@NgModule({\n  declarations: [\n    ...components\n  ],\n  imports: [\n    CommonModule,\n    FontAwesomeModule\n  ],\n  exports: [\n    ...components\n]\n})\nexport class SdsModalModule { }\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-pane.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, Input, Output, NgModule } from '@angular/core';
+import { EventEmitter, Component, ChangeDetectionStrategy, Input, Output, NgModule } from '@angular/core';
 import * as i2 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import { faXmark } from '@fortawesome/pro-regular-svg-icons';
@@ -10,28 +10,27 @@ class SdsPaneComponent {
     constructor() {
         this.contentWidthRem = 20;
         this.pageChange = new EventEmitter();
-        this.isContentVisible = false;
         this.closeIcon = faXmark;
     }
     ngOnInit() { }
     showContent(page) {
         this.selectedPage = page;
-        this.isContentVisible = true;
         this.pageChange.emit(this.selectedPage);
     }
     hideContent() {
-        this.isContentVisible = false;
         this.selectedPage = undefined;
         this.pageChange.emit(this.selectedPage);
     }
 }
 SdsPaneComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsPaneComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SdsPaneComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsPaneComponent, selector: "sds-pane", inputs: { pages: "pages", contentWidthRem: "contentWidthRem" }, outputs: { pageChange: "pageChange" }, ngImport: i0, template: "<div class=\"pane border-left\">\n    <div class=\"pane-header\">\n        <ul>\n            <li \n                *ngFor=\"let page of pages\"\n                [class.active] = \"selectedPage === page\"\n                >\n                <div \n                    class=\"icon-container\"\n                    [title]=\"page.title\"\n                    (click) = \"showContent(page)\"\n                    >\n                    <fa-icon [icon]=\"page.icon\" [fixedWidth]=\"true\"> </fa-icon>\n                </div>\n            </li>\n        </ul>\n    </div>\n\n    <div \n        *ngIf=\"selectedPage\" \n        class=\"pane-content\"\n        [style.width.rem]=\"contentWidthRem\"\n        >\n        \n        <div class=\"page-header\">\n            <div class=\"title\">\n                {{selectedPage?.title}}\n            </div>\n\n            <button \n                class=\"btn btn-stealth ml-auto\"\n                (click)=\"hideContent()\"\n                >\n                <fa-icon [icon]=\"closeIcon\" [fixedWidth]=\"true\"> </fa-icon>        \n            </button>  \n\n        </div>\n\n        <div class=\"page-container\">\n            <ng-container\n                [ngTemplateOutlet]=\"selectedPage && selectedPage.contentTemplate ? selectedPage.contentTemplate : null\"\n            >\n            </ng-container>            \n        </div>\n    </div>\n</div>", styles: [""], 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.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
+SdsPaneComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SdsPaneComponent, selector: "sds-pane", inputs: { pages: "pages", selectedPage: "selectedPage", contentWidthRem: "contentWidthRem" }, outputs: { pageChange: "pageChange" }, ngImport: i0, template: "<div class=\"pane border-left\">\n    <div class=\"pane-header\">\n        <ul>\n            <li \n                *ngFor=\"let page of pages\"\n                [class.active] = \"selectedPage === page\"\n                >\n                <div \n                    class=\"icon-container\"\n                    [title]=\"page.title\"\n                    (click) = \"showContent(page)\"\n                    >\n                    <fa-icon [icon]=\"page.icon\" [fixedWidth]=\"true\"> </fa-icon>\n                </div>\n            </li>\n        </ul>\n    </div>\n\n    <div \n        *ngIf=\"selectedPage\" \n        class=\"pane-content\"\n        [style.width.rem]=\"contentWidthRem\"\n        >\n        \n        <div class=\"page-header\">\n            <div class=\"title\">\n                {{selectedPage?.title}}\n            </div>\n\n            <button \n                class=\"btn btn-stealth ml-auto\"\n                (click)=\"hideContent()\"\n                >\n                <fa-icon [icon]=\"closeIcon\" [fixedWidth]=\"true\"> </fa-icon>        \n            </button>  \n\n        </div>\n\n        <div class=\"page-container\">\n            <ng-container\n                [ngTemplateOutlet]=\"selectedPage && selectedPage.contentTemplate ? selectedPage.contentTemplate : null\"\n            >\n            </ng-container>            \n        </div>\n    </div>\n</div>", styles: [""], 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.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SdsPaneComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sds-pane', template: "<div class=\"pane border-left\">\n    <div class=\"pane-header\">\n        <ul>\n            <li \n                *ngFor=\"let page of pages\"\n                [class.active] = \"selectedPage === page\"\n                >\n                <div \n                    class=\"icon-container\"\n                    [title]=\"page.title\"\n                    (click) = \"showContent(page)\"\n                    >\n                    <fa-icon [icon]=\"page.icon\" [fixedWidth]=\"true\"> </fa-icon>\n                </div>\n            </li>\n        </ul>\n    </div>\n\n    <div \n        *ngIf=\"selectedPage\" \n        class=\"pane-content\"\n        [style.width.rem]=\"contentWidthRem\"\n        >\n        \n        <div class=\"page-header\">\n            <div class=\"title\">\n                {{selectedPage?.title}}\n            </div>\n\n            <button \n                class=\"btn btn-stealth ml-auto\"\n                (click)=\"hideContent()\"\n                >\n                <fa-icon [icon]=\"closeIcon\" [fixedWidth]=\"true\"> </fa-icon>        \n            </button>  \n\n        </div>\n\n        <div class=\"page-container\">\n            <ng-container\n                [ngTemplateOutlet]=\"selectedPage && selectedPage.contentTemplate ? selectedPage.contentTemplate : null\"\n            >\n            </ng-container>            \n        </div>\n    </div>\n</div>", styles: [""] }]
+            args: [{ selector: 'sds-pane', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"pane border-left\">\n    <div class=\"pane-header\">\n        <ul>\n            <li \n                *ngFor=\"let page of pages\"\n                [class.active] = \"selectedPage === page\"\n                >\n                <div \n                    class=\"icon-container\"\n                    [title]=\"page.title\"\n                    (click) = \"showContent(page)\"\n                    >\n                    <fa-icon [icon]=\"page.icon\" [fixedWidth]=\"true\"> </fa-icon>\n                </div>\n            </li>\n        </ul>\n    </div>\n\n    <div \n        *ngIf=\"selectedPage\" \n        class=\"pane-content\"\n        [style.width.rem]=\"contentWidthRem\"\n        >\n        \n        <div class=\"page-header\">\n            <div class=\"title\">\n                {{selectedPage?.title}}\n            </div>\n\n            <button \n                class=\"btn btn-stealth ml-auto\"\n                (click)=\"hideContent()\"\n                >\n                <fa-icon [icon]=\"closeIcon\" [fixedWidth]=\"true\"> </fa-icon>        \n            </button>  \n\n        </div>\n\n        <div class=\"page-container\">\n            <ng-container\n                [ngTemplateOutlet]=\"selectedPage && selectedPage.contentTemplate ? selectedPage.contentTemplate : null\"\n            >\n            </ng-container>            \n        </div>\n    </div>\n</div>", styles: [""] }]
         }], ctorParameters: function () { return []; }, propDecorators: { pages: [{
                 type: Input
+            }], selectedPage: [{
+                type: Input
             }], contentWidthRem: [{
                 type: Input
             }], pageChange: [{

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

@@ -1 +1 @@
-{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-pane.mjs","sources":["../../../projects/ngx-sds-components/src/lib/pane/pane.component.ts","../../../projects/ngx-sds-components/src/lib/pane/pane.component.html","../../../projects/ngx-sds-components/src/lib/pane/pane.module.ts","../../../projects/ngx-sds-components/src/lib/pane/spicainternational-ngx-sds-components-src-lib-pane.ts"],"sourcesContent":["import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport { PanePage } from './pane.model';\n\nimport { faXmark } from '@fortawesome/pro-regular-svg-icons';\n\n@Component({\n    selector: 'sds-pane',\n    templateUrl: './pane.component.html',\n    styleUrls: ['./pane.component.scss'],\n})\nexport class SdsPaneComponent implements OnInit {\n\n    @Input() pages?: PanePage[];\n    @Input() contentWidthRem: number = 20;\n\n    @Output() pageChange = new EventEmitter();\n\n    public selectedPage?: PanePage;\n    public isContentVisible: boolean = false;\n\n    public closeIcon = faXmark;\n\n    constructor() {}\n\n    ngOnInit(): void {}\n\n    public showContent(page: PanePage): void{\n        this.selectedPage = page;\n        this.isContentVisible = true;\n        this.pageChange.emit(this.selectedPage);\n    }\n\n    public hideContent(): void{\n        this.isContentVisible = false;\n        this.selectedPage = undefined;\n        this.pageChange.emit(this.selectedPage);\n    }\n\n\n}\n","<div class=\"pane border-left\">\n    <div class=\"pane-header\">\n        <ul>\n            <li \n                *ngFor=\"let page of pages\"\n                [class.active] = \"selectedPage === page\"\n                >\n                <div \n                    class=\"icon-container\"\n                    [title]=\"page.title\"\n                    (click) = \"showContent(page)\"\n                    >\n                    <fa-icon [icon]=\"page.icon\" [fixedWidth]=\"true\"> </fa-icon>\n                </div>\n            </li>\n        </ul>\n    </div>\n\n    <div \n        *ngIf=\"selectedPage\" \n        class=\"pane-content\"\n        [style.width.rem]=\"contentWidthRem\"\n        >\n        \n        <div class=\"page-header\">\n            <div class=\"title\">\n                {{selectedPage?.title}}\n            </div>\n\n            <button \n                class=\"btn btn-stealth ml-auto\"\n                (click)=\"hideContent()\"\n                >\n                <fa-icon [icon]=\"closeIcon\" [fixedWidth]=\"true\"> </fa-icon>        \n            </button>  \n\n        </div>\n\n        <div class=\"page-container\">\n            <ng-container\n                [ngTemplateOutlet]=\"selectedPage && selectedPage.contentTemplate ? selectedPage.contentTemplate : null\"\n            >\n            </ng-container>            \n        </div>\n    </div>\n</div>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { SdsPaneComponent } from '../pane/pane.component';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\n\n@NgModule({\n    declarations: [\n        SdsPaneComponent\n    ],\n    imports: [\n        CommonModule, \n        FontAwesomeModule\n    ],\n    exports: [\n        SdsPaneComponent\n    ],\n})\nexport class SdsPaneModule {}\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-pane.mjs","sources":["../../../projects/ngx-sds-components/src/lib/pane/pane.component.ts","../../../projects/ngx-sds-components/src/lib/pane/pane.component.html","../../../projects/ngx-sds-components/src/lib/pane/pane.module.ts","../../../projects/ngx-sds-components/src/lib/pane/spicainternational-ngx-sds-components-src-lib-pane.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';\nimport { PanePage } from './pane.model';\n\nimport { faXmark } from '@fortawesome/pro-regular-svg-icons';\n\n@Component({\n    selector: 'sds-pane',\n    templateUrl: './pane.component.html',\n    styleUrls: ['./pane.component.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SdsPaneComponent implements OnInit {\n\n    @Input() public pages?: PanePage[];\n    @Input() public selectedPage?: PanePage;\n    @Input() public contentWidthRem: number = 20;\n    \n    @Output() pageChange = new EventEmitter();\n\n    public closeIcon = faXmark;\n\n    constructor() {}\n\n    ngOnInit(): void {}\n\n    public showContent(page: PanePage): void{\n        this.selectedPage = page;\n        this.pageChange.emit(this.selectedPage);\n    }\n\n    public hideContent(): void{\n        this.selectedPage = undefined;\n        this.pageChange.emit(this.selectedPage);\n    }\n\n\n}\n","<div class=\"pane border-left\">\n    <div class=\"pane-header\">\n        <ul>\n            <li \n                *ngFor=\"let page of pages\"\n                [class.active] = \"selectedPage === page\"\n                >\n                <div \n                    class=\"icon-container\"\n                    [title]=\"page.title\"\n                    (click) = \"showContent(page)\"\n                    >\n                    <fa-icon [icon]=\"page.icon\" [fixedWidth]=\"true\"> </fa-icon>\n                </div>\n            </li>\n        </ul>\n    </div>\n\n    <div \n        *ngIf=\"selectedPage\" \n        class=\"pane-content\"\n        [style.width.rem]=\"contentWidthRem\"\n        >\n        \n        <div class=\"page-header\">\n            <div class=\"title\">\n                {{selectedPage?.title}}\n            </div>\n\n            <button \n                class=\"btn btn-stealth ml-auto\"\n                (click)=\"hideContent()\"\n                >\n                <fa-icon [icon]=\"closeIcon\" [fixedWidth]=\"true\"> </fa-icon>        \n            </button>  \n\n        </div>\n\n        <div class=\"page-container\">\n            <ng-container\n                [ngTemplateOutlet]=\"selectedPage && selectedPage.contentTemplate ? selectedPage.contentTemplate : null\"\n            >\n            </ng-container>            \n        </div>\n    </div>\n</div>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { SdsPaneComponent } from '../pane/pane.component';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\n\n@NgModule({\n    declarations: [\n        SdsPaneComponent\n    ],\n    imports: [\n        CommonModule, \n        FontAwesomeModule\n    ],\n    exports: [\n        SdsPaneComponent\n    ],\n})\nexport class SdsPaneModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spicainternational/ngx-sds-components",
-  "version": "2.5.1",
+  "version": "2.6.0",
   "description": "Spica design system angular components.",
   "peerDependencies": {
     "@angular/common": ">=10.0.0",
@@ -10,8 +10,8 @@
     "@fortawesome/pro-light-svg-icons": "^6.1.0",
     "@fortawesome/pro-regular-svg-icons": "^6.1.0",
     "@fortawesome/pro-solid-svg-icons": "^6.1.0",
-    "@spicainternational/sds-bootstrap": "^2.1.2",
-    "@spicainternational/sds-core": "^3.4.7",
+    "@spicainternational/sds-bootstrap": ">=2.1.2",
+    "@spicainternational/sds-core": ">=3.4.9",
     "devextreme": ">=19.0.0",
     "devextreme-angular": ">=19.0.0",
     "ngx-bootstrap": ">=7.0.0"

package/src/lib/modal/dialog/dialog.component.d.ts

@@ -1,27 +1,28 @@
-import { EventEmitter, OnChanges, OnInit, SimpleChanges } from '@angular/core';
+import { OnInit } from '@angular/core';
 import * as i0 from "@angular/core";
-export declare class SdsDialogComponent implements OnInit, OnChanges {
+declare type modalButton = 'primary' | 'secondary' | 'close';
+export declare class SdsDialogComponent implements OnInit {
     title: string;
     closeText?: string;
     size: 'sm' | 'md' | 'lg' | 'xl';
-    isOpen: boolean;
     primaryButtonText: string;
     secondaryButtonText: string;
     primaryButtonClass: string;
-    primaryClick: EventEmitter<void>;
     secondaryButtonClass: string;
-    secondaryClick: EventEmitter<void>;
-    showSecondaryButton: boolean;
-    showCloseButton: boolean;
     showHeader: boolean;
+    showCloseButton: boolean;
+    showSecondaryButton: boolean;
     private _modal;
+    private _callback?;
+    private _callbackData;
     constructor();
-    ngOnChanges(changes: SimpleChanges): void;
     ngOnInit(): void;
-    open(): void;
-    close(): void;
+    open(callback?: (button: modalButton, data: any) => void, data?: any): void;
+    private close;
     onSecondaryClick(): void;
     onPrimaryClick(): void;
+    onCloseClick(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SdsDialogComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SdsDialogComponent, "sds-dialog", never, { "title": "title"; "closeText": "closeText"; "size": "size"; "isOpen": "isOpen"; "primaryButtonText": "primaryButtonText"; "secondaryButtonText": "secondaryButtonText"; "primaryButtonClass": "primaryButtonClass"; "secondaryButtonClass": "secondaryButtonClass"; "showSecondaryButton": "showSecondaryButton"; "showCloseButton": "showCloseButton"; "showHeader": "showHeader"; }, { "primaryClick": "primaryClick"; "secondaryClick": "secondaryClick"; }, never, ["*"]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdsDialogComponent, "sds-dialog", never, { "title": "title"; "closeText": "closeText"; "size": "size"; "primaryButtonText": "primaryButtonText"; "secondaryButtonText": "secondaryButtonText"; "primaryButtonClass": "primaryButtonClass"; "secondaryButtonClass": "secondaryButtonClass"; "showHeader": "showHeader"; "showCloseButton": "showCloseButton"; "showSecondaryButton": "showSecondaryButton"; }, {}, never, ["*"]>;
 }
+export {};

package/src/lib/modal/modal.component.d.ts

@@ -11,12 +11,14 @@ export declare class SdsModalComponent implements OnInit {
     showCloseButton: boolean;
     modalOpen: EventEmitter<void>;
     modalClose: EventEmitter<void>;
+    closeClick: EventEmitter<void>;
     closeIcon: import("@fortawesome/fontawesome-common-types").IconDefinition;
     private _modal;
     constructor();
     ngOnInit(): void;
     open(): void;
     close(): void;
+    onCloseButtonClick(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SdsModalComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SdsModalComponent, "sds-modal", never, { "modalTitle": "modalTitle"; "showHeader": "showHeader"; "showFooter": "showFooter"; "closeText": "closeText"; "size": "size"; "modalDialogId": "modalDialogId"; "showCloseButton": "showCloseButton"; }, { "modalOpen": "modalOpen"; "modalClose": "modalClose"; }, ["headerContent"], ["header", "*", "footer"]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdsModalComponent, "sds-modal", never, { "modalTitle": "modalTitle"; "showHeader": "showHeader"; "showFooter": "showFooter"; "closeText": "closeText"; "size": "size"; "modalDialogId": "modalDialogId"; "showCloseButton": "showCloseButton"; }, { "modalOpen": "modalOpen"; "modalClose": "modalClose"; "closeClick": "closeClick"; }, ["headerContent"], ["header", "*", "footer"]>;
 }

package/src/lib/pane/pane.component.d.ts

@@ -3,15 +3,14 @@ import { PanePage } from './pane.model';
 import * as i0 from "@angular/core";
 export declare class SdsPaneComponent implements OnInit {
     pages?: PanePage[];
+    selectedPage?: PanePage;
     contentWidthRem: number;
     pageChange: EventEmitter<any>;
-    selectedPage?: PanePage;
-    isContentVisible: boolean;
     closeIcon: import("@fortawesome/fontawesome-common-types").IconDefinition;
     constructor();
     ngOnInit(): void;
     showContent(page: PanePage): void;
     hideContent(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SdsPaneComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SdsPaneComponent, "sds-pane", never, { "pages": "pages"; "contentWidthRem": "contentWidthRem"; }, { "pageChange": "pageChange"; }, never, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdsPaneComponent, "sds-pane", never, { "pages": "pages"; "selectedPage": "selectedPage"; "contentWidthRem": "contentWidthRem"; }, { "pageChange": "pageChange"; }, never, never>;
 }