vc-layout 0.0.7 → 0.0.8
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/esm2022/lib/components/header/header-container/header-container.component.mjs +13 -5
- package/esm2022/lib/components/header/header.module.mjs +10 -3
- package/esm2022/lib/components/header/search/search.component.mjs +124 -8
- package/fesm2022/vc-layout.mjs +139 -11
- package/fesm2022/vc-layout.mjs.map +1 -1
- package/lib/components/header/header-container/header-container.component.d.ts +4 -1
- package/lib/components/header/header.module.d.ts +2 -1
- package/lib/components/header/search/search.component.d.ts +13 -3
- package/package.json +1 -1
|
@@ -19,25 +19,33 @@ export class HeaderContainerComponent {
|
|
|
19
19
|
this.ASSETS = ASSETS;
|
|
20
20
|
this.showBusinessCycle = BUSINESS_CYCLE_URL;
|
|
21
21
|
this.currentUrl = '';
|
|
22
|
+
this.showSearch = false;
|
|
23
|
+
this.isAdvanceSearch = false;
|
|
22
24
|
this.businessCycleChange = new EventEmitter();
|
|
23
25
|
this.openDialog = new EventEmitter();
|
|
26
|
+
this.onSearchAction = new EventEmitter();
|
|
24
27
|
this.currentUrl = window.location.pathname;
|
|
25
|
-
console.log('currentUrl', this.currentUrl);
|
|
26
28
|
}
|
|
27
29
|
businessCycleChangeHandler(event) {
|
|
28
30
|
this.businessCycleChange.emit(event);
|
|
29
31
|
}
|
|
30
32
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderContainerComponent, deps: [{ token: i1.ApiService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
31
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderContainerComponent, selector: "vc-header-container", inputs: { featureFlag: "featureFlag" }, outputs: { businessCycleChange: "businessCycleChange", openDialog: "openDialog" }, ngImport: i0, template: "<vc-global-alert [feature]=\"featureFlag\"></vc-global-alert>\r\n<div\r\n class=\"header-container vx-d-flex vx-align-center vx-justify-between vx-pr-3\"\r\n>\r\n <div class=\"vx-d-flex vx-align-center\">\r\n <a\r\n class=\"product-logo vx-d-flex vx-align-center vx-justify-center vx-mr-3\"\r\n [arTooltip]=\"'Go to Dashboard'\"\r\n placement=\"right\"\r\n type=\"white\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"true\"\r\n [animate]=\"true\"\r\n ><img [src]=\"ASSETS.v_icon\" alt=\"VComply\" width=\"24\" height=\"24\"\r\n /></a>\r\n <vc-business-cycle\r\n *ngIf=\"showBusinessCycle.includes(currentUrl)\"\r\n (businessCycleChange)=\"businessCycleChangeHandler($event)\"\r\n ></vc-business-cycle>\r\n </div>\r\n <div class=\"search-area\">\r\n <vc-search
|
|
33
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderContainerComponent, selector: "vc-header-container", inputs: { showSearch: "showSearch", featureFlag: "featureFlag", isAdvanceSearch: "isAdvanceSearch" }, outputs: { businessCycleChange: "businessCycleChange", openDialog: "openDialog", onSearchAction: "onSearchAction" }, ngImport: i0, template: "<vc-global-alert [feature]=\"featureFlag\"></vc-global-alert>\r\n<div\r\n class=\"header-container vx-d-flex vx-align-center vx-justify-between vx-pr-3\"\r\n>\r\n <div class=\"vx-d-flex vx-align-center\">\r\n <a\r\n class=\"product-logo vx-d-flex vx-align-center vx-justify-center vx-mr-3\"\r\n [arTooltip]=\"'Go to Dashboard'\"\r\n placement=\"right\"\r\n type=\"white\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"true\"\r\n [animate]=\"true\"\r\n ><img [src]=\"ASSETS.v_icon\" alt=\"VComply\" width=\"24\" height=\"24\"\r\n /></a>\r\n <vc-business-cycle\r\n *ngIf=\"showBusinessCycle.includes(currentUrl)\"\r\n (businessCycleChange)=\"businessCycleChangeHandler($event)\"\r\n ></vc-business-cycle>\r\n </div>\r\n <div class=\"search-area\">\r\n <vc-search\r\n *ngIf=\"showSearch\"\r\n [isAdvanceSearch]=\"isAdvanceSearch\"\r\n (onSearchAction)=\"onSearchAction.emit($event)\"\r\n ></vc-search>\r\n </div>\r\n <div class=\"vx-d-flex vx-align-center\">\r\n <vc-support (openSupport)=\"openDialog.emit('SUPPORT')\"></vc-support>\r\n <vc-create-workflow\r\n *ngIf=\"apiService.loggedUserDetail$ | async | checkPermission\"\r\n (openWorkflow)=\"openDialog.emit('WORKFLOW')\"\r\n ></vc-create-workflow>\r\n <vc-queue></vc-queue>\r\n <vc-user-details\r\n [userDetails]=\"apiService.loggedUserDetail$ | async\"\r\n [subscriptionDetails]=\"apiService.subscriptionDetail$ | async\"\r\n ></vc-user-details>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.header-container{height:3rem}.header-container .product-logo{width:3rem;height:3rem}.header-container .product-logo img{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: i4.GlobalAlertComponent, selector: "vc-global-alert", inputs: ["feature"], outputs: ["subscriptionStatus"] }, { kind: "component", type: i5.BusinessCycleComponent, selector: "vc-business-cycle", inputs: ["orgDetails"], outputs: ["businessCycleChange"] }, { kind: "component", type: i6.SearchComponent, selector: "vc-search", inputs: ["isAdvanceSearch"], outputs: ["onSearchAction"] }, { kind: "component", type: i7.CreateWorkflowComponent, selector: "vc-create-workflow", outputs: ["openWorkflow"] }, { kind: "component", type: i8.QueueComponent, selector: "vc-queue" }, { kind: "component", type: i9.UserDetailsComponent, selector: "vc-user-details", inputs: ["userDetails", "subscriptionDetails"] }, { kind: "component", type: i10.SupportComponent, selector: "vc-support", outputs: ["openSupport"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i11.CreatePermissionPipe, name: "checkPermission" }] }); }
|
|
32
34
|
}
|
|
33
35
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderContainerComponent, decorators: [{
|
|
34
36
|
type: Component,
|
|
35
|
-
args: [{ selector: 'vc-header-container', template: "<vc-global-alert [feature]=\"featureFlag\"></vc-global-alert>\r\n<div\r\n class=\"header-container vx-d-flex vx-align-center vx-justify-between vx-pr-3\"\r\n>\r\n <div class=\"vx-d-flex vx-align-center\">\r\n <a\r\n class=\"product-logo vx-d-flex vx-align-center vx-justify-center vx-mr-3\"\r\n [arTooltip]=\"'Go to Dashboard'\"\r\n placement=\"right\"\r\n type=\"white\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"true\"\r\n [animate]=\"true\"\r\n ><img [src]=\"ASSETS.v_icon\" alt=\"VComply\" width=\"24\" height=\"24\"\r\n /></a>\r\n <vc-business-cycle\r\n *ngIf=\"showBusinessCycle.includes(currentUrl)\"\r\n (businessCycleChange)=\"businessCycleChangeHandler($event)\"\r\n ></vc-business-cycle>\r\n </div>\r\n <div class=\"search-area\">\r\n <vc-search
|
|
36
|
-
}], ctorParameters: function () { return [{ type: i1.ApiService }]; }, propDecorators: {
|
|
37
|
+
args: [{ selector: 'vc-header-container', template: "<vc-global-alert [feature]=\"featureFlag\"></vc-global-alert>\r\n<div\r\n class=\"header-container vx-d-flex vx-align-center vx-justify-between vx-pr-3\"\r\n>\r\n <div class=\"vx-d-flex vx-align-center\">\r\n <a\r\n class=\"product-logo vx-d-flex vx-align-center vx-justify-center vx-mr-3\"\r\n [arTooltip]=\"'Go to Dashboard'\"\r\n placement=\"right\"\r\n type=\"white\"\r\n delay=\"0\"\r\n [tooltipMandatory]=\"true\"\r\n [animate]=\"true\"\r\n ><img [src]=\"ASSETS.v_icon\" alt=\"VComply\" width=\"24\" height=\"24\"\r\n /></a>\r\n <vc-business-cycle\r\n *ngIf=\"showBusinessCycle.includes(currentUrl)\"\r\n (businessCycleChange)=\"businessCycleChangeHandler($event)\"\r\n ></vc-business-cycle>\r\n </div>\r\n <div class=\"search-area\">\r\n <vc-search\r\n *ngIf=\"showSearch\"\r\n [isAdvanceSearch]=\"isAdvanceSearch\"\r\n (onSearchAction)=\"onSearchAction.emit($event)\"\r\n ></vc-search>\r\n </div>\r\n <div class=\"vx-d-flex vx-align-center\">\r\n <vc-support (openSupport)=\"openDialog.emit('SUPPORT')\"></vc-support>\r\n <vc-create-workflow\r\n *ngIf=\"apiService.loggedUserDetail$ | async | checkPermission\"\r\n (openWorkflow)=\"openDialog.emit('WORKFLOW')\"\r\n ></vc-create-workflow>\r\n <vc-queue></vc-queue>\r\n <vc-user-details\r\n [userDetails]=\"apiService.loggedUserDetail$ | async\"\r\n [subscriptionDetails]=\"apiService.subscriptionDetail$ | async\"\r\n ></vc-user-details>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.header-container{height:3rem}.header-container .product-logo{width:3rem;height:3rem}.header-container .product-logo img{pointer-events:none}\n"] }]
|
|
38
|
+
}], ctorParameters: function () { return [{ type: i1.ApiService }]; }, propDecorators: { showSearch: [{
|
|
39
|
+
type: Input
|
|
40
|
+
}], featureFlag: [{
|
|
41
|
+
type: Input
|
|
42
|
+
}], isAdvanceSearch: [{
|
|
37
43
|
type: Input
|
|
38
44
|
}], businessCycleChange: [{
|
|
39
45
|
type: Output
|
|
40
46
|
}], openDialog: [{
|
|
41
47
|
type: Output
|
|
48
|
+
}], onSearchAction: [{
|
|
49
|
+
type: Output
|
|
42
50
|
}] } });
|
|
43
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
51
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaGVhZGVyLWNvbnRhaW5lci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy92Yy1sYXlvdXQvc3JjL2xpYi9jb21wb25lbnRzL2hlYWRlci9oZWFkZXItY29udGFpbmVyL2hlYWRlci1jb250YWluZXIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvdmMtbGF5b3V0L3NyYy9saWIvY29tcG9uZW50cy9oZWFkZXIvaGVhZGVyLWNvbnRhaW5lci9oZWFkZXItY29udGFpbmVyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDdkUsT0FBTyxFQUFFLE1BQU0sRUFBRSxNQUFNLHFDQUFxQyxDQUFDO0FBRTdELE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLDRDQUE0QyxDQUFDOzs7Ozs7Ozs7Ozs7O0FBT2hGLE1BQU0sT0FBTyx3QkFBd0I7SUFhbkMsWUFBbUIsVUFBc0I7UUFBdEIsZUFBVSxHQUFWLFVBQVUsQ0FBWTtRQVp6QyxXQUFNLEdBQVEsTUFBTSxDQUFDO1FBQ3JCLHNCQUFpQixHQUFhLGtCQUFrQixDQUFDO1FBQ2pELGVBQVUsR0FBVyxFQUFFLENBQUM7UUFFZixlQUFVLEdBQVksS0FBSyxDQUFDO1FBRTVCLG9CQUFlLEdBQVksS0FBSyxDQUFDO1FBRWhDLHdCQUFtQixHQUFzQixJQUFJLFlBQVksRUFBRSxDQUFDO1FBQzVELGVBQVUsR0FBc0IsSUFBSSxZQUFZLEVBQU8sQ0FBQztRQUN4RCxtQkFBYyxHQUFzQixJQUFJLFlBQVksRUFBTyxDQUFDO1FBR3BFLElBQUksQ0FBQyxVQUFVLEdBQUcsTUFBTSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUM7SUFDN0MsQ0FBQztJQUVELDBCQUEwQixDQUFDLEtBQVU7UUFDbkMsSUFBSSxDQUFDLG1CQUFtQixDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUN2QyxDQUFDOytHQW5CVSx3QkFBd0I7bUdBQXhCLHdCQUF3QixzUkNWckMsOGdEQXdDQTs7NEZEOUJhLHdCQUF3QjtrQkFMcEMsU0FBUzsrQkFDRSxxQkFBcUI7aUdBU3RCLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSztnQkFDRyxlQUFlO3NCQUF2QixLQUFLO2dCQUVJLG1CQUFtQjtzQkFBNUIsTUFBTTtnQkFDRyxVQUFVO3NCQUFuQixNQUFNO2dCQUNHLGNBQWM7c0JBQXZCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBBU1NFVFMgfSBmcm9tICcuLi8uLi8uLi9jb25zdGFudHMvYXNzZXRzLmNvbnN0YW50cyc7XHJcbmltcG9ydCB7IEFwaVNlcnZpY2UgfSBmcm9tICcuLi8uLi8uLi9zaGFyZWQvc2VydmljZXMvYXBpLnNlcnZpY2UnO1xyXG5pbXBvcnQgeyBCVVNJTkVTU19DWUNMRV9VUkwgfSBmcm9tICcuLi8uLi8uLi9jb25zdGFudHMvYnVzaW5lc3MtY3ljbGUuY29uc3RhbnQnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICd2Yy1oZWFkZXItY29udGFpbmVyJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vaGVhZGVyLWNvbnRhaW5lci5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vaGVhZGVyLWNvbnRhaW5lci5jb21wb25lbnQubGVzcyddLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgSGVhZGVyQ29udGFpbmVyQ29tcG9uZW50IHtcclxuICBBU1NFVFM6IGFueSA9IEFTU0VUUztcclxuICBzaG93QnVzaW5lc3NDeWNsZTogc3RyaW5nW10gPSBCVVNJTkVTU19DWUNMRV9VUkw7XHJcbiAgY3VycmVudFVybDogc3RyaW5nID0gJyc7XHJcblxyXG4gIEBJbnB1dCgpIHNob3dTZWFyY2g6IGJvb2xlYW4gPSBmYWxzZTtcclxuICBASW5wdXQoKSBmZWF0dXJlRmxhZzogYW55O1xyXG4gIEBJbnB1dCgpIGlzQWR2YW5jZVNlYXJjaDogYm9vbGVhbiA9IGZhbHNlO1xyXG5cclxuICBAT3V0cHV0KCkgYnVzaW5lc3NDeWNsZUNoYW5nZTogRXZlbnRFbWl0dGVyPGFueT4gPSBuZXcgRXZlbnRFbWl0dGVyKCk7XHJcbiAgQE91dHB1dCgpIG9wZW5EaWFsb2c6IEV2ZW50RW1pdHRlcjxhbnk+ID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KCk7XHJcbiAgQE91dHB1dCgpIG9uU2VhcmNoQWN0aW9uOiBFdmVudEVtaXR0ZXI8YW55PiA9IG5ldyBFdmVudEVtaXR0ZXI8YW55PigpO1xyXG5cclxuICBjb25zdHJ1Y3RvcihwdWJsaWMgYXBpU2VydmljZTogQXBpU2VydmljZSkge1xyXG4gICAgdGhpcy5jdXJyZW50VXJsID0gd2luZG93LmxvY2F0aW9uLnBhdGhuYW1lO1xyXG4gIH1cclxuXHJcbiAgYnVzaW5lc3NDeWNsZUNoYW5nZUhhbmRsZXIoZXZlbnQ6IGFueSkge1xyXG4gICAgdGhpcy5idXNpbmVzc0N5Y2xlQ2hhbmdlLmVtaXQoZXZlbnQpO1xyXG4gIH1cclxufVxyXG4iLCI8dmMtZ2xvYmFsLWFsZXJ0IFtmZWF0dXJlXT1cImZlYXR1cmVGbGFnXCI+PC92Yy1nbG9iYWwtYWxlcnQ+XHJcbjxkaXZcclxuICBjbGFzcz1cImhlYWRlci1jb250YWluZXIgdngtZC1mbGV4IHZ4LWFsaWduLWNlbnRlciB2eC1qdXN0aWZ5LWJldHdlZW4gdngtcHItM1wiXHJcbj5cclxuICA8ZGl2IGNsYXNzPVwidngtZC1mbGV4IHZ4LWFsaWduLWNlbnRlclwiPlxyXG4gICAgPGFcclxuICAgICAgY2xhc3M9XCJwcm9kdWN0LWxvZ28gdngtZC1mbGV4IHZ4LWFsaWduLWNlbnRlciB2eC1qdXN0aWZ5LWNlbnRlciB2eC1tci0zXCJcclxuICAgICAgW2FyVG9vbHRpcF09XCInR28gdG8gRGFzaGJvYXJkJ1wiXHJcbiAgICAgIHBsYWNlbWVudD1cInJpZ2h0XCJcclxuICAgICAgdHlwZT1cIndoaXRlXCJcclxuICAgICAgZGVsYXk9XCIwXCJcclxuICAgICAgW3Rvb2x0aXBNYW5kYXRvcnldPVwidHJ1ZVwiXHJcbiAgICAgIFthbmltYXRlXT1cInRydWVcIlxyXG4gICAgICA+PGltZyBbc3JjXT1cIkFTU0VUUy52X2ljb25cIiBhbHQ9XCJWQ29tcGx5XCIgd2lkdGg9XCIyNFwiIGhlaWdodD1cIjI0XCJcclxuICAgIC8+PC9hPlxyXG4gICAgPHZjLWJ1c2luZXNzLWN5Y2xlXHJcbiAgICAgICpuZ0lmPVwic2hvd0J1c2luZXNzQ3ljbGUuaW5jbHVkZXMoY3VycmVudFVybClcIlxyXG4gICAgICAoYnVzaW5lc3NDeWNsZUNoYW5nZSk9XCJidXNpbmVzc0N5Y2xlQ2hhbmdlSGFuZGxlcigkZXZlbnQpXCJcclxuICAgID48L3ZjLWJ1c2luZXNzLWN5Y2xlPlxyXG4gIDwvZGl2PlxyXG4gIDxkaXYgY2xhc3M9XCJzZWFyY2gtYXJlYVwiPlxyXG4gICAgPHZjLXNlYXJjaFxyXG4gICAgICAqbmdJZj1cInNob3dTZWFyY2hcIlxyXG4gICAgICBbaXNBZHZhbmNlU2VhcmNoXT1cImlzQWR2YW5jZVNlYXJjaFwiXHJcbiAgICAgIChvblNlYXJjaEFjdGlvbik9XCJvblNlYXJjaEFjdGlvbi5lbWl0KCRldmVudClcIlxyXG4gICAgPjwvdmMtc2VhcmNoPlxyXG4gIDwvZGl2PlxyXG4gIDxkaXYgY2xhc3M9XCJ2eC1kLWZsZXggdngtYWxpZ24tY2VudGVyXCI+XHJcbiAgICA8dmMtc3VwcG9ydCAob3BlblN1cHBvcnQpPVwib3BlbkRpYWxvZy5lbWl0KCdTVVBQT1JUJylcIj48L3ZjLXN1cHBvcnQ+XHJcbiAgICA8dmMtY3JlYXRlLXdvcmtmbG93XHJcbiAgICAgICpuZ0lmPVwiYXBpU2VydmljZS5sb2dnZWRVc2VyRGV0YWlsJCB8IGFzeW5jIHwgY2hlY2tQZXJtaXNzaW9uXCJcclxuICAgICAgKG9wZW5Xb3JrZmxvdyk9XCJvcGVuRGlhbG9nLmVtaXQoJ1dPUktGTE9XJylcIlxyXG4gICAgPjwvdmMtY3JlYXRlLXdvcmtmbG93PlxyXG4gICAgPHZjLXF1ZXVlPjwvdmMtcXVldWU+XHJcbiAgICA8dmMtdXNlci1kZXRhaWxzXHJcbiAgICAgIFt1c2VyRGV0YWlsc109XCJhcGlTZXJ2aWNlLmxvZ2dlZFVzZXJEZXRhaWwkIHwgYXN5bmNcIlxyXG4gICAgICBbc3Vic2NyaXB0aW9uRGV0YWlsc109XCJhcGlTZXJ2aWNlLnN1YnNjcmlwdGlvbkRldGFpbCQgfCBhc3luY1wiXHJcbiAgICA+PC92Yy11c2VyLWRldGFpbHM+XHJcbiAgPC9kaXY+XHJcbjwvZGl2PlxyXG4iXX0=
|
|
@@ -13,6 +13,7 @@ import { PopoverModule } from '../../shared/ui-kit/popover/popover.module';
|
|
|
13
13
|
import { FormgroupModule } from '../../shared/ui-kit/formgroup/formgroup.module';
|
|
14
14
|
import { GlobalAlertModule } from '../global-alert/global-alert.module';
|
|
15
15
|
import { PipesModule } from '../../shared/pipe/pipes.module';
|
|
16
|
+
import { FormsModule } from '@angular/forms';
|
|
16
17
|
import * as i0 from "@angular/core";
|
|
17
18
|
export class HeaderModule {
|
|
18
19
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
@@ -28,14 +29,18 @@ export class HeaderModule {
|
|
|
28
29
|
PopoverModule,
|
|
29
30
|
FormgroupModule,
|
|
30
31
|
GlobalAlertModule,
|
|
31
|
-
PipesModule
|
|
32
|
+
PipesModule,
|
|
33
|
+
FormsModule,
|
|
34
|
+
FormgroupModule], exports: [HeaderContainerComponent] }); }
|
|
32
35
|
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderModule, imports: [CommonModule,
|
|
33
36
|
TooltipModule,
|
|
34
37
|
AvatarModule,
|
|
35
38
|
PopoverModule,
|
|
36
39
|
FormgroupModule,
|
|
37
40
|
GlobalAlertModule,
|
|
38
|
-
PipesModule
|
|
41
|
+
PipesModule,
|
|
42
|
+
FormsModule,
|
|
43
|
+
FormgroupModule] }); }
|
|
39
44
|
}
|
|
40
45
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderModule, decorators: [{
|
|
41
46
|
type: NgModule,
|
|
@@ -57,8 +62,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
57
62
|
FormgroupModule,
|
|
58
63
|
GlobalAlertModule,
|
|
59
64
|
PipesModule,
|
|
65
|
+
FormsModule,
|
|
66
|
+
FormgroupModule,
|
|
60
67
|
],
|
|
61
68
|
exports: [HeaderContainerComponent],
|
|
62
69
|
}]
|
|
63
70
|
}] });
|
|
64
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
71
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaGVhZGVyLm1vZHVsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3ZjLWxheW91dC9zcmMvbGliL2NvbXBvbmVudHMvaGVhZGVyL2hlYWRlci5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLHdCQUF3QixFQUFFLE1BQU0sK0NBQStDLENBQUM7QUFDekYsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLDRDQUE0QyxDQUFDO0FBQzNFLE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxNQUFNLDJDQUEyQyxDQUFDO0FBQ25GLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUM1RCxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSw2Q0FBNkMsQ0FBQztBQUN0RixPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0seUJBQXlCLENBQUM7QUFDekQsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0sdUNBQXVDLENBQUM7QUFDN0UsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDL0QsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLDBDQUEwQyxDQUFDO0FBQ3hFLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSw0Q0FBNEMsQ0FBQztBQUMzRSxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sZ0RBQWdELENBQUM7QUFDakYsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0scUNBQXFDLENBQUM7QUFDeEUsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLGdDQUFnQyxDQUFDO0FBQzdELE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQzs7QUF5QjdDLE1BQU0sT0FBTyxZQUFZOytHQUFaLFlBQVk7Z0hBQVosWUFBWSxpQkFyQnJCLHdCQUF3QjtZQUN4QixzQkFBc0I7WUFDdEIsZUFBZTtZQUNmLHVCQUF1QjtZQUN2QixjQUFjO1lBQ2Qsb0JBQW9CO1lBQ3BCLGdCQUFnQixhQUdoQixZQUFZO1lBQ1osYUFBYTtZQUNiLFlBQVk7WUFDWixhQUFhO1lBQ2IsZUFBZTtZQUNmLGlCQUFpQjtZQUNqQixXQUFXO1lBQ1gsV0FBVztZQUNYLGVBQWUsYUFFUCx3QkFBd0I7Z0hBRXZCLFlBQVksWUFackIsWUFBWTtZQUNaLGFBQWE7WUFDYixZQUFZO1lBQ1osYUFBYTtZQUNiLGVBQWU7WUFDZixpQkFBaUI7WUFDakIsV0FBVztZQUNYLFdBQVc7WUFDWCxlQUFlOzs0RkFJTixZQUFZO2tCQXZCeEIsUUFBUTttQkFBQztvQkFDUixZQUFZLEVBQUU7d0JBQ1osd0JBQXdCO3dCQUN4QixzQkFBc0I7d0JBQ3RCLGVBQWU7d0JBQ2YsdUJBQXVCO3dCQUN2QixjQUFjO3dCQUNkLG9CQUFvQjt3QkFDcEIsZ0JBQWdCO3FCQUNqQjtvQkFDRCxPQUFPLEVBQUU7d0JBQ1AsWUFBWTt3QkFDWixhQUFhO3dCQUNiLFlBQVk7d0JBQ1osYUFBYTt3QkFDYixlQUFlO3dCQUNmLGlCQUFpQjt3QkFDakIsV0FBVzt3QkFDWCxXQUFXO3dCQUNYLGVBQWU7cUJBQ2hCO29CQUNELE9BQU8sRUFBRSxDQUFDLHdCQUF3QixDQUFDO2lCQUNwQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XHJcbmltcG9ydCB7IEhlYWRlckNvbnRhaW5lckNvbXBvbmVudCB9IGZyb20gJy4vaGVhZGVyLWNvbnRhaW5lci9oZWFkZXItY29udGFpbmVyLmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IFRvb2x0aXBNb2R1bGUgfSBmcm9tICcuLi8uLi9zaGFyZWQvdWkta2l0L3Rvb2x0aXAvdG9vbHRpcC5tb2R1bGUnO1xyXG5pbXBvcnQgeyBCdXNpbmVzc0N5Y2xlQ29tcG9uZW50IH0gZnJvbSAnLi9idXNpbmVzcy1jeWNsZS9idXNpbmVzcy1jeWNsZS5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBTZWFyY2hDb21wb25lbnQgfSBmcm9tICcuL3NlYXJjaC9zZWFyY2guY29tcG9uZW50JztcclxuaW1wb3J0IHsgQ3JlYXRlV29ya2Zsb3dDb21wb25lbnQgfSBmcm9tICcuL2NyZWF0ZS13b3JrZmxvdy9jcmVhdGUtd29ya2Zsb3cuY29tcG9uZW50JztcclxuaW1wb3J0IHsgUXVldWVDb21wb25lbnQgfSBmcm9tICcuL3F1ZXVlL3F1ZXVlLmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IFVzZXJEZXRhaWxzQ29tcG9uZW50IH0gZnJvbSAnLi91c2VyLWRldGFpbHMvdXNlci1kZXRhaWxzLmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IFN1cHBvcnRDb21wb25lbnQgfSBmcm9tICcuL3N1cHBvcnQvc3VwcG9ydC5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBBdmF0YXJNb2R1bGUgfSBmcm9tICcuLi8uLi9zaGFyZWQvdWkta2l0L2F2YXRhci9hdmF0YXIubW9kdWxlJztcclxuaW1wb3J0IHsgUG9wb3Zlck1vZHVsZSB9IGZyb20gJy4uLy4uL3NoYXJlZC91aS1raXQvcG9wb3Zlci9wb3BvdmVyLm1vZHVsZSc7XHJcbmltcG9ydCB7IEZvcm1ncm91cE1vZHVsZSB9IGZyb20gJy4uLy4uL3NoYXJlZC91aS1raXQvZm9ybWdyb3VwL2Zvcm1ncm91cC5tb2R1bGUnO1xyXG5pbXBvcnQgeyBHbG9iYWxBbGVydE1vZHVsZSB9IGZyb20gJy4uL2dsb2JhbC1hbGVydC9nbG9iYWwtYWxlcnQubW9kdWxlJztcclxuaW1wb3J0IHsgUGlwZXNNb2R1bGUgfSBmcm9tICcuLi8uLi9zaGFyZWQvcGlwZS9waXBlcy5tb2R1bGUnO1xyXG5pbXBvcnQgeyBGb3Jtc01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuXHJcbkBOZ01vZHVsZSh7XHJcbiAgZGVjbGFyYXRpb25zOiBbXHJcbiAgICBIZWFkZXJDb250YWluZXJDb21wb25lbnQsXHJcbiAgICBCdXNpbmVzc0N5Y2xlQ29tcG9uZW50LFxyXG4gICAgU2VhcmNoQ29tcG9uZW50LFxyXG4gICAgQ3JlYXRlV29ya2Zsb3dDb21wb25lbnQsXHJcbiAgICBRdWV1ZUNvbXBvbmVudCxcclxuICAgIFVzZXJEZXRhaWxzQ29tcG9uZW50LFxyXG4gICAgU3VwcG9ydENvbXBvbmVudCxcclxuICBdLFxyXG4gIGltcG9ydHM6IFtcclxuICAgIENvbW1vbk1vZHVsZSxcclxuICAgIFRvb2x0aXBNb2R1bGUsXHJcbiAgICBBdmF0YXJNb2R1bGUsXHJcbiAgICBQb3BvdmVyTW9kdWxlLFxyXG4gICAgRm9ybWdyb3VwTW9kdWxlLFxyXG4gICAgR2xvYmFsQWxlcnRNb2R1bGUsXHJcbiAgICBQaXBlc01vZHVsZSxcclxuICAgIEZvcm1zTW9kdWxlLFxyXG4gICAgRm9ybWdyb3VwTW9kdWxlLFxyXG4gIF0sXHJcbiAgZXhwb3J0czogW0hlYWRlckNvbnRhaW5lckNvbXBvbmVudF0sXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBIZWFkZXJNb2R1bGUge31cclxuIl19
|
|
@@ -1,14 +1,130 @@
|
|
|
1
|
-
import { Component } from '@angular/core';
|
|
1
|
+
import { Component, EventEmitter, Input, Output, ViewChild, } from '@angular/core';
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
|
-
import * as i1 from "
|
|
3
|
+
import * as i1 from "@angular/common";
|
|
4
|
+
import * as i2 from "../../../shared/ui-kit/tooltip/tooltip.directive";
|
|
5
|
+
import * as i3 from "@angular/forms";
|
|
4
6
|
export class SearchComponent {
|
|
5
|
-
constructor() {
|
|
7
|
+
constructor(renderer) {
|
|
8
|
+
this.renderer = renderer;
|
|
9
|
+
this.searchValue = '';
|
|
10
|
+
this.isDivClicked = false;
|
|
11
|
+
this.isAdvanceSearch = false;
|
|
12
|
+
this.onSearchAction = new EventEmitter();
|
|
13
|
+
this.renderer.listen('window', 'click', (e) => {
|
|
14
|
+
/**
|
|
15
|
+
* Only run when toggleButton is not clicked
|
|
16
|
+
* If we don't check this, all clicks (even on the toggle button) gets into this
|
|
17
|
+
* section which in the result we might never see the menu open!
|
|
18
|
+
* And the menu itself is checked here, and it's where we check just outside of
|
|
19
|
+
* the menu and button the condition abbove must close the menu
|
|
20
|
+
*/
|
|
21
|
+
console.log('e.target', this.searchArea.nativeElement, e.target !== this.searchArea.nativeElement);
|
|
22
|
+
if (e.target !== this.searchBox.nativeElement &&
|
|
23
|
+
e.target !== this.searchArea.nativeElement) {
|
|
24
|
+
this.isDivClicked = false;
|
|
25
|
+
}
|
|
26
|
+
});
|
|
27
|
+
}
|
|
6
28
|
ngOnInit() { }
|
|
7
|
-
|
|
8
|
-
|
|
29
|
+
onKeyUp(event) {
|
|
30
|
+
if (event.key === 'Enter') {
|
|
31
|
+
this.onSearch('search', this.searchValue);
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
onSearch(type, searchValue) {
|
|
35
|
+
this.onSearchAction.emit({ type, searchValue });
|
|
36
|
+
}
|
|
37
|
+
onCrossClick() {
|
|
38
|
+
this.searchValue = '';
|
|
39
|
+
this.onSearch('search', '');
|
|
40
|
+
}
|
|
41
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SearchComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
42
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SearchComponent, selector: "vc-search", inputs: { isAdvanceSearch: "isAdvanceSearch" }, outputs: { onSearchAction: "onSearchAction" }, viewQueries: [{ propertyName: "searchArea", first: true, predicate: ["searchArea"], descendants: true }, { propertyName: "searchBox", first: true, predicate: ["searchBox"], descendants: true }], ngImport: i0, template: `
|
|
43
|
+
<div
|
|
44
|
+
class="vc-search"
|
|
45
|
+
(click)="isDivClicked = true"
|
|
46
|
+
[class.searchFocus]="isDivClicked"
|
|
47
|
+
#searchArea
|
|
48
|
+
>
|
|
49
|
+
<input
|
|
50
|
+
[(ngModel)]="searchValue"
|
|
51
|
+
(keyup)="onKeyUp($event)"
|
|
52
|
+
(focusOut)="isDivClicked = false"
|
|
53
|
+
type="text"
|
|
54
|
+
placeholder="Search"
|
|
55
|
+
#searchBox
|
|
56
|
+
/>
|
|
57
|
+
<i class="icons serachIcon vx-fs-10 vx-txt-white"></i>
|
|
58
|
+
|
|
59
|
+
<div
|
|
60
|
+
*ngIf="isAdvanceSearch"
|
|
61
|
+
(click)="onSearch('advanceSearch', '')"
|
|
62
|
+
class="vc-advance-search-btn vx-d-flex vx-align-center vx-justify-center"
|
|
63
|
+
[arTooltip]="'Advance Search'"
|
|
64
|
+
placement="bottom"
|
|
65
|
+
type="black"
|
|
66
|
+
delay="0"
|
|
67
|
+
[tooltipMandatory]="true"
|
|
68
|
+
>
|
|
69
|
+
<i class="icons vx-fs-12"></i>
|
|
70
|
+
</div>
|
|
71
|
+
<i
|
|
72
|
+
*ngIf="searchValue"
|
|
73
|
+
(click)="onCrossClick()"
|
|
74
|
+
class="icons crossIcon vx-fs-10 vx-txt-white"
|
|
75
|
+
></i
|
|
76
|
+
>
|
|
77
|
+
</div>
|
|
78
|
+
`, isInline: true, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.vc-search{position:relative}.vc-search.searchFocus input{background:#fff;color:#565a6f;outline:none;width:30rem;height:1.875rem}.vc-search.searchFocus input::placeholder{color:#a9aab6}.vc-search.searchFocus .serachIcon{color:#565a6f}.vc-search.searchFocus .crossIcon{color:#565a6f;display:block}.vc-search.searchFocus .vc-advance-search-btn{background:#e3e3e9;border-radius:50px;top:3px}.vc-search.searchFocus .vc-advance-search-btn i{color:#565a6f}.vc-search input{background:transparent;border-radius:24px;border:1px solid #565a6f;color:#fff;font-size:11px;font-weight:300;padding:0 2rem 0 1.5rem;height:1.75rem;width:18rem;transition:all .3s ease-out}.vc-search input:hover{border-color:#787a8c}.vc-search input::placeholder{color:#fff}.vc-search i{position:absolute;cursor:pointer;left:10px;top:10px;z-index:1}.vc-search i.crossIcon{left:unset;right:.75rem}.vc-search .vc-advance-search-btn{width:1.5rem;height:1.5rem;position:absolute;right:.25rem;top:.125rem;cursor:pointer}.vc-search .vc-advance-search-btn i{color:#cdced6;position:static}.vc-search .vc-advance-search-btn~i.crossIcon{right:2.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ToolTipDirective, selector: "[arTooltip]", inputs: ["arTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
9
79
|
}
|
|
10
80
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SearchComponent, decorators: [{
|
|
11
81
|
type: Component,
|
|
12
|
-
args: [{ selector: 'vc-search', template:
|
|
13
|
-
|
|
14
|
-
|
|
82
|
+
args: [{ selector: 'vc-search', template: `
|
|
83
|
+
<div
|
|
84
|
+
class="vc-search"
|
|
85
|
+
(click)="isDivClicked = true"
|
|
86
|
+
[class.searchFocus]="isDivClicked"
|
|
87
|
+
#searchArea
|
|
88
|
+
>
|
|
89
|
+
<input
|
|
90
|
+
[(ngModel)]="searchValue"
|
|
91
|
+
(keyup)="onKeyUp($event)"
|
|
92
|
+
(focusOut)="isDivClicked = false"
|
|
93
|
+
type="text"
|
|
94
|
+
placeholder="Search"
|
|
95
|
+
#searchBox
|
|
96
|
+
/>
|
|
97
|
+
<i class="icons serachIcon vx-fs-10 vx-txt-white"></i>
|
|
98
|
+
|
|
99
|
+
<div
|
|
100
|
+
*ngIf="isAdvanceSearch"
|
|
101
|
+
(click)="onSearch('advanceSearch', '')"
|
|
102
|
+
class="vc-advance-search-btn vx-d-flex vx-align-center vx-justify-center"
|
|
103
|
+
[arTooltip]="'Advance Search'"
|
|
104
|
+
placement="bottom"
|
|
105
|
+
type="black"
|
|
106
|
+
delay="0"
|
|
107
|
+
[tooltipMandatory]="true"
|
|
108
|
+
>
|
|
109
|
+
<i class="icons vx-fs-12"></i>
|
|
110
|
+
</div>
|
|
111
|
+
<i
|
|
112
|
+
*ngIf="searchValue"
|
|
113
|
+
(click)="onCrossClick()"
|
|
114
|
+
class="icons crossIcon vx-fs-10 vx-txt-white"
|
|
115
|
+
></i
|
|
116
|
+
>
|
|
117
|
+
</div>
|
|
118
|
+
`, styles: ["@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";.vc-search{position:relative}.vc-search.searchFocus input{background:#fff;color:#565a6f;outline:none;width:30rem;height:1.875rem}.vc-search.searchFocus input::placeholder{color:#a9aab6}.vc-search.searchFocus .serachIcon{color:#565a6f}.vc-search.searchFocus .crossIcon{color:#565a6f;display:block}.vc-search.searchFocus .vc-advance-search-btn{background:#e3e3e9;border-radius:50px;top:3px}.vc-search.searchFocus .vc-advance-search-btn i{color:#565a6f}.vc-search input{background:transparent;border-radius:24px;border:1px solid #565a6f;color:#fff;font-size:11px;font-weight:300;padding:0 2rem 0 1.5rem;height:1.75rem;width:18rem;transition:all .3s ease-out}.vc-search input:hover{border-color:#787a8c}.vc-search input::placeholder{color:#fff}.vc-search i{position:absolute;cursor:pointer;left:10px;top:10px;z-index:1}.vc-search i.crossIcon{left:unset;right:.75rem}.vc-search .vc-advance-search-btn{width:1.5rem;height:1.5rem;position:absolute;right:.25rem;top:.125rem;cursor:pointer}.vc-search .vc-advance-search-btn i{color:#cdced6;position:static}.vc-search .vc-advance-search-btn~i.crossIcon{right:2.5rem}\n"] }]
|
|
119
|
+
}], ctorParameters: function () { return [{ type: i0.Renderer2 }]; }, propDecorators: { isAdvanceSearch: [{
|
|
120
|
+
type: Input
|
|
121
|
+
}], searchArea: [{
|
|
122
|
+
type: ViewChild,
|
|
123
|
+
args: ['searchArea']
|
|
124
|
+
}], searchBox: [{
|
|
125
|
+
type: ViewChild,
|
|
126
|
+
args: ['searchBox']
|
|
127
|
+
}], onSearchAction: [{
|
|
128
|
+
type: Output
|
|
129
|
+
}] } });
|
|
130
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VhcmNoLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3ZjLWxheW91dC9zcmMvbGliL2NvbXBvbmVudHMvaGVhZGVyL3NlYXJjaC9zZWFyY2guY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxTQUFTLEVBRVQsWUFBWSxFQUNaLEtBQUssRUFFTCxNQUFNLEVBRU4sU0FBUyxHQUNWLE1BQU0sZUFBZSxDQUFDOzs7OztBQTJDdkIsTUFBTSxPQUFPLGVBQWU7SUFVMUIsWUFBb0IsUUFBbUI7UUFBbkIsYUFBUSxHQUFSLFFBQVEsQ0FBVztRQVR2QyxnQkFBVyxHQUFXLEVBQUUsQ0FBQztRQUN6QixpQkFBWSxHQUFZLEtBQUssQ0FBQztRQUNyQixvQkFBZSxHQUFZLEtBQUssQ0FBQztRQUtoQyxtQkFBYyxHQUFzQixJQUFJLFlBQVksRUFBTyxDQUFDO1FBR3BFLElBQUksQ0FBQyxRQUFRLENBQUMsTUFBTSxDQUFDLFFBQVEsRUFBRSxPQUFPLEVBQUUsQ0FBQyxDQUFRLEVBQUUsRUFBRTtZQUNuRDs7Ozs7O2VBTUc7WUFFSCxPQUFPLENBQUMsR0FBRyxDQUNULFVBQVUsRUFDVixJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsRUFDN0IsQ0FBQyxDQUFDLE1BQU0sS0FBSyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FDM0MsQ0FBQztZQUNGLElBQ0UsQ0FBQyxDQUFDLE1BQU0sS0FBSyxJQUFJLENBQUMsU0FBUyxDQUFDLGFBQWE7Z0JBQ3pDLENBQUMsQ0FBQyxNQUFNLEtBQUssSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLEVBQzFDO2dCQUNBLElBQUksQ0FBQyxZQUFZLEdBQUcsS0FBSyxDQUFDO2FBQzNCO1FBQ0gsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRUQsUUFBUSxLQUFVLENBQUM7SUFFbkIsT0FBTyxDQUFDLEtBQVU7UUFDaEIsSUFBSSxLQUFLLENBQUMsR0FBRyxLQUFLLE9BQU8sRUFBRTtZQUN6QixJQUFJLENBQUMsUUFBUSxDQUFDLFFBQVEsRUFBRSxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUM7U0FDM0M7SUFDSCxDQUFDO0lBRUQsUUFBUSxDQUFDLElBQVksRUFBRSxXQUFtQjtRQUN4QyxJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxFQUFFLElBQUksRUFBRSxXQUFXLEVBQUUsQ0FBQyxDQUFDO0lBQ2xELENBQUM7SUFFRCxZQUFZO1FBQ1YsSUFBSSxDQUFDLFdBQVcsR0FBRyxFQUFFLENBQUM7UUFDdEIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLEVBQUUsRUFBRSxDQUFDLENBQUM7SUFDOUIsQ0FBQzsrR0FqRFUsZUFBZTttR0FBZixlQUFlLG1WQXZDaEI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW9DVDs7NEZBR1UsZUFBZTtrQkF6QzNCLFNBQVM7K0JBQ0UsV0FBVyxZQUNYOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7R0FvQ1Q7Z0dBTVEsZUFBZTtzQkFBdkIsS0FBSztnQkFFbUIsVUFBVTtzQkFBbEMsU0FBUzt1QkFBQyxZQUFZO2dCQUNDLFNBQVM7c0JBQWhDLFNBQVM7dUJBQUMsV0FBVztnQkFFWixjQUFjO3NCQUF2QixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcclxuICBDb21wb25lbnQsXHJcbiAgRWxlbWVudFJlZixcclxuICBFdmVudEVtaXR0ZXIsXHJcbiAgSW5wdXQsXHJcbiAgT25Jbml0LFxyXG4gIE91dHB1dCxcclxuICBSZW5kZXJlcjIsXHJcbiAgVmlld0NoaWxkLFxyXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICd2Yy1zZWFyY2gnLFxyXG4gIHRlbXBsYXRlOiBgXHJcbiAgICA8ZGl2XHJcbiAgICAgIGNsYXNzPVwidmMtc2VhcmNoXCJcclxuICAgICAgKGNsaWNrKT1cImlzRGl2Q2xpY2tlZCA9IHRydWVcIlxyXG4gICAgICBbY2xhc3Muc2VhcmNoRm9jdXNdPVwiaXNEaXZDbGlja2VkXCJcclxuICAgICAgI3NlYXJjaEFyZWFcclxuICAgID5cclxuICAgICAgPGlucHV0XHJcbiAgICAgICAgWyhuZ01vZGVsKV09XCJzZWFyY2hWYWx1ZVwiXHJcbiAgICAgICAgKGtleXVwKT1cIm9uS2V5VXAoJGV2ZW50KVwiXHJcbiAgICAgICAgKGZvY3VzT3V0KT1cImlzRGl2Q2xpY2tlZCA9IGZhbHNlXCJcclxuICAgICAgICB0eXBlPVwidGV4dFwiXHJcbiAgICAgICAgcGxhY2Vob2xkZXI9XCJTZWFyY2hcIlxyXG4gICAgICAgICNzZWFyY2hCb3hcclxuICAgICAgLz5cclxuICAgICAgPGkgY2xhc3M9XCJpY29ucyBzZXJhY2hJY29uIHZ4LWZzLTEwIHZ4LXR4dC13aGl0ZVwiPiYjeGU5MGI7PC9pPlxyXG5cclxuICAgICAgPGRpdlxyXG4gICAgICAgICpuZ0lmPVwiaXNBZHZhbmNlU2VhcmNoXCJcclxuICAgICAgICAoY2xpY2spPVwib25TZWFyY2goJ2FkdmFuY2VTZWFyY2gnLCAnJylcIlxyXG4gICAgICAgIGNsYXNzPVwidmMtYWR2YW5jZS1zZWFyY2gtYnRuIHZ4LWQtZmxleCB2eC1hbGlnbi1jZW50ZXIgdngtanVzdGlmeS1jZW50ZXJcIlxyXG4gICAgICAgIFthclRvb2x0aXBdPVwiJ0FkdmFuY2UgU2VhcmNoJ1wiXHJcbiAgICAgICAgcGxhY2VtZW50PVwiYm90dG9tXCJcclxuICAgICAgICB0eXBlPVwiYmxhY2tcIlxyXG4gICAgICAgIGRlbGF5PVwiMFwiXHJcbiAgICAgICAgW3Rvb2x0aXBNYW5kYXRvcnldPVwidHJ1ZVwiXHJcbiAgICAgID5cclxuICAgICAgICA8aSBjbGFzcz1cImljb25zIHZ4LWZzLTEyXCI+JiN4ZWE5MTs8L2k+XHJcbiAgICAgIDwvZGl2PlxyXG4gICAgICA8aVxyXG4gICAgICAgICpuZ0lmPVwic2VhcmNoVmFsdWVcIlxyXG4gICAgICAgIChjbGljayk9XCJvbkNyb3NzQ2xpY2soKVwiXHJcbiAgICAgICAgY2xhc3M9XCJpY29ucyBjcm9zc0ljb24gdngtZnMtMTAgdngtdHh0LXdoaXRlXCJcclxuICAgICAgICA+JiN4ZTlhZTs8L2lcclxuICAgICAgPlxyXG4gICAgPC9kaXY+XHJcbiAgYCxcclxuICBzdHlsZVVybHM6IFsnLi9zZWFyY2guY29tcG9uZW50Lmxlc3MnXSxcclxufSlcclxuZXhwb3J0IGNsYXNzIFNlYXJjaENvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XHJcbiAgc2VhcmNoVmFsdWU6IHN0cmluZyA9ICcnO1xyXG4gIGlzRGl2Q2xpY2tlZDogYm9vbGVhbiA9IGZhbHNlO1xyXG4gIEBJbnB1dCgpIGlzQWR2YW5jZVNlYXJjaDogYm9vbGVhbiA9IGZhbHNlO1xyXG5cclxuICBAVmlld0NoaWxkKCdzZWFyY2hBcmVhJykgc2VhcmNoQXJlYSE6IEVsZW1lbnRSZWY7XHJcbiAgQFZpZXdDaGlsZCgnc2VhcmNoQm94Jykgc2VhcmNoQm94ITogRWxlbWVudFJlZjtcclxuXHJcbiAgQE91dHB1dCgpIG9uU2VhcmNoQWN0aW9uOiBFdmVudEVtaXR0ZXI8YW55PiA9IG5ldyBFdmVudEVtaXR0ZXI8YW55PigpO1xyXG5cclxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIHJlbmRlcmVyOiBSZW5kZXJlcjIpIHtcclxuICAgIHRoaXMucmVuZGVyZXIubGlzdGVuKCd3aW5kb3cnLCAnY2xpY2snLCAoZTogRXZlbnQpID0+IHtcclxuICAgICAgLyoqXHJcbiAgICAgICAqIE9ubHkgcnVuIHdoZW4gdG9nZ2xlQnV0dG9uIGlzIG5vdCBjbGlja2VkXHJcbiAgICAgICAqIElmIHdlIGRvbid0IGNoZWNrIHRoaXMsIGFsbCBjbGlja3MgKGV2ZW4gb24gdGhlIHRvZ2dsZSBidXR0b24pIGdldHMgaW50byB0aGlzXHJcbiAgICAgICAqIHNlY3Rpb24gd2hpY2ggaW4gdGhlIHJlc3VsdCB3ZSBtaWdodCBuZXZlciBzZWUgdGhlIG1lbnUgb3BlbiFcclxuICAgICAgICogQW5kIHRoZSBtZW51IGl0c2VsZiBpcyBjaGVja2VkIGhlcmUsIGFuZCBpdCdzIHdoZXJlIHdlIGNoZWNrIGp1c3Qgb3V0c2lkZSBvZlxyXG4gICAgICAgKiB0aGUgbWVudSBhbmQgYnV0dG9uIHRoZSBjb25kaXRpb24gYWJib3ZlIG11c3QgY2xvc2UgdGhlIG1lbnVcclxuICAgICAgICovXHJcblxyXG4gICAgICBjb25zb2xlLmxvZyhcclxuICAgICAgICAnZS50YXJnZXQnLFxyXG4gICAgICAgIHRoaXMuc2VhcmNoQXJlYS5uYXRpdmVFbGVtZW50LFxyXG4gICAgICAgIGUudGFyZ2V0ICE9PSB0aGlzLnNlYXJjaEFyZWEubmF0aXZlRWxlbWVudFxyXG4gICAgICApO1xyXG4gICAgICBpZiAoXHJcbiAgICAgICAgZS50YXJnZXQgIT09IHRoaXMuc2VhcmNoQm94Lm5hdGl2ZUVsZW1lbnQgJiZcclxuICAgICAgICBlLnRhcmdldCAhPT0gdGhpcy5zZWFyY2hBcmVhLm5hdGl2ZUVsZW1lbnRcclxuICAgICAgKSB7XHJcbiAgICAgICAgdGhpcy5pc0RpdkNsaWNrZWQgPSBmYWxzZTtcclxuICAgICAgfVxyXG4gICAgfSk7XHJcbiAgfVxyXG5cclxuICBuZ09uSW5pdCgpOiB2b2lkIHt9XHJcblxyXG4gIG9uS2V5VXAoZXZlbnQ6IGFueSkge1xyXG4gICAgaWYgKGV2ZW50LmtleSA9PT0gJ0VudGVyJykge1xyXG4gICAgICB0aGlzLm9uU2VhcmNoKCdzZWFyY2gnLCB0aGlzLnNlYXJjaFZhbHVlKTtcclxuICAgIH1cclxuICB9XHJcblxyXG4gIG9uU2VhcmNoKHR5cGU6IHN0cmluZywgc2VhcmNoVmFsdWU6IHN0cmluZykge1xyXG4gICAgdGhpcy5vblNlYXJjaEFjdGlvbi5lbWl0KHsgdHlwZSwgc2VhcmNoVmFsdWUgfSk7XHJcbiAgfVxyXG5cclxuICBvbkNyb3NzQ2xpY2soKSB7XHJcbiAgICB0aGlzLnNlYXJjaFZhbHVlID0gJyc7XHJcbiAgICB0aGlzLm9uU2VhcmNoKCdzZWFyY2gnLCAnJyk7XHJcbiAgfVxyXG59XHJcbiJdfQ==
|