npm - @symphony-talent/component-library - Versions diffs - 4.18.0 → 4.20.0 - Mend

@symphony-talent/component-library 4.18.0 → 4.20.0

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

Files changed (93) hide show

package/esm2020/lib/atoms/button-v2/button.component.mjs CHANGED Viewed

@@ -8,9 +8,9 @@ export class ButtonV2Component extends ButtonComponent {
     }
 }
 ButtonV2Component.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ButtonV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ButtonV2Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ButtonV2Component, selector: "symphony-button-v2", usesInheritance: true, ngImport: i0, template: "<div class=\"v2\">\n  <button\n    class=\"btn sb-sfx-btn\"\n    [ngClass]=\"{\n      'btn-secondary': isSecondary,\n      'btn-primary': !isSecondary,\n      'is-inverse': isInverse\n    }\"\n    (click)=\"onClick()\"\n    [disabled]=\"disabled\"\n  >\n    {{ text }}\n  </button>\n</div>\n", styles: [".v2 button{outline:none}.v2 .btn{padding-left:35px;padding-right:35px;border-radius:30px;height:40px;font-family:neuzeit_groteskbold;letter-spacing:.4px}.v2 .btn.sb-sfx-btn{border-radius:30px!important;font-family:neuzeit_groteskbold!important}.v2 .btn:focus{outline:none}.v2 .btn:disabled{cursor:not-allowed;opacity:70%}.v2 .btn:disabled:hover{opacity:70%}.v2 .btn-primary{background:#2B8FF3!important;color:#fff;border:1px solid #FFF}.v2 .btn-primary:hover{opacity:90%}.v2 .btn-secondary{background:#fff;color:#2b8ff3;border:1px solid #2B8FF3}.v2 .btn-secondary:hover{opacity:90%}\n"], directives: [{ type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+ButtonV2Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ButtonV2Component, selector: "symphony-button-v2", usesInheritance: true, ngImport: i0, template: "<div class=\"v2\">\n  <button\n    class=\"btn sb-sfx-btn\"\n    [ngClass]=\"{\n      'btn-secondary': isSecondary,\n      'btn-primary': !isSecondary,\n      'is-inverse': isInverse\n    }\"\n    (click)=\"onClick()\"\n    [disabled]=\"disabled\"\n  >\n    {{ text }}\n  </button>\n</div>\n", styles: [".v2 button{outline:none}.v2 .btn{padding-left:35px;padding-right:35px;border-radius:30px;height:40px;font-family:runda,sans-serif;letter-spacing:.4px}.v2 .btn.sb-sfx-btn{border-radius:30px!important;font-weight:700!important}.v2 .btn:focus{outline:none}.v2 .btn:disabled{cursor:not-allowed;opacity:70%}.v2 .btn:disabled:hover{opacity:70%}.v2 .btn-primary{background:#2B8FF3!important;color:#fff;border:1px solid #FFF}.v2 .btn-primary:hover{opacity:90%}.v2 .btn-secondary{background:#fff;color:#2b8ff3;border:1px solid #2B8FF3}.v2 .btn-secondary:hover{opacity:90%}\n"], directives: [{ type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ButtonV2Component, decorators: [{
             type: Component,
-            args: [{ selector: 'symphony-button-v2', template: "<div class=\"v2\">\n  <button\n    class=\"btn sb-sfx-btn\"\n    [ngClass]=\"{\n      'btn-secondary': isSecondary,\n      'btn-primary': !isSecondary,\n      'is-inverse': isInverse\n    }\"\n    (click)=\"onClick()\"\n    [disabled]=\"disabled\"\n  >\n    {{ text }}\n  </button>\n</div>\n", styles: [".v2 button{outline:none}.v2 .btn{padding-left:35px;padding-right:35px;border-radius:30px;height:40px;font-family:neuzeit_groteskbold;letter-spacing:.4px}.v2 .btn.sb-sfx-btn{border-radius:30px!important;font-family:neuzeit_groteskbold!important}.v2 .btn:focus{outline:none}.v2 .btn:disabled{cursor:not-allowed;opacity:70%}.v2 .btn:disabled:hover{opacity:70%}.v2 .btn-primary{background:#2B8FF3!important;color:#fff;border:1px solid #FFF}.v2 .btn-primary:hover{opacity:90%}.v2 .btn-secondary{background:#fff;color:#2b8ff3;border:1px solid #2B8FF3}.v2 .btn-secondary:hover{opacity:90%}\n"] }]
+            args: [{ selector: 'symphony-button-v2', template: "<div class=\"v2\">\n  <button\n    class=\"btn sb-sfx-btn\"\n    [ngClass]=\"{\n      'btn-secondary': isSecondary,\n      'btn-primary': !isSecondary,\n      'is-inverse': isInverse\n    }\"\n    (click)=\"onClick()\"\n    [disabled]=\"disabled\"\n  >\n    {{ text }}\n  </button>\n</div>\n", styles: [".v2 button{outline:none}.v2 .btn{padding-left:35px;padding-right:35px;border-radius:30px;height:40px;font-family:runda,sans-serif;letter-spacing:.4px}.v2 .btn.sb-sfx-btn{border-radius:30px!important;font-weight:700!important}.v2 .btn:focus{outline:none}.v2 .btn:disabled{cursor:not-allowed;opacity:70%}.v2 .btn:disabled:hover{opacity:70%}.v2 .btn-primary{background:#2B8FF3!important;color:#fff;border:1px solid #FFF}.v2 .btn-primary:hover{opacity:90%}.v2 .btn-secondary{background:#fff;color:#2b8ff3;border:1px solid #2B8FF3}.v2 .btn-secondary:hover{opacity:90%}\n"] }]
         }], ctorParameters: function () { return []; } });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvbXBvbmVudC1saWJyYXJ5L3NyYy9saWIvYXRvbXMvYnV0dG9uLXYyL2J1dHRvbi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2F0b21zL2J1dHRvbi12Mi9idXR0b24uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBK0IsTUFBTSxlQUFlLENBQUM7QUFDdkUsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLDRCQUE0QixDQUFDOzs7QUFPN0QsTUFBTSxPQUFPLGlCQUFrQixTQUFRLGVBQWU7SUFDcEQ7UUFDRSxLQUFLLEVBQUUsQ0FBQztJQUNWLENBQUM7OzhHQUhVLGlCQUFpQjtrR0FBakIsaUJBQWlCLGlGQ1I5QixxU0FjQTsyRkROYSxpQkFBaUI7a0JBTDdCLFNBQVM7K0JBQ0Usb0JBQW9CIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEJ1dHRvbkNvbXBvbmVudCB9IGZyb20gJy4uL2J1dHRvbi9idXR0b24uY29tcG9uZW50JztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc3ltcGhvbnktYnV0dG9uLXYyJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2J1dHRvbi5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2J1dHRvbi5jb21wb25lbnQuc2NzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBCdXR0b25WMkNvbXBvbmVudCBleHRlbmRzIEJ1dHRvbkNvbXBvbmVudCB7XG4gIGNvbnN0cnVjdG9yKCkge1xuICAgIHN1cGVyKCk7XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJ2MlwiPlxuICA8YnV0dG9uXG4gICAgY2xhc3M9XCJidG4gc2Itc2Z4LWJ0blwiXG4gICAgW25nQ2xhc3NdPVwie1xuICAgICAgJ2J0bi1zZWNvbmRhcnknOiBpc1NlY29uZGFyeSxcbiAgICAgICdidG4tcHJpbWFyeSc6ICFpc1NlY29uZGFyeSxcbiAgICAgICdpcy1pbnZlcnNlJzogaXNJbnZlcnNlXG4gICAgfVwiXG4gICAgKGNsaWNrKT1cIm9uQ2xpY2soKVwiXG4gICAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCJcbiAgPlxuICAgIHt7IHRleHQgfX1cbiAgPC9idXR0b24+XG48L2Rpdj5cbiJdfQ==

package/esm2020/lib/atoms/input-search-checkbox-dropdown/input-search-checkbox-dropdown.component.mjs CHANGED Viewed

@@ -178,7 +178,7 @@ export class InputSearchCheckboxDropdownComponent {
     }
 }
 InputSearchCheckboxDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputSearchCheckboxDropdownComponent, deps: [{ token: i1.CapitalizeFirstCharacterPipe }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-InputSearchCheckboxDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: InputSearchCheckboxDropdownComponent, selector: "symphony-input-search-checkbox-dropdown", inputs: { isDisabled: "isDisabled", multiSelectSearch: "multiSelectSearch", enablePlaceHolder: "enablePlaceHolder", scrollHeightPercentage: "scrollHeightPercentage", isLoadingData: "isLoadingData", isLoadingInitialData: "isLoadingInitialData", isInverse: "isInverse", size: "size" }, outputs: { deselectItem: "deselectItem", selectItem: "selectItem", searchInputChange: "searchInputChange", selectionRetain: "selectionRetain", clearAll: "clearAll", conditionCheck: "conditionCheck", createNewItem: "createNewItem", scrollEnd: "scrollEnd", initializeDropdown: "initializeDropdown" }, viewQueries: [{ propertyName: "pop", first: true, predicate: ["pop"], descendants: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "\n<div [ngClass]=\"{ 'isInverse': isInverse }\">\n  <div\n    *ngIf=\"multiSelectSearch.componentHeading\"\n    class=\"sfx-filter-label sfx-d-inline-block\"\n  >\n    <b\n      >{{ enablePlaceHolder ? \"\" : multiSelectSearch.componentHeading }}\n      <span *ngIf=\"multiSelectSearch.required\" class=\"requiredField\">*</span>\n    </b>\n  </div>\n  <div *ngIf=\"multiSelectSearch.condition\" class=\"sfx-switch-field pull-right\">\n    <input\n      type=\"radio\"\n      id=\"radio-and-{{ conditionSelectionId }}\"\n      name=\"radio-and-{{ conditionSelectionId }}\"\n      value=\"yes\"\n      (click)=\"onConditionClick(' AND ')\"\n      [checked]=\"multiSelectSearch.condition === ' AND '\"\n    />\n    <label class=\"Font400\" for=\"radio-and-{{ conditionSelectionId }}\"\n      >and</label\n    >\n    <input\n      type=\"radio\"\n      id=\"radio-or-{{ conditionSelectionId }}\"\n      name=\"radio-or-{{ conditionSelectionId }}\"\n      value=\"yes\"\n      (click)=\"onConditionClick(' OR ')\"\n      [checked]=\"multiSelectSearch.condition === ' OR '\"\n    />\n    <label class=\"Font400\" for=\"radio-or-{{ conditionSelectionId }}\">or</label>\n  </div>\n  <div\n    class=\"sfx-custom-dropdown-wrap\"\n    [ngClass]=\"{ open: openDropdown }\"\n    dropdown\n    #dropdown=\"bs-dropdown\"\n    (onShown)=\"toggleDropdown()\"\n    [insideClick]=\"true\"\n    (onHidden)=\"onOkClick(true)\"\n  >\n    <input\n      [ngClass]=\"{ 'invalid-control': isInvalid }\"\n      (click)=\"dropdown.isOpen = true\"\n      type=\"text\"\n      id=\"dropdown-search-{{ multiSelectSearch.componentHeading | trimId}}\"\n      [(ngModel)]=\"multiSelectSearch.searchInput\"\n      (ngModelChange)=\"onSearchInputChange()\"\n      dropdownToggle\n      popover=\"{{ popOverText() }}\"\n      containerClass=\"sfx-input-popover\"\n      triggers=\"\"\n      placement=\"top\"\n      #pop=\"bs-popover\"\n      (mouseenter)=\"showPop()\"\n      (mouseleave)=\"onPopMouseLeave()\"\n      (focus)=\"onFocusClick(true)\"\n      (blur)=\"onFocusClick(false)\"\n      class=\"sfx-placeholder\"\n      placeholder=\"{{\n        enablePlaceHolder ? multiSelectSearch.componentHeading : ''\n      }}\"\n      autocomplete=\"off\"\n      [disabled]=\"isDisabled\"\n    />\n    <symphony-icon [size]=\"size\" [icon]=\"'si-search-new'\"></symphony-icon>\n    <div *dropdownMenu>\n      <div class=\"sfx-custom-dropdown\" *ngIf=\"openDropdown\">\n        <div *ngIf=\"multiSelectSearch.isSelectAllEnabled\" class=\"sfx-select-all-toggle\">\n          <span class=\"sfx-font-bold sfx-mr-10\">Select All</span>\n          <symphony-input-toggle\n          [isToggled]=\"isAllToggled\"\n          [isInverse]=\"false\"\n          (toggleClick)=\"onToggleClick($event)\"\n          ></symphony-input-toggle>\n        </div>\n        <!-- Create And Add Tags -->\n        <div\n          class=\"sfx-create-new-items\"\n          *ngIf=\"\n            multiSelectSearch.labelCreateNewItems &&\n            multiSelectSearch.showCreateNewItems\n          \"\n          (click)=\"onCreateNewItem()\"\n          [ngClass]=\"{\n            'sfx-font-bold': multiSelectSearch.showCreateNewModal\n          }\"\n        >\n          {{ multiSelectSearch.labelCreateNewItems }}\n          <span\n            class=\"sfx-font-bold\"\n            *ngIf=\"!multiSelectSearch.showCreateNewModal\"\n            >&nbsp;&apos;\n            {{ multiSelectSearch.searchInput | capitalizeFirstCharacter }}&apos;\n          </span>\n          <i class=\"sfx-icon-Plus sfx-create-new-items-icon\"></i>\n        </div>\n        <!-- Create And Add Tags ends here -->\n        <!-- selected list div -->\n        <div\n          class=\"sfx-dropdown-selected sfx-custom-scroll\"\n          *ngIf=\"multiSelectSearch.selectedDropdownList.length > 0 && !multiSelectSearch.isSelectAllEnabled\"\n        >\n          <div\n            class=\"sfx-d-inline-block\"\n            *ngFor=\"let selectedItem of multiSelectSearch.selectedDropdownList\"\n          >\n            <div\n              (click)=\"onDeselectItem(selectedItem); $event.stopPropagation()\"\n              class=\"sfx-checkbox sfx-d-inline-block\"\n            >\n              <input\n                type=\"checkbox\"\n                checked\n                class=\"sfx-checkbox-input\"\n                id=\"{{ selectedItem.id }}_{{ selectedItem.name }}\"\n              />\n              <label\n                class=\"Font400\"\n                for=\"{{ selectedItem.id }}_{{ selectedItem.name }}\"\n                >{{ selectedItem.name | capitalizeFirstCharacter }}\n                <br />\n                <span\n                  *ngIf=\"selectedItem.additionalInfo\"\n                  class=\"selected-additional-info\"\n                >\n                  {{ selectedItem.additionalInfo }}</span\n                >\n              </label>\n            </div>\n            <div></div>\n          </div>\n        </div>\n        <!-- selected list div ends here -->\n        <!-- Search list  -->\n        <div\n          class=\"sfx-dropdown-unselected sfx-custom-scroll\"\n          (scroll)=\"scrollHandler($event)\"\n          *ngIf=\"multiSelectSearch.searchedDropdownList.length > 0\"\n        >\n          <div\n            id=\"dropdown-triggers-manually\"\n            *ngFor=\"\n              let filterDropdownOption of multiSelectSearch.searchedDropdownList\n            \"\n          >\n            <div class=\"sfx-checkbox\">\n              <input\n                type=\"checkbox\"\n                id=\"{{ filterDropdownOption.id }}_{{\n                  filterDropdownOption.name | trimId\n                }}\"\n                class=\"sfx-checkbox-input\"\n                [disabled]=\"multiSelectSearch.hasMaxSelections\"\n                (click)=\"\n                onSelectItem(filterDropdownOption); $event.stopPropagation()\n                \"\n                [(ngModel)]=\"filterDropdownOption.isChecked\"\n              />\n              <label\n                class=\"Font400\"\n                for=\"{{ filterDropdownOption.id }}_{{\n                  filterDropdownOption.name | trimId\n                }}\"\n                >{{ filterDropdownOption.name | capitalizeFirstCharacter }}\n                <br />\n                <span\n                  *ngIf=\"filterDropdownOption.additionalInfo\"\n                  class=\"additional-info\"\n                >\n                  {{ filterDropdownOption.additionalInfo }}</span\n                >\n              </label>\n            </div>\n            <div></div>\n          </div>\n          <div>\n            <symphony-sfx-loader\n              [hidden]=\"!isLoadingData\"\n            ></symphony-sfx-loader>\n          </div>\n        </div>\n        <symphony-sfx-loader\n          [hidden]=\"!isLoadingInitialData\"\n        ></symphony-sfx-loader>\n        <!-- search list ends here -->\n        <!-- Footer -->\n        <div *ngIf=\"openDropdown\" class=\"sfx-filter-item-footer\">\n          <button\n            type=\"button\"\n            class=\"pull-left\"\n            [disabled]=\"\n              !(\n                multiSelectSearch.selectedDropdownList &&\n                multiSelectSearch.selectedDropdownList.length > 0\n              )\n            \"\n            (click)=\"onClearAllClick()\"\n          >\n            Clear All\n          </button>\n          <a href=\"javascript:;\" (click)=\"onOkClick()\" class=\"pull-right\">OK</a>\n        </div>\n        <!-- End Footer -->\n      </div>\n    </div>\n  </div>\n  <div *ngIf=\"isInvalid\" class=\"error-message\">\n    Please select a valid option\n  </div>\n</div>", styles: [".sfx-input-popover{word-wrap:break-word;max-width:100%}.sfx-placeholder:-ms-input-placeholder{color:#000}.sfx-placeholder::-moz-placeholder{color:#000}.sfx-placeholder::placeholder{color:#000}.requiredField{color:#000}.error-message{color:#ac4463}.invalid-control{border:1px solid #AC4463!important}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox .sfx-checkbox-input~label{color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox .sfx-checkbox-input:not(:checked)~label:after{border:2px solid #000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox .sfx-checkbox-input:checked~label:before{border-bottom:2px solid #000;border-right:2px solid #000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox .sfx-checkbox-input:checked~label:after{background-color:#fff;border:2px solid #000}.sfx-custom-dropdown-wrap{position:relative;padding:.3rem;width:100%}.sfx-custom-dropdown-wrap input{width:100%;border:1px solid #d0d0d0;height:40px;border-radius:4px;background:#fff;color:#000;outline:none;padding-left:.9375rem;padding-right:1.875rem;line-height:25px}.sfx-custom-dropdown-wrap symphony-icon{right:17px;bottom:13px;position:absolute;color:#000;z-index:2}.sfx-custom-dropdown-wrap .sfx-custom-dropdown{background:#fff;position:absolute;width:100%;z-index:4;left:0;border-width:0px 1px 1px 1px;border-style:solid;border-color:#d9d9d9}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox{margin:0;padding:.625rem 1.25rem}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox:hover{background:#E4E7EF;color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected{border-bottom:1px solid #d9d9d9;padding-bottom:.625rem;padding-top:.625rem;max-height:220px;overflow-y:auto}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover{background:#fff;color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input:not(:checked),.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input:checked{position:absolute}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input~label{color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input:not(:checked)~label:after{border-color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input:checked~label:before{border-bottom-color:#000;border-right-color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input:checked~label:after{background-color:#fff;border-color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-unselected{padding-bottom:.625rem;padding-top:.625rem;border-bottom:1px solid #d9d9d9;max-height:220px;overflow-y:auto}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-select-all-toggle{padding:15px 20px;border-bottom:1px solid #d9d9d9}.sfx-custom-dropdown-wrap.open{background:#fff}.sfx-custom-dropdown-wrap.open .tree-node-checkbox{height:auto;width:auto}.sfx-custom-dropdown-wrap.open .sfx-create-new-items{padding:.625rem 1.5625rem .625rem 1.25rem;position:relative;border-bottom:1px solid #d0d0d0;cursor:pointer}.sfx-custom-dropdown-wrap.open .sfx-create-new-items .sfx-create-new-items-icon{font-size:.625rem;position:absolute;right:.9375rem;top:.9375rem}.sfx-custom-dropdown-wrap.open input{z-index:2;position:relative;background:#ffffff;color:#000}.sfx-custom-dropdown-wrap.open symphony-icon{color:#000}.sfx-custom-dropdown-wrap.open:after{content:\" \";position:absolute;top:0;left:0;display:inline-block;width:100%;height:100%;z-index:1;border-width:1px 1px 0px 1px;border-style:solid;border-color:#d9d9d9}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected::-webkit-scrollbar,.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-unselected::-webkit-scrollbar{width:12px}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected::-webkit-scrollbar-track,.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-unselected::-webkit-scrollbar-track{box-shadow:inset 0 0 3px transparent;border-radius:30px}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected::-webkit-scrollbar-thumb,.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-unselected::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:30px}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected::-webkit-scrollbar-thumb:hover,.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-unselected::-webkit-scrollbar-thumb:hover{cursor:pointer}.sfx-filter-item-footer{display:inline-block;width:100%;padding:1.875rem 1.25rem 1.5625rem;font-family:runda,sans-serif;font-weight:500}.sfx-filter-item-footer a{cursor:pointer}.sfx-filter-item-footer button{color:#712ace;background:transparent;border:none;padding:0}.sfx-filter-item-footer button:disabled{opacity:.5;cursor:not-allowed}.sfx-checkbox .sfx-checkbox-input~label{color:#fff}.sfx-checkbox .sfx-checkbox-input:not(:checked)~label:after{border:2px solid #fff}.sfx-checkbox .sfx-checkbox-input:checked~label:before{border-bottom:2px solid #fff;border-right:2px solid #fff}.sfx-checkbox .sfx-checkbox-input:checked~label:after{background-color:#212121;border:2px solid #fff}.sfx-checkbox{margin:10px 0;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.sfx-checkbox .sfx-checkbox-input:not(:checked),.sfx-checkbox .sfx-checkbox-input:checked{opacity:0;position:absolute;margin:0;z-index:-1;width:0;height:0;overflow:hidden;left:0;pointer-events:none}.sfx-checkbox .sfx-checkbox-input~label{display:inline-block;position:relative;cursor:pointer;height:100%;line-height:20px;font-size:14px;color:#000;padding-left:36px;font-family:runda,sans-serif;font-weight:400;margin:0;word-break:break-word}.sfx-checkbox .sfx-checkbox-input~label.sfx-font-reg{font-family:runda,sans-serif}.sfx-checkbox .sfx-checkbox-input~label:before{transform:translateZ(0);transition:all 0s ease-in;position:absolute;content:\"\";left:0;border-radius:2px}.sfx-checkbox .sfx-checkbox-input~label:after{position:absolute;content:\"\";left:0;border-radius:2px;top:0}.sfx-checkbox .sfx-checkbox-input~label .additional-info,.sfx-checkbox .sfx-checkbox-input~label .selected-additional-info{font-size:12px;color:#565656}.sfx-checkbox .sfx-checkbox-input:not(:checked)~label:before{width:9px;height:15px;border:none;top:1px;left:0;transform:rotate(37deg) scale(.1);transform-origin:100% 100%}.sfx-checkbox .sfx-checkbox-input:not(:checked)~label:after{width:20px;height:20px;border:2px solid #000;z-index:0;border-radius:4px}.sfx-checkbox .sfx-checkbox-input:checked~label:before{top:3px;left:3px;width:6px;height:12px;border-top:0px solid transparent;border-left:0px solid transparent;border-bottom:2px solid #000;border-right:2px solid #000;z-index:1;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:rotate(37deg) scale(1);transform-origin:100% 100%;border-radius:0}.sfx-checkbox .sfx-checkbox-input:checked~label:after{width:20px;height:20px;background-color:#fff;border:2px solid #000;border-radius:4px}.sfx-checkbox .sfx-checkbox-input:disabled~label{opacity:.3;pointer-events:none}.sfx-checkbox:hover .sfx-checkbox-input~label .additional-info{color:#fff}.sfx-filter-label{font-family:runda,sans-serif;font-weight:500;margin-bottom:.3rem;padding-left:.3rem;line-height:25px}.isInverse .sfx-custom-dropdown-wrap input{border-color:#5b6d80}\n"], components: [{ type: i2.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i3.InputToggleComponent, selector: "symphony-input-toggle", inputs: ["isToggled", "isInverse"], outputs: ["toggleClick"] }, { type: i4.SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: ["leftStyle", "message"] }], directives: [{ type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.BsDropdownDirective, selector: "[bsDropdown],[dropdown]", inputs: ["autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen", "placement", "triggers", "container", "dropup"], outputs: ["onShown", "onHidden", "isOpenChange"], exportAs: ["bs-dropdown"] }, { type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i8.PopoverDirective, selector: "[popover]", inputs: ["outsideClick", "containerClass", "isOpen", "adaptivePosition", "popover", "popoverContext", "popoverTitle", "placement", "triggers", "container", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { type: i6.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }], pipes: { "trimId": i9.TrimIdPipe, "capitalizeFirstCharacter": i1.CapitalizeFirstCharacterPipe } });
+InputSearchCheckboxDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: InputSearchCheckboxDropdownComponent, selector: "symphony-input-search-checkbox-dropdown", inputs: { isDisabled: "isDisabled", multiSelectSearch: "multiSelectSearch", enablePlaceHolder: "enablePlaceHolder", scrollHeightPercentage: "scrollHeightPercentage", isLoadingData: "isLoadingData", isLoadingInitialData: "isLoadingInitialData", isInverse: "isInverse", size: "size" }, outputs: { deselectItem: "deselectItem", selectItem: "selectItem", searchInputChange: "searchInputChange", selectionRetain: "selectionRetain", clearAll: "clearAll", conditionCheck: "conditionCheck", createNewItem: "createNewItem", scrollEnd: "scrollEnd", initializeDropdown: "initializeDropdown" }, viewQueries: [{ propertyName: "pop", first: true, predicate: ["pop"], descendants: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "\n<div [ngClass]=\"{ 'isInverse': isInverse }\">\n  <div\n    *ngIf=\"multiSelectSearch.componentHeading\"\n    class=\"sfx-filter-label sfx-d-inline-block\"\n  >\n    <b\n      >{{ enablePlaceHolder ? \"\" : multiSelectSearch.componentHeading }}\n      <span *ngIf=\"multiSelectSearch.required\" class=\"requiredField\">*</span>\n    </b>\n  </div>\n  <div *ngIf=\"multiSelectSearch.condition\" class=\"sfx-switch-field pull-right\">\n    <input\n      type=\"radio\"\n      id=\"radio-and-{{ conditionSelectionId }}\"\n      name=\"radio-and-{{ conditionSelectionId }}\"\n      value=\"yes\"\n      (click)=\"onConditionClick(' AND ')\"\n      [checked]=\"multiSelectSearch.condition === ' AND '\"\n    />\n    <label class=\"Font400\" for=\"radio-and-{{ conditionSelectionId }}\"\n      >and</label\n    >\n    <input\n      type=\"radio\"\n      id=\"radio-or-{{ conditionSelectionId }}\"\n      name=\"radio-or-{{ conditionSelectionId }}\"\n      value=\"yes\"\n      (click)=\"onConditionClick(' OR ')\"\n      [checked]=\"multiSelectSearch.condition === ' OR '\"\n    />\n    <label class=\"Font400\" for=\"radio-or-{{ conditionSelectionId }}\">or</label>\n  </div>\n  <div\n    class=\"sfx-custom-dropdown-wrap\"\n    [ngClass]=\"{ open: openDropdown }\"\n    dropdown\n    #dropdown=\"bs-dropdown\"\n    (onShown)=\"toggleDropdown()\"\n    [insideClick]=\"true\"\n    (onHidden)=\"onOkClick(true)\"\n  >\n    <input\n      [ngClass]=\"{ 'invalid-control': isInvalid }\"\n      (click)=\"dropdown.isOpen = true\"\n      type=\"text\"\n      id=\"dropdown-search-{{ multiSelectSearch.componentHeading | trimId}}\"\n      [(ngModel)]=\"multiSelectSearch.searchInput\"\n      (ngModelChange)=\"onSearchInputChange()\"\n      dropdownToggle\n      popover=\"{{ popOverText() }}\"\n      containerClass=\"sfx-input-popover\"\n      triggers=\"\"\n      placement=\"top\"\n      #pop=\"bs-popover\"\n      (mouseenter)=\"showPop()\"\n      (mouseleave)=\"onPopMouseLeave()\"\n      (focus)=\"onFocusClick(true)\"\n      (blur)=\"onFocusClick(false)\"\n      class=\"sfx-placeholder\"\n      placeholder=\"{{\n        enablePlaceHolder ? multiSelectSearch.componentHeading : ''\n      }}\"\n      autocomplete=\"off\"\n      [disabled]=\"isDisabled\"\n    />\n    <symphony-icon [size]=\"size\" [icon]=\"'si-search-new'\"></symphony-icon>\n    <div *dropdownMenu>\n      <div class=\"sfx-custom-dropdown\" *ngIf=\"openDropdown\">\n        <div *ngIf=\"multiSelectSearch.isSelectAllEnabled\" class=\"sfx-select-all-toggle\">\n          <span class=\"sfx-font-bold sfx-mr-10\">Select All</span>\n          <symphony-input-toggle\n          [isToggled]=\"isAllToggled\"\n          [isInverse]=\"false\"\n          (toggleClick)=\"onToggleClick($event)\"\n          ></symphony-input-toggle>\n        </div>\n        <!-- Create And Add Tags -->\n        <div\n          class=\"sfx-create-new-items\"\n          *ngIf=\"\n            multiSelectSearch.labelCreateNewItems &&\n            multiSelectSearch.showCreateNewItems\n          \"\n          (click)=\"onCreateNewItem()\"\n          [ngClass]=\"{\n            'sfx-font-bold': multiSelectSearch.showCreateNewModal\n          }\"\n        >\n          {{ multiSelectSearch.labelCreateNewItems }}\n          <span\n            class=\"sfx-font-bold\"\n            *ngIf=\"!multiSelectSearch.showCreateNewModal\"\n            >&nbsp;&apos;\n            {{ multiSelectSearch.searchInput | capitalizeFirstCharacter }}&apos;\n          </span>\n          <i class=\"sfx-icon-Plus sfx-create-new-items-icon\"></i>\n        </div>\n        <!-- Create And Add Tags ends here -->\n        <!-- selected list div -->\n        <div\n          class=\"sfx-dropdown-selected sfx-custom-scroll\"\n          *ngIf=\"multiSelectSearch.selectedDropdownList.length > 0 && !multiSelectSearch.isSelectAllEnabled\"\n        >\n          <div\n            class=\"sfx-d-inline-block\"\n            *ngFor=\"let selectedItem of multiSelectSearch.selectedDropdownList\"\n          >\n            <div\n              (click)=\"onDeselectItem(selectedItem); $event.stopPropagation()\"\n              class=\"sfx-checkbox sfx-d-inline-block\"\n            >\n              <input\n                type=\"checkbox\"\n                checked\n                class=\"sfx-checkbox-input\"\n                id=\"{{ selectedItem.id }}_{{ selectedItem.name }}\"\n              />\n              <label\n                class=\"Font400\"\n                for=\"{{ selectedItem.id }}_{{ selectedItem.name }}\"\n                >{{ selectedItem.name | capitalizeFirstCharacter }}\n                <br />\n                <span\n                  *ngIf=\"selectedItem.additionalInfo\"\n                  class=\"selected-additional-info\"\n                >\n                  {{ selectedItem.additionalInfo }}</span\n                >\n              </label>\n            </div>\n            <div></div>\n          </div>\n        </div>\n        <!-- selected list div ends here -->\n        <!-- Search list  -->\n        <div\n          class=\"sfx-dropdown-unselected sfx-custom-scroll\"\n          (scroll)=\"scrollHandler($event)\"\n          *ngIf=\"multiSelectSearch.searchedDropdownList.length > 0\"\n        >\n          <div\n            id=\"dropdown-triggers-manually\"\n            *ngFor=\"\n              let filterDropdownOption of multiSelectSearch.searchedDropdownList\n            \"\n          >\n            <div class=\"sfx-checkbox\">\n              <input\n                type=\"checkbox\"\n                id=\"{{ filterDropdownOption.id }}_{{\n                  filterDropdownOption.name | trimId\n                }}\"\n                class=\"sfx-checkbox-input\"\n                [disabled]=\"multiSelectSearch.hasMaxSelections\"\n                (click)=\"\n                onSelectItem(filterDropdownOption); $event.stopPropagation()\n                \"\n                [(ngModel)]=\"filterDropdownOption.isChecked\"\n              />\n              <label\n                class=\"Font400\"\n                for=\"{{ filterDropdownOption.id }}_{{\n                  filterDropdownOption.name | trimId\n                }}\"\n                >{{ filterDropdownOption.name | capitalizeFirstCharacter }}\n                <br />\n                <span\n                  *ngIf=\"filterDropdownOption.additionalInfo\"\n                  class=\"additional-info\"\n                >\n                  {{ filterDropdownOption.additionalInfo }}</span\n                >\n              </label>\n            </div>\n            <div></div>\n          </div>\n          <div>\n            <symphony-sfx-loader\n              [hidden]=\"!isLoadingData\"\n            ></symphony-sfx-loader>\n          </div>\n        </div>\n        <symphony-sfx-loader\n          [hidden]=\"!isLoadingInitialData\"\n        ></symphony-sfx-loader>\n        <!-- search list ends here -->\n        <!-- Footer -->\n        <div *ngIf=\"openDropdown\" class=\"sfx-filter-item-footer\">\n          <button\n            type=\"button\"\n            class=\"pull-left\"\n            [disabled]=\"\n              !(\n                multiSelectSearch.selectedDropdownList &&\n                multiSelectSearch.selectedDropdownList.length > 0\n              )\n            \"\n            (click)=\"onClearAllClick()\"\n          >\n            Clear All\n          </button>\n          <a href=\"javascript:;\" (click)=\"onOkClick()\" class=\"pull-right\">OK</a>\n        </div>\n        <!-- End Footer -->\n      </div>\n    </div>\n  </div>\n  <div *ngIf=\"isInvalid\" class=\"error-message\">\n    Please select a valid option\n  </div>\n</div>", styles: [".sfx-input-popover{word-wrap:break-word;max-width:100%}.sfx-placeholder:-ms-input-placeholder{color:#000}.sfx-placeholder::-moz-placeholder{color:#000}.sfx-placeholder::placeholder{color:#000}.requiredField{color:#000}.error-message{color:#ac4463}.invalid-control{border:1px solid #AC4463!important}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox .sfx-checkbox-input~label{color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox .sfx-checkbox-input:not(:checked)~label:after{border:2px solid #000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox .sfx-checkbox-input:checked~label:before{border-bottom:2px solid #000;border-right:2px solid #000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox .sfx-checkbox-input:checked~label:after{background-color:#fff;border:2px solid #000}.sfx-custom-dropdown-wrap{position:relative;padding:.3rem;width:100%}.sfx-custom-dropdown-wrap input{width:100%;border:1px solid #d0d0d0;height:40px;border-radius:4px;background:#fff;color:#000;outline:none;padding-left:.9375rem;padding-right:1.875rem;line-height:25px}.sfx-custom-dropdown-wrap symphony-icon{right:17px;bottom:13px;position:absolute;color:#000;z-index:2}.sfx-custom-dropdown-wrap .sfx-custom-dropdown{background:#fff;position:absolute;width:100%;z-index:4;left:0;border-width:0px 1px 1px 1px;border-style:solid;border-color:#d9d9d9}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox{margin:0;padding:.625rem 1.25rem}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox:hover{background:#E4E7EF;color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected{border-bottom:1px solid #d9d9d9;padding-bottom:.625rem;padding-top:.625rem;max-height:220px;overflow-y:auto}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover{background:#fff;color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input:not(:checked),.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input:checked{position:absolute}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input~label{color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input:not(:checked)~label:after{border-color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input:checked~label:before{border-bottom-color:#000;border-right-color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input:checked~label:after{background-color:#fff;border-color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-unselected{padding-bottom:.625rem;padding-top:.625rem;border-bottom:1px solid #d9d9d9;max-height:220px;overflow-y:auto}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-select-all-toggle{padding:15px 20px;border-bottom:1px solid #d9d9d9}.sfx-custom-dropdown-wrap.open{background:#fff}.sfx-custom-dropdown-wrap.open .tree-node-checkbox{height:auto;width:auto}.sfx-custom-dropdown-wrap.open .sfx-create-new-items{padding:.625rem 1.5625rem .625rem 1.25rem;position:relative;border-bottom:1px solid #d0d0d0;cursor:pointer}.sfx-custom-dropdown-wrap.open .sfx-create-new-items .sfx-create-new-items-icon{font-size:.625rem;position:absolute;right:.9375rem;top:.9375rem}.sfx-custom-dropdown-wrap.open input{z-index:2;position:relative;background:#ffffff;color:#000}.sfx-custom-dropdown-wrap.open symphony-icon{color:#000}.sfx-custom-dropdown-wrap.open:after{content:\" \";position:absolute;top:0;left:0;display:inline-block;width:100%;height:100%;z-index:1;border-width:1px 1px 0px 1px;border-style:solid;border-color:#d9d9d9}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected::-webkit-scrollbar,.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-unselected::-webkit-scrollbar{width:12px}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected::-webkit-scrollbar-track,.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-unselected::-webkit-scrollbar-track{box-shadow:inset 0 0 3px transparent;border-radius:30px}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected::-webkit-scrollbar-thumb,.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-unselected::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:30px}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected::-webkit-scrollbar-thumb:hover,.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-unselected::-webkit-scrollbar-thumb:hover{cursor:pointer}.sfx-filter-item-footer{display:inline-block;width:100%;padding:1.875rem 1.25rem 1.5625rem;font-family:runda,sans-serif;font-weight:500}.sfx-filter-item-footer a{cursor:pointer}.sfx-filter-item-footer button{color:#712ace;background:transparent;border:none;padding:0}.sfx-filter-item-footer button:disabled{opacity:.5;cursor:not-allowed}.sfx-checkbox .sfx-checkbox-input~label{color:#fff}.sfx-checkbox .sfx-checkbox-input:not(:checked)~label:after{border:2px solid #fff}.sfx-checkbox .sfx-checkbox-input:checked~label:before{border-bottom:2px solid #fff;border-right:2px solid #fff}.sfx-checkbox .sfx-checkbox-input:checked~label:after{background-color:#212121;border:2px solid #fff}.sfx-checkbox{margin:10px 0;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.sfx-checkbox .sfx-checkbox-input:not(:checked),.sfx-checkbox .sfx-checkbox-input:checked{opacity:0;position:absolute;margin:0;z-index:-1;width:0;height:0;overflow:hidden;left:0;pointer-events:none}.sfx-checkbox .sfx-checkbox-input~label{display:inline-block;position:relative;cursor:pointer;height:100%;line-height:20px;font-size:14px;color:#000;padding-left:36px;font-family:runda,sans-serif;font-weight:400;margin:0;word-break:break-word}.sfx-checkbox .sfx-checkbox-input~label.sfx-font-reg{font-family:runda,sans-serif}.sfx-checkbox .sfx-checkbox-input~label:before{transform:translateZ(0);transition:all 0s ease-in;position:absolute;content:\"\";left:0;border-radius:2px}.sfx-checkbox .sfx-checkbox-input~label:after{position:absolute;content:\"\";left:0;border-radius:2px;top:0}.sfx-checkbox .sfx-checkbox-input~label .additional-info,.sfx-checkbox .sfx-checkbox-input~label .selected-additional-info{font-size:12px;color:#565656}.sfx-checkbox .sfx-checkbox-input:not(:checked)~label:before{width:9px;height:15px;border:none;top:1px;left:0;transform:rotate(37deg) scale(.1);transform-origin:100% 100%}.sfx-checkbox .sfx-checkbox-input:not(:checked)~label:after{width:20px;height:20px;border:2px solid #000;z-index:0;border-radius:4px}.sfx-checkbox .sfx-checkbox-input:checked~label:before{top:3px;left:3px;width:6px;height:12px;border-top:0px solid transparent;border-left:0px solid transparent;border-bottom:2px solid #000;border-right:2px solid #000;z-index:1;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:rotate(37deg) scale(1);transform-origin:100% 100%;border-radius:0}.sfx-checkbox .sfx-checkbox-input:checked~label:after{width:20px;height:20px;background-color:#fff;border:2px solid #000;border-radius:4px}.sfx-checkbox .sfx-checkbox-input:disabled~label{opacity:.3;pointer-events:none}.sfx-checkbox:hover .sfx-checkbox-input~label .additional-info{color:#fff}.sfx-filter-label{font-family:runda,sans-serif;font-weight:500;margin-bottom:.3rem;padding-left:.3rem;line-height:25px}.isInverse .sfx-custom-dropdown-wrap input{border-color:#5b6d80}\n"], components: [{ type: i2.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i3.InputToggleComponent, selector: "symphony-input-toggle", inputs: ["isToggled", "isInverse"], outputs: ["toggleClick"] }, { type: i4.SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: ["leftStyle", "message", "hasCustomMessage"] }], directives: [{ type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.BsDropdownDirective, selector: "[bsDropdown],[dropdown]", inputs: ["autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen", "placement", "triggers", "container", "dropup"], outputs: ["onShown", "onHidden", "isOpenChange"], exportAs: ["bs-dropdown"] }, { type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i8.PopoverDirective, selector: "[popover]", inputs: ["outsideClick", "containerClass", "isOpen", "adaptivePosition", "popover", "popoverContext", "popoverTitle", "placement", "triggers", "container", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { type: i6.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }], pipes: { "trimId": i9.TrimIdPipe, "capitalizeFirstCharacter": i1.CapitalizeFirstCharacterPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputSearchCheckboxDropdownComponent, decorators: [{
             type: Component,
             args: [{ selector: 'symphony-input-search-checkbox-dropdown', template: "\n<div [ngClass]=\"{ 'isInverse': isInverse }\">\n  <div\n    *ngIf=\"multiSelectSearch.componentHeading\"\n    class=\"sfx-filter-label sfx-d-inline-block\"\n  >\n    <b\n      >{{ enablePlaceHolder ? \"\" : multiSelectSearch.componentHeading }}\n      <span *ngIf=\"multiSelectSearch.required\" class=\"requiredField\">*</span>\n    </b>\n  </div>\n  <div *ngIf=\"multiSelectSearch.condition\" class=\"sfx-switch-field pull-right\">\n    <input\n      type=\"radio\"\n      id=\"radio-and-{{ conditionSelectionId }}\"\n      name=\"radio-and-{{ conditionSelectionId }}\"\n      value=\"yes\"\n      (click)=\"onConditionClick(' AND ')\"\n      [checked]=\"multiSelectSearch.condition === ' AND '\"\n    />\n    <label class=\"Font400\" for=\"radio-and-{{ conditionSelectionId }}\"\n      >and</label\n    >\n    <input\n      type=\"radio\"\n      id=\"radio-or-{{ conditionSelectionId }}\"\n      name=\"radio-or-{{ conditionSelectionId }}\"\n      value=\"yes\"\n      (click)=\"onConditionClick(' OR ')\"\n      [checked]=\"multiSelectSearch.condition === ' OR '\"\n    />\n    <label class=\"Font400\" for=\"radio-or-{{ conditionSelectionId }}\">or</label>\n  </div>\n  <div\n    class=\"sfx-custom-dropdown-wrap\"\n    [ngClass]=\"{ open: openDropdown }\"\n    dropdown\n    #dropdown=\"bs-dropdown\"\n    (onShown)=\"toggleDropdown()\"\n    [insideClick]=\"true\"\n    (onHidden)=\"onOkClick(true)\"\n  >\n    <input\n      [ngClass]=\"{ 'invalid-control': isInvalid }\"\n      (click)=\"dropdown.isOpen = true\"\n      type=\"text\"\n      id=\"dropdown-search-{{ multiSelectSearch.componentHeading | trimId}}\"\n      [(ngModel)]=\"multiSelectSearch.searchInput\"\n      (ngModelChange)=\"onSearchInputChange()\"\n      dropdownToggle\n      popover=\"{{ popOverText() }}\"\n      containerClass=\"sfx-input-popover\"\n      triggers=\"\"\n      placement=\"top\"\n      #pop=\"bs-popover\"\n      (mouseenter)=\"showPop()\"\n      (mouseleave)=\"onPopMouseLeave()\"\n      (focus)=\"onFocusClick(true)\"\n      (blur)=\"onFocusClick(false)\"\n      class=\"sfx-placeholder\"\n      placeholder=\"{{\n        enablePlaceHolder ? multiSelectSearch.componentHeading : ''\n      }}\"\n      autocomplete=\"off\"\n      [disabled]=\"isDisabled\"\n    />\n    <symphony-icon [size]=\"size\" [icon]=\"'si-search-new'\"></symphony-icon>\n    <div *dropdownMenu>\n      <div class=\"sfx-custom-dropdown\" *ngIf=\"openDropdown\">\n        <div *ngIf=\"multiSelectSearch.isSelectAllEnabled\" class=\"sfx-select-all-toggle\">\n          <span class=\"sfx-font-bold sfx-mr-10\">Select All</span>\n          <symphony-input-toggle\n          [isToggled]=\"isAllToggled\"\n          [isInverse]=\"false\"\n          (toggleClick)=\"onToggleClick($event)\"\n          ></symphony-input-toggle>\n        </div>\n        <!-- Create And Add Tags -->\n        <div\n          class=\"sfx-create-new-items\"\n          *ngIf=\"\n            multiSelectSearch.labelCreateNewItems &&\n            multiSelectSearch.showCreateNewItems\n          \"\n          (click)=\"onCreateNewItem()\"\n          [ngClass]=\"{\n            'sfx-font-bold': multiSelectSearch.showCreateNewModal\n          }\"\n        >\n          {{ multiSelectSearch.labelCreateNewItems }}\n          <span\n            class=\"sfx-font-bold\"\n            *ngIf=\"!multiSelectSearch.showCreateNewModal\"\n            >&nbsp;&apos;\n            {{ multiSelectSearch.searchInput | capitalizeFirstCharacter }}&apos;\n          </span>\n          <i class=\"sfx-icon-Plus sfx-create-new-items-icon\"></i>\n        </div>\n        <!-- Create And Add Tags ends here -->\n        <!-- selected list div -->\n        <div\n          class=\"sfx-dropdown-selected sfx-custom-scroll\"\n          *ngIf=\"multiSelectSearch.selectedDropdownList.length > 0 && !multiSelectSearch.isSelectAllEnabled\"\n        >\n          <div\n            class=\"sfx-d-inline-block\"\n            *ngFor=\"let selectedItem of multiSelectSearch.selectedDropdownList\"\n          >\n            <div\n              (click)=\"onDeselectItem(selectedItem); $event.stopPropagation()\"\n              class=\"sfx-checkbox sfx-d-inline-block\"\n            >\n              <input\n                type=\"checkbox\"\n                checked\n                class=\"sfx-checkbox-input\"\n                id=\"{{ selectedItem.id }}_{{ selectedItem.name }}\"\n              />\n              <label\n                class=\"Font400\"\n                for=\"{{ selectedItem.id }}_{{ selectedItem.name }}\"\n                >{{ selectedItem.name | capitalizeFirstCharacter }}\n                <br />\n                <span\n                  *ngIf=\"selectedItem.additionalInfo\"\n                  class=\"selected-additional-info\"\n                >\n                  {{ selectedItem.additionalInfo }}</span\n                >\n              </label>\n            </div>\n            <div></div>\n          </div>\n        </div>\n        <!-- selected list div ends here -->\n        <!-- Search list  -->\n        <div\n          class=\"sfx-dropdown-unselected sfx-custom-scroll\"\n          (scroll)=\"scrollHandler($event)\"\n          *ngIf=\"multiSelectSearch.searchedDropdownList.length > 0\"\n        >\n          <div\n            id=\"dropdown-triggers-manually\"\n            *ngFor=\"\n              let filterDropdownOption of multiSelectSearch.searchedDropdownList\n            \"\n          >\n            <div class=\"sfx-checkbox\">\n              <input\n                type=\"checkbox\"\n                id=\"{{ filterDropdownOption.id }}_{{\n                  filterDropdownOption.name | trimId\n                }}\"\n                class=\"sfx-checkbox-input\"\n                [disabled]=\"multiSelectSearch.hasMaxSelections\"\n                (click)=\"\n                onSelectItem(filterDropdownOption); $event.stopPropagation()\n                \"\n                [(ngModel)]=\"filterDropdownOption.isChecked\"\n              />\n              <label\n                class=\"Font400\"\n                for=\"{{ filterDropdownOption.id }}_{{\n                  filterDropdownOption.name | trimId\n                }}\"\n                >{{ filterDropdownOption.name | capitalizeFirstCharacter }}\n                <br />\n                <span\n                  *ngIf=\"filterDropdownOption.additionalInfo\"\n                  class=\"additional-info\"\n                >\n                  {{ filterDropdownOption.additionalInfo }}</span\n                >\n              </label>\n            </div>\n            <div></div>\n          </div>\n          <div>\n            <symphony-sfx-loader\n              [hidden]=\"!isLoadingData\"\n            ></symphony-sfx-loader>\n          </div>\n        </div>\n        <symphony-sfx-loader\n          [hidden]=\"!isLoadingInitialData\"\n        ></symphony-sfx-loader>\n        <!-- search list ends here -->\n        <!-- Footer -->\n        <div *ngIf=\"openDropdown\" class=\"sfx-filter-item-footer\">\n          <button\n            type=\"button\"\n            class=\"pull-left\"\n            [disabled]=\"\n              !(\n                multiSelectSearch.selectedDropdownList &&\n                multiSelectSearch.selectedDropdownList.length > 0\n              )\n            \"\n            (click)=\"onClearAllClick()\"\n          >\n            Clear All\n          </button>\n          <a href=\"javascript:;\" (click)=\"onOkClick()\" class=\"pull-right\">OK</a>\n        </div>\n        <!-- End Footer -->\n      </div>\n    </div>\n  </div>\n  <div *ngIf=\"isInvalid\" class=\"error-message\">\n    Please select a valid option\n  </div>\n</div>", styles: [".sfx-input-popover{word-wrap:break-word;max-width:100%}.sfx-placeholder:-ms-input-placeholder{color:#000}.sfx-placeholder::-moz-placeholder{color:#000}.sfx-placeholder::placeholder{color:#000}.requiredField{color:#000}.error-message{color:#ac4463}.invalid-control{border:1px solid #AC4463!important}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox .sfx-checkbox-input~label{color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox .sfx-checkbox-input:not(:checked)~label:after{border:2px solid #000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox .sfx-checkbox-input:checked~label:before{border-bottom:2px solid #000;border-right:2px solid #000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox .sfx-checkbox-input:checked~label:after{background-color:#fff;border:2px solid #000}.sfx-custom-dropdown-wrap{position:relative;padding:.3rem;width:100%}.sfx-custom-dropdown-wrap input{width:100%;border:1px solid #d0d0d0;height:40px;border-radius:4px;background:#fff;color:#000;outline:none;padding-left:.9375rem;padding-right:1.875rem;line-height:25px}.sfx-custom-dropdown-wrap symphony-icon{right:17px;bottom:13px;position:absolute;color:#000;z-index:2}.sfx-custom-dropdown-wrap .sfx-custom-dropdown{background:#fff;position:absolute;width:100%;z-index:4;left:0;border-width:0px 1px 1px 1px;border-style:solid;border-color:#d9d9d9}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox{margin:0;padding:.625rem 1.25rem}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-checkbox:hover{background:#E4E7EF;color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected{border-bottom:1px solid #d9d9d9;padding-bottom:.625rem;padding-top:.625rem;max-height:220px;overflow-y:auto}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover{background:#fff;color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input:not(:checked),.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input:checked{position:absolute}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input~label{color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input:not(:checked)~label:after{border-color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input:checked~label:before{border-bottom-color:#000;border-right-color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected .sfx-checkbox:hover .sfx-checkbox-input:checked~label:after{background-color:#fff;border-color:#000}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-unselected{padding-bottom:.625rem;padding-top:.625rem;border-bottom:1px solid #d9d9d9;max-height:220px;overflow-y:auto}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-select-all-toggle{padding:15px 20px;border-bottom:1px solid #d9d9d9}.sfx-custom-dropdown-wrap.open{background:#fff}.sfx-custom-dropdown-wrap.open .tree-node-checkbox{height:auto;width:auto}.sfx-custom-dropdown-wrap.open .sfx-create-new-items{padding:.625rem 1.5625rem .625rem 1.25rem;position:relative;border-bottom:1px solid #d0d0d0;cursor:pointer}.sfx-custom-dropdown-wrap.open .sfx-create-new-items .sfx-create-new-items-icon{font-size:.625rem;position:absolute;right:.9375rem;top:.9375rem}.sfx-custom-dropdown-wrap.open input{z-index:2;position:relative;background:#ffffff;color:#000}.sfx-custom-dropdown-wrap.open symphony-icon{color:#000}.sfx-custom-dropdown-wrap.open:after{content:\" \";position:absolute;top:0;left:0;display:inline-block;width:100%;height:100%;z-index:1;border-width:1px 1px 0px 1px;border-style:solid;border-color:#d9d9d9}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected::-webkit-scrollbar,.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-unselected::-webkit-scrollbar{width:12px}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected::-webkit-scrollbar-track,.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-unselected::-webkit-scrollbar-track{box-shadow:inset 0 0 3px transparent;border-radius:30px}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected::-webkit-scrollbar-thumb,.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-unselected::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:30px}.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-selected::-webkit-scrollbar-thumb:hover,.sfx-custom-dropdown-wrap .sfx-custom-dropdown .sfx-dropdown-unselected::-webkit-scrollbar-thumb:hover{cursor:pointer}.sfx-filter-item-footer{display:inline-block;width:100%;padding:1.875rem 1.25rem 1.5625rem;font-family:runda,sans-serif;font-weight:500}.sfx-filter-item-footer a{cursor:pointer}.sfx-filter-item-footer button{color:#712ace;background:transparent;border:none;padding:0}.sfx-filter-item-footer button:disabled{opacity:.5;cursor:not-allowed}.sfx-checkbox .sfx-checkbox-input~label{color:#fff}.sfx-checkbox .sfx-checkbox-input:not(:checked)~label:after{border:2px solid #fff}.sfx-checkbox .sfx-checkbox-input:checked~label:before{border-bottom:2px solid #fff;border-right:2px solid #fff}.sfx-checkbox .sfx-checkbox-input:checked~label:after{background-color:#212121;border:2px solid #fff}.sfx-checkbox{margin:10px 0;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.sfx-checkbox .sfx-checkbox-input:not(:checked),.sfx-checkbox .sfx-checkbox-input:checked{opacity:0;position:absolute;margin:0;z-index:-1;width:0;height:0;overflow:hidden;left:0;pointer-events:none}.sfx-checkbox .sfx-checkbox-input~label{display:inline-block;position:relative;cursor:pointer;height:100%;line-height:20px;font-size:14px;color:#000;padding-left:36px;font-family:runda,sans-serif;font-weight:400;margin:0;word-break:break-word}.sfx-checkbox .sfx-checkbox-input~label.sfx-font-reg{font-family:runda,sans-serif}.sfx-checkbox .sfx-checkbox-input~label:before{transform:translateZ(0);transition:all 0s ease-in;position:absolute;content:\"\";left:0;border-radius:2px}.sfx-checkbox .sfx-checkbox-input~label:after{position:absolute;content:\"\";left:0;border-radius:2px;top:0}.sfx-checkbox .sfx-checkbox-input~label .additional-info,.sfx-checkbox .sfx-checkbox-input~label .selected-additional-info{font-size:12px;color:#565656}.sfx-checkbox .sfx-checkbox-input:not(:checked)~label:before{width:9px;height:15px;border:none;top:1px;left:0;transform:rotate(37deg) scale(.1);transform-origin:100% 100%}.sfx-checkbox .sfx-checkbox-input:not(:checked)~label:after{width:20px;height:20px;border:2px solid #000;z-index:0;border-radius:4px}.sfx-checkbox .sfx-checkbox-input:checked~label:before{top:3px;left:3px;width:6px;height:12px;border-top:0px solid transparent;border-left:0px solid transparent;border-bottom:2px solid #000;border-right:2px solid #000;z-index:1;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:rotate(37deg) scale(1);transform-origin:100% 100%;border-radius:0}.sfx-checkbox .sfx-checkbox-input:checked~label:after{width:20px;height:20px;background-color:#fff;border:2px solid #000;border-radius:4px}.sfx-checkbox .sfx-checkbox-input:disabled~label{opacity:.3;pointer-events:none}.sfx-checkbox:hover .sfx-checkbox-input~label .additional-info{color:#fff}.sfx-filter-label{font-family:runda,sans-serif;font-weight:500;margin-bottom:.3rem;padding-left:.3rem;line-height:25px}.isInverse .sfx-custom-dropdown-wrap input{border-color:#5b6d80}\n"] }]

package/esm2020/lib/atoms/notifications/notifications.component.mjs CHANGED Viewed

@@ -15,7 +15,7 @@ export class NotificationsComponent {
     }
 }
 NotificationsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NotificationsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-NotificationsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: NotificationsComponent, selector: "symphony-notifications", inputs: { model: "model" }, outputs: { actionClick: "actionClick" }, ngImport: i0, template: "<div class=\"btn-group\" dropdown [insideClick]=\"true\">\n  <button\n    id=\"button-basic\"\n    dropdownToggle\n    type=\"button\"\n    class=\"btn dropdown-toggle\"\n    aria-controls=\"dropdown-basic\"\n    aria-label=\"more-actions-menu\"\n  >\n    <symphony-icon [icon]=\"'si-notification'\"></symphony-icon>\n\n    <span class=\"notification-on\" *ngIf=\"model?.unreadNotificationCount > 0\">\n      {{ model.unreadNotificationCount }}</span\n    >\n  </button>\n  <ul\n    id=\"dropdown-basic\"\n    *dropdownMenu\n    class=\"dropdown-menu\"\n    role=\"menu\"\n    aria-labelledby=\"button-basic\"\n  >\n    <li role=\"menuitem\" class=\"sfx-p-20\">\n      <symphony-h3 [text]=\"model.title\"></symphony-h3>\n    </li>\n    <li *ngIf=\"!model.isLoading\">\n      <ul class=\"list-unstyled sfx-notification-list\">\n        <li\n          role=\"menuitem\"\n          class=\"sfx-notification-list-items\"\n          *ngFor=\"let notification of model.notifications\"\n        >\n          <div class=\"dropdown-item sfx-position-relative\">\n            <div class=\"notification-wrap\">\n              <div class=\"notification-text sfx-mb-10\">\n                <symphony-icon\n                  *ngIf=\"notification.icon\"\n                  [icon]=\"notification.icon\"\n                  class=\"icon-position\"\n                ></symphony-icon>\n                <span *ngIf=\"!notification.isHtml\">{{\n                  notification.text\n                }}</span>\n                <div\n                  class=\"hasBold\"\n                  *ngIf=\"notification.isHtml\"\n                  [innerHTML]=\"notification.text\"\n                ></div>\n              </div>\n              <div class=\"notification-footer\">\n                <span>{{ notification.timestamp }}</span>\n                <span\n                  class=\"sfx-font-bold sfx-cursor-pointer notification-action\"\n                  (click)=\"onActionClick(notification)\"\n                  >{{ notification.action }}</span\n                >\n              </div>\n            </div>\n          </div>\n          <div class=\"horizontal-divider\"></div>\n        </li>\n        <li class=\"sfx-mt-20\" *ngIf=\"model.isNotificationLoading\">\n          <symphony-sfx-loader></symphony-sfx-loader>\n        </li>\n      </ul>\n    </li>\n    <li class=\"sfx-mt-20 sfx-mb-20\" *ngIf=\"model.isLoading\">\n      <symphony-sfx-loader></symphony-sfx-loader>\n    </li>\n    <li\n      class=\"sfx-mt-20 sfx-mb-20 sfx-txt-center\"\n      *ngIf=\"model.notifications.length === 0 && !model.isLoading\"\n    >\n      <symphony-h5 [text]=\"model.emptyState\"></symphony-h5>\n    </li>\n  </ul>\n</div>\n", styles: [".btn-group .has-border{border-radius:50%;border:2px solid #000;height:40px;width:40px;padding:9px 0;cursor:pointer;text-align:center}.btn-group button.dropdown-toggle.btn{display:flex;align-items:center;justify-content:center;background:#000000;padding:0;box-shadow:none;width:40px;height:40px;min-height:40px;border-radius:50%!important;color:#fff;position:relative}.btn-group button.dropdown-toggle.btn:hover{background:#565656;color:#fff!important}.btn-group button.dropdown-toggle.btn:hover .notification-on{border-color:#565656}.btn-group button.dropdown-toggle.btn .si-more-options{font-size:18px}.btn-group button.dropdown-toggle.btn symphony-icon{height:18px}.btn-group button.dropdown-toggle.btn .notification-on{color:#000;width:18px;height:18px;background:#FFF;position:absolute;border:2px solid #000;border-radius:50%;top:0px;right:3px;font-size:9px;display:flex;justify-content:center;align-items:flex-end}.btn-group .dropdown-menu{width:360px;margin-top:10px;border:none;border-radius:10px;padding:0;right:-10px;left:auto;box-shadow:0 0 30px rgba(0,0,0,.2);max-height:none;overflow:inherit;background:#ffffff}.btn-group .dropdown-menu .sfx-notification-list{max-height:280px;overflow-y:scroll;margin-bottom:20px}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item{padding:0 15px 0 25px;line-height:20px;color:#000;border-radius:10px;background-color:#fff}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item:hover{background:#fff;color:#000}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item .notification-wrap{position:relative;padding:10px 10px 10px 25px}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item .notification-wrap .notification-text .hasBold span{font-family:neuzeit_groteskbold,sans-serif}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item .notification-wrap .notification-text .notification-status{content:\"\";width:15px;height:15px;background:#00bb5b;border-radius:50%;position:absolute;top:12px;left:0}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item .notification-wrap .notification-text .notification-status.red{background:#d60000}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item .notification-wrap .notification-footer{display:flex;justify-content:space-between}.btn-group .dropdown-menu .sfx-notification-list li.sfx-notification-list-items .horizontal-divider{border-bottom:1px solid #d9d9d9;margin:0 15px}.btn-group .dropdown-menu .sfx-notification-list li.sfx-notification-list-items:last-child .horizontal-divider{border-bottom:none}.btn-group .dropdown-menu:before{content:\"\\e252\";font-family:Glyphicons Halflings!important;font-size:14px;transform:rotate(180deg);display:inline-block;position:absolute;top:-13px;right:23px;color:#fff}.btn-group.is-inverse button.dropdown-toggle.btn{background:#000;color:#fff}.btn-group.is-inverse button.dropdown-toggle.btn:hover{background:#fff;color:#000!important}.btn-group.open button.dropdown-toggle.btn{background:#565656}.btn-group.open button.dropdown-toggle.btn .notification-on{border-color:#565656}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{box-shadow:inset 0 0 3px transparent;border-radius:30px}::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:30px}::-webkit-scrollbar-thumb:hover{cursor:pointer}.icon-position{position:absolute;left:-5px;top:12px}.notification-action:hover{text-decoration:underline}\n"], components: [{ type: i1.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i2.H3Component, selector: "symphony-h3", inputs: ["text", "isSecondary"] }, { type: i3.SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: ["leftStyle", "message"] }, { type: i4.H5Component, selector: "symphony-h5", inputs: ["text", "isSecondary"] }], directives: [{ type: i5.BsDropdownDirective, selector: "[bsDropdown],[dropdown]", inputs: ["autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen", "placement", "triggers", "container", "dropup"], outputs: ["onShown", "onHidden", "isOpenChange"], exportAs: ["bs-dropdown"] }, { type: i5.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+NotificationsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: NotificationsComponent, selector: "symphony-notifications", inputs: { model: "model" }, outputs: { actionClick: "actionClick" }, ngImport: i0, template: "<div class=\"btn-group\" dropdown [insideClick]=\"true\">\n  <button\n    id=\"button-basic\"\n    dropdownToggle\n    type=\"button\"\n    class=\"btn dropdown-toggle\"\n    aria-controls=\"dropdown-basic\"\n    aria-label=\"more-actions-menu\"\n  >\n    <symphony-icon [icon]=\"'si-notification'\"></symphony-icon>\n\n    <span class=\"notification-on\" *ngIf=\"model?.unreadNotificationCount > 0\">\n      {{ model.unreadNotificationCount }}</span\n    >\n  </button>\n  <ul\n    id=\"dropdown-basic\"\n    *dropdownMenu\n    class=\"dropdown-menu\"\n    role=\"menu\"\n    aria-labelledby=\"button-basic\"\n  >\n    <li role=\"menuitem\" class=\"sfx-p-20\">\n      <symphony-h3 [text]=\"model.title\"></symphony-h3>\n    </li>\n    <li *ngIf=\"!model.isLoading\">\n      <ul class=\"list-unstyled sfx-notification-list\">\n        <li\n          role=\"menuitem\"\n          class=\"sfx-notification-list-items\"\n          *ngFor=\"let notification of model.notifications\"\n        >\n          <div class=\"dropdown-item sfx-position-relative\">\n            <div class=\"notification-wrap\">\n              <div class=\"notification-text sfx-mb-10\">\n                <symphony-icon\n                  *ngIf=\"notification.icon\"\n                  [icon]=\"notification.icon\"\n                  class=\"icon-position\"\n                ></symphony-icon>\n                <span *ngIf=\"!notification.isHtml\">{{\n                  notification.text\n                }}</span>\n                <div\n                  class=\"hasBold\"\n                  *ngIf=\"notification.isHtml\"\n                  [innerHTML]=\"notification.text\"\n                ></div>\n              </div>\n              <div class=\"notification-footer\">\n                <span>{{ notification.timestamp }}</span>\n                <span\n                  class=\"sfx-font-bold sfx-cursor-pointer notification-action\"\n                  (click)=\"onActionClick(notification)\"\n                  >{{ notification.action }}</span\n                >\n              </div>\n            </div>\n          </div>\n          <div class=\"horizontal-divider\"></div>\n        </li>\n        <li class=\"sfx-mt-20\" *ngIf=\"model.isNotificationLoading\">\n          <symphony-sfx-loader></symphony-sfx-loader>\n        </li>\n      </ul>\n    </li>\n    <li class=\"sfx-mt-20 sfx-mb-20\" *ngIf=\"model.isLoading\">\n      <symphony-sfx-loader></symphony-sfx-loader>\n    </li>\n    <li\n      class=\"sfx-mt-20 sfx-mb-20 sfx-txt-center\"\n      *ngIf=\"model.notifications.length === 0 && !model.isLoading\"\n    >\n      <symphony-h5 [text]=\"model.emptyState\"></symphony-h5>\n    </li>\n  </ul>\n</div>\n", styles: [".btn-group .has-border{border-radius:50%;border:2px solid #000;height:40px;width:40px;padding:9px 0;cursor:pointer;text-align:center}.btn-group button.dropdown-toggle.btn{display:flex;align-items:center;justify-content:center;background:#000000;padding:0;box-shadow:none;width:40px;height:40px;min-height:40px;border-radius:50%!important;color:#fff;position:relative}.btn-group button.dropdown-toggle.btn:hover{background:#565656;color:#fff!important}.btn-group button.dropdown-toggle.btn:hover .notification-on{border-color:#565656}.btn-group button.dropdown-toggle.btn .si-more-options{font-size:18px}.btn-group button.dropdown-toggle.btn symphony-icon{height:18px}.btn-group button.dropdown-toggle.btn .notification-on{color:#000;width:18px;height:18px;background:#FFF;position:absolute;border:2px solid #000;border-radius:50%;top:0px;right:3px;font-size:9px;display:flex;justify-content:center;align-items:flex-end}.btn-group .dropdown-menu{width:360px;margin-top:10px;border:none;border-radius:10px;padding:0;right:-10px;left:auto;box-shadow:0 0 30px rgba(0,0,0,.2);max-height:none;overflow:inherit;background:#ffffff}.btn-group .dropdown-menu .sfx-notification-list{max-height:280px;overflow-y:scroll;margin-bottom:20px}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item{padding:0 15px 0 25px;line-height:20px;color:#000;border-radius:10px;background-color:#fff}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item:hover{background:#fff;color:#000}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item .notification-wrap{position:relative;padding:10px 10px 10px 25px}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item .notification-wrap .notification-text .hasBold span{font-family:neuzeit_groteskbold,sans-serif}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item .notification-wrap .notification-text .notification-status{content:\"\";width:15px;height:15px;background:#00bb5b;border-radius:50%;position:absolute;top:12px;left:0}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item .notification-wrap .notification-text .notification-status.red{background:#d60000}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item .notification-wrap .notification-footer{display:flex;justify-content:space-between}.btn-group .dropdown-menu .sfx-notification-list li.sfx-notification-list-items .horizontal-divider{border-bottom:1px solid #d9d9d9;margin:0 15px}.btn-group .dropdown-menu .sfx-notification-list li.sfx-notification-list-items:last-child .horizontal-divider{border-bottom:none}.btn-group .dropdown-menu:before{content:\"\\e252\";font-family:Glyphicons Halflings!important;font-size:14px;transform:rotate(180deg);display:inline-block;position:absolute;top:-13px;right:23px;color:#fff}.btn-group.is-inverse button.dropdown-toggle.btn{background:#000;color:#fff}.btn-group.is-inverse button.dropdown-toggle.btn:hover{background:#fff;color:#000!important}.btn-group.open button.dropdown-toggle.btn{background:#565656}.btn-group.open button.dropdown-toggle.btn .notification-on{border-color:#565656}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{box-shadow:inset 0 0 3px transparent;border-radius:30px}::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:30px}::-webkit-scrollbar-thumb:hover{cursor:pointer}.icon-position{position:absolute;left:-5px;top:12px}.notification-action:hover{text-decoration:underline}\n"], components: [{ type: i1.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i2.H3Component, selector: "symphony-h3", inputs: ["text", "isSecondary"] }, { type: i3.SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: ["leftStyle", "message", "hasCustomMessage"] }, { type: i4.H5Component, selector: "symphony-h5", inputs: ["text", "isSecondary"] }], directives: [{ type: i5.BsDropdownDirective, selector: "[bsDropdown],[dropdown]", inputs: ["autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen", "placement", "triggers", "container", "dropup"], outputs: ["onShown", "onHidden", "isOpenChange"], exportAs: ["bs-dropdown"] }, { type: i5.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NotificationsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'symphony-notifications', template: "<div class=\"btn-group\" dropdown [insideClick]=\"true\">\n  <button\n    id=\"button-basic\"\n    dropdownToggle\n    type=\"button\"\n    class=\"btn dropdown-toggle\"\n    aria-controls=\"dropdown-basic\"\n    aria-label=\"more-actions-menu\"\n  >\n    <symphony-icon [icon]=\"'si-notification'\"></symphony-icon>\n\n    <span class=\"notification-on\" *ngIf=\"model?.unreadNotificationCount > 0\">\n      {{ model.unreadNotificationCount }}</span\n    >\n  </button>\n  <ul\n    id=\"dropdown-basic\"\n    *dropdownMenu\n    class=\"dropdown-menu\"\n    role=\"menu\"\n    aria-labelledby=\"button-basic\"\n  >\n    <li role=\"menuitem\" class=\"sfx-p-20\">\n      <symphony-h3 [text]=\"model.title\"></symphony-h3>\n    </li>\n    <li *ngIf=\"!model.isLoading\">\n      <ul class=\"list-unstyled sfx-notification-list\">\n        <li\n          role=\"menuitem\"\n          class=\"sfx-notification-list-items\"\n          *ngFor=\"let notification of model.notifications\"\n        >\n          <div class=\"dropdown-item sfx-position-relative\">\n            <div class=\"notification-wrap\">\n              <div class=\"notification-text sfx-mb-10\">\n                <symphony-icon\n                  *ngIf=\"notification.icon\"\n                  [icon]=\"notification.icon\"\n                  class=\"icon-position\"\n                ></symphony-icon>\n                <span *ngIf=\"!notification.isHtml\">{{\n                  notification.text\n                }}</span>\n                <div\n                  class=\"hasBold\"\n                  *ngIf=\"notification.isHtml\"\n                  [innerHTML]=\"notification.text\"\n                ></div>\n              </div>\n              <div class=\"notification-footer\">\n                <span>{{ notification.timestamp }}</span>\n                <span\n                  class=\"sfx-font-bold sfx-cursor-pointer notification-action\"\n                  (click)=\"onActionClick(notification)\"\n                  >{{ notification.action }}</span\n                >\n              </div>\n            </div>\n          </div>\n          <div class=\"horizontal-divider\"></div>\n        </li>\n        <li class=\"sfx-mt-20\" *ngIf=\"model.isNotificationLoading\">\n          <symphony-sfx-loader></symphony-sfx-loader>\n        </li>\n      </ul>\n    </li>\n    <li class=\"sfx-mt-20 sfx-mb-20\" *ngIf=\"model.isLoading\">\n      <symphony-sfx-loader></symphony-sfx-loader>\n    </li>\n    <li\n      class=\"sfx-mt-20 sfx-mb-20 sfx-txt-center\"\n      *ngIf=\"model.notifications.length === 0 && !model.isLoading\"\n    >\n      <symphony-h5 [text]=\"model.emptyState\"></symphony-h5>\n    </li>\n  </ul>\n</div>\n", styles: [".btn-group .has-border{border-radius:50%;border:2px solid #000;height:40px;width:40px;padding:9px 0;cursor:pointer;text-align:center}.btn-group button.dropdown-toggle.btn{display:flex;align-items:center;justify-content:center;background:#000000;padding:0;box-shadow:none;width:40px;height:40px;min-height:40px;border-radius:50%!important;color:#fff;position:relative}.btn-group button.dropdown-toggle.btn:hover{background:#565656;color:#fff!important}.btn-group button.dropdown-toggle.btn:hover .notification-on{border-color:#565656}.btn-group button.dropdown-toggle.btn .si-more-options{font-size:18px}.btn-group button.dropdown-toggle.btn symphony-icon{height:18px}.btn-group button.dropdown-toggle.btn .notification-on{color:#000;width:18px;height:18px;background:#FFF;position:absolute;border:2px solid #000;border-radius:50%;top:0px;right:3px;font-size:9px;display:flex;justify-content:center;align-items:flex-end}.btn-group .dropdown-menu{width:360px;margin-top:10px;border:none;border-radius:10px;padding:0;right:-10px;left:auto;box-shadow:0 0 30px rgba(0,0,0,.2);max-height:none;overflow:inherit;background:#ffffff}.btn-group .dropdown-menu .sfx-notification-list{max-height:280px;overflow-y:scroll;margin-bottom:20px}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item{padding:0 15px 0 25px;line-height:20px;color:#000;border-radius:10px;background-color:#fff}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item:hover{background:#fff;color:#000}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item .notification-wrap{position:relative;padding:10px 10px 10px 25px}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item .notification-wrap .notification-text .hasBold span{font-family:neuzeit_groteskbold,sans-serif}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item .notification-wrap .notification-text .notification-status{content:\"\";width:15px;height:15px;background:#00bb5b;border-radius:50%;position:absolute;top:12px;left:0}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item .notification-wrap .notification-text .notification-status.red{background:#d60000}.btn-group .dropdown-menu .sfx-notification-list li .dropdown-item .notification-wrap .notification-footer{display:flex;justify-content:space-between}.btn-group .dropdown-menu .sfx-notification-list li.sfx-notification-list-items .horizontal-divider{border-bottom:1px solid #d9d9d9;margin:0 15px}.btn-group .dropdown-menu .sfx-notification-list li.sfx-notification-list-items:last-child .horizontal-divider{border-bottom:none}.btn-group .dropdown-menu:before{content:\"\\e252\";font-family:Glyphicons Halflings!important;font-size:14px;transform:rotate(180deg);display:inline-block;position:absolute;top:-13px;right:23px;color:#fff}.btn-group.is-inverse button.dropdown-toggle.btn{background:#000;color:#fff}.btn-group.is-inverse button.dropdown-toggle.btn:hover{background:#fff;color:#000!important}.btn-group.open button.dropdown-toggle.btn{background:#565656}.btn-group.open button.dropdown-toggle.btn .notification-on{border-color:#565656}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{box-shadow:inset 0 0 3px transparent;border-radius:30px}::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:30px}::-webkit-scrollbar-thumb:hover{cursor:pointer}.icon-position{position:absolute;left:-5px;top:12px}.notification-action:hover{text-decoration:underline}\n"] }]

package/esm2020/lib/atoms/sfx-loader/sfx-loader.component.mjs CHANGED Viewed

@@ -8,13 +8,15 @@ export class SfxLoaderComponent {
     }
 }
 SfxLoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SfxLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SfxLoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: { leftStyle: "leftStyle", message: "message" }, ngImport: i0, template: "<div class=\"col-md-12 sfx-loader\" [style.left.%]=\"leftStyle\"></div>\n<symphony-paragraph *ngIf=\"message?.length > 0\" class=\"text-center\">\n  {{ message }}\n</symphony-paragraph>\n", styles: [".sfx-loader{z-index:10000;float:none;padding-top:5px;padding-bottom:5px;height:70px;width:50px;position:relative;padding-inline:0;transform:translate(-50%);display:inline-block;vertical-align:top}.sfx-loader:before{content:\" \";border:5px solid #000000;border-radius:50%;border-top:5px solid #ffffff;width:50px;height:50px;animation:sfxspin .5s linear infinite;position:absolute}\n"], components: [{ type: i1.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+SfxLoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: { leftStyle: "leftStyle", message: "message", hasCustomMessage: "hasCustomMessage" }, ngImport: i0, template: "<div class=\"col-md-12 sfx-loader\" [style.left.%]=\"leftStyle\"></div>\n<symphony-paragraph *ngIf=\"message?.length > 0\" class=\"text-center\">\n  {{ message }}\n</symphony-paragraph>\n<div *ngIf=\"hasCustomMessage\" class=\"col-xs-12 col-sm-12 col-md-12 col-lg-12\">\n  <ng-content select=\"[custom-message]\"></ng-content>\n</div>\n\n", styles: [".sfx-loader{z-index:10000;float:none;padding-top:5px;padding-bottom:5px;height:70px;width:50px;position:relative;padding-inline:0;transform:translate(-50%);display:inline-block;vertical-align:top}.sfx-loader:before{content:\" \";border:5px solid #000000;border-radius:50%;border-top:5px solid #ffffff;width:50px;height:50px;animation:sfxspin .5s linear infinite;position:absolute}\n"], components: [{ type: i1.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SfxLoaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'symphony-sfx-loader', template: "<div class=\"col-md-12 sfx-loader\" [style.left.%]=\"leftStyle\"></div>\n<symphony-paragraph *ngIf=\"message?.length > 0\" class=\"text-center\">\n  {{ message }}\n</symphony-paragraph>\n", styles: [".sfx-loader{z-index:10000;float:none;padding-top:5px;padding-bottom:5px;height:70px;width:50px;position:relative;padding-inline:0;transform:translate(-50%);display:inline-block;vertical-align:top}.sfx-loader:before{content:\" \";border:5px solid #000000;border-radius:50%;border-top:5px solid #ffffff;width:50px;height:50px;animation:sfxspin .5s linear infinite;position:absolute}\n"] }]
+            args: [{ selector: 'symphony-sfx-loader', template: "<div class=\"col-md-12 sfx-loader\" [style.left.%]=\"leftStyle\"></div>\n<symphony-paragraph *ngIf=\"message?.length > 0\" class=\"text-center\">\n  {{ message }}\n</symphony-paragraph>\n<div *ngIf=\"hasCustomMessage\" class=\"col-xs-12 col-sm-12 col-md-12 col-lg-12\">\n  <ng-content select=\"[custom-message]\"></ng-content>\n</div>\n\n", styles: [".sfx-loader{z-index:10000;float:none;padding-top:5px;padding-bottom:5px;height:70px;width:50px;position:relative;padding-inline:0;transform:translate(-50%);display:inline-block;vertical-align:top}.sfx-loader:before{content:\" \";border:5px solid #000000;border-radius:50%;border-top:5px solid #ffffff;width:50px;height:50px;animation:sfxspin .5s linear infinite;position:absolute}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { leftStyle: [{
                 type: Input
             }], message: [{
                 type: Input
+            }], hasCustomMessage: [{
+                type: Input
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2Z4LWxvYWRlci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2F0b21zL3NmeC1sb2FkZXIvc2Z4LWxvYWRlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2F0b21zL3NmeC1sb2FkZXIvc2Z4LWxvYWRlci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQzs7OztBQU9qRCxNQUFNLE9BQU8sa0JBQWtCO0lBSTdCO1FBSFMsY0FBUyxHQUFHLEVBQUUsQ0FBQztJQUdULENBQUM7OytHQUpMLGtCQUFrQjttR0FBbEIsa0JBQWtCLG1IQ1AvQiw2TEFJQTsyRkRHYSxrQkFBa0I7a0JBTDlCLFNBQVM7K0JBQ0UscUJBQXFCOzBFQUt0QixTQUFTO3NCQUFqQixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc3ltcGhvbnktc2Z4LWxvYWRlcicsXG4gIHRlbXBsYXRlVXJsOiAnLi9zZngtbG9hZGVyLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vc2Z4LWxvYWRlci5jb21wb25lbnQuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIFNmeExvYWRlckNvbXBvbmVudCB7XG4gIEBJbnB1dCgpIGxlZnRTdHlsZSA9IDUwO1xuICBASW5wdXQoKSBtZXNzYWdlPzogc3RyaW5nO1xuXG4gIGNvbnN0cnVjdG9yKCkge31cbn1cbiIsIjxkaXYgY2xhc3M9XCJjb2wtbWQtMTIgc2Z4LWxvYWRlclwiIFtzdHlsZS5sZWZ0LiVdPVwibGVmdFN0eWxlXCI+PC9kaXY+XG48c3ltcGhvbnktcGFyYWdyYXBoICpuZ0lmPVwibWVzc2FnZT8ubGVuZ3RoID4gMFwiIGNsYXNzPVwidGV4dC1jZW50ZXJcIj5cbiAge3sgbWVzc2FnZSB9fVxuPC9zeW1waG9ueS1wYXJhZ3JhcGg+XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2Z4LWxvYWRlci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2F0b21zL3NmeC1sb2FkZXIvc2Z4LWxvYWRlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL2F0b21zL3NmeC1sb2FkZXIvc2Z4LWxvYWRlci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQzs7OztBQU9qRCxNQUFNLE9BQU8sa0JBQWtCO0lBSTdCO1FBSFMsY0FBUyxHQUFHLEVBQUUsQ0FBQztJQUdULENBQUM7OytHQUpMLGtCQUFrQjttR0FBbEIsa0JBQWtCLHlKQ1AvQixvVkFRQTsyRkREYSxrQkFBa0I7a0JBTDlCLFNBQVM7K0JBQ0UscUJBQXFCOzBFQUt0QixTQUFTO3NCQUFqQixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDRyxnQkFBZ0I7c0JBQXhCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3N5bXBob255LXNmeC1sb2FkZXInLFxuICB0ZW1wbGF0ZVVybDogJy4vc2Z4LWxvYWRlci5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3NmeC1sb2FkZXIuY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBTZnhMb2FkZXJDb21wb25lbnQge1xuICBASW5wdXQoKSBsZWZ0U3R5bGUgPSA1MDtcbiAgQElucHV0KCkgbWVzc2FnZT86IHN0cmluZztcbiAgQElucHV0KCkgaGFzQ3VzdG9tTWVzc2FnZT86IGJvb2xlYW47XG4gIGNvbnN0cnVjdG9yKCkge31cbn1cbiIsIjxkaXYgY2xhc3M9XCJjb2wtbWQtMTIgc2Z4LWxvYWRlclwiIFtzdHlsZS5sZWZ0LiVdPVwibGVmdFN0eWxlXCI+PC9kaXY+XG48c3ltcGhvbnktcGFyYWdyYXBoICpuZ0lmPVwibWVzc2FnZT8ubGVuZ3RoID4gMFwiIGNsYXNzPVwidGV4dC1jZW50ZXJcIj5cbiAge3sgbWVzc2FnZSB9fVxuPC9zeW1waG9ueS1wYXJhZ3JhcGg+XG48ZGl2ICpuZ0lmPVwiaGFzQ3VzdG9tTWVzc2FnZVwiIGNsYXNzPVwiY29sLXhzLTEyIGNvbC1zbS0xMiBjb2wtbWQtMTIgY29sLWxnLTEyXCI+XG4gIDxuZy1jb250ZW50IHNlbGVjdD1cIltjdXN0b20tbWVzc2FnZV1cIj48L25nLWNvbnRlbnQ+XG48L2Rpdj5cblxuIl19

package/esm2020/lib/molecules/editable-setting-item/editable-setting-item.component.mjs ADDED Viewed

@@ -0,0 +1,24 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "../../atoms/paragraph/paragraph.component";
+import * as i2 from "@angular/forms";
+import * as i3 from "../../pipe/trim-id.pipe";
+export class EditableSettingItemComponent {
+    constructor() {
+        this.valueChanged = new EventEmitter();
+    }
+    onValueChange(editableSettingItemModel) {
+        this.valueChanged.emit(editableSettingItemModel);
+    }
+}
+EditableSettingItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: EditableSettingItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+EditableSettingItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: EditableSettingItemComponent, selector: "symphony-editable-setting-item", inputs: { editableSettingItemModel: "editableSettingItemModel" }, outputs: { valueChanged: "valueChanged" }, ngImport: i0, template: "<section class=\"editable-setting-wrap sfx-mb-20\">\n  <div class=\"sfx-pt-10\">\n    <symphony-paragraph class=\"sfx-font-bold\">\n      {{ editableSettingItemModel.settingLabel }}</symphony-paragraph\n    >\n  </div>\n  <div class=\"editable-input\">\n    <input\n      id=\"editable-input-item-{{ editableSettingItemModel.settingLabel | trimId}}\"\n      type=\"{{ editableSettingItemModel.settingInputType }}\"\n      [(ngModel)]=\"editableSettingItemModel.settingInputValue\"\n      (ngModelChange)=\"onValueChange(editableSettingItemModel)\"\n    />\n  </div>\n</section>\n", styles: [".editable-setting-wrap{display:flex;justify-content:space-between}.editable-setting-wrap .editable-input input::-webkit-outer-spin-button,.editable-setting-wrap .editable-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.editable-setting-wrap .editable-input input[type=number]{width:135px;height:40px;padding-inline:10px;border-radius:4px;border:1px solid #82919f;outline:none}\n"], components: [{ type: i1.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }], directives: [{ type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "trimId": i3.TrimIdPipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: EditableSettingItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'symphony-editable-setting-item', template: "<section class=\"editable-setting-wrap sfx-mb-20\">\n  <div class=\"sfx-pt-10\">\n    <symphony-paragraph class=\"sfx-font-bold\">\n      {{ editableSettingItemModel.settingLabel }}</symphony-paragraph\n    >\n  </div>\n  <div class=\"editable-input\">\n    <input\n      id=\"editable-input-item-{{ editableSettingItemModel.settingLabel | trimId}}\"\n      type=\"{{ editableSettingItemModel.settingInputType }}\"\n      [(ngModel)]=\"editableSettingItemModel.settingInputValue\"\n      (ngModelChange)=\"onValueChange(editableSettingItemModel)\"\n    />\n  </div>\n</section>\n", styles: [".editable-setting-wrap{display:flex;justify-content:space-between}.editable-setting-wrap .editable-input input::-webkit-outer-spin-button,.editable-setting-wrap .editable-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.editable-setting-wrap .editable-input input[type=number]{width:135px;height:40px;padding-inline:10px;border-radius:4px;border:1px solid #82919f;outline:none}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { editableSettingItemModel: [{
+                type: Input
+            }], valueChanged: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZWRpdGFibGUtc2V0dGluZy1pdGVtLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvbXBvbmVudC1saWJyYXJ5L3NyYy9saWIvbW9sZWN1bGVzL2VkaXRhYmxlLXNldHRpbmctaXRlbS9lZGl0YWJsZS1zZXR0aW5nLWl0ZW0uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29tcG9uZW50LWxpYnJhcnkvc3JjL2xpYi9tb2xlY3VsZXMvZWRpdGFibGUtc2V0dGluZy1pdGVtL2VkaXRhYmxlLXNldHRpbmctaXRlbS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQVUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7OztBQVEvRSxNQUFNLE9BQU8sNEJBQTRCO0lBSXZDO1FBRlUsaUJBQVksR0FBRyxJQUFJLFlBQVksRUFBNEIsQ0FBQztJQUV2RCxDQUFDO0lBRWhCLGFBQWEsQ0FBQyx3QkFBa0Q7UUFDOUQsSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsd0JBQXdCLENBQUMsQ0FBQztJQUNuRCxDQUFDOzt5SEFSVSw0QkFBNEI7NkdBQTVCLDRCQUE0QixtTENSekMscWtCQWVBOzJGRFBhLDRCQUE0QjtrQkFMeEMsU0FBUzsrQkFDRSxnQ0FBZ0M7MEVBS2pDLHdCQUF3QjtzQkFBaEMsS0FBSztnQkFDSSxZQUFZO3NCQUFyQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPbkluaXQsIE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRWRpdGFibGVTZXR0aW5nSXRlbU1vZGVsIH0gZnJvbSAnLi9lZGl0YWJsZS1zZXR0aW5nLWl0ZW0uY29tcG9uZW50Lm1vZGVsJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc3ltcGhvbnktZWRpdGFibGUtc2V0dGluZy1pdGVtJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2VkaXRhYmxlLXNldHRpbmctaXRlbS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2VkaXRhYmxlLXNldHRpbmctaXRlbS5jb21wb25lbnQuc2NzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBFZGl0YWJsZVNldHRpbmdJdGVtQ29tcG9uZW50IHtcbiAgQElucHV0KCkgZWRpdGFibGVTZXR0aW5nSXRlbU1vZGVsOiBFZGl0YWJsZVNldHRpbmdJdGVtTW9kZWw7XG4gIEBPdXRwdXQoKSB2YWx1ZUNoYW5nZWQgPSBuZXcgRXZlbnRFbWl0dGVyPEVkaXRhYmxlU2V0dGluZ0l0ZW1Nb2RlbD4oKTtcblxuICBjb25zdHJ1Y3RvcigpIHt9XG5cbiAgb25WYWx1ZUNoYW5nZShlZGl0YWJsZVNldHRpbmdJdGVtTW9kZWw6IEVkaXRhYmxlU2V0dGluZ0l0ZW1Nb2RlbCkge1xuICAgIHRoaXMudmFsdWVDaGFuZ2VkLmVtaXQoZWRpdGFibGVTZXR0aW5nSXRlbU1vZGVsKTtcbiAgfVxufVxuIiwiPHNlY3Rpb24gY2xhc3M9XCJlZGl0YWJsZS1zZXR0aW5nLXdyYXAgc2Z4LW1iLTIwXCI+XG4gIDxkaXYgY2xhc3M9XCJzZngtcHQtMTBcIj5cbiAgICA8c3ltcGhvbnktcGFyYWdyYXBoIGNsYXNzPVwic2Z4LWZvbnQtYm9sZFwiPlxuICAgICAge3sgZWRpdGFibGVTZXR0aW5nSXRlbU1vZGVsLnNldHRpbmdMYWJlbCB9fTwvc3ltcGhvbnktcGFyYWdyYXBoXG4gICAgPlxuICA8L2Rpdj5cbiAgPGRpdiBjbGFzcz1cImVkaXRhYmxlLWlucHV0XCI+XG4gICAgPGlucHV0XG4gICAgICBpZD1cImVkaXRhYmxlLWlucHV0LWl0ZW0te3sgZWRpdGFibGVTZXR0aW5nSXRlbU1vZGVsLnNldHRpbmdMYWJlbCB8IHRyaW1JZH19XCJcbiAgICAgIHR5cGU9XCJ7eyBlZGl0YWJsZVNldHRpbmdJdGVtTW9kZWwuc2V0dGluZ0lucHV0VHlwZSB9fVwiXG4gICAgICBbKG5nTW9kZWwpXT1cImVkaXRhYmxlU2V0dGluZ0l0ZW1Nb2RlbC5zZXR0aW5nSW5wdXRWYWx1ZVwiXG4gICAgICAobmdNb2RlbENoYW5nZSk9XCJvblZhbHVlQ2hhbmdlKGVkaXRhYmxlU2V0dGluZ0l0ZW1Nb2RlbClcIlxuICAgIC8+XG4gIDwvZGl2PlxuPC9zZWN0aW9uPlxuIl19

package/esm2020/lib/molecules/editable-setting-item/editable-setting-item.component.model.mjs ADDED Viewed

@@ -0,0 +1,6 @@
+export var EditableSettingKey;
+(function (EditableSettingKey) {
+    EditableSettingKey["NumberOfMessages"] = "NumberOfMessages";
+    EditableSettingKey["NumberOfSms"] = "NumberOfSms";
+})(EditableSettingKey || (EditableSettingKey = {}));
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZWRpdGFibGUtc2V0dGluZy1pdGVtLmNvbXBvbmVudC5tb2RlbC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvbXBvbmVudC1saWJyYXJ5L3NyYy9saWIvbW9sZWN1bGVzL2VkaXRhYmxlLXNldHRpbmctaXRlbS9lZGl0YWJsZS1zZXR0aW5nLWl0ZW0uY29tcG9uZW50Lm1vZGVsLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU1BLE1BQU0sQ0FBTixJQUFZLGtCQUdYO0FBSEQsV0FBWSxrQkFBa0I7SUFDNUIsMkRBQXFDLENBQUE7SUFDckMsaURBQTJCLENBQUE7QUFDN0IsQ0FBQyxFQUhXLGtCQUFrQixLQUFsQixrQkFBa0IsUUFHN0IiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgaW50ZXJmYWNlIEVkaXRhYmxlU2V0dGluZ0l0ZW1Nb2RlbCB7XG4gIHNldHRpbmdMYWJlbDogc3RyaW5nO1xuICBzZXR0aW5nSW5wdXRUeXBlOiBzdHJpbmc7XG4gIHNldHRpbmdJbnB1dFZhbHVlOiBzdHJpbmc7XG4gIHNldHRpbmdLZXk6IEVkaXRhYmxlU2V0dGluZ0tleTtcbn1cbmV4cG9ydCBlbnVtIEVkaXRhYmxlU2V0dGluZ0tleSB7XG4gIE51bWJlck9mTWVzc2FnZXMgPSAnTnVtYmVyT2ZNZXNzYWdlcycsXG4gIE51bWJlck9mU21zID0gJ051bWJlck9mU21zJyxcbn1cbiJdfQ==

package/esm2020/lib/molecules/editable-setting-item/editable-setting-item.module.mjs ADDED Viewed

@@ -0,0 +1,21 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { EditableSettingItemComponent } from './editable-setting-item.component';
+import { ParagraphModule } from '../../atoms/paragraph/paragraph.module';
+import { FormsModule } from '@angular/forms';
+import { PipeModule } from '../../pipe/pipe.module';
+import * as i0 from "@angular/core";
+export class EditableSettingItemModule {
+}
+EditableSettingItemModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: EditableSettingItemModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+EditableSettingItemModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: EditableSettingItemModule, declarations: [EditableSettingItemComponent], imports: [CommonModule, ParagraphModule, FormsModule, PipeModule], exports: [EditableSettingItemComponent] });
+EditableSettingItemModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: EditableSettingItemModule, imports: [[CommonModule, ParagraphModule, FormsModule, PipeModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: EditableSettingItemModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [EditableSettingItemComponent],
+                    imports: [CommonModule, ParagraphModule, FormsModule, PipeModule],
+                    exports: [EditableSettingItemComponent],
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZWRpdGFibGUtc2V0dGluZy1pdGVtLm1vZHVsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvbXBvbmVudC1saWJyYXJ5L3NyYy9saWIvbW9sZWN1bGVzL2VkaXRhYmxlLXNldHRpbmctaXRlbS9lZGl0YWJsZS1zZXR0aW5nLWl0ZW0ubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSw0QkFBNEIsRUFBRSxNQUFNLG1DQUFtQyxDQUFDO0FBQ2pGLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSx3Q0FBd0MsQ0FBQztBQUN6RSxPQUFPLEVBQUUsV0FBVyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDN0MsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLHdCQUF3QixDQUFDOztBQU9wRCxNQUFNLE9BQU8seUJBQXlCOztzSEFBekIseUJBQXlCO3VIQUF6Qix5QkFBeUIsaUJBSnJCLDRCQUE0QixhQUNqQyxZQUFZLEVBQUUsZUFBZSxFQUFFLFdBQVcsRUFBRSxVQUFVLGFBQ3RELDRCQUE0Qjt1SEFFM0IseUJBQXlCLFlBSDNCLENBQUMsWUFBWSxFQUFFLGVBQWUsRUFBRSxXQUFXLEVBQUUsVUFBVSxDQUFDOzJGQUd0RCx5QkFBeUI7a0JBTHJDLFFBQVE7bUJBQUM7b0JBQ1IsWUFBWSxFQUFFLENBQUMsNEJBQTRCLENBQUM7b0JBQzVDLE9BQU8sRUFBRSxDQUFDLFlBQVksRUFBRSxlQUFlLEVBQUUsV0FBVyxFQUFFLFVBQVUsQ0FBQztvQkFDakUsT0FBTyxFQUFFLENBQUMsNEJBQTRCLENBQUM7aUJBQ3hDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBFZGl0YWJsZVNldHRpbmdJdGVtQ29tcG9uZW50IH0gZnJvbSAnLi9lZGl0YWJsZS1zZXR0aW5nLWl0ZW0uY29tcG9uZW50JztcbmltcG9ydCB7IFBhcmFncmFwaE1vZHVsZSB9IGZyb20gJy4uLy4uL2F0b21zL3BhcmFncmFwaC9wYXJhZ3JhcGgubW9kdWxlJztcbmltcG9ydCB7IEZvcm1zTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgUGlwZU1vZHVsZSB9IGZyb20gJy4uLy4uL3BpcGUvcGlwZS5tb2R1bGUnO1xuXG5ATmdNb2R1bGUoe1xuICBkZWNsYXJhdGlvbnM6IFtFZGl0YWJsZVNldHRpbmdJdGVtQ29tcG9uZW50XSxcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZSwgUGFyYWdyYXBoTW9kdWxlLCBGb3Jtc01vZHVsZSwgUGlwZU1vZHVsZV0sXG4gIGV4cG9ydHM6IFtFZGl0YWJsZVNldHRpbmdJdGVtQ29tcG9uZW50XSxcbn0pXG5leHBvcnQgY2xhc3MgRWRpdGFibGVTZXR0aW5nSXRlbU1vZHVsZSB7fVxuIl19

package/esm2020/lib/molecules/molecules.module.mjs CHANGED Viewed

@@ -20,6 +20,7 @@ import { ActionBarSelectionCounterModule } from './action-bar-selection-counter/
 import { InputTextareaModule } from "../atoms/input-textarea/input-textarea.module";
 import { CharacterCounterModule } from "../atoms/character-counter/character-counter.module";
 import { SettingsDetailNavigationItemModule } from './settings-detail-navigation-item/settings-detail-navigation-item.module';
+import { EditableSettingItemModule } from './editable-setting-item/editable-setting-item.module';
 import * as i0 from "@angular/core";
 export class MoleculesModule {
 }
@@ -44,7 +45,8 @@ MoleculesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version
         ActionBarSelectionCounterModule,
         InputTextareaModule,
         CharacterCounterModule,
-        SettingsDetailNavigationItemModule], exports: [PillsModule,
+        SettingsDetailNavigationItemModule,
+        EditableSettingItemModule], exports: [PillsModule,
         BreadcrumbModule,
         FeedbackCardModule,
         DocumentManagementItemModule,
@@ -71,7 +73,8 @@ MoleculesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version
             ActionBarSelectionCounterModule,
             InputTextareaModule,
             CharacterCounterModule,
-            SettingsDetailNavigationItemModule
+            SettingsDetailNavigationItemModule,
+            EditableSettingItemModule
         ], PillsModule,
         BreadcrumbModule,
         FeedbackCardModule,
@@ -111,8 +114,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImpor
                         ActionBarSelectionCounterModule,
                         InputTextareaModule,
                         CharacterCounterModule,
-                        SettingsDetailNavigationItemModule
+                        SettingsDetailNavigationItemModule,
+                        EditableSettingItemModule
                     ]
                 }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9sZWN1bGVzLm1vZHVsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL2NvbXBvbmVudC1saWJyYXJ5L3NyYy9saWIvbW9sZWN1bGVzL21vbGVjdWxlcy5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLCtCQUErQixDQUFDO0FBQzdELE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQztBQUNuRCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxvQ0FBb0MsQ0FBQztBQUN2RSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQztBQUNwRSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxnQ0FBZ0MsQ0FBQztBQUNsRSxPQUFPLEVBQUUsb0JBQW9CLEVBQUUsTUFBTSxpREFBaUQsQ0FBQztBQUN2RixPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxvQ0FBb0MsQ0FBQztBQUN0RSxPQUFPLEVBQUUscUJBQXFCLEVBQUUsTUFBTSw4Q0FBOEMsQ0FBQztBQUNyRixPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSxzQ0FBc0MsQ0FBQztBQUMxRSxPQUFPLEVBQUUsd0JBQXdCLEVBQUUsTUFBTSxvREFBb0QsQ0FBQztBQUM5RixPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQztBQUNwRSxPQUFPLEVBQUUsc0JBQXNCLEVBQUUsTUFBTSxnREFBZ0QsQ0FBQztBQUN4RixPQUFPLEVBQUUsb0JBQW9CLEVBQUUsTUFBTSw0Q0FBNEMsQ0FBQztBQUNsRixPQUFPLEVBQUUscUJBQXFCLEVBQUUsTUFBTSw4Q0FBOEMsQ0FBQztBQUNyRixPQUFPLEVBQUUsNEJBQTRCLEVBQUUsTUFBTSw0REFBNEQsQ0FBQztBQUMxRyxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQztBQUNwRSxPQUFPLEVBQUUsK0JBQStCLEVBQUUsTUFBTSxvRUFBb0UsQ0FBQztBQUNySCxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSwrQ0FBK0MsQ0FBQztBQUNwRixPQUFPLEVBQUUsc0JBQXNCLEVBQUUsTUFBTSxxREFBcUQsQ0FBQztBQUM3RixPQUFPLEVBQUUsa0NBQWtDLEVBQUUsTUFBTSwwRUFBMEUsQ0FBQzs7QUFvQzlILE1BQU0sT0FBTyxlQUFlOzs0R0FBZixlQUFlOzZHQUFmLGVBQWUsWUF2QnBCLFlBQVk7UUFDWixZQUFZO1FBQ1osb0JBQW9CO1FBQ3BCLFdBQVc7UUFDWCxpQkFBaUI7UUFDakIsZ0JBQWdCO1FBQ2hCLGdCQUFnQjtRQUNoQixnQkFBZ0I7UUFDaEIscUJBQXFCO1FBQ3JCLGtCQUFrQjtRQUNsQix3QkFBd0I7UUFDeEIsZ0JBQWdCO1FBQ2hCLHNCQUFzQjtRQUN0QixrQkFBa0I7UUFDbEIsb0JBQW9CO1FBQ3BCLHFCQUFxQjtRQUNyQiw0QkFBNEI7UUFDNUIsK0JBQStCO1FBQy9CLG1CQUFtQjtRQUNuQixzQkFBc0I7UUFDdEIsa0NBQWtDLGFBNUJsQyxXQUFXO1FBQ1gsZ0JBQWdCO1FBQ2hCLGtCQUFrQjtRQUNsQiw0QkFBNEI7UUFDNUIsZ0JBQWdCO1FBQ2hCLGtDQUFrQzs2R0EwQjdCLGVBQWUsWUF4QmY7WUFDTCxZQUFZO1lBQ1osWUFBWTtZQUNaLG9CQUFvQjtZQUNwQixXQUFXO1lBQ1gsaUJBQWlCO1lBQ2pCLGdCQUFnQjtZQUNoQixnQkFBZ0I7WUFDaEIsZ0JBQWdCO1lBQ2hCLHFCQUFxQjtZQUNyQixrQkFBa0I7WUFDbEIsd0JBQXdCO1lBQ3hCLGdCQUFnQjtZQUNoQixzQkFBc0I7WUFDdEIsa0JBQWtCO1lBQ2xCLG9CQUFvQjtZQUNwQixxQkFBcUI7WUFDckIsNEJBQTRCO1lBQzVCLCtCQUErQjtZQUMvQixtQkFBbUI7WUFDbkIsc0JBQXNCO1lBQ3RCLGtDQUFrQztTQUNyQyxFQTdCRyxXQUFXO1FBQ1gsZ0JBQWdCO1FBQ2hCLGtCQUFrQjtRQUNsQiw0QkFBNEI7UUFDNUIsZ0JBQWdCO1FBQ2hCLGtDQUFrQzsyRkEwQjdCLGVBQWU7a0JBbEMzQixRQUFRO21CQUFDO29CQUNOLFlBQVksRUFBRSxFQUFFO29CQUNoQixPQUFPLEVBQUU7d0JBQ0wsV0FBVzt3QkFDWCxnQkFBZ0I7d0JBQ2hCLGtCQUFrQjt3QkFDbEIsNEJBQTRCO3dCQUM1QixnQkFBZ0I7d0JBQ2hCLGtDQUFrQztxQkFDckM7b0JBQ0QsT0FBTyxFQUFFO3dCQUNMLFlBQVk7d0JBQ1osWUFBWTt3QkFDWixvQkFBb0I7d0JBQ3BCLFdBQVc7d0JBQ1gsaUJBQWlCO3dCQUNqQixnQkFBZ0I7d0JBQ2hCLGdCQUFnQjt3QkFDaEIsZ0JBQWdCO3dCQUNoQixxQkFBcUI7d0JBQ3JCLGtCQUFrQjt3QkFDbEIsd0JBQXdCO3dCQUN4QixnQkFBZ0I7d0JBQ2hCLHNCQUFzQjt3QkFDdEIsa0JBQWtCO3dCQUNsQixvQkFBb0I7d0JBQ3BCLHFCQUFxQjt3QkFDckIsNEJBQTRCO3dCQUM1QiwrQkFBK0I7d0JBQy9CLG1CQUFtQjt3QkFDbkIsc0JBQXNCO3dCQUN0QixrQ0FBa0M7cUJBQ3JDO2lCQUNKIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBBdmF0YXJNb2R1bGUgfSBmcm9tICcuLi9hdG9tcy9hdmF0YXIvYXZhdGFyLm1vZHVsZSc7XG5pbXBvcnQgeyBQaWxsc01vZHVsZSB9IGZyb20gJy4vcGlsbHMvcGlsbHMubW9kdWxlJztcbmltcG9ydCB7IENvbG9yU3dhdGNoTW9kdWxlIH0gZnJvbSAnLi9jb2xvci1zd2F0Y2gvY29sb3Itc3dhdGNoLm1vZHVsZSc7XG5pbXBvcnQgeyBJY29uU3dhdGNoTW9kdWxlIH0gZnJvbSAnLi9pY29uLXN3YXRjaC9pY29uLXN3YXRjaC5tb2R1bGUnO1xuaW1wb3J0IHsgQnJlYWRjcnVtYk1vZHVsZSB9IGZyb20gJy4vYnJlYWRjcnVtYi9icmVhZGNydW1iLm1vZHVsZSc7XG5pbXBvcnQgeyBDb250ZXh0dWFsTWVudU1vZHVsZSB9IGZyb20gJy4uL2F0b21zL2NvbnRleHR1YWwtbWVudS9jb250ZXh0dWFsLW1lbnUubW9kdWxlJztcbmltcG9ydCB7IEg1V2l0aEljb25Nb2R1bGUgfSBmcm9tICcuL2g1LXdpdGgtaWNvbi9oNS13aXRoLWljb24ubW9kdWxlJztcbmltcG9ydCB7IEludm9pY2VMaW5lSXRlbU1vZHVsZSB9IGZyb20gJy4vaW52b2ljZS1saW5lLWl0ZW0vaW52b2ljZS1saW5lLWl0ZW0ubW9kdWxlJztcbmltcG9ydCB7IEZlZWRiYWNrQ2FyZE1vZHVsZSB9IGZyb20gJy4vZmVlZGJhY2stY2FyZC9mZWVkYmFjay1jYXJkLm1vZHVsZSc7XG5pbXBvcnQgeyBTZnhBY2NvcmRpb25IZWFkZXJNb2R1bGUgfSBmcm9tICcuL3NmeC1hY2NvcmRpb24taGVhZGVyL3NmeC1hY2NvcmRpb24taGVhZGVyLm1vZHVsZSc7XG5pbXBvcnQgeyBGaWxlVXBsb2FkTW9kdWxlIH0gZnJvbSAnLi9maWxlLXVwbG9hZC9maWxlLXVwbG9hZC5tb2R1bGUnO1xuaW1wb3J0IHsgRmlsZVVwbG9hZFN0YXR1c01vZHVsZSB9IGZyb20gJy4vZmlsZS11cGxvYWQtc3RhdHVzL2ZpbGUtdXBsb2FkLXN0YXR1cy5tb2R1bGUnO1xuaW1wb3J0IHsgQnV0dG9uV2l0aEljb25Nb2R1bGUgfSBmcm9tICcuL2J1dHRvbi13aXRoLWljb24vYnV0dG9uLXdpdGgtaWNvbi5tb2R1bGUnO1xuaW1wb3J0IHsgSWNvbldpdGhUb29sdGlwTW9kdWxlIH0gZnJvbSAnLi9pY29uLXdpdGgtdG9vbHRpcC9pY29uLXdpdGgtdG9vbHRpcC5tb2R1bGUnO1xuaW1wb3J0IHsgRG9jdW1lbnRNYW5hZ2VtZW50SXRlbU1vZHVsZSB9IGZyb20gJy4vZG9jdW1lbnQtbWFuYWdlbWVudC1pdGVtL2RvY3VtZW50LW1hbmFnZW1lbnQtaXRlbS5tb2R1bGUnO1xuaW1wb3J0IHsgUGhhc2VyQ2FyZE1vZHVsZSB9IGZyb20gJy4vcGhhc2VyLWNhcmQvcGhhc2VyLWNhcmQubW9kdWxlJztcbmltcG9ydCB7IEFjdGlvbkJhclNlbGVjdGlvbkNvdW50ZXJNb2R1bGUgfSBmcm9tICcuL2FjdGlvbi1iYXItc2VsZWN0aW9uLWNvdW50ZXIvYWN0aW9uLWJhci1zZWxlY3Rpb24tY291bnRlci5tb2R1bGUnO1xuaW1wb3J0IHsgSW5wdXRUZXh0YXJlYU1vZHVsZSB9IGZyb20gXCIuLi9hdG9tcy9pbnB1dC10ZXh0YXJlYS9pbnB1dC10ZXh0YXJlYS5tb2R1bGVcIjtcbmltcG9ydCB7IENoYXJhY3RlckNvdW50ZXJNb2R1bGUgfSBmcm9tIFwiLi4vYXRvbXMvY2hhcmFjdGVyLWNvdW50ZXIvY2hhcmFjdGVyLWNvdW50ZXIubW9kdWxlXCI7XG5pbXBvcnQgeyBTZXR0aW5nc0RldGFpbE5hdmlnYXRpb25JdGVtTW9kdWxlIH0gZnJvbSAnLi9zZXR0aW5ncy1kZXRhaWwtbmF2aWdhdGlvbi1pdGVtL3NldHRpbmdzLWRldGFpbC1uYXZpZ2F0aW9uLWl0ZW0ubW9kdWxlJztcblxuQE5nTW9kdWxlKHtcbiAgICBkZWNsYXJhdGlvbnM6IFtdLFxuICAgIGV4cG9ydHM6IFtcbiAgICAgICAgUGlsbHNNb2R1bGUsXG4gICAgICAgIEJyZWFkY3J1bWJNb2R1bGUsXG4gICAgICAgIEZlZWRiYWNrQ2FyZE1vZHVsZSxcbiAgICAgICAgRG9jdW1lbnRNYW5hZ2VtZW50SXRlbU1vZHVsZSxcbiAgICAgICAgUGhhc2VyQ2FyZE1vZHVsZSxcbiAgICAgICAgU2V0dGluZ3NEZXRhaWxOYXZpZ2F0aW9uSXRlbU1vZHVsZVxuICAgIF0sXG4gICAgaW1wb3J0czogW1xuICAgICAgICBDb21tb25Nb2R1bGUsXG4gICAgICAgIEF2YXRhck1vZHVsZSxcbiAgICAgICAgQ29udGV4dHVhbE1lbnVNb2R1bGUsXG4gICAgICAgIFBpbGxzTW9kdWxlLFxuICAgICAgICBDb2xvclN3YXRjaE1vZHVsZSxcbiAgICAgICAgSWNvblN3YXRjaE1vZHVsZSxcbiAgICAgICAgQnJlYWRjcnVtYk1vZHVsZSxcbiAgICAgICAgSDVXaXRoSWNvbk1vZHVsZSxcbiAgICAgICAgSW52b2ljZUxpbmVJdGVtTW9kdWxlLFxuICAgICAgICBGZWVkYmFja0NhcmRNb2R1bGUsXG4gICAgICAgIFNmeEFjY29yZGlvbkhlYWRlck1vZHVsZSxcbiAgICAgICAgRmlsZVVwbG9hZE1vZHVsZSxcbiAgICAgICAgRmlsZVVwbG9hZFN0YXR1c01vZHVsZSxcbiAgICAgICAgRmVlZGJhY2tDYXJkTW9kdWxlLFxuICAgICAgICBCdXR0b25XaXRoSWNvbk1vZHVsZSxcbiAgICAgICAgSWNvbldpdGhUb29sdGlwTW9kdWxlLFxuICAgICAgICBEb2N1bWVudE1hbmFnZW1lbnRJdGVtTW9kdWxlLFxuICAgICAgICBBY3Rpb25CYXJTZWxlY3Rpb25Db3VudGVyTW9kdWxlLFxuICAgICAgICBJbnB1dFRleHRhcmVhTW9kdWxlLFxuICAgICAgICBDaGFyYWN0ZXJDb3VudGVyTW9kdWxlLFxuICAgICAgICBTZXR0aW5nc0RldGFpbE5hdmlnYXRpb25JdGVtTW9kdWxlXG4gICAgXVxufSlcbmV4cG9ydCBjbGFzcyBNb2xlY3VsZXNNb2R1bGUge31cbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9sZWN1bGVzLm1vZHVsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL2NvbXBvbmVudC1saWJyYXJ5L3NyYy9saWIvbW9sZWN1bGVzL21vbGVjdWxlcy5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLCtCQUErQixDQUFDO0FBQzdELE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQztBQUNuRCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxvQ0FBb0MsQ0FBQztBQUN2RSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQztBQUNwRSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxnQ0FBZ0MsQ0FBQztBQUNsRSxPQUFPLEVBQUUsb0JBQW9CLEVBQUUsTUFBTSxpREFBaUQsQ0FBQztBQUN2RixPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxvQ0FBb0MsQ0FBQztBQUN0RSxPQUFPLEVBQUUscUJBQXFCLEVBQUUsTUFBTSw4Q0FBOEMsQ0FBQztBQUNyRixPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSxzQ0FBc0MsQ0FBQztBQUMxRSxPQUFPLEVBQUUsd0JBQXdCLEVBQUUsTUFBTSxvREFBb0QsQ0FBQztBQUM5RixPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQztBQUNwRSxPQUFPLEVBQUUsc0JBQXNCLEVBQUUsTUFBTSxnREFBZ0QsQ0FBQztBQUN4RixPQUFPLEVBQUUsb0JBQW9CLEVBQUUsTUFBTSw0Q0FBNEMsQ0FBQztBQUNsRixPQUFPLEVBQUUscUJBQXFCLEVBQUUsTUFBTSw4Q0FBOEMsQ0FBQztBQUNyRixPQUFPLEVBQUUsNEJBQTRCLEVBQUUsTUFBTSw0REFBNEQsQ0FBQztBQUMxRyxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQztBQUNwRSxPQUFPLEVBQUUsK0JBQStCLEVBQUUsTUFBTSxvRUFBb0UsQ0FBQztBQUNySCxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSwrQ0FBK0MsQ0FBQztBQUNwRixPQUFPLEVBQUUsc0JBQXNCLEVBQUUsTUFBTSxxREFBcUQsQ0FBQztBQUM3RixPQUFPLEVBQUUsa0NBQWtDLEVBQUUsTUFBTSwwRUFBMEUsQ0FBQztBQUM5SCxPQUFPLEVBQUUseUJBQXlCLEVBQUUsTUFBTSxzREFBc0QsQ0FBQzs7QUFxQ2pHLE1BQU0sT0FBTyxlQUFlOzs0R0FBZixlQUFlOzZHQUFmLGVBQWUsWUF4QnBCLFlBQVk7UUFDWixZQUFZO1FBQ1osb0JBQW9CO1FBQ3BCLFdBQVc7UUFDWCxpQkFBaUI7UUFDakIsZ0JBQWdCO1FBQ2hCLGdCQUFnQjtRQUNoQixnQkFBZ0I7UUFDaEIscUJBQXFCO1FBQ3JCLGtCQUFrQjtRQUNsQix3QkFBd0I7UUFDeEIsZ0JBQWdCO1FBQ2hCLHNCQUFzQjtRQUN0QixrQkFBa0I7UUFDbEIsb0JBQW9CO1FBQ3BCLHFCQUFxQjtRQUNyQiw0QkFBNEI7UUFDNUIsK0JBQStCO1FBQy9CLG1CQUFtQjtRQUNuQixzQkFBc0I7UUFDdEIsa0NBQWtDO1FBQ2xDLHlCQUF5QixhQTdCekIsV0FBVztRQUNYLGdCQUFnQjtRQUNoQixrQkFBa0I7UUFDbEIsNEJBQTRCO1FBQzVCLGdCQUFnQjtRQUNoQixrQ0FBa0M7NkdBMkI3QixlQUFlLFlBekJmO1lBQ0wsWUFBWTtZQUNaLFlBQVk7WUFDWixvQkFBb0I7WUFDcEIsV0FBVztZQUNYLGlCQUFpQjtZQUNqQixnQkFBZ0I7WUFDaEIsZ0JBQWdCO1lBQ2hCLGdCQUFnQjtZQUNoQixxQkFBcUI7WUFDckIsa0JBQWtCO1lBQ2xCLHdCQUF3QjtZQUN4QixnQkFBZ0I7WUFDaEIsc0JBQXNCO1lBQ3RCLGtCQUFrQjtZQUNsQixvQkFBb0I7WUFDcEIscUJBQXFCO1lBQ3JCLDRCQUE0QjtZQUM1QiwrQkFBK0I7WUFDL0IsbUJBQW1CO1lBQ25CLHNCQUFzQjtZQUN0QixrQ0FBa0M7WUFDbEMseUJBQXlCO1NBQzVCLEVBOUJHLFdBQVc7UUFDWCxnQkFBZ0I7UUFDaEIsa0JBQWtCO1FBQ2xCLDRCQUE0QjtRQUM1QixnQkFBZ0I7UUFDaEIsa0NBQWtDOzJGQTJCN0IsZUFBZTtrQkFuQzNCLFFBQVE7bUJBQUM7b0JBQ04sWUFBWSxFQUFFLEVBQUU7b0JBQ2hCLE9BQU8sRUFBRTt3QkFDTCxXQUFXO3dCQUNYLGdCQUFnQjt3QkFDaEIsa0JBQWtCO3dCQUNsQiw0QkFBNEI7d0JBQzVCLGdCQUFnQjt3QkFDaEIsa0NBQWtDO3FCQUNyQztvQkFDRCxPQUFPLEVBQUU7d0JBQ0wsWUFBWTt3QkFDWixZQUFZO3dCQUNaLG9CQUFvQjt3QkFDcEIsV0FBVzt3QkFDWCxpQkFBaUI7d0JBQ2pCLGdCQUFnQjt3QkFDaEIsZ0JBQWdCO3dCQUNoQixnQkFBZ0I7d0JBQ2hCLHFCQUFxQjt3QkFDckIsa0JBQWtCO3dCQUNsQix3QkFBd0I7d0JBQ3hCLGdCQUFnQjt3QkFDaEIsc0JBQXNCO3dCQUN0QixrQkFBa0I7d0JBQ2xCLG9CQUFvQjt3QkFDcEIscUJBQXFCO3dCQUNyQiw0QkFBNEI7d0JBQzVCLCtCQUErQjt3QkFDL0IsbUJBQW1CO3dCQUNuQixzQkFBc0I7d0JBQ3RCLGtDQUFrQzt3QkFDbEMseUJBQXlCO3FCQUM1QjtpQkFDSiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQXZhdGFyTW9kdWxlIH0gZnJvbSAnLi4vYXRvbXMvYXZhdGFyL2F2YXRhci5tb2R1bGUnO1xuaW1wb3J0IHsgUGlsbHNNb2R1bGUgfSBmcm9tICcuL3BpbGxzL3BpbGxzLm1vZHVsZSc7XG5pbXBvcnQgeyBDb2xvclN3YXRjaE1vZHVsZSB9IGZyb20gJy4vY29sb3Itc3dhdGNoL2NvbG9yLXN3YXRjaC5tb2R1bGUnO1xuaW1wb3J0IHsgSWNvblN3YXRjaE1vZHVsZSB9IGZyb20gJy4vaWNvbi1zd2F0Y2gvaWNvbi1zd2F0Y2gubW9kdWxlJztcbmltcG9ydCB7IEJyZWFkY3J1bWJNb2R1bGUgfSBmcm9tICcuL2JyZWFkY3J1bWIvYnJlYWRjcnVtYi5tb2R1bGUnO1xuaW1wb3J0IHsgQ29udGV4dHVhbE1lbnVNb2R1bGUgfSBmcm9tICcuLi9hdG9tcy9jb250ZXh0dWFsLW1lbnUvY29udGV4dHVhbC1tZW51Lm1vZHVsZSc7XG5pbXBvcnQgeyBINVdpdGhJY29uTW9kdWxlIH0gZnJvbSAnLi9oNS13aXRoLWljb24vaDUtd2l0aC1pY29uLm1vZHVsZSc7XG5pbXBvcnQgeyBJbnZvaWNlTGluZUl0ZW1Nb2R1bGUgfSBmcm9tICcuL2ludm9pY2UtbGluZS1pdGVtL2ludm9pY2UtbGluZS1pdGVtLm1vZHVsZSc7XG5pbXBvcnQgeyBGZWVkYmFja0NhcmRNb2R1bGUgfSBmcm9tICcuL2ZlZWRiYWNrLWNhcmQvZmVlZGJhY2stY2FyZC5tb2R1bGUnO1xuaW1wb3J0IHsgU2Z4QWNjb3JkaW9uSGVhZGVyTW9kdWxlIH0gZnJvbSAnLi9zZngtYWNjb3JkaW9uLWhlYWRlci9zZngtYWNjb3JkaW9uLWhlYWRlci5tb2R1bGUnO1xuaW1wb3J0IHsgRmlsZVVwbG9hZE1vZHVsZSB9IGZyb20gJy4vZmlsZS11cGxvYWQvZmlsZS11cGxvYWQubW9kdWxlJztcbmltcG9ydCB7IEZpbGVVcGxvYWRTdGF0dXNNb2R1bGUgfSBmcm9tICcuL2ZpbGUtdXBsb2FkLXN0YXR1cy9maWxlLXVwbG9hZC1zdGF0dXMubW9kdWxlJztcbmltcG9ydCB7IEJ1dHRvbldpdGhJY29uTW9kdWxlIH0gZnJvbSAnLi9idXR0b24td2l0aC1pY29uL2J1dHRvbi13aXRoLWljb24ubW9kdWxlJztcbmltcG9ydCB7IEljb25XaXRoVG9vbHRpcE1vZHVsZSB9IGZyb20gJy4vaWNvbi13aXRoLXRvb2x0aXAvaWNvbi13aXRoLXRvb2x0aXAubW9kdWxlJztcbmltcG9ydCB7IERvY3VtZW50TWFuYWdlbWVudEl0ZW1Nb2R1bGUgfSBmcm9tICcuL2RvY3VtZW50LW1hbmFnZW1lbnQtaXRlbS9kb2N1bWVudC1tYW5hZ2VtZW50LWl0ZW0ubW9kdWxlJztcbmltcG9ydCB7IFBoYXNlckNhcmRNb2R1bGUgfSBmcm9tICcuL3BoYXNlci1jYXJkL3BoYXNlci1jYXJkLm1vZHVsZSc7XG5pbXBvcnQgeyBBY3Rpb25CYXJTZWxlY3Rpb25Db3VudGVyTW9kdWxlIH0gZnJvbSAnLi9hY3Rpb24tYmFyLXNlbGVjdGlvbi1jb3VudGVyL2FjdGlvbi1iYXItc2VsZWN0aW9uLWNvdW50ZXIubW9kdWxlJztcbmltcG9ydCB7IElucHV0VGV4dGFyZWFNb2R1bGUgfSBmcm9tIFwiLi4vYXRvbXMvaW5wdXQtdGV4dGFyZWEvaW5wdXQtdGV4dGFyZWEubW9kdWxlXCI7XG5pbXBvcnQgeyBDaGFyYWN0ZXJDb3VudGVyTW9kdWxlIH0gZnJvbSBcIi4uL2F0b21zL2NoYXJhY3Rlci1jb3VudGVyL2NoYXJhY3Rlci1jb3VudGVyLm1vZHVsZVwiO1xuaW1wb3J0IHsgU2V0dGluZ3NEZXRhaWxOYXZpZ2F0aW9uSXRlbU1vZHVsZSB9IGZyb20gJy4vc2V0dGluZ3MtZGV0YWlsLW5hdmlnYXRpb24taXRlbS9zZXR0aW5ncy1kZXRhaWwtbmF2aWdhdGlvbi1pdGVtLm1vZHVsZSc7XG5pbXBvcnQgeyBFZGl0YWJsZVNldHRpbmdJdGVtTW9kdWxlIH0gZnJvbSAnLi9lZGl0YWJsZS1zZXR0aW5nLWl0ZW0vZWRpdGFibGUtc2V0dGluZy1pdGVtLm1vZHVsZSc7XG5cbkBOZ01vZHVsZSh7XG4gICAgZGVjbGFyYXRpb25zOiBbXSxcbiAgICBleHBvcnRzOiBbXG4gICAgICAgIFBpbGxzTW9kdWxlLFxuICAgICAgICBCcmVhZGNydW1iTW9kdWxlLFxuICAgICAgICBGZWVkYmFja0NhcmRNb2R1bGUsXG4gICAgICAgIERvY3VtZW50TWFuYWdlbWVudEl0ZW1Nb2R1bGUsXG4gICAgICAgIFBoYXNlckNhcmRNb2R1bGUsXG4gICAgICAgIFNldHRpbmdzRGV0YWlsTmF2aWdhdGlvbkl0ZW1Nb2R1bGVcbiAgICBdLFxuICAgIGltcG9ydHM6IFtcbiAgICAgICAgQ29tbW9uTW9kdWxlLFxuICAgICAgICBBdmF0YXJNb2R1bGUsXG4gICAgICAgIENvbnRleHR1YWxNZW51TW9kdWxlLFxuICAgICAgICBQaWxsc01vZHVsZSxcbiAgICAgICAgQ29sb3JTd2F0Y2hNb2R1bGUsXG4gICAgICAgIEljb25Td2F0Y2hNb2R1bGUsXG4gICAgICAgIEJyZWFkY3J1bWJNb2R1bGUsXG4gICAgICAgIEg1V2l0aEljb25Nb2R1bGUsXG4gICAgICAgIEludm9pY2VMaW5lSXRlbU1vZHVsZSxcbiAgICAgICAgRmVlZGJhY2tDYXJkTW9kdWxlLFxuICAgICAgICBTZnhBY2NvcmRpb25IZWFkZXJNb2R1bGUsXG4gICAgICAgIEZpbGVVcGxvYWRNb2R1bGUsXG4gICAgICAgIEZpbGVVcGxvYWRTdGF0dXNNb2R1bGUsXG4gICAgICAgIEZlZWRiYWNrQ2FyZE1vZHVsZSxcbiAgICAgICAgQnV0dG9uV2l0aEljb25Nb2R1bGUsXG4gICAgICAgIEljb25XaXRoVG9vbHRpcE1vZHVsZSxcbiAgICAgICAgRG9jdW1lbnRNYW5hZ2VtZW50SXRlbU1vZHVsZSxcbiAgICAgICAgQWN0aW9uQmFyU2VsZWN0aW9uQ291bnRlck1vZHVsZSxcbiAgICAgICAgSW5wdXRUZXh0YXJlYU1vZHVsZSxcbiAgICAgICAgQ2hhcmFjdGVyQ291bnRlck1vZHVsZSxcbiAgICAgICAgU2V0dGluZ3NEZXRhaWxOYXZpZ2F0aW9uSXRlbU1vZHVsZSxcbiAgICAgICAgRWRpdGFibGVTZXR0aW5nSXRlbU1vZHVsZVxuICAgIF1cbn0pXG5leHBvcnQgY2xhc3MgTW9sZWN1bGVzTW9kdWxlIHt9XG4iXX0=

package/esm2020/lib/molecules/settings-detail-navigation-item/settings-detail-navigation-item.component.mjs CHANGED Viewed

@@ -3,6 +3,7 @@ import * as i0 from "@angular/core";
 import * as i1 from "../../atoms/paragraph/paragraph.component";
 import * as i2 from "../../atoms/icon/icon.component";
 import * as i3 from "@angular/common";
+import * as i4 from "../../pipe/trim-id.pipe";
 export class SettingsDetailNavigationItemComponent {
     constructor() {
         this.settingNavigationClicked = new EventEmitter();
@@ -12,13 +13,13 @@ export class SettingsDetailNavigationItemComponent {
     }
 }
 SettingsDetailNavigationItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SettingsDetailNavigationItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SettingsDetailNavigationItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: SettingsDetailNavigationItemComponent, selector: "symphony-settings-detail-navigation-item", inputs: { settingDetailNavigationModel: "settingDetailNavigationModel" }, outputs: { settingNavigationClicked: "settingNavigationClicked" }, ngImport: i0, template: "<div\n  class=\"setting-navigation-item-wrap sfx-cursor-pointer\"\n  [ngClass]=\"{ active: settingDetailNavigationModel.isActive }\"\n  (click)=\"onSettingNavigationClick($event)\"\n  title=\"{{ settingDetailNavigationModel.settingNavigationText }}\"\n>\n  <symphony-paragraph\n    [ngClass]=\"{ 'sfx-v2-purple1': settingDetailNavigationModel.isActive }\"\n    class=\"sfx-font-bold\"\n  >\n    {{ settingDetailNavigationModel.settingNavigationText }}\n  </symphony-paragraph>\n  <symphony-icon\n    [size]=\"'14px'\"\n    [icon]=\"'si-arrow-bold-next'\"\n    *ngIf=\"settingDetailNavigationModel.isActive\"\n    [ngClass]=\"{ 'sfx-v2-purple1': settingDetailNavigationModel.isActive }\"\n  ></symphony-icon>\n</div>\n", styles: [".setting-navigation-item-wrap{display:flex;justify-content:space-between;padding:10px 15px;border-radius:4px}.setting-navigation-item-wrap symphony-icon i{font-size:14px}.setting-navigation-item-wrap.active{background:#F3EFFF}.setting-navigation-item-wrap:hover{color:#712ace}\n"], components: [{ type: i1.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }, { type: i2.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+SettingsDetailNavigationItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: SettingsDetailNavigationItemComponent, selector: "symphony-settings-detail-navigation-item", inputs: { settingDetailNavigationModel: "settingDetailNavigationModel" }, outputs: { settingNavigationClicked: "settingNavigationClicked" }, ngImport: i0, template: "<div *ngIf=\"settingDetailNavigationModel\"\n  class=\"setting-navigation-item-wrap sfx-cursor-pointer\"\n  [ngClass]=\"{ active: settingDetailNavigationModel.isActive }\"\n  (click)=\"onSettingNavigationClick($event)\"\n  title=\"{{ settingDetailNavigationModel.settingNavigationText }}\"\n  id=\"navigation-tab-{{ settingDetailNavigationModel.settingNavigationText | trimId}}\"\n>\n  <symphony-paragraph\n    [ngClass]=\"{ 'sfx-v2-purple1': settingDetailNavigationModel.isActive }\"\n    class=\"sfx-font-bold\"\n  >\n    {{ settingDetailNavigationModel.settingNavigationText }}\n  </symphony-paragraph>\n  <symphony-icon\n    class=\"icon-position\"\n    [size]=\"'14px'\"\n    [icon]=\"'si-arrow-bold-next'\"\n    *ngIf=\"settingDetailNavigationModel.isActive\"\n    [ngClass]=\"{ 'sfx-v2-purple1': settingDetailNavigationModel.isActive }\"\n  ></symphony-icon>\n</div>\n", styles: [".setting-navigation-item-wrap{display:flex;justify-content:space-between;padding:10px 15px;border-radius:4px}.setting-navigation-item-wrap .icon-position{position:relative;top:2px}.setting-navigation-item-wrap.active{background:#f3efff}.setting-navigation-item-wrap:hover{color:#712ace}\n"], components: [{ type: i1.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }, { type: i2.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "trimId": i4.TrimIdPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SettingsDetailNavigationItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'symphony-settings-detail-navigation-item', template: "<div\n  class=\"setting-navigation-item-wrap sfx-cursor-pointer\"\n  [ngClass]=\"{ active: settingDetailNavigationModel.isActive }\"\n  (click)=\"onSettingNavigationClick($event)\"\n  title=\"{{ settingDetailNavigationModel.settingNavigationText }}\"\n>\n  <symphony-paragraph\n    [ngClass]=\"{ 'sfx-v2-purple1': settingDetailNavigationModel.isActive }\"\n    class=\"sfx-font-bold\"\n  >\n    {{ settingDetailNavigationModel.settingNavigationText }}\n  </symphony-paragraph>\n  <symphony-icon\n    [size]=\"'14px'\"\n    [icon]=\"'si-arrow-bold-next'\"\n    *ngIf=\"settingDetailNavigationModel.isActive\"\n    [ngClass]=\"{ 'sfx-v2-purple1': settingDetailNavigationModel.isActive }\"\n  ></symphony-icon>\n</div>\n", styles: [".setting-navigation-item-wrap{display:flex;justify-content:space-between;padding:10px 15px;border-radius:4px}.setting-navigation-item-wrap symphony-icon i{font-size:14px}.setting-navigation-item-wrap.active{background:#F3EFFF}.setting-navigation-item-wrap:hover{color:#712ace}\n"] }]
+            args: [{ selector: 'symphony-settings-detail-navigation-item', template: "<div *ngIf=\"settingDetailNavigationModel\"\n  class=\"setting-navigation-item-wrap sfx-cursor-pointer\"\n  [ngClass]=\"{ active: settingDetailNavigationModel.isActive }\"\n  (click)=\"onSettingNavigationClick($event)\"\n  title=\"{{ settingDetailNavigationModel.settingNavigationText }}\"\n  id=\"navigation-tab-{{ settingDetailNavigationModel.settingNavigationText | trimId}}\"\n>\n  <symphony-paragraph\n    [ngClass]=\"{ 'sfx-v2-purple1': settingDetailNavigationModel.isActive }\"\n    class=\"sfx-font-bold\"\n  >\n    {{ settingDetailNavigationModel.settingNavigationText }}\n  </symphony-paragraph>\n  <symphony-icon\n    class=\"icon-position\"\n    [size]=\"'14px'\"\n    [icon]=\"'si-arrow-bold-next'\"\n    *ngIf=\"settingDetailNavigationModel.isActive\"\n    [ngClass]=\"{ 'sfx-v2-purple1': settingDetailNavigationModel.isActive }\"\n  ></symphony-icon>\n</div>\n", styles: [".setting-navigation-item-wrap{display:flex;justify-content:space-between;padding:10px 15px;border-radius:4px}.setting-navigation-item-wrap .icon-position{position:relative;top:2px}.setting-navigation-item-wrap.active{background:#f3efff}.setting-navigation-item-wrap:hover{color:#712ace}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { settingDetailNavigationModel: [{
                 type: Input
             }], settingNavigationClicked: [{
                 type: Output
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2V0dGluZ3MtZGV0YWlsLW5hdmlnYXRpb24taXRlbS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL21vbGVjdWxlcy9zZXR0aW5ncy1kZXRhaWwtbmF2aWdhdGlvbi1pdGVtL3NldHRpbmdzLWRldGFpbC1uYXZpZ2F0aW9uLWl0ZW0uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29tcG9uZW50LWxpYnJhcnkvc3JjL2xpYi9tb2xlY3VsZXMvc2V0dGluZ3MtZGV0YWlsLW5hdmlnYXRpb24taXRlbS9zZXR0aW5ncy1kZXRhaWwtbmF2aWdhdGlvbi1pdGVtLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBVSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7Ozs7O0FBUS9FLE1BQU0sT0FBTyxxQ0FBcUM7SUFJaEQ7UUFGVSw2QkFBd0IsR0FBRyxJQUFJLFlBQVksRUFBZ0MsQ0FBQztJQUV2RSxDQUFDO0lBQ2hCLHdCQUF3QixDQUFDLDRCQUE0QjtRQUNuRCxJQUFJLENBQUMsd0JBQXdCLENBQUMsSUFBSSxDQUFDLDRCQUE0QixDQUFDLENBQUM7SUFDbkUsQ0FBQzs7a0lBUFUscUNBQXFDO3NIQUFyQyxxQ0FBcUMsNk5DUmxELCtzQkFtQkE7MkZEWGEscUNBQXFDO2tCQUxqRCxTQUFTOytCQUNFLDBDQUEwQzswRUFLM0MsNEJBQTRCO3NCQUFwQyxLQUFLO2dCQUNJLHdCQUF3QjtzQkFBakMsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT25Jbml0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFNldHRpbmdEZXRhaWxOYXZpZ2F0aW9uTW9kZWwgfSBmcm9tICcuL3NldHRpbmdzLWRldGFpbC1uYXZpZ2F0aW9uLWl0ZW0ubW9kZWwnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdzeW1waG9ueS1zZXR0aW5ncy1kZXRhaWwtbmF2aWdhdGlvbi1pdGVtJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3NldHRpbmdzLWRldGFpbC1uYXZpZ2F0aW9uLWl0ZW0uY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9zZXR0aW5ncy1kZXRhaWwtbmF2aWdhdGlvbi1pdGVtLmNvbXBvbmVudC5zY3NzJ10sXG59KVxuZXhwb3J0IGNsYXNzIFNldHRpbmdzRGV0YWlsTmF2aWdhdGlvbkl0ZW1Db21wb25lbnQge1xuICBASW5wdXQoKSBzZXR0aW5nRGV0YWlsTmF2aWdhdGlvbk1vZGVsOiBTZXR0aW5nRGV0YWlsTmF2aWdhdGlvbk1vZGVsO1xuICBAT3V0cHV0KCkgc2V0dGluZ05hdmlnYXRpb25DbGlja2VkID0gbmV3IEV2ZW50RW1pdHRlcjxTZXR0aW5nRGV0YWlsTmF2aWdhdGlvbk1vZGVsPigpO1xuXG4gIGNvbnN0cnVjdG9yKCkge31cbiAgb25TZXR0aW5nTmF2aWdhdGlvbkNsaWNrKFNldHRpbmdEZXRhaWxOYXZpZ2F0aW9uTW9kZWwpIHtcbiAgICB0aGlzLnNldHRpbmdOYXZpZ2F0aW9uQ2xpY2tlZC5lbWl0KFNldHRpbmdEZXRhaWxOYXZpZ2F0aW9uTW9kZWwpO1xuICB9XG59XG4iLCI8ZGl2XG4gIGNsYXNzPVwic2V0dGluZy1uYXZpZ2F0aW9uLWl0ZW0td3JhcCBzZngtY3Vyc29yLXBvaW50ZXJcIlxuICBbbmdDbGFzc109XCJ7IGFjdGl2ZTogc2V0dGluZ0RldGFpbE5hdmlnYXRpb25Nb2RlbC5pc0FjdGl2ZSB9XCJcbiAgKGNsaWNrKT1cIm9uU2V0dGluZ05hdmlnYXRpb25DbGljaygkZXZlbnQpXCJcbiAgdGl0bGU9XCJ7eyBzZXR0aW5nRGV0YWlsTmF2aWdhdGlvbk1vZGVsLnNldHRpbmdOYXZpZ2F0aW9uVGV4dCB9fVwiXG4+XG4gIDxzeW1waG9ueS1wYXJhZ3JhcGhcbiAgICBbbmdDbGFzc109XCJ7ICdzZngtdjItcHVycGxlMSc6IHNldHRpbmdEZXRhaWxOYXZpZ2F0aW9uTW9kZWwuaXNBY3RpdmUgfVwiXG4gICAgY2xhc3M9XCJzZngtZm9udC1ib2xkXCJcbiAgPlxuICAgIHt7IHNldHRpbmdEZXRhaWxOYXZpZ2F0aW9uTW9kZWwuc2V0dGluZ05hdmlnYXRpb25UZXh0IH19XG4gIDwvc3ltcGhvbnktcGFyYWdyYXBoPlxuICA8c3ltcGhvbnktaWNvblxuICAgIFtzaXplXT1cIicxNHB4J1wiXG4gICAgW2ljb25dPVwiJ3NpLWFycm93LWJvbGQtbmV4dCdcIlxuICAgICpuZ0lmPVwic2V0dGluZ0RldGFpbE5hdmlnYXRpb25Nb2RlbC5pc0FjdGl2ZVwiXG4gICAgW25nQ2xhc3NdPVwieyAnc2Z4LXYyLXB1cnBsZTEnOiBzZXR0aW5nRGV0YWlsTmF2aWdhdGlvbk1vZGVsLmlzQWN0aXZlIH1cIlxuICA+PC9zeW1waG9ueS1pY29uPlxuPC9kaXY+XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2V0dGluZ3MtZGV0YWlsLW5hdmlnYXRpb24taXRlbS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL21vbGVjdWxlcy9zZXR0aW5ncy1kZXRhaWwtbmF2aWdhdGlvbi1pdGVtL3NldHRpbmdzLWRldGFpbC1uYXZpZ2F0aW9uLWl0ZW0uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29tcG9uZW50LWxpYnJhcnkvc3JjL2xpYi9tb2xlY3VsZXMvc2V0dGluZ3MtZGV0YWlsLW5hdmlnYXRpb24taXRlbS9zZXR0aW5ncy1kZXRhaWwtbmF2aWdhdGlvbi1pdGVtLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBVSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7Ozs7OztBQVEvRSxNQUFNLE9BQU8scUNBQXFDO0lBSWhEO1FBRlUsNkJBQXdCLEdBQUcsSUFBSSxZQUFZLEVBQWdDLENBQUM7SUFFdkUsQ0FBQztJQUNoQix3QkFBd0IsQ0FBQyw0QkFBNEI7UUFDbkQsSUFBSSxDQUFDLHdCQUF3QixDQUFDLElBQUksQ0FBQyw0QkFBNEIsQ0FBQyxDQUFDO0lBQ25FLENBQUM7O2tJQVBVLHFDQUFxQztzSEFBckMscUNBQXFDLDZOQ1JsRCw2MkJBcUJBOzJGRGJhLHFDQUFxQztrQkFMakQsU0FBUzsrQkFDRSwwQ0FBMEM7MEVBSzNDLDRCQUE0QjtzQkFBcEMsS0FBSztnQkFDSSx3QkFBd0I7c0JBQWpDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE9uSW5pdCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBTZXR0aW5nRGV0YWlsTmF2aWdhdGlvbk1vZGVsIH0gZnJvbSAnLi9zZXR0aW5ncy1kZXRhaWwtbmF2aWdhdGlvbi1pdGVtLm1vZGVsJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc3ltcGhvbnktc2V0dGluZ3MtZGV0YWlsLW5hdmlnYXRpb24taXRlbScsXG4gIHRlbXBsYXRlVXJsOiAnLi9zZXR0aW5ncy1kZXRhaWwtbmF2aWdhdGlvbi1pdGVtLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vc2V0dGluZ3MtZGV0YWlsLW5hdmlnYXRpb24taXRlbS5jb21wb25lbnQuc2NzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBTZXR0aW5nc0RldGFpbE5hdmlnYXRpb25JdGVtQ29tcG9uZW50IHtcbiAgQElucHV0KCkgc2V0dGluZ0RldGFpbE5hdmlnYXRpb25Nb2RlbDogU2V0dGluZ0RldGFpbE5hdmlnYXRpb25Nb2RlbDtcbiAgQE91dHB1dCgpIHNldHRpbmdOYXZpZ2F0aW9uQ2xpY2tlZCA9IG5ldyBFdmVudEVtaXR0ZXI8U2V0dGluZ0RldGFpbE5hdmlnYXRpb25Nb2RlbD4oKTtcblxuICBjb25zdHJ1Y3RvcigpIHt9XG4gIG9uU2V0dGluZ05hdmlnYXRpb25DbGljayhTZXR0aW5nRGV0YWlsTmF2aWdhdGlvbk1vZGVsKSB7XG4gICAgdGhpcy5zZXR0aW5nTmF2aWdhdGlvbkNsaWNrZWQuZW1pdChTZXR0aW5nRGV0YWlsTmF2aWdhdGlvbk1vZGVsKTtcbiAgfVxufVxuIiwiPGRpdiAqbmdJZj1cInNldHRpbmdEZXRhaWxOYXZpZ2F0aW9uTW9kZWxcIlxuICBjbGFzcz1cInNldHRpbmctbmF2aWdhdGlvbi1pdGVtLXdyYXAgc2Z4LWN1cnNvci1wb2ludGVyXCJcbiAgW25nQ2xhc3NdPVwieyBhY3RpdmU6IHNldHRpbmdEZXRhaWxOYXZpZ2F0aW9uTW9kZWwuaXNBY3RpdmUgfVwiXG4gIChjbGljayk9XCJvblNldHRpbmdOYXZpZ2F0aW9uQ2xpY2soJGV2ZW50KVwiXG4gIHRpdGxlPVwie3sgc2V0dGluZ0RldGFpbE5hdmlnYXRpb25Nb2RlbC5zZXR0aW5nTmF2aWdhdGlvblRleHQgfX1cIlxuICBpZD1cIm5hdmlnYXRpb24tdGFiLXt7IHNldHRpbmdEZXRhaWxOYXZpZ2F0aW9uTW9kZWwuc2V0dGluZ05hdmlnYXRpb25UZXh0IHwgdHJpbUlkfX1cIlxuPlxuICA8c3ltcGhvbnktcGFyYWdyYXBoXG4gICAgW25nQ2xhc3NdPVwieyAnc2Z4LXYyLXB1cnBsZTEnOiBzZXR0aW5nRGV0YWlsTmF2aWdhdGlvbk1vZGVsLmlzQWN0aXZlIH1cIlxuICAgIGNsYXNzPVwic2Z4LWZvbnQtYm9sZFwiXG4gID5cbiAgICB7eyBzZXR0aW5nRGV0YWlsTmF2aWdhdGlvbk1vZGVsLnNldHRpbmdOYXZpZ2F0aW9uVGV4dCB9fVxuICA8L3N5bXBob255LXBhcmFncmFwaD5cbiAgPHN5bXBob255LWljb25cbiAgICBjbGFzcz1cImljb24tcG9zaXRpb25cIlxuICAgIFtzaXplXT1cIicxNHB4J1wiXG4gICAgW2ljb25dPVwiJ3NpLWFycm93LWJvbGQtbmV4dCdcIlxuICAgICpuZ0lmPVwic2V0dGluZ0RldGFpbE5hdmlnYXRpb25Nb2RlbC5pc0FjdGl2ZVwiXG4gICAgW25nQ2xhc3NdPVwieyAnc2Z4LXYyLXB1cnBsZTEnOiBzZXR0aW5nRGV0YWlsTmF2aWdhdGlvbk1vZGVsLmlzQWN0aXZlIH1cIlxuICA+PC9zeW1waG9ueS1pY29uPlxuPC9kaXY+XG4iXX0=

package/esm2020/lib/molecules/settings-detail-navigation-item/settings-detail-navigation-item.module.mjs CHANGED Viewed

@@ -3,18 +3,19 @@ import { CommonModule } from '@angular/common';
 import { SettingsDetailNavigationItemComponent } from './settings-detail-navigation-item.component';
 import { IconModule } from '../../atoms/icon/icon.module';
 import { ParagraphModule } from '../../atoms/paragraph/paragraph.module';
+import { PipeModule } from '../../pipe/pipe.module';
 import * as i0 from "@angular/core";
 export class SettingsDetailNavigationItemModule {
 }
 SettingsDetailNavigationItemModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SettingsDetailNavigationItemModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-SettingsDetailNavigationItemModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SettingsDetailNavigationItemModule, declarations: [SettingsDetailNavigationItemComponent], imports: [CommonModule, IconModule, ParagraphModule], exports: [SettingsDetailNavigationItemComponent] });
-SettingsDetailNavigationItemModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SettingsDetailNavigationItemModule, imports: [[CommonModule, IconModule, ParagraphModule]] });
+SettingsDetailNavigationItemModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SettingsDetailNavigationItemModule, declarations: [SettingsDetailNavigationItemComponent], imports: [CommonModule, IconModule, ParagraphModule, PipeModule], exports: [SettingsDetailNavigationItemComponent] });
+SettingsDetailNavigationItemModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SettingsDetailNavigationItemModule, imports: [[CommonModule, IconModule, ParagraphModule, PipeModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SettingsDetailNavigationItemModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [SettingsDetailNavigationItemComponent],
-                    imports: [CommonModule, IconModule, ParagraphModule],
+                    imports: [CommonModule, IconModule, ParagraphModule, PipeModule],
                     exports: [SettingsDetailNavigationItemComponent],
                 }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2V0dGluZ3MtZGV0YWlsLW5hdmlnYXRpb24taXRlbS5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL21vbGVjdWxlcy9zZXR0aW5ncy1kZXRhaWwtbmF2aWdhdGlvbi1pdGVtL3NldHRpbmdzLWRldGFpbC1uYXZpZ2F0aW9uLWl0ZW0ubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxxQ0FBcUMsRUFBRSxNQUFNLDZDQUE2QyxDQUFDO0FBQ3BHLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQztBQUMxRCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sd0NBQXdDLENBQUM7O0FBT3pFLE1BQU0sT0FBTyxrQ0FBa0M7OytIQUFsQyxrQ0FBa0M7Z0lBQWxDLGtDQUFrQyxpQkFKOUIscUNBQXFDLGFBQzFDLFlBQVksRUFBRSxVQUFVLEVBQUUsZUFBZSxhQUN6QyxxQ0FBcUM7Z0lBRXBDLGtDQUFrQyxZQUhwQyxDQUFDLFlBQVksRUFBRSxVQUFVLEVBQUUsZUFBZSxDQUFDOzJGQUd6QyxrQ0FBa0M7a0JBTDlDLFFBQVE7bUJBQUM7b0JBQ1IsWUFBWSxFQUFFLENBQUMscUNBQXFDLENBQUM7b0JBQ3JELE9BQU8sRUFBRSxDQUFDLFlBQVksRUFBRSxVQUFVLEVBQUUsZUFBZSxDQUFDO29CQUNwRCxPQUFPLEVBQUUsQ0FBQyxxQ0FBcUMsQ0FBQztpQkFDakQiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IFNldHRpbmdzRGV0YWlsTmF2aWdhdGlvbkl0ZW1Db21wb25lbnQgfSBmcm9tICcuL3NldHRpbmdzLWRldGFpbC1uYXZpZ2F0aW9uLWl0ZW0uY29tcG9uZW50JztcbmltcG9ydCB7IEljb25Nb2R1bGUgfSBmcm9tICcuLi8uLi9hdG9tcy9pY29uL2ljb24ubW9kdWxlJztcbmltcG9ydCB7IFBhcmFncmFwaE1vZHVsZSB9IGZyb20gJy4uLy4uL2F0b21zL3BhcmFncmFwaC9wYXJhZ3JhcGgubW9kdWxlJztcblxuQE5nTW9kdWxlKHtcbiAgZGVjbGFyYXRpb25zOiBbU2V0dGluZ3NEZXRhaWxOYXZpZ2F0aW9uSXRlbUNvbXBvbmVudF0sXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIEljb25Nb2R1bGUsIFBhcmFncmFwaE1vZHVsZV0sXG4gIGV4cG9ydHM6IFtTZXR0aW5nc0RldGFpbE5hdmlnYXRpb25JdGVtQ29tcG9uZW50XSxcbn0pXG5leHBvcnQgY2xhc3MgU2V0dGluZ3NEZXRhaWxOYXZpZ2F0aW9uSXRlbU1vZHVsZSB7fVxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2V0dGluZ3MtZGV0YWlsLW5hdmlnYXRpb24taXRlbS5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb21wb25lbnQtbGlicmFyeS9zcmMvbGliL21vbGVjdWxlcy9zZXR0aW5ncy1kZXRhaWwtbmF2aWdhdGlvbi1pdGVtL3NldHRpbmdzLWRldGFpbC1uYXZpZ2F0aW9uLWl0ZW0ubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxxQ0FBcUMsRUFBRSxNQUFNLDZDQUE2QyxDQUFDO0FBQ3BHLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQztBQUMxRCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sd0NBQXdDLENBQUM7QUFDekUsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLHdCQUF3QixDQUFDOztBQU9wRCxNQUFNLE9BQU8sa0NBQWtDOzsrSEFBbEMsa0NBQWtDO2dJQUFsQyxrQ0FBa0MsaUJBSjlCLHFDQUFxQyxhQUMxQyxZQUFZLEVBQUUsVUFBVSxFQUFFLGVBQWUsRUFBRSxVQUFVLGFBQ3JELHFDQUFxQztnSUFFcEMsa0NBQWtDLFlBSHBDLENBQUMsWUFBWSxFQUFFLFVBQVUsRUFBRSxlQUFlLEVBQUUsVUFBVSxDQUFDOzJGQUdyRCxrQ0FBa0M7a0JBTDlDLFFBQVE7bUJBQUM7b0JBQ1IsWUFBWSxFQUFFLENBQUMscUNBQXFDLENBQUM7b0JBQ3JELE9BQU8sRUFBRSxDQUFDLFlBQVksRUFBRSxVQUFVLEVBQUUsZUFBZSxFQUFFLFVBQVUsQ0FBQztvQkFDaEUsT0FBTyxFQUFFLENBQUMscUNBQXFDLENBQUM7aUJBQ2pEIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBTZXR0aW5nc0RldGFpbE5hdmlnYXRpb25JdGVtQ29tcG9uZW50IH0gZnJvbSAnLi9zZXR0aW5ncy1kZXRhaWwtbmF2aWdhdGlvbi1pdGVtLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBJY29uTW9kdWxlIH0gZnJvbSAnLi4vLi4vYXRvbXMvaWNvbi9pY29uLm1vZHVsZSc7XG5pbXBvcnQgeyBQYXJhZ3JhcGhNb2R1bGUgfSBmcm9tICcuLi8uLi9hdG9tcy9wYXJhZ3JhcGgvcGFyYWdyYXBoLm1vZHVsZSc7XG5pbXBvcnQgeyBQaXBlTW9kdWxlIH0gZnJvbSAnLi4vLi4vcGlwZS9waXBlLm1vZHVsZSc7XG5cbkBOZ01vZHVsZSh7XG4gIGRlY2xhcmF0aW9uczogW1NldHRpbmdzRGV0YWlsTmF2aWdhdGlvbkl0ZW1Db21wb25lbnRdLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBJY29uTW9kdWxlLCBQYXJhZ3JhcGhNb2R1bGUsIFBpcGVNb2R1bGVdLFxuICBleHBvcnRzOiBbU2V0dGluZ3NEZXRhaWxOYXZpZ2F0aW9uSXRlbUNvbXBvbmVudF0sXG59KVxuZXhwb3J0IGNsYXNzIFNldHRpbmdzRGV0YWlsTmF2aWdhdGlvbkl0ZW1Nb2R1bGUge31cbiJdfQ==

package/esm2020/lib/organisms/document-management-list/document-management-list.component.mjs CHANGED Viewed

@@ -23,7 +23,7 @@ export class DocumentManagementListComponent {
     }
 }
 DocumentManagementListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: DocumentManagementListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DocumentManagementListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: DocumentManagementListComponent, selector: "symphony-document-management-list", inputs: { isLoading: "isLoading", documentManagementList: "documentManagementList" }, outputs: { moreOptionClick: "moreOptionClick", previewClick: "previewClick", uploadClick: "uploadClick" }, ngImport: i0, template: "<section class=\"sf-d-block sfx-pb-20 sfx-border-bottom-black-5\">\n  <div class=\"dml-title-wrap\">\n    <symphony-h3 class=\"sfx-d-block sfx-pt-5\">Documents</symphony-h3>\n    <symphony-icon-wrapper (click)=\"onUploadClick()\"\n    class=\"dml-title-icon-right\"\n  >\n    <symphony-icon [icon]=\"'si-add'\"></symphony-icon>\n  </symphony-icon-wrapper>\n  </div>\n  <ul *ngIf=\"!isLoading\" class=\"list-unstyled dml-wrap\">\n    <li *ngFor=\"let dmItem of documentManagementList\">\n      <symphony-document-management-item\n        [documentManagementItemModel]=\"dmItem\"\n        (moreOptionClicked)=\"onMoreClick($event, dmItem)\"\n        (previewClicked)=\"onPreviewClick($event, dmItem)\"\n      ></symphony-document-management-item>\n    </li>\n  </ul>\n  <div *ngIf=\"isLoading\">\n    <symphony-sfx-loader></symphony-sfx-loader>\n  </div>\n</section>\n", styles: [".dml-wrap::-webkit-scrollbar{width:12px}.dml-wrap::-webkit-scrollbar-track{box-shadow:inset 0 0 3px transparent;border-radius:30px}.dml-wrap::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:30px}.dml-wrap::-webkit-scrollbar-thumb:hover{cursor:pointer}.dml-wrap li{border-bottom:1px solid #bababa}.dml-wrap li:last-child{border-color:transparent}.dml-title-wrap{position:relative;margin-bottom:20px}.dml-title-wrap .dml-title-icon-right{position:absolute;top:0;right:0}\n"], components: [{ type: i1.H3Component, selector: "symphony-h3", inputs: ["text", "isSecondary"] }, { type: i2.IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["isInverse", "hasHoverWithoutBorder"], outputs: ["clicked"] }, { type: i3.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i4.DocumentManagementItemComponent, selector: "symphony-document-management-item", inputs: ["documentManagementItemModel"], outputs: ["previewClicked", "moreOptionClicked"] }, { type: i5.SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: ["leftStyle", "message"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+DocumentManagementListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: DocumentManagementListComponent, selector: "symphony-document-management-list", inputs: { isLoading: "isLoading", documentManagementList: "documentManagementList" }, outputs: { moreOptionClick: "moreOptionClick", previewClick: "previewClick", uploadClick: "uploadClick" }, ngImport: i0, template: "<section class=\"sf-d-block sfx-pb-20 sfx-border-bottom-black-5\">\n  <div class=\"dml-title-wrap\">\n    <symphony-h3 class=\"sfx-d-block sfx-pt-5\">Documents</symphony-h3>\n    <symphony-icon-wrapper (click)=\"onUploadClick()\"\n    class=\"dml-title-icon-right\"\n  >\n    <symphony-icon [icon]=\"'si-add'\"></symphony-icon>\n  </symphony-icon-wrapper>\n  </div>\n  <ul *ngIf=\"!isLoading\" class=\"list-unstyled dml-wrap\">\n    <li *ngFor=\"let dmItem of documentManagementList\">\n      <symphony-document-management-item\n        [documentManagementItemModel]=\"dmItem\"\n        (moreOptionClicked)=\"onMoreClick($event, dmItem)\"\n        (previewClicked)=\"onPreviewClick($event, dmItem)\"\n      ></symphony-document-management-item>\n    </li>\n  </ul>\n  <div *ngIf=\"isLoading\">\n    <symphony-sfx-loader></symphony-sfx-loader>\n  </div>\n</section>\n", styles: [".dml-wrap::-webkit-scrollbar{width:12px}.dml-wrap::-webkit-scrollbar-track{box-shadow:inset 0 0 3px transparent;border-radius:30px}.dml-wrap::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:30px}.dml-wrap::-webkit-scrollbar-thumb:hover{cursor:pointer}.dml-wrap li{border-bottom:1px solid #bababa}.dml-wrap li:last-child{border-color:transparent}.dml-title-wrap{position:relative;margin-bottom:20px}.dml-title-wrap .dml-title-icon-right{position:absolute;top:0;right:0}\n"], components: [{ type: i1.H3Component, selector: "symphony-h3", inputs: ["text", "isSecondary"] }, { type: i2.IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["isInverse", "hasHoverWithoutBorder"], outputs: ["clicked"] }, { type: i3.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i4.DocumentManagementItemComponent, selector: "symphony-document-management-item", inputs: ["documentManagementItemModel"], outputs: ["previewClicked", "moreOptionClicked"] }, { type: i5.SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: ["leftStyle", "message", "hasCustomMessage"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: DocumentManagementListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'symphony-document-management-list', template: "<section class=\"sf-d-block sfx-pb-20 sfx-border-bottom-black-5\">\n  <div class=\"dml-title-wrap\">\n    <symphony-h3 class=\"sfx-d-block sfx-pt-5\">Documents</symphony-h3>\n    <symphony-icon-wrapper (click)=\"onUploadClick()\"\n    class=\"dml-title-icon-right\"\n  >\n    <symphony-icon [icon]=\"'si-add'\"></symphony-icon>\n  </symphony-icon-wrapper>\n  </div>\n  <ul *ngIf=\"!isLoading\" class=\"list-unstyled dml-wrap\">\n    <li *ngFor=\"let dmItem of documentManagementList\">\n      <symphony-document-management-item\n        [documentManagementItemModel]=\"dmItem\"\n        (moreOptionClicked)=\"onMoreClick($event, dmItem)\"\n        (previewClicked)=\"onPreviewClick($event, dmItem)\"\n      ></symphony-document-management-item>\n    </li>\n  </ul>\n  <div *ngIf=\"isLoading\">\n    <symphony-sfx-loader></symphony-sfx-loader>\n  </div>\n</section>\n", styles: [".dml-wrap::-webkit-scrollbar{width:12px}.dml-wrap::-webkit-scrollbar-track{box-shadow:inset 0 0 3px transparent;border-radius:30px}.dml-wrap::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:30px}.dml-wrap::-webkit-scrollbar-thumb:hover{cursor:pointer}.dml-wrap li{border-bottom:1px solid #bababa}.dml-wrap li:last-child{border-color:transparent}.dml-title-wrap{position:relative;margin-bottom:20px}.dml-title-wrap .dml-title-icon-right{position:absolute;top:0;right:0}\n"] }]

package/esm2020/lib/organisms/editable-setting-item-list/editable-setting-item-list.component.mjs ADDED Viewed

@@ -0,0 +1,23 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "../../molecules/editable-setting-item/editable-setting-item.component";
+import * as i2 from "@angular/common";
+export class EditableSettingItemListComponent {
+    constructor() {
+        this.settingItemValueChanged = new EventEmitter();
+    }
+    onSettingItemValueChange(settingItemsList) {
+        this.settingItemValueChanged.emit(settingItemsList);
+    }
+}
+EditableSettingItemListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: EditableSettingItemListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+EditableSettingItemListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: EditableSettingItemListComponent, selector: "symphony-editable-setting-item-list", inputs: { settingItemsList: "settingItemsList" }, outputs: { settingItemValueChanged: "settingItemValueChanged" }, ngImport: i0, template: "<symphony-editable-setting-item\n  *ngFor=\"let settingItem of settingItemsList\"\n  [editableSettingItemModel]=\"settingItem\"\n  (valueChanged)=\"onSettingItemValueChange($event)\"\n></symphony-editable-setting-item>\n", styles: [""], components: [{ type: i1.EditableSettingItemComponent, selector: "symphony-editable-setting-item", inputs: ["editableSettingItemModel"], outputs: ["valueChanged"] }], directives: [{ type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: EditableSettingItemListComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'symphony-editable-setting-item-list', template: "<symphony-editable-setting-item\n  *ngFor=\"let settingItem of settingItemsList\"\n  [editableSettingItemModel]=\"settingItem\"\n  (valueChanged)=\"onSettingItemValueChange($event)\"\n></symphony-editable-setting-item>\n", styles: [""] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { settingItemsList: [{
+                type: Input
+            }], settingItemValueChanged: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZWRpdGFibGUtc2V0dGluZy1pdGVtLWxpc3QuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29tcG9uZW50LWxpYnJhcnkvc3JjL2xpYi9vcmdhbmlzbXMvZWRpdGFibGUtc2V0dGluZy1pdGVtLWxpc3QvZWRpdGFibGUtc2V0dGluZy1pdGVtLWxpc3QuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29tcG9uZW50LWxpYnJhcnkvc3JjL2xpYi9vcmdhbmlzbXMvZWRpdGFibGUtc2V0dGluZy1pdGVtLWxpc3QvZWRpdGFibGUtc2V0dGluZy1pdGVtLWxpc3QuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQzs7OztBQVF2RSxNQUFNLE9BQU8sZ0NBQWdDO0lBSTNDO1FBRlUsNEJBQXVCLEdBQy9CLElBQUksWUFBWSxFQUE0QixDQUFDO0lBQ2hDLENBQUM7SUFDaEIsd0JBQXdCLENBQUMsZ0JBQTBDO1FBQ2pFLElBQUksQ0FBQyx1QkFBdUIsQ0FBQyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsQ0FBQztJQUN0RCxDQUFDOzs2SEFQVSxnQ0FBZ0M7aUhBQWhDLGdDQUFnQyw4TENSN0MsOE5BS0E7MkZER2EsZ0NBQWdDO2tCQUw1QyxTQUFTOytCQUNFLHFDQUFxQzswRUFLdEMsZ0JBQWdCO3NCQUF4QixLQUFLO2dCQUNJLHVCQUF1QjtzQkFBaEMsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBFZGl0YWJsZVNldHRpbmdJdGVtTW9kZWwgfSBmcm9tICcuLi8uLi9tb2xlY3VsZXMvZWRpdGFibGUtc2V0dGluZy1pdGVtL2VkaXRhYmxlLXNldHRpbmctaXRlbS5jb21wb25lbnQubW9kZWwnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdzeW1waG9ueS1lZGl0YWJsZS1zZXR0aW5nLWl0ZW0tbGlzdCcsXG4gIHRlbXBsYXRlVXJsOiAnLi9lZGl0YWJsZS1zZXR0aW5nLWl0ZW0tbGlzdC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2VkaXRhYmxlLXNldHRpbmctaXRlbS1saXN0LmNvbXBvbmVudC5zY3NzJ10sXG59KVxuZXhwb3J0IGNsYXNzIEVkaXRhYmxlU2V0dGluZ0l0ZW1MaXN0Q29tcG9uZW50IHtcbiAgQElucHV0KCkgc2V0dGluZ0l0ZW1zTGlzdDogRWRpdGFibGVTZXR0aW5nSXRlbU1vZGVsW107XG4gIEBPdXRwdXQoKSBzZXR0aW5nSXRlbVZhbHVlQ2hhbmdlZCA9XG4gICAgbmV3IEV2ZW50RW1pdHRlcjxFZGl0YWJsZVNldHRpbmdJdGVtTW9kZWw+KCk7XG4gIGNvbnN0cnVjdG9yKCkge31cbiAgb25TZXR0aW5nSXRlbVZhbHVlQ2hhbmdlKHNldHRpbmdJdGVtc0xpc3Q6IEVkaXRhYmxlU2V0dGluZ0l0ZW1Nb2RlbCkge1xuICAgIHRoaXMuc2V0dGluZ0l0ZW1WYWx1ZUNoYW5nZWQuZW1pdChzZXR0aW5nSXRlbXNMaXN0KTtcbiAgfVxufVxuIiwiPHN5bXBob255LWVkaXRhYmxlLXNldHRpbmctaXRlbVxuICAqbmdGb3I9XCJsZXQgc2V0dGluZ0l0ZW0gb2Ygc2V0dGluZ0l0ZW1zTGlzdFwiXG4gIFtlZGl0YWJsZVNldHRpbmdJdGVtTW9kZWxdPVwic2V0dGluZ0l0ZW1cIlxuICAodmFsdWVDaGFuZ2VkKT1cIm9uU2V0dGluZ0l0ZW1WYWx1ZUNoYW5nZSgkZXZlbnQpXCJcbj48L3N5bXBob255LWVkaXRhYmxlLXNldHRpbmctaXRlbT5cbiJdfQ==