npm - @spicainternational/ngx-sds-components - Versions diffs - 8.1.1 → 8.3.0-beta.0 - Mend

@spicainternational/ngx-sds-components 8.1.1 → 8.3.0-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (186) hide show

package/fesm2022/spicainternational-ngx-sds-components-src-lib-avatar.mjs.map CHANGED Viewed

	@@ -1 +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/spicainternational-ngx-sds-components-src-lib-avatar.ts"],"sourcesContent":["import {\r\n AfterViewInit,\r\n ChangeDetectionStrategy,\r\n Component,\r\n Input,\r\n OnChanges,\r\n SimpleChanges\r\n} from '@angular/core';\r\nimport { NgIf, NgOptimizedImage } from '@angular/common';\r\n\r\n/*\r\n Class definition\r\n * @property {string} text - text that is parsed for initials. If showHint is set to true this text will be shown in hint\r\n * @property {string} colorKey - value that is base for calculating color of avatar\r\n * @property {boolean} showHint - show hint with text\r\n * @property {string} initialsText - override internal extraction of initials and set avatar text directly\r\n * \r\n * @property {string} pictureUri - uri of picture to show on avatar (supports http/https URLs and base64 data URIs)\r\n * @property {string} pictureImageAlt - alt text for image, for accessibility\r\n * @property {string} pictureLoading - loading strategy for image, lazy or eager (only applies to URLs, not base64)\r\n * @property {boolean} picturePriority - if true image is considered high priority and will be loaded before other images (only applies to URLs, not base64)\r\n * \r\n * @property {string} badgeVisible - show badge on avatar\r\n * @property {string} badgePosition - position of badge\r\n * @property {string} badgeBackgroundColor - background color of badge\r\n * @property {string} badgeTextColor - text color of badge\r\n * @property {string} badgeHint - hint text for badge\r\n /\r\n@Component({\r\n selector: 'sds-avatar',\r\n templateUrl: './avatar.component.html',\r\n styleUrls: ['./avatar.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n standalone: true,\r\n imports: [NgIf, NgOptimizedImage]\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() borderWidth?: string = '1px';\r\n @Input() initialsText?: string;\r\n @Input() cursor?: string;\r\n @Input() size: number = 2;\r\n\r\n\r\n @Input() pictureImageAlt: string = 'User avatar'; \r\n @Input() pictureLoading: 'lazy' \| 'eager' = 'lazy'; \r\n @Input() picturePriority: boolean = false; \r\n\r\n\r\n @Input() badgeVisible: boolean = false;\r\n @Input() badgePosition: 'top-right' \| 'bottom-right' = 'bottom-right';\r\n @Input() badgeBackgroundColor = 'var(--bs-danger)';\r\n @Input() badgeTextColor = 'white';\r\n @Input() badgeHint?: string;\r\n\r\n\r\n public label: string;\r\n public showPicture: boolean;\r\n public colorClass: string;\r\n public imageSizeInPixels: number;\r\n public isBase64Image: boolean = false;\r\n\r\n constructor() {\r\n this.label = '';\r\n this.showPicture = false;\r\n this.colorClass = 'color18';\r\n this.imageSizeInPixels = this.calculatePixelSize();\r\n }\r\n\r\n ngAfterViewInit() {\r\n this.setShowPicture();\r\n this.setColorClass();\r\n }\r\n\r\n ngOnChanges(changes: SimpleChanges) {\r\n if (changes['initialsText']) {\r\n this.setLabel();\r\n }\r\n\r\n if (changes['text']) {\r\n this.setLabel();\r\n }\r\n\r\n if (changes['pictureUri']) {\r\n this.setShowPicture();\r\n this.checkIfBase64();\r\n }\r\n\r\n if (changes['colorKey']){\r\n this.setColorClass();\r\n }\r\n\r\n if (changes['size']) {\r\n this.imageSizeInPixels = this.calculatePixelSize();\r\n }\r\n }\r\n\r\n private setShowPicture(): void {\r\n this.showPicture = !!this.pictureUri && this.pictureUri?.length > 0;\r\n }\r\n\r\n private checkIfBase64(): void {\r\n if (this.pictureUri) {\r\n // Check if the URI is a data URI (base64)\r\n this.isBase64Image = this.pictureUri.startsWith('data:');\r\n } else {\r\n this.isBase64Image = false;\r\n }\r\n }\r\n\r\n private setColorClass(): void {\r\n if (this.colorKey) {\r\n this.colorClass = 'color' + this.getColorIndex(this.colorKey);\r\n } else {\r\n this.colorClass = 'color18';\r\n }\r\n }\r\n\r\n private setLabel(): void {\r\n if (this.initialsText && this.initialsText?.length > 0) {\r\n this.label = this.initialsText;\r\n } else {\r\n this.label = '';\r\n\r\n if (this.text && this.text?.length > 0){\r\n const initialsFromText = this.text\r\n .trim()\r\n .toUpperCase()\r\n .split(' ')\r\n .map((n) => n[0])\r\n .filter(x => !!x);\r\n\r\n if (initialsFromText.length > 0) {\r\n this.label = initialsFromText[0];\r\n if (initialsFromText.length > 1) {\r\n this.label = `${this.label}${initialsFromText[initialsFromText.length - 1]}`\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n private calculatePixelSize(): number {\r\n // Convert rem to pixels (assuming 1rem = 16px, which is the browser default)\r\n // You can adjust this multiplier based on your root font-size\r\n const remToPixelRatio = 15;\r\n return Math.round(this.size remToPixelRatio);\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}","<div\r\n class=\"avatar circle d-flex justify-content-center align-items-center position-relative\"\r\n [class]=\"colorClass\"\r\n [class.hasPicture]=\"showPicture\"\r\n [title]=\"showHint ? text : ''\"\r\n [style.border-style]=\"borderStyle.toString()\"\r\n [style.border-color]=\"borderColor\"\r\n [style.border-width]=\"borderWidth\"\r\n [style.cursor]=\"cursor ? cursor : 'default'\"\r\n [style.font-size.rem]=\"size\"\r\n>\r\n <span \r\n ngIf=\"!showPicture\" \r\n class=\"initials\"\r\n >\r\n {{ label }}\r\n </span>\r\n\r\n <!-- For base64 images, use regular src attribute -->\r\n <img \r\n ngIf=\"showPicture && isBase64Image\" \r\n [src]=\"pictureUri\"\r\n [width]=\"imageSizeInPixels\"\r\n [height]=\"imageSizeInPixels\"\r\n [alt]=\"pictureImageAlt\"\r\n class=\"avatar-image\" />\r\n\r\n <!-- For URL images, use ngSrc with optimization features -->\r\n <img \r\n ngIf=\"showPicture && !isBase64Image\" \r\n [ngSrc]=\"pictureUri!\"\r\n [width]=\"imageSizeInPixels\"\r\n [height]=\"imageSizeInPixels\"\r\n [alt]=\"pictureImageAlt\"\r\n [loading]=\"pictureLoading\"\r\n [priority]=\"picturePriority\"\r\n class=\"avatar-image\" />\r\n\r\n <span \r\n ngIf=\"badgeVisible\"\r\n class=\"position-absolute notification-badge border border-light rounded-circle\"\r\n [class.top-right]=\"badgePosition === 'top-right'\"\r\n [class.bottom-right]=\"badgePosition === 'bottom-right'\"\r\n [style.background-color]=\"badgeBackgroundColor\"\r\n [style.color]=\"badgeTextColor\"\r\n [title]=\"badgeHint ? badgeHint : ''\"\r\n >\r\n </span>\r\n</div>","import { ChangeDetectionStrategy, Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';\r\nimport { AvatarModel } from './avatar-group.model';\r\nimport { DxScrollViewModule } from 'devextreme-angular/ui/scroll-view';\r\nimport { DxPopoverModule } from 'devextreme-angular/ui/popover';\r\nimport { SdsAvatarComponent } from './avatar.component';\r\nimport { NgFor, NgIf } from '@angular/common';\r\n\r\n@Component({\r\n selector: 'sds-avatar-group',\r\n templateUrl: './avatar-group.component.html',\r\n styleUrls: ['./avatar-group.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n standalone: true,\r\n imports: [NgFor, SdsAvatarComponent, NgIf, DxPopoverModule, DxScrollViewModule]\r\n})\r\nexport class SdsAvatarGroupComponent implements OnInit, OnChanges {\r\n\r\n @Input() public stacked;\r\n @Input() public max?: number;\r\n @Input() public size: number;\r\n @Input() public borderColor?: string;\r\n @Input() public avatars: Array<AvatarModel>;\r\n @Input() public dropdownContents: 'all' \| 'overflow' = 'all';\r\n @Input() public dropdownMaxHeight: string = '';\r\n\r\n public overflow: Array<AvatarModel>;\r\n public inflow: Array<AvatarModel>;\r\n\r\n public overflowCountDisplay: string;\r\n public overFlowBorderStyle: 'solid' \| 'none';\r\n\r\n public overflowElementUUID: string;\r\n public showDropdown: boolean;\r\n public showOverflow: boolean;\r\n\r\n public dropdownTargetId: string = '';\r\n public dropdownInitiator?: AvatarModel;\r\n\r\n constructor() {\r\n // this.overflowElementUUID = 'sds-ag-' + crypto.randomUUID();\r\n\r\n // init values in constructor so storybook doesn't have issues with initial state\r\n\r\n this.overflowElementUUID = `sds-ag-${Math.ceil(Math.random() * 1000000)}`;\r\n this.overFlowBorderStyle = 'none';\r\n this.showDropdown = false;\r\n this.showOverflow = false;\r\n this.avatars = [];\r\n this.overflow = [];\r\n this.inflow = [];\r\n this.overflowCountDisplay = '';\r\n this.size = 2;\r\n this.stacked = false;\r\n }\r\n\r\n ngOnChanges(changes: SimpleChanges): void {\r\n if (changes['avatars'] \|\| changes['max']){\r\n if (this.max && this.avatars) {\r\n let avatars = [...this.avatars];\r\n this.inflow = avatars.splice(0, this.max);\r\n this.overflow = avatars;\r\n this.showOverflow = this.overflow.length > 0;\r\n this.overflowCountDisplay = `+${Math.min(99, this.overflow.length)}`;\r\n this.overFlowBorderStyle = this.avatars.filter(x => x.borderStyle).length > 0 ? 'solid' : 'none';\r\n } else {\r\n this.inflow = [...this.avatars];\r\n }\r\n }\r\n }\r\n\r\n ngOnInit(): void {}\r\n\r\n public onOverflowClicked(event: MouseEvent, index: number, avatar?: AvatarModel) {\r\n event.stopPropagation();\r\n\r\n if (this.dropdownContents === 'overflow' && this.overflow.length === 0) {\r\n this.showDropdown = false;\r\n return;\r\n }\r\n\r\n const newDropdownTargetId = this.overflowElementUUID + index;\r\n if (this.showDropdown && this.dropdownTargetId === newDropdownTargetId) {\r\n this.showDropdown = false;\r\n return;\r\n }\r\n\r\n this.dropdownInitiator = avatar;\r\n this.dropdownTargetId = this.overflowElementUUID + index;\r\n this.showDropdown = true;\r\n }\r\n\r\n public stopEventPropagation(event: MouseEvent) {\r\n event.stopPropagation();\r\n }\r\n}\r\n","<div class=\"d-flex avatar-group-container\">\r\n <sds-avatar ngFor=\"let avatar of inflow; let i = index\"\r\n [id]=\"overflowElementUUID + i\"\r\n [text]=\"avatar.text\"\r\n [colorKey]=\"avatar.colorKey\"\r\n [borderColor]=\"borderColor\"\r\n [borderStyle]=\"avatar.borderStyle ? avatar.borderStyle : 'none'\"\r\n cursor=\"pointer\"\r\n [pictureUri]=\"avatar.pictureUri ?? ''\"\r\n [showHint]=\"true\"\r\n [size]=\"size\"\r\n [style.margin-right.rem]=\"stacked ? size/-3 : size/15\"\r\n (click)=\"onOverflowClicked($event, i, avatar)\"\r\n (mousedown)=\"stopEventPropagation($event)\"\r\n (mouseup)=\"stopEventPropagation($event)\"\r\n >\r\n </sds-avatar>\r\n\r\n <sds-avatar\r\n ngIf=\"showOverflow\"\r\n [id]=\"overflowElementUUID + '-1'\"\r\n class=\"overflow\"\r\n [initialsText]=\"overflowCountDisplay\"\r\n [borderColor]=\"borderColor\"\r\n [borderStyle]=\"overFlowBorderStyle\"\r\n cursor=\"pointer\"\r\n [size]=\"size\"\r\n (click)=\"onOverflowClicked($event, -1, undefined)\"\r\n (mousedown)=\"stopEventPropagation($event)\"\r\n (mouseup)=\"stopEventPropagation($event)\"\r\n >\r\n </sds-avatar>\r\n\r\n <dx-popover\r\n target=\"#{{dropdownTargetId}}\"\r\n [(visible)]=\"showDropdown\"\r\n [wrapperAttr]=\"{ class: 'sds-avatar-group-overflow-popover' }\"\r\n [maxHeight]=\"dropdownMaxHeight\"\r\n [hideOnOutsideClick]=\"true\"\r\n >\r\n <dx-scroll-view\r\n showScrollbar=\"always\">\r\n <div class=\"overflow-avatars-container rounded\">\r\n <div ngFor=\"let avatar of (dropdownContents === 'all' ? avatars : overflow)\"\r\n class=\"d-flex align-items-center p-1 my-1 mx-1 overflow-avatar-container\" >\r\n <sds-avatar\r\n [text]=\"avatar.text\"\r\n [colorKey]=\"avatar.colorKey\"\r\n [borderStyle]=\"avatar.borderStyle ? avatar.borderStyle : 'none'\"\r\n [pictureUri]=\"avatar.pictureUri ?? ''\"\r\n borderColor=\"transparent\"\r\n [size]=\"1.8\"\r\n >\r\n </sds-avatar>\r\n <div \r\n class=\"ms-2 ps-1\"\r\n [class.sds-fw-600] = \"dropdownInitiator && dropdownInitiator.colorKey === avatar.colorKey\"\r\n >\r\n {{avatar.text}}\r\n </div>\r\n </div>\r\n </div>\r\n </dx-scroll-view>\r\n </dx-popover>\r\n</div>\r\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;;AAUA;;;;;;;;;;;;;;;;;AAiBG;MASU,kBAAkB,CAAA;AA+B3B,IAAA,WAAA,GAAA;QA3BS,IAAQ,CAAA,QAAA,GAAY,KAAK;QACzB,IAAW,CAAA,WAAA,GAA2C,MAAM;QAE5D,IAAW,CAAA,WAAA,GAAY,KAAK;QAG5B,IAAI,CAAA,IAAA,GAAW,CAAC;QAGhB,IAAe,CAAA,eAAA,GAAW,aAAa;QACvC,IAAc,CAAA,cAAA,GAAqB,MAAM;QACzC,IAAe,CAAA,eAAA,GAAY,KAAK;QAGhC,IAAY,CAAA,YAAA,GAAY,KAAK;QAC7B,IAAa,CAAA,aAAA,GAAiC,cAAc;QAC5D,IAAoB,CAAA,oBAAA,GAAG,kBAAkB;QACzC,IAAc,CAAA,cAAA,GAAG,OAAO;QAQ1B,IAAa,CAAA,aAAA,GAAY,KAAK;AAGjC,QAAA,IAAI,CAAC,KAAK,GAAG,EAAE;AACf,QAAA,IAAI,CAAC,WAAW,GAAG,KAAK;AACxB,QAAA,IAAI,CAAC,UAAU,GAAG,SAAS;AAC3B,QAAA,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,kBAAkB,EAAE;;IAGtD,eAAe,GAAA;QACX,IAAI,CAAC,cAAc,EAAE;QACrB,IAAI,CAAC,aAAa,EAAE;;AAGxB,IAAA,WAAW,CAAC,OAAsB,EAAA;AAC9B,QAAA,IAAI,OAAO,CAAC,cAAc,CAAC,EAAE;YACzB,IAAI,CAAC,QAAQ,EAAE;;AAGnB,QAAA,IAAI,OAAO,CAAC,MAAM,CAAC,EAAE;YACjB,IAAI,CAAC,QAAQ,EAAE;;AAGnB,QAAA,IAAI,OAAO,CAAC,YAAY,CAAC,EAAE;YACvB,IAAI,CAAC,cAAc,EAAE;YACrB,IAAI,CAAC,aAAa,EAAE;;AAGxB,QAAA,IAAI,OAAO,CAAC,UAAU,CAAC,EAAC;YACpB,IAAI,CAAC,aAAa,EAAE;;AAGxB,QAAA,IAAI,OAAO,CAAC,MAAM,CAAC,EAAE;AACjB,YAAA,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,kBAAkB,EAAE;;;IAIlD,cAAc,GAAA;AAClB,QAAA,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,CAAC;;IAG/D,aAAa,GAAA;AACjB,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE;;YAEjB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,OAAO,CAAC;;aACrD;AACH,YAAA,IAAI,CAAC,aAAa,GAAG,KAAK;;;IAI1B,aAAa,GAAA;AACjB,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACf,YAAA,IAAI,CAAC,UAAU,GAAG,OAAO,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC;;aAC1D;AACH,YAAA,IAAI,CAAC,UAAU,GAAG,SAAS;;;IAI3B,QAAQ,GAAA;AACZ,QAAA,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,CAAC,EAAE;AACpD,YAAA,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,YAAY;;aAC3B;AACH,YAAA,IAAI,CAAC,KAAK,GAAG,EAAE;AAEf,YAAA,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,EAAE,MAAM,GAAG,CAAC,EAAC;AACnC,gBAAA,MAAM,gBAAgB,GAAG,IAAI,CAAC;AACzB,qBAAA,IAAI;AACJ,qBAAA,WAAW;qBACX,KAAK,CAAC,GAAG;qBACT,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;qBACf,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AAErB,gBAAA,IAAI,gBAAgB,CAAC,MAAM,GAAG,CAAC,EAAE;AAC7B,oBAAA,IAAI,CAAC,KAAK,GAAG,gBAAgB,CAAC,CAAC,CAAC;AAChC,oBAAA,IAAI,gBAAgB,CAAC,MAAM,GAAG,CAAC,EAAE;AAC7B,wBAAA,IAAI,CAAC,KAAK,GAAG,CAAG,EAAA,IAAI,CAAC,KAAK,CAAA,EAAG,gBAAgB,CAAC,gBAAgB,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE;;;;;;IAOxF,kBAAkB,GAAA;;;QAGtB,MAAM,eAAe,GAAG,EAAE;QAC1B,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,GAAG,eAAe,CAAC;;AAG1C,IAAA,aAAa,CAAC,CAAS,EAAA;QAC3B,MAAM,MAAM,GAAG,EAAE;QACjB,IAAI,CAAC,CAAC,EAAE;AACJ,YAAA,OAAO,CAAC;;QAEZ,IAAI,UAAU,GAAG;aACZ,KAAK,CAAC,EAAE;AACR,aAAA,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC;AAC1B,aAAA,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QAC/B,OAAO,UAAU,GAAG,MAAM;;+GA/HrB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAlB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,kBAAkB,ECpC/B,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,QAAA,EAAA,UAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,UAAA,EAAA,WAAA,EAAA,aAAA,EAAA,WAAA,EAAA,aAAA,EAAA,WAAA,EAAA,aAAA,EAAA,YAAA,EAAA,cAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,cAAA,EAAA,aAAA,EAAA,eAAA,EAAA,oBAAA,EAAA,sBAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,SAAA,EAAA,WAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,0vDAgDM,EDdQ,MAAA,EAAA,CAAA,o1EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,IAAI,6FAAE,gBAAgB,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,UAAA,EAAA,cAAA,EAAA,wBAAA,EAAA,MAAA,EAAA,aAAA,EAAA,mBAAA,EAAA,KAAA,EAAA,QAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FAEvB,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAR9B,SAAS;+BACI,YAAY,EAAA,eAAA,EAGL,uBAAuB,CAAC,MAAM,EAAA,UAAA,EACnC,IAAI,EAAA,OAAA,EACP,CAAC,IAAI,EAAE,gBAAgB,CAAC,EAAA,QAAA,EAAA,0vDAAA,EAAA,MAAA,EAAA,CAAA,o1EAAA,CAAA,EAAA;wDAGxB,IAAI,EAAA,CAAA;sBAAZ;gBACQ,QAAQ,EAAA,CAAA;sBAAhB;gBACQ,UAAU,EAAA,CAAA;sBAAlB;gBACQ,QAAQ,EAAA,CAAA;sBAAhB;gBACQ,WAAW,EAAA,CAAA;sBAAnB;gBACQ,WAAW,EAAA,CAAA;sBAAnB;gBACQ,WAAW,EAAA,CAAA;sBAAnB;gBACQ,YAAY,EAAA,CAAA;sBAApB;gBACQ,MAAM,EAAA,CAAA;sBAAd;gBACQ,IAAI,EAAA,CAAA;sBAAZ;gBAGQ,eAAe,EAAA,CAAA;sBAAvB;gBACQ,cAAc,EAAA,CAAA;sBAAtB;gBACQ,eAAe,EAAA,CAAA;sBAAvB;gBAGQ,YAAY,EAAA,CAAA;sBAApB;gBACQ,aAAa,EAAA,CAAA;sBAArB;gBACQ,oBAAoB,EAAA,CAAA;sBAA5B;gBACQ,cAAc,EAAA,CAAA;sBAAtB;gBACQ,SAAS,EAAA,CAAA;sBAAjB;;;ME3CQ,uBAAuB,CAAA;AAuBhC,IAAA,WAAA,GAAA;;QAhBgB,IAAgB,CAAA,gBAAA,GAAuB,KAAK;QAC5C,IAAiB,CAAA,iBAAA,GAAW,EAAE;QAYvC,IAAgB,CAAA,gBAAA,GAAW,EAAE;;AAQhC,QAAA,IAAI,CAAC,mBAAmB,GAAG,CAAU,OAAA,EAAA,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,OAAO,CAAC,EAAE;AACzE,QAAA,IAAI,CAAC,mBAAmB,GAAG,MAAM;AACjC,QAAA,IAAI,CAAC,YAAY,GAAG,KAAK;AACzB,QAAA,IAAI,CAAC,YAAY,GAAG,KAAK;AACzB,QAAA,IAAI,CAAC,OAAO,GAAG,EAAE;AACjB,QAAA,IAAI,CAAC,QAAQ,GAAG,EAAE;AAClB,QAAA,IAAI,CAAC,MAAM,GAAG,EAAE;AAChB,QAAA,IAAI,CAAC,oBAAoB,GAAG,EAAE;AAC9B,QAAA,IAAI,CAAC,IAAI,GAAG,CAAC;AACb,QAAA,IAAI,CAAC,OAAO,GAAG,KAAK;;AAGxB,IAAA,WAAW,CAAC,OAAsB,EAAA;QAC9B,IAAI,OAAO,CAAC,SAAS,CAAC,IAAI,OAAO,CAAC,KAAK,CAAC,EAAC;YACrC,IAAI,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,OAAO,EAAE;gBAC1B,IAAI,OAAO,GAAG,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC;AAC/B,gBAAA,IAAI,CAAC,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC;AACzC,gBAAA,IAAI,CAAC,QAAQ,GAAG,OAAO;gBACvB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC;AAC5C,gBAAA,IAAI,CAAC,oBAAoB,GAAG,CAAI,CAAA,EAAA,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;AACpE,gBAAA,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC,CAAC,MAAM,GAAG,CAAC,GAAG,OAAO,GAAG,MAAM;;iBAC7F;gBACH,IAAI,CAAC,MAAM,GAAG,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC;;;;AAK3C,IAAA,QAAQ;AAED,IAAA,iBAAiB,CAAC,KAAiB,EAAE,KAAa,EAAE,MAAoB,EAAA;QAC3E,KAAK,CAAC,eAAe,EAAE;AAEvB,QAAA,IAAI,IAAI,CAAC,gBAAgB,KAAK,UAAU,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,EAAE;AACpE,YAAA,IAAI,CAAC,YAAY,GAAG,KAAK;YACzB;;AAGJ,QAAA,MAAM,mBAAmB,GAAG,IAAI,CAAC,mBAAmB,GAAG,KAAK;QAC5D,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,gBAAgB,KAAK,mBAAmB,EAAE;AACpE,YAAA,IAAI,CAAC,YAAY,GAAG,KAAK;YACzB;;AAGJ,QAAA,IAAI,CAAC,iBAAiB,GAAG,MAAM;QAC/B,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,mBAAmB,GAAG,KAAK;AACxD,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI;;AAGrB,IAAA,oBAAoB,CAAC,KAAiB,EAAA;QACzC,KAAK,CAAC,eAAe,EAAE;;+GA7ElB,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAvB,uBAAuB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,GAAA,EAAA,KAAA,EAAA,IAAA,EAAA,MAAA,EAAA,WAAA,EAAA,aAAA,EAAA,OAAA,EAAA,SAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECfpC,suFAiEA,EAAA,MAAA,EAAA,CAAA,yPAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDpDc,KAAK,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,cAAA,EAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,kBAAkB,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,YAAA,EAAA,UAAA,EAAA,aAAA,EAAA,aAAA,EAAA,aAAA,EAAA,cAAA,EAAA,QAAA,EAAA,MAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,eAAA,EAAA,sBAAA,EAAA,gBAAA,EAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,IAAI,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,eAAe,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,kBAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,qBAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,kBAAA,EAAA,QAAA,EAAA,WAAA,EAAA,oBAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,mBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,UAAA,EAAA,UAAA,EAAA,YAAA,EAAA,SAAA,EAAA,cAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,WAAA,EAAA,QAAA,EAAA,OAAA,EAAA,eAAA,EAAA,cAAA,EAAA,SAAA,EAAA,OAAA,EAAA,aAAA,CAAA,EAAA,OAAA,EAAA,CAAA,gBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,UAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,SAAA,EAAA,iBAAA,EAAA,iBAAA,EAAA,2BAAA,EAAA,iBAAA,EAAA,uBAAA,EAAA,sBAAA,EAAA,gBAAA,EAAA,wBAAA,EAAA,cAAA,EAAA,iBAAA,EAAA,0BAAA,EAAA,0BAAA,EAAA,YAAA,EAAA,yBAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,eAAA,EAAA,oBAAA,EAAA,uBAAA,EAAA,iBAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,aAAA,EAAA,qBAAA,EAAA,oBAAA,EAAA,eAAA,EAAA,aAAA,EAAA,mBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,kBAAkB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,qBAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,eAAA,EAAA,WAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,iBAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,YAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,eAAA,EAAA,WAAA,EAAA,OAAA,CAAA,EAAA,OAAA,EAAA,CAAA,aAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,eAAA,EAAA,UAAA,EAAA,WAAA,EAAA,qBAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,mBAAA,EAAA,cAAA,EAAA,sBAAA,EAAA,uBAAA,EAAA,uBAAA,EAAA,sBAAA,EAAA,kBAAA,EAAA,uBAAA,EAAA,qBAAA,EAAA,qBAAA,EAAA,iBAAA,EAAA,aAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FAErE,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBARnC,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,kBAAkB,mBAGX,uBAAuB,CAAC,MAAM,EAAA,UAAA,EACnC,IAAI,EACP,OAAA,EAAA,CAAC,KAAK,EAAE,kBAAkB,EAAE,IAAI,EAAE,eAAe,EAAE,kBAAkB,CAAC,EAAA,QAAA,EAAA,suFAAA,EAAA,MAAA,EAAA,CAAA,yPAAA,CAAA,EAAA;wDAI/D,OAAO,EAAA,CAAA;sBAAtB;gBACe,GAAG,EAAA,CAAA;sBAAlB;gBACe,IAAI,EAAA,CAAA;sBAAnB;gBACe,WAAW,EAAA,CAAA;sBAA1B;gBACe,OAAO,EAAA,CAAA;sBAAtB;gBACe,gBAAgB,EAAA,CAAA;sBAA/B;gBACe,iBAAiB,EAAA,CAAA;sBAAhC;;;AEvBL;;AAEG;;;;"}
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/spicainternational-ngx-sds-components-src-lib-avatar.ts"],"sourcesContent":["import {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n Input,\n OnChanges,\n SimpleChanges\n} from '@angular/core';\nimport { NgIf, NgOptimizedImage } from '@angular/common';\n\n/*\n Class definition\n * @property {string} text - text that is parsed for initials. If showHint is set to true this text will be shown in hint\n * @property {string} colorKey - value that is base for calculating color of avatar\n * @property {boolean} showHint - show hint with text\n * @property {string} initialsText - override internal extraction of initials and set avatar text directly\n * \n * @property {string} pictureUri - uri of picture to show on avatar (supports http/https URLs and base64 data URIs)\n * @property {string} pictureImageAlt - alt text for image, for accessibility\n * @property {string} pictureLoading - loading strategy for image, lazy or eager (only applies to URLs, not base64)\n * @property {boolean} picturePriority - if true image is considered high priority and will be loaded before other images (only applies to URLs, not base64)\n * \n * @property {string} badgeVisible - show badge on avatar\n * @property {string} badgePosition - position of badge\n * @property {string} badgeBackgroundColor - background color of badge\n * @property {string} badgeTextColor - text color of badge\n * @property {string} badgeHint - hint text for badge\n /\n@Component({\n selector: 'sds-avatar',\n templateUrl: './avatar.component.html',\n styleUrls: ['./avatar.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n imports: [NgIf, NgOptimizedImage]\n})\nexport class SdsAvatarComponent implements AfterViewInit, OnChanges {\n @Input() text?: string;\n @Input() colorKey?: string;\n @Input() pictureUri?: string;\n @Input() showHint: boolean = false;\n @Input() borderStyle: 'solid' \| 'dashed' \| 'dotted' \| 'none' = 'none';\n @Input() borderColor?: string;\n @Input() borderWidth?: string = '1px';\n @Input() initialsText?: string;\n @Input() cursor?: string;\n @Input() size: number = 2;\n\n\n @Input() pictureImageAlt: string = 'User avatar'; \n @Input() pictureLoading: 'lazy' \| 'eager' = 'lazy'; \n @Input() picturePriority: boolean = false; \n\n\n @Input() badgeVisible: boolean = false;\n @Input() badgePosition: 'top-right' \| 'bottom-right' = 'bottom-right';\n @Input() badgeBackgroundColor = 'var(--bs-danger)';\n @Input() badgeTextColor = 'white';\n @Input() badgeHint?: string;\n\n\n public label: string;\n public showPicture: boolean;\n public colorClass: string;\n public imageSizeInPixels: number;\n public isBase64Image: boolean = false;\n\n constructor() {\n this.label = '';\n this.showPicture = false;\n this.colorClass = 'color18';\n this.imageSizeInPixels = this.calculatePixelSize();\n }\n\n ngAfterViewInit() {\n this.setShowPicture();\n this.setColorClass();\n }\n\n ngOnChanges(changes: SimpleChanges) {\n if (changes['initialsText']) {\n this.setLabel();\n }\n\n if (changes['text']) {\n this.setLabel();\n }\n\n if (changes['pictureUri']) {\n this.setShowPicture();\n this.checkIfBase64();\n }\n\n if (changes['colorKey']){\n this.setColorClass();\n }\n\n if (changes['size']) {\n this.imageSizeInPixels = this.calculatePixelSize();\n }\n }\n\n private setShowPicture(): void {\n this.showPicture = !!this.pictureUri && this.pictureUri?.length > 0;\n }\n\n private checkIfBase64(): void {\n if (this.pictureUri) {\n // Check if the URI is a data URI (base64)\n this.isBase64Image = this.pictureUri.startsWith('data:');\n } else {\n this.isBase64Image = false;\n }\n }\n\n private setColorClass(): void {\n if (this.colorKey) {\n this.colorClass = 'color' + this.getColorIndex(this.colorKey);\n } else {\n this.colorClass = 'color18';\n }\n }\n\n private setLabel(): void {\n if (this.initialsText && this.initialsText?.length > 0) {\n this.label = this.initialsText;\n } else {\n this.label = '';\n\n if (this.text && this.text?.length > 0){\n const initialsFromText = this.text\n .trim()\n .toUpperCase()\n .split(' ')\n .map((n) => n[0])\n .filter(x => !!x);\n\n if (initialsFromText.length > 0) {\n this.label = initialsFromText[0];\n if (initialsFromText.length > 1) {\n this.label = `${this.label}${initialsFromText[initialsFromText.length - 1]}`\n }\n }\n }\n }\n }\n\n private calculatePixelSize(): number {\n // Convert rem to pixels (assuming 1rem = 16px, which is the browser default)\n // You can adjust this multiplier based on your root font-size\n const remToPixelRatio = 15;\n return Math.round(this.size remToPixelRatio);\n }\n\n private getColorIndex(s: string): number {\n const length = 10;\n if (!s) {\n return 0;\n }\n let sumOfChars = s\n .split('')\n .map((x) => x.charCodeAt(0))\n .reduce((a, b) => a + b, 0);\n return sumOfChars % length;\n }\n\n}","<div\n class=\"avatar circle d-flex justify-content-center align-items-center position-relative\"\n [class]=\"colorClass\"\n [class.hasPicture]=\"showPicture\"\n [title]=\"showHint ? text : ''\"\n [style.border-style]=\"borderStyle.toString()\"\n [style.border-color]=\"borderColor\"\n [style.border-width]=\"borderWidth\"\n [style.cursor]=\"cursor ? cursor : 'default'\"\n [style.font-size.rem]=\"size\"\n>\n <span \n ngIf=\"!showPicture\" \n class=\"initials\"\n >\n {{ label }}\n </span>\n\n <!-- For base64 images, use regular src attribute -->\n <img \n ngIf=\"showPicture && isBase64Image\" \n [src]=\"pictureUri\"\n [width]=\"imageSizeInPixels\"\n [height]=\"imageSizeInPixels\"\n [alt]=\"pictureImageAlt\"\n class=\"avatar-image\" />\n\n <!-- For URL images, use ngSrc with optimization features -->\n <img \n ngIf=\"showPicture && !isBase64Image\" \n [ngSrc]=\"pictureUri!\"\n [width]=\"imageSizeInPixels\"\n [height]=\"imageSizeInPixels\"\n [alt]=\"pictureImageAlt\"\n [loading]=\"pictureLoading\"\n [priority]=\"picturePriority\"\n class=\"avatar-image\" />\n\n <span \n ngIf=\"badgeVisible\"\n class=\"position-absolute notification-badge border border-light rounded-circle\"\n [class.top-right]=\"badgePosition === 'top-right'\"\n [class.bottom-right]=\"badgePosition === 'bottom-right'\"\n [style.background-color]=\"badgeBackgroundColor\"\n [style.color]=\"badgeTextColor\"\n [title]=\"badgeHint ? badgeHint : ''\"\n >\n </span>\n</div>","import { ChangeDetectionStrategy, Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';\nimport { AvatarModel } from './avatar-group.model';\nimport { DxScrollViewModule } from 'devextreme-angular/ui/scroll-view';\nimport { DxPopoverModule } from 'devextreme-angular/ui/popover';\nimport { SdsAvatarComponent } from './avatar.component';\nimport { NgFor, NgIf } from '@angular/common';\n\n@Component({\n selector: 'sds-avatar-group',\n templateUrl: './avatar-group.component.html',\n styleUrls: ['./avatar-group.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n imports: [NgFor, SdsAvatarComponent, NgIf, DxPopoverModule, DxScrollViewModule]\n})\nexport class SdsAvatarGroupComponent implements OnInit, OnChanges {\n\n @Input() public stacked;\n @Input() public max?: number;\n @Input() public size: number;\n @Input() public borderColor?: string;\n @Input() public avatars: Array<AvatarModel>;\n @Input() public dropdownContents: 'all' \| 'overflow' = 'all';\n @Input() public dropdownMaxHeight: string = '';\n\n public overflow: Array<AvatarModel>;\n public inflow: Array<AvatarModel>;\n\n public overflowCountDisplay: string;\n public overFlowBorderStyle: 'solid' \| 'none';\n\n public overflowElementUUID: string;\n public showDropdown: boolean;\n public showOverflow: boolean;\n\n public dropdownTargetId: string = '';\n public dropdownInitiator?: AvatarModel;\n\n constructor() {\n // this.overflowElementUUID = 'sds-ag-' + crypto.randomUUID();\n\n // init values in constructor so storybook doesn't have issues with initial state\n\n this.overflowElementUUID = `sds-ag-${Math.ceil(Math.random() * 1000000)}`;\n this.overFlowBorderStyle = 'none';\n this.showDropdown = false;\n this.showOverflow = false;\n this.avatars = [];\n this.overflow = [];\n this.inflow = [];\n this.overflowCountDisplay = '';\n this.size = 2;\n this.stacked = false;\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n if (changes['avatars'] \|\| changes['max']){\n if (this.max && this.avatars) {\n let avatars = [...this.avatars];\n this.inflow = avatars.splice(0, this.max);\n this.overflow = avatars;\n this.showOverflow = this.overflow.length > 0;\n this.overflowCountDisplay = `+${Math.min(99, this.overflow.length)}`;\n this.overFlowBorderStyle = this.avatars.filter(x => x.borderStyle).length > 0 ? 'solid' : 'none';\n } else {\n this.inflow = [...this.avatars];\n }\n }\n }\n\n ngOnInit(): void {}\n\n public onOverflowClicked(event: MouseEvent, index: number, avatar?: AvatarModel) {\n event.stopPropagation();\n\n if (this.dropdownContents === 'overflow' && this.overflow.length === 0) {\n this.showDropdown = false;\n return;\n }\n\n const newDropdownTargetId = this.overflowElementUUID + index;\n if (this.showDropdown && this.dropdownTargetId === newDropdownTargetId) {\n this.showDropdown = false;\n return;\n }\n\n this.dropdownInitiator = avatar;\n this.dropdownTargetId = this.overflowElementUUID + index;\n this.showDropdown = true;\n }\n\n public stopEventPropagation(event: MouseEvent) {\n event.stopPropagation();\n }\n}\n","<div class=\"d-flex avatar-group-container\">\n <sds-avatar ngFor=\"let avatar of inflow; let i = index\"\n [id]=\"overflowElementUUID + i\"\n [text]=\"avatar.text\"\n [colorKey]=\"avatar.colorKey\"\n [borderColor]=\"borderColor\"\n [borderStyle]=\"avatar.borderStyle ? avatar.borderStyle : 'none'\"\n cursor=\"pointer\"\n [pictureUri]=\"avatar.pictureUri ?? ''\"\n [showHint]=\"true\"\n [size]=\"size\"\n [style.margin-right.rem]=\"stacked ? size/-3 : size/15\"\n (click)=\"onOverflowClicked($event, i, avatar)\"\n (mousedown)=\"stopEventPropagation($event)\"\n (mouseup)=\"stopEventPropagation($event)\"\n >\n </sds-avatar>\n\n <sds-avatar\n ngIf=\"showOverflow\"\n [id]=\"overflowElementUUID + '-1'\"\n class=\"overflow\"\n [initialsText]=\"overflowCountDisplay\"\n [borderColor]=\"borderColor\"\n [borderStyle]=\"overFlowBorderStyle\"\n cursor=\"pointer\"\n [size]=\"size\"\n (click)=\"onOverflowClicked($event, -1, undefined)\"\n (mousedown)=\"stopEventPropagation($event)\"\n (mouseup)=\"stopEventPropagation($event)\"\n >\n </sds-avatar>\n\n <dx-popover\n target=\"#{{dropdownTargetId}}\"\n [(visible)]=\"showDropdown\"\n [wrapperAttr]=\"{ class: 'sds-avatar-group-overflow-popover' }\"\n [maxHeight]=\"dropdownMaxHeight\"\n [hideOnOutsideClick]=\"true\"\n >\n <dx-scroll-view\n showScrollbar=\"always\">\n <div class=\"overflow-avatars-container rounded\">\n <div ngFor=\"let avatar of (dropdownContents === 'all' ? avatars : overflow)\"\n class=\"d-flex align-items-center p-1 my-1 mx-1 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 [size]=\"1.8\"\n >\n </sds-avatar>\n <div \n class=\"ms-2 ps-1\"\n [class.sds-fw-600] = \"dropdownInitiator && dropdownInitiator.colorKey === avatar.colorKey\"\n >\n {{avatar.text}}\n </div>\n </div>\n </div>\n </dx-scroll-view>\n </dx-popover>\n</div>\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;;AAUA;;;;;;;;;;;;;;;;;AAiBG;MASU,kBAAkB,CAAA;AA+B3B,IAAA,WAAA,GAAA;QA3BS,IAAQ,CAAA,QAAA,GAAY,KAAK;QACzB,IAAW,CAAA,WAAA,GAA2C,MAAM;QAE5D,IAAW,CAAA,WAAA,GAAY,KAAK;QAG5B,IAAI,CAAA,IAAA,GAAW,CAAC;QAGhB,IAAe,CAAA,eAAA,GAAW,aAAa;QACvC,IAAc,CAAA,cAAA,GAAqB,MAAM;QACzC,IAAe,CAAA,eAAA,GAAY,KAAK;QAGhC,IAAY,CAAA,YAAA,GAAY,KAAK;QAC7B,IAAa,CAAA,aAAA,GAAiC,cAAc;QAC5D,IAAoB,CAAA,oBAAA,GAAG,kBAAkB;QACzC,IAAc,CAAA,cAAA,GAAG,OAAO;QAQ1B,IAAa,CAAA,aAAA,GAAY,KAAK;AAGjC,QAAA,IAAI,CAAC,KAAK,GAAG,EAAE;AACf,QAAA,IAAI,CAAC,WAAW,GAAG,KAAK;AACxB,QAAA,IAAI,CAAC,UAAU,GAAG,SAAS;AAC3B,QAAA,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,kBAAkB,EAAE;;IAGtD,eAAe,GAAA;QACX,IAAI,CAAC,cAAc,EAAE;QACrB,IAAI,CAAC,aAAa,EAAE;;AAGxB,IAAA,WAAW,CAAC,OAAsB,EAAA;AAC9B,QAAA,IAAI,OAAO,CAAC,cAAc,CAAC,EAAE;YACzB,IAAI,CAAC,QAAQ,EAAE;;AAGnB,QAAA,IAAI,OAAO,CAAC,MAAM,CAAC,EAAE;YACjB,IAAI,CAAC,QAAQ,EAAE;;AAGnB,QAAA,IAAI,OAAO,CAAC,YAAY,CAAC,EAAE;YACvB,IAAI,CAAC,cAAc,EAAE;YACrB,IAAI,CAAC,aAAa,EAAE;;AAGxB,QAAA,IAAI,OAAO,CAAC,UAAU,CAAC,EAAC;YACpB,IAAI,CAAC,aAAa,EAAE;;AAGxB,QAAA,IAAI,OAAO,CAAC,MAAM,CAAC,EAAE;AACjB,YAAA,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,kBAAkB,EAAE;;;IAIlD,cAAc,GAAA;AAClB,QAAA,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,CAAC;;IAG/D,aAAa,GAAA;AACjB,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE;;YAEjB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,OAAO,CAAC;;aACrD;AACH,YAAA,IAAI,CAAC,aAAa,GAAG,KAAK;;;IAI1B,aAAa,GAAA;AACjB,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACf,YAAA,IAAI,CAAC,UAAU,GAAG,OAAO,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC;;aAC1D;AACH,YAAA,IAAI,CAAC,UAAU,GAAG,SAAS;;;IAI3B,QAAQ,GAAA;AACZ,QAAA,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,YAAY,EAAE,MAAM,GAAG,CAAC,EAAE;AACpD,YAAA,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,YAAY;;aAC3B;AACH,YAAA,IAAI,CAAC,KAAK,GAAG,EAAE;AAEf,YAAA,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,EAAE,MAAM,GAAG,CAAC,EAAC;AACnC,gBAAA,MAAM,gBAAgB,GAAG,IAAI,CAAC;AACzB,qBAAA,IAAI;AACJ,qBAAA,WAAW;qBACX,KAAK,CAAC,GAAG;qBACT,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;qBACf,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AAErB,gBAAA,IAAI,gBAAgB,CAAC,MAAM,GAAG,CAAC,EAAE;AAC7B,oBAAA,IAAI,CAAC,KAAK,GAAG,gBAAgB,CAAC,CAAC,CAAC;AAChC,oBAAA,IAAI,gBAAgB,CAAC,MAAM,GAAG,CAAC,EAAE;AAC7B,wBAAA,IAAI,CAAC,KAAK,GAAG,CAAG,EAAA,IAAI,CAAC,KAAK,CAAA,EAAG,gBAAgB,CAAC,gBAAgB,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE;;;;;;IAOxF,kBAAkB,GAAA;;;QAGtB,MAAM,eAAe,GAAG,EAAE;QAC1B,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,GAAG,eAAe,CAAC;;AAG1C,IAAA,aAAa,CAAC,CAAS,EAAA;QAC3B,MAAM,MAAM,GAAG,EAAE;QACjB,IAAI,CAAC,CAAC,EAAE;AACJ,YAAA,OAAO,CAAC;;QAEZ,IAAI,UAAU,GAAG;aACZ,KAAK,CAAC,EAAE;AACR,aAAA,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC;AAC1B,aAAA,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QAC/B,OAAO,UAAU,GAAG,MAAM;;+GA/HrB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAlB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,kBAAkB,ECpC/B,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,QAAA,EAAA,UAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,UAAA,EAAA,WAAA,EAAA,aAAA,EAAA,WAAA,EAAA,aAAA,EAAA,WAAA,EAAA,aAAA,EAAA,YAAA,EAAA,cAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,cAAA,EAAA,aAAA,EAAA,eAAA,EAAA,oBAAA,EAAA,sBAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,SAAA,EAAA,WAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,0pDAgDM,EDdQ,MAAA,EAAA,CAAA,o1EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,IAAI,6FAAE,gBAAgB,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,UAAA,EAAA,cAAA,EAAA,wBAAA,EAAA,MAAA,EAAA,aAAA,EAAA,mBAAA,EAAA,KAAA,EAAA,QAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FAEvB,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAR9B,SAAS;+BACI,YAAY,EAAA,eAAA,EAGL,uBAAuB,CAAC,MAAM,EAAA,UAAA,EACnC,IAAI,EAAA,OAAA,EACP,CAAC,IAAI,EAAE,gBAAgB,CAAC,EAAA,QAAA,EAAA,0pDAAA,EAAA,MAAA,EAAA,CAAA,o1EAAA,CAAA,EAAA;wDAGxB,IAAI,EAAA,CAAA;sBAAZ;gBACQ,QAAQ,EAAA,CAAA;sBAAhB;gBACQ,UAAU,EAAA,CAAA;sBAAlB;gBACQ,QAAQ,EAAA,CAAA;sBAAhB;gBACQ,WAAW,EAAA,CAAA;sBAAnB;gBACQ,WAAW,EAAA,CAAA;sBAAnB;gBACQ,WAAW,EAAA,CAAA;sBAAnB;gBACQ,YAAY,EAAA,CAAA;sBAApB;gBACQ,MAAM,EAAA,CAAA;sBAAd;gBACQ,IAAI,EAAA,CAAA;sBAAZ;gBAGQ,eAAe,EAAA,CAAA;sBAAvB;gBACQ,cAAc,EAAA,CAAA;sBAAtB;gBACQ,eAAe,EAAA,CAAA;sBAAvB;gBAGQ,YAAY,EAAA,CAAA;sBAApB;gBACQ,aAAa,EAAA,CAAA;sBAArB;gBACQ,oBAAoB,EAAA,CAAA;sBAA5B;gBACQ,cAAc,EAAA,CAAA;sBAAtB;gBACQ,SAAS,EAAA,CAAA;sBAAjB;;;ME3CQ,uBAAuB,CAAA;AAuBhC,IAAA,WAAA,GAAA;;QAhBgB,IAAgB,CAAA,gBAAA,GAAuB,KAAK;QAC5C,IAAiB,CAAA,iBAAA,GAAW,EAAE;QAYvC,IAAgB,CAAA,gBAAA,GAAW,EAAE;;AAQhC,QAAA,IAAI,CAAC,mBAAmB,GAAG,CAAU,OAAA,EAAA,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,OAAO,CAAC,EAAE;AACzE,QAAA,IAAI,CAAC,mBAAmB,GAAG,MAAM;AACjC,QAAA,IAAI,CAAC,YAAY,GAAG,KAAK;AACzB,QAAA,IAAI,CAAC,YAAY,GAAG,KAAK;AACzB,QAAA,IAAI,CAAC,OAAO,GAAG,EAAE;AACjB,QAAA,IAAI,CAAC,QAAQ,GAAG,EAAE;AAClB,QAAA,IAAI,CAAC,MAAM,GAAG,EAAE;AAChB,QAAA,IAAI,CAAC,oBAAoB,GAAG,EAAE;AAC9B,QAAA,IAAI,CAAC,IAAI,GAAG,CAAC;AACb,QAAA,IAAI,CAAC,OAAO,GAAG,KAAK;;AAGxB,IAAA,WAAW,CAAC,OAAsB,EAAA;QAC9B,IAAI,OAAO,CAAC,SAAS,CAAC,IAAI,OAAO,CAAC,KAAK,CAAC,EAAC;YACrC,IAAI,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,OAAO,EAAE;gBAC1B,IAAI,OAAO,GAAG,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC;AAC/B,gBAAA,IAAI,CAAC,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC;AACzC,gBAAA,IAAI,CAAC,QAAQ,GAAG,OAAO;gBACvB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC;AAC5C,gBAAA,IAAI,CAAC,oBAAoB,GAAG,CAAI,CAAA,EAAA,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;AACpE,gBAAA,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC,CAAC,MAAM,GAAG,CAAC,GAAG,OAAO,GAAG,MAAM;;iBAC7F;gBACH,IAAI,CAAC,MAAM,GAAG,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC;;;;AAK3C,IAAA,QAAQ;AAED,IAAA,iBAAiB,CAAC,KAAiB,EAAE,KAAa,EAAE,MAAoB,EAAA;QAC3E,KAAK,CAAC,eAAe,EAAE;AAEvB,QAAA,IAAI,IAAI,CAAC,gBAAgB,KAAK,UAAU,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,EAAE;AACpE,YAAA,IAAI,CAAC,YAAY,GAAG,KAAK;YACzB;;AAGJ,QAAA,MAAM,mBAAmB,GAAG,IAAI,CAAC,mBAAmB,GAAG,KAAK;QAC5D,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,gBAAgB,KAAK,mBAAmB,EAAE;AACpE,YAAA,IAAI,CAAC,YAAY,GAAG,KAAK;YACzB;;AAGJ,QAAA,IAAI,CAAC,iBAAiB,GAAG,MAAM;QAC/B,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,mBAAmB,GAAG,KAAK;AACxD,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI;;AAGrB,IAAA,oBAAoB,CAAC,KAAiB,EAAA;QACzC,KAAK,CAAC,eAAe,EAAE;;+GA7ElB,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAvB,uBAAuB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,GAAA,EAAA,KAAA,EAAA,IAAA,EAAA,MAAA,EAAA,WAAA,EAAA,aAAA,EAAA,OAAA,EAAA,SAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECfpC,omFAiEA,EAAA,MAAA,EAAA,CAAA,yPAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDpDc,KAAK,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,cAAA,EAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,kBAAkB,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,YAAA,EAAA,UAAA,EAAA,aAAA,EAAA,aAAA,EAAA,aAAA,EAAA,cAAA,EAAA,QAAA,EAAA,MAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,eAAA,EAAA,sBAAA,EAAA,gBAAA,EAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,IAAI,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,eAAe,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,kBAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,qBAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,kBAAA,EAAA,QAAA,EAAA,WAAA,EAAA,oBAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,mBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,UAAA,EAAA,UAAA,EAAA,YAAA,EAAA,SAAA,EAAA,cAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,WAAA,EAAA,QAAA,EAAA,OAAA,EAAA,eAAA,EAAA,cAAA,EAAA,SAAA,EAAA,OAAA,EAAA,aAAA,CAAA,EAAA,OAAA,EAAA,CAAA,gBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,UAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,SAAA,EAAA,iBAAA,EAAA,iBAAA,EAAA,2BAAA,EAAA,iBAAA,EAAA,uBAAA,EAAA,sBAAA,EAAA,gBAAA,EAAA,wBAAA,EAAA,cAAA,EAAA,iBAAA,EAAA,0BAAA,EAAA,0BAAA,EAAA,YAAA,EAAA,yBAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,eAAA,EAAA,oBAAA,EAAA,uBAAA,EAAA,iBAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,aAAA,EAAA,qBAAA,EAAA,oBAAA,EAAA,eAAA,EAAA,aAAA,EAAA,mBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,kBAAkB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,qBAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,eAAA,EAAA,WAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,iBAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,YAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,eAAA,EAAA,WAAA,EAAA,OAAA,CAAA,EAAA,OAAA,EAAA,CAAA,aAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,eAAA,EAAA,UAAA,EAAA,WAAA,EAAA,qBAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,mBAAA,EAAA,cAAA,EAAA,sBAAA,EAAA,uBAAA,EAAA,uBAAA,EAAA,sBAAA,EAAA,kBAAA,EAAA,uBAAA,EAAA,qBAAA,EAAA,qBAAA,EAAA,iBAAA,EAAA,aAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FAErE,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBARnC,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,kBAAkB,mBAGX,uBAAuB,CAAC,MAAM,EAAA,UAAA,EACnC,IAAI,EACP,OAAA,EAAA,CAAC,KAAK,EAAE,kBAAkB,EAAE,IAAI,EAAE,eAAe,EAAE,kBAAkB,CAAC,EAAA,QAAA,EAAA,omFAAA,EAAA,MAAA,EAAA,CAAA,yPAAA,CAAA,EAAA;wDAI/D,OAAO,EAAA,CAAA;sBAAtB;gBACe,GAAG,EAAA,CAAA;sBAAlB;gBACe,IAAI,EAAA,CAAA;sBAAnB;gBACe,WAAW,EAAA,CAAA;sBAA1B;gBACe,OAAO,EAAA,CAAA;sBAAtB;gBACe,gBAAgB,EAAA,CAAA;sBAA/B;gBACe,iBAAiB,EAAA,CAAA;sBAAhC;;;AEvBL;;AAEG;;;;"}

package/fesm2022/spicainternational-ngx-sds-components-src-lib-badge.mjs CHANGED Viewed

@@ -51,11 +51,11 @@ class SdsBadgeComponent {
         this.cdRef.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SdsBadgeComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SdsBadgeComponent, isStandalone: true, selector: "sds-badge", ngImport: i0, template: "<div \r\n    class=\"sds-badge\"\r\n    [ngClass]=\"[variant]\"\r\n    [style.left.px]=\"left\"\r\n    [class.default]=\"size === 'default'\"\r\n    [class.small]=\"size === 'small'\"\r\n    >\r\n    <span *ngIf=\"size=='default'\">{{text}}</span>\r\n</div>\r\n", styles: [":host{position:absolute}.sds-badge{position:relative;display:flex;justify-content:center;align-items:center;color:#fff;font-size:.8rem;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;border-radius:1.3rem;border-width:1px;border-style:solid;border-color:#fff;cursor:default;transform:translate(calc(-50% - 1px),-50%)}.sds-badge.default{line-height:1.3rem;min-width:calc(1.3rem + 2px);padding-left:.3rem;padding-right:.3rem}.sds-badge.small{height:.75rem;width:.75rem}.sds-badge.primary{background-color:var(--bs-primary)}.sds-badge.secondary{border-color:var(--bs-gray-400);background-color:#fff;color:#000}.sds-badge.danger{background-color:var(--bs-danger)}.sds-badge.success{background-color:var(--bs-success)}.sds-badge.warning{background-color:var(--bs-warning)}.sds-badge.info{background-color:var(--bs-info)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SdsBadgeComponent, isStandalone: true, selector: "sds-badge", ngImport: i0, template: "<div \n    class=\"sds-badge\"\n    [ngClass]=\"[variant]\"\n    [style.left.px]=\"left\"\n    [class.default]=\"size === 'default'\"\n    [class.small]=\"size === 'small'\"\n    >\n    <span *ngIf=\"size=='default'\">{{text}}</span>\n</div>\n", styles: [":host{position:absolute}.sds-badge{position:relative;display:flex;justify-content:center;align-items:center;color:#fff;font-size:.8rem;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;border-radius:1.3rem;border-width:1px;border-style:solid;border-color:#fff;cursor:default;transform:translate(calc(-50% - 1px),-50%)}.sds-badge.default{line-height:1.3rem;min-width:calc(1.3rem + 2px);padding-left:.3rem;padding-right:.3rem}.sds-badge.small{height:.75rem;width:.75rem}.sds-badge.primary{background-color:var(--bs-primary)}.sds-badge.secondary{border-color:var(--bs-gray-400);background-color:#fff;color:#000}.sds-badge.danger{background-color:var(--bs-danger)}.sds-badge.success{background-color:var(--bs-success)}.sds-badge.warning{background-color:var(--bs-warning)}.sds-badge.info{background-color:var(--bs-info)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SdsBadgeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sds-badge', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgClass, NgIf], template: "<div \r\n    class=\"sds-badge\"\r\n    [ngClass]=\"[variant]\"\r\n    [style.left.px]=\"left\"\r\n    [class.default]=\"size === 'default'\"\r\n    [class.small]=\"size === 'small'\"\r\n    >\r\n    <span *ngIf=\"size=='default'\">{{text}}</span>\r\n</div>\r\n", styles: [":host{position:absolute}.sds-badge{position:relative;display:flex;justify-content:center;align-items:center;color:#fff;font-size:.8rem;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;border-radius:1.3rem;border-width:1px;border-style:solid;border-color:#fff;cursor:default;transform:translate(calc(-50% - 1px),-50%)}.sds-badge.default{line-height:1.3rem;min-width:calc(1.3rem + 2px);padding-left:.3rem;padding-right:.3rem}.sds-badge.small{height:.75rem;width:.75rem}.sds-badge.primary{background-color:var(--bs-primary)}.sds-badge.secondary{border-color:var(--bs-gray-400);background-color:#fff;color:#000}.sds-badge.danger{background-color:var(--bs-danger)}.sds-badge.success{background-color:var(--bs-success)}.sds-badge.warning{background-color:var(--bs-warning)}.sds-badge.info{background-color:var(--bs-info)}\n"] }]
+            args: [{ selector: 'sds-badge', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgClass, NgIf], template: "<div \n    class=\"sds-badge\"\n    [ngClass]=\"[variant]\"\n    [style.left.px]=\"left\"\n    [class.default]=\"size === 'default'\"\n    [class.small]=\"size === 'small'\"\n    >\n    <span *ngIf=\"size=='default'\">{{text}}</span>\n</div>\n", styles: [":host{position:absolute}.sds-badge{position:relative;display:flex;justify-content:center;align-items:center;color:#fff;font-size:.8rem;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;border-radius:1.3rem;border-width:1px;border-style:solid;border-color:#fff;cursor:default;transform:translate(calc(-50% - 1px),-50%)}.sds-badge.default{line-height:1.3rem;min-width:calc(1.3rem + 2px);padding-left:.3rem;padding-right:.3rem}.sds-badge.small{height:.75rem;width:.75rem}.sds-badge.primary{background-color:var(--bs-primary)}.sds-badge.secondary{border-color:var(--bs-gray-400);background-color:#fff;color:#000}.sds-badge.danger{background-color:var(--bs-danger)}.sds-badge.success{background-color:var(--bs-success)}.sds-badge.warning{background-color:var(--bs-warning)}.sds-badge.info{background-color:var(--bs-info)}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] });
 class SdsBadgeDirective {

package/fesm2022/spicainternational-ngx-sds-components-src-lib-badge.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"spicainternational-ngx-sds-components-src-lib-badge.mjs","sources":["../../../projects/ngx-sds-components/src/lib/badge/components/badge.component.ts","../../../projects/ngx-sds-components/src/lib/badge/components/badge.component.html","../../../projects/ngx-sds-components/src/lib/badge/badge.directive.ts","../../../projects/ngx-sds-components/src/lib/badge/spicainternational-ngx-sds-components-src-lib-badge.ts"],"sourcesContent":["import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';\r\nimport { BadgeSize, BadgeVariant } from '../badge.types';\r\nimport { NgClass, NgIf } from '@angular/common';\r\n\r\n@Component({\r\n selector: 'sds-badge',\r\n templateUrl: './badge.component.html',\r\n styleUrls: ['./badge.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n standalone: true,\r\n imports: [NgClass, NgIf]\r\n})\r\nexport class SdsBadgeComponent implements OnInit {\r\n private _text: string = '';\r\n private _size: BadgeSize = 'default';\r\n private _variant: BadgeVariant = 'primary';\r\n private _left: number = 0;\r\n\r\n\r\n public get text() {\r\n return this._text;\r\n }\r\n\r\n public set text(value: string) {\r\n if (this._text !== value) {\r\n this._text = value;\r\n this.refresh();\r\n }\r\n }\r\n\r\n public get size() {\r\n return this._size;\r\n }\r\n\r\n public set size(value: BadgeSize) {\r\n if (this._size !== value) {\r\n this._size = value;\r\n this.refresh();\r\n }\r\n }\r\n\r\n public get variant() {\r\n return this._variant;\r\n }\r\n\r\n public set variant(value: BadgeVariant) {\r\n if (this._variant !== value) {\r\n this._variant = value;\r\n this.refresh();\r\n }\r\n }\r\n\r\n public get left() {\r\n return this._left;\r\n }\r\n\r\n public set left(value: number) {\r\n if (this._left !== value) {\r\n this._left = value;\r\n this.refresh();\r\n }\r\n }\r\n\r\n \r\n \r\n\r\n constructor(\r\n private readonly cdRef: ChangeDetectorRef\r\n ) {}\r\n\r\n ngOnInit(): void {}\r\n\r\n\r\n private refresh(){\r\n this.cdRef.detectChanges();\r\n }\r\n}\r\n","<div \r\n class=\"sds-badge\"\r\n [ngClass]=\"[variant]\"\r\n [style.left.px]=\"left\"\r\n [class.default]=\"size === 'default'\"\r\n [class.small]=\"size === 'small'\"\r\n >\r\n <span ngIf=\"size=='default'\">{{text}}</span>\r\n</div>\r\n","import {\r\n AfterViewInit,\r\n ApplicationRef,\r\n ComponentRef,\r\n Directive,\r\n ElementRef,\r\n Input,\r\n OnChanges,\r\n OnDestroy,\r\n OnInit,\r\n SimpleChanges,\r\n ViewContainerRef,\r\n} from '@angular/core';\r\nimport { BadgeSize, BadgeVariant } from './badge.types';\r\nimport { SdsBadgeComponent } from './components/badge.component';\r\n\r\n@Directive({\r\n selector: '[sdsBadge]',\r\n standalone: true,\r\n})\r\nexport class SdsBadgeDirective implements OnInit, OnChanges, OnDestroy, AfterViewInit {\r\n @Input() sdsBadge = '';\r\n @Input() size: BadgeSize = 'default';\r\n @Input() variant: BadgeVariant = 'primary';\r\n\r\n private badgeComponentRef: ComponentRef<any> \| null = null;\r\n private observer: any; //ResizeObserver = null;\r\n\r\n constructor(\r\n private host: ElementRef,\r\n private appRef: ApplicationRef,\r\n private viewContainerRef: ViewContainerRef\r\n ) {}\r\n\r\n ngAfterViewInit(): void {\r\n this.initializeBadge();\r\n }\r\n\r\n ngOnInit(): void {\r\n // const observer \r\n this.observer = new ResizeObserver(_ => {\r\n if (this.badgeComponentRef) {\r\n this.setBadgePosition();\r\n // this.badgeComponentRef.instance.left = this.host.nativeElement.offsetWidth;\r\n }\r\n });\r\n \r\n this.observer.observe(this.host.nativeElement);\r\n }; \r\n\r\n ngOnChanges(changes: SimpleChanges): void {\r\n if (changes['sdsBadge'] && !changes['sdsBadge'].firstChange) {\r\n const value = `${changes['sdsBadge'].currentValue}`.trim();\r\n if (value?.length > 0) {\r\n this.initializeBadge();\r\n } else {\r\n this.destroyBadgeComponentRef();\r\n }\r\n }\r\n }\r\n\r\n ngOnDestroy() {\r\n this.observer.unobserve(this.host.nativeElement);\r\n this.observer.disconnect();\r\n\r\n this.destroyBadgeComponentRef();\r\n }\r\n\r\n private initializeBadge() {\r\n if (this.badgeComponentRef === null) {\r\n if (this.sdsBadge) {\r\n this.badgeComponentRef = this.viewContainerRef.createComponent(SdsBadgeComponent);\r\n this.badgeComponentRef.instance.text = this.sdsBadge;\r\n this.badgeComponentRef.instance.variant = this.variant;\r\n this.badgeComponentRef.instance.size = this.size;\r\n\r\n this.setBadgePosition();\r\n }\r\n } else {\r\n this.badgeComponentRef.instance.text = this.sdsBadge;\r\n this.badgeComponentRef.instance.variant = this.variant;\r\n this.badgeComponentRef.instance.size = this.size;\r\n\r\n this.setBadgePosition();\r\n }\r\n }\r\n\r\n private destroyBadgeComponentRef(){\r\n if (this.badgeComponentRef !== null) {\r\n this.appRef.detachView(this.badgeComponentRef.hostView);\r\n this.badgeComponentRef.destroy();\r\n this.badgeComponentRef = null;\r\n } \r\n }\r\n\r\n private setBadgePosition(){\r\n if (this.badgeComponentRef) {\r\n this.badgeComponentRef.instance.left = this.host.nativeElement.offsetLeft + this.host.nativeElement.offsetWidth;\r\n // console.log(`offsetLeft ${this.host.nativeElement.offsetLeft}, offsetWidth: ${this.host.nativeElement.offsetWidth}`);\r\n }\r\n }\r\n\r\n}\r\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;MAYa,iBAAiB,CAAA;AAO1B,IAAA,IAAW,IAAI,GAAA;QACX,OAAO,IAAI,CAAC,KAAK;;IAGrB,IAAW,IAAI,CAAC,KAAa,EAAA;AACzB,QAAA,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,EAAE;AACtB,YAAA,IAAI,CAAC,KAAK,GAAG,KAAK;YAClB,IAAI,CAAC,OAAO,EAAE;;;AAItB,IAAA,IAAW,IAAI,GAAA;QACX,OAAO,IAAI,CAAC,KAAK;;IAGrB,IAAW,IAAI,CAAC,KAAgB,EAAA;AAC5B,QAAA,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,EAAE;AACtB,YAAA,IAAI,CAAC,KAAK,GAAG,KAAK;YAClB,IAAI,CAAC,OAAO,EAAE;;;AAItB,IAAA,IAAW,OAAO,GAAA;QACd,OAAO,IAAI,CAAC,QAAQ;;IAGxB,IAAW,OAAO,CAAC,KAAmB,EAAA;AAClC,QAAA,IAAI,IAAI,CAAC,QAAQ,KAAK,KAAK,EAAE;AACzB,YAAA,IAAI,CAAC,QAAQ,GAAG,KAAK;YACrB,IAAI,CAAC,OAAO,EAAE;;;AAItB,IAAA,IAAW,IAAI,GAAA;QACX,OAAO,IAAI,CAAC,KAAK;;IAGrB,IAAW,IAAI,CAAC,KAAa,EAAA;AACzB,QAAA,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,EAAE;AACtB,YAAA,IAAI,CAAC,KAAK,GAAG,KAAK;YAClB,IAAI,CAAC,OAAO,EAAE;;;AAOtB,IAAA,WAAA,CACqB,KAAwB,EAAA;QAAxB,IAAK,CAAA,KAAA,GAAL,KAAK;QAtDlB,IAAK,CAAA,KAAA,GAAW,EAAE;QAClB,IAAK,CAAA,KAAA,GAAc,SAAS;QAC5B,IAAQ,CAAA,QAAA,GAAiB,SAAS;QAClC,IAAK,CAAA,KAAA,GAAW,CAAC;;AAsDzB,IAAA,QAAQ;IAGA,OAAO,GAAA;AACX,QAAA,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE;;+GA9DrB,iBAAiB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAjB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,iBAAiB,ECZ9B,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,WAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,uQASA,EDCc,MAAA,EAAA,CAAA,4zBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,OAAO,oFAAE,IAAI,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FAEd,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAR7B,SAAS;+BACI,WAAW,EAAA,eAAA,EAGJ,uBAAuB,CAAC,MAAM,EAAA,UAAA,EACnC,IAAI,EAAA,OAAA,EACP,CAAC,OAAO,EAAE,IAAI,CAAC,EAAA,QAAA,EAAA,uQAAA,EAAA,MAAA,EAAA,CAAA,4zBAAA,CAAA,EAAA;;;MEUf,iBAAiB,CAAA;AAQ1B,IAAA,WAAA,CACY,IAAgB,EAChB,MAAsB,EACtB,gBAAkC,EAAA;QAFlC,IAAI,CAAA,IAAA,GAAJ,IAAI;QACJ,IAAM,CAAA,MAAA,GAAN,MAAM;QACN,IAAgB,CAAA,gBAAA,GAAhB,gBAAgB;QAVnB,IAAQ,CAAA,QAAA,GAAG,EAAE;QACb,IAAI,CAAA,IAAA,GAAc,SAAS;QAC3B,IAAO,CAAA,OAAA,GAAiB,SAAS;QAElC,IAAiB,CAAA,iBAAA,GAA6B,IAAI;;IAS1D,eAAe,GAAA;QACX,IAAI,CAAC,eAAe,EAAE;;IAG1B,QAAQ,GAAA;;QAEJ,IAAI,CAAC,QAAQ,GAAG,IAAI,cAAc,CAAC,CAAC,IAAG;AACnC,YAAA,IAAI,IAAI,CAAC,iBAAiB,EAAE;gBACxB,IAAI,CAAC,gBAAgB,EAAE;;;AAG/B,SAAC,CAAC;QAEF,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC;;;AAGlD,IAAA,WAAW,CAAC,OAAsB,EAAA;AAC9B,QAAA,IAAI,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,WAAW,EAAE;AACzD,YAAA,MAAM,KAAK,GAAG,CAAG,EAAA,OAAO,CAAC,UAAU,CAAC,CAAC,YAAY,CAAA,CAAE,CAAC,IAAI,EAAE;AAC1D,YAAA,IAAI,KAAK,EAAE,MAAM,GAAG,CAAC,EAAE;gBACnB,IAAI,CAAC,eAAe,EAAE;;iBACnB;gBACH,IAAI,CAAC,wBAAwB,EAAE;;;;IAK3C,WAAW,GAAA;QACP,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC;AAChD,QAAA,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE;QAE1B,IAAI,CAAC,wBAAwB,EAAE;;IAG3B,eAAe,GAAA;AACnB,QAAA,IAAI,IAAI,CAAC,iBAAiB,KAAK,IAAI,EAAE;AACjC,YAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACf,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,gBAAgB,CAAC,eAAe,CAAC,iBAAiB,CAAC;gBACjF,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAC,QAAQ;gBACpD,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO;gBACtD,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI;gBAEhD,IAAI,CAAC,gBAAgB,EAAE;;;aAExB;YACH,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAC,QAAQ;YACpD,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO;YACtD,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI;YAEhD,IAAI,CAAC,gBAAgB,EAAE;;;IAIvB,wBAAwB,GAAA;AAC5B,QAAA,IAAI,IAAI,CAAC,iBAAiB,KAAK,IAAI,EAAE;YACjC,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC;AACvD,YAAA,IAAI,CAAC,iBAAiB,CAAC,OAAO,EAAE;AAChC,YAAA,IAAI,CAAC,iBAAiB,GAAG,IAAI;;;IAI7B,gBAAgB,GAAA;AACpB,QAAA,IAAI,IAAI,CAAC,iBAAiB,EAAE;YACxB,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,WAAW;;;;+GA7E9G,iBAAiB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,UAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,cAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAjB,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,QAAA,EAAA,UAAA,EAAA,IAAA,EAAA,MAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;4FAAjB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAJ7B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,YAAY;AACtB,oBAAA,UAAU,EAAE,IAAI;AACnB,iBAAA;2IAEY,QAAQ,EAAA,CAAA;sBAAhB;gBACQ,IAAI,EAAA,CAAA;sBAAZ;gBACQ,OAAO,EAAA,CAAA;sBAAf;;;ACvBL;;AAEG;;;;"}
1	+ {"version":3,"file":"spicainternational-ngx-sds-components-src-lib-badge.mjs","sources":["../../../projects/ngx-sds-components/src/lib/badge/components/badge.component.ts","../../../projects/ngx-sds-components/src/lib/badge/components/badge.component.html","../../../projects/ngx-sds-components/src/lib/badge/badge.directive.ts","../../../projects/ngx-sds-components/src/lib/badge/spicainternational-ngx-sds-components-src-lib-badge.ts"],"sourcesContent":["import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';\nimport { BadgeSize, BadgeVariant } from '../badge.types';\nimport { NgClass, NgIf } from '@angular/common';\n\n@Component({\n selector: 'sds-badge',\n templateUrl: './badge.component.html',\n styleUrls: ['./badge.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n imports: [NgClass, NgIf]\n})\nexport class SdsBadgeComponent implements OnInit {\n private _text: string = '';\n private _size: BadgeSize = 'default';\n private _variant: BadgeVariant = 'primary';\n private _left: number = 0;\n\n\n public get text() {\n return this._text;\n }\n\n public set text(value: string) {\n if (this._text !== value) {\n this._text = value;\n this.refresh();\n }\n }\n\n public get size() {\n return this._size;\n }\n\n public set size(value: BadgeSize) {\n if (this._size !== value) {\n this._size = value;\n this.refresh();\n }\n }\n\n public get variant() {\n return this._variant;\n }\n\n public set variant(value: BadgeVariant) {\n if (this._variant !== value) {\n this._variant = value;\n this.refresh();\n }\n }\n\n public get left() {\n return this._left;\n }\n\n public set left(value: number) {\n if (this._left !== value) {\n this._left = value;\n this.refresh();\n }\n }\n\n \n \n\n constructor(\n private readonly cdRef: ChangeDetectorRef\n ) {}\n\n ngOnInit(): void {}\n\n\n private refresh(){\n this.cdRef.detectChanges();\n }\n}\n","<div \n class=\"sds-badge\"\n [ngClass]=\"[variant]\"\n [style.left.px]=\"left\"\n [class.default]=\"size === 'default'\"\n [class.small]=\"size === 'small'\"\n >\n <span ngIf=\"size=='default'\">{{text}}</span>\n</div>\n","import {\n AfterViewInit,\n ApplicationRef,\n ComponentRef,\n Directive,\n ElementRef,\n Input,\n OnChanges,\n OnDestroy,\n OnInit,\n SimpleChanges,\n ViewContainerRef,\n} from '@angular/core';\nimport { BadgeSize, BadgeVariant } from './badge.types';\nimport { SdsBadgeComponent } from './components/badge.component';\n\n@Directive({\n selector: '[sdsBadge]',\n standalone: true,\n})\nexport class SdsBadgeDirective implements OnInit, OnChanges, OnDestroy, AfterViewInit {\n @Input() sdsBadge = '';\n @Input() size: BadgeSize = 'default';\n @Input() variant: BadgeVariant = 'primary';\n\n private badgeComponentRef: ComponentRef<any> \| null = null;\n private observer: any; //ResizeObserver = null;\n\n constructor(\n private host: ElementRef,\n private appRef: ApplicationRef,\n private viewContainerRef: ViewContainerRef\n ) {}\n\n ngAfterViewInit(): void {\n this.initializeBadge();\n }\n\n ngOnInit(): void {\n // const observer \n this.observer = new ResizeObserver(_ => {\n if (this.badgeComponentRef) {\n this.setBadgePosition();\n // this.badgeComponentRef.instance.left = this.host.nativeElement.offsetWidth;\n }\n });\n \n this.observer.observe(this.host.nativeElement);\n }; \n\n ngOnChanges(changes: SimpleChanges): void {\n if (changes['sdsBadge'] && !changes['sdsBadge'].firstChange) {\n const value = `${changes['sdsBadge'].currentValue}`.trim();\n if (value?.length > 0) {\n this.initializeBadge();\n } else {\n this.destroyBadgeComponentRef();\n }\n }\n }\n\n ngOnDestroy() {\n this.observer.unobserve(this.host.nativeElement);\n this.observer.disconnect();\n\n this.destroyBadgeComponentRef();\n }\n\n private initializeBadge() {\n if (this.badgeComponentRef === null) {\n if (this.sdsBadge) {\n this.badgeComponentRef = this.viewContainerRef.createComponent(SdsBadgeComponent);\n this.badgeComponentRef.instance.text = this.sdsBadge;\n this.badgeComponentRef.instance.variant = this.variant;\n this.badgeComponentRef.instance.size = this.size;\n\n this.setBadgePosition();\n }\n } else {\n this.badgeComponentRef.instance.text = this.sdsBadge;\n this.badgeComponentRef.instance.variant = this.variant;\n this.badgeComponentRef.instance.size = this.size;\n\n this.setBadgePosition();\n }\n }\n\n private destroyBadgeComponentRef(){\n if (this.badgeComponentRef !== null) {\n this.appRef.detachView(this.badgeComponentRef.hostView);\n this.badgeComponentRef.destroy();\n this.badgeComponentRef = null;\n } \n }\n\n private setBadgePosition(){\n if (this.badgeComponentRef) {\n this.badgeComponentRef.instance.left = this.host.nativeElement.offsetLeft + this.host.nativeElement.offsetWidth;\n // console.log(`offsetLeft ${this.host.nativeElement.offsetLeft}, offsetWidth: ${this.host.nativeElement.offsetWidth}`);\n }\n }\n\n}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/spicainternational-ngx-sds-components-src-lib-callout.mjs CHANGED Viewed

@@ -8,11 +8,11 @@ class SdsCalloutComponent {
     }
     ngOnInit() { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SdsCalloutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SdsCalloutComponent, isStandalone: true, selector: "sds-callout", inputs: { color: "color", backgroundColor: "backgroundColor" }, ngImport: i0, template: "<div class=\"callout\"\r\n    [class]=\"(color ? 'callout-' + color : null)\"\r\n    [style.backgroundColor]=\"backgroundColor\"\r\n    >\r\n    <ng-content></ng-content>\r\n</div>\r\n", styles: [""] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SdsCalloutComponent, isStandalone: true, selector: "sds-callout", inputs: { color: "color", backgroundColor: "backgroundColor" }, ngImport: i0, template: "<div class=\"callout\"\n    [class]=\"(color ? 'callout-' + color : null)\"\n    [style.backgroundColor]=\"backgroundColor\"\n    >\n    <ng-content></ng-content>\n</div>\n", styles: [""] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SdsCalloutComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sds-callout', standalone: true, template: "<div class=\"callout\"\r\n    [class]=\"(color ? 'callout-' + color : null)\"\r\n    [style.backgroundColor]=\"backgroundColor\"\r\n    >\r\n    <ng-content></ng-content>\r\n</div>\r\n" }]
+            args: [{ selector: 'sds-callout', standalone: true, template: "<div class=\"callout\"\n    [class]=\"(color ? 'callout-' + color : null)\"\n    [style.backgroundColor]=\"backgroundColor\"\n    >\n    <ng-content></ng-content>\n</div>\n" }]
         }], ctorParameters: () => [], propDecorators: { color: [{
                 type: Input
             }], backgroundColor: [{

package/fesm2022/spicainternational-ngx-sds-components-src-lib-callout.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"spicainternational-ngx-sds-components-src-lib-callout.mjs","sources":["../../../projects/ngx-sds-components/src/lib/callout/callout.component.ts","../../../projects/ngx-sds-components/src/lib/callout/callout.component.html","../../../projects/ngx-sds-components/src/lib/callout/spicainternational-ngx-sds-components-src-lib-callout.ts"],"sourcesContent":["import { Component, Input, OnInit } from '@angular/core';\r\n\r\n@Component({\r\n selector: 'sds-callout',\r\n templateUrl: './callout.component.html',\r\n styleUrls: ['./callout.component.scss'],\r\n standalone: true,\r\n})\r\nexport class SdsCalloutComponent implements OnInit {\r\n @Input() color: string = 'info';\r\n @Input() backgroundColor: string = 'white';\r\n \r\n\r\n\r\n constructor() {}\r\n\r\n ngOnInit(): void {}\r\n}\r\n","<div class=\"callout\"\r\n [class]=\"(color ? 'callout-' + color : null)\"\r\n [style.backgroundColor]=\"backgroundColor\"\r\n >\r\n <ng-content></ng-content>\r\n</div>\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;MAQa,mBAAmB,CAAA;AAM5B,IAAA,WAAA,GAAA;QALS,IAAK,CAAA,KAAA,GAAW,MAAM;QACtB,IAAe,CAAA,eAAA,GAAW,OAAO;;AAM1C,IAAA,QAAQ;+GARC,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAnB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,mBAAmB,uICRhC,~~0LAMA~~,EAAA,MAAA,EAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;4FDEa,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAN/B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,cAGX,IAAI,EAAA,QAAA,EAAA,~~0LAAA~~,EAAA;wDAGP,KAAK,EAAA,CAAA;sBAAb;gBACQ,eAAe,EAAA,CAAA;sBAAvB;;;AEVL;;AAEG;;;;"}
1	+ {"version":3,"file":"spicainternational-ngx-sds-components-src-lib-callout.mjs","sources":["../../../projects/ngx-sds-components/src/lib/callout/callout.component.ts","../../../projects/ngx-sds-components/src/lib/callout/callout.component.html","../../../projects/ngx-sds-components/src/lib/callout/spicainternational-ngx-sds-components-src-lib-callout.ts"],"sourcesContent":["import { Component, Input, OnInit } from '@angular/core';\n\n@Component({\n selector: 'sds-callout',\n templateUrl: './callout.component.html',\n styleUrls: ['./callout.component.scss'],\n standalone: true,\n})\nexport class SdsCalloutComponent implements OnInit {\n @Input() color: string = 'info';\n @Input() backgroundColor: string = 'white';\n \n\n\n constructor() {}\n\n ngOnInit(): void {}\n}\n","<div class=\"callout\"\n [class]=\"(color ? 'callout-' + color : null)\"\n [style.backgroundColor]=\"backgroundColor\"\n >\n <ng-content></ng-content>\n</div>\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;MAQa,mBAAmB,CAAA;AAM5B,IAAA,WAAA,GAAA;QALS,IAAK,CAAA,KAAA,GAAW,MAAM;QACtB,IAAe,CAAA,eAAA,GAAW,OAAO;;AAM1C,IAAA,QAAQ;+GARC,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAnB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,mBAAmB,uICRhC,8KAMA,EAAA,MAAA,EAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;4FDEa,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAN/B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,cAGX,IAAI,EAAA,QAAA,EAAA,8KAAA,EAAA;wDAGP,KAAK,EAAA,CAAA;sBAAb;gBACQ,eAAe,EAAA,CAAA;sBAAvB;;;AEVL;;AAEG;;;;"}

package/fesm2022/spicainternational-ngx-sds-components-src-lib-color-picker.mjs CHANGED Viewed

@@ -50,7 +50,7 @@ class SdsColorPickerComponent {
         this.showDropdown = !this.showDropdown;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SdsColorPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SdsColorPickerComponent, isStandalone: true, selector: "sds-color-picker", inputs: { colors: "colors", disabled: "disabled", selectedColor: "selectedColor", defaultColor: "defaultColor", style: "style", showCaret: "showCaret", shape: "shape" }, outputs: { selectedColorChange: "selectedColorChange", selectedColorIndexChange: "selectedColorIndexChange" }, usesOnChanges: true, ngImport: i0, template: "<div\r\n    *ngIf=\"style === 'inline'\"\r\n    class=\"color-tiles-container-inline\"\r\n    [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\r\n>\r\n    <div\r\n        *ngFor=\"let color of colors; index as i\"\r\n        [style.background-color]=\"color\"\r\n        [style.border-color]=\"color\"\r\n        class=\"color-tile\"\r\n        [class.selected]=\"selectedColor === color\"\r\n        (click)=\"selectColorByIndex(i)\"\r\n    >\r\n        <fa-icon\r\n            *ngIf=\"selectedColor === color\"\r\n            [icon]=\"['fas', 'check']\"\r\n        >\r\n        </fa-icon>\r\n    </div>\r\n</div>\r\n\r\n<ng-container *ngIf=\"style === 'dropdown'\">\r\n\r\n    <button\r\n        #popoverTarget\r\n        type=\"button\"\r\n        class=\"btn d-flex align-items-center\"\r\n        [class.dropdown-toggle]=\"showCaret\"\r\n        [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\r\n        aria-controls=\"dropdown-basic\"\r\n        (click)=\"toggleDropdown()\"\r\n        (keydown)=\"onKeyDown($event)\"\r\n    >\r\n\r\n        <div\r\n            class=\"color-tile color-tile-dropdown\"\r\n            [style.background-color]=\"selectedColor || defaultColor\"\r\n            [class.undefined-color]=\"!(selectedColor || defaultColor)\"\r\n        >\r\n        </div>\r\n    </button>\r\n\r\n    <dx-popover\r\n        [target]=\"popoverTarget\"\r\n        position=\"bottom\"\r\n        [(visible)]=\"showDropdown\"\r\n    >\r\n        <div\r\n            class=\"color-tiles-container-square\"\r\n            [ngStyle]=\"{ 'grid-template-columns': dropdownGridTemplateColumns}\"\r\n            [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\r\n        >\r\n            <div\r\n                *ngFor=\"let color of colors; index as i\"\r\n                [style.background-color]=\"color\"\r\n                class=\"color-tile color-tile-popover sds-btn-reactive\"\r\n                (click)=\"selectColorByIndex(i)\"\r\n            >\r\n            <fa-icon\r\n                *ngIf=\"selectedColor === color || !selectedColor && defaultColor === color\"\r\n                [icon]=\"checkIcon\"\r\n            >\r\n            </fa-icon>\r\n\r\n            </div>\r\n        </div>\r\n    </dx-popover>\r\n</ng-container>", styles: [".color-tiles-container-inline{display:flex;gap:.5rem;color:#fff}.color-tiles-container-square{display:grid;gap:1rem;color:#fff}.color-tile{height:2rem;width:2rem;display:flex;align-items:center;justify-content:center;border-radius:var(--sds-cp-radius);cursor:pointer}.color-tile.color-tile-popover:hover{filter:brightness(90%)}.color-tile fa-icon{line-height:1rem}.color-tile.undefined-color{border-color:gray;border-style:solid;border-width:1px}.btn:focus-visible{outline:0;box-shadow:0 0 0 .2rem #3b8fc240}.btn:active{border-color:transparent}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "ngmodule", type: DxPopoverModule }, { kind: "component", type: i2.DxPopoverComponent, selector: "dx-popover", inputs: ["animation", "closeOnOutsideClick", "container", "contentTemplate", "deferRendering", "disabled", "enableBodyScroll", "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", "deferRenderingChange", "disabledChange", "enableBodyScrollChange", "heightChange", "hideEventChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showEventChange", "showTitleChange", "targetChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SdsColorPickerComponent, isStandalone: true, selector: "sds-color-picker", inputs: { colors: "colors", disabled: "disabled", selectedColor: "selectedColor", defaultColor: "defaultColor", style: "style", showCaret: "showCaret", shape: "shape" }, outputs: { selectedColorChange: "selectedColorChange", selectedColorIndexChange: "selectedColorIndexChange" }, usesOnChanges: true, ngImport: i0, template: "<div\n    *ngIf=\"style === 'inline'\"\n    class=\"color-tiles-container-inline\"\n    [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\n>\n    <div\n        *ngFor=\"let color of colors; index as i\"\n        [style.background-color]=\"color\"\n        [style.border-color]=\"color\"\n        class=\"color-tile\"\n        [class.selected]=\"selectedColor === color\"\n        (click)=\"selectColorByIndex(i)\"\n    >\n        <fa-icon\n            *ngIf=\"selectedColor === color\"\n            [icon]=\"['fas', 'check']\"\n        >\n        </fa-icon>\n    </div>\n</div>\n\n<ng-container *ngIf=\"style === 'dropdown'\">\n\n    <button\n        #popoverTarget\n        type=\"button\"\n        class=\"btn d-flex align-items-center\"\n        [class.dropdown-toggle]=\"showCaret\"\n        [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\n        aria-controls=\"dropdown-basic\"\n        (click)=\"toggleDropdown()\"\n        (keydown)=\"onKeyDown($event)\"\n    >\n\n        <div\n            class=\"color-tile color-tile-dropdown\"\n            [style.background-color]=\"selectedColor || defaultColor\"\n            [class.undefined-color]=\"!(selectedColor || defaultColor)\"\n        >\n        </div>\n    </button>\n\n    <dx-popover\n        [target]=\"popoverTarget\"\n        position=\"bottom\"\n        [(visible)]=\"showDropdown\"\n    >\n        <div\n            class=\"color-tiles-container-square\"\n            [ngStyle]=\"{ 'grid-template-columns': dropdownGridTemplateColumns}\"\n            [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\n        >\n            <div\n                *ngFor=\"let color of colors; index as i\"\n                [style.background-color]=\"color\"\n                class=\"color-tile color-tile-popover sds-btn-reactive\"\n                (click)=\"selectColorByIndex(i)\"\n            >\n            <fa-icon\n                *ngIf=\"selectedColor === color || !selectedColor && defaultColor === color\"\n                [icon]=\"checkIcon\"\n            >\n            </fa-icon>\n\n            </div>\n        </div>\n    </dx-popover>\n</ng-container>", styles: [".color-tiles-container-inline{display:flex;gap:.5rem;color:#fff}.color-tiles-container-square{display:grid;gap:1rem;color:#fff}.color-tile{height:2rem;width:2rem;display:flex;align-items:center;justify-content:center;border-radius:var(--sds-cp-radius);cursor:pointer}.color-tile.color-tile-popover:hover{filter:brightness(90%)}.color-tile fa-icon{line-height:1rem}.color-tile.undefined-color{border-color:gray;border-style:solid;border-width:1px}.btn:focus-visible{outline:0;box-shadow:0 0 0 .2rem #3b8fc240}.btn:active{border-color:transparent}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "ngmodule", type: DxPopoverModule }, { kind: "component", type: i2.DxPopoverComponent, selector: "dx-popover", inputs: ["animation", "closeOnOutsideClick", "container", "contentTemplate", "deferRendering", "disabled", "enableBodyScroll", "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", "deferRenderingChange", "disabledChange", "enableBodyScrollChange", "heightChange", "hideEventChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showEventChange", "showTitleChange", "targetChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SdsColorPickerComponent, decorators: [{
             type: Component,
@@ -60,7 +60,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                         FontAwesomeModule,
                         DxPopoverModule,
                         NgStyle,
-                    ], template: "<div\r\n    *ngIf=\"style === 'inline'\"\r\n    class=\"color-tiles-container-inline\"\r\n    [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\r\n>\r\n    <div\r\n        *ngFor=\"let color of colors; index as i\"\r\n        [style.background-color]=\"color\"\r\n        [style.border-color]=\"color\"\r\n        class=\"color-tile\"\r\n        [class.selected]=\"selectedColor === color\"\r\n        (click)=\"selectColorByIndex(i)\"\r\n    >\r\n        <fa-icon\r\n            *ngIf=\"selectedColor === color\"\r\n            [icon]=\"['fas', 'check']\"\r\n        >\r\n        </fa-icon>\r\n    </div>\r\n</div>\r\n\r\n<ng-container *ngIf=\"style === 'dropdown'\">\r\n\r\n    <button\r\n        #popoverTarget\r\n        type=\"button\"\r\n        class=\"btn d-flex align-items-center\"\r\n        [class.dropdown-toggle]=\"showCaret\"\r\n        [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\r\n        aria-controls=\"dropdown-basic\"\r\n        (click)=\"toggleDropdown()\"\r\n        (keydown)=\"onKeyDown($event)\"\r\n    >\r\n\r\n        <div\r\n            class=\"color-tile color-tile-dropdown\"\r\n            [style.background-color]=\"selectedColor || defaultColor\"\r\n            [class.undefined-color]=\"!(selectedColor || defaultColor)\"\r\n        >\r\n        </div>\r\n    </button>\r\n\r\n    <dx-popover\r\n        [target]=\"popoverTarget\"\r\n        position=\"bottom\"\r\n        [(visible)]=\"showDropdown\"\r\n    >\r\n        <div\r\n            class=\"color-tiles-container-square\"\r\n            [ngStyle]=\"{ 'grid-template-columns': dropdownGridTemplateColumns}\"\r\n            [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\r\n        >\r\n            <div\r\n                *ngFor=\"let color of colors; index as i\"\r\n                [style.background-color]=\"color\"\r\n                class=\"color-tile color-tile-popover sds-btn-reactive\"\r\n                (click)=\"selectColorByIndex(i)\"\r\n            >\r\n            <fa-icon\r\n                *ngIf=\"selectedColor === color || !selectedColor && defaultColor === color\"\r\n                [icon]=\"checkIcon\"\r\n            >\r\n            </fa-icon>\r\n\r\n            </div>\r\n        </div>\r\n    </dx-popover>\r\n</ng-container>", styles: [".color-tiles-container-inline{display:flex;gap:.5rem;color:#fff}.color-tiles-container-square{display:grid;gap:1rem;color:#fff}.color-tile{height:2rem;width:2rem;display:flex;align-items:center;justify-content:center;border-radius:var(--sds-cp-radius);cursor:pointer}.color-tile.color-tile-popover:hover{filter:brightness(90%)}.color-tile fa-icon{line-height:1rem}.color-tile.undefined-color{border-color:gray;border-style:solid;border-width:1px}.btn:focus-visible{outline:0;box-shadow:0 0 0 .2rem #3b8fc240}.btn:active{border-color:transparent}\n"] }]
+                    ], template: "<div\n    *ngIf=\"style === 'inline'\"\n    class=\"color-tiles-container-inline\"\n    [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\n>\n    <div\n        *ngFor=\"let color of colors; index as i\"\n        [style.background-color]=\"color\"\n        [style.border-color]=\"color\"\n        class=\"color-tile\"\n        [class.selected]=\"selectedColor === color\"\n        (click)=\"selectColorByIndex(i)\"\n    >\n        <fa-icon\n            *ngIf=\"selectedColor === color\"\n            [icon]=\"['fas', 'check']\"\n        >\n        </fa-icon>\n    </div>\n</div>\n\n<ng-container *ngIf=\"style === 'dropdown'\">\n\n    <button\n        #popoverTarget\n        type=\"button\"\n        class=\"btn d-flex align-items-center\"\n        [class.dropdown-toggle]=\"showCaret\"\n        [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\n        aria-controls=\"dropdown-basic\"\n        (click)=\"toggleDropdown()\"\n        (keydown)=\"onKeyDown($event)\"\n    >\n\n        <div\n            class=\"color-tile color-tile-dropdown\"\n            [style.background-color]=\"selectedColor || defaultColor\"\n            [class.undefined-color]=\"!(selectedColor || defaultColor)\"\n        >\n        </div>\n    </button>\n\n    <dx-popover\n        [target]=\"popoverTarget\"\n        position=\"bottom\"\n        [(visible)]=\"showDropdown\"\n    >\n        <div\n            class=\"color-tiles-container-square\"\n            [ngStyle]=\"{ 'grid-template-columns': dropdownGridTemplateColumns}\"\n            [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\n        >\n            <div\n                *ngFor=\"let color of colors; index as i\"\n                [style.background-color]=\"color\"\n                class=\"color-tile color-tile-popover sds-btn-reactive\"\n                (click)=\"selectColorByIndex(i)\"\n            >\n            <fa-icon\n                *ngIf=\"selectedColor === color || !selectedColor && defaultColor === color\"\n                [icon]=\"checkIcon\"\n            >\n            </fa-icon>\n\n            </div>\n        </div>\n    </dx-popover>\n</ng-container>", styles: [".color-tiles-container-inline{display:flex;gap:.5rem;color:#fff}.color-tiles-container-square{display:grid;gap:1rem;color:#fff}.color-tile{height:2rem;width:2rem;display:flex;align-items:center;justify-content:center;border-radius:var(--sds-cp-radius);cursor:pointer}.color-tile.color-tile-popover:hover{filter:brightness(90%)}.color-tile fa-icon{line-height:1rem}.color-tile.undefined-color{border-color:gray;border-style:solid;border-width:1px}.btn:focus-visible{outline:0;box-shadow:0 0 0 .2rem #3b8fc240}.btn:active{border-color:transparent}\n"] }]
         }], ctorParameters: () => [], propDecorators: { colors: [{
                 type: Input
             }], disabled: [{

package/fesm2022/spicainternational-ngx-sds-components-src-lib-color-picker.mjs.map CHANGED Viewed

	@@ -1 +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/spicainternational-ngx-sds-components-src-lib-color-picker.ts"],"sourcesContent":["import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';\r\nimport { faCheck } from '@fortawesome/pro-solid-svg-icons';\r\nimport { DxPopoverModule } from 'devextreme-angular/ui/popover';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\nimport { NgIf, NgFor, NgStyle } from '@angular/common';\r\n\r\n@Component({\r\n selector: 'sds-color-picker',\r\n templateUrl: './color-picker.component.html',\r\n styleUrls: ['./color-picker.component.scss'],\r\n standalone: true,\r\n imports: [\r\n NgIf,\r\n NgFor,\r\n FontAwesomeModule,\r\n DxPopoverModule,\r\n NgStyle,\r\n ],\r\n})\r\nexport class SdsColorPickerComponent implements OnInit, OnChanges {\r\n @Input() colors: Array<string> = [];\r\n @Input() disabled: boolean = false;\r\n @Input() selectedColor?: string;\r\n @Input() defaultColor?: string;\r\n @Output() selectedColorChange: EventEmitter<string>;\r\n @Output() selectedColorIndexChange: EventEmitter<number>;\r\n @Input() style: 'inline' \| 'dropdown' = 'inline'\r\n @Input() showCaret: boolean = true;\r\n @Input() shape: 'circle' \| 'square' = 'circle';\r\n\r\n // public ~~checkIcon = faCheck;\r\n public~~ dropdownGridTemplateColumns?: string;\r\n public showDropdown = false;\r\n\r\n public checkIcon = faCheck;\r\n\r\n private gridSize = 1;\r\n\r\n public circleRadius = '100%';\r\n public squareRadius = '10%';\r\n\r\n constructor() {\r\n this.selectedColorChange = new EventEmitter<string>();\r\n this.selectedColorIndexChange = new EventEmitter<number>();\r\n }\r\n\r\n ngOnChanges(changes: SimpleChanges): void {\r\n if (changes['colors']) {\r\n this.gridSize = Math.ceil(Math.sqrt(this.colors.length));\r\n this.dropdownGridTemplateColumns = `repeat(${this.gridSize}, 1fr)`;\r\n }\r\n }\r\n\r\n ngOnInit(): void {}\r\n\r\n public selectColorByIndex(index: number): void {\r\n if (!this.disabled) {\r\n let color = this.colors[index];\r\n this.selectedColor = color;\r\n this.selectedColorChange.emit(color);\r\n this.selectedColorIndexChange.emit(index);\r\n this.showDropdown = false;\r\n }\r\n }\r\n\r\n public onKeyDown($event: KeyboardEvent) {\r\n\r\n if ($event.key === 'ArrowUp' \|\| $event.key === 'ArrowDown') {\r\n $event.preventDefault(); \r\n }\r\n\r\n if ($event.key === 'ArrowLeft' \|\| $event.key === 'ArrowRight') {\r\n $event.preventDefault(); \r\n } \r\n }\r\n\r\n \r\n public toggleDropdown(){\r\n this.showDropdown = !this.showDropdown;\r\n\r\n }\r\n}\r\n","<div\r\n ngIf=\"style === 'inline'\"\r\n class=\"color-tiles-container-inline\"\r\n [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\r\n>\r\n <div\r\n ngFor=\"let color of colors; index as i\"\r\n [style.background-color]=\"color\"\r\n [style.border-color]=\"color\"\r\n class=\"color-tile\"\r\n [class.selected]=\"selectedColor === color\"\r\n (click)=\"selectColorByIndex(i)\"\r\n >\r\n <fa-icon\r\n ngIf=\"selectedColor === color\"\r\n [icon]=\"['fas', 'check']\"\r\n >\r\n </fa-icon>\r\n </div>\r\n</div>\r\n\r\n<ng-container ngIf=\"style === 'dropdown'\">\r\n\r\n <button\r\n #popoverTarget\r\n type=\"button\"\r\n class=\"btn d-flex align-items-center\"\r\n [class.dropdown-toggle]=\"showCaret\"\r\n [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\r\n aria-controls=\"dropdown-basic\"\r\n (click)=\"toggleDropdown()\"\r\n (keydown)=\"onKeyDown($event)\"\r\n >\r\n\r\n <div\r\n class=\"color-tile color-tile-dropdown\"\r\n [style.background-color]=\"selectedColor \|\| defaultColor\"\r\n [class.undefined-color]=\"!(selectedColor \|\| defaultColor)\"\r\n >\r\n </div>\r\n </button>\r\n\r\n <dx-popover\r\n [target]=\"popoverTarget\"\r\n position=\"bottom\"\r\n [(visible)]=\"showDropdown\"\r\n >\r\n <div\r\n class=\"color-tiles-container-square\"\r\n [ngStyle]=\"{ 'grid-template-columns': dropdownGridTemplateColumns}\"\r\n [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\r\n >\r\n <div\r\n ngFor=\"let color of colors; index as i\"\r\n [style.background-color]=\"color\"\r\n class=\"color-tile color-tile-popover sds-btn-reactive\"\r\n (click)=\"selectColorByIndex(i)\"\r\n >\r\n <fa-icon\r\n ngIf=\"selectedColor === color \|\| !selectedColor && defaultColor === color\"\r\n [icon]=\"checkIcon\"\r\n >\r\n </fa-icon>\r\n\r\n </div>\r\n </div>\r\n </dx-popover>\r\n</ng-container>","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;;;MAmBa,uBAAuB,CAAA;~~AAsBhC~~,IAAA,WAAA,GAAA;~~QArBS~~,IAAM,CAAA,MAAA,GAAkB,EAAE;QAC1B,IAAQ,CAAA,QAAA,GAAY,KAAK;QAKzB,IAAK,CAAA,KAAA,GAA0B,QAAQ;QACvC,IAAS,CAAA,SAAA,GAAY,IAAI;QACzB,IAAK,CAAA,KAAA,GAAwB,QAAQ;~~QAIvC~~,IAAY,CAAA,YAAA,GAAG,KAAK;QAEpB,IAAS,CAAA,SAAA,GAAG,OAAO;QAElB,IAAQ,CAAA,QAAA,GAAG,CAAC;QAEb,IAAY,CAAA,YAAA,GAAG,MAAM;QACrB,IAAY,CAAA,YAAA,GAAG,KAAK;AAGvB,QAAA,IAAI,CAAC,mBAAmB,GAAG,IAAI,YAAY,EAAU;AACrD,QAAA,IAAI,CAAC,wBAAwB,GAAG,IAAI,YAAY,EAAU;;AAG9D,IAAA,WAAW,CAAC,OAAsB,EAAA;AAC9B,QAAA,IAAI,OAAO,CAAC,QAAQ,CAAC,EAAE;AACnB,YAAA,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;YACxD,IAAI,CAAC,2BAA2B,GAAG,CAAA,OAAA,EAAU,IAAI,CAAC,QAAQ,QAAQ;;;AAI1E,IAAA,QAAQ;AAED,IAAA,kBAAkB,CAAC,KAAa,EAAA;AACnC,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAChB,IAAI,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC;AAC9B,YAAA,IAAI,CAAC,aAAa,GAAG,KAAK;AAC1B,YAAA,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,KAAK,CAAC;AACpC,YAAA,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,KAAK,CAAC;AACzC,YAAA,IAAI,CAAC,YAAY,GAAG,KAAK;;;AAI1B,IAAA,SAAS,CAAC,MAAqB,EAAA;AAElC,QAAA,IAAI,MAAM,CAAC,GAAG,KAAK,SAAS,IAAI,MAAM,CAAC,GAAG,KAAK,WAAW,EAAE;YACxD,MAAM,CAAC,cAAc,EAAE;;AAG3B,QAAA,IAAI,MAAM,CAAC,GAAG,KAAK,WAAW,IAAI,MAAM,CAAC,GAAG,KAAK,YAAY,EAAE;YAC3D,MAAM,CAAC,cAAc,EAAE;;;IAKxB,cAAc,GAAA;AACjB,QAAA,IAAI,CAAC,YAAY,GAAG,CAAC,IAAI,CAAC,YAAY;;+~~GA3DjC~~,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAvB,uBAAuB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,EAAA,MAAA,EAAA,QAAA,EAAA,QAAA,EAAA,UAAA,EAAA,aAAA,EAAA,eAAA,EAAA,YAAA,EAAA,cAAA,EAAA,KAAA,EAAA,OAAA,EAAA,SAAA,EAAA,WAAA,EAAA,KAAA,EAAA,OAAA,EAAA,EAAA,OAAA,EAAA,EAAA,mBAAA,EAAA,qBAAA,EAAA,wBAAA,EAAA,0BAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECnBpC,~~kyEAmEe~~,EAAA,MAAA,EAAA,CAAA,qiBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDvDP,IAAI,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACJ,KAAK,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,cAAA,EAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACL,iBAAiB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,OAAA,EAAA,WAAA,EAAA,MAAA,EAAA,OAAA,EAAA,MAAA,EAAA,QAAA,EAAA,MAAA,EAAA,MAAA,EAAA,MAAA,EAAA,QAAA,EAAA,SAAA,EAAA,QAAA,EAAA,QAAA,EAAA,YAAA,EAAA,SAAA,EAAA,WAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACjB,eAAe,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,kBAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,qBAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,kBAAA,EAAA,QAAA,EAAA,WAAA,EAAA,oBAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,mBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,UAAA,EAAA,UAAA,EAAA,YAAA,EAAA,SAAA,EAAA,cAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,WAAA,EAAA,QAAA,EAAA,OAAA,EAAA,eAAA,EAAA,cAAA,EAAA,SAAA,EAAA,OAAA,EAAA,aAAA,CAAA,EAAA,OAAA,EAAA,CAAA,gBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,UAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,SAAA,EAAA,iBAAA,EAAA,iBAAA,EAAA,2BAAA,EAAA,iBAAA,EAAA,uBAAA,EAAA,sBAAA,EAAA,gBAAA,EAAA,wBAAA,EAAA,cAAA,EAAA,iBAAA,EAAA,0BAAA,EAAA,0BAAA,EAAA,YAAA,EAAA,yBAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,eAAA,EAAA,oBAAA,EAAA,uBAAA,EAAA,iBAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,aAAA,EAAA,qBAAA,EAAA,oBAAA,EAAA,eAAA,EAAA,aAAA,EAAA,mBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACf,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;4FAGF,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAbnC,SAAS;+BACI,kBAAkB,EAAA,UAAA,EAGhB,IAAI,EACP,OAAA,EAAA;wBACL,IAAI;wBACJ,KAAK;wBACL,iBAAiB;wBACjB,eAAe;wBACf,OAAO;AACV,qBAAA,EAAA,QAAA,EAAA,~~kyEAAA~~,EAAA,MAAA,EAAA,CAAA,qiBAAA,CAAA,EAAA;wDAGQ,MAAM,EAAA,CAAA;sBAAd;gBACQ,QAAQ,EAAA,CAAA;sBAAhB;gBACQ,aAAa,EAAA,CAAA;sBAArB;gBACQ,YAAY,EAAA,CAAA;sBAApB;gBACS,mBAAmB,EAAA,CAAA;sBAA5B;gBACS,wBAAwB,EAAA,CAAA;sBAAjC;gBACQ,KAAK,EAAA,CAAA;sBAAb;gBACQ,SAAS,EAAA,CAAA;sBAAjB;gBACQ,KAAK,EAAA,CAAA;sBAAb;;;AE5BL;;AAEG;;;;"}
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/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';\nimport { DxPopoverModule } from 'devextreme-angular/ui/popover';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\nimport { NgIf, NgFor, NgStyle } from '@angular/common';\n\n@Component({\n selector: 'sds-color-picker',\n templateUrl: './color-picker.component.html',\n styleUrls: ['./color-picker.component.scss'],\n standalone: true,\n imports: [\n NgIf,\n NgFor,\n FontAwesomeModule,\n DxPopoverModule,\n NgStyle,\n ],\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 @Output() selectedColorIndexChange: EventEmitter<number>;\n @Input() style: 'inline' \| 'dropdown' = 'inline'\n @Input() showCaret: boolean = true;\n @Input() shape: 'circle' \| 'square' = 'circle';\n\n public dropdownGridTemplateColumns?: string;\n public showDropdown = false;\n\n public checkIcon = faCheck;\n\n private gridSize = 1;\n\n public circleRadius = '100%';\n public squareRadius = '10%';\n\n constructor() {\n this.selectedColorChange = new EventEmitter<string>();\n this.selectedColorIndexChange = new EventEmitter<number>();\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n if (changes['colors']) {\n this.gridSize = Math.ceil(Math.sqrt(this.colors.length));\n this.dropdownGridTemplateColumns = `repeat(${this.gridSize}, 1fr)`;\n }\n }\n\n ngOnInit(): void {}\n\n public selectColorByIndex(index: number): void {\n if (!this.disabled) {\n let color = this.colors[index];\n this.selectedColor = color;\n this.selectedColorChange.emit(color);\n this.selectedColorIndexChange.emit(index);\n this.showDropdown = false;\n }\n }\n\n public onKeyDown($event: KeyboardEvent) {\n\n if ($event.key === 'ArrowUp' \|\| $event.key === 'ArrowDown') {\n $event.preventDefault(); \n }\n\n if ($event.key === 'ArrowLeft' \|\| $event.key === 'ArrowRight') {\n $event.preventDefault(); \n } \n }\n\n \n public toggleDropdown(){\n this.showDropdown = !this.showDropdown;\n\n }\n}\n","<div\n ngIf=\"style === 'inline'\"\n class=\"color-tiles-container-inline\"\n [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\n>\n <div\n ngFor=\"let color of colors; index as i\"\n [style.background-color]=\"color\"\n [style.border-color]=\"color\"\n class=\"color-tile\"\n [class.selected]=\"selectedColor === color\"\n (click)=\"selectColorByIndex(i)\"\n >\n <fa-icon\n ngIf=\"selectedColor === color\"\n [icon]=\"['fas', 'check']\"\n >\n </fa-icon>\n </div>\n</div>\n\n<ng-container ngIf=\"style === 'dropdown'\">\n\n <button\n #popoverTarget\n type=\"button\"\n class=\"btn d-flex align-items-center\"\n [class.dropdown-toggle]=\"showCaret\"\n [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\n aria-controls=\"dropdown-basic\"\n (click)=\"toggleDropdown()\"\n (keydown)=\"onKeyDown($event)\"\n >\n\n <div\n class=\"color-tile color-tile-dropdown\"\n [style.background-color]=\"selectedColor \|\| defaultColor\"\n [class.undefined-color]=\"!(selectedColor \|\| defaultColor)\"\n >\n </div>\n </button>\n\n <dx-popover\n [target]=\"popoverTarget\"\n position=\"bottom\"\n [(visible)]=\"showDropdown\"\n >\n <div\n class=\"color-tiles-container-square\"\n [ngStyle]=\"{ 'grid-template-columns': dropdownGridTemplateColumns}\"\n [style.--sds-cp-radius]=\"shape === 'square' ? squareRadius : circleRadius\"\n >\n <div\n ngFor=\"let color of colors; index as i\"\n [style.background-color]=\"color\"\n class=\"color-tile color-tile-popover sds-btn-reactive\"\n (click)=\"selectColorByIndex(i)\"\n >\n <fa-icon\n ngIf=\"selectedColor === color \|\| !selectedColor && defaultColor === color\"\n [icon]=\"checkIcon\"\n >\n </fa-icon>\n\n </div>\n </div>\n </dx-popover>\n</ng-container>","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;;;MAmBa,uBAAuB,CAAA;AAqBhC,IAAA,WAAA,GAAA;QApBS,IAAM,CAAA,MAAA,GAAkB,EAAE;QAC1B,IAAQ,CAAA,QAAA,GAAY,KAAK;QAKzB,IAAK,CAAA,KAAA,GAA0B,QAAQ;QACvC,IAAS,CAAA,SAAA,GAAY,IAAI;QACzB,IAAK,CAAA,KAAA,GAAwB,QAAQ;QAGvC,IAAY,CAAA,YAAA,GAAG,KAAK;QAEpB,IAAS,CAAA,SAAA,GAAG,OAAO;QAElB,IAAQ,CAAA,QAAA,GAAG,CAAC;QAEb,IAAY,CAAA,YAAA,GAAG,MAAM;QACrB,IAAY,CAAA,YAAA,GAAG,KAAK;AAGvB,QAAA,IAAI,CAAC,mBAAmB,GAAG,IAAI,YAAY,EAAU;AACrD,QAAA,IAAI,CAAC,wBAAwB,GAAG,IAAI,YAAY,EAAU;;AAG9D,IAAA,WAAW,CAAC,OAAsB,EAAA;AAC9B,QAAA,IAAI,OAAO,CAAC,QAAQ,CAAC,EAAE;AACnB,YAAA,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;YACxD,IAAI,CAAC,2BAA2B,GAAG,CAAA,OAAA,EAAU,IAAI,CAAC,QAAQ,QAAQ;;;AAI1E,IAAA,QAAQ;AAED,IAAA,kBAAkB,CAAC,KAAa,EAAA;AACnC,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAChB,IAAI,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC;AAC9B,YAAA,IAAI,CAAC,aAAa,GAAG,KAAK;AAC1B,YAAA,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,KAAK,CAAC;AACpC,YAAA,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,KAAK,CAAC;AACzC,YAAA,IAAI,CAAC,YAAY,GAAG,KAAK;;;AAI1B,IAAA,SAAS,CAAC,MAAqB,EAAA;AAElC,QAAA,IAAI,MAAM,CAAC,GAAG,KAAK,SAAS,IAAI,MAAM,CAAC,GAAG,KAAK,WAAW,EAAE;YACxD,MAAM,CAAC,cAAc,EAAE;;AAG3B,QAAA,IAAI,MAAM,CAAC,GAAG,KAAK,WAAW,IAAI,MAAM,CAAC,GAAG,KAAK,YAAY,EAAE;YAC3D,MAAM,CAAC,cAAc,EAAE;;;IAKxB,cAAc,GAAA;AACjB,QAAA,IAAI,CAAC,YAAY,GAAG,CAAC,IAAI,CAAC,YAAY;;+GA1DjC,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAvB,uBAAuB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,EAAA,MAAA,EAAA,QAAA,EAAA,QAAA,EAAA,UAAA,EAAA,aAAA,EAAA,eAAA,EAAA,YAAA,EAAA,cAAA,EAAA,KAAA,EAAA,OAAA,EAAA,SAAA,EAAA,WAAA,EAAA,KAAA,EAAA,OAAA,EAAA,EAAA,OAAA,EAAA,EAAA,mBAAA,EAAA,qBAAA,EAAA,wBAAA,EAAA,0BAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECnBpC,4pEAmEe,EAAA,MAAA,EAAA,CAAA,qiBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDvDP,IAAI,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACJ,KAAK,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,cAAA,EAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACL,iBAAiB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,OAAA,EAAA,WAAA,EAAA,MAAA,EAAA,OAAA,EAAA,MAAA,EAAA,QAAA,EAAA,MAAA,EAAA,MAAA,EAAA,MAAA,EAAA,QAAA,EAAA,SAAA,EAAA,QAAA,EAAA,QAAA,EAAA,YAAA,EAAA,SAAA,EAAA,WAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACjB,eAAe,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,kBAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,qBAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,kBAAA,EAAA,QAAA,EAAA,WAAA,EAAA,oBAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,mBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,UAAA,EAAA,UAAA,EAAA,YAAA,EAAA,SAAA,EAAA,cAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,WAAA,EAAA,QAAA,EAAA,OAAA,EAAA,eAAA,EAAA,cAAA,EAAA,SAAA,EAAA,OAAA,EAAA,aAAA,CAAA,EAAA,OAAA,EAAA,CAAA,gBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,UAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,SAAA,EAAA,iBAAA,EAAA,iBAAA,EAAA,2BAAA,EAAA,iBAAA,EAAA,uBAAA,EAAA,sBAAA,EAAA,gBAAA,EAAA,wBAAA,EAAA,cAAA,EAAA,iBAAA,EAAA,0BAAA,EAAA,0BAAA,EAAA,YAAA,EAAA,yBAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,eAAA,EAAA,oBAAA,EAAA,uBAAA,EAAA,iBAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,aAAA,EAAA,qBAAA,EAAA,oBAAA,EAAA,eAAA,EAAA,aAAA,EAAA,mBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACf,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;4FAGF,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAbnC,SAAS;+BACI,kBAAkB,EAAA,UAAA,EAGhB,IAAI,EACP,OAAA,EAAA;wBACL,IAAI;wBACJ,KAAK;wBACL,iBAAiB;wBACjB,eAAe;wBACf,OAAO;AACV,qBAAA,EAAA,QAAA,EAAA,4pEAAA,EAAA,MAAA,EAAA,CAAA,qiBAAA,CAAA,EAAA;wDAGQ,MAAM,EAAA,CAAA;sBAAd;gBACQ,QAAQ,EAAA,CAAA;sBAAhB;gBACQ,aAAa,EAAA,CAAA;sBAArB;gBACQ,YAAY,EAAA,CAAA;sBAApB;gBACS,mBAAmB,EAAA,CAAA;sBAA5B;gBACS,wBAAwB,EAAA,CAAA;sBAAjC;gBACQ,KAAK,EAAA,CAAA;sBAAb;gBACQ,SAAS,EAAA,CAAA;sBAAjB;gBACQ,KAAK,EAAA,CAAA;sBAAb;;;AE5BL;;AAEG;;;;"}