@sarasanalytics-com/design-system 0.0.9 → 0.0.11

package/esm2022/lib/grid-cell/grid-cell.component.mjs

@@ -0,0 +1,84 @@
+import { Component, EventEmitter } from '@angular/core';
+import { Output } from '@angular/core';
+import { AvatarComponent } from '../avatar/avatar.component';
+import { ChipsComponent } from '../chips/chips.component';
+import { ButtonComponent } from '../button/button.component';
+import { NgFor } from '@angular/common';
+import * as i0 from "@angular/core";
+export class GridCellComponent {
+    constructor() {
+        this.onClickButtonEvent = new EventEmitter();
+        this.onClickChipEvent = new EventEmitter();
+        this.onClickLinkEvent = new EventEmitter();
+        this.onClickAvatarEvent = new EventEmitter();
+    }
+    buttonClicked(evt) {
+        this.params.buttonClicked && this.params.buttonClicked({
+            ...evt,
+            rowId: this.rowNum
+        });
+        this.onClickButtonEvent.emit({ ...evt, rowId: this.rowNum }); // this event isn't caught by anything. 
+    }
+    // above function behavior is same for all functions in this class
+    chipClicked(evt) {
+        this.params.chipClicked && this.params.chipClicked({
+            ...evt,
+            rowId: this.rowNum
+        });
+        this.onClickChipEvent.emit({ ...evt, rowId: this.rowNum });
+    }
+    linkClicked() {
+        if (this.params.cellType != "interactive")
+            return;
+        this.params.linkClicked && this.params.linkClicked({
+            rowId: this.rowNum
+        });
+        if (this.params.interactiveLink != "") {
+            if (this.params.interactiveLinkTarget == "blank") {
+                window.open(this.params.interactiveLink);
+            }
+            else if (this.params.interactiveLinkTarget == "self") {
+                location.href = this.params.interactiveLink;
+            }
+        }
+        this.onClickLinkEvent.emit({ rowId: this.rowNum });
+    }
+    avatarClicked(evt) {
+        this.params.avatarClicked && this.params.avatarClicked({
+            ...evt,
+            rowId: this.rowNum
+        });
+        this.onClickChipEvent.emit({ ...evt, rowId: this.rowNum });
+    }
+    agInit(inParams) {
+        this.rowNum = inParams.rowIndex;
+        this.params = inParams.value; // inParams.value exists when gridCell is rendered as cell, `cellRenderer: GridCellComponent`
+        if (inParams.value == undefined) { // inParams.value is undefined when gridCell is rendered as header, `headerComponent: GridCellComponent`, 
+            this.params = inParams;
+        }
+        // console.log(this.params);
+    }
+    refresh(params) {
+        return false; // not sure what this return value does.
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: GridCellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: GridCellComponent, isStandalone: true, selector: "lib-grid-cell", outputs: { onClickButtonEvent: "onClickButtonEvent", onClickChipEvent: "onClickChipEvent", onClickLinkEvent: "onClickLinkEvent", onClickAvatarEvent: "onClickAvatarEvent" }, ngImport: i0, template: "<div class=\"grid-cell {{params.cellType}}\">\n\n  <img class=\"icons\" src={{params.iconPath}} [style.display]=\"(params.viewLeadingIcon) ? 'block' : 'none'\" alt=\"\">\n\n  <sa-avatar [id]=\"params.avatarConfig?.id\" [altText]=\"params.avatarConfig?.altText\"\n    [imagePath]=\"params.avatarConfig?.imagePath\" [size]=\"params.avatarConfig?.size\"\n    [style.display]=\"(params.viewAvatar) ? 'block' : 'none'\" (onClickEvent)=\"avatarClicked($event)\">\n  </sa-avatar>\n\n  <div class=\"grid-text\" [style.display]=\"(params.viewText) ? 'block' : 'none'\">\n    <div [style.display]=\"(params.text) ? 'block' : 'none'\" (click)=\"linkClicked()\" class=\"main-text\">{{params.text}}\n    </div>\n\n    <div [style.display]=\"(params.subText) ? 'block' : 'none'\" class=\"sub-text\">{{params.subText}}</div>\n  </div>\n\n  <img class=\"icons\" src={{params.iconPath}} [style.display]=\"(params.viewTrailingIcon) ? 'block' : 'none'\" alt=\"\">\n\n\n  <sa-chip *ngFor=\"let config of params.chipConfig, let i = index\" [id]=\"config.id\" [filling]=\"config.filling\"\n    id=\"chip_{{rowNum}}_{{config.id}}\" [iconPath]=\"config.iconPath\" [iconPosition]=\"config.iconPosition\"\n    [largeStateIcon]=\"config.largeStateIcon\" [state]=\"config.state\" [type]=\"config.type\" [text]=\"config.text\"\n    [style.display]=\"(params.viewChip) ? 'block' : 'none'\" (onClickEvent)=\"chipClicked($event)\"></sa-chip>\n\n  <sa-button [iconPosition]=\"params.buttonConfig?.iconPosition\" [ImagePath]=\"params.buttonConfig?.imagePath\"\n    [id]=\"params.buttonConfig?.id\" [size]=\"params.buttonConfig?.size\" [state]=\"params.buttonConfig?.state\"\n    [type]=\"params.buttonConfig?.type\" [text]=\"params.buttonConfig?.text\" [href]=\"params.buttonConfig?.href\"\n    [hrefTarget]=\"params.buttonConfig?.hrefTarget\" [style.display]=\"(params.viewButton) ? 'block' : 'none'\"\n    (onClickEvent)=\"buttonClicked($event)\"></sa-button>\n\n</div>\n", styles: [".header{--bg: var(--primary-50);--color: var(--text-highemphasis);--border: none;--flex-direction: left}.header:hover{cursor:pointer}.row{--color: var(--text-highemphasis);--cursor: default;--border: var(--grey-50);--flex-direction: left}.numeric{--color: var(--text-highemphasis);--cursor: default;--border: var(--grey-50);--flex-direction: right}.interactive{--color: var(--primary-500);--cursor: pointer;--border: var(--grey-50);--flex-direction: left}.grid-cell{display:flex;height:48px;padding:var(--small-12px);justify-content:var(--flex-direction);align-items:center;gap:var(--small-8px);flex-shrink:0;font-family:var(--font);box-sizing:border-box;border-bottom:1px solid var(--border);width:calc(100% - 20px);background-color:var(--bg)}.grid-text{display:flex;flex-direction:column}.main-text{color:var(--color);font-size:14px;font-weight:400;height:20px;line-height:20px}.main-text:hover{cursor:var(--cursor)}.sub-text{font-size:11px;font-weight:400;height:16px;line-height:16px;color:var(--text-mediumemphasis)}.icons{width:var(--medium-20px);height:var(--medium-20px)}\n"], dependencies: [{ kind: "component", type: AvatarComponent, selector: "sa-avatar", inputs: ["id", "imagePath", "altText", "size"], outputs: ["onClickEvent", "onMouseInEvent", "onMouseOutEvent"] }, { kind: "component", type: ChipsComponent, selector: "sa-chip", inputs: ["id", "iconPath", "text", "type", "state", "filling", "iconPosition", "largeStateIcon", "largeStateText"], outputs: ["onClickEvent"] }, { kind: "component", type: ButtonComponent, selector: "sa-button", inputs: ["id", "type", "state", "size", "text", "ImagePath", "iconPosition", "href", "hrefTarget", "isSubmit"], outputs: ["onClickEvent", "onMouseInEvent", "onMouseOutEvent"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: GridCellComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-grid-cell', standalone: true, imports: [
+                        AvatarComponent,
+                        ChipsComponent,
+                        ButtonComponent,
+                        NgFor
+                    ], template: "<div class=\"grid-cell {{params.cellType}}\">\n\n  <img class=\"icons\" src={{params.iconPath}} [style.display]=\"(params.viewLeadingIcon) ? 'block' : 'none'\" alt=\"\">\n\n  <sa-avatar [id]=\"params.avatarConfig?.id\" [altText]=\"params.avatarConfig?.altText\"\n    [imagePath]=\"params.avatarConfig?.imagePath\" [size]=\"params.avatarConfig?.size\"\n    [style.display]=\"(params.viewAvatar) ? 'block' : 'none'\" (onClickEvent)=\"avatarClicked($event)\">\n  </sa-avatar>\n\n  <div class=\"grid-text\" [style.display]=\"(params.viewText) ? 'block' : 'none'\">\n    <div [style.display]=\"(params.text) ? 'block' : 'none'\" (click)=\"linkClicked()\" class=\"main-text\">{{params.text}}\n    </div>\n\n    <div [style.display]=\"(params.subText) ? 'block' : 'none'\" class=\"sub-text\">{{params.subText}}</div>\n  </div>\n\n  <img class=\"icons\" src={{params.iconPath}} [style.display]=\"(params.viewTrailingIcon) ? 'block' : 'none'\" alt=\"\">\n\n\n  <sa-chip *ngFor=\"let config of params.chipConfig, let i = index\" [id]=\"config.id\" [filling]=\"config.filling\"\n    id=\"chip_{{rowNum}}_{{config.id}}\" [iconPath]=\"config.iconPath\" [iconPosition]=\"config.iconPosition\"\n    [largeStateIcon]=\"config.largeStateIcon\" [state]=\"config.state\" [type]=\"config.type\" [text]=\"config.text\"\n    [style.display]=\"(params.viewChip) ? 'block' : 'none'\" (onClickEvent)=\"chipClicked($event)\"></sa-chip>\n\n  <sa-button [iconPosition]=\"params.buttonConfig?.iconPosition\" [ImagePath]=\"params.buttonConfig?.imagePath\"\n    [id]=\"params.buttonConfig?.id\" [size]=\"params.buttonConfig?.size\" [state]=\"params.buttonConfig?.state\"\n    [type]=\"params.buttonConfig?.type\" [text]=\"params.buttonConfig?.text\" [href]=\"params.buttonConfig?.href\"\n    [hrefTarget]=\"params.buttonConfig?.hrefTarget\" [style.display]=\"(params.viewButton) ? 'block' : 'none'\"\n    (onClickEvent)=\"buttonClicked($event)\"></sa-button>\n\n</div>\n", styles: [".header{--bg: var(--primary-50);--color: var(--text-highemphasis);--border: none;--flex-direction: left}.header:hover{cursor:pointer}.row{--color: var(--text-highemphasis);--cursor: default;--border: var(--grey-50);--flex-direction: left}.numeric{--color: var(--text-highemphasis);--cursor: default;--border: var(--grey-50);--flex-direction: right}.interactive{--color: var(--primary-500);--cursor: pointer;--border: var(--grey-50);--flex-direction: left}.grid-cell{display:flex;height:48px;padding:var(--small-12px);justify-content:var(--flex-direction);align-items:center;gap:var(--small-8px);flex-shrink:0;font-family:var(--font);box-sizing:border-box;border-bottom:1px solid var(--border);width:calc(100% - 20px);background-color:var(--bg)}.grid-text{display:flex;flex-direction:column}.main-text{color:var(--color);font-size:14px;font-weight:400;height:20px;line-height:20px}.main-text:hover{cursor:var(--cursor)}.sub-text{font-size:11px;font-weight:400;height:16px;line-height:16px;color:var(--text-mediumemphasis)}.icons{width:var(--medium-20px);height:var(--medium-20px)}\n"] }]
+        }], propDecorators: { onClickButtonEvent: [{
+                type: Output
+            }], onClickChipEvent: [{
+                type: Output
+            }], onClickLinkEvent: [{
+                type: Output
+            }], onClickAvatarEvent: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3JpZC1jZWxsLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvbXBvbmVudC1saWJyYXJ5L3NyYy9saWIvZ3JpZC1jZWxsL2dyaWQtY2VsbC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2dyaWQtY2VsbC9ncmlkLWNlbGwuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDeEQsT0FBTyxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN2QyxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sNEJBQTRCLENBQUM7QUFDN0QsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLDBCQUEwQixDQUFDO0FBQzFELE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQztBQUM3RCxPQUFPLEVBQUUsS0FBSyxFQUFFLE1BQU0saUJBQWlCLENBQUM7O0FBZ0J4QyxNQUFNLE9BQU8saUJBQWlCO0lBWjlCO1FBZ0JZLHVCQUFrQixHQUFHLElBQUksWUFBWSxFQUFFLENBQUM7UUFDeEMscUJBQWdCLEdBQUcsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUN0QyxxQkFBZ0IsR0FBRyxJQUFJLFlBQVksRUFBRSxDQUFDO1FBQ3RDLHVCQUFrQixHQUFHLElBQUksWUFBWSxFQUFFLENBQUM7S0E0RG5EO0lBMURDLGFBQWEsQ0FBQyxHQUFVO1FBQ3RCLElBQUksQ0FBQyxNQUFNLENBQUMsYUFBYSxJQUFJLElBQUksQ0FBQyxNQUFNLENBQUMsYUFBYSxDQUFDO1lBQ3JELEdBQUcsR0FBRztZQUNOLEtBQUssRUFBRSxJQUFJLENBQUMsTUFBTTtTQUNuQixDQUFDLENBQUM7UUFDSCxJQUFJLENBQUMsa0JBQWtCLENBQUMsSUFB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QUFrQjtzQkFBM0IsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEF2YXRhckNvbXBvbmVudCB9IGZyb20gJy4uL2F2YXRhci9hdmF0YXIuY29tcG9uZW50JztcbmltcG9ydCB7IENoaXBzQ29tcG9uZW50IH0gZnJvbSAnLi4vY2hpcHMvY2hpcHMuY29tcG9uZW50JztcbmltcG9ydCB7IEJ1dHRvbkNvbXBvbmVudCB9IGZyb20gJy4uL2J1dHRvbi9idXR0b24uY29tcG9uZW50JztcbmltcG9ydCB7IE5nRm9yIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IElDZWxsUmVuZGVyZXJBbmd1bGFyQ29tcCwgSUhlYWRlckFuZ3VsYXJDb21wIH0gZnJvbSAnYWctZ3JpZC1hbmd1bGFyJztcbmltcG9ydCB7IEdyaWRJbnRlcmZhY2UgfSBmcm9tICcuLi8uLi9pbnRlcmZhY2VzL2dyaWQtaW50ZXJmYWNlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnbGliLWdyaWQtY2VsbCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtcbiAgICBBdmF0YXJDb21wb25lbnQsXG4gICAgQ2hpcHNDb21wb25lbnQsXG4gICAgQnV0dG9uQ29tcG9uZW50LFxuICAgIE5nRm9yXG4gIF0sXG4gIHRlbXBsYXRlVXJsOiAnLi9ncmlkLWNlbGwuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybDogJy4vZ3JpZC1jZWxsLmNvbXBvbmVudC5jc3MnXG59KVxuZXhwb3J0IGNsYXNzIEdyaWRDZWxsQ29tcG9uZW50IGltcGxlbWVudHMgSUNlbGxSZW5kZXJlckFuZ3VsYXJDb21wLCBJSGVhZGVyQW5ndWxhckNvbXAge1xuICBwYXJhbXM6IEdyaWRJbnRlcmZhY2U7XG4gIHJvd051bTogbnVtYmVyO1xuXG4gIEBPdXRwdXQoKSBvbkNsaWNrQnV0dG9uRXZlbnQgPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG4gIEBPdXRwdXQoKSBvbkNsaWNrQ2hpcEV2ZW50ID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuICBAT3V0cHV0KCkgb25DbGlja0xpbmtFdmVudCA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcbiAgQE91dHB1dCgpIG9uQ2xpY2tBdmF0YXJFdmVudCA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcblxuICBidXR0b25DbGlja2VkKGV2dDogRXZlbnQpIHtcbiAgICB0aGlzLnBhcmFtcy5idXR0b25DbGlja2VkICYmIHRoaXMucGFyYW1zLmJ1dHRvbkNsaWNrZWQoeyAgICAgICAgICAgIC8vIGNhbGxzIHRoZSBmdW5jdGlvbiBwYXNzZWQgdmlhIHBhcmFtcyBpbiBncmlkSW50ZXJmYWNlLlxuICAgICAgLi4uZXZ0LFxuICAgICAgcm93SWQ6IHRoaXMucm93TnVtXG4gICAgfSk7XG4gICAgdGhpcy5vbkNsaWNrQnV0dG9uRXZlbnQuZW1pdCh7IC4uLmV2dCwgcm93SWQ6IHRoaXMucm93TnVtIH0pOyAgICAgIC8vIHRoaXMgZXZlbnQgaXNuJ3QgY2F1Z2h0IGJ5IGFueXRoaW5nLiBcbiAgfVxuXG4gIC8vIGFib3ZlIGZ1bmN0aW9uIGJlaGF2aW9yIGlzIHNhbWUgZm9yIGFsbCBmdW5jdGlvbnMgaW4gdGhpcyBjbGFzc1xuXG4gIGNoaXBDbGlja2VkKGV2dDogRXZlbnQpIHtcbiAgICB0aGlzLnBhcmFtcy5jaGlwQ2xpY2tlZCAmJiB0aGlzLnBhcmFtcy5jaGlwQ2xpY2tlZCh7XG4gICAgICAuLi5ldnQsXG4gICAgICByb3dJZDogdGhpcy5yb3dOdW1cbiAgICB9KTtcbiAgICB0aGlzLm9uQ2xpY2tDaGlwRXZlbnQuZW1pdCh7IC4uLmV2dCwgcm93SWQ6IHRoaXMucm93TnVtIH0pO1xuICB9XG5cbiAgbGlua0NsaWNrZWQoKSB7XG4gICAgaWYgKHRoaXMucGFyYW1zLmNlbGxUeXBlICE9IFwiaW50ZXJhY3RpdmVcIikgcmV0dXJuO1xuXG4gICAgdGhpcy5wYXJhbXMubGlua0NsaWNrZWQgJiYgdGhpcy5wYXJhbXMubGlua0NsaWNrZWQoeyAgICAgICAgIC8vY2FsbGluZyBmdW5jdGlvbiBwYXNzZWQgaW4gcGFyYW1zIHdpdGggcm93SWQgb2JqZWN0IGluIGFyZ3VtZW50c1xuICAgICAgcm93SWQ6IHRoaXMucm93TnVtXG4gICAgfSk7XG5cbiAgICBpZiAodGhpcy5wYXJhbXMuaW50ZXJhY3RpdmVMaW5rICE9IFwiXCIpIHtcbiAgICAgIGlmICh0aGlzLnBhcmFtcy5pbnRlcmFjdGl2ZUxpbmtUYXJnZXQgPT0gXCJibGFua1wiKSB7XG4gICAgICAgIHdpbmRvdy5vcGVuKHRoaXMucGFyYW1zLmludGVyYWN0aXZlTGluaykhO1xuICAgICAgfVxuICAgICAgZWxzZSBpZiAodGhpcy5wYXJhbXMuaW50ZXJhY3RpdmVMaW5rVGFyZ2V0ID09IFwic2VsZlwiKSB7XG4gICAgICAgIGxvY2F0aW9uLmhyZWYgPSB0aGlzLnBhcmFtcy5pbnRlcmFjdGl2ZUxpbmshO1xuICAgICAgfVxuICAgIH1cbiAgICB0aGlzLm9uQ2xpY2tMaW5rRXZlbnQuZW1pdCh7IHJvd0lkOiB0aGlzLnJvd051bSB9KTtcbiAgfVxuXG4gIGF2YXRhckNsaWNrZWQoZXZ0OiBFdmVudCkge1xuICAgIHRoaXMucGFyYW1zLmF2YXRhckNsaWNrZWQgJiYgdGhpcy5wYXJhbXMuYXZhdGFyQ2xpY2tlZCh7XG4gICAgICAuLi5ldnQsXG4gICAgICByb3dJZDogdGhpcy5yb3dOdW1cbiAgICB9KTtcbiAgICB0aGlzLm9uQ2xpY2tDaGlwRXZlbnQuZW1pdCh7IC4uLmV2dCwgcm93SWQ6IHRoaXMucm93TnVtIH0pO1xuICB9XG5cbiAgYWdJbml0KGluUGFyYW1zOiBhbnkpOiB2b2lkIHsgICAgICAgICAgLy8gbXVzdCBleGlzdCB3aGVuIGNsYXNzIGltcGxlbWVudHMgSUNlbGxSZW5kZXJlckFuZ3VsYXJDb21wIC8gSUhlYWRlckFuZ3VsYXJDb21wXG5cbiAgICB0aGlzLnJvd051bSA9IGluUGFyYW1zLnJvd0luZGV4O1xuICAgIHRoaXMucGFyYW1zID0gaW5QYXJhbXMudmFsdWU7ICAgICAgIC8vIGluUGFyYW1zLnZhbHVlIGV4aXN0cyB3aGVuIGdyaWRDZWxsIGlzIHJlbmRlcmVkIGFzIGNlbGwsIGBjZWxsUmVuZGVyZXI6IEdyaWRDZWxsQ29tcG9uZW50YFxuICAgIGlmIChpblBhcmFtcy52YWx1ZSA9PSB1bmRlZmluZWQpIHsgICAgLy8gaW5QYXJhbXMudmFsdWUgaXMgdW5kZWZpbmVkIHdoZW4gZ3JpZENlbGwgaXMgcmVuZGVyZWQgYXMgaGVhZGVyLCBgaGVhZGVyQ29tcG9uZW50OiBHcmlkQ2VsbENvbXBvbmVudGAsIFxuICAgICAgdGhpcy5wYXJhbXMgPSBpblBhcmFtc1xuICAgIH1cbiAgICAvLyBjb25zb2xlLmxvZyh0aGlzLnBhcmFtcyk7XG4gIH1cblxuICByZWZyZXNoKHBhcmFtczogYW55KSB7ICAgICAvLyBtdXN0IGV4aXN0IHdoZW4gY2xhc3MgaW1wbGVtZW50cyBJQ2VsbFJlbmRlcmVyQW5ndWxhckNvbXAgLyBJSGVhZGVyQW5ndWxhckNvbXBcbiAgICByZXR1cm4gZmFsc2U7ICAgICAgICAgICAvLyBub3Qgc3VyZSB3aGF0IHRoaXMgcmV0dXJuIHZhbHVlIGRvZXMuXG4gIH1cblxufVxuIiwiPGRpdiBjbGFzcz1cImdyaWQtY2VsbCB7e3BhcmFtcy5jZWxsVHlwZX19XCI+XG5cbiAgPGltZyBjbGFzcz1cImljb25zXCIgc3JjPXt7cGFyYW1zLmljb25QYXRofX0gW3N0eWxlLmRpc3BsYXldPVwiKHBhcmFtcy52aWV3TGVhZGluZ0ljb24pID8gJ2Jsb2NrJyA6ICdub25lJ1wiIGFsdD1cIlwiPlxuXG4gIDxzYS1hdmF0YXIgW2lkXT1cInBhcmFtcy5hdmF0YXJDb25maWc/LmlkXCIgW2FsdFRleHRdPVwicGFyYW1zLmF2YXRhckNvbmZpZz8uYWx0VGV4dFwiXG4gICAgW2ltYWdlUGF0aF09XCJwYXJhbXMuYXZhdGFyQ29uZmlnPy5pbWFnZVBhdGhcIiBbc2l6ZV09XCJwYXJhbXMuYXZhdGFyQ29uZmlnPy5zaXplXCJcbiAgICBbc3R5bGUuZGlzcGxheV09XCIocGFyYW1zLnZpZXdBdmF0YXIpID8gJ2Jsb2NrJyA6ICdub25lJ1wiIChvbkNsaWNrRXZlbnQpPVwiYXZhdGFyQ2xpY2tlZCgkZXZlbnQpXCI+XG4gIDwvc2EtYXZhdGFyPlxuXG4gIDxkaXYgY2xhc3M9XCJncmlkLXRleHRcIiBbc3R5bGUuZGlzcGxheV09XCIocGFyYW1zLnZpZXdUZXh0KSA/ICdibG9jaycgOiAnbm9uZSdcIj5cbiAgICA8ZGl2IFtzdHlsZS5kaXNwbGF5XT1cIihwYXJhbXMudGV4dCkgPyAnYmxvY2snIDogJ25vbmUnXCIgKGNsaWNrKT1cImxpbmtDbGlja2VkKClcIiBjbGFzcz1cIm1haW4tdGV4dFwiPnt7cGFyYW1zLnRleHR9fVxuICAgIDwvZGl2PlxuXG4gICAgPGRpdiBbc3R5bGUuZGlzcGxheV09XCIocGFyYW1zLnN1YlRleHQpID8gJ2Jsb2NrJyA6ICdub25lJ1wiIGNsYXNzPVwic3ViLXRleHRcIj57e3BhcmFtcy5zdWJUZXh0fX08L2Rpdj5cbiAgPC9kaXY+XG5cbiAgPGltZyBjbGFzcz1cImljb25zXCIgc3JjPXt7cGFyYW1zLmljb25QYXRofX0gW3N0eWxlLmRpc3BsYXldPVwiKHBhcmFtcy52aWV3VHJhaWxpbmdJY29uKSA/ICdibG9jaycgOiAnbm9uZSdcIiBhbHQ9XCJcIj5cblxuXG4gIDxzYS1jaGlwICpuZ0Zvcj1cImxldCBjb25maWcgb2YgcGFyYW1zLmNoaXBDb25maWcsIGxldCBpID0gaW5kZXhcIiBbaWRdPVwiY29uZmlnLmlkXCIgW2ZpbGxpbmddPVwiY29uZmlnLmZpbGxpbmdcIlxuICAgIGlkPVwiY2hpcF97e3Jvd051bX19X3t7Y29uZmlnLmlkfX1cIiBbaWNvblBhdGhdPVwiY29uZmlnLmljb25QYXRoXCIgW2ljb25Qb3NpdGlvbl09XCJjb25maWcuaWNvblBvc2l0aW9uXCJcbiAgICBbbGFyZ2VTdGF0ZUljb25dPVwiY29uZmlnLmxhcmdlU3RhdGVJY29uXCIgW3N0YXRlXT1cImNvbmZpZy5zdGF0ZVwiIFt0eXBlXT1cImNvbmZpZy50eXBlXCIgW3RleHRdPVwiY29uZmlnLnRleHRcIlxuICAgIFtzdHlsZS5kaXNwbGF5XT1cIihwYXJhbXMudmlld0NoaXApID8gJ2Jsb2NrJyA6ICdub25lJ1wiIChvbkNsaWNrRXZlbnQpPVwiY2hpcENsaWNrZWQoJGV2ZW50KVwiPjwvc2EtY2hpcD5cblxuICA8c2EtYnV0dG9uIFtpY29uUG9zaXRpb25dPVwicGFyYW1zLmJ1dHRvbkNvbmZpZz8uaWNvblBvc2l0aW9uXCIgW0ltYWdlUGF0aF09XCJwYXJhbXMuYnV0dG9uQ29uZmlnPy5pbWFnZVBhdGhcIlxuICAgIFtpZF09XCJwYXJhbXMuYnV0dG9uQ29uZmlnPy5pZFwiIFtzaXplXT1cInBhcmFtcy5idXR0b25Db25maWc/LnNpemVcIiBbc3RhdGVdPVwicGFyYW1zLmJ1dHRvbkNvbmZpZz8uc3RhdGVcIlxuICAgIFt0eXBlXT1cInBhcmFtcy5idXR0b25Db25maWc/LnR5cGVcIiBbdGV4dF09XCJwYXJhbXMuYnV0dG9uQ29uZmlnPy50ZXh0XCIgW2hyZWZdPVwicGFyYW1zLmJ1dHRvbkNvbmZpZz8uaHJlZlwiXG4gICAgW2hyZWZUYXJnZXRdPVwicGFyYW1zLmJ1dHRvbkNvbmZpZz8uaHJlZlRhcmdldFwiIFtzdHlsZS5kaXNwbGF5XT1cIihwYXJhbXMudmlld0J1dHRvbikgPyAnYmxvY2snIDogJ25vbmUnXCJcbiAgICAob25DbGlja0V2ZW50KT1cImJ1dHRvbkNsaWNrZWQoJGV2ZW50KVwiPjwvc2EtYnV0dG9uPlxuXG48L2Rpdj5cbiJdfQ==

package/esm2022/lib/header/header.component.mjs

@@ -0,0 +1,37 @@
+import { Component, EventEmitter, Output } from '@angular/core';
+import { ChipsComponent } from '../chips/chips.component';
+import { Input } from '@angular/core';
+import { NgFor } from '@angular/common';
+import { ButtonComponent } from '../button/button.component';
+import { NgIf } from '@angular/common';
+import * as i0 from "@angular/core";
+export class HeaderComponent {
+    constructor() {
+        this.mainButtonClicked = new EventEmitter();
+        this.helperButtonClicked = new EventEmitter();
+    }
+    clicked(num) {
+        num ? this.mainButtonClicked.emit() : this.helperButtonClicked.emit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: HeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: HeaderComponent, isStandalone: true, selector: "sa-header", inputs: { info: "info", headerName: "headerName", chipConfig: "chipConfig", buttonHelper: "buttonHelper", buttonMain: "buttonMain" }, outputs: { mainButtonClicked: "mainButtonClicked", helperButtonClicked: "helperButtonClicked" }, ngImport: i0, template: "<div class=\"header\">\n  <div class=\"header-content\">\n    <div class=\"heading\">\n      <div class=\"header-name\">{{headerName}}</div>\n      <div *ngFor=\"let chip of chipConfig\">\n        <sa-chip type=\"regular\" [state]=\"chip[1]\" filling=\"filled\" [text]=\"chip[0]\"></sa-chip>\n      </div>\n    </div>\n    <div class=\"header-info\">\n      <div class=\"info-item\" *ngFor=\"let item of info\">\n        <img [src]=\"item[1]\" alt=\"\">\n        {{item[0]}}\n      </div>\n    </div>\n  </div>\n  <div class=\"actions\">\n    <sa-button *ngIf=\"buttonHelper\" (onClickEvent)=\"clicked(0)\" [text]=\"buttonHelper\" type=\"transparent\" size=\"medium\"\n      state=\"default\">\n    </sa-button>\n    <sa-button *ngIf=\"buttonMain\" (onClickEvent)=\"clicked(1)\" [text]=\"buttonMain\" type=\"primary\" size=\"medium\"\n      state=\"default\"></sa-button>\n  </div>\n</div>\n", styles: [".header{width:100%;height:96px;font-family:var(--font);padding:var(--medium-20px, 20px) var(--medium-32px, 32px);display:flex;justify-content:space-between;align-items:center;box-sizing:border-box;border-radius:var(--small-8px, 8px);border:1px solid var(--grey-50, #E9EAEB);background:var(--Structural-White, #FFF)}.header-content{display:flex;flex-direction:column;gap:var(--small-8px, 8px)}.heading{display:flex;justify-content:flex-start;align-items:center;gap:var(--small-8px, 8px)}.header-name{font-size:22px;font-style:normal;font-weight:500;line-height:28px}.header-info{display:flex;gap:var(--small-12px, 12px)}.info-item{display:flex;justify-content:center;align-items:center;gap:var(--small-4px, 4px);font-size:12px;font-style:normal;font-weight:400;line-height:16px;color:var(--text-mediumemphasis)}.info-item img{width:20px;height:20px}.actions{display:flex;gap:var(--small-12px, 12px)}\n"], dependencies: [{ kind: "component", type: ChipsComponent, selector: "sa-chip", inputs: ["id", "iconPath", "text", "type", "state", "filling", "iconPosition", "largeStateIcon", "largeStateText"], outputs: ["onClickEvent"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ButtonComponent, selector: "sa-button", inputs: ["id", "type", "state", "size", "text", "ImagePath", "iconPosition", "href", "hrefTarget", "isSubmit"], outputs: ["onClickEvent", "onMouseInEvent", "onMouseOutEvent"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: HeaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sa-header', standalone: true, imports: [ChipsComponent, NgFor, ButtonComponent, NgIf], template: "<div class=\"header\">\n  <div class=\"header-content\">\n    <div class=\"heading\">\n      <div class=\"header-name\">{{headerName}}</div>\n      <div *ngFor=\"let chip of chipConfig\">\n        <sa-chip type=\"regular\" [state]=\"chip[1]\" filling=\"filled\" [text]=\"chip[0]\"></sa-chip>\n      </div>\n    </div>\n    <div class=\"header-info\">\n      <div class=\"info-item\" *ngFor=\"let item of info\">\n        <img [src]=\"item[1]\" alt=\"\">\n        {{item[0]}}\n      </div>\n    </div>\n  </div>\n  <div class=\"actions\">\n    <sa-button *ngIf=\"buttonHelper\" (onClickEvent)=\"clicked(0)\" [text]=\"buttonHelper\" type=\"transparent\" size=\"medium\"\n      state=\"default\">\n    </sa-button>\n    <sa-button *ngIf=\"buttonMain\" (onClickEvent)=\"clicked(1)\" [text]=\"buttonMain\" type=\"primary\" size=\"medium\"\n      state=\"default\"></sa-button>\n  </div>\n</div>\n", styles: [".header{width:100%;height:96px;font-family:var(--font);padding:var(--medium-20px, 20px) var(--medium-32px, 32px);display:flex;justify-content:space-between;align-items:center;box-sizing:border-box;border-radius:var(--small-8px, 8px);border:1px solid var(--grey-50, #E9EAEB);background:var(--Structural-White, #FFF)}.header-content{display:flex;flex-direction:column;gap:var(--small-8px, 8px)}.heading{display:flex;justify-content:flex-start;align-items:center;gap:var(--small-8px, 8px)}.header-name{font-size:22px;font-style:normal;font-weight:500;line-height:28px}.header-info{display:flex;gap:var(--small-12px, 12px)}.info-item{display:flex;justify-content:center;align-items:center;gap:var(--small-4px, 4px);font-size:12px;font-style:normal;font-weight:400;line-height:16px;color:var(--text-mediumemphasis)}.info-item img{width:20px;height:20px}.actions{display:flex;gap:var(--small-12px, 12px)}\n"] }]
+        }], propDecorators: { info: [{
+                type: Input
+            }], headerName: [{
+                type: Input
+            }], chipConfig: [{
+                type: Input
+            }], buttonHelper: [{
+                type: Input
+            }], buttonMain: [{
+                type: Input
+            }], mainButtonClicked: [{
+                type: Output
+            }], helperButtonClicked: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaGVhZGVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvbXBvbmVudC1saWJyYXJ5L3NyYy9saWIvaGVhZGVyL2hlYWRlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2hlYWRlci9oZWFkZXIuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ2hFLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQztBQUMxRCxPQUFPLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3RDLE9BQU8sRUFBRSxLQUFLLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUN4QyxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sNEJBQTRCLENBQUM7QUFDN0QsT0FBTyxFQUFFLElBQUksRUFBRSxNQUFNLGlCQUFpQixDQUFDOztBQVN2QyxNQUFNLE9BQU8sZUFBZTtJQVA1QjtRQWNZLHNCQUFpQixHQUFHLElBQUksWUFBWSxFQUFFLENBQUM7UUFDdkMsd0JBQW1CLEdBQUcsSUFBSSxZQUFZLEVBQUUsQ0FBQztLQUtwRDtJQUhDLE9BQU8sQ0FBQyxHQUFXO1FBQ2pCLEdBQUcsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLGlCQUFpQixDQUFDLElBQUksRUFBRSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsbUJBQW1CLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDeEUsQ0FBQzs4R0FaVSxlQUFlO2tHQUFmLGVBQWUsNFNDZDVCLDYzQkF1QkEsODdCRGJZLGNBQWMsbU1BQUUsS0FBSyxtSEFBRSxlQUFlLHNPQUFFLElBQUk7OzJGQUkzQyxlQUFlO2tCQVAzQixTQUFTOytCQUNFLFdBQVcsY0FDVCxJQUFJLFdBQ1AsQ0FBQyxjQUFjLEVBQUUsS0FBSyxFQUFFLGVBQWUsRUFBRSxJQUFJLENBQUM7OEJBSzlDLElBQUk7c0JBQVosS0FBSztnQkFDRyxVQUFVO3NCQUFsQixLQUFLO2dCQUNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFDRyxVQUFVO3NCQUFsQixLQUFLO2dCQUVJLGlCQUFpQjtzQkFBMUIsTUFBTTtnQkFDRyxtQkFBbUI7c0JBQTVCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDaGlwc0NvbXBvbmVudCB9IGZyb20gJy4uL2NoaXBzL2NoaXBzLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgTmdGb3IgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQnV0dG9uQ29tcG9uZW50IH0gZnJvbSAnLi4vYnV0dG9uL2J1dHRvbi5jb21wb25lbnQnO1xuaW1wb3J0IHsgTmdJZiB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3NhLWhlYWRlcicsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDaGlwc0NvbXBvbmVudCwgTmdGb3IsIEJ1dHRvbkNvbXBvbmVudCwgTmdJZl0sXG4gIHRlbXBsYXRlVXJsOiAnLi9oZWFkZXIuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybDogJy4vaGVhZGVyLmNvbXBvbmVudC5jc3MnXG59KVxuZXhwb3J0IGNsYXNzIEhlYWRlckNvbXBvbmVudCB7XG4gIEBJbnB1dCgpIGluZm86IHN0cmluZ1tdW107XG4gIEBJbnB1dCgpIGhlYWRlck5hbWU6IHN0cmluZztcbiAgQElucHV0KCkgY2hpcENvbmZpZzogc3RyaW5nW11bXTtcbiAgQElucHV0KCkgYnV0dG9uSGVscGVyOiBzdHJpbmc7XG4gIEBJbnB1dCgpIGJ1dHRvbk1haW46IHN0cmluZztcblxuICBAT3V0cHV0KCkgbWFpbkJ1dHRvbkNsaWNrZWQgPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG4gIEBPdXRwdXQoKSBoZWxwZXJCdXR0b25DbGlja2VkID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuXG4gIGNsaWNrZWQobnVtOiBudW1iZXIpIHtcbiAgICBudW0gPyB0aGlzLm1haW5CdXR0b25DbGlja2VkLmVtaXQoKSA6IHRoaXMuaGVscGVyQnV0dG9uQ2xpY2tlZC5lbWl0KCk7XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJoZWFkZXJcIj5cbiAgPGRpdiBjbGFzcz1cImhlYWRlci1jb250ZW50XCI+XG4gICAgPGRpdiBjbGFzcz1cImhlYWRpbmdcIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJoZWFkZXItbmFtZVwiPnt7aGVhZGVyTmFtZX19PC9kaXY+XG4gICAgICA8ZGl2ICpuZ0Zvcj1cImxldCBjaGlwIG9mIGNoaXBDb25maWdcIj5cbiAgICAgICAgPHNhLWNoaXAgdHlwZT1cInJlZ3VsYXJcIiBbc3RhdGVdPVwiY2hpcFsxXVwiIGZpbGxpbmc9XCJmaWxsZWRcIiBbdGV4dF09XCJjaGlwWzBdXCI+PC9zYS1jaGlwPlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gICAgPGRpdiBjbGFzcz1cImhlYWRlci1pbmZvXCI+XG4gICAgICA8ZGl2IGNsYXNzPVwiaW5mby1pdGVtXCIgKm5nRm9yPVwibGV0IGl0ZW0gb2YgaW5mb1wiPlxuICAgICAgICA8aW1nIFtzcmNdPVwiaXRlbVsxXVwiIGFsdD1cIlwiPlxuICAgICAgICB7e2l0ZW1bMF19fVxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuICA8ZGl2IGNsYXNzPVwiYWN0aW9uc1wiPlxuICAgIDxzYS1idXR0b24gKm5nSWY9XCJidXR0b25IZWxwZXJcIiAob25DbGlja0V2ZW50KT1cImNsaWNrZWQoMClcIiBbdGV4dF09XCJidXR0b25IZWxwZXJcIiB0eXBlPVwidHJhbnNwYXJlbnRcIiBzaXplPVwibWVkaXVtXCJcbiAgICAgIHN0YXRlPVwiZGVmYXVsdFwiPlxuICAgIDwvc2EtYnV0dG9uPlxuICAgIDxzYS1idXR0b24gKm5nSWY9XCJidXR0b25NYWluXCIgKG9uQ2xpY2tFdmVudCk9XCJjbGlja2VkKDEpXCIgW3RleHRdPVwiYnV0dG9uTWFpblwiIHR5cGU9XCJwcmltYXJ5XCIgc2l6ZT1cIm1lZGl1bVwiXG4gICAgICBzdGF0ZT1cImRlZmF1bHRcIj48L3NhLWJ1dHRvbj5cbiAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==

package/esm2022/lib/icon/icon.component.mjs

@@ -0,0 +1,53 @@
+import { Component, inject, Input, ViewEncapsulation } from '@angular/core';
+import { IconService } from './icon.service';
+import { DomSanitizer } from '@angular/platform-browser';
+import { CommonModule } from '@angular/common';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+export class IconComponent {
+    constructor() {
+        this.iconService = inject(IconService);
+        this.sanitizer = inject(DomSanitizer);
+        this.iconStyles = {
+            fontSize: '44px',
+            color: 'red'
+        };
+        console.log('icon comp constructor');
+    }
+    ngOnInit() {
+        console.log('icon comp');
+    }
+    ngOnChanges(changes) {
+        if (changes['icon']) {
+            if (this.icon) {
+                this.iconService.getSvg(this.icon).subscribe((svg) => {
+                    this.svgIcon = this.sanitizer.bypassSecurityTrustHtml(svg);
+                    console.log('svg', this.icon, this.svgIcon);
+                });
+            }
+            else {
+                this.svgIcon = '';
+            }
+        }
+        if (changes['size'] || changes['color']) {
+            this.iconStyles.fontSize = this.size + 'px';
+            this.iconStyles.color = this.color;
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: IconComponent, isStandalone: true, selector: "sa-icon", inputs: { icon: "icon", size: "size", color: "color" }, usesOnChanges: true, ngImport: i0, template: "<span class=\"sa-icon\" [innerHTML]=\"svgIcon\" [ngStyle]=\"iconStyles\">\n\n</span>\n\n<!-- <img *ngIf=\"svgIcon\" [src]=\"svgIcon\" [ngStyle]=\"iconStyles\" alt=\"icon\"> -->", styles: [".sa-icon{display:inline-flex;align-items:center;justify-content:center;color:inherit;font-size:inherit}.sa-icon>svg{width:1em;height:1em;vertical-align:middle}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IconComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sa-icon', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<span class=\"sa-icon\" [innerHTML]=\"svgIcon\" [ngStyle]=\"iconStyles\">\n\n</span>\n\n<!-- <img *ngIf=\"svgIcon\" [src]=\"svgIcon\" [ngStyle]=\"iconStyles\" alt=\"icon\"> -->", styles: [".sa-icon{display:inline-flex;align-items:center;justify-content:center;color:inherit;font-size:inherit}.sa-icon>svg{width:1em;height:1em;vertical-align:middle}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { icon: [{
+                type: Input,
+                args: ['icon']
+            }], size: [{
+                type: Input,
+                args: ['size']
+            }], color: [{
+                type: Input,
+                args: ['color']
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2ljb24vaWNvbi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2ljb24vaWNvbi5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sRUFBVSxLQUFLLEVBQWlCLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ25HLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUc3QyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFDekQsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDOzs7QUFVL0MsTUFBTSxPQUFPLGFBQWE7SUFjeEI7UUFiQSxnQkFBVyxHQUFHLE1BQU0sQ0FBQyxXQUFXLENBQUMsQ0FBQztRQUNsQyxjQUFTLEdBQUcsTUFBTSxDQUFDLFlBQVksQ0FBQyxDQUFDO1FBT2pDLGVBQVUsR0FBUTtZQUNoQixRQUFRLEVBQUUsTUFBTTtZQUNoQixLQUFLLEVBQUUsS0FBSztTQUNiLENBQUM7UUFHQSxPQUFPLENBQUMsR0FBRyxDQUFDLHVCQUF1QixDQUFDLENBQUE7SUFDdEMsQ0FBQztJQUNELFFBQVE7UUFDTixPQUFPLENBQUMsR0FBRyxDQUFDLFdBQVcsQ0FBQyxDQUFBO0lBQzFCLENBQUM7SUFDRCxXQUFXLENBQUMsT0FBc0I7UUFDaEMsSUFBSSxPQUFPLENBQUMsTUFBTSxDQUFDLEVBQUUsQ0FBQztZQUNwQixJQUFJLElBQUksQ0FBQyxJQUFJLEVBQUUsQ0FBQztnQkFDZCxJQUFJLENBQUMsV0FBVyxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUMsU0FBUyxDQUFDLENBQUMsR0FBRyxFQUFFLEVBQUU7b0JBQ25ELElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLFNBQVMsQ0FBQyx1QkFBdUIsQ0FBQyxHQUFHLENBQUMsQ0FBQztvQkFDM0QsT0FBTyxDQUFDLEdBQUcsQ0FBQyxLQUFLLEVBQUUsSUFBSSxDQUFDLElBQUksRUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUE7Z0JBQzdDLENBQUMsQ0FBQyxDQUFBO1lBQ0osQ0FBQztpQkFBTSxDQUFDO2dCQUNOLElBQUksQ0FBQyxPQUFPLEdBQUcsRUFBRSxDQUFDO1lBQ3BCLENBQUM7UUFDSCxDQUFDO1FBQ0QsSUFBSSxPQUFPLENBQUMsTUFBTSxDQUFDLElBQUksT0FBTyxDQUFDLE9BQU8sQ0FBQyxFQUFFLENBQUM7WUFDeEMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxRQUFRLEdBQUcsSUFBSSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUM7WUFDNUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQztRQUNyQyxDQUFDO0lBQ0gsQ0FBQzs4R0FuQ1UsYUFBYTtrR0FBYixhQUFhLGdKQ2YxQixrTEFJZ0YsME5ETXBFLFlBQVk7OzJGQUtYLGFBQWE7a0JBUnpCLFNBQVM7K0JBQ0UsU0FBUyxjQUNQLElBQUksV0FDUCxDQUFDLFlBQVksQ0FBQyxpQkFHUixpQkFBaUIsQ0FBQyxJQUFJO3dEQU10QixJQUFJO3NCQUFsQixLQUFLO3VCQUFDLE1BQU07Z0JBQ0UsSUFBSTtzQkFBbEIsS0FBSzt1QkFBQyxNQUFNO2dCQUNHLEtBQUs7c0JBQXBCLEtBQUs7dUJBQUMsT0FBTyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgaW5qZWN0LCBJbmplY3QsIElucHV0LCBTaW1wbGVDaGFuZ2VzLCBWaWV3RW5jYXBzdWxhdGlvbiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgSWNvblNlcnZpY2UgfSBmcm9tICcuL2ljb24uc2VydmljZSc7XG5pbXBvcnQgeyBPYnNlcnZhYmxlIH0gZnJvbSAncnhqcyc7XG5pbXBvcnQgeyBIdHRwQ2xpZW50TW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uL2h0dHAnO1xuaW1wb3J0IHsgRG9tU2FuaXRpemVyIH0gZnJvbSAnQGFuZ3VsYXIvcGxhdGZvcm0tYnJvd3Nlcic7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdzYS1pY29uJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZV0sXG4gIHRlbXBsYXRlVXJsOiAnLi9pY29uLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmw6ICcuL2ljb24uY29tcG9uZW50LmNzcycsXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmVcbn0pXG5leHBvcnQgY2xhc3MgSWNvbkNvbXBvbmVudCB7XG4gIGljb25TZXJ2aWNlID0gaW5qZWN0KEljb25TZXJ2aWNlKTtcbiAgc2FuaXRpemVyID0gaW5qZWN0KERvbVNhbml0aXplcik7XG5cbiAgQElucHV0KCdpY29uJykgaWNvbjogc3RyaW5nO1xuICBASW5wdXQoJ3NpemUnKSBzaXplOiBzdHJpbmc7XG4gIEBJbnB1dCgnY29sb3InKSBjb2xvcjogc3RyaW5nO1xuXG4gIHN2Z0ljb246IGFueTtcbiAgaWNvblN0eWxlczogYW55ID0ge1xuICAgIGZvbnRTaXplOiAnNDRweCcsXG4gICAgY29sb3I6ICdyZWQnXG4gIH07XG5cbiAgY29uc3RydWN0b3IoKSB7XG4gICAgY29uc29sZS5sb2coJ2ljb24gY29tcCBjb25zdHJ1Y3RvcicpXG4gIH1cbiAgbmdPbkluaXQoKSB7XG4gICAgY29uc29sZS5sb2coJ2ljb24gY29tcCcpXG4gIH1cbiAgbmdPbkNoYW5nZXMoY2hhbmdlczogU2ltcGxlQ2hhbmdlcykge1xuICAgIGlmIChjaGFuZ2VzWydpY29uJ10pIHtcbiAgICAgIGlmICh0aGlzLmljb24pIHtcbiAgICAgICAgdGhpcy5pY29uU2VydmljZS5nZXRTdmcodGhpcy5pY29uKS5zdWJzY3JpYmUoKHN2ZykgPT4ge1xuICAgICAgICAgIHRoaXMuc3ZnSWNvbiA9IHRoaXMuc2FuaXRpemVyLmJ5cGFzc1NlY3VyaXR5VHJ1c3RIdG1sKHN2Zyk7XG4gICAgICAgICAgY29uc29sZS5sb2coJ3N2ZycsIHRoaXMuaWNvbiwgdGhpcy5zdmdJY29uKVxuICAgICAgICB9KVxuICAgICAgfSBlbHNlIHtcbiAgICAgICAgdGhpcy5zdmdJY29uID0gJyc7XG4gICAgICB9XG4gICAgfVxuICAgIGlmIChjaGFuZ2VzWydzaXplJ10gfHwgY2hhbmdlc1snY29sb3InXSkge1xuICAgICAgdGhpcy5pY29uU3R5bGVzLmZvbnRTaXplID0gdGhpcy5zaXplICsgJ3B4JztcbiAgICAgIHRoaXMuaWNvblN0eWxlcy5jb2xvciA9IHRoaXMuY29sb3I7XG4gICAgfVxuICB9XG59IiwiPHNwYW4gY2xhc3M9XCJzYS1pY29uXCIgW2lubmVySFRNTF09XCJzdmdJY29uXCIgW25nU3R5bGVdPVwiaWNvblN0eWxlc1wiPlxuXG48L3NwYW4+XG5cbjwhLS0gPGltZyAqbmdJZj1cInN2Z0ljb25cIiBbc3JjXT1cInN2Z0ljb25cIiBbbmdTdHlsZV09XCJpY29uU3R5bGVzXCIgYWx0PVwiaWNvblwiPiAtLT4iXX0=

package/esm2022/lib/icon/icon.service.mjs

@@ -0,0 +1,25 @@
+import { HttpClient } from '@angular/common/http';
+import { inject, Injectable } from '@angular/core';
+import * as i0 from "@angular/core";
+export class IconService {
+    constructor() {
+        this.http = inject(HttpClient);
+        this.path = 'assets/';
+    }
+    getSvg(iconName) {
+        return this.http.get(`${this.path}${iconName}.svg`, { responseType: 'text' });
+    }
+    setIconPath(path) {
+        if (path)
+            this.path = path;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IconService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IconService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IconService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi5zZXJ2aWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29tcG9uZW50LWxpYnJhcnkvc3JjL2xpYi9pY29uL2ljb24uc2VydmljZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDbEQsT0FBTyxFQUFFLE1BQU0sRUFBVSxVQUFVLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBTTNELE1BQU0sT0FBTyxXQUFXO0lBS3RCO1FBSEEsU0FBSSxHQUFHLE1BQU0sQ0FBQyxVQUFVLENBQUMsQ0FBQztRQUNsQixTQUFJLEdBQVcsU0FBUyxDQUFDO0lBRWpCLENBQUM7SUFFakIsTUFBTSxDQUFDLFFBQWdCO1FBQ3JCLE9BQU8sSUFBSSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsR0FBRyxJQUFJLENBQUMsSUFBSSxHQUFHLFFBQVEsTUFBTSxFQUFFLEVBQUUsWUFBWSxFQUFFLE1BQU0sRUFBRSxDQUFDLENBQUM7SUFDaEYsQ0FBQztJQUVELFdBQVcsQ0FBQyxJQUFZO1FBQ3RCLElBQUksSUFBSTtZQUFFLElBQUksQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDO0lBQzdCLENBQUM7OEdBYlUsV0FBVztrSEFBWCxXQUFXLGNBRlYsTUFBTTs7MkZBRVAsV0FBVztrQkFIdkIsVUFBVTttQkFBQztvQkFDVixVQUFVLEVBQUUsTUFBTTtpQkFDbkIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBIdHRwQ2xpZW50IH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uL2h0dHAnO1xuaW1wb3J0IHsgaW5qZWN0LCBJbmplY3QsIEluamVjdGFibGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE9ic2VydmFibGUgfSBmcm9tICdyeGpzJztcblxuQEluamVjdGFibGUoe1xuICBwcm92aWRlZEluOiAncm9vdCdcbn0pXG5leHBvcnQgY2xhc3MgSWNvblNlcnZpY2Uge1xuXG4gIGh0dHAgPSBpbmplY3QoSHR0cENsaWVudCk7XG4gIHByaXZhdGUgcGF0aDogc3RyaW5nID0gJ2Fzc2V0cy8nO1xuXG4gIGNvbnN0cnVjdG9yKCkgeyB9XG5cbiAgZ2V0U3ZnKGljb25OYW1lOiBzdHJpbmcpOiBPYnNlcnZhYmxlPHN0cmluZz4ge1xuICAgIHJldHVybiB0aGlzLmh0dHAuZ2V0KGAke3RoaXMucGF0aH0ke2ljb25OYW1lfS5zdmdgLCB7IHJlc3BvbnNlVHlwZTogJ3RleHQnIH0pO1xuICB9XG5cbiAgc2V0SWNvblBhdGgocGF0aDogc3RyaW5nKSB7XG4gICAgaWYgKHBhdGgpIHRoaXMucGF0aCA9IHBhdGg7XG4gIH1cbn0iXX0=

package/esm2022/lib/left-nav/left-nav.component.mjs

@@ -0,0 +1,117 @@
+import { CommonModule } from '@angular/common';
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { AvatarComponent } from '../avatar/avatar.component';
+import { IconComponent } from '../icon/icon.component';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/router";
+import * as i2 from "@angular/common";
+// import { AvatarComponent } from '../avatar/avatar.component';
+export class LeftNavComponent {
+    constructor(route, router) {
+        this.route = route;
+        this.router = router;
+        this.clickEvent = new EventEmitter();
+    }
+    ngOnInit() {
+        console.log(this.data.items);
+        if (!this.data.footerItems) {
+            this.data.footerItems = data.footerItems;
+        }
+        if (this.data?.items?.length) {
+            this.onNavItemClick(this.data.items[0], 0);
+        }
+    }
+    setItemActive(index) {
+        try {
+            if (this.activeItem) {
+                this.activeItem.active = false;
+            }
+            if (this.data?.items?.length) {
+                this.activeItem = this.data.items[index];
+                this.activeItem.active = true;
+            }
+        }
+        catch (e) {
+            console.log(e);
+        }
+    }
+    onNavItemClick(item, index, event = null) {
+        console.log(item, index);
+        this.clickEvent.emit({
+            event,
+            type: 'NAV_ITEM_CLICK',
+            item
+        });
+        if (!item.disable && item.path) {
+            this.setItemActive(index);
+            this.router.navigate([item.path]);
+        }
+    }
+    onFooterItemClick(item, index, event = null) {
+        this.clickEvent.emit({
+            event,
+            type: 'FOOTER_ITEM_CLICK',
+            item
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: LeftNavComponent, deps: [{ token: i1.ActivatedRoute }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.4", type: LeftNavComponent, isStandalone: true, selector: "sa-left-nav", inputs: { data: "data" }, outputs: { clickEvent: "click" }, ngImport: i0, template: "<div class=\"sa-left-nav\">\n\n    <div class=\"sa-left-nav-container\">\n        <div class=\"sa-left-nav-logo\">\n            <!-- <span class=\"sa-logo\"></span> -->\n            <sa-icon icon=\"saras_white\" size=\"40\"></sa-icon>\n        </div>\n        <div class=\"sa-left-nav-items\">\n            @if(data && data.items && !!data.items.length){\n            <div class=\"sa-left-nav-items-container\">\n                <ng-container *ngFor=\"let item of data.items; let i = index\">\n                    <div class=\"sa-left-nav-item\" [ngClass]=\"item.active ? 'active' : '' \"\n                        (click)=\"onNavItemClick(item, i, $event)\">\n\n                        <sa-icon class=\"sa-left-nav-item-icon\" [icon]=\"item.icon\" size=\"24\" color=\"white\"></sa-icon>\n                        <!-- <span class=\"sa-left-nav-item-icon\"\n                            [ngStyle]=\"{ 'background-image': 'url(' + item.icon_url + ')' }\"></span> -->\n                    </div>\n                </ng-container>\n            </div>\n            }\n        </div>\n        <div class=\"sa-left-nav-footer\">\n            @if(data && data.footerItems && !!data.footerItems.length){\n            <div class=\"sa-left-nav-footer-container\">\n                <ng-container *ngFor=\"let item of data.footerItems; let i = index\">\n                    <div class=\"sa-left-nav-footer-item\" [ngClass]=\"item.active ? 'active' : '' \"\n                        (click)=\"onFooterItemClick(item, i, $event)\">\n                        @if(item.type === 'AVATAR'){\n                        <!-- <span class=\"sa-left-nav-footer-name\">ET</span> -->\n                        <sa-avatar altText=\"ET\" [imagePath]=\"''\" size=\"extra-small\"></sa-avatar>\n                        }@else{\n                        <sa-icon class=\"sa-left-nav-footer-icon\" [icon]=\"item.icon\" size=\"24\" color=\"white\"></sa-icon>\n                        <!-- <span class=\"sa-left-nav-footer-icon\"\n                            [ngStyle]=\"{ 'background-image': 'url(' + item.icon_url || '' + ')' }\"></span> -->\n                        }\n                    </div>\n                </ng-container>\n            </div>\n            }\n        </div>\n    </div>\n\n    <div class=\"sa-left-nav-content\">\n        <ng-content></ng-content>\n    </div>\n\n</div>", styles: [".sa-left-nav{height:calc(100vh - 32px);width:calc(100vw - 32px);padding:8px;display:flex}.sa-left-nav-logo{display:block;height:40px;width:40px;margin:auto;padding:20px 0;border-bottom:1px #fff solid;min-height:40px}.sa-logo{height:40px;width:20px;display:block;margin:auto;background-position:center;background:url('data:image/svg+xml,<svg viewBox=\"0 0 20 38\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M15.5544 13.5489C15.5034 13.5489 15.4525 13.5489 15.4021 13.5458V13.5489C15.4021 13.5489 14.8606 13.5359 13.0068 13.5253C9.95959 13.4986 8.83176 14.762 8.47545 15.3415H8.46938C8.2094 15.8311 8.13711 16.4024 8.26664 16.9437L8.26299 16.9549C8.28242 17.0836 8.5665 18.5783 11.0255 18.5267C12.9965 18.4851 14.1753 18.3619 14.6506 18.3016C15.2478 18.1597 15.869 18.1613 16.4656 18.3063C17.0621 18.4513 17.6178 18.7357 18.0892 19.1373C18.5605 19.539 18.9347 20.0469 19.1824 20.6213C19.4302 21.1957 19.5448 21.8211 19.5173 22.4485C19.4897 23.0758 19.3208 23.6882 19.0238 24.2375C18.7267 24.7869 18.3095 25.2583 17.8049 25.615C17.3003 25.9717 16.7219 26.2039 16.1151 26.2935C15.5083 26.3831 14.8894 26.3276 14.307 26.1314C14.0163 26.063 13.6253 25.9623 13.0985 25.8162C9.93167 25.0272 8.19258 29.8974 8.19258 29.8974L8.18651 29.9017C7.9393 30.6023 7.5091 31.22 6.94278 31.6874C6.37647 32.1549 5.69576 32.4541 4.97485 32.5526C4.25393 32.6511 3.52045 32.545 2.85434 32.2459C2.18822 31.9468 1.61502 31.4662 1.1972 30.8565C0.779378 30.2467 0.532961 29.5312 0.484798 28.7878C0.436635 28.0445 0.588573 27.3019 0.924059 26.6409C1.25955 25.9799 1.76571 25.426 2.38739 25.0393C3.00908 24.6527 3.72244 24.4483 4.44974 24.4483C4.56628 24.4483 4.68101 24.4539 4.79513 24.4638C5.23461 24.4601 6.14816 24.4639 7.98498 24.4956C11.1208 24.5528 11.5409 23.0537 11.5815 22.44C11.5815 22.3822 11.5779 22.3244 11.5779 22.2666C11.5779 22.2411 11.5779 22.2162 11.5779 22.1913C11.5783 22.1889 11.5783 22.1863 11.5779 22.1839C11.5524 21.7349 11.3963 21.3039 11.1298 20.9465C10.8632 20.5891 10.4984 20.3215 10.0822 20.1781C8.53918 19.4942 4.66948 19.8007 4.66948 19.8007V19.7957C4.60392 19.799 4.53796 19.8007 4.47159 19.8007C3.91809 19.8001 3.37082 19.6811 2.86485 19.4512C2.35888 19.2214 1.90539 18.8857 1.53344 18.4659C1.1615 18.046 0.879303 17.5512 0.704954 17.0131C0.530606 16.475 0.467948 15.9056 0.521 15.3413C0.574053 14.7769 0.741643 14.2302 1.01303 13.7361C1.28441 13.2419 1.6536 12.8113 2.09693 12.4719C2.54026 12.1325 3.04794 11.8917 3.58743 11.7649C4.12692 11.6382 4.68631 11.6283 5.22975 11.7359C6.48742 11.8174 7.74991 11.7689 8.99809 11.591C11.0176 11.3367 11.4783 10.1573 11.5779 9.5125V9.47955C11.5779 8.6747 11.8109 7.88792 12.2474 7.21872C12.684 6.54951 13.3045 6.02792 14.0304 5.71992C14.7564 5.41192 15.5552 5.33133 16.3259 5.48835C17.0965 5.64537 17.8044 6.03294 18.3601 6.60205C18.9157 7.17117 19.2941 7.89627 19.4474 8.68565C19.6006 9.47503 19.522 10.2933 19.2213 11.0368C18.9206 11.7804 18.4114 12.416 17.758 12.8631C17.1047 13.3103 16.3366 13.5489 15.5508 13.5489H15.5544Z\" fill=\"white\"/>%0A<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4.47607 9.04307C3.69031 9.04307 2.92219 8.80441 2.26885 8.35726C1.61551 7.91011 1.10629 7.27456 0.805595 6.53097C0.504895 5.78739 0.426219 4.96917 0.579514 4.17979C0.732809 3.3904 1.11119 2.66531 1.66681 2.09619C2.22243 1.52708 2.93033 1.13951 3.701 0.982491C4.47167 0.825473 5.27049 0.90606 5.99644 1.21406C6.72239 1.52206 7.34287 2.04365 7.77942 2.71286C8.21597 3.38206 8.44897 4.16884 8.44897 4.97369C8.44897 6.05295 8.0304 7.08802 7.28534 7.85118C6.54028 8.61434 5.52975 9.04307 4.47607 9.04307Z\" fill=\"white\"/>%0A<path d=\"M15.5314 37.0946C17.7252 37.0946 19.5037 35.2729 19.5037 33.0258C19.5037 30.7787 17.7252 28.957 15.5314 28.957C13.3375 28.957 11.5591 30.7787 11.5591 33.0258C11.5591 35.2729 13.3375 37.0946 15.5314 37.0946Z\" fill=\"white\"/>%0A</svg>%0A') no-repeat}.sa-left-nav-container{height:inherit;width:64px;background-color:var(--primary-900);border-radius:8px;padding:8px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-evenly}.sa-left-nav-items{flex:1;overflow-y:auto}.sa-left-nav-items-container{padding:40px 0;height:100%;overflow:auto;box-sizing:border-box}.sa-left-nav-item,.sa-left-nav-footer-item{height:40px;width:40px;margin:8px auto;cursor:pointer;border-radius:4px;display:flex;justify-content:center;align-items:center}.sa-left-nav-footer-item{margin:4px auto}.sa-left-nav-item:hover,.sa-left-nav-item.active,.sa-left-nav-footer-item.active,.sa-left-nav-footer-item:hover{background-color:var(--primary-500)}.sa-left-nav-item-name,.sa-left-nav-item-icon,.sa-left-nav-footer-icon,.sa-left-nav-footer-name{height:24px;width:24px;display:block}.sa-left-nav-item-name,mn.sa-left-nav-footer-name{display:flex;justify-content:center;align-items:center}.sa-left-nav-footer{min-height:fit-content;border-top:1px solid #fff}.sa-left-nav-content{width:calc(100% - 64px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: AvatarComponent, selector: "sa-avatar", inputs: ["id", "imagePath", "altText", "size"], outputs: ["onClickEvent", "onMouseInEvent", "onMouseOutEvent"] }, { kind: "component", type: IconComponent, selector: "sa-icon", inputs: ["icon", "size", "color"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: LeftNavComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sa-left-nav', standalone: true, imports: [
+                        CommonModule,
+                        AvatarComponent,
+                        IconComponent
+                    ], template: "<div class=\"sa-left-nav\">\n\n    <div class=\"sa-left-nav-container\">\n        <div class=\"sa-left-nav-logo\">\n            <!-- <span class=\"sa-logo\"></span> -->\n            <sa-icon icon=\"saras_white\" size=\"40\"></sa-icon>\n        </div>\n        <div class=\"sa-left-nav-items\">\n            @if(data && data.items && !!data.items.length){\n            <div class=\"sa-left-nav-items-container\">\n                <ng-container *ngFor=\"let item of data.items; let i = index\">\n                    <div class=\"sa-left-nav-item\" [ngClass]=\"item.active ? 'active' : '' \"\n                        (click)=\"onNavItemClick(item, i, $event)\">\n\n                        <sa-icon class=\"sa-left-nav-item-icon\" [icon]=\"item.icon\" size=\"24\" color=\"white\"></sa-icon>\n                        <!-- <span class=\"sa-left-nav-item-icon\"\n                            [ngStyle]=\"{ 'background-image': 'url(' + item.icon_url + ')' }\"></span> -->\n                    </div>\n                </ng-container>\n            </div>\n            }\n        </div>\n        <div class=\"sa-left-nav-footer\">\n            @if(data && data.footerItems && !!data.footerItems.length){\n            <div class=\"sa-left-nav-footer-container\">\n                <ng-container *ngFor=\"let item of data.footerItems; let i = index\">\n                    <div class=\"sa-left-nav-footer-item\" [ngClass]=\"item.active ? 'active' : '' \"\n                        (click)=\"onFooterItemClick(item, i, $event)\">\n                        @if(item.type === 'AVATAR'){\n                        <!-- <span class=\"sa-left-nav-footer-name\">ET</span> -->\n                        <sa-avatar altText=\"ET\" [imagePath]=\"''\" size=\"extra-small\"></sa-avatar>\n                        }@else{\n                        <sa-icon class=\"sa-left-nav-footer-icon\" [icon]=\"item.icon\" size=\"24\" color=\"white\"></sa-icon>\n                        <!-- <span class=\"sa-left-nav-footer-icon\"\n                            [ngStyle]=\"{ 'background-image': 'url(' + item.icon_url || '' + ')' }\"></span> -->\n                        }\n                    </div>\n                </ng-container>\n            </div>\n            }\n        </div>\n    </div>\n\n    <div class=\"sa-left-nav-content\">\n        <ng-content></ng-content>\n    </div>\n\n</div>", styles: [".sa-left-nav{height:calc(100vh - 32px);width:calc(100vw - 32px);padding:8px;display:flex}.sa-left-nav-logo{display:block;height:40px;width:40px;margin:auto;padding:20px 0;border-bottom:1px #fff solid;min-height:40px}.sa-logo{height:40px;width:20px;display:block;margin:auto;background-position:center;background:url('data:image/svg+xml,<svg viewBox=\"0 0 20 38\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M15.5544 13.5489C15.5034 13.5489 15.4525 13.5489 15.4021 13.5458V13.5489C15.4021 13.5489 14.8606 13.5359 13.0068 13.5253C9.95959 13.4986 8.83176 14.762 8.47545 15.3415H8.46938C8.2094 15.8311 8.13711 16.4024 8.26664 16.9437L8.26299 16.9549C8.28242 17.0836 8.5665 18.5783 11.0255 18.5267C12.9965 18.4851 14.1753 18.3619 14.6506 18.3016C15.2478 18.1597 15.869 18.1613 16.4656 18.3063C17.0621 18.4513 17.6178 18.7357 18.0892 19.1373C18.5605 19.539 18.9347 20.0469 19.1824 20.6213C19.4302 21.1957 19.5448 21.8211 19.5173 22.4485C19.4897 23.0758 19.3208 23.6882 19.0238 24.2375C18.7267 24.7869 18.3095 25.2583 17.8049 25.615C17.3003 25.9717 16.7219 26.2039 16.1151 26.2935C15.5083 26.3831 14.8894 26.3276 14.307 26.1314C14.0163 26.063 13.6253 25.9623 13.0985 25.8162C9.93167 25.0272 8.19258 29.8974 8.19258 29.8974L8.18651 29.9017C7.9393 30.6023 7.5091 31.22 6.94278 31.6874C6.37647 32.1549 5.69576 32.4541 4.97485 32.5526C4.25393 32.6511 3.52045 32.545 2.85434 32.2459C2.18822 31.9468 1.61502 31.4662 1.1972 30.8565C0.779378 30.2467 0.532961 29.5312 0.484798 28.7878C0.436635 28.0445 0.588573 27.3019 0.924059 26.6409C1.25955 25.9799 1.76571 25.426 2.38739 25.0393C3.00908 24.6527 3.72244 24.4483 4.44974 24.4483C4.56628 24.4483 4.68101 24.4539 4.79513 24.4638C5.23461 24.4601 6.14816 24.4639 7.98498 24.4956C11.1208 24.5528 11.5409 23.0537 11.5815 22.44C11.5815 22.3822 11.5779 22.3244 11.5779 22.2666C11.5779 22.2411 11.5779 22.2162 11.5779 22.1913C11.5783 22.1889 11.5783 22.1863 11.5779 22.1839C11.5524 21.7349 11.3963 21.3039 11.1298 20.9465C10.8632 20.5891 10.4984 20.3215 10.0822 20.1781C8.53918 19.4942 4.66948 19.8007 4.66948 19.8007V19.7957C4.60392 19.799 4.53796 19.8007 4.47159 19.8007C3.91809 19.8001 3.37082 19.6811 2.86485 19.4512C2.35888 19.2214 1.90539 18.8857 1.53344 18.4659C1.1615 18.046 0.879303 17.5512 0.704954 17.0131C0.530606 16.475 0.467948 15.9056 0.521 15.3413C0.574053 14.7769 0.741643 14.2302 1.01303 13.7361C1.28441 13.2419 1.6536 12.8113 2.09693 12.4719C2.54026 12.1325 3.04794 11.8917 3.58743 11.7649C4.12692 11.6382 4.68631 11.6283 5.22975 11.7359C6.48742 11.8174 7.74991 11.7689 8.99809 11.591C11.0176 11.3367 11.4783 10.1573 11.5779 9.5125V9.47955C11.5779 8.6747 11.8109 7.88792 12.2474 7.21872C12.684 6.54951 13.3045 6.02792 14.0304 5.71992C14.7564 5.41192 15.5552 5.33133 16.3259 5.48835C17.0965 5.64537 17.8044 6.03294 18.3601 6.60205C18.9157 7.17117 19.2941 7.89627 19.4474 8.68565C19.6006 9.47503 19.522 10.2933 19.2213 11.0368C18.9206 11.7804 18.4114 12.416 17.758 12.8631C17.1047 13.3103 16.3366 13.5489 15.5508 13.5489H15.5544Z\" fill=\"white\"/>%0A<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4.47607 9.04307C3.69031 9.04307 2.92219 8.80441 2.26885 8.35726C1.61551 7.91011 1.10629 7.27456 0.805595 6.53097C0.504895 5.78739 0.426219 4.96917 0.579514 4.17979C0.732809 3.3904 1.11119 2.66531 1.66681 2.09619C2.22243 1.52708 2.93033 1.13951 3.701 0.982491C4.47167 0.825473 5.27049 0.90606 5.99644 1.21406C6.72239 1.52206 7.34287 2.04365 7.77942 2.71286C8.21597 3.38206 8.44897 4.16884 8.44897 4.97369C8.44897 6.05295 8.0304 7.08802 7.28534 7.85118C6.54028 8.61434 5.52975 9.04307 4.47607 9.04307Z\" fill=\"white\"/>%0A<path d=\"M15.5314 37.0946C17.7252 37.0946 19.5037 35.2729 19.5037 33.0258C19.5037 30.7787 17.7252 28.957 15.5314 28.957C13.3375 28.957 11.5591 30.7787 11.5591 33.0258C11.5591 35.2729 13.3375 37.0946 15.5314 37.0946Z\" fill=\"white\"/>%0A</svg>%0A') no-repeat}.sa-left-nav-container{height:inherit;width:64px;background-color:var(--primary-900);border-radius:8px;padding:8px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-evenly}.sa-left-nav-items{flex:1;overflow-y:auto}.sa-left-nav-items-container{padding:40px 0;height:100%;overflow:auto;box-sizing:border-box}.sa-left-nav-item,.sa-left-nav-footer-item{height:40px;width:40px;margin:8px auto;cursor:pointer;border-radius:4px;display:flex;justify-content:center;align-items:center}.sa-left-nav-footer-item{margin:4px auto}.sa-left-nav-item:hover,.sa-left-nav-item.active,.sa-left-nav-footer-item.active,.sa-left-nav-footer-item:hover{background-color:var(--primary-500)}.sa-left-nav-item-name,.sa-left-nav-item-icon,.sa-left-nav-footer-icon,.sa-left-nav-footer-name{height:24px;width:24px;display:block}.sa-left-nav-item-name,mn.sa-left-nav-footer-name{display:flex;justify-content:center;align-items:center}.sa-left-nav-footer{min-height:fit-content;border-top:1px solid #fff}.sa-left-nav-content{width:calc(100% - 64px)}\n"] }]
+        }], ctorParameters: () => [{ type: i1.ActivatedRoute }, { type: i1.Router }], propDecorators: { data: [{
+                type: Input,
+                args: ['data']
+            }], clickEvent: [{
+                type: Output,
+                args: ['click']
+            }] } });
+export var ILeftNavTypes;
+(function (ILeftNavTypes) {
+})(ILeftNavTypes || (ILeftNavTypes = {}));
+const data = {
+    items: [{
+            title: 'Home',
+            icon: '',
+            disable: false,
+            tooltip: '',
+            relativePath: true,
+            path: 'home'
+        }, {
+            title: 'Pricing',
+            icon: '',
+            disable: true,
+            tooltip: '',
+            relativePath: true,
+            path: ''
+        }, {
+            title: '',
+            icon: '',
+            disable: true,
+            tooltip: '',
+            relativePath: true,
+            path: ''
+        }],
+    footerItems: [{
+            title: 'Help',
+            icon: 'chathelp',
+            disable: true,
+            tooltip: ''
+        }, {
+            title: 'Name',
+            disable: false,
+            tooltip: '',
+            type: 'AVATAR'
+        }, {
+            title: 'Chevron',
+            icon: 'doublechevron',
+            disable: true,
+            tooltip: ''
+        }]
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGVmdC1uYXYuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29tcG9uZW50LWxpYnJhcnkvc3JjL2xpYi9sZWZ0LW5hdi9sZWZ0LW5hdi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2xlZnQtbmF2L2xlZnQtbmF2LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBVSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBRS9FLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQztBQUM3RCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUM7Ozs7QUFDdkQsZ0VBQWdFO0FBYWhFLE1BQU0sT0FBTyxnQkFBZ0I7SUFVM0IsWUFBb0IsS0FBcUIsRUFBVSxNQUFjO1FBQTdDLFVBQUssR0FBTCxLQUFLLENBQWdCO1FBQVUsV0FBTSxHQUFOLE1BQU0sQ0FBUTtRQUMvRCxJQUFJLENBQUMsVUFBVSxHQUFHLElBQUksWUFBWSxFQUFFLENBQUM7SUFDdkMsQ0FBQztJQUVELFFBQVE7UUFDTixPQUFPLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDN0IsSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsV0FBVyxFQUFFLENBQUM7WUFDM0IsSUFBSSxDQUFDLElBQUksQ0FBQyxXQUFXLEdBQUcsSUFBSSxDQUFDLFdBQVcsQ0FBQztRQUMzQyxDQUFDO1FBQ0QsSUFBSSxJQUFJLENBQUMsSUFBSSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsQ0FBQztZQUM3QixJQUFJLENBQUMsY0FB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QUFFLENBQUM7WUFDWixLQUFLLEVBQUUsTUFBTTtZQUNiLElBQUksRUFBRSxVQUFVO1lBQ2hCLE9BQU8sRUFBRSxJQUFJO1lBQ2IsT0FBTyxFQUFFLEVBQUU7U0FDWixFQUFFO1lBQ0QsS0FBSyxFQUFFLE1BQU07WUFDYixPQUFPLEVBQUUsS0FBSztZQUNkLE9BQU8sRUFBRSxFQUFFO1lBQ1gsSUFBSSxFQUFFLFFBQVE7U0FDZixFQUFFO1lBQ0QsS0FBSyxFQUFFLFNBQVM7WUFDaEIsSUFBSSxFQUFFLGVBQWU7WUFDckIsT0FBTyxFQUFFLElBQUk7WUFDYixPQUFPLEVBQUUsRUFBRTtTQUNaLENBQUM7Q0FDSCxDQUFBIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbmplY3QsIElucHV0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEFjdGl2YXRlZFJvdXRlLCBSb3V0ZXIgfSBmcm9tICdAYW5ndWxhci9yb3V0ZXInO1xuaW1wb3J0IHsgQXZhdGFyQ29tcG9uZW50IH0gZnJvbSAnLi4vYXZhdGFyL2F2YXRhci5jb21wb25lbnQnO1xuaW1wb3J0IHsgSWNvbkNvbXBvbmVudCB9IGZyb20gJy4uL2ljb24vaWNvbi5jb21wb25lbnQnO1xuLy8gaW1wb3J0IHsgQXZhdGFyQ29tcG9uZW50IH0gZnJvbSAnLi4vYXZhdGFyL2F2YXRhci5jb21wb25lbnQnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdzYS1sZWZ0LW5hdicsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtcbiAgICBDb21tb25Nb2R1bGUsXG4gICAgQXZhdGFyQ29tcG9uZW50LFxuICAgIEljb25Db21wb25lbnRcbiAgXSxcbiAgdGVtcGxhdGVVcmw6ICcuL2xlZnQtbmF2LmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmw6ICcuL2xlZnQtbmF2LmNvbXBvbmVudC5jc3MnXG59KVxuZXhwb3J0IGNsYXNzIExlZnROYXZDb21wb25lbnQge1xuXG4gIEBJbnB1dCgnZGF0YScpIGRhdGE6IElMZWZ0TmF2O1xuICBAT3V0cHV0KCdjbGljaycpIGNsaWNrRXZlbnQ6IEV2ZW50RW1pdHRlcjxJTGVmdE5hdkNsaWNrRXZlbnQ+O1xuXG4gIC8vIEBJbmplY3QoQWN0aXZhdGVkUm91dGUpIGFjdGl2ZVJvdXRlU2VydmljZTogQWN0aXZhdGVkUm91dGU7XG4gIC8vIEBJbmplY3QoUm91dGVyKSByb3V0ZXJTZXJ2aWNlOiBSb3V0ZXI7XG5cbiAgcHJpdmF0ZSBhY3RpdmVJdGVtOiBJTGVmdE5hdkl0ZW0gfCBudWxsO1xuXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgcm91dGU6IEFjdGl2YXRlZFJvdXRlLCBwcml2YXRlIHJvdXRlcjogUm91dGVyKSB7XG4gICAgdGhpcy5jbGlja0V2ZW50ID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuICB9XG5cbiAgbmdPbkluaXQoKSB7XG4gICAgY29uc29sZS5sb2codGhpcy5kYXRhLml0ZW1zKTtcbiAgICBpZiAoIXRoaXMuZGF0YS5mb290ZXJJdGVtcykge1xuICAgICAgdGhpcy5kYXRhLmZvb3Rlckl0ZW1zID0gZGF0YS5mb290ZXJJdGVtcztcbiAgICB9XG4gICAgaWYgKHRoaXMuZGF0YT8uaXRlbXM/Lmxlbmd0aCkge1xuICAgICAgdGhpcy5vbk5hdkl0ZW1DbGljayh0aGlzLmRhdGEuaXRlbXNbMF0sIDApO1xuICAgIH1cbiAgfVxuXG4gIHNldEl0ZW1BY3RpdmUoaW5kZXg6IG51bWJlcikge1xuICAgIHRyeSB7XG4gICAgICBpZiAodGhpcy5hY3RpdmVJdGVtKSB7XG4gICAgICAgIHRoaXMuYWN0aXZlSXRlbS5hY3RpdmUgPSBmYWxzZTtcbiAgICAgIH1cbiAgICAgIGlmICh0aGlzLmRhdGE/Lml0ZW1zPy5sZW5ndGgpIHtcbiAgICAgICAgdGhpcy5hY3RpdmVJdGVtID0gdGhpcy5kYXRhLml0ZW1zW2luZGV4XTtcbiAgICAgICAgdGhpcy5hY3RpdmVJdGVtLmFjdGl2ZSA9IHRydWU7XG4gICAgICB9XG4gICAgfSBjYXRjaCAoZSkge1xuICAgICAgY29uc29sZS5sb2coZSk7XG4gICAgfVxuICB9XG5cbiAgb25OYXZJdGVtQ2xpY2soaXRlbTogSUxlZnROYXZJdGVtLCBpbmRleDogbnVtYmVyLCBldmVudDogYW55ID0gbnVsbCkge1xuICAgIGNvbnNvbGUubG9nKGl0ZW0sIGluZGV4KTtcblxuICAgIHRoaXMuY2xpY2tFdmVudC5lbWl0KHtcbiAgICAgIGV2ZW50LFxuICAgICAgdHlwZTogJ05BVl9JVEVNX0NMSUNLJyxcbiAgICAgIGl0ZW1cbiAgICB9KTtcblxuICAgIGlmICghaXRlbS5kaXNhYmxlICYmIGl0ZW0ucGF0aCkge1xuICAgICAgdGhpcy5zZXRJdGVtQWN0aXZlKGluZGV4KTtcbiAgICAgIHRoaXMucm91dGVyLm5hdmlnYXRlKFtpdGVtLnBhdGhdKVxuICAgIH1cbiAgfVxuXG4gIG9uRm9vdGVySXRlbUNsaWNrKGl0ZW06IElMZWZ0TmF2SXRlbSwgaW5kZXg6IG51bWJlciwgZXZlbnQ6IGFueSA9IG51bGwpIHtcbiAgICB0aGlzLmNsaWNrRXZlbnQuZW1pdCh7XG4gICAgICBldmVudCxcbiAgICAgIHR5cGU6ICdGT09URVJfSVRFTV9DTElDSycsXG4gICAgICBpdGVtXG4gICAgfSk7XG4gIH1cblxuXG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgSUxlZnROYXYge1xuICBpdGVtcz86IElMZWZ0TmF2SXRlbVtdO1xuICBmb290ZXJJdGVtcz86IElMZWZ0TmF2SXRlbVtdO1xufVxuZXhwb3J0IGludGVyZmFjZSBJTGVmdE5hdkl0ZW0ge1xuICB0aXRsZTogc3RyaW5nLFxuICAvLyBpY29uX3VybD86IHN0cmluZyxcbiAgaWNvbj86IHN0cmluZyxcbiAgZGlzYWJsZT86IGJvb2xlYW4sXG4gIHRvb2x0aXA/OiBzdHJpbmcsXG4gIHJlbGF0aXZlUGF0aD86IGJvb2xlYW4sXG4gIHBhdGg/OiBzdHJpbmcsXG4gIGFjdGl2ZT86IGJvb2xlYW4sXG4gIHR5cGU/OiAnSUNPTicgfCAnQVZBVEFSJztcbn1cbmV4cG9ydCBpbnRlcmZhY2UgSUxlZnROYXZDbGlja0V2ZW50IHtcbiAgdHlwZTogJ05BVl9JVEVNX0NMSUNLJyB8ICdGT09URVJfSVRFTV9DTElDSycgfCAnTE9HT19DTElDSyc7XG4gIGV2ZW50OiBhbnksXG4gIGl0ZW06IElMZWZ0TmF2SXRlbVxufVxuZXhwb3J0IGVudW0gSUxlZnROYXZUeXBlcyB7XG5cbn1cblxuY29uc3QgZGF0YTogSUxlZnROYXYgPSB7XG4gIGl0ZW1zOiBbe1xuICAgIHRpdGxlOiAnSG9tZScsXG4gICAgaWNvbjogJycsXG4gICAgZGlzYWJsZTogZmFsc2UsXG4gICAgdG9vbHRpcDogJycsXG4gICAgcmVsYXRpdmVQYXRoOiB0cnVlLFxuICAgIHBhdGg6ICdob21lJ1xuICB9LCB7XG4gICAgdGl0bGU6ICdQcmljaW5nJyxcbiAgICBpY29uOiAnJyxcbiAgICBkaXNhYmxlOiB0cnVlLFxuICAgIHRvb2x0aXA6ICcnLFxuICAgIHJlbGF0aXZlUGF0aDogdHJ1ZSxcbiAgICBwYXRoOiAnJ1xuICB9LCB7XG4gICAgdGl0bGU6ICcnLFxuICAgIGljb246ICcnLFxuICAgIGRpc2FibGU6IHRydWUsXG4gICAgdG9vbHRpcDogJycsXG4gICAgcmVsYXRpdmVQYXRoOiB0cnVlLFxuICAgIHBhdGg6ICcnXG4gIH1dLFxuICBmb290ZXJJdGVtczogW3tcbiAgICB0aXRsZTogJ0hlbHAnLFxuICAgIGljb246ICdjaGF0aGVscCcsXG4gICAgZGlzYWJsZTogdHJ1ZSxcbiAgICB0b29sdGlwOiAnJ1xuICB9LCB7XG4gICAgdGl0bGU6ICdOYW1lJyxcbiAgICBkaXNhYmxlOiBmYWxzZSxcbiAgICB0b29sdGlwOiAnJyxcbiAgICB0eXBlOiAnQVZBVEFSJ1xuICB9LCB7XG4gICAgdGl0bGU6ICdDaGV2cm9uJyxcbiAgICBpY29uOiAnZG91YmxlY2hldnJvbicsXG4gICAgZGlzYWJsZTogdHJ1ZSxcbiAgICB0b29sdGlwOiAnJ1xuICB9XVxufSIsIjxkaXYgY2xhc3M9XCJzYS1sZWZ0LW5hdlwiPlxuXG4gICAgPGRpdiBjbGFzcz1cInNhLWxlZnQtbmF2LWNvbnRhaW5lclwiPlxuICAgICAgICA8ZGl2IGNsYXNzPVwic2EtbGVmdC1uYXYtbG9nb1wiPlxuICAgICAgICAgICAgPCEtLSA8c3BhbiBjbGFzcz1cInNhLWxvZ29cIj48L3NwYW4+IC0tPlxuICAgICAgICAgICAgPHNhLWljb24gaWNvbj1cInNhcmFzX3doaXRlXCIgc2l6ZT1cIjQwXCI+PC9zYS1pY29uPlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPGRpdiBjbGFzcz1cInNhLWxlZnQtbmF2LWl0ZW1zXCI+XG4gICAgICAgICAgICBAaWYoZGF0YSAmJiBkYXRhLml0ZW1zICYmICEhZGF0YS5pdGVtcy5sZW5ndGgpe1xuICAgICAgICAgICAgPGRpdiBjbGFzcz1cInNhLWxlZnQtbmF2LWl0ZW1zLWNvbnRhaW5lclwiPlxuICAgICAgICAgICAgICAgIDxuZy1jb250YWluZXIgKm5nRm9yPVwibGV0IGl0ZW0gb2YgZGF0YS5pdGVtczsgbGV0IGkgPSBpbmRleFwiPlxuICAgICAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwic2EtbGVmdC1uYXYtaXRlbVwiIFtuZ0NsYXNzXT1cIml0ZW0uYWN0aXZlID8gJ2FjdGl2ZScgOiAnJyBcIlxuICAgICAgICAgICAgICAgICAgICAgICAgKGNsaWNrKT1cIm9uTmF2SXRlbUNsaWNrKGl0ZW0sIGksICRldmVudClcIj5cblxuICAgICAgICAgICAgICAgICAgICAgICAgPHNhLWljb24gY2xhc3M9XCJzYS1sZWZ0LW5hdi1pdGVtLWljb25cIiBbaWNvbl09XCJpdGVtLmljb25cIiBzaXplPVwiMjRcIiBjb2xvcj1cIndoaXRlXCI+PC9zYS1pY29uPlxuICAgICAgICAgICAgICAgICAgICAgICAgPCEtLSA8c3BhbiBjbGFzcz1cInNhLWxlZnQtbmF2LWl0ZW0taWNvblwiXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgW25nU3R5bGVdPVwieyAnYmFja2dyb3VuZC1pbWFnZSc6ICd1cmwoJyArIGl0ZW0uaWNvbl91cmwgKyAnKScgfVwiPjwvc3Bhbj4gLS0+XG4gICAgICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICB9XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8ZGl2IGNsYXNzPVwic2EtbGVmdC1uYXYtZm9vdGVyXCI+XG4gICAgICAgICAgICBAaWYoZGF0YSAmJiBkYXRhLmZvb3Rlckl0ZW1zICYmICEhZGF0YS5mb290ZXJJdGVtcy5sZW5ndGgpe1xuICAgICAgICAgICAgPGRpdiBjbGFzcz1cInNhLWxlZnQtbmF2LWZvb3Rlci1jb250YWluZXJcIj5cbiAgICAgICAgICAgICAgICA8bmctY29udGFpbmVyICpuZ0Zvcj1cImxldCBpdGVtIG9mIGRhdGEuZm9vdGVySXRlbXM7IGxldCBpID0gaW5kZXhcIj5cbiAgICAgICAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cInNhLWxlZnQtbmF2LWZvb3Rlci1pdGVtXCIgW25nQ2xhc3NdPVwiaXRlbS5hY3RpdmUgPyAnYWN0aXZlJyA6ICcnIFwiXG4gICAgICAgICAgICAgICAgICAgICAgICAoY2xpY2spPVwib25Gb290ZXJJdGVtQ2xpY2soaXRlbSwgaSwgJGV2ZW50KVwiPlxuICAgICAgICAgICAgICAgICAgICAgICAgQGlmKGl0ZW0udHlwZSA9PT0gJ0FWQVRBUicpe1xuICAgICAgICAgICAgICAgICAgICAgICAgPCEtLSA8c3BhbiBjbGFzcz1cInNhLWxlZnQtbmF2LWZvb3Rlci1uYW1lXCI+RVQ8L3NwYW4+IC0tPlxuICAgICAgICAgICAgICAgICAgICAgICAgPHNhLWF2YXRhciBhbHRUZXh0PVwiRVRcIiBbaW1hZ2VQYXRoXT1cIicnXCIgc2l6ZT1cImV4dHJhLXNtYWxsXCI+PC9zYS1hdmF0YXI+XG4gICAgICAgICAgICAgICAgICAgICAgICB9QGVsc2V7XG4gICAgICAgICAgICAgICAgICAgICAgICA8c2EtaWNvbiBjbGFzcz1cInNhLWxlZnQtbmF2LWZvb3Rlci1pY29uXCIgW2ljb25dPVwiaXRlbS5pY29uXCIgc2l6ZT1cIjI0XCIgY29sb3I9XCJ3aGl0ZVwiPjwvc2EtaWNvbj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDwhLS0gPHNwYW4gY2xhc3M9XCJzYS1sZWZ0LW5hdi1mb290ZXItaWNvblwiXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgW25nU3R5bGVdPVwieyAnYmFja2dyb3VuZC1pbWFnZSc6ICd1cmwoJyArIGl0ZW0uaWNvbl91cmwgfHwgJycgKyAnKScgfVwiPjwvc3Bhbj4gLS0+XG4gICAgICAgICAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICB9XG4gICAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuXG4gICAgPGRpdiBjbGFzcz1cInNhLWxlZnQtbmF2LWNvbnRlbnRcIj5cbiAgICAgICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICAgIDwvZGl2PlxuXG48L2Rpdj4iXX0=

package/esm2022/lib/stepper/stepper.component.mjs

@@ -0,0 +1,64 @@
+import { Component, EventEmitter, Input } from '@angular/core';
+import { FieldType } from '@ngx-formly/core';
+import { NgFor, NgIf } from '@angular/common';
+import { Output } from '@angular/core';
+import * as i0 from "@angular/core";
+let nextId = 0; // used to give unique ids to inputs used in html
+export class StepperComponent extends FieldType {
+    constructor() {
+        super(...arguments);
+        this.latestStep = -1;
+        this.editable = true;
+        this.stepped = new EventEmitter;
+        this.uuid = nextId++;
+        this.isDisabled = false;
+        this.tickIcon = {};
+    }
+    // {
+    //   '-webkit-mask-image': `url(${this.ImagePath})`,
+    //   'mask-image': `url(${this.ImagePath})`,
+    // }
+    ngOnInit() {
+        if (this.field.props) {
+            this.stepLabels = this.field.props.options;
+            this.editable = this.field.props['params'].editable;
+            this.latestStep = this.model[`${this.key}`] ? this.model[`${this.key}`].id : -1;
+            this.doneIcon = this.field.props['params'].doneIcon;
+            this.isDisabled = this.field.props.disabled;
+        }
+        console.log(this.doneIcon);
+        this.tickIcon = {
+            '-webkit-mask-image': `url(${this.doneIcon})`,
+            'mask-image': `url(${this.doneIcon})`
+        };
+    }
+    update(chosen) {
+        if (!this.editable || this.field.props?.disabled)
+            return;
+        this.latestStep = chosen;
+        if (!this.formControl) {
+            this.stepped.emit(this.latestStep);
+            return;
+        }
+        this.formControl.setValue({
+            id: this.latestStep
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: StepperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: StepperComponent, isStandalone: true, selector: "sa-stepper", inputs: { latestStep: "latestStep", editable: "editable", stepLabels: "stepLabels", doneIcon: "doneIcon" }, outputs: { stepped: "stepped" }, usesInheritance: true, ngImport: i0, template: "<div class=\"stepper {{isDisabled ? 'disabled' : 'active'}}\">\n  <div class=\"steps\" *ngFor=\"let label of stepLabels; let i = index\">\n    <input id=\"stepper-{{uuid}}-{{i}}\" (change)=\"update(i)\" name=\"stepper-radio-{{uuid}}\"\n      [checked]=\"i == latestStep ? true: false\" class=\"step-hide\" type=\"radio\">\n    <div\n      class=\"label-wrapper {{i < latestStep ? 'done' : ''}} {{i > latestStep ? 'default' : ''}} {{i == latestStep ? 'latest' : ''}}\">\n      <label [style]=\"i < latestStep ? tickIcon : ''\" for=\"stepper-{{uuid}}-{{i}}\"\n        class=\"step-label-icon {{i > latestStep ? 'undone' : ''}}\">\n      </label>\n      <label for=\"stepper-{{uuid}}-{{i}}\" class=\"step-label-text\">{{label.name}}</label>\n    </div>\n    <div *ngIf=\" i !=stepLabels.length-1\" class=\"line {{i < latestStep ? 'done' : 'default'}}\"></div>\n  </div>\n</div>\n", styles: [".stepper{display:flex;width:max-content;justify-content:center;align-items:center;font-family:var(--font)}.active{--main-bg: var(--primary-500);--main-line: var(--primary-500)}.disabled{--main-bg: var(--grey-100);--main-line: var(--grey-50)}.done{--bg-line: var(--main-line);--bg: var(--main-bg);--border: none}.default{--bg-line: var(--grey-50);--bg: var(--grey-100);--border: 4px solid white}.latest{--bg: white;--border: 4px solid var(--main-bg)}.steps{display:flex;justify-content:center;align-items:center;position:relative}.line{width:140px;height:2px;background-color:var(--bg-line);transition:.25s}.label-wrapper{width:16px;height:16px;height:fit-content;border-radius:16px;background-color:var(--bg);display:flex;justify-content:center}.step-label-icon{display:flex;justify-content:center;width:16px;height:16px;border-radius:16px;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-position:center;mask-position:center;background-position:center;background-color:#fff;border:var(--border);box-sizing:border-box;font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.25px;cursor:pointer}.undone{background-color:var(--grey-100)}.step-label-text{color:var(--text-mediumemphasis, #697079);position:absolute;top:20px;cursor:pointer}.step-hide{display:none}\n"], dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: StepperComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sa-stepper', standalone: true, imports: [NgFor, NgIf], template: "<div class=\"stepper {{isDisabled ? 'disabled' : 'active'}}\">\n  <div class=\"steps\" *ngFor=\"let label of stepLabels; let i = index\">\n    <input id=\"stepper-{{uuid}}-{{i}}\" (change)=\"update(i)\" name=\"stepper-radio-{{uuid}}\"\n      [checked]=\"i == latestStep ? true: false\" class=\"step-hide\" type=\"radio\">\n    <div\n      class=\"label-wrapper {{i < latestStep ? 'done' : ''}} {{i > latestStep ? 'default' : ''}} {{i == latestStep ? 'latest' : ''}}\">\n      <label [style]=\"i < latestStep ? tickIcon : ''\" for=\"stepper-{{uuid}}-{{i}}\"\n        class=\"step-label-icon {{i > latestStep ? 'undone' : ''}}\">\n      </label>\n      <label for=\"stepper-{{uuid}}-{{i}}\" class=\"step-label-text\">{{label.name}}</label>\n    </div>\n    <div *ngIf=\" i !=stepLabels.length-1\" class=\"line {{i < latestStep ? 'done' : 'default'}}\"></div>\n  </div>\n</div>\n", styles: [".stepper{display:flex;width:max-content;justify-content:center;align-items:center;font-family:var(--font)}.active{--main-bg: var(--primary-500);--main-line: var(--primary-500)}.disabled{--main-bg: var(--grey-100);--main-line: var(--grey-50)}.done{--bg-line: var(--main-line);--bg: var(--main-bg);--border: none}.default{--bg-line: var(--grey-50);--bg: var(--grey-100);--border: 4px solid white}.latest{--bg: white;--border: 4px solid var(--main-bg)}.steps{display:flex;justify-content:center;align-items:center;position:relative}.line{width:140px;height:2px;background-color:var(--bg-line);transition:.25s}.label-wrapper{width:16px;height:16px;height:fit-content;border-radius:16px;background-color:var(--bg);display:flex;justify-content:center}.step-label-icon{display:flex;justify-content:center;width:16px;height:16px;border-radius:16px;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-position:center;mask-position:center;background-position:center;background-color:#fff;border:var(--border);box-sizing:border-box;font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.25px;cursor:pointer}.undone{background-color:var(--grey-100)}.step-label-text{color:var(--text-mediumemphasis, #697079);position:absolute;top:20px;cursor:pointer}.step-hide{display:none}\n"] }]
+        }], propDecorators: { latestStep: [{
+                type: Input
+            }], editable: [{
+                type: Input
+            }], stepLabels: [{
+                type: Input
+            }], doneIcon: [{
+                type: Input
+            }], stepped: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3RlcHBlci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL3N0ZXBwZXIvc3RlcHBlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL3N0ZXBwZXIvc3RlcHBlci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDL0QsT0FBTyxFQUFFLFNBQVMsRUFBbUIsTUFBTSxrQkFBa0IsQ0FBQztBQUM5RCxPQUFPLEVBQUUsS0FBSyxFQUFFLElBQUksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQzlDLE9BQU8sRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBRXZDLElBQUksTUFBTSxHQUFHLENBQUMsQ0FBQyxDQUFJLGlEQUFpRDtBQVNwRSxNQUFNLE9BQU8sZ0JBQWlCLFNBQVEsU0FBMEI7SUFQaEU7O1FBUVcsZUFBVSxHQUFXLENBQUMsQ0FBQyxDQUFDO1FBQ3hCLGFBQVEsR0FBWSxJQUFJLENBQUM7UUFJeEIsWUFBTyxHQUFHLElBQUksWUFBWSxDQUFDO1FBRXJDLFNBQUksR0FBVyxNQUFNLEVBQUUsQ0FBQztRQUV4QixlQUFVLEdBQVksS0FBSyxDQUFDO1FBRTVCLGFBQVEsR0FBRyxFQUFFLENBQUM7S0FrQ2Y7SUFoQ0MsSUFBSTtJQUNKLG9EQUFvRDtJQUNwRCw0Q0FBNEM7SUFDNUMsSUFBSTtJQUVKLFFBQVE7UUFDTixJQUFJLElBQUksQ0FBQyxLQUFLLENBQUMsS0FBSyxFQUFFLENBQUM7WUFDckIsSUFBSSxDQUFDLFVBQVUsR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLEtBQUssQ0FBQyxPQUFPLENBQUM7WUFDM0MsSUFBSSxDQUFDLFFBQVEsR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLEtBQUssQ0FBQyxRQUFRLENBQUMsQ0FBQyxRQUFRLENBQUM7WUFDcEQsSUFBSSxDQUFDLFVBQVUsR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLEdBQUcsSUFBSSxDQUFDLEdBQUcsRUFBRSxDQUFDLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsR0FBRyxJQUFJLENBQUMsR0FBRyxFQUFFLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDO1lBQ2hGLElBQUksQ0FBQyxRQUFRLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQyxLQUFLLENBQUMsUUFBUSxDQUFDLENBQUMsUUFBUSxDQUFDO1lBRXBELElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQyxLQUFLLENBQUMsUUFBUyxDQUFDO1FBQy9DLENBQUM7UUFDRCxPQUFPLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQztRQUMzQixJQUFJLENBQUMsUUFBUSxHQUFHO1lBQ2Qsb0JBQW9CLEVBQUUsT0FBTyxJQUFJLENBQUMsUUFBUSxHQUFHO1lBQzdDLFlBQVksRUFBRSxPQUFPLElBQUksQ0FBQyxRQUFRLEdBQUc7U0FDdEMsQ0FBQztJQUNKLENBQUM7SUFFRCxNQUFNLENBQUMsTUFBYztRQUNuQixJQUFJLENBQUMsSUFBSSxDQUFDLFFBQVEsSUFBSSxJQUFJLENBQUMsS0FBSyxDQUFDLEtBQUssRUFBRSxRQUFRO1lBQUUsT0FBTztRQUN6RCxJQUFJLENBQUMsVUFBVSxHQUFHLE1BQU0sQ0FBQztRQUN6QixJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO1lBQ3RCLElBQUksQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQztZQUNuQyxPQUFPO1FBQ1QsQ0FBQztRQUNELElBQUksQ0FBQyxXQUFXLENBQUMsUUFBUSxDQUFDO1lBQ3hCLEVBQUUsRUFBRSxJQUFJLENBQUMsVUFBVTtTQUNwQixDQUFDLENBQUM7SUFDTCxDQUFDOzhHQTdDVSxnQkFBZ0I7a0dBQWhCLGdCQUFnQiwwT0NkN0IsODJCQWNBLDAwQ0RKWSxLQUFLLG1IQUFFLElBQUk7OzJGQUlWLGdCQUFnQjtrQkFQNUIsU0FBUzsrQkFDRSxZQUFZLGNBQ1YsSUFBSSxXQUNQLENBQUMsS0FBSyxFQUFFLElBQUksQ0FBQzs4QkFLYixVQUFVO3NCQUFsQixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUVJLE9BQU87c0JBQWhCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEZpZWxkVHlwZSwgRmllbGRUeXBlQ29uZmlnIH0gZnJvbSAnQG5neC1mb3JtbHkvY29yZSc7XG5pbXBvcnQgeyBOZ0ZvciwgTmdJZiB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxubGV0IG5leHRJZCA9IDA7ICAgIC8vIHVzZWQgdG8gZ2l2ZSB1bmlxdWUgaWRzIHRvIGlucHV0cyB1c2VkIGluIGh0bWxcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc2Etc3RlcHBlcicsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtOZ0ZvciwgTmdJZl0sXG4gIHRlbXBsYXRlVXJsOiAnLi9zdGVwcGVyLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmw6ICcuL3N0ZXBwZXIuY29tcG9uZW50LmNzcydcbn0pXG5leHBvcnQgY2xhc3MgU3RlcHBlckNvbXBvbmVudCBleHRlbmRzIEZpZWxkVHlwZTxGaWVsZFR5cGVDb25maWc+IHtcbiAgQElucHV0KCkgbGF0ZXN0U3RlcDogbnVtYmVyID0gLTE7XG4gIEBJbnB1dCgpIGVkaXRhYmxlOiBib29sZWFuID0gdHJ1ZTtcbiAgQElucHV0KCkgc3RlcExhYmVsczogYW55O1xuICBASW5wdXQoKSBkb25lSWNvbjogc3RyaW5nO1xuXG4gIEBPdXRwdXQoKSBzdGVwcGVkID0gbmV3IEV2ZW50RW1pdHRlcjtcblxuICB1dWlkOiBudW1iZXIgPSBuZXh0SWQrKztcblxuICBpc0Rpc2FibGVkOiBib29sZWFuID0gZmFsc2U7XG5cbiAgdGlja0ljb24gPSB7fTtcblxuICAvLyB7XG4gIC8vICAgJy13ZWJraXQtbWFzay1pbWFnZSc6IGB1cmwoJHt0aGlzLkltYWdlUGF0aH0pYCxcbiAgLy8gICAnbWFzay1pbWFnZSc6IGB1cmwoJHt0aGlzLkltYWdlUGF0aH0pYCxcbiAgLy8gfVxuXG4gIG5nT25Jbml0KCkge1xuICAgIGlmICh0aGlzLmZpZWxkLnByb3BzKSB7XG4gICAgICB0aGlzLnN0ZXBMYWJlbHMgPSB0aGlzLmZpZWxkLnByb3BzLm9wdGlvbnM7XG4gICAgICB0aGlzLmVkaXRhYmxlID0gdGhpcy5maWVsZC5wcm9wc1sncGFyYW1zJ10uZWRpdGFibGU7XG4gICAgICB0aGlzLmxhdGVzdFN0ZXAgPSB0aGlzLm1vZGVsW2Ake3RoaXMua2V5fWBdID8gdGhpcy5tb2RlbFtgJHt0aGlzLmtleX1gXS5pZCA6IC0xO1xuICAgICAgdGhpcy5kb25lSWNvbiA9IHRoaXMuZmllbGQucHJvcHNbJ3BhcmFtcyddLmRvbmVJY29uO1xuXG4gICAgICB0aGlzLmlzRGlzYWJsZWQgPSB0aGlzLmZpZWxkLnByb3BzLmRpc2FibGVkITtcbiAgICB9XG4gICAgY29uc29sZS5sb2codGhpcy5kb25lSWNvbik7XG4gICAgdGhpcy50aWNrSWNvbiA9IHtcbiAgICAgICctd2Via2l0LW1hc2staW1hZ2UnOiBgdXJsKCR7dGhpcy5kb25lSWNvbn0pYCxcbiAgICAgICdtYXNrLWltYWdlJzogYHVybCgke3RoaXMuZG9uZUljb259KWBcbiAgICB9O1xuICB9XG5cbiAgdXBkYXRlKGNob3NlbjogbnVtYmVyKSB7XG4gICAgaWYgKCF0aGlzLmVkaXRhYmxlIHx8IHRoaXMuZmllbGQucHJvcHM/LmRpc2FibGVkKSByZXR1cm47XG4gICAgdGhpcy5sYXRlc3RTdGVwID0gY2hvc2VuO1xuICAgIGlmICghdGhpcy5mb3JtQ29udHJvbCkge1xuICAgICAgdGhpcy5zdGVwcGVkLmVtaXQodGhpcy5sYXRlc3RTdGVwKTtcbiAgICAgIHJldHVybjtcbiAgICB9XG4gICAgdGhpcy5mb3JtQ29udHJvbC5zZXRWYWx1ZSh7XG4gICAgICBpZDogdGhpcy5sYXRlc3RTdGVwXG4gICAgfSk7XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJzdGVwcGVyIHt7aXNEaXNhYmxlZCA/ICdkaXNhYmxlZCcgOiAnYWN0aXZlJ319XCI+XG4gIDxkaXYgY2xhc3M9XCJzdGVwc1wiICpuZ0Zvcj1cImxldCBsYWJlbCBvZiBzdGVwTGFiZWxzOyBsZXQgaSA9IGluZGV4XCI+XG4gICAgPGlucHV0IGlkPVwic3RlcHBlci17e3V1aWR9fS17e2l9fVwiIChjaGFuZ2UpPVwidXBkYXRlKGkpXCIgbmFtZT1cInN0ZXBwZXItcmFkaW8te3t1dWlkfX1cIlxuICAgICAgW2NoZWNrZWRdPVwiaSA9PSBsYXRlc3RTdGVwID8gdHJ1ZTogZmFsc2VcIiBjbGFzcz1cInN0ZXAtaGlkZVwiIHR5cGU9XCJyYWRpb1wiPlxuICAgIDxkaXZcbiAgICAgIGNsYXNzPVwibGFiZWwtd3JhcHBlciB7e2kgPCBsYXRlc3RTdGVwID8gJ2RvbmUnIDogJyd9fSB7e2kgPiBsYXRlc3RTdGVwID8gJ2RlZmF1bHQnIDogJyd9fSB7e2kgPT0gbGF0ZXN0U3RlcCA/ICdsYXRlc3QnIDogJyd9fVwiPlxuICAgICAgPGxhYmVsIFtzdHlsZV09XCJpIDwgbGF0ZXN0U3RlcCA/IHRpY2tJY29uIDogJydcIiBmb3I9XCJzdGVwcGVyLXt7dXVpZH19LXt7aX19XCJcbiAgICAgICAgY2xhc3M9XCJzdGVwLWxhYmVsLWljb24ge3tpID4gbGF0ZXN0U3RlcCA/ICd1bmRvbmUnIDogJyd9fVwiPlxuICAgICAgPC9sYWJlbD5cbiAgICAgIDxsYWJlbCBmb3I9XCJzdGVwcGVyLXt7dXVpZH19LXt7aX19XCIgY2xhc3M9XCJzdGVwLWxhYmVsLXRleHRcIj57e2xhYmVsLm5hbWV9fTwvbGFiZWw+XG4gICAgPC9kaXY+XG4gICAgPGRpdiAqbmdJZj1cIiBpICE9c3RlcExhYmVscy5sZW5ndGgtMVwiIGNsYXNzPVwibGluZSB7e2kgPCBsYXRlc3RTdGVwID8gJ2RvbmUnIDogJ2RlZmF1bHQnfX1cIj48L2Rpdj5cbiAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==

package/esm2022/lib/tabs/tabs.component.mjs

@@ -0,0 +1,38 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { NgFor } from '@angular/common';
+import { NgIf } from '@angular/common';
+import * as i0 from "@angular/core";
+let nextId = 0; // used to give unique ids to inputs used in html
+export class TabsComponent {
+    constructor() {
+        this.tabChanged = new EventEmitter();
+        this.uuid = nextId++;
+        this.svgStyle = [];
+    }
+    ngOnChanges() {
+        this.svgStyle = this.tabs.map((item) => {
+            return {
+                '-webkit-mask-image': `url(${item.tabIcon})`,
+                'mask-image': `url(${item.tabIcon})`,
+            };
+        });
+    }
+    tabChange(evt) {
+        this.tabChanged.emit(evt.target.value);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: TabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: TabsComponent, isStandalone: true, selector: "sa-tabs", inputs: { tabs: "tabs", type: "type", defaultTab: "defaultTab" }, outputs: { tabChanged: "tabChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"tab-wrapper {{type}}\">\n  <div class=\"tabs\">\n    <div *ngFor=\"let item of tabs, let i = index\" class=\"tab-item\">\n      <input [checked]=\"(defaultTab == i) ? true : false\" [value]=\"i\" (change)=\"tabChange($event)\"\n        id=\"tab-check-{{i}}-{{uuid}}\" class=\"tab-checks\" type=\"radio\" name=\"tab-checkbox-{{uuid}}\">\n      <label for=\"tab-check-{{i}}-{{uuid}}\" class=\"tab-label\">\n        <div *ngIf=\"item.iconPosition == 'left' || item.iconPosition == 'both'\" class=\"svg-icon\" [style]=\"svgStyle[i]\">\n        </div>\n        {{item.tabName}}\n        <div *ngIf=\"item.iconPosition == 'right' || item.iconPosition == 'both'\" class=\"svg-icon\" [style]=\"svgStyle[i]\">\n        </div>\n        <div class=\"badge\" *ngIf=\"item.badgeContent\">{{item.badgeContent}}</div>\n      </label>\n    </div>\n  </div>\n</div>\n", styles: [".box{--bg: var(--grey-50);--tab-bg: white;--border: none;--tab-border: none;--tab-border-radius: 2px;--icon-color: var(--text-mediumemphasis)}.inline{--bg: white;--tab-bg: white;--border: 1px solid var(--grey-50, #E9EAEB);--tab-border: var(--primary-500, #1B77E4);--tab-border-radius: none;--icon-color: var(--text-mediumemphasis)}.tab-wrapper{width:max-content;padding:var(--small-8px, 8px);background-color:var(--bg);border-radius:var(--Small-4px, 4px)}.tabs{display:flex;height:42px;gap:var(--small-8px, 8px);font-family:var(--font);border-bottom:var(--border)}.tab-item{display:flex;justify-content:center;align-items:center;gap:var(--small-8px, 8px)}.tab-label{display:flex;justify-content:center;align-items:center;gap:var(--small-4px, 4px);padding:var(--small-8px, 8px) var(--small-12px, 12px);border-bottom:none;transition:.1s;font-size:14px;font-style:normal;font-weight:500;line-height:20px;letter-spacing:.1px;color:var(--text-mediumemphasis);cursor:pointer}.tab-checks{display:none}.tab-checks:checked+label{background-color:var(--tab-bg);border-bottom:2px solid var(--tab-border);border-radius:var(--tab-border-radius);color:var(--primary-500);--icon-color: var(--primary-500) }.tab-checks:checked+label .badge{width:auto;height:auto;padding:var(--Small-4px, 4px) var(--Small-12px, 12px);border-radius:16px;font-size:12px;font-style:normal;font-weight:500;line-height:16px;letter-spacing:.5px}.badge{width:var(--small-8px);height:var(--small-8px);border-radius:var(--small-8px);background-color:var(--secondary-500, #FE8235);color:#fff;margin-left:var(--small-4px);overflow:hidden;transition:.25s;font-size:0}.svg-icon{height:16px;width:16px;-webkit-mask-size:contain;mask-size:contain;background-color:var(--icon-color)}\n"], dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: TabsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sa-tabs', standalone: true, imports: [NgFor, NgIf], template: "<div class=\"tab-wrapper {{type}}\">\n  <div class=\"tabs\">\n    <div *ngFor=\"let item of tabs, let i = index\" class=\"tab-item\">\n      <input [checked]=\"(defaultTab == i) ? true : false\" [value]=\"i\" (change)=\"tabChange($event)\"\n        id=\"tab-check-{{i}}-{{uuid}}\" class=\"tab-checks\" type=\"radio\" name=\"tab-checkbox-{{uuid}}\">\n      <label for=\"tab-check-{{i}}-{{uuid}}\" class=\"tab-label\">\n        <div *ngIf=\"item.iconPosition == 'left' || item.iconPosition == 'both'\" class=\"svg-icon\" [style]=\"svgStyle[i]\">\n        </div>\n        {{item.tabName}}\n        <div *ngIf=\"item.iconPosition == 'right' || item.iconPosition == 'both'\" class=\"svg-icon\" [style]=\"svgStyle[i]\">\n        </div>\n        <div class=\"badge\" *ngIf=\"item.badgeContent\">{{item.badgeContent}}</div>\n      </label>\n    </div>\n  </div>\n</div>\n", styles: [".box{--bg: var(--grey-50);--tab-bg: white;--border: none;--tab-border: none;--tab-border-radius: 2px;--icon-color: var(--text-mediumemphasis)}.inline{--bg: white;--tab-bg: white;--border: 1px solid var(--grey-50, #E9EAEB);--tab-border: var(--primary-500, #1B77E4);--tab-border-radius: none;--icon-color: var(--text-mediumemphasis)}.tab-wrapper{width:max-content;padding:var(--small-8px, 8px);background-color:var(--bg);border-radius:var(--Small-4px, 4px)}.tabs{display:flex;height:42px;gap:var(--small-8px, 8px);font-family:var(--font);border-bottom:var(--border)}.tab-item{display:flex;justify-content:center;align-items:center;gap:var(--small-8px, 8px)}.tab-label{display:flex;justify-content:center;align-items:center;gap:var(--small-4px, 4px);padding:var(--small-8px, 8px) var(--small-12px, 12px);border-bottom:none;transition:.1s;font-size:14px;font-style:normal;font-weight:500;line-height:20px;letter-spacing:.1px;color:var(--text-mediumemphasis);cursor:pointer}.tab-checks{display:none}.tab-checks:checked+label{background-color:var(--tab-bg);border-bottom:2px solid var(--tab-border);border-radius:var(--tab-border-radius);color:var(--primary-500);--icon-color: var(--primary-500) }.tab-checks:checked+label .badge{width:auto;height:auto;padding:var(--Small-4px, 4px) var(--Small-12px, 12px);border-radius:16px;font-size:12px;font-style:normal;font-weight:500;line-height:16px;letter-spacing:.5px}.badge{width:var(--small-8px);height:var(--small-8px);border-radius:var(--small-8px);background-color:var(--secondary-500, #FE8235);color:#fff;margin-left:var(--small-4px);overflow:hidden;transition:.25s;font-size:0}.svg-icon{height:16px;width:16px;-webkit-mask-size:contain;mask-size:contain;background-color:var(--icon-color)}\n"] }]
+        }], propDecorators: { tabs: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], defaultTab: [{
+                type: Input
+            }], tabChanged: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFicy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL3RhYnMvdGFicy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL3RhYnMvdGFicy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBRXZFLE9BQU8sRUFBRSxLQUFLLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUN4QyxPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0saUJBQWlCLENBQUM7O0FBR3ZDLElBQUksTUFBTSxHQUFHLENBQUMsQ0FBQyxDQUFVLGlEQUFpRDtBQVExRSxNQUFNLE9BQU8sYUFBYTtJQVAxQjtRQVlZLGVBQVUsR0FBRyxJQUFJLFlBQVksRUFBRSxDQUFDO1FBRzFDLFNBQUksR0FBVyxNQUFNLEVBQUUsQ0FBQztRQUN4QixhQUFRLEdBQVEsRUFBRSxDQUFDO0tBYXBCO0lBWEMsV0FBVztRQUNULElBQUksQ0FBQyxRQUFRLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQyxJQUFJLEVBQUUsRUFBRTtZQUNyQyxPQUFPO2dCQUNMLG9CQUFvQixFQUFFLE9BQU8sSUFBSSxDQUFDLE9BQU8sR0FBRztnQkFDNUMsWUFBWSxFQUFFLE9BQU8sSUFBSSxDQUFDLE9BQU8sR0FBRzthQUNyQyxDQUFBO1FBQ0gsQ0FBQyxDQUFDLENBQUE7SUFDSixDQUFDO0lBQ0QsU0FBUyxDQUFDLEdBQVE7UUFDaEIsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLE1BQU0sQ0FBQyxLQUFLLENBQUMsQ0FBQTtJQUN4QyxDQUFDOzhHQXJCVSxhQUFhO2tHQUFiLGFBQWEsaU1DZDFCLGkyQkFnQkEsa3dERE5ZLEtBQUssbUhBQUUsSUFBSTs7MkZBSVYsYUFBYTtrQkFQekIsU0FBUzsrQkFDRSxTQUFTLGNBQ1AsSUFBSSxXQUNQLENBQUMsS0FBSyxFQUFFLElBQUksQ0FBQzs4QkFLYixJQUFJO3NCQUFaLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBRUksVUFBVTtzQkFBbkIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBUYWJJbnRlcmZhY2UgfSBmcm9tICcuLi8uLi9pbnRlcmZhY2VzL3RhYi1pbnRlcmZhY2UnO1xuaW1wb3J0IHsgTmdGb3IgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgTmdJZiB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5cblxubGV0IG5leHRJZCA9IDA7ICAgICAgICAgIC8vIHVzZWQgdG8gZ2l2ZSB1bmlxdWUgaWRzIHRvIGlucHV0cyB1c2VkIGluIGh0bWxcbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3NhLXRhYnMnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbTmdGb3IsIE5nSWZdLFxuICB0ZW1wbGF0ZVVybDogJy4vdGFicy5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsOiAnLi90YWJzLmNvbXBvbmVudC5jc3MnXG59KVxuZXhwb3J0IGNsYXNzIFRhYnNDb21wb25lbnQge1xuICBASW5wdXQoKSB0YWJzOiBUYWJJbnRlcmZhY2VbXTtcbiAgQElucHV0KCkgdHlwZTogc3RyaW5nO1xuICBASW5wdXQoKSBkZWZhdWx0VGFiOiBudW1iZXI7XG5cbiAgQE91dHB1dCgpIHRhYkNoYW5nZWQgPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG5cblxuICB1dWlkOiBudW1iZXIgPSBuZXh0SWQrKztcbiAgc3ZnU3R5bGU6IGFueSA9IFtdO1xuXG4gIG5nT25DaGFuZ2VzKCk6IHZvaWQge1xuICAgIHRoaXMuc3ZnU3R5bGUgPSB0aGlzLnRhYnMubWFwKChpdGVtKSA9PiB7XG4gICAgICByZXR1cm4ge1xuICAgICAgICAnLXdlYmtpdC1tYXNrLWltYWdlJzogYHVybCgke2l0ZW0udGFiSWNvbn0pYCxcbiAgICAgICAgJ21hc2staW1hZ2UnOiBgdXJsKCR7aXRlbS50YWJJY29ufSlgLFxuICAgICAgfVxuICAgIH0pXG4gIH1cbiAgdGFiQ2hhbmdlKGV2dDogYW55KSB7XG4gICAgdGhpcy50YWJDaGFuZ2VkLmVtaXQoZXZ0LnRhcmdldC52YWx1ZSlcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cInRhYi13cmFwcGVyIHt7dHlwZX19XCI+XG4gIDxkaXYgY2xhc3M9XCJ0YWJzXCI+XG4gICAgPGRpdiAqbmdGb3I9XCJsZXQgaXRlbSBvZiB0YWJzLCBsZXQgaSA9IGluZGV4XCIgY2xhc3M9XCJ0YWItaXRlbVwiPlxuICAgICAgPGlucHV0IFtjaGVja2VkXT1cIihkZWZhdWx0VGFiID09IGkpID8gdHJ1ZSA6IGZhbHNlXCIgW3ZhbHVlXT1cImlcIiAoY2hhbmdlKT1cInRhYkNoYW5nZSgkZXZlbnQpXCJcbiAgICAgICAgaWQ9XCJ0YWItY2hlY2ste3tpfX0te3t1dWlkfX1cIiBjbGFzcz1cInRhYi1jaGVja3NcIiB0eXBlPVwicmFkaW9cIiBuYW1lPVwidGFiLWNoZWNrYm94LXt7dXVpZH19XCI+XG4gICAgICA8bGFiZWwgZm9yPVwidGFiLWNoZWNrLXt7aX19LXt7dXVpZH19XCIgY2xhc3M9XCJ0YWItbGFiZWxcIj5cbiAgICAgICAgPGRpdiAqbmdJZj1cIml0ZW0uaWNvblBvc2l0aW9uID09ICdsZWZ0JyB8fCBpdGVtLmljb25Qb3NpdGlvbiA9PSAnYm90aCdcIiBjbGFzcz1cInN2Zy1pY29uXCIgW3N0eWxlXT1cInN2Z1N0eWxlW2ldXCI+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICB7e2l0ZW0udGFiTmFtZX19XG4gICAgICAgIDxkaXYgKm5nSWY9XCJpdGVtLmljb25Qb3NpdGlvbiA9PSAncmlnaHQnIHx8IGl0ZW0uaWNvblBvc2l0aW9uID09ICdib3RoJ1wiIGNsYXNzPVwic3ZnLWljb25cIiBbc3R5bGVdPVwic3ZnU3R5bGVbaV1cIj5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJiYWRnZVwiICpuZ0lmPVwiaXRlbS5iYWRnZUNvbnRlbnRcIj57e2l0ZW0uYmFkZ2VDb250ZW50fX08L2Rpdj5cbiAgICAgIDwvbGFiZWw+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuPC9kaXY+XG4iXX0=