@symphony-talent/component-library 4.191.0 → 4.192.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.
- package/esm2020/lib/molecules/filter-tabs/filter-tabs.component.mjs +3 -3
- package/esm2020/projects/component-library/lib/molecules/filter-tabs/filter-tabs.component.mjs +3 -3
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs +2 -2
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2015/symphony-talent-component-library.mjs +2 -2
- package/fesm2015/symphony-talent-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs +2 -2
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library.mjs +2 -2
- package/fesm2020/symphony-talent-component-library.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -4140,10 +4140,10 @@ class FilterTabsComponent {
|
|
|
4140
4140
|
}
|
|
4141
4141
|
}
|
|
4142
4142
|
FilterTabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FilterTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4143
|
-
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", tabSetClicked: "tabSetClicked", tabSelectedClicked: "tabSelectedClicked", savedSearchClick: "savedSearchClick" }, viewQueries: [{ propertyName: "advancedSearchTabs", first: true, predicate: ["advanceSearchTabs"], descendants: true }], ngImport: i0, template: "<section *ngIf=\"filterTabs\" class=\"sfx-tab-wrapper sfx-filter-tab-wrap\">\n <div class=\"tab-filter-actions\">\n <ng-content select=\"[saved-search-dropdown-zone]\"></ng-content>\n <symphony-tooltip-wrapper\n [placement]=\"'top'\"\n [tooltipHtml]=\"'Save Search'\"\n [toolTipClass]=\"'toolTipV2'\"\n *ngIf=\"filterTabs.showSavedSearch\"\n >\n <symphony-icon-wrapper\n class=\"sfx-d-flex filter-action-icon\"\n [isInverse]=\"true\"\n [hasHoverWithoutBorder]=\"true\"\n [backgroundColor]=\"'#ffffff'\"\n [isDisabled]=\"filterTabs.savedSearchDisabled\"\n (click)=\"onSavedSearchClick()\"\n >\n <symphony-icon\n [icon]=\"'si-save'\"\n [iconColor]=\"'#334860'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n </symphony-tooltip-wrapper> \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 (click)=\"onTabSetClick($event)\" #advanceSearchTabs>\n <tab [disabled]=\"filterTabs.basicSearchDisabled\" (selectTab)=\"onTabSelected()\" [heading]=\"'Basic Search'\" [active]=\"filterTabs.showBasicSearch\"\n ><div><ng-content select=\"[basic-search-content]\"></ng-content>\n <div class=\"advance-search-footer sfx-mt-20\"> \n <symphony-button-v2\n *ngIf=\"filterTabs.showClearResultsBtn\"\n id=\"basic-button-clear-result\"\n text=\"Clear\"\n [isSecondary]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button-v2>\n </div>\n </div\n ></tab>\n <tab [disabled]=\"filterTabs.advanceSearchDisabled\" (selectTab)=\"onTabSelected()\" [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", "isDisabled"], 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$6.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$6.TabDirective, selector: "tab, [tab]", inputs: ["customClass", "active", "removable", "heading", "id", "disabled"], outputs: ["selectTab", "deselect", "removed"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
4143
|
+
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", tabSetClicked: "tabSetClicked", tabSelectedClicked: "tabSelectedClicked", savedSearchClick: "savedSearchClick" }, viewQueries: [{ propertyName: "advancedSearchTabs", first: true, predicate: ["advanceSearchTabs"], descendants: true }], ngImport: i0, template: "<section *ngIf=\"filterTabs\" class=\"sfx-tab-wrapper sfx-filter-tab-wrap\">\n <div class=\"tab-filter-actions\">\n <ng-content select=\"[saved-search-dropdown-zone]\"></ng-content>\n <symphony-tooltip-wrapper\n [placement]=\"'top'\"\n [tooltipHtml]=\"'Save Search'\"\n [toolTipClass]=\"'toolTipV2'\"\n *ngIf=\"filterTabs.showSavedSearch\"\n >\n <symphony-icon-wrapper\n class=\"sfx-d-flex filter-action-icon\"\n [isInverse]=\"true\"\n [hasHoverWithoutBorder]=\"true\"\n [backgroundColor]=\"'#ffffff'\"\n [isDisabled]=\"filterTabs.savedSearchDisabled\"\n (click)=\"!filterTabs.savedSearchDisabled && onSavedSearchClick()\"\n >\n <symphony-icon\n [icon]=\"'si-save'\"\n [iconColor]=\"'#334860'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n </symphony-tooltip-wrapper> \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 (click)=\"onTabSetClick($event)\" #advanceSearchTabs>\n <tab [disabled]=\"filterTabs.basicSearchDisabled\" (selectTab)=\"onTabSelected()\" [heading]=\"'Basic Search'\" [active]=\"filterTabs.showBasicSearch\"\n ><div><ng-content select=\"[basic-search-content]\"></ng-content>\n <div class=\"advance-search-footer sfx-mt-20\"> \n <symphony-button-v2\n *ngIf=\"filterTabs.showClearResultsBtn\"\n id=\"basic-button-clear-result\"\n text=\"Clear\"\n [isSecondary]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button-v2>\n </div>\n </div\n ></tab>\n <tab [disabled]=\"filterTabs.advanceSearchDisabled\" (selectTab)=\"onTabSelected()\" [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", "isDisabled"], 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$6.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$6.TabDirective, selector: "tab, [tab]", inputs: ["customClass", "active", "removable", "heading", "id", "disabled"], outputs: ["selectTab", "deselect", "removed"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
4144
4144
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FilterTabsComponent, decorators: [{
|
|
4145
4145
|
type: Component,
|
|
4146
|
-
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 <ng-content select=\"[saved-search-dropdown-zone]\"></ng-content>\n <symphony-tooltip-wrapper\n [placement]=\"'top'\"\n [tooltipHtml]=\"'Save Search'\"\n [toolTipClass]=\"'toolTipV2'\"\n *ngIf=\"filterTabs.showSavedSearch\"\n >\n <symphony-icon-wrapper\n class=\"sfx-d-flex filter-action-icon\"\n [isInverse]=\"true\"\n [hasHoverWithoutBorder]=\"true\"\n [backgroundColor]=\"'#ffffff'\"\n [isDisabled]=\"filterTabs.savedSearchDisabled\"\n (click)=\"onSavedSearchClick()\"\n >\n <symphony-icon\n [icon]=\"'si-save'\"\n [iconColor]=\"'#334860'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n </symphony-tooltip-wrapper> \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 (click)=\"onTabSetClick($event)\" #advanceSearchTabs>\n <tab [disabled]=\"filterTabs.basicSearchDisabled\" (selectTab)=\"onTabSelected()\" [heading]=\"'Basic Search'\" [active]=\"filterTabs.showBasicSearch\"\n ><div><ng-content select=\"[basic-search-content]\"></ng-content>\n <div class=\"advance-search-footer sfx-mt-20\"> \n <symphony-button-v2\n *ngIf=\"filterTabs.showClearResultsBtn\"\n id=\"basic-button-clear-result\"\n text=\"Clear\"\n [isSecondary]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button-v2>\n </div>\n </div\n ></tab>\n <tab [disabled]=\"filterTabs.advanceSearchDisabled\" (selectTab)=\"onTabSelected()\" [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"] }]
|
|
4146
|
+
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 <ng-content select=\"[saved-search-dropdown-zone]\"></ng-content>\n <symphony-tooltip-wrapper\n [placement]=\"'top'\"\n [tooltipHtml]=\"'Save Search'\"\n [toolTipClass]=\"'toolTipV2'\"\n *ngIf=\"filterTabs.showSavedSearch\"\n >\n <symphony-icon-wrapper\n class=\"sfx-d-flex filter-action-icon\"\n [isInverse]=\"true\"\n [hasHoverWithoutBorder]=\"true\"\n [backgroundColor]=\"'#ffffff'\"\n [isDisabled]=\"filterTabs.savedSearchDisabled\"\n (click)=\"!filterTabs.savedSearchDisabled && onSavedSearchClick()\"\n >\n <symphony-icon\n [icon]=\"'si-save'\"\n [iconColor]=\"'#334860'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n </symphony-tooltip-wrapper> \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 (click)=\"onTabSetClick($event)\" #advanceSearchTabs>\n <tab [disabled]=\"filterTabs.basicSearchDisabled\" (selectTab)=\"onTabSelected()\" [heading]=\"'Basic Search'\" [active]=\"filterTabs.showBasicSearch\"\n ><div><ng-content select=\"[basic-search-content]\"></ng-content>\n <div class=\"advance-search-footer sfx-mt-20\"> \n <symphony-button-v2\n *ngIf=\"filterTabs.showClearResultsBtn\"\n id=\"basic-button-clear-result\"\n text=\"Clear\"\n [isSecondary]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button-v2>\n </div>\n </div\n ></tab>\n <tab [disabled]=\"filterTabs.advanceSearchDisabled\" (selectTab)=\"onTabSelected()\" [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"] }]
|
|
4147
4147
|
}], ctorParameters: function () { return []; }, propDecorators: { filterTabs: [{
|
|
4148
4148
|
type: Input
|
|
4149
4149
|
}], moreOptionClick: [{
|