@symphony-talent/component-library 4.113.0 → 4.114.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 +17 -8
- package/esm2020/projects/component-library/lib/molecules/filter-tabs/filter-tabs.component.mjs +17 -8
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs +15 -6
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2015/symphony-talent-component-library.mjs +15 -6
- package/fesm2015/symphony-talent-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs +15 -6
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library.mjs +15 -6
- package/fesm2020/symphony-talent-component-library.mjs.map +1 -1
- package/lib/molecules/filter-tabs/filter-tabs.component.d.ts +7 -3
- package/package.json +1 -1
- package/projects/component-library/lib/molecules/filter-tabs/filter-tabs.component.d.ts +7 -3
|
@@ -3609,7 +3609,8 @@ class FilterTabsComponent {
|
|
|
3609
3609
|
this.loadSearchClick = new EventEmitter();
|
|
3610
3610
|
this.clearSearchClick = new EventEmitter();
|
|
3611
3611
|
this.buttonClicked = new EventEmitter();
|
|
3612
|
-
this.
|
|
3612
|
+
this.tabSetClicked = new EventEmitter();
|
|
3613
|
+
this.tabSelectedClicked = new EventEmitter();
|
|
3613
3614
|
}
|
|
3614
3615
|
onItemClick(item) {
|
|
3615
3616
|
this.moreOptionClick.emit(item);
|
|
@@ -3623,15 +3624,18 @@ class FilterTabsComponent {
|
|
|
3623
3624
|
onButtonClick(text) {
|
|
3624
3625
|
this.buttonClicked.emit(text);
|
|
3625
3626
|
}
|
|
3626
|
-
onTabSelected(
|
|
3627
|
-
this.
|
|
3627
|
+
onTabSelected() {
|
|
3628
|
+
this.tabSelectedClicked.emit(this.advancedSearchTabs);
|
|
3629
|
+
}
|
|
3630
|
+
onTabSetClick() {
|
|
3631
|
+
this.tabSetClicked.emit(this.advancedSearchTabs);
|
|
3628
3632
|
}
|
|
3629
3633
|
}
|
|
3630
3634
|
FilterTabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FilterTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3631
|
-
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",
|
|
3635
|
+
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" }, 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 <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()\" #advanceSearchTabs>\n <tab (selectTab)=\"onTabSelected()\" [heading]=\"'Basic Search'\" [active]=\"filterTabs.showBasicSearch\"\n ><div><ng-content select=\"[basic-search-content]\"></ng-content></div\n ></tab>\n <tab (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"], 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 });
|
|
3632
3636
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FilterTabsComponent, decorators: [{
|
|
3633
3637
|
type: Component,
|
|
3634
|
-
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 (selectTab)=\"onTabSelected(
|
|
3638
|
+
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 (click)=\"onTabSetClick()\" #advanceSearchTabs>\n <tab (selectTab)=\"onTabSelected()\" [heading]=\"'Basic Search'\" [active]=\"filterTabs.showBasicSearch\"\n ><div><ng-content select=\"[basic-search-content]\"></ng-content></div\n ></tab>\n <tab (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"] }]
|
|
3635
3639
|
}], ctorParameters: function () { return []; }, propDecorators: { filterTabs: [{
|
|
3636
3640
|
type: Input
|
|
3637
3641
|
}], moreOptionClick: [{
|
|
@@ -3642,8 +3646,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImpor
|
|
|
3642
3646
|
type: Output
|
|
3643
3647
|
}], buttonClicked: [{
|
|
3644
3648
|
type: Output
|
|
3645
|
-
}],
|
|
3649
|
+
}], tabSetClicked: [{
|
|
3650
|
+
type: Output
|
|
3651
|
+
}], tabSelectedClicked: [{
|
|
3646
3652
|
type: Output
|
|
3653
|
+
}], advancedSearchTabs: [{
|
|
3654
|
+
type: ViewChild,
|
|
3655
|
+
args: ['advanceSearchTabs']
|
|
3647
3656
|
}] } });
|
|
3648
3657
|
|
|
3649
3658
|
class FilterTabsModule {
|