@symphony-talent/component-library 4.108.0 → 4.110.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 (19) hide show
  1. package/esm2020/lib/atoms/input-radio-toggle/input-radio-toggle.component.mjs +5 -3
  2. package/esm2020/lib/molecules/filter-tabs/filter-tabs.component.mjs +3 -3
  3. package/esm2020/lib/molecules/filter-tabs/filter-tabs.model.mjs +1 -1
  4. package/esm2020/projects/component-library/lib/atoms/input-radio-toggle/input-radio-toggle.component.mjs +5 -3
  5. package/esm2020/projects/component-library/lib/molecules/filter-tabs/filter-tabs.component.mjs +3 -3
  6. package/esm2020/projects/component-library/lib/molecules/filter-tabs/filter-tabs.model.mjs +1 -1
  7. package/fesm2015/symphony-talent-component-library-projects-component-library.mjs +6 -4
  8. package/fesm2015/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
  9. package/fesm2015/symphony-talent-component-library.mjs +6 -4
  10. package/fesm2015/symphony-talent-component-library.mjs.map +1 -1
  11. package/fesm2020/symphony-talent-component-library-projects-component-library.mjs +6 -4
  12. package/fesm2020/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
  13. package/fesm2020/symphony-talent-component-library.mjs +6 -4
  14. package/fesm2020/symphony-talent-component-library.mjs.map +1 -1
  15. package/lib/atoms/input-radio-toggle/input-radio-toggle.component.d.ts +2 -1
  16. package/lib/molecules/filter-tabs/filter-tabs.model.d.ts +1 -0
  17. package/package.json +1 -1
  18. package/projects/component-library/lib/atoms/input-radio-toggle/input-radio-toggle.component.d.ts +2 -1
  19. package/projects/component-library/lib/molecules/filter-tabs/filter-tabs.model.d.ts +1 -0
@@ -1745,10 +1745,10 @@ class InputRadioToggleComponent {
1745
1745
  }
1746
1746
  }
1747
1747
  InputRadioToggleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputRadioToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1748
- InputRadioToggleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: InputRadioToggleComponent, selector: "symphony-input-radio-toggle", inputs: { radioLabel1: "radioLabel1", radioLabel2: "radioLabel2", identifier: "identifier", isDisabled: "isDisabled" }, outputs: { changedValue: "changedValue" }, ngImport: i0, template: "<div class=\"sfx-radio-toggle\" [ngClass]=\"{'radio-disabled': isDisabled}\">\n <input\n checked=\"true\"\n type=\"radio\"\n value=\"{{ radioLabel1 }}\"\n id=\"radio-{{ radioLabel1 }}-{{identifier}}\"\n name=\"radio-toggle-{{identifier}}\"\n (change)=\"onChange(radioLabel1)\"\n /><label for=\"radio-{{radioLabel1}}-{{identifier}}\">{{ radioLabel1 }}</label\n ><input\n type=\"radio\"\n value=\"{{ radioLabel2 }}\"\n id=\"radio-{{ radioLabel2 }}-{{identifier}}\"\n name=\"radio-toggle-{{identifier}}\"\n (change)=\"onChange(radioLabel2)\"\n /><label for=\"radio-{{radioLabel2}}-{{identifier}}\">{{ radioLabel2 }}</label>\n </div>\n ", styles: [".sfx-radio-toggle{display:flex;overflow:hidden}.sfx-radio-toggle input{position:absolute!important;clip:rect(0,0,0,0);height:1px;width:1px;border:0;overflow:hidden}.sfx-radio-toggle input:checked+label{background-color:#334860;color:#fff}.sfx-radio-toggle label{background-color:#fff;color:#000;font-size:12px;line-height:18px;text-align:center;border:1px solid #334860;transition:all .1s ease-in-out;text-transform:uppercase;font-weight:500;margin:0;min-width:50px}.sfx-radio-toggle label:hover{cursor:pointer}.sfx-radio-toggle label:first-of-type{border-radius:20px 0 0 20px;border-right:none}.sfx-radio-toggle label:last-of-type{border-radius:0 20px 20px 0;border-left:none}.sfx-radio-toggle.radio-disabled label{pointer-events:none;opacity:.5}\n"], directives: [{ type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
1748
+ InputRadioToggleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: InputRadioToggleComponent, selector: "symphony-input-radio-toggle", inputs: { radioLabel1: "radioLabel1", radioLabel2: "radioLabel2", identifier: "identifier", isDisabled: "isDisabled", isOption1Active: "isOption1Active" }, outputs: { changedValue: "changedValue" }, ngImport: i0, template: "<div class=\"sfx-radio-toggle\" [ngClass]=\"{'radio-disabled': isDisabled}\">\n <input\n [checked]=\"isOption1Active\"\n type=\"radio\"\n value=\"{{ radioLabel1 }}\"\n id=\"radio-{{ radioLabel1 }}-{{identifier}}\"\n name=\"radio-toggle-{{identifier}}\"\n (change)=\"onChange(radioLabel1)\"\n /><label for=\"radio-{{radioLabel1}}-{{identifier}}\">{{ radioLabel1 }}</label\n ><input\n [checked]=\"!isOption1Active\"\n type=\"radio\"\n value=\"{{ radioLabel2 }}\"\n id=\"radio-{{ radioLabel2 }}-{{identifier}}\"\n name=\"radio-toggle-{{identifier}}\"\n (change)=\"onChange(radioLabel2)\"\n /><label for=\"radio-{{radioLabel2}}-{{identifier}}\">{{ radioLabel2 }}</label>\n </div>\n ", styles: [".sfx-radio-toggle{display:flex;overflow:hidden}.sfx-radio-toggle input{position:absolute!important;clip:rect(0,0,0,0);height:1px;width:1px;border:0;overflow:hidden}.sfx-radio-toggle input:checked+label{background-color:#334860;color:#fff}.sfx-radio-toggle label{background-color:#fff;color:#000;font-size:12px;line-height:18px;text-align:center;border:1px solid #334860;transition:all .1s ease-in-out;text-transform:uppercase;font-weight:500;margin:0;min-width:50px}.sfx-radio-toggle label:hover{cursor:pointer}.sfx-radio-toggle label:first-of-type{border-radius:20px 0 0 20px;border-right:none}.sfx-radio-toggle label:last-of-type{border-radius:0 20px 20px 0;border-left:none}.sfx-radio-toggle.radio-disabled label{pointer-events:none;opacity:.5}\n"], directives: [{ type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
1749
1749
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputRadioToggleComponent, decorators: [{
1750
1750
  type: Component,
1751
- args: [{ selector: 'symphony-input-radio-toggle', template: "<div class=\"sfx-radio-toggle\" [ngClass]=\"{'radio-disabled': isDisabled}\">\n <input\n checked=\"true\"\n type=\"radio\"\n value=\"{{ radioLabel1 }}\"\n id=\"radio-{{ radioLabel1 }}-{{identifier}}\"\n name=\"radio-toggle-{{identifier}}\"\n (change)=\"onChange(radioLabel1)\"\n /><label for=\"radio-{{radioLabel1}}-{{identifier}}\">{{ radioLabel1 }}</label\n ><input\n type=\"radio\"\n value=\"{{ radioLabel2 }}\"\n id=\"radio-{{ radioLabel2 }}-{{identifier}}\"\n name=\"radio-toggle-{{identifier}}\"\n (change)=\"onChange(radioLabel2)\"\n /><label for=\"radio-{{radioLabel2}}-{{identifier}}\">{{ radioLabel2 }}</label>\n </div>\n ", styles: [".sfx-radio-toggle{display:flex;overflow:hidden}.sfx-radio-toggle input{position:absolute!important;clip:rect(0,0,0,0);height:1px;width:1px;border:0;overflow:hidden}.sfx-radio-toggle input:checked+label{background-color:#334860;color:#fff}.sfx-radio-toggle label{background-color:#fff;color:#000;font-size:12px;line-height:18px;text-align:center;border:1px solid #334860;transition:all .1s ease-in-out;text-transform:uppercase;font-weight:500;margin:0;min-width:50px}.sfx-radio-toggle label:hover{cursor:pointer}.sfx-radio-toggle label:first-of-type{border-radius:20px 0 0 20px;border-right:none}.sfx-radio-toggle label:last-of-type{border-radius:0 20px 20px 0;border-left:none}.sfx-radio-toggle.radio-disabled label{pointer-events:none;opacity:.5}\n"] }]
1751
+ args: [{ selector: 'symphony-input-radio-toggle', template: "<div class=\"sfx-radio-toggle\" [ngClass]=\"{'radio-disabled': isDisabled}\">\n <input\n [checked]=\"isOption1Active\"\n type=\"radio\"\n value=\"{{ radioLabel1 }}\"\n id=\"radio-{{ radioLabel1 }}-{{identifier}}\"\n name=\"radio-toggle-{{identifier}}\"\n (change)=\"onChange(radioLabel1)\"\n /><label for=\"radio-{{radioLabel1}}-{{identifier}}\">{{ radioLabel1 }}</label\n ><input\n [checked]=\"!isOption1Active\"\n type=\"radio\"\n value=\"{{ radioLabel2 }}\"\n id=\"radio-{{ radioLabel2 }}-{{identifier}}\"\n name=\"radio-toggle-{{identifier}}\"\n (change)=\"onChange(radioLabel2)\"\n /><label for=\"radio-{{radioLabel2}}-{{identifier}}\">{{ radioLabel2 }}</label>\n </div>\n ", styles: [".sfx-radio-toggle{display:flex;overflow:hidden}.sfx-radio-toggle input{position:absolute!important;clip:rect(0,0,0,0);height:1px;width:1px;border:0;overflow:hidden}.sfx-radio-toggle input:checked+label{background-color:#334860;color:#fff}.sfx-radio-toggle label{background-color:#fff;color:#000;font-size:12px;line-height:18px;text-align:center;border:1px solid #334860;transition:all .1s ease-in-out;text-transform:uppercase;font-weight:500;margin:0;min-width:50px}.sfx-radio-toggle label:hover{cursor:pointer}.sfx-radio-toggle label:first-of-type{border-radius:20px 0 0 20px;border-right:none}.sfx-radio-toggle label:last-of-type{border-radius:0 20px 20px 0;border-left:none}.sfx-radio-toggle.radio-disabled label{pointer-events:none;opacity:.5}\n"] }]
1752
1752
  }], ctorParameters: function () { return []; }, propDecorators: { radioLabel1: [{
1753
1753
  type: Input
1754
1754
  }], radioLabel2: [{
@@ -1757,6 +1757,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImpor
1757
1757
  type: Input
1758
1758
  }], isDisabled: [{
1759
1759
  type: Input
1760
+ }], isOption1Active: [{
1761
+ type: Input
1760
1762
  }], changedValue: [{
1761
1763
  type: Output
1762
1764
  }] } });
@@ -3622,10 +3624,10 @@ class FilterTabsComponent {
3622
3624
  }
3623
3625
  }
3624
3626
  FilterTabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FilterTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3625
- FilterTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: FilterTabsComponent, selector: "symphony-filter-tabs", inputs: { filterTabs: "filterTabs" }, outputs: { moreOptionClick: "moreOptionClick", loadSearchClick: "loadSearchClick", clearSearchClick: "clearSearchClick", buttonClicked: "buttonClicked" }, ngImport: i0, template: "<section *ngIf=\"filterTabs\" class=\"sfx-tab-wrapper sfx-filter-tab-wrap\">\n <div class=\"tab-filter-actions\">\n <symphony-tooltip-wrapper\n [placement]=\"'top'\"\n [tooltipHtml]=\"'Last Search'\"\n [toolTipClass]=\"'toolTipV2'\"\n *ngIf=\"filterTabs.showLoadLastSearch\"\n >\n <symphony-icon-wrapper\n class=\"rotateY sfx-d-flex filter-action-icon\"\n [isInverse]=\"true\"\n [hasHoverWithoutBorder]=\"true\"\n [backgroundColor]=\"'#ffffff'\"\n (click)=\"onLoadSearchClick()\"\n >\n <symphony-icon\n [icon]=\"'si-refresh'\"\n [iconColor]=\"'#334860'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n </symphony-tooltip-wrapper>\n\n <symphony-tooltip-wrapper\n [placement]=\"'top'\"\n [tooltipHtml]=\"'Clear Search'\"\n [toolTipClass]=\"'toolTipV2'\"\n *ngIf=\"filterTabs.showClearSearch\"\n >\n <symphony-icon-wrapper\n class=\"filter-action-icon\"\n [isInverse]=\"true\"\n [hasHoverWithoutBorder]=\"true\"\n [backgroundColor]=\"'#ffffff'\"\n (click)=\"onClearSearchClick()\"\n >\n <symphony-icon\n [icon]=\"'si-search-clear'\"\n [iconColor]=\"'#334860'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n </symphony-tooltip-wrapper>\n\n <symphony-contextual-menu\n class=\"filter-action-icon\"\n [model]=\"filterTabs.moreActionsMenu\"\n (itemClick)=\"onItemClick($event)\"\n *ngIf=\"filterTabs.showMoreOptions\"\n >\n </symphony-contextual-menu>\n </div>\n <tabset>\n <tab [heading]=\"'Basic Search'\" [active]=\"filterTabs.showBasicSearch\"\n ><div><ng-content select=\"[basic-search-content]\"></ng-content></div\n ></tab>\n <tab [heading]=\"'Advanced Search'\" [active]=\"filterTabs.showAdvanceSearch\"\n ><div>\n <ng-content select=\"[advanced-search-content]\"></ng-content>\n <symphony-button-v2\n *ngIf=\"filterTabs.showSeeResultsBtn\"\n sfx-button-primary\n id=\"button-see-result\"\n class=\"sfx-d-flex justify-flex-end sfx-mt-20\"\n text=\"SEE RESULTS\"\n [disabled]=\"filterTabs.seeResultsBtnDisabled\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button-v2></div\n ></tab>\n </tabset>\n</section>\n", styles: [".sfx-filter-tab-wrap{background:#D2D8E5;border-radius:15px;padding:30px 30px 40px;position:relative}.sfx-filter-tab-wrap .tab-filter-actions{display:flex;position:absolute;top:30px;z-index:1;right:30px;gap:10px}.sfx-filter-tab-wrap .tab-filter-actions .rotateY{transform:rotateY(180deg)}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .icon-wrapper:hover{background-color:#f1f2f5!important}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group button.dropdown-toggle.btn{color:#334860}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group button.dropdown-toggle.btn:hover{background:#F1F2F5!important;color:#334860!important}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group.open button.dropdown-toggle.btn{background:#F1F2F5!important;color:#334860}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group.open button.dropdown-toggle.btn:hover{background:#F1F2F5!important;color:#334860!important}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group .dropdown-menu{min-width:170px;padding-top:10px;padding-bottom:10px}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group .dropdown-menu li a.dropdown-item{padding:8px 10px 8px 20px!important;line-height:20px!important;color:#000;font-weight:400!important}.sfx-filter-tab-wrap .tab-container ul.nav-tabs{margin-bottom:20px;border-bottom:1px solid #82919F!important}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li{background-color:#d2d8e5!important;margin-bottom:0}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li .nav-link{background-color:#d2d8e5!important;margin-bottom:0;padding-bottom:20px}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li.active .nav-link{background-color:#d2d8e5!important}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li.active:hover a{color:#712ace!important;cursor:pointer}.sfx-filter-tab-wrap .tab-container .v2 .btn-primary{border-color:#2b8ff3!important}.sfx-filter-tab-wrap .tab-container .v2 .btn-primary.btn.sb-sfx-btn{font-weight:500!important}.justify-flex-end{justify-content:flex-end}\n"], components: [{ type: TooltipWrapperComponent, selector: "symphony-tooltip-wrapper", inputs: ["placement", "tooltipHtml", "toolTipClass"] }, { type: IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["backgroundColor", "isInverse", "hasHoverWithoutBorder"], outputs: ["clicked"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: ContextualMenuComponent, selector: "symphony-contextual-menu", inputs: ["model"], outputs: ["itemClick"] }, { type: i1$5.TabsetComponent, selector: "tabset", inputs: ["vertical", "justified", "type"] }, { type: ButtonV2Component, selector: "symphony-button-v2" }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$5.TabDirective, selector: "tab, [tab]", inputs: ["customClass", "active", "removable", "heading", "id", "disabled"], outputs: ["selectTab", "deselect", "removed"] }], encapsulation: i0.ViewEncapsulation.None });
3627
+ FilterTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: FilterTabsComponent, selector: "symphony-filter-tabs", inputs: { filterTabs: "filterTabs" }, outputs: { moreOptionClick: "moreOptionClick", loadSearchClick: "loadSearchClick", clearSearchClick: "clearSearchClick", buttonClicked: "buttonClicked" }, ngImport: i0, template: "<section *ngIf=\"filterTabs\" class=\"sfx-tab-wrapper sfx-filter-tab-wrap\">\n <div class=\"tab-filter-actions\">\n <symphony-tooltip-wrapper\n [placement]=\"'top'\"\n [tooltipHtml]=\"'Last Search'\"\n [toolTipClass]=\"'toolTipV2'\"\n *ngIf=\"filterTabs.showLoadLastSearch\"\n >\n <symphony-icon-wrapper\n class=\"rotateY sfx-d-flex filter-action-icon\"\n [isInverse]=\"true\"\n [hasHoverWithoutBorder]=\"true\"\n [backgroundColor]=\"'#ffffff'\"\n (click)=\"onLoadSearchClick()\"\n >\n <symphony-icon\n [icon]=\"'si-refresh'\"\n [iconColor]=\"'#334860'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n </symphony-tooltip-wrapper>\n\n <symphony-tooltip-wrapper\n [placement]=\"'top'\"\n [tooltipHtml]=\"'Clear Search'\"\n [toolTipClass]=\"'toolTipV2'\"\n *ngIf=\"filterTabs.showClearSearch\"\n >\n <symphony-icon-wrapper\n class=\"filter-action-icon\"\n [isInverse]=\"true\"\n [hasHoverWithoutBorder]=\"true\"\n [backgroundColor]=\"'#ffffff'\"\n (click)=\"onClearSearchClick()\"\n >\n <symphony-icon\n [icon]=\"'si-search-clear'\"\n [iconColor]=\"'#334860'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n </symphony-tooltip-wrapper>\n\n <symphony-contextual-menu\n class=\"filter-action-icon\"\n [model]=\"filterTabs.moreActionsMenu\"\n (itemClick)=\"onItemClick($event)\"\n *ngIf=\"filterTabs.showMoreOptions\"\n >\n </symphony-contextual-menu>\n </div>\n <tabset>\n <tab [heading]=\"'Basic Search'\" [active]=\"filterTabs.showBasicSearch\"\n ><div><ng-content select=\"[basic-search-content]\"></ng-content></div\n ></tab>\n <tab [heading]=\"'Advanced Search'\" [active]=\"filterTabs.showAdvanceSearch\"\n ><div>\n <ng-content select=\"[advanced-search-content]\"></ng-content>\n <div class=\"advance-search-footer sfx-mt-20\">\n <symphony-button-v2\n *ngIf=\"filterTabs.showSeeResultsBtn\"\n id=\"button-see-result\"\n text=\"SEE RESULTS\"\n [disabled]=\"filterTabs.seeResultsBtnDisabled\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button-v2>\n <symphony-button-v2\n *ngIf=\"filterTabs.showClearResultsBtn\"\n id=\"button-clear-result\"\n text=\"Clear\"\n [isSecondary]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button-v2>\n </div>\n </div\n ></tab>\n </tabset>\n</section>\n", styles: [".sfx-filter-tab-wrap{background:#D2D8E5;border-radius:15px;padding:30px 30px 40px;position:relative}.sfx-filter-tab-wrap .tab-filter-actions{display:flex;position:absolute;top:30px;z-index:1;right:30px;gap:10px}.sfx-filter-tab-wrap .tab-filter-actions .rotateY{transform:rotateY(180deg)}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .icon-wrapper:hover{background-color:#f1f2f5!important}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group button.dropdown-toggle.btn{color:#334860}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group button.dropdown-toggle.btn:hover{background:#F1F2F5!important;color:#334860!important}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group.open button.dropdown-toggle.btn{background:#F1F2F5!important;color:#334860}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group.open button.dropdown-toggle.btn:hover{background:#F1F2F5!important;color:#334860!important}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group .dropdown-menu{min-width:170px;padding-top:10px;padding-bottom:10px}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group .dropdown-menu li a.dropdown-item{padding:8px 10px 8px 20px!important;line-height:20px!important;color:#000;font-weight:400!important}.sfx-filter-tab-wrap .tab-container ul.nav-tabs{margin-bottom:20px;border-bottom:1px solid #82919F!important}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li{background-color:#d2d8e5!important;margin-bottom:0}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li .nav-link{background-color:#d2d8e5!important;margin-bottom:0;padding-bottom:20px}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li.active .nav-link{background-color:#d2d8e5!important}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li.active:hover a{color:#712ace!important;cursor:pointer}.sfx-filter-tab-wrap .tab-container .v2 .btn-primary{border-color:#2b8ff3!important}.sfx-filter-tab-wrap .tab-container .v2 .btn-primary.btn.sb-sfx-btn{font-weight:500!important}.justify-flex-end{justify-content:flex-end}.advance-search-footer{display:flex;flex-direction:row-reverse;gap:15px}\n"], components: [{ type: TooltipWrapperComponent, selector: "symphony-tooltip-wrapper", inputs: ["placement", "tooltipHtml", "toolTipClass"] }, { type: IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["backgroundColor", "isInverse", "hasHoverWithoutBorder"], outputs: ["clicked"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: ContextualMenuComponent, selector: "symphony-contextual-menu", inputs: ["model"], outputs: ["itemClick"] }, { type: i1$5.TabsetComponent, selector: "tabset", inputs: ["vertical", "justified", "type"] }, { type: ButtonV2Component, selector: "symphony-button-v2" }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$5.TabDirective, selector: "tab, [tab]", inputs: ["customClass", "active", "removable", "heading", "id", "disabled"], outputs: ["selectTab", "deselect", "removed"] }], encapsulation: i0.ViewEncapsulation.None });
3626
3628
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FilterTabsComponent, decorators: [{
3627
3629
  type: Component,
3628
- args: [{ selector: 'symphony-filter-tabs', encapsulation: ViewEncapsulation.None, template: "<section *ngIf=\"filterTabs\" class=\"sfx-tab-wrapper sfx-filter-tab-wrap\">\n <div class=\"tab-filter-actions\">\n <symphony-tooltip-wrapper\n [placement]=\"'top'\"\n [tooltipHtml]=\"'Last Search'\"\n [toolTipClass]=\"'toolTipV2'\"\n *ngIf=\"filterTabs.showLoadLastSearch\"\n >\n <symphony-icon-wrapper\n class=\"rotateY sfx-d-flex filter-action-icon\"\n [isInverse]=\"true\"\n [hasHoverWithoutBorder]=\"true\"\n [backgroundColor]=\"'#ffffff'\"\n (click)=\"onLoadSearchClick()\"\n >\n <symphony-icon\n [icon]=\"'si-refresh'\"\n [iconColor]=\"'#334860'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n </symphony-tooltip-wrapper>\n\n <symphony-tooltip-wrapper\n [placement]=\"'top'\"\n [tooltipHtml]=\"'Clear Search'\"\n [toolTipClass]=\"'toolTipV2'\"\n *ngIf=\"filterTabs.showClearSearch\"\n >\n <symphony-icon-wrapper\n class=\"filter-action-icon\"\n [isInverse]=\"true\"\n [hasHoverWithoutBorder]=\"true\"\n [backgroundColor]=\"'#ffffff'\"\n (click)=\"onClearSearchClick()\"\n >\n <symphony-icon\n [icon]=\"'si-search-clear'\"\n [iconColor]=\"'#334860'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n </symphony-tooltip-wrapper>\n\n <symphony-contextual-menu\n class=\"filter-action-icon\"\n [model]=\"filterTabs.moreActionsMenu\"\n (itemClick)=\"onItemClick($event)\"\n *ngIf=\"filterTabs.showMoreOptions\"\n >\n </symphony-contextual-menu>\n </div>\n <tabset>\n <tab [heading]=\"'Basic Search'\" [active]=\"filterTabs.showBasicSearch\"\n ><div><ng-content select=\"[basic-search-content]\"></ng-content></div\n ></tab>\n <tab [heading]=\"'Advanced Search'\" [active]=\"filterTabs.showAdvanceSearch\"\n ><div>\n <ng-content select=\"[advanced-search-content]\"></ng-content>\n <symphony-button-v2\n *ngIf=\"filterTabs.showSeeResultsBtn\"\n sfx-button-primary\n id=\"button-see-result\"\n class=\"sfx-d-flex justify-flex-end sfx-mt-20\"\n text=\"SEE RESULTS\"\n [disabled]=\"filterTabs.seeResultsBtnDisabled\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button-v2></div\n ></tab>\n </tabset>\n</section>\n", styles: [".sfx-filter-tab-wrap{background:#D2D8E5;border-radius:15px;padding:30px 30px 40px;position:relative}.sfx-filter-tab-wrap .tab-filter-actions{display:flex;position:absolute;top:30px;z-index:1;right:30px;gap:10px}.sfx-filter-tab-wrap .tab-filter-actions .rotateY{transform:rotateY(180deg)}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .icon-wrapper:hover{background-color:#f1f2f5!important}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group button.dropdown-toggle.btn{color:#334860}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group button.dropdown-toggle.btn:hover{background:#F1F2F5!important;color:#334860!important}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group.open button.dropdown-toggle.btn{background:#F1F2F5!important;color:#334860}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group.open button.dropdown-toggle.btn:hover{background:#F1F2F5!important;color:#334860!important}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group .dropdown-menu{min-width:170px;padding-top:10px;padding-bottom:10px}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group .dropdown-menu li a.dropdown-item{padding:8px 10px 8px 20px!important;line-height:20px!important;color:#000;font-weight:400!important}.sfx-filter-tab-wrap .tab-container ul.nav-tabs{margin-bottom:20px;border-bottom:1px solid #82919F!important}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li{background-color:#d2d8e5!important;margin-bottom:0}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li .nav-link{background-color:#d2d8e5!important;margin-bottom:0;padding-bottom:20px}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li.active .nav-link{background-color:#d2d8e5!important}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li.active:hover a{color:#712ace!important;cursor:pointer}.sfx-filter-tab-wrap .tab-container .v2 .btn-primary{border-color:#2b8ff3!important}.sfx-filter-tab-wrap .tab-container .v2 .btn-primary.btn.sb-sfx-btn{font-weight:500!important}.justify-flex-end{justify-content:flex-end}\n"] }]
3630
+ args: [{ selector: 'symphony-filter-tabs', encapsulation: ViewEncapsulation.None, template: "<section *ngIf=\"filterTabs\" class=\"sfx-tab-wrapper sfx-filter-tab-wrap\">\n <div class=\"tab-filter-actions\">\n <symphony-tooltip-wrapper\n [placement]=\"'top'\"\n [tooltipHtml]=\"'Last Search'\"\n [toolTipClass]=\"'toolTipV2'\"\n *ngIf=\"filterTabs.showLoadLastSearch\"\n >\n <symphony-icon-wrapper\n class=\"rotateY sfx-d-flex filter-action-icon\"\n [isInverse]=\"true\"\n [hasHoverWithoutBorder]=\"true\"\n [backgroundColor]=\"'#ffffff'\"\n (click)=\"onLoadSearchClick()\"\n >\n <symphony-icon\n [icon]=\"'si-refresh'\"\n [iconColor]=\"'#334860'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n </symphony-tooltip-wrapper>\n\n <symphony-tooltip-wrapper\n [placement]=\"'top'\"\n [tooltipHtml]=\"'Clear Search'\"\n [toolTipClass]=\"'toolTipV2'\"\n *ngIf=\"filterTabs.showClearSearch\"\n >\n <symphony-icon-wrapper\n class=\"filter-action-icon\"\n [isInverse]=\"true\"\n [hasHoverWithoutBorder]=\"true\"\n [backgroundColor]=\"'#ffffff'\"\n (click)=\"onClearSearchClick()\"\n >\n <symphony-icon\n [icon]=\"'si-search-clear'\"\n [iconColor]=\"'#334860'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n </symphony-tooltip-wrapper>\n\n <symphony-contextual-menu\n class=\"filter-action-icon\"\n [model]=\"filterTabs.moreActionsMenu\"\n (itemClick)=\"onItemClick($event)\"\n *ngIf=\"filterTabs.showMoreOptions\"\n >\n </symphony-contextual-menu>\n </div>\n <tabset>\n <tab [heading]=\"'Basic Search'\" [active]=\"filterTabs.showBasicSearch\"\n ><div><ng-content select=\"[basic-search-content]\"></ng-content></div\n ></tab>\n <tab [heading]=\"'Advanced Search'\" [active]=\"filterTabs.showAdvanceSearch\"\n ><div>\n <ng-content select=\"[advanced-search-content]\"></ng-content>\n <div class=\"advance-search-footer sfx-mt-20\">\n <symphony-button-v2\n *ngIf=\"filterTabs.showSeeResultsBtn\"\n id=\"button-see-result\"\n text=\"SEE RESULTS\"\n [disabled]=\"filterTabs.seeResultsBtnDisabled\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button-v2>\n <symphony-button-v2\n *ngIf=\"filterTabs.showClearResultsBtn\"\n id=\"button-clear-result\"\n text=\"Clear\"\n [isSecondary]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button-v2>\n </div>\n </div\n ></tab>\n </tabset>\n</section>\n", styles: [".sfx-filter-tab-wrap{background:#D2D8E5;border-radius:15px;padding:30px 30px 40px;position:relative}.sfx-filter-tab-wrap .tab-filter-actions{display:flex;position:absolute;top:30px;z-index:1;right:30px;gap:10px}.sfx-filter-tab-wrap .tab-filter-actions .rotateY{transform:rotateY(180deg)}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .icon-wrapper:hover{background-color:#f1f2f5!important}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group button.dropdown-toggle.btn{color:#334860}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group button.dropdown-toggle.btn:hover{background:#F1F2F5!important;color:#334860!important}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group.open button.dropdown-toggle.btn{background:#F1F2F5!important;color:#334860}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group.open button.dropdown-toggle.btn:hover{background:#F1F2F5!important;color:#334860!important}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group .dropdown-menu{min-width:170px;padding-top:10px;padding-bottom:10px}.sfx-filter-tab-wrap .tab-filter-actions .filter-action-icon .btn-group .dropdown-menu li a.dropdown-item{padding:8px 10px 8px 20px!important;line-height:20px!important;color:#000;font-weight:400!important}.sfx-filter-tab-wrap .tab-container ul.nav-tabs{margin-bottom:20px;border-bottom:1px solid #82919F!important}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li{background-color:#d2d8e5!important;margin-bottom:0}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li .nav-link{background-color:#d2d8e5!important;margin-bottom:0;padding-bottom:20px}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li.active .nav-link{background-color:#d2d8e5!important}.sfx-filter-tab-wrap .tab-container ul.nav-tabs li.active:hover a{color:#712ace!important;cursor:pointer}.sfx-filter-tab-wrap .tab-container .v2 .btn-primary{border-color:#2b8ff3!important}.sfx-filter-tab-wrap .tab-container .v2 .btn-primary.btn.sb-sfx-btn{font-weight:500!important}.justify-flex-end{justify-content:flex-end}.advance-search-footer{display:flex;flex-direction:row-reverse;gap:15px}\n"] }]
3629
3631
  }], ctorParameters: function () { return []; }, propDecorators: { filterTabs: [{
3630
3632
  type: Input
3631
3633
  }], moreOptionClick: [{