@inspark/inspark-components 14.0.39 → 14.0.41
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/full/esm2020/components/autocomplete/autocomplete.component.mjs +3 -3
- package/full/esm2020/components/button/button.component.mjs +3 -3
- package/full/esm2020/components/dropdown/dropdown.component.mjs +31 -31
- package/full/esm2020/components/input-group/input-group.component.mjs +3 -3
- package/full/esm2020/components/input-text/input-text.component.mjs +3 -3
- package/full/esm2020/components/inspark.module.mjs +1 -1
- package/full/esm2020/components/link/link.component.mjs +3 -3
- package/full/esm2020/components/modal-input-text/modal-input-text.component.mjs +3 -3
- package/full/esm2020/components/pie/pie.component.mjs +1 -1
- package/full/esm2020/components/primeng.module.mjs +1 -1
- package/full/esm2020/components/select-list/select-list.component.mjs +3 -3
- package/full/esm2020/components/svg/svg.component.mjs +1 -1
- package/full/esm2020/components/table/table.component.mjs +3 -3
- package/full/esm2020/components/toolbar/toolbar.component.mjs +2 -2
- package/full/esm2020/components/tree-table/tree-table.component.mjs +3 -3
- package/full/esm2020/interface.mjs +1 -1
- package/full/esm2020/public_api.mjs +1 -1
- package/full/esm2020/services/inspark-dialog.service.mjs +1 -1
- package/full/fesm2015/inspark-inspark-components.mjs +50 -50
- package/full/fesm2015/inspark-inspark-components.mjs.map +1 -1
- package/full/fesm2020/inspark-inspark-components.mjs +50 -50
- package/full/fesm2020/inspark-inspark-components.mjs.map +1 -1
- package/full/index.css +6 -6
- package/full/package.json +1 -1
- package/interface/esm2020/interface.mjs +1 -1
- package/interface/package.json +1 -1
- package/package.json +1 -1
|
@@ -625,10 +625,10 @@ class ButtonComponent extends Button {
|
|
|
625
625
|
}
|
|
626
626
|
}
|
|
627
627
|
ButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ButtonComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
628
|
-
ButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ButtonComponent, selector: "in-button", inputs: { size: "size", color: "color", type: "type", name: "name", testId: "testId", label: "label", icon: "icon", className: "className", notify: "notify", svg: "svg", width: "width", link: "link", isLoading: "isLoading", shadow: "shadow", isIconOnly: "isIconOnly", linkType: "linkType", linkTarget: "linkTarget", pressed: "pressed", disabled: "disabled", iconPos: "iconPos", selectedItem: "selectedItem", menuPlacement: "menuPlacement", menuItems: "menuItems" }, outputs: { focus: "focus", blur: "blur", click: "click" }, host: { properties: { "style.pointer-events": "this.pointerEvents" } }, viewQueries: [{ propertyName: "_menu", first: true, predicate: Menu, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<a (blur)=\"blur.emit($event)\"\r\n (click)=\"_onClick($event)\"\r\n (focus)=\"focus.emit($event)\"\r\n *ngIf=\"link && _linkType ==='external'\"\r\n [attr.type]=\"type\"\r\n [class]=\"className + ' ' + testId + ' field_' + name\"\r\n [href]=\"link\"\r\n [ngClass]=\"{'p-button p-widget p-state-default p-corner-all':true,\r\n 'p-button-icon-only': ((icon || svg) && !label),\r\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\r\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\r\n 'p-button-text-only': (!(icon || svg) && label),\r\n 'p-button-text-empty': (!(icon || svg) && !label),\r\n 'p-button-svg': svg,\r\n 'p-button-material': isMaterialIcon,\r\n 'p-state-disabled': disabled,\r\n 'p-button-tiny': size === 'tiny',\r\n 'p-button-small': size === 'small',\r\n 'p-button-large': size === 'large',\r\n 'p-button-primary': color === 'primary',\r\n 'p-button-secondary': color === 'secondary',\r\n 'p-button-danger': color === 'danger',\r\n 'p-button-transparency': color === 'transparent',\r\n 'p-button-pressed' : pressed}\"\r\n [ngStyle]=\"{width:width}\"\r\n [style]=\"style\"\r\n [target]=\"_target\" class=\"button-container\">\r\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\r\n</a>\r\n<a (blur)=\"blur.emit($event)\"\r\n (click)=\"_onClick($event)\"\r\n (focus)=\"focus.emit($event)\"\r\n *ngIf=\"link && _linkType ==='internal'\"\r\n [attr.type]=\"type\"\r\n [class]=\"className + ' ' + testId + ' field_' + name\"\r\n [ngClass]=\"{'p-button p-widget p-state-default p-corner-all':true,\r\n 'p-button-icon-only': ((icon || svg) && !label),\r\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\r\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\r\n 'p-button-text-only': (!(icon || svg) && label),\r\n 'p-button-text-empty': (!(icon || svg) && !label),\r\n 'p-button-svg': svg,\r\n 'p-button-material': isMaterialIcon,\r\n 'p-state-disabled': disabled,\r\n 'p-button-tiny': size === 'tiny',\r\n 'p-button-small': size === 'small',\r\n 'p-button-large': size === 'large',\r\n 'p-button-primary': color === 'primary',\r\n 'p-button-secondary': color === 'secondary',\r\n 'p-button-danger': color === 'danger',\r\n 'p-button-transparency': color === 'transparent',\r\n 'p-button-pressed' : pressed}\"\r\n [ngStyle]=\"{width:width}\"\r\n [routerLink]=\"link\"\r\n [style]=\"style\"\r\n [target]=\"_target\" class=\"button-container\">\r\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\r\n</a>\r\n<span #dropdown=\"ngbDropdown\" *ngIf=\"!link && menuItems.length\" [ngStyle]=\"{width:width}\" class=\"button-container\" container=\"body\"\r\n ngbDropdown>\r\n <button\r\n (blur)=\"blur.emit($event)\"\r\n (click)=\"_onClick($event)\"\r\n (focus)=\"focus.emit($event)\"\r\n [attr.type]=\"type\"\r\n [class]=\"className + ' ' + testId + ' field_' + name\"\r\n [disabled]=\"disabled\"\r\n [ngClass]=\" {'p-button p-widget p-state-default p-corner-all':true,\r\n 'p-button-icon-only': ((icon || svg) && !label),\r\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\r\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\r\n 'p-button-text-only': (!(icon || svg) && label),\r\n 'p-button-text-empty': (!(icon || svg) && !label),\r\n 'p-button-svg': svg,\r\n 'p-button-material': isMaterialIcon,\r\n 'p-state-disabled': disabled,\r\n 'p-button-tiny': size === 'tiny',\r\n 'p-button-small': size === 'small',\r\n 'p-button-large': size === 'large',\r\n 'p-button-primary': color === 'primary',\r\n 'p-button-secondary': color === 'secondary',\r\n 'p-button-danger': color === 'danger',\r\n 'p-button-transparency': color === 'transparent',\r\n 'p-button-shadowed': shadow === true,\r\n 'p-button-pressed' : pressed}\"\r\n [style]=\"style\" ngbDropdownToggle>\r\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\r\n </button>\r\n <div *ngIf=\"menuItems.length\" aria-labelledby=\"menu\"\r\n class=\"in-dropdown-menu\"\r\n ngbDropdownMenu>\r\n <div *ngFor=\"let item of menuItems\" class=\"in-dropdown-menu-item\" role=\"menuitem\">\r\n <in-button (click)=\"dropdown.close(); item.command();\"\r\n [color]=\"selectedItem && selectedItem == item.id?'primary':'transparent'\"\r\n [icon]=\"item.icon\"\r\n [label]=\"item.label\"\r\n [svg]=\"item.svg\"\r\n size=\"large\"\r\n width=\"100%\"></in-button>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"notify\" [ngClass]=\"notify\" class=\"notify\"></div>\r\n</span>\r\n<span *ngIf=\"!link && !menuItems.length\" [ngStyle]=\"{width:width}\" class=\"button-container\">\r\n <button\r\n (blur)=\"blur.emit($event)\"\r\n (click)=\"_onClick($event)\"\r\n (focus)=\"focus.emit($event)\"\r\n [attr.type]=\"type\"\r\n [class]=\"className + ' ' + testId + ' field_' + name\"\r\n [disabled]=\"disabled\"\r\n [ngClass]=\" {'p-button p-widget p-state-default p-corner-all':true,\r\n 'p-button-icon-only': ((icon || svg) && !label) || isIconOnly,\r\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\r\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\r\n 'p-button-text-only': (!(icon || svg) && label),\r\n 'p-button-text-empty': (!(icon || svg) && !label),\r\n 'p-button-svg': svg,\r\n 'p-button-material': isMaterialIcon,\r\n 'p-state-disabled': disabled,\r\n 'p-button-tiny': size === 'tiny',\r\n 'p-button-small': size === 'small',\r\n 'p-button-large': size === 'large',\r\n 'p-button-primary': color === 'primary',\r\n 'p-button-secondary': color === 'secondary',\r\n 'p-button-danger': color === 'danger',\r\n 'p-button-transparency': color === 'transparent',\r\n 'p-button-shadowed': shadow === true,\r\n 'p-button-pressed' : pressed}\" [style]=\"style\">\r\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\r\n </button>\r\n <div *ngIf=\"notify\" [ngClass]=\"notify\" class=\"notify\"></div>\r\n</span>\r\n\r\n<ng-template #content>\r\n <span *ngIf=\"!isMaterialIcon && icon && !isLoading\" [class]=\"icon\"\r\n [ngClass]=\"{'p-clickable': true,\r\n 'p-button-icon-left': (iconPos === 'left'),\r\n 'p-button-icon-right': (iconPos === 'right')}\"></span>\r\n <span *ngIf=\"isMaterialIcon && icon && !isLoading\" [ngClass]=\"{'p-clickable': true,\r\n 'p-button-icon-left': (iconPos === 'left'),\r\n 'p-button-icon-right': (iconPos === 'right')}\"\r\n ><i class=\"material-icons\">{{icon}}</i></span>\r\n <in-preloader *ngIf=\"isLoading\" size=\"small\"></in-preloader>\r\n <span class=\"p-button-text p-clickable\">{{label}}</span>\r\n <span *ngIf=\"svg && !isLoading\" [ngClass]=\"{'p-clickable': true,\r\n 'p-button-icon-left': (iconPos === 'left'),\r\n 'p-button-icon-right': (iconPos === 'right')}\">\r\n <in-svg *ngIf=\"size === 'normal'\" [src]=\"svg\" height=\"20px\" width=\"20px\"></in-svg>\r\n <in-svg *ngIf=\"size === 'large'\" [src]=\"svg\" height=\"20px\" width=\"20px\"></in-svg>\r\n <in-svg *ngIf=\"size === 'small'\" [src]=\"svg\" height=\"20px\" width=\"20px\"></in-svg>\r\n <in-svg *ngIf=\"size === 'tiny'\" [src]=\"svg\" height=\"10px\" width=\"10px\"></in-svg>\r\n </span>\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";.container{display:inline-block}.button-container{position:relative;display:inline-block}button{outline:none;width:100%}.p-button-icon-only .p-button-icon-left{margin-top:-9px}.p-button-text{vertical-align:middle}.notify{width:8px;height:8px;border-radius:100%;position:absolute;right:8px;top:8px}.notify.warning{background:var(--colorWarning)}.notify.success{background:var(--colorSuccess)}.notify.error{background:var(--colorError)}.notify.critical{background:var(--colorCritical)}.p-button{margin-right:0;height:36px;display:inline-flex;align-items:center;justify-content:center}.p-button.p-button-pressed{background-color:var(--colorBgLevel4)}.p-button.p-button-large{height:48px}.p-button.p-button-large .p-button-icon-left{font-size:18px;margin-top:-8px}.p-button.p-button-large .p-button-text{padding:0 1em 0 48px;margin-top:6px}.p-button-text-icon-left .p-button-text{padding:0 1em 0 2.4em}.p-button-icon-only{font-size:18px;display:inline-flex;align-items:center;justify-content:center}.p-button-icon-only.p-button-large{width:48px;height:48px}.p-button-icon-only.p-button-large .svg,.p-button-icon-only .svg{display:inline-block;line-height:0}.p-button-transparency{background:none;color:currentColor}.p-button-transparency:hover{color:currentColor}.p-button-shadowed{box-shadow:0 2px 6px #0003}.p-button.p-button-svg.p-button-small .p-button-icon-left{margin-top:-4px}.p-button.p-button-svg.p-button-small.p-button-icon-only .p-button-icon-left{margin-top:-2px}.p-button.p-button-svg .p-button-icon-left{left:6px;transform:translateY(-50%);margin-top:-4px}.p-button.p-button-svg.p-button-icon-only .p-button-icon-left{left:50%;width:auto;transform:translate(-50%,-50%);margin-left:0;margin-top:0}.p-button.p-button-svg.p-button-large.p-button-icon-only .p-button-icon-left{margin-top:0}.p-button-material.p-button-icon-only .material-icons{font-size:20px}.p-button-material.p-button-icon-only .p-button-icon-left{margin-top:-10px;margin-left:-12px}.p-button-material .material-icons{font-size:16px}.p-button-material .p-button-icon-left{margin-top:-8px;margin-left:-2px}.p-button-material.p-button-small .p-button-icon-left{margin-top:-7px}.p-button-material.p-button-small .material-icons{font-size:14px}.p-button-material.p-button-small.p-button-icon-only .p-button-icon-left{margin-top:-12px;margin-left:-10px}.p-button-material.p-button-small.p-button-icon-only .p-button-icon-left .material-icons{font-size:18px}.p-button-material.p-button-large .material-icons{font-size:24px}.p-button-material.p-button-large .p-button-icon-left{margin-top:-11px}.p-button-material.p-button-large.p-button-icon-only .p-button-icon-left{margin-top:-11px;margin-left:-13px}:host .p-menu .p-menuitem-link{font-size:16px}.dropdown-menu{display:none;background:var(--colorBgLevel3);padding:4px}.dropdown-menu li{padding:4px;font-size:14px}.dropdown-menu.show{display:block}.in-dropdown-menu{background:var(--colorBgLevel2);padding:0;position:absolute;display:none;margin-left:0;box-shadow:0 0 3px 1px #0003}.in-dropdown-menu.show{display:block}.in-dropdown-menu .in-dropdown-menu-item{list-style-type:none;min-width:250px;display:flex;align-items:center;justify-content:flex-start;min-height:48px}.in-dropdown-menu .in-dropdown-menu-item in-button,.in-dropdown-menu .in-dropdown-menu-item in-button ::ng-deep button{width:100%;border-radius:0}.in-dropdown-menu .in-dropdown-menu-item in-button .p-button,.in-dropdown-menu .in-dropdown-menu-item in-button ::ng-deep button .p-button{justify-content:flex-start}.in-dropdown-menu .in-dropdown-menu-item .switcher{flex:1;display:flex;justify-content:flex-end;padding-right:4px}.in-dropdown-menu .in-dropdown-menu-item+.in-dropdown-menu-item{border-top:1px solid var(--colorBgLevel4)}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$3.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i7.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "popperOptions", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { kind: "directive", type: i7.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { kind: "directive", type: i7.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { kind: "component", type: ButtonComponent, selector: "in-button", inputs: ["size", "color", "type", "name", "testId", "label", "icon", "className", "notify", "svg", "width", "link", "isLoading", "shadow", "isIconOnly", "linkType", "linkTarget", "pressed", "disabled", "iconPos", "selectedItem", "menuPlacement", "menuItems"], outputs: ["focus", "blur", "click"] }, { kind: "component", type: PreloaderComponent, selector: "in-preloader", inputs: ["inline", "overlay", "size"] }, { kind: "component", type: SvgComponent, selector: "in-svg", inputs: ["size", "width", "height", "src"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
628
|
+
ButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ButtonComponent, selector: "in-button", inputs: { size: "size", color: "color", type: "type", name: "name", testId: "testId", label: "label", icon: "icon", className: "className", notify: "notify", svg: "svg", width: "width", link: "link", isLoading: "isLoading", shadow: "shadow", isIconOnly: "isIconOnly", linkType: "linkType", linkTarget: "linkTarget", pressed: "pressed", disabled: "disabled", iconPos: "iconPos", selectedItem: "selectedItem", menuPlacement: "menuPlacement", menuItems: "menuItems" }, outputs: { focus: "focus", blur: "blur", click: "click" }, host: { properties: { "style.pointer-events": "this.pointerEvents" } }, viewQueries: [{ propertyName: "_menu", first: true, predicate: Menu, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<a (blur)=\"blur.emit($event)\"\n (click)=\"_onClick($event)\"\n (focus)=\"focus.emit($event)\"\n *ngIf=\"link && _linkType ==='external'\"\n [attr.type]=\"type\"\n [class]=\"className + ' ' + testId + ' field_' + name\"\n [href]=\"link\"\n [ngClass]=\"{'p-button p-widget p-state-default p-corner-all':true,\n 'p-button-icon-only': ((icon || svg) && !label),\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'p-button-text-only': (!(icon || svg) && label),\n 'p-button-text-empty': (!(icon || svg) && !label),\n 'p-button-svg': svg,\n 'p-button-material': isMaterialIcon,\n 'p-state-disabled': disabled,\n 'p-button-tiny': size === 'tiny',\n 'p-button-small': size === 'small',\n 'p-button-large': size === 'large',\n 'p-button-primary': color === 'primary',\n 'p-button-secondary': color === 'secondary',\n 'p-button-danger': color === 'danger',\n 'p-button-transparency': color === 'transparent',\n 'p-button-pressed' : pressed}\"\n [ngStyle]=\"{width:width}\"\n [style]=\"style\"\n [target]=\"_target\" class=\"button-container\">\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\n</a>\n<a (blur)=\"blur.emit($event)\"\n (click)=\"_onClick($event)\"\n (focus)=\"focus.emit($event)\"\n *ngIf=\"link && _linkType ==='internal'\"\n [attr.type]=\"type\"\n [class]=\"className + ' ' + testId + ' field_' + name\"\n [ngClass]=\"{'p-button p-widget p-state-default p-corner-all':true,\n 'p-button-icon-only': ((icon || svg) && !label),\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'p-button-text-only': (!(icon || svg) && label),\n 'p-button-text-empty': (!(icon || svg) && !label),\n 'p-button-svg': svg,\n 'p-button-material': isMaterialIcon,\n 'p-state-disabled': disabled,\n 'p-button-tiny': size === 'tiny',\n 'p-button-small': size === 'small',\n 'p-button-large': size === 'large',\n 'p-button-primary': color === 'primary',\n 'p-button-secondary': color === 'secondary',\n 'p-button-danger': color === 'danger',\n 'p-button-transparency': color === 'transparent',\n 'p-button-pressed' : pressed}\"\n [ngStyle]=\"{width:width}\"\n [routerLink]=\"link\"\n [style]=\"style\"\n [target]=\"_target\" class=\"button-container\">\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\n</a>\n<span #dropdown=\"ngbDropdown\" *ngIf=\"!link && menuItems.length\" [ngStyle]=\"{width:width}\" class=\"button-container\" container=\"body\"\n ngbDropdown>\n <button\n (blur)=\"blur.emit($event)\"\n (click)=\"_onClick($event)\"\n (focus)=\"focus.emit($event)\"\n [attr.type]=\"type\"\n [class]=\"className + ' ' + testId + ' field_' + name\"\n [disabled]=\"disabled\"\n [ngClass]=\" {'p-button p-widget p-state-default p-corner-all':true,\n 'p-button-icon-only': ((icon || svg) && !label),\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'p-button-text-only': (!(icon || svg) && label),\n 'p-button-text-empty': (!(icon || svg) && !label),\n 'p-button-svg': svg,\n 'p-button-material': isMaterialIcon,\n 'p-state-disabled': disabled,\n 'p-button-tiny': size === 'tiny',\n 'p-button-small': size === 'small',\n 'p-button-large': size === 'large',\n 'p-button-primary': color === 'primary',\n 'p-button-secondary': color === 'secondary',\n 'p-button-danger': color === 'danger',\n 'p-button-transparency': color === 'transparent',\n 'p-button-shadowed': shadow === true,\n 'p-button-pressed' : pressed}\"\n [style]=\"style\" ngbDropdownToggle>\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\n </button>\n <div *ngIf=\"menuItems.length\" aria-labelledby=\"menu\"\n class=\"in-dropdown-menu\"\n ngbDropdownMenu>\n <div *ngFor=\"let item of menuItems\" class=\"in-dropdown-menu-item\" role=\"menuitem\">\n <in-button (click)=\"dropdown.close(); item.command();\"\n [color]=\"selectedItem && selectedItem == item.id?'primary':'transparent'\"\n [icon]=\"item.icon\"\n [label]=\"item.label\"\n [svg]=\"item.svg\"\n size=\"large\"\n width=\"100%\"></in-button>\n </div>\n </div>\n\n <div *ngIf=\"notify\" [ngClass]=\"notify\" class=\"notify\"></div>\n</span>\n<span *ngIf=\"!link && !menuItems.length\" [ngStyle]=\"{width:width}\" class=\"button-container\">\n <button\n (blur)=\"blur.emit($event)\"\n (click)=\"_onClick($event)\"\n (focus)=\"focus.emit($event)\"\n [attr.type]=\"type\"\n [class]=\"className + ' ' + testId + ' field_' + name\"\n [disabled]=\"disabled\"\n [ngClass]=\" {'p-button p-widget p-state-default p-corner-all':true,\n 'p-button-icon-only': ((icon || svg) && !label) || isIconOnly,\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'p-button-text-only': (!(icon || svg) && label),\n 'p-button-text-empty': (!(icon || svg) && !label),\n 'p-button-svg': svg,\n 'p-button-material': isMaterialIcon,\n 'p-state-disabled': disabled,\n 'p-button-tiny': size === 'tiny',\n 'p-button-small': size === 'small',\n 'p-button-large': size === 'large',\n 'p-button-primary': color === 'primary',\n 'p-button-secondary': color === 'secondary',\n 'p-button-danger': color === 'danger',\n 'p-button-transparency': color === 'transparent',\n 'p-button-shadowed': shadow === true,\n 'p-button-pressed' : pressed}\" [style]=\"style\">\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\n </button>\n <div *ngIf=\"notify\" [ngClass]=\"notify\" class=\"notify\"></div>\n</span>\n\n<ng-template #content>\n <span *ngIf=\"!isMaterialIcon && icon && !isLoading\" [class]=\"icon\"\n [ngClass]=\"{'p-clickable': true,\n 'p-button-icon-left': (iconPos === 'left'),\n 'p-button-icon-right': (iconPos === 'right')}\"></span>\n <span *ngIf=\"isMaterialIcon && icon && !isLoading\" [ngClass]=\"{'p-clickable': true,\n 'p-button-icon-left': (iconPos === 'left'),\n 'p-button-icon-right': (iconPos === 'right')}\"\n ><i class=\"material-icons\">{{icon}}</i></span>\n <in-preloader *ngIf=\"isLoading\" size=\"small\"></in-preloader>\n <span class=\"p-button-text p-clickable\">{{label}}</span>\n <span *ngIf=\"svg && !isLoading\" [ngClass]=\"{'p-clickable': true,\n 'p-button-icon-left': (iconPos === 'left'),\n 'p-button-icon-right': (iconPos === 'right')}\">\n <in-svg *ngIf=\"size === 'normal'\" [src]=\"svg\" height=\"20px\" width=\"20px\"></in-svg>\n <in-svg *ngIf=\"size === 'large'\" [src]=\"svg\" height=\"20px\" width=\"20px\"></in-svg>\n <in-svg *ngIf=\"size === 'small'\" [src]=\"svg\" height=\"20px\" width=\"20px\"></in-svg>\n <in-svg *ngIf=\"size === 'tiny'\" [src]=\"svg\" height=\"10px\" width=\"10px\"></in-svg>\n </span>\n</ng-template>\n", styles: ["@charset \"UTF-8\";.container{display:inline-block}.button-container{position:relative;display:inline-block}button{outline:none;width:100%}.p-button-icon-only .p-button-icon-left{margin-top:-9px}.p-button-text{vertical-align:middle}.notify{width:8px;height:8px;border-radius:100%;position:absolute;right:8px;top:8px}.notify.warning{background:var(--colorWarning)}.notify.success{background:var(--colorSuccess)}.notify.error{background:var(--colorError)}.notify.critical{background:var(--colorCritical)}.p-button{margin-right:0;height:36px;display:inline-flex;align-items:center;justify-content:center}.p-button.p-button-pressed{background-color:var(--colorBgLevel4)}.p-button.p-button-large{height:48px}.p-button.p-button-large .p-button-icon-left{font-size:18px;margin-top:-8px}.p-button.p-button-large .p-button-text{padding:0 1em 0 48px;margin-top:6px}.p-button-text-icon-left .p-button-text{padding:0 1em 0 2.4em}.p-button-icon-only{font-size:18px;display:inline-flex;align-items:center;justify-content:center}.p-button-icon-only.p-button-large{width:48px;height:48px}.p-button-icon-only.p-button-large .svg,.p-button-icon-only .svg{display:inline-block;line-height:0}.p-button-transparency{background:none;color:currentColor}.p-button-transparency:hover{color:currentColor}.p-button-shadowed{box-shadow:0 2px 6px #0003}.p-button.p-button-svg.p-button-small .p-button-icon-left{margin-top:-4px}.p-button.p-button-svg.p-button-small.p-button-icon-only .p-button-icon-left{margin-top:-2px}.p-button.p-button-svg .p-button-icon-left{left:6px;transform:translateY(-50%);margin-top:-4px}.p-button.p-button-svg.p-button-icon-only .p-button-icon-left{left:50%;width:auto;transform:translate(-50%,-50%);margin-left:0;margin-top:0}.p-button.p-button-svg.p-button-large.p-button-icon-only .p-button-icon-left{margin-top:0}.p-button-material.p-button-icon-only .material-icons{font-size:20px}.p-button-material.p-button-icon-only .p-button-icon-left{margin-top:-10px;margin-left:-12px}.p-button-material .material-icons{font-size:16px}.p-button-material .p-button-icon-left{margin-top:-8px;margin-left:-2px}.p-button-material.p-button-small .p-button-icon-left{margin-top:-7px}.p-button-material.p-button-small .material-icons{font-size:14px}.p-button-material.p-button-small.p-button-icon-only .p-button-icon-left{margin-top:-12px;margin-left:-10px}.p-button-material.p-button-small.p-button-icon-only .p-button-icon-left .material-icons{font-size:18px}.p-button-material.p-button-large .material-icons{font-size:24px}.p-button-material.p-button-large .p-button-icon-left{margin-top:-11px}.p-button-material.p-button-large.p-button-icon-only .p-button-icon-left{margin-top:-11px;margin-left:-13px}:host .p-menu .p-menuitem-link{font-size:16px}.dropdown-menu{display:none;background:var(--colorBgLevel3);padding:4px}.dropdown-menu li{padding:4px;font-size:14px}.dropdown-menu.show{display:block}.in-dropdown-menu{background:var(--colorBgLevel2);padding:0;position:absolute;display:none;margin-left:0;box-shadow:0 0 3px 1px #0003}.in-dropdown-menu.show{display:block}.in-dropdown-menu .in-dropdown-menu-item{list-style-type:none;min-width:250px;display:flex;align-items:center;justify-content:flex-start;min-height:48px}.in-dropdown-menu .in-dropdown-menu-item in-button,.in-dropdown-menu .in-dropdown-menu-item in-button ::ng-deep button{width:100%;border-radius:0}.in-dropdown-menu .in-dropdown-menu-item in-button .p-button,.in-dropdown-menu .in-dropdown-menu-item in-button ::ng-deep button .p-button{justify-content:flex-start}.in-dropdown-menu .in-dropdown-menu-item .switcher{flex:1;display:flex;justify-content:flex-end;padding-right:4px}.in-dropdown-menu .in-dropdown-menu-item+.in-dropdown-menu-item{border-top:1px solid var(--colorBgLevel4)}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$3.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i7.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "popperOptions", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { kind: "directive", type: i7.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { kind: "directive", type: i7.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { kind: "component", type: ButtonComponent, selector: "in-button", inputs: ["size", "color", "type", "name", "testId", "label", "icon", "className", "notify", "svg", "width", "link", "isLoading", "shadow", "isIconOnly", "linkType", "linkTarget", "pressed", "disabled", "iconPos", "selectedItem", "menuPlacement", "menuItems"], outputs: ["focus", "blur", "click"] }, { kind: "component", type: PreloaderComponent, selector: "in-preloader", inputs: ["inline", "overlay", "size"] }, { kind: "component", type: SvgComponent, selector: "in-svg", inputs: ["size", "width", "height", "src"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
629
629
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
630
630
|
type: Component,
|
|
631
|
-
args: [{ selector: 'in-button', encapsulation: ViewEncapsulation.Emulated, changeDetection: ChangeDetectionStrategy.OnPush, template: "<a (blur)=\"blur.emit($event)\"\r\n (click)=\"_onClick($event)\"\r\n (focus)=\"focus.emit($event)\"\r\n *ngIf=\"link && _linkType ==='external'\"\r\n [attr.type]=\"type\"\r\n [class]=\"className + ' ' + testId + ' field_' + name\"\r\n [href]=\"link\"\r\n [ngClass]=\"{'p-button p-widget p-state-default p-corner-all':true,\r\n 'p-button-icon-only': ((icon || svg) && !label),\r\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\r\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\r\n 'p-button-text-only': (!(icon || svg) && label),\r\n 'p-button-text-empty': (!(icon || svg) && !label),\r\n 'p-button-svg': svg,\r\n 'p-button-material': isMaterialIcon,\r\n 'p-state-disabled': disabled,\r\n 'p-button-tiny': size === 'tiny',\r\n 'p-button-small': size === 'small',\r\n 'p-button-large': size === 'large',\r\n 'p-button-primary': color === 'primary',\r\n 'p-button-secondary': color === 'secondary',\r\n 'p-button-danger': color === 'danger',\r\n 'p-button-transparency': color === 'transparent',\r\n 'p-button-pressed' : pressed}\"\r\n [ngStyle]=\"{width:width}\"\r\n [style]=\"style\"\r\n [target]=\"_target\" class=\"button-container\">\r\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\r\n</a>\r\n<a (blur)=\"blur.emit($event)\"\r\n (click)=\"_onClick($event)\"\r\n (focus)=\"focus.emit($event)\"\r\n *ngIf=\"link && _linkType ==='internal'\"\r\n [attr.type]=\"type\"\r\n [class]=\"className + ' ' + testId + ' field_' + name\"\r\n [ngClass]=\"{'p-button p-widget p-state-default p-corner-all':true,\r\n 'p-button-icon-only': ((icon || svg) && !label),\r\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\r\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\r\n 'p-button-text-only': (!(icon || svg) && label),\r\n 'p-button-text-empty': (!(icon || svg) && !label),\r\n 'p-button-svg': svg,\r\n 'p-button-material': isMaterialIcon,\r\n 'p-state-disabled': disabled,\r\n 'p-button-tiny': size === 'tiny',\r\n 'p-button-small': size === 'small',\r\n 'p-button-large': size === 'large',\r\n 'p-button-primary': color === 'primary',\r\n 'p-button-secondary': color === 'secondary',\r\n 'p-button-danger': color === 'danger',\r\n 'p-button-transparency': color === 'transparent',\r\n 'p-button-pressed' : pressed}\"\r\n [ngStyle]=\"{width:width}\"\r\n [routerLink]=\"link\"\r\n [style]=\"style\"\r\n [target]=\"_target\" class=\"button-container\">\r\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\r\n</a>\r\n<span #dropdown=\"ngbDropdown\" *ngIf=\"!link && menuItems.length\" [ngStyle]=\"{width:width}\" class=\"button-container\" container=\"body\"\r\n ngbDropdown>\r\n <button\r\n (blur)=\"blur.emit($event)\"\r\n (click)=\"_onClick($event)\"\r\n (focus)=\"focus.emit($event)\"\r\n [attr.type]=\"type\"\r\n [class]=\"className + ' ' + testId + ' field_' + name\"\r\n [disabled]=\"disabled\"\r\n [ngClass]=\" {'p-button p-widget p-state-default p-corner-all':true,\r\n 'p-button-icon-only': ((icon || svg) && !label),\r\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\r\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\r\n 'p-button-text-only': (!(icon || svg) && label),\r\n 'p-button-text-empty': (!(icon || svg) && !label),\r\n 'p-button-svg': svg,\r\n 'p-button-material': isMaterialIcon,\r\n 'p-state-disabled': disabled,\r\n 'p-button-tiny': size === 'tiny',\r\n 'p-button-small': size === 'small',\r\n 'p-button-large': size === 'large',\r\n 'p-button-primary': color === 'primary',\r\n 'p-button-secondary': color === 'secondary',\r\n 'p-button-danger': color === 'danger',\r\n 'p-button-transparency': color === 'transparent',\r\n 'p-button-shadowed': shadow === true,\r\n 'p-button-pressed' : pressed}\"\r\n [style]=\"style\" ngbDropdownToggle>\r\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\r\n </button>\r\n <div *ngIf=\"menuItems.length\" aria-labelledby=\"menu\"\r\n class=\"in-dropdown-menu\"\r\n ngbDropdownMenu>\r\n <div *ngFor=\"let item of menuItems\" class=\"in-dropdown-menu-item\" role=\"menuitem\">\r\n <in-button (click)=\"dropdown.close(); item.command();\"\r\n [color]=\"selectedItem && selectedItem == item.id?'primary':'transparent'\"\r\n [icon]=\"item.icon\"\r\n [label]=\"item.label\"\r\n [svg]=\"item.svg\"\r\n size=\"large\"\r\n width=\"100%\"></in-button>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"notify\" [ngClass]=\"notify\" class=\"notify\"></div>\r\n</span>\r\n<span *ngIf=\"!link && !menuItems.length\" [ngStyle]=\"{width:width}\" class=\"button-container\">\r\n <button\r\n (blur)=\"blur.emit($event)\"\r\n (click)=\"_onClick($event)\"\r\n (focus)=\"focus.emit($event)\"\r\n [attr.type]=\"type\"\r\n [class]=\"className + ' ' + testId + ' field_' + name\"\r\n [disabled]=\"disabled\"\r\n [ngClass]=\" {'p-button p-widget p-state-default p-corner-all':true,\r\n 'p-button-icon-only': ((icon || svg) && !label) || isIconOnly,\r\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\r\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\r\n 'p-button-text-only': (!(icon || svg) && label),\r\n 'p-button-text-empty': (!(icon || svg) && !label),\r\n 'p-button-svg': svg,\r\n 'p-button-material': isMaterialIcon,\r\n 'p-state-disabled': disabled,\r\n 'p-button-tiny': size === 'tiny',\r\n 'p-button-small': size === 'small',\r\n 'p-button-large': size === 'large',\r\n 'p-button-primary': color === 'primary',\r\n 'p-button-secondary': color === 'secondary',\r\n 'p-button-danger': color === 'danger',\r\n 'p-button-transparency': color === 'transparent',\r\n 'p-button-shadowed': shadow === true,\r\n 'p-button-pressed' : pressed}\" [style]=\"style\">\r\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\r\n </button>\r\n <div *ngIf=\"notify\" [ngClass]=\"notify\" class=\"notify\"></div>\r\n</span>\r\n\r\n<ng-template #content>\r\n <span *ngIf=\"!isMaterialIcon && icon && !isLoading\" [class]=\"icon\"\r\n [ngClass]=\"{'p-clickable': true,\r\n 'p-button-icon-left': (iconPos === 'left'),\r\n 'p-button-icon-right': (iconPos === 'right')}\"></span>\r\n <span *ngIf=\"isMaterialIcon && icon && !isLoading\" [ngClass]=\"{'p-clickable': true,\r\n 'p-button-icon-left': (iconPos === 'left'),\r\n 'p-button-icon-right': (iconPos === 'right')}\"\r\n ><i class=\"material-icons\">{{icon}}</i></span>\r\n <in-preloader *ngIf=\"isLoading\" size=\"small\"></in-preloader>\r\n <span class=\"p-button-text p-clickable\">{{label}}</span>\r\n <span *ngIf=\"svg && !isLoading\" [ngClass]=\"{'p-clickable': true,\r\n 'p-button-icon-left': (iconPos === 'left'),\r\n 'p-button-icon-right': (iconPos === 'right')}\">\r\n <in-svg *ngIf=\"size === 'normal'\" [src]=\"svg\" height=\"20px\" width=\"20px\"></in-svg>\r\n <in-svg *ngIf=\"size === 'large'\" [src]=\"svg\" height=\"20px\" width=\"20px\"></in-svg>\r\n <in-svg *ngIf=\"size === 'small'\" [src]=\"svg\" height=\"20px\" width=\"20px\"></in-svg>\r\n <in-svg *ngIf=\"size === 'tiny'\" [src]=\"svg\" height=\"10px\" width=\"10px\"></in-svg>\r\n </span>\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";.container{display:inline-block}.button-container{position:relative;display:inline-block}button{outline:none;width:100%}.p-button-icon-only .p-button-icon-left{margin-top:-9px}.p-button-text{vertical-align:middle}.notify{width:8px;height:8px;border-radius:100%;position:absolute;right:8px;top:8px}.notify.warning{background:var(--colorWarning)}.notify.success{background:var(--colorSuccess)}.notify.error{background:var(--colorError)}.notify.critical{background:var(--colorCritical)}.p-button{margin-right:0;height:36px;display:inline-flex;align-items:center;justify-content:center}.p-button.p-button-pressed{background-color:var(--colorBgLevel4)}.p-button.p-button-large{height:48px}.p-button.p-button-large .p-button-icon-left{font-size:18px;margin-top:-8px}.p-button.p-button-large .p-button-text{padding:0 1em 0 48px;margin-top:6px}.p-button-text-icon-left .p-button-text{padding:0 1em 0 2.4em}.p-button-icon-only{font-size:18px;display:inline-flex;align-items:center;justify-content:center}.p-button-icon-only.p-button-large{width:48px;height:48px}.p-button-icon-only.p-button-large .svg,.p-button-icon-only .svg{display:inline-block;line-height:0}.p-button-transparency{background:none;color:currentColor}.p-button-transparency:hover{color:currentColor}.p-button-shadowed{box-shadow:0 2px 6px #0003}.p-button.p-button-svg.p-button-small .p-button-icon-left{margin-top:-4px}.p-button.p-button-svg.p-button-small.p-button-icon-only .p-button-icon-left{margin-top:-2px}.p-button.p-button-svg .p-button-icon-left{left:6px;transform:translateY(-50%);margin-top:-4px}.p-button.p-button-svg.p-button-icon-only .p-button-icon-left{left:50%;width:auto;transform:translate(-50%,-50%);margin-left:0;margin-top:0}.p-button.p-button-svg.p-button-large.p-button-icon-only .p-button-icon-left{margin-top:0}.p-button-material.p-button-icon-only .material-icons{font-size:20px}.p-button-material.p-button-icon-only .p-button-icon-left{margin-top:-10px;margin-left:-12px}.p-button-material .material-icons{font-size:16px}.p-button-material .p-button-icon-left{margin-top:-8px;margin-left:-2px}.p-button-material.p-button-small .p-button-icon-left{margin-top:-7px}.p-button-material.p-button-small .material-icons{font-size:14px}.p-button-material.p-button-small.p-button-icon-only .p-button-icon-left{margin-top:-12px;margin-left:-10px}.p-button-material.p-button-small.p-button-icon-only .p-button-icon-left .material-icons{font-size:18px}.p-button-material.p-button-large .material-icons{font-size:24px}.p-button-material.p-button-large .p-button-icon-left{margin-top:-11px}.p-button-material.p-button-large.p-button-icon-only .p-button-icon-left{margin-top:-11px;margin-left:-13px}:host .p-menu .p-menuitem-link{font-size:16px}.dropdown-menu{display:none;background:var(--colorBgLevel3);padding:4px}.dropdown-menu li{padding:4px;font-size:14px}.dropdown-menu.show{display:block}.in-dropdown-menu{background:var(--colorBgLevel2);padding:0;position:absolute;display:none;margin-left:0;box-shadow:0 0 3px 1px #0003}.in-dropdown-menu.show{display:block}.in-dropdown-menu .in-dropdown-menu-item{list-style-type:none;min-width:250px;display:flex;align-items:center;justify-content:flex-start;min-height:48px}.in-dropdown-menu .in-dropdown-menu-item in-button,.in-dropdown-menu .in-dropdown-menu-item in-button ::ng-deep button{width:100%;border-radius:0}.in-dropdown-menu .in-dropdown-menu-item in-button .p-button,.in-dropdown-menu .in-dropdown-menu-item in-button ::ng-deep button .p-button{justify-content:flex-start}.in-dropdown-menu .in-dropdown-menu-item .switcher{flex:1;display:flex;justify-content:flex-end;padding-right:4px}.in-dropdown-menu .in-dropdown-menu-item+.in-dropdown-menu-item{border-top:1px solid var(--colorBgLevel4)}\n"] }]
|
|
631
|
+
args: [{ selector: 'in-button', encapsulation: ViewEncapsulation.Emulated, changeDetection: ChangeDetectionStrategy.OnPush, template: "<a (blur)=\"blur.emit($event)\"\n (click)=\"_onClick($event)\"\n (focus)=\"focus.emit($event)\"\n *ngIf=\"link && _linkType ==='external'\"\n [attr.type]=\"type\"\n [class]=\"className + ' ' + testId + ' field_' + name\"\n [href]=\"link\"\n [ngClass]=\"{'p-button p-widget p-state-default p-corner-all':true,\n 'p-button-icon-only': ((icon || svg) && !label),\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'p-button-text-only': (!(icon || svg) && label),\n 'p-button-text-empty': (!(icon || svg) && !label),\n 'p-button-svg': svg,\n 'p-button-material': isMaterialIcon,\n 'p-state-disabled': disabled,\n 'p-button-tiny': size === 'tiny',\n 'p-button-small': size === 'small',\n 'p-button-large': size === 'large',\n 'p-button-primary': color === 'primary',\n 'p-button-secondary': color === 'secondary',\n 'p-button-danger': color === 'danger',\n 'p-button-transparency': color === 'transparent',\n 'p-button-pressed' : pressed}\"\n [ngStyle]=\"{width:width}\"\n [style]=\"style\"\n [target]=\"_target\" class=\"button-container\">\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\n</a>\n<a (blur)=\"blur.emit($event)\"\n (click)=\"_onClick($event)\"\n (focus)=\"focus.emit($event)\"\n *ngIf=\"link && _linkType ==='internal'\"\n [attr.type]=\"type\"\n [class]=\"className + ' ' + testId + ' field_' + name\"\n [ngClass]=\"{'p-button p-widget p-state-default p-corner-all':true,\n 'p-button-icon-only': ((icon || svg) && !label),\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'p-button-text-only': (!(icon || svg) && label),\n 'p-button-text-empty': (!(icon || svg) && !label),\n 'p-button-svg': svg,\n 'p-button-material': isMaterialIcon,\n 'p-state-disabled': disabled,\n 'p-button-tiny': size === 'tiny',\n 'p-button-small': size === 'small',\n 'p-button-large': size === 'large',\n 'p-button-primary': color === 'primary',\n 'p-button-secondary': color === 'secondary',\n 'p-button-danger': color === 'danger',\n 'p-button-transparency': color === 'transparent',\n 'p-button-pressed' : pressed}\"\n [ngStyle]=\"{width:width}\"\n [routerLink]=\"link\"\n [style]=\"style\"\n [target]=\"_target\" class=\"button-container\">\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\n</a>\n<span #dropdown=\"ngbDropdown\" *ngIf=\"!link && menuItems.length\" [ngStyle]=\"{width:width}\" class=\"button-container\" container=\"body\"\n ngbDropdown>\n <button\n (blur)=\"blur.emit($event)\"\n (click)=\"_onClick($event)\"\n (focus)=\"focus.emit($event)\"\n [attr.type]=\"type\"\n [class]=\"className + ' ' + testId + ' field_' + name\"\n [disabled]=\"disabled\"\n [ngClass]=\" {'p-button p-widget p-state-default p-corner-all':true,\n 'p-button-icon-only': ((icon || svg) && !label),\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'p-button-text-only': (!(icon || svg) && label),\n 'p-button-text-empty': (!(icon || svg) && !label),\n 'p-button-svg': svg,\n 'p-button-material': isMaterialIcon,\n 'p-state-disabled': disabled,\n 'p-button-tiny': size === 'tiny',\n 'p-button-small': size === 'small',\n 'p-button-large': size === 'large',\n 'p-button-primary': color === 'primary',\n 'p-button-secondary': color === 'secondary',\n 'p-button-danger': color === 'danger',\n 'p-button-transparency': color === 'transparent',\n 'p-button-shadowed': shadow === true,\n 'p-button-pressed' : pressed}\"\n [style]=\"style\" ngbDropdownToggle>\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\n </button>\n <div *ngIf=\"menuItems.length\" aria-labelledby=\"menu\"\n class=\"in-dropdown-menu\"\n ngbDropdownMenu>\n <div *ngFor=\"let item of menuItems\" class=\"in-dropdown-menu-item\" role=\"menuitem\">\n <in-button (click)=\"dropdown.close(); item.command();\"\n [color]=\"selectedItem && selectedItem == item.id?'primary':'transparent'\"\n [icon]=\"item.icon\"\n [label]=\"item.label\"\n [svg]=\"item.svg\"\n size=\"large\"\n width=\"100%\"></in-button>\n </div>\n </div>\n\n <div *ngIf=\"notify\" [ngClass]=\"notify\" class=\"notify\"></div>\n</span>\n<span *ngIf=\"!link && !menuItems.length\" [ngStyle]=\"{width:width}\" class=\"button-container\">\n <button\n (blur)=\"blur.emit($event)\"\n (click)=\"_onClick($event)\"\n (focus)=\"focus.emit($event)\"\n [attr.type]=\"type\"\n [class]=\"className + ' ' + testId + ' field_' + name\"\n [disabled]=\"disabled\"\n [ngClass]=\" {'p-button p-widget p-state-default p-corner-all':true,\n 'p-button-icon-only': ((icon || svg) && !label) || isIconOnly,\n 'p-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'p-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'p-button-text-only': (!(icon || svg) && label),\n 'p-button-text-empty': (!(icon || svg) && !label),\n 'p-button-svg': svg,\n 'p-button-material': isMaterialIcon,\n 'p-state-disabled': disabled,\n 'p-button-tiny': size === 'tiny',\n 'p-button-small': size === 'small',\n 'p-button-large': size === 'large',\n 'p-button-primary': color === 'primary',\n 'p-button-secondary': color === 'secondary',\n 'p-button-danger': color === 'danger',\n 'p-button-transparency': color === 'transparent',\n 'p-button-shadowed': shadow === true,\n 'p-button-pressed' : pressed}\" [style]=\"style\">\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\n </button>\n <div *ngIf=\"notify\" [ngClass]=\"notify\" class=\"notify\"></div>\n</span>\n\n<ng-template #content>\n <span *ngIf=\"!isMaterialIcon && icon && !isLoading\" [class]=\"icon\"\n [ngClass]=\"{'p-clickable': true,\n 'p-button-icon-left': (iconPos === 'left'),\n 'p-button-icon-right': (iconPos === 'right')}\"></span>\n <span *ngIf=\"isMaterialIcon && icon && !isLoading\" [ngClass]=\"{'p-clickable': true,\n 'p-button-icon-left': (iconPos === 'left'),\n 'p-button-icon-right': (iconPos === 'right')}\"\n ><i class=\"material-icons\">{{icon}}</i></span>\n <in-preloader *ngIf=\"isLoading\" size=\"small\"></in-preloader>\n <span class=\"p-button-text p-clickable\">{{label}}</span>\n <span *ngIf=\"svg && !isLoading\" [ngClass]=\"{'p-clickable': true,\n 'p-button-icon-left': (iconPos === 'left'),\n 'p-button-icon-right': (iconPos === 'right')}\">\n <in-svg *ngIf=\"size === 'normal'\" [src]=\"svg\" height=\"20px\" width=\"20px\"></in-svg>\n <in-svg *ngIf=\"size === 'large'\" [src]=\"svg\" height=\"20px\" width=\"20px\"></in-svg>\n <in-svg *ngIf=\"size === 'small'\" [src]=\"svg\" height=\"20px\" width=\"20px\"></in-svg>\n <in-svg *ngIf=\"size === 'tiny'\" [src]=\"svg\" height=\"10px\" width=\"10px\"></in-svg>\n </span>\n</ng-template>\n", styles: ["@charset \"UTF-8\";.container{display:inline-block}.button-container{position:relative;display:inline-block}button{outline:none;width:100%}.p-button-icon-only .p-button-icon-left{margin-top:-9px}.p-button-text{vertical-align:middle}.notify{width:8px;height:8px;border-radius:100%;position:absolute;right:8px;top:8px}.notify.warning{background:var(--colorWarning)}.notify.success{background:var(--colorSuccess)}.notify.error{background:var(--colorError)}.notify.critical{background:var(--colorCritical)}.p-button{margin-right:0;height:36px;display:inline-flex;align-items:center;justify-content:center}.p-button.p-button-pressed{background-color:var(--colorBgLevel4)}.p-button.p-button-large{height:48px}.p-button.p-button-large .p-button-icon-left{font-size:18px;margin-top:-8px}.p-button.p-button-large .p-button-text{padding:0 1em 0 48px;margin-top:6px}.p-button-text-icon-left .p-button-text{padding:0 1em 0 2.4em}.p-button-icon-only{font-size:18px;display:inline-flex;align-items:center;justify-content:center}.p-button-icon-only.p-button-large{width:48px;height:48px}.p-button-icon-only.p-button-large .svg,.p-button-icon-only .svg{display:inline-block;line-height:0}.p-button-transparency{background:none;color:currentColor}.p-button-transparency:hover{color:currentColor}.p-button-shadowed{box-shadow:0 2px 6px #0003}.p-button.p-button-svg.p-button-small .p-button-icon-left{margin-top:-4px}.p-button.p-button-svg.p-button-small.p-button-icon-only .p-button-icon-left{margin-top:-2px}.p-button.p-button-svg .p-button-icon-left{left:6px;transform:translateY(-50%);margin-top:-4px}.p-button.p-button-svg.p-button-icon-only .p-button-icon-left{left:50%;width:auto;transform:translate(-50%,-50%);margin-left:0;margin-top:0}.p-button.p-button-svg.p-button-large.p-button-icon-only .p-button-icon-left{margin-top:0}.p-button-material.p-button-icon-only .material-icons{font-size:20px}.p-button-material.p-button-icon-only .p-button-icon-left{margin-top:-10px;margin-left:-12px}.p-button-material .material-icons{font-size:16px}.p-button-material .p-button-icon-left{margin-top:-8px;margin-left:-2px}.p-button-material.p-button-small .p-button-icon-left{margin-top:-7px}.p-button-material.p-button-small .material-icons{font-size:14px}.p-button-material.p-button-small.p-button-icon-only .p-button-icon-left{margin-top:-12px;margin-left:-10px}.p-button-material.p-button-small.p-button-icon-only .p-button-icon-left .material-icons{font-size:18px}.p-button-material.p-button-large .material-icons{font-size:24px}.p-button-material.p-button-large .p-button-icon-left{margin-top:-11px}.p-button-material.p-button-large.p-button-icon-only .p-button-icon-left{margin-top:-11px;margin-left:-13px}:host .p-menu .p-menuitem-link{font-size:16px}.dropdown-menu{display:none;background:var(--colorBgLevel3);padding:4px}.dropdown-menu li{padding:4px;font-size:14px}.dropdown-menu.show{display:block}.in-dropdown-menu{background:var(--colorBgLevel2);padding:0;position:absolute;display:none;margin-left:0;box-shadow:0 0 3px 1px #0003}.in-dropdown-menu.show{display:block}.in-dropdown-menu .in-dropdown-menu-item{list-style-type:none;min-width:250px;display:flex;align-items:center;justify-content:flex-start;min-height:48px}.in-dropdown-menu .in-dropdown-menu-item in-button,.in-dropdown-menu .in-dropdown-menu-item in-button ::ng-deep button{width:100%;border-radius:0}.in-dropdown-menu .in-dropdown-menu-item in-button .p-button,.in-dropdown-menu .in-dropdown-menu-item in-button ::ng-deep button .p-button{justify-content:flex-start}.in-dropdown-menu .in-dropdown-menu-item .switcher{flex:1;display:flex;justify-content:flex-end;padding-right:4px}.in-dropdown-menu .in-dropdown-menu-item+.in-dropdown-menu-item{border-top:1px solid var(--colorBgLevel4)}\n"] }]
|
|
632
632
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { size: [{
|
|
633
633
|
type: Input
|
|
634
634
|
}], color: [{
|
|
@@ -766,7 +766,7 @@ InputTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ver
|
|
|
766
766
|
useExisting: forwardRef(() => InputTextComponent),
|
|
767
767
|
multi: true,
|
|
768
768
|
}
|
|
769
|
-
], ngImport: i0, template: "<label [ngStyle]=\"{width: width}\" class=\"label type_varchars\">\
|
|
769
|
+
], ngImport: i0, template: "<label [ngStyle]=\"{width: width}\" class=\"label type_varchars\">\n <span *ngIf=\"label\" class=\"c-label__content\">\n {{label}}\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n <span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\n <span\n *ngIf=\"maxlength && value && value.length && value.length >= maxlength\"\n class=\"constraints-message__warning u-text_uppercase\">\n {{'maxlength: ' | translate}} {{maxlength}}</span>\n </span>\n <div class=\"input-wrapper u-margin-right-tiny\" [ngClass]=\"{'u-margin-right-tiny': right}\">\n <input (blur)=\"this.blur.emit($event)\"\n (change)=\"onChange($event)\"\n (focus)=\"this.focus.emit($event)\"\n (input)=\"onChange($event)\"\n [(ngModel)]=\"value\"\n [autocomplete]=\"autocomplete? 'on':'off'\"\n [disabled]=\"disabled\"\n [id]=\"id\"\n [maxlength]=\"maxlength\"\n [name]=\"name\"\n [ngClass]=\"{'c-input_opaque' : opacity === false,\n 'c-input_shadowed' : shadow,\n 'c-input_large' : large,\n 'c-input_small' : small,\n 'c-input_margin_padding': widget,\n 'c-input_padding_right': forms}\"\n [ngModelOptions]=\"{standalone: true}\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n [size]=\"size\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n class=\"search-box c-input field_{{id}}\"\n [type]=\"type\">\n <button (click)=\"clear()\"\n class=\"button-reset empty\"\n [ngClass]=\"{empty: display}\"\n type=\"submit\"\n [attr.title]=\"'Reset' | translate\">\n <i class=\"fa fa-close\"></i>\n </button>\n </div>\n</label>\n", styles: ["@charset \"UTF-8\";.label{display:inline-block;margin-bottom:0}.c-input{height:36px;width:100%}.c-input_opaque{background:var(--colorBgLevel3)}.c-input_shadowed{box-shadow:0 2px 6px #0003}.constraints-message__warning{color:red}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--ids-theme-btn-default-color, #FFFFFF)}.empty{display:none}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}.c-input_margin_padding{margin-left:56px;padding-right:10px;max-width:1200px}.c-input_padding_right{padding-right:28px}\n"], dependencies: [{ kind: "directive", type: i1$4.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: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
|
|
770
770
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: InputTextComponent, decorators: [{
|
|
771
771
|
type: Component,
|
|
772
772
|
args: [{ selector: 'in-input-text', providers: [
|
|
@@ -775,7 +775,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
775
775
|
useExisting: forwardRef(() => InputTextComponent),
|
|
776
776
|
multi: true,
|
|
777
777
|
}
|
|
778
|
-
], template: "<label [ngStyle]=\"{width: width}\" class=\"label type_varchars\">\
|
|
778
|
+
], template: "<label [ngStyle]=\"{width: width}\" class=\"label type_varchars\">\n <span *ngIf=\"label\" class=\"c-label__content\">\n {{label}}\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n <span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\n <span\n *ngIf=\"maxlength && value && value.length && value.length >= maxlength\"\n class=\"constraints-message__warning u-text_uppercase\">\n {{'maxlength: ' | translate}} {{maxlength}}</span>\n </span>\n <div class=\"input-wrapper u-margin-right-tiny\" [ngClass]=\"{'u-margin-right-tiny': right}\">\n <input (blur)=\"this.blur.emit($event)\"\n (change)=\"onChange($event)\"\n (focus)=\"this.focus.emit($event)\"\n (input)=\"onChange($event)\"\n [(ngModel)]=\"value\"\n [autocomplete]=\"autocomplete? 'on':'off'\"\n [disabled]=\"disabled\"\n [id]=\"id\"\n [maxlength]=\"maxlength\"\n [name]=\"name\"\n [ngClass]=\"{'c-input_opaque' : opacity === false,\n 'c-input_shadowed' : shadow,\n 'c-input_large' : large,\n 'c-input_small' : small,\n 'c-input_margin_padding': widget,\n 'c-input_padding_right': forms}\"\n [ngModelOptions]=\"{standalone: true}\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n [size]=\"size\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n class=\"search-box c-input field_{{id}}\"\n [type]=\"type\">\n <button (click)=\"clear()\"\n class=\"button-reset empty\"\n [ngClass]=\"{empty: display}\"\n type=\"submit\"\n [attr.title]=\"'Reset' | translate\">\n <i class=\"fa fa-close\"></i>\n </button>\n </div>\n</label>\n", styles: ["@charset \"UTF-8\";.label{display:inline-block;margin-bottom:0}.c-input{height:36px;width:100%}.c-input_opaque{background:var(--colorBgLevel3)}.c-input_shadowed{box-shadow:0 2px 6px #0003}.constraints-message__warning{color:red}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--ids-theme-btn-default-color, #FFFFFF)}.empty{display:none}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}.c-input_margin_padding{margin-left:56px;padding-right:10px;max-width:1200px}.c-input_padding_right{padding-right:28px}\n"] }]
|
|
779
779
|
}], propDecorators: { name: [{
|
|
780
780
|
type: Input
|
|
781
781
|
}], autocomplete: [{
|
|
@@ -1036,39 +1036,39 @@ class DropdownItem {
|
|
|
1036
1036
|
}
|
|
1037
1037
|
}
|
|
1038
1038
|
DropdownItem.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DropdownItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1039
|
-
DropdownItem.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DropdownItem, selector: "p-dropdownItem", inputs: { option: "option", selected: "selected", label: "label", disabled: "disabled", visible: "visible", itemSize: "itemSize", template: "template" }, outputs: { onClick: "onClick" }, ngImport: i0, template: `
|
|
1040
|
-
<li
|
|
1041
|
-
(click)="onOptionClick($event)"
|
|
1042
|
-
role="option"
|
|
1043
|
-
pRipple
|
|
1044
|
-
[attr.aria-label]="label"
|
|
1045
|
-
[attr.aria-selected]="selected"
|
|
1046
|
-
[ngStyle]="{ height: itemSize + 'px' }"
|
|
1047
|
-
[id]="selected ? 'p-highlighted-option' : ''"
|
|
1048
|
-
[ngClass]="{ 'p-dropdown-item': true, 'p-highlight': selected, 'p-disabled': disabled }"
|
|
1049
|
-
>
|
|
1050
|
-
<span *ngIf="!template">{{ label || '' }}</span>
|
|
1051
|
-
<ng-container *ngTemplateOutlet="template; context: { $implicit: option }"></ng-container>
|
|
1052
|
-
</li>
|
|
1039
|
+
DropdownItem.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DropdownItem, selector: "p-dropdownItem", inputs: { option: "option", selected: "selected", label: "label", disabled: "disabled", visible: "visible", itemSize: "itemSize", template: "template" }, outputs: { onClick: "onClick" }, ngImport: i0, template: `
|
|
1040
|
+
<li
|
|
1041
|
+
(click)="onOptionClick($event)"
|
|
1042
|
+
role="option"
|
|
1043
|
+
pRipple
|
|
1044
|
+
[attr.aria-label]="label"
|
|
1045
|
+
[attr.aria-selected]="selected"
|
|
1046
|
+
[ngStyle]="{ height: itemSize + 'px' }"
|
|
1047
|
+
[id]="selected ? 'p-highlighted-option' : ''"
|
|
1048
|
+
[ngClass]="{ 'p-dropdown-item': true, 'p-highlight': selected, 'p-disabled': disabled }"
|
|
1049
|
+
>
|
|
1050
|
+
<span *ngIf="!template">{{ label || '' }}</span>
|
|
1051
|
+
<ng-container *ngTemplateOutlet="template; context: { $implicit: option }"></ng-container>
|
|
1052
|
+
</li>
|
|
1053
1053
|
`, isInline: true, dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$2.Ripple, selector: "[pRipple]" }] });
|
|
1054
1054
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DropdownItem, decorators: [{
|
|
1055
1055
|
type: Component,
|
|
1056
1056
|
args: [{
|
|
1057
1057
|
selector: 'p-dropdownItem',
|
|
1058
|
-
template: `
|
|
1059
|
-
<li
|
|
1060
|
-
(click)="onOptionClick($event)"
|
|
1061
|
-
role="option"
|
|
1062
|
-
pRipple
|
|
1063
|
-
[attr.aria-label]="label"
|
|
1064
|
-
[attr.aria-selected]="selected"
|
|
1065
|
-
[ngStyle]="{ height: itemSize + 'px' }"
|
|
1066
|
-
[id]="selected ? 'p-highlighted-option' : ''"
|
|
1067
|
-
[ngClass]="{ 'p-dropdown-item': true, 'p-highlight': selected, 'p-disabled': disabled }"
|
|
1068
|
-
>
|
|
1069
|
-
<span *ngIf="!template">{{ label || '' }}</span>
|
|
1070
|
-
<ng-container *ngTemplateOutlet="template; context: { $implicit: option }"></ng-container>
|
|
1071
|
-
</li>
|
|
1058
|
+
template: `
|
|
1059
|
+
<li
|
|
1060
|
+
(click)="onOptionClick($event)"
|
|
1061
|
+
role="option"
|
|
1062
|
+
pRipple
|
|
1063
|
+
[attr.aria-label]="label"
|
|
1064
|
+
[attr.aria-selected]="selected"
|
|
1065
|
+
[ngStyle]="{ height: itemSize + 'px' }"
|
|
1066
|
+
[id]="selected ? 'p-highlighted-option' : ''"
|
|
1067
|
+
[ngClass]="{ 'p-dropdown-item': true, 'p-highlight': selected, 'p-disabled': disabled }"
|
|
1068
|
+
>
|
|
1069
|
+
<span *ngIf="!template">{{ label || '' }}</span>
|
|
1070
|
+
<ng-container *ngTemplateOutlet="template; context: { $implicit: option }"></ng-container>
|
|
1071
|
+
</li>
|
|
1072
1072
|
`
|
|
1073
1073
|
}]
|
|
1074
1074
|
}], propDecorators: { option: [{
|
|
@@ -1176,14 +1176,14 @@ class DropdownComponent extends Dropdown {
|
|
|
1176
1176
|
}
|
|
1177
1177
|
}
|
|
1178
1178
|
DropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1179
|
-
DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DropdownComponent, selector: "in-dropdown", inputs: { title: "title", error: "error", scrollHeight: "scrollHeight", filter: "filter", name: "name", options: "options", style: "style", panelStyle: "panelStyle", styleClass: "styleClass", panelStyleClass: "panelStyleClass", readonly: "readonly", required: "required", editable: "editable", appendTo: "appendTo", tabindex: "tabindex", placeholder: "placeholder", filterPlaceholder: "filterPlaceholder", filterLocale: "filterLocale", inputId: "inputId", selectId: "selectId", dataKey: "dataKey", filterBy: "filterBy", autofocus: "autofocus", resetFilterOnHide: "resetFilterOnHide", dropdownIcon: "dropdownIcon", optionLabel: "optionLabel", optionValue: "optionValue", optionDisabled: "optionDisabled", optionGroupLabel: "optionGroupLabel", optionGroupChildren: "optionGroupChildren", autoDisplayFirst: "autoDisplayFirst", group: "group", showClear: "showClear", emptyFilterMessage: "emptyFilterMessage", emptyMessage: "emptyMessage", lazy: "lazy", virtualScroll: "virtualScroll", virtualScrollItemSize: "virtualScrollItemSize", virtualScrollOptions: "virtualScrollOptions", overlayOptions: "overlayOptions", ariaFilterLabel: "ariaFilterLabel", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", filterMatchMode: "filterMatchMode", maxlength: "maxlength", tooltip: "tooltip", tooltipPosition: "tooltipPosition", tooltipPositionStyle: "tooltipPositionStyle", tooltipStyleClass: "tooltipStyleClass", autofocusFilter: "autofocusFilter", overlayDirection: "overlayDirection", itemSize: "itemSize", autoZIndex: "autoZIndex", baseZIndex: "baseZIndex", showTransitionOptions: "showTransitionOptions", hideTransitionOptions: "hideTransitionOptions" }, outputs: { onChange: "onChange", onFilter: "onFilter", onFocus: "onFocus", onBlur: "onBlur", onClick: "onClick", onShow: "onShow", onHide: "onHide", onClear: "onClear", onLazyLoad: "onLazyLoad" }, host: { properties: { "class.p-inputwrapper-filled": "filled", "class.p-inputwrapper-focus": "focused || overlayVisible" }, classAttribute: "p-element p-inputwrapper" }, providers: [DROPDOWN_VALUE_ACCESSOR], usesInheritance: true, ngImport: i0, template: "<span *ngIf=\"title\" class=\"c-label__content\">\r\n {{title}}\r\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\r\n<span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\r\n </span>\r\n<div\r\n #container\r\n (click)=\"onMouseclick($event)\"\r\n [class]=\"styleClass\"\r\n [ngClass]=\"{ 'p-dropdown p-component': true, 'p-disabled': disabled, 'p-dropdown-open': overlayVisible, 'p-focus': focused, 'p-dropdown-clearable': showClear && !disabled }\"\r\n [ngStyle]=\"style\"\r\n>\r\n <div class=\"p-hidden-accessible\">\r\n <input\r\n #in\r\n (blur)=\"onInputBlur($event)\"\r\n (focus)=\"onInputFocus($event)\"\r\n (keydown)=\"onKeydown($event, true)\"\r\n [attr.aria-activedescendant]=\"overlayVisible ? labelId : null\"\r\n [attr.aria-expanded]=\"false\"\r\n [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy\"\r\n [attr.id]=\"inputId\"\r\n [attr.placeholder]=\"placeholder\"\r\n [attr.tabindex]=\"tabindex\"\r\n [autofocus]=\"autofocus\"\r\n [disabled]=\"disabled\"\r\n aria-haspopup=\"listbox\"\r\n aria-haspopup=\"listbox\"\r\n pAutoFocus\r\n readonly\r\n role=\"combobox\"\r\n type=\"text\"\r\n />\r\n </div>\r\n <span\r\n *ngIf=\"!editable && label != null\"\r\n [attr.id]=\"labelId\"\r\n [ngClass]=\"{ 'p-dropdown-label p-inputtext': true, 'p-dropdown-label-empty': label == null || label.length === 0 }\"\r\n [pTooltip]=\"tooltip\"\r\n [positionStyle]=\"tooltipPositionStyle\"\r\n [tooltipPosition]=\"tooltipPosition\"\r\n [tooltipStyleClass]=\"tooltipStyleClass\">\r\n <ng-container *ngIf=\"!selectedItemTemplate\">{{ label || '' }}</ng-container>\r\n <ng-container\r\n *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: selectedOption }\"></ng-container>\r\n </span>\r\n <span\r\n *ngIf=\"!editable && label == null\"\r\n [ngClass]=\"{ 'p-dropdown-label p-inputtext p-placeholder': true, 'p-dropdown-label-empty': placeholder == null || placeholder.length === 0 }\">{{ placeholder || '' }}</span>\r\n <input\r\n #editableInput\r\n (blur)=\"onInputBlur($event)\"\r\n (focus)=\"onEditableInputFocus($event)\"\r\n (input)=\"onEditableInputChange($event)\"\r\n *ngIf=\"editable\"\r\n [attr.aria-expanded]=\"overlayVisible\"\r\n [attr.maxlength]=\"maxlength\"\r\n [attr.placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n aria-haspopup=\"listbox\"\r\n class=\"p-dropdown-label p-inputtext\"\r\n type=\"text\"\r\n />\r\n <i (click)=\"clear($event)\" *ngIf=\"isVisibleClearIcon\" class=\"p-dropdown-clear-icon pi pi-times\"></i>\r\n <div [attr.aria-expanded]=\"overlayVisible\" aria-haspopup=\"listbox\" aria-label=\"dropdown trigger\" class=\"p-dropdown-trigger\"\r\n role=\"button\">\r\n <span [ngClass]=\"dropdownIcon\" class=\"p-dropdown-trigger-icon\"></span>\r\n </div>\r\n <p-overlay\r\n #overlay\r\n (onAnimationStart)=\"onOverlayAnimationStart($event)\"\r\n (onHide)=\"hide()\"\r\n [(visible)]=\"overlayVisible\"\r\n [appendTo]=\"appendTo\"\r\n [autoZIndex]=\"autoZIndex\"\r\n [baseZIndex]=\"baseZIndex\"\r\n [hideTransitionOptions]=\"hideTransitionOptions\"\r\n [options]=\"overlayOptions\"\r\n [showTransitionOptions]=\"showTransitionOptions\"\r\n [target]=\"'@parent'\"\r\n >\r\n <ng-template pTemplate=\"content\">\r\n <div [class]=\"panelStyleClass\" [ngClass]=\"'p-dropdown-panel p-component'\" [ngStyle]=\"panelStyle\">\r\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\r\n <div (click)=\"$event.stopPropagation()\" *ngIf=\"filter\" class=\"p-dropdown-header\">\r\n <ng-container *ngIf=\"filterTemplate; else builtInFilterElement\">\r\n <ng-container *ngTemplateOutlet=\"filterTemplate; context: { options: filterOptions }\"></ng-container>\r\n </ng-container>\r\n <ng-template #builtInFilterElement>\r\n <div class=\"p-dropdown-filter-container\">\r\n <input\r\n #filter\r\n (input)=\"onFilterInputChange($event)\"\r\n (keydown)=\"onKeydown($event, false)\"\r\n (keydown.enter)=\"$event.preventDefault()\"\r\n [attr.aria-activedescendant]=\"overlayVisible ? 'p-highlighted-option' : labelId\"\r\n [attr.aria-label]=\"ariaFilterLabel\"\r\n [attr.placeholder]=\"filterPlaceholder\"\r\n [value]=\"filterValue || ''\"\r\n autocomplete=\"off\"\r\n class=\"p-dropdown-filter p-inputtext p-component\"\r\n type=\"text\"\r\n />\r\n <span class=\"p-dropdown-filter-icon pi pi-search\"></span>\r\n </div>\r\n </ng-template>\r\n </div>\r\n <div [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight || 'auto'\" class=\"p-dropdown-items-wrapper\">\r\n <p-scroller\r\n #scroller\r\n (onLazyLoad)=\"onLazyLoad.emit($event)\"\r\n *ngIf=\"virtualScroll\"\r\n [autoSize]=\"true\"\r\n [itemSize]=\"virtualScrollItemSize || _itemSize\"\r\n [items]=\"optionsToDisplay\"\r\n [lazy]=\"lazy\"\r\n [options]=\"virtualScrollOptions\"\r\n [style]=\"{ height: scrollHeight }\"\r\n >\r\n <ng-template let-items let-scrollerOptions=\"options\" pTemplate=\"content\">\r\n <ng-container\r\n *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\r\n </ng-template>\r\n <ng-container *ngIf=\"loaderTemplate\">\r\n <ng-template let-scrollerOptions=\"options\" pTemplate=\"loader\">\r\n <ng-container *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\r\n </ng-template>\r\n </ng-container>\r\n </p-scroller>\r\n <ng-container *ngIf=\"!virtualScroll\">\r\n <ng-container\r\n *ngTemplateOutlet=\"buildInItems; context: { $implicit: optionsToDisplay, options: {} }\"></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\r\n <ul #items [attr.id]=\"listId\" [ngClass]=\"scrollerOptions.contentStyleClass\" [style]=\"scrollerOptions.contentStyle\"\r\n class=\"p-dropdown-items\" role=\"listbox\">\r\n <ng-container *ngIf=\"group\">\r\n <ng-template [ngForOf]=\"items\" let-optgroup ngFor>\r\n <li [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\" class=\"p-dropdown-item-group\">\r\n <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || '' }}</span>\r\n <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\r\n </li>\r\n <ng-container\r\n *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup), selectedOption: selectedOption }\"></ng-container>\r\n </ng-template>\r\n </ng-container>\r\n <ng-container *ngIf=\"!group\">\r\n <ng-container\r\n *ngTemplateOutlet=\"itemslist; context: { $implicit: items, selectedOption: selectedOption }\"></ng-container>\r\n </ng-container>\r\n <ng-template #itemslist let-options let-selectedOption=\"selectedOption\">\r\n <ng-template [ngForOf]=\"options\" let-i=\"index\" let-option ngFor>\r\n <p-dropdownItem\r\n (onClick)=\"onItemClick($event)\"\r\n [disabled]=\"isOptionDisabled(option)\"\r\n [label]=\"getOptionLabel(option)\"\r\n [option]=\"option\"\r\n [selected]=\"selectedOption == option\"\r\n [template]=\"itemTemplate\"\r\n ></p-dropdownItem>\r\n </ng-template>\r\n </ng-template>\r\n <li *ngIf=\"filterValue && isEmpty()\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\r\n class=\"p-dropdown-empty-message\">\r\n <ng-container *ngIf=\"!emptyFilterTemplate && !emptyTemplate\">\r\n {{ emptyFilterMessageLabel }}\r\n </ng-container>\r\n <ng-container #emptyFilter *ngTemplateOutlet=\"emptyFilterTemplate || emptyTemplate\"></ng-container>\r\n </li>\r\n <li *ngIf=\"!filterValue && isEmpty()\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\r\n class=\"p-dropdown-empty-message\">\r\n <ng-container *ngIf=\"!emptyTemplate\">\r\n {{ emptyMessageLabel }}\r\n </ng-container>\r\n <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n </div>\r\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n </div>\r\n </ng-template>\r\n </p-overlay>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.Overlay, selector: "p-overlay", inputs: ["visible", "mode", "style", "styleClass", "contentStyle", "contentStyleClass", "target", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "listener", "responsive", "options"], outputs: ["visibleChange", "onBeforeShow", "onShow", "onBeforeHide", "onHide", "onAnimationStart", "onAnimationDone"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i5.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i6.Scroller, selector: "p-scroller", inputs: ["id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i7$1.AutoFocus, selector: "[pAutoFocus]", inputs: ["autofocus"] }, { kind: "component", type: DropdownItem, selector: "p-dropdownItem", inputs: ["option", "selected", "label", "disabled", "visible", "itemSize", "template"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1179
|
+
DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DropdownComponent, selector: "in-dropdown", inputs: { title: "title", error: "error", scrollHeight: "scrollHeight", filter: "filter", name: "name", options: "options", style: "style", panelStyle: "panelStyle", styleClass: "styleClass", panelStyleClass: "panelStyleClass", readonly: "readonly", required: "required", editable: "editable", appendTo: "appendTo", tabindex: "tabindex", placeholder: "placeholder", filterPlaceholder: "filterPlaceholder", filterLocale: "filterLocale", inputId: "inputId", selectId: "selectId", dataKey: "dataKey", filterBy: "filterBy", autofocus: "autofocus", resetFilterOnHide: "resetFilterOnHide", dropdownIcon: "dropdownIcon", optionLabel: "optionLabel", optionValue: "optionValue", optionDisabled: "optionDisabled", optionGroupLabel: "optionGroupLabel", optionGroupChildren: "optionGroupChildren", autoDisplayFirst: "autoDisplayFirst", group: "group", showClear: "showClear", emptyFilterMessage: "emptyFilterMessage", emptyMessage: "emptyMessage", lazy: "lazy", virtualScroll: "virtualScroll", virtualScrollItemSize: "virtualScrollItemSize", virtualScrollOptions: "virtualScrollOptions", overlayOptions: "overlayOptions", ariaFilterLabel: "ariaFilterLabel", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", filterMatchMode: "filterMatchMode", maxlength: "maxlength", tooltip: "tooltip", tooltipPosition: "tooltipPosition", tooltipPositionStyle: "tooltipPositionStyle", tooltipStyleClass: "tooltipStyleClass", autofocusFilter: "autofocusFilter", overlayDirection: "overlayDirection", itemSize: "itemSize", autoZIndex: "autoZIndex", baseZIndex: "baseZIndex", showTransitionOptions: "showTransitionOptions", hideTransitionOptions: "hideTransitionOptions" }, outputs: { onChange: "onChange", onFilter: "onFilter", onFocus: "onFocus", onBlur: "onBlur", onClick: "onClick", onShow: "onShow", onHide: "onHide", onClear: "onClear", onLazyLoad: "onLazyLoad" }, host: { properties: { "class.p-inputwrapper-filled": "filled", "class.p-inputwrapper-focus": "focused || overlayVisible" }, classAttribute: "p-element p-inputwrapper" }, providers: [DROPDOWN_VALUE_ACCESSOR], usesInheritance: true, ngImport: i0, template: "<span *ngIf=\"title\" class=\"c-label__content\">\n {{title}}\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n<span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\n </span>\n<div\n #container\n (click)=\"onMouseclick($event)\"\n [class]=\"styleClass\"\n [ngClass]=\"{ 'p-dropdown p-component': true, 'p-disabled': disabled, 'p-dropdown-open': overlayVisible, 'p-focus': focused, 'p-dropdown-clearable': showClear && !disabled }\"\n [ngStyle]=\"style\"\n>\n <div class=\"p-hidden-accessible\">\n <input\n #in\n (blur)=\"onInputBlur($event)\"\n (focus)=\"onInputFocus($event)\"\n (keydown)=\"onKeydown($event, true)\"\n [attr.aria-activedescendant]=\"overlayVisible ? labelId : null\"\n [attr.aria-expanded]=\"false\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.id]=\"inputId\"\n [attr.placeholder]=\"placeholder\"\n [attr.tabindex]=\"tabindex\"\n [autofocus]=\"autofocus\"\n [disabled]=\"disabled\"\n aria-haspopup=\"listbox\"\n aria-haspopup=\"listbox\"\n pAutoFocus\n readonly\n role=\"combobox\"\n type=\"text\"\n />\n </div>\n <span\n *ngIf=\"!editable && label != null\"\n [attr.id]=\"labelId\"\n [ngClass]=\"{ 'p-dropdown-label p-inputtext': true, 'p-dropdown-label-empty': label == null || label.length === 0 }\"\n [pTooltip]=\"tooltip\"\n [positionStyle]=\"tooltipPositionStyle\"\n [tooltipPosition]=\"tooltipPosition\"\n [tooltipStyleClass]=\"tooltipStyleClass\">\n <ng-container *ngIf=\"!selectedItemTemplate\">{{ label || '' }}</ng-container>\n <ng-container\n *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: selectedOption }\"></ng-container>\n </span>\n <span\n *ngIf=\"!editable && label == null\"\n [ngClass]=\"{ 'p-dropdown-label p-inputtext p-placeholder': true, 'p-dropdown-label-empty': placeholder == null || placeholder.length === 0 }\">{{ placeholder || '' }}</span>\n <input\n #editableInput\n (blur)=\"onInputBlur($event)\"\n (focus)=\"onEditableInputFocus($event)\"\n (input)=\"onEditableInputChange($event)\"\n *ngIf=\"editable\"\n [attr.aria-expanded]=\"overlayVisible\"\n [attr.maxlength]=\"maxlength\"\n [attr.placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n aria-haspopup=\"listbox\"\n class=\"p-dropdown-label p-inputtext\"\n type=\"text\"\n />\n <i (click)=\"clear($event)\" *ngIf=\"isVisibleClearIcon\" class=\"p-dropdown-clear-icon pi pi-times\"></i>\n <div [attr.aria-expanded]=\"overlayVisible\" aria-haspopup=\"listbox\" aria-label=\"dropdown trigger\" class=\"p-dropdown-trigger\"\n role=\"button\">\n <span [ngClass]=\"dropdownIcon\" class=\"p-dropdown-trigger-icon\"></span>\n </div>\n <p-overlay\n #overlay\n (onAnimationStart)=\"onOverlayAnimationStart($event)\"\n (onHide)=\"hide()\"\n [(visible)]=\"overlayVisible\"\n [appendTo]=\"appendTo\"\n [autoZIndex]=\"autoZIndex\"\n [baseZIndex]=\"baseZIndex\"\n [hideTransitionOptions]=\"hideTransitionOptions\"\n [options]=\"overlayOptions\"\n [showTransitionOptions]=\"showTransitionOptions\"\n [target]=\"'@parent'\"\n >\n <ng-template pTemplate=\"content\">\n <div [class]=\"panelStyleClass\" [ngClass]=\"'p-dropdown-panel p-component'\" [ngStyle]=\"panelStyle\">\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n <div (click)=\"$event.stopPropagation()\" *ngIf=\"filter\" class=\"p-dropdown-header\">\n <ng-container *ngIf=\"filterTemplate; else builtInFilterElement\">\n <ng-container *ngTemplateOutlet=\"filterTemplate; context: { options: filterOptions }\"></ng-container>\n </ng-container>\n <ng-template #builtInFilterElement>\n <div class=\"p-dropdown-filter-container\">\n <input\n #filter\n (input)=\"onFilterInputChange($event)\"\n (keydown)=\"onKeydown($event, false)\"\n (keydown.enter)=\"$event.preventDefault()\"\n [attr.aria-activedescendant]=\"overlayVisible ? 'p-highlighted-option' : labelId\"\n [attr.aria-label]=\"ariaFilterLabel\"\n [attr.placeholder]=\"filterPlaceholder\"\n [value]=\"filterValue || ''\"\n autocomplete=\"off\"\n class=\"p-dropdown-filter p-inputtext p-component\"\n type=\"text\"\n />\n <span class=\"p-dropdown-filter-icon pi pi-search\"></span>\n </div>\n </ng-template>\n </div>\n <div [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight || 'auto'\" class=\"p-dropdown-items-wrapper\">\n <p-scroller\n #scroller\n (onLazyLoad)=\"onLazyLoad.emit($event)\"\n *ngIf=\"virtualScroll\"\n [autoSize]=\"true\"\n [itemSize]=\"virtualScrollItemSize || _itemSize\"\n [items]=\"optionsToDisplay\"\n [lazy]=\"lazy\"\n [options]=\"virtualScrollOptions\"\n [style]=\"{ height: scrollHeight }\"\n >\n <ng-template let-items let-scrollerOptions=\"options\" pTemplate=\"content\">\n <ng-container\n *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n </ng-template>\n <ng-container *ngIf=\"loaderTemplate\">\n <ng-template let-scrollerOptions=\"options\" pTemplate=\"loader\">\n <ng-container *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\n </ng-template>\n </ng-container>\n </p-scroller>\n <ng-container *ngIf=\"!virtualScroll\">\n <ng-container\n *ngTemplateOutlet=\"buildInItems; context: { $implicit: optionsToDisplay, options: {} }\"></ng-container>\n </ng-container>\n\n <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\n <ul #items [attr.id]=\"listId\" [ngClass]=\"scrollerOptions.contentStyleClass\" [style]=\"scrollerOptions.contentStyle\"\n class=\"p-dropdown-items\" role=\"listbox\">\n <ng-container *ngIf=\"group\">\n <ng-template [ngForOf]=\"items\" let-optgroup ngFor>\n <li [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\" class=\"p-dropdown-item-group\">\n <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || '' }}</span>\n <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\n </li>\n <ng-container\n *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup), selectedOption: selectedOption }\"></ng-container>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"!group\">\n <ng-container\n *ngTemplateOutlet=\"itemslist; context: { $implicit: items, selectedOption: selectedOption }\"></ng-container>\n </ng-container>\n <ng-template #itemslist let-options let-selectedOption=\"selectedOption\">\n <ng-template [ngForOf]=\"options\" let-i=\"index\" let-option ngFor>\n <p-dropdownItem\n (onClick)=\"onItemClick($event)\"\n [disabled]=\"isOptionDisabled(option)\"\n [label]=\"getOptionLabel(option)\"\n [option]=\"option\"\n [selected]=\"selectedOption == option\"\n [template]=\"itemTemplate\"\n ></p-dropdownItem>\n </ng-template>\n </ng-template>\n <li *ngIf=\"filterValue && isEmpty()\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n class=\"p-dropdown-empty-message\">\n <ng-container *ngIf=\"!emptyFilterTemplate && !emptyTemplate\">\n {{ emptyFilterMessageLabel }}\n </ng-container>\n <ng-container #emptyFilter *ngTemplateOutlet=\"emptyFilterTemplate || emptyTemplate\"></ng-container>\n </li>\n <li *ngIf=\"!filterValue && isEmpty()\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n class=\"p-dropdown-empty-message\">\n <ng-container *ngIf=\"!emptyTemplate\">\n {{ emptyMessageLabel }}\n </ng-container>\n <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n </li>\n </ul>\n </ng-template>\n </div>\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n </div>\n </ng-template>\n </p-overlay>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.Overlay, selector: "p-overlay", inputs: ["visible", "mode", "style", "styleClass", "contentStyle", "contentStyleClass", "target", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "listener", "responsive", "options"], outputs: ["visibleChange", "onBeforeShow", "onShow", "onBeforeHide", "onHide", "onAnimationStart", "onAnimationDone"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i5.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i6.Scroller, selector: "p-scroller", inputs: ["id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i7$1.AutoFocus, selector: "[pAutoFocus]", inputs: ["autofocus"] }, { kind: "component", type: DropdownItem, selector: "p-dropdownItem", inputs: ["option", "selected", "label", "disabled", "visible", "itemSize", "template"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1180
1180
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DropdownComponent, decorators: [{
|
|
1181
1181
|
type: Component,
|
|
1182
1182
|
args: [{ selector: 'in-dropdown', host: {
|
|
1183
1183
|
class: 'p-element p-inputwrapper',
|
|
1184
1184
|
'[class.p-inputwrapper-filled]': 'filled',
|
|
1185
1185
|
'[class.p-inputwrapper-focus]': 'focused || overlayVisible'
|
|
1186
|
-
}, providers: [DROPDOWN_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<span *ngIf=\"title\" class=\"c-label__content\">\
|
|
1186
|
+
}, providers: [DROPDOWN_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<span *ngIf=\"title\" class=\"c-label__content\">\n {{title}}\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n<span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\n </span>\n<div\n #container\n (click)=\"onMouseclick($event)\"\n [class]=\"styleClass\"\n [ngClass]=\"{ 'p-dropdown p-component': true, 'p-disabled': disabled, 'p-dropdown-open': overlayVisible, 'p-focus': focused, 'p-dropdown-clearable': showClear && !disabled }\"\n [ngStyle]=\"style\"\n>\n <div class=\"p-hidden-accessible\">\n <input\n #in\n (blur)=\"onInputBlur($event)\"\n (focus)=\"onInputFocus($event)\"\n (keydown)=\"onKeydown($event, true)\"\n [attr.aria-activedescendant]=\"overlayVisible ? labelId : null\"\n [attr.aria-expanded]=\"false\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.id]=\"inputId\"\n [attr.placeholder]=\"placeholder\"\n [attr.tabindex]=\"tabindex\"\n [autofocus]=\"autofocus\"\n [disabled]=\"disabled\"\n aria-haspopup=\"listbox\"\n aria-haspopup=\"listbox\"\n pAutoFocus\n readonly\n role=\"combobox\"\n type=\"text\"\n />\n </div>\n <span\n *ngIf=\"!editable && label != null\"\n [attr.id]=\"labelId\"\n [ngClass]=\"{ 'p-dropdown-label p-inputtext': true, 'p-dropdown-label-empty': label == null || label.length === 0 }\"\n [pTooltip]=\"tooltip\"\n [positionStyle]=\"tooltipPositionStyle\"\n [tooltipPosition]=\"tooltipPosition\"\n [tooltipStyleClass]=\"tooltipStyleClass\">\n <ng-container *ngIf=\"!selectedItemTemplate\">{{ label || '' }}</ng-container>\n <ng-container\n *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: selectedOption }\"></ng-container>\n </span>\n <span\n *ngIf=\"!editable && label == null\"\n [ngClass]=\"{ 'p-dropdown-label p-inputtext p-placeholder': true, 'p-dropdown-label-empty': placeholder == null || placeholder.length === 0 }\">{{ placeholder || '' }}</span>\n <input\n #editableInput\n (blur)=\"onInputBlur($event)\"\n (focus)=\"onEditableInputFocus($event)\"\n (input)=\"onEditableInputChange($event)\"\n *ngIf=\"editable\"\n [attr.aria-expanded]=\"overlayVisible\"\n [attr.maxlength]=\"maxlength\"\n [attr.placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n aria-haspopup=\"listbox\"\n class=\"p-dropdown-label p-inputtext\"\n type=\"text\"\n />\n <i (click)=\"clear($event)\" *ngIf=\"isVisibleClearIcon\" class=\"p-dropdown-clear-icon pi pi-times\"></i>\n <div [attr.aria-expanded]=\"overlayVisible\" aria-haspopup=\"listbox\" aria-label=\"dropdown trigger\" class=\"p-dropdown-trigger\"\n role=\"button\">\n <span [ngClass]=\"dropdownIcon\" class=\"p-dropdown-trigger-icon\"></span>\n </div>\n <p-overlay\n #overlay\n (onAnimationStart)=\"onOverlayAnimationStart($event)\"\n (onHide)=\"hide()\"\n [(visible)]=\"overlayVisible\"\n [appendTo]=\"appendTo\"\n [autoZIndex]=\"autoZIndex\"\n [baseZIndex]=\"baseZIndex\"\n [hideTransitionOptions]=\"hideTransitionOptions\"\n [options]=\"overlayOptions\"\n [showTransitionOptions]=\"showTransitionOptions\"\n [target]=\"'@parent'\"\n >\n <ng-template pTemplate=\"content\">\n <div [class]=\"panelStyleClass\" [ngClass]=\"'p-dropdown-panel p-component'\" [ngStyle]=\"panelStyle\">\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n <div (click)=\"$event.stopPropagation()\" *ngIf=\"filter\" class=\"p-dropdown-header\">\n <ng-container *ngIf=\"filterTemplate; else builtInFilterElement\">\n <ng-container *ngTemplateOutlet=\"filterTemplate; context: { options: filterOptions }\"></ng-container>\n </ng-container>\n <ng-template #builtInFilterElement>\n <div class=\"p-dropdown-filter-container\">\n <input\n #filter\n (input)=\"onFilterInputChange($event)\"\n (keydown)=\"onKeydown($event, false)\"\n (keydown.enter)=\"$event.preventDefault()\"\n [attr.aria-activedescendant]=\"overlayVisible ? 'p-highlighted-option' : labelId\"\n [attr.aria-label]=\"ariaFilterLabel\"\n [attr.placeholder]=\"filterPlaceholder\"\n [value]=\"filterValue || ''\"\n autocomplete=\"off\"\n class=\"p-dropdown-filter p-inputtext p-component\"\n type=\"text\"\n />\n <span class=\"p-dropdown-filter-icon pi pi-search\"></span>\n </div>\n </ng-template>\n </div>\n <div [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight || 'auto'\" class=\"p-dropdown-items-wrapper\">\n <p-scroller\n #scroller\n (onLazyLoad)=\"onLazyLoad.emit($event)\"\n *ngIf=\"virtualScroll\"\n [autoSize]=\"true\"\n [itemSize]=\"virtualScrollItemSize || _itemSize\"\n [items]=\"optionsToDisplay\"\n [lazy]=\"lazy\"\n [options]=\"virtualScrollOptions\"\n [style]=\"{ height: scrollHeight }\"\n >\n <ng-template let-items let-scrollerOptions=\"options\" pTemplate=\"content\">\n <ng-container\n *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n </ng-template>\n <ng-container *ngIf=\"loaderTemplate\">\n <ng-template let-scrollerOptions=\"options\" pTemplate=\"loader\">\n <ng-container *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\n </ng-template>\n </ng-container>\n </p-scroller>\n <ng-container *ngIf=\"!virtualScroll\">\n <ng-container\n *ngTemplateOutlet=\"buildInItems; context: { $implicit: optionsToDisplay, options: {} }\"></ng-container>\n </ng-container>\n\n <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\n <ul #items [attr.id]=\"listId\" [ngClass]=\"scrollerOptions.contentStyleClass\" [style]=\"scrollerOptions.contentStyle\"\n class=\"p-dropdown-items\" role=\"listbox\">\n <ng-container *ngIf=\"group\">\n <ng-template [ngForOf]=\"items\" let-optgroup ngFor>\n <li [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\" class=\"p-dropdown-item-group\">\n <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || '' }}</span>\n <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\n </li>\n <ng-container\n *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup), selectedOption: selectedOption }\"></ng-container>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"!group\">\n <ng-container\n *ngTemplateOutlet=\"itemslist; context: { $implicit: items, selectedOption: selectedOption }\"></ng-container>\n </ng-container>\n <ng-template #itemslist let-options let-selectedOption=\"selectedOption\">\n <ng-template [ngForOf]=\"options\" let-i=\"index\" let-option ngFor>\n <p-dropdownItem\n (onClick)=\"onItemClick($event)\"\n [disabled]=\"isOptionDisabled(option)\"\n [label]=\"getOptionLabel(option)\"\n [option]=\"option\"\n [selected]=\"selectedOption == option\"\n [template]=\"itemTemplate\"\n ></p-dropdownItem>\n </ng-template>\n </ng-template>\n <li *ngIf=\"filterValue && isEmpty()\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n class=\"p-dropdown-empty-message\">\n <ng-container *ngIf=\"!emptyFilterTemplate && !emptyTemplate\">\n {{ emptyFilterMessageLabel }}\n </ng-container>\n <ng-container #emptyFilter *ngTemplateOutlet=\"emptyFilterTemplate || emptyTemplate\"></ng-container>\n </li>\n <li *ngIf=\"!filterValue && isEmpty()\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n class=\"p-dropdown-empty-message\">\n <ng-container *ngIf=\"!emptyTemplate\">\n {{ emptyMessageLabel }}\n </ng-container>\n <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n </li>\n </ul>\n </ng-template>\n </div>\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n </div>\n </ng-template>\n </p-overlay>\n</div>\n" }]
|
|
1187
1187
|
}], propDecorators: { title: [{
|
|
1188
1188
|
type: Input
|
|
1189
1189
|
}], error: [{
|
|
@@ -1775,7 +1775,7 @@ TableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version
|
|
|
1775
1775
|
useFactory: tableFactory,
|
|
1776
1776
|
deps: [TableComponent], // new function depends on your wrapper
|
|
1777
1777
|
},
|
|
1778
|
-
], queries: [{ propertyName: "templates", predicate: InsparkTemplate }], viewQueries: [{ propertyName: "dt", first: true, predicate: ["dt"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<span *ngIf=\"label\" class=\"c-label\">\r\n {{label}}\r\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\r\n <span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\r\n</span>\r\n<p-table #dt\r\n (onFilter) = onFilter($event)\r\n (onSort)=\"onSort()\"\r\n (onStateRestore)=\"restoreSearchText()\"\r\n (onStateSave)=\"stateSave($event)\"\r\n (sortFunction)=\"sortFunction? sortFunction.emit($event): null\"\r\n [(selection)]=\"selectionValue\"\r\n [class]=\"class\"\r\n [columns]=\"filteredColumns\"\r\n [customSort]=\"customSort\"\r\n [dataKey]=\"dataKey || 'id'\"\r\n [globalFilterFields]=\"globalFilteredColumns\"\r\n [resizableColumns]=\"resizableColumns\"\r\n [scrollHeight]=\"scrollHeight\"\r\n [scrollable]=\"scrollable\"\r\n [selectionMode]=\"selectionMode\"\r\n [sortField]=\"sortField || 'id'\"\r\n [sortOrder]=\"isAscending ? 1 : -1\"\r\n [stateKey]=\"stateKey\"\r\n [stateStorage]=\"'local'\"\r\n [style]=\"style\"\r\n [value]=\"values\"\r\n columnResizeMode=\"expand\"\r\n\r\n>\r\n\r\n <ng-template *ngIf=\"colGroupTemplate\" let-columns pTemplate=\"body\">\r\n <ng-container\r\n *ngTemplateOutlet=\"colGroupTemplate; context: {$implicit: { columns: columns}}\"></ng-container>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"!colGroupTemplate\" let-columns pTemplate=\"colgroup\">\r\n <colgroup *ngIf=\"!isMobileView\">\r\n <col *ngIf=\"checkboxSelection\" style=\"width: 44px;\">\r\n <col *ngFor=\"let col of filteredColumns; let idx = index\" [style.width]=\"calcWidth(idx, col.field, col.width)\">\r\n </colgroup>\r\n </ng-template>\r\n\r\n <ng-template let-columns pTemplate=\"header\">\r\n <ng-container *ngIf=\"showHeader\">\r\n <tr>\r\n <th *ngIf=\"checkboxSelection\" class=\"u-position-relative u-text_center\" pResizableColumn style=\"width: 44px;\">\r\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\r\n </th>\r\n <th *ngFor=\"let col of filteredColumns\" [pSortableColumn]=\"col.field\" class=\"u-position-relative\"\r\n pResizableColumn>\r\n <div class=\"p-table-thead-title\"\r\n title=\"{{col.label | translate}}\">\r\n {{col.label | translate}}\r\n </div>\r\n <p-sortIcon *ngIf=\"isSortIcon\" [field]=\"col.field\"\r\n class=\"u-position-absolute u-position-absolute-right c-sorticon\"\r\n style=\"display: flex; width: 18px; top: 0; height: 100%;\"></p-sortIcon>\r\n </th>\r\n </tr>\r\n <tr *ngIf=\"toolbar && toolbar.filter && toolbar.filter.active\">\r\n <th *ngIf=\"checkboxSelection\" class=\"u-position-relative u-text_center\" pResizableColumn\r\n style=\"width: 44px;\"></th>\r\n <th *ngFor=\"let col of columns\" [ngSwitch]=\"col.field\">\r\n <input\r\n (input)=\"dt.filter($event.target.value, col.field, 'contains')\"\r\n *ngSwitchCase=\"colFilter(col.field).type === 'text' ? col.field : ''\"\r\n autofocus=\"\"\r\n class=\"c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\r\n pInputText\r\n type=\"text\">\r\n\r\n <p-dropdown (onChange)=\"dt.filter($event.value, col.field, 'equals')\"\r\n *ngSwitchCase=\"colFilter(col.field).type === 'dropdown' ? col.field : ''\"\r\n [options]=\"colFilter(col.field).options\"\r\n [style]=\"{ width: '100%', overflow: 'visible' }\"\r\n appendTo=\"body\"></p-dropdown>\r\n\r\n <p-multiSelect (onChange)=\"dt.filter($event.value, col.field, 'in')\"\r\n *ngSwitchCase=\"colFilter(col.field).type === 'multiselect' ? col.field : ''\"\r\n [options]=\"colFilter(col.field).options\"\r\n [style]=\"{ width: '100%', overflow: 'visible' }\" appendTo=\"body\"\r\n defaultLabel=\"{{'All' | translate}}\"></p-multiSelect>\r\n <input\r\n (input)=\"dt.filter($event.target.value, col.field + '2filter', 'contains')\"\r\n *ngSwitchCase=\"colFilter(col.field).type === 'datetext' ? col.field : ''\"\r\n autofocus=\"\"\r\n class=\"c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\r\n pInputText\r\n type=\"text\">\r\n </th>\r\n </tr>\r\n </ng-container>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"bodyTemplate\" let-columns=\"columns\" let-rowData let-rowIndex=\"rowIndex\" pTemplate=\"body\">\r\n <ng-container\r\n *ngTemplateOutlet=\"bodyTemplate; context: {$implicit: { rowIndex: rowIndex, rowData: rowData, columns: columns}}\"></ng-container>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"!bodyTemplate\" let-columns=\"columns\" let-index=\"rowIndex\" let-rowData pTemplate=\"body\">\r\n <tr\r\n (click)=\"toggleGroup(index, rowData.groupKey[groupMode])\"\r\n *ngIf=\"isGrouped && isShowGroup(rowData.groupKey[groupMode], index)\"\r\n class=\"row_hover_highlight\">\r\n <td [colSpan]=\"countVisibleColumns() + 1\">\r\n <span>\r\n <i\r\n [ngClass]=\"groupInfo[rowData.groupKey[groupMode]].isExpanded ? 'fa fa-fw fa-angle-down' : 'fa fa-fw fa-angle-right'\"></i>\r\n <span>{{rowData.groupKey[groupMode] | translate }} ({{countGroup(rowData.groupKey[groupMode], groupMode)}}\r\n )</span>\r\n </span>\r\n </td>\r\n </tr>\r\n <tr *ngIf=\"!isGrouped || groupInfo[(rowData.groupKey[groupMode])].isExpanded\"\r\n [ngClass]=\"{row_active: isRowActive(rowData)}\"\r\n [pSelectableRow]=\"rowData\"\r\n class=\"row\">\r\n <td *ngIf=\"checkboxSelection\" [ngClass]=\"{\r\n 'row_status_success': rowData.sdirparamstatecolor === 'success',\r\n 'row_status_error': rowData.sdirparamstatecolor === 'error',\r\n 'row_status_warning': rowData.sdirparamstatecolor === 'warning',\r\n 'row_status_critical': rowData.sdirparamstatecolor === 'critical',\r\n 'row_status_falsevalue': rowData.sdirparamstatecolor === 'falsevalue'\r\n }\" class=\"u-text_center\"\r\n style=\"width: 44px\"\r\n >\r\n <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\r\n </td>\r\n <td (click)=\"activeChange.emit(rowData)\"\r\n *ngFor=\"let col of filteredColumns\"\r\n class=\"u-overflow-visible\">\r\n <div (mouseover)=\"showTooltip($event)\" *ngIf=\"!valueTemplate\" class=\"p-table-tbody-content\" title>\r\n {{col.translatable ? (rowData | propertyValue: col.field | translate) : (rowData | propertyValue: col.field)}}\r\n </div>\r\n <ng-container\r\n *ngTemplateOutlet=\"valueTemplate; context: {$implicit: { data: rowData, col: col}}\"></ng-container>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"toolbar\" pTemplate=\"caption\">\r\n\r\n <div class=\"o-grid o-grid_no-gutter\">\r\n <div class=\"c-tree-table__toolbar-content u-display-inline-flex\">\r\n <div *ngIf=\"isTextSearch\" class=\"c-form c-form_inline u-display-inline-block\">\r\n <form class=\"c-label\">\r\n <div class=\"input-wrapper u-margin-right-tiny\">\r\n <input #searchTextInput\r\n (input)=\"localSearch(dt, searchText)\"\r\n [(ngModel)]=\"searchText\"\r\n [ngModelOptions]=\"{standalone: true}\"\r\n autofocus=\"\"\r\n class=\"search-box c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\r\n pInputText\r\n placeholder=\"{{('SHARED.SEARCH' | translate) + ':'}}\"\r\n required\r\n style=\"padding-right: 28px\"\r\n tabindex=\"1\"\r\n type=\"search\"\r\n >\r\n <button (click)=\"clear()\" class=\"button-reset\" type=\"reset\"\r\n [attr.title]=\"'Reset' | translate\">\r\n <i class=\"fa fa-close\"></i>\r\n </button>\r\n </div>\r\n </form>\r\n </div>\r\n <div class=\"c-btn c-btn_border-free c-btn_small\">\r\n <in-table-columns-multiselect (columnsChange)=\"columnsChange($event)\"\r\n [columns]=\"primaryColumns\"\r\n [disableActiveCheckboxes]=\"countVisibleColumns() === 1\"></in-table-columns-multiselect>\r\n </div>\r\n\r\n <button (click)=\"onFilterToolbar($event)\" *ngIf=\"toolbar.filter\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"fa fa-filter\" title=\"{{'Service filter' | translate}}\"></i>\r\n </button>\r\n\r\n <button (click)=\"addAction.emit($event)\" *ngIf=\"toolbar.add\" [disabled]=\"toolbar.add.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"fa fa-plus\" title=\"{{'Add' | translate}}\"></i>\r\n </button>\r\n\r\n <button (click)=\"linkAction.emit($event)\" *ngIf=\"toolbar.link\" [disabled]=\"toolbar.link.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"fa fa-link\" title=\"{{'Link' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"csvAction.emit($event)\" *ngIf=\"toolbar.csv\" [disabled]=\"toolbar.csv.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"fa fa-file-csv\" title=\"{{'LOGS.SAVE_TO_SCV' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"saveAction.emit($event)\" *ngIf=\"toolbar.save\"\r\n [disabled]=\"toolbar.save.disabled\"\r\n class=\"c-btn c-btn_primary c-btn_small\"\r\n title=\"{{'Save' | translate}}\"\r\n >\r\n {{'Save' | translate}}\r\n </button>\r\n <button (click)=\"groupEditAction.emit($event)\" *ngIf=\"toolbar.groupEdit && toolbar.groupEdit.active\"\r\n [disabled]=\"toolbar.groupEdit.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"fa fa-pencil-square-o\" title=\"{{'groupEdit' | translate}}\"></i>\r\n </button>\r\n <ng-content select=\"[buttons]\"></ng-content>\r\n <button (click)=\"paramsEditAction.emit($event)\" *ngIf=\"toolbar.paramsEdit && toolbar.paramsEdit.active\"\r\n [disabled]=\"toolbar.paramsEdit.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"fa fa-share-square-o\" title=\"{{'paramsEdit' | translate}}\"></i>\r\n </button>\r\n\r\n\r\n <button (click)=\"removeAction.emit($event)\" *ngIf=\"toolbar.remove && toolbar.remove.active\"\r\n [disabled]=\"toolbar.remove.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"fa fa-trash\" title=\"{{'Delete' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"unlinkAction.emit($event)\" *ngIf=\"toolbar.unlink\" [disabled]=\"toolbar.unlink.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"fa fa-unlink\" title=\"{{'Detach tag from selected items' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"toggleNodes(true)\"\r\n *ngIf=\"toolbar.expandAll\"\r\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\r\n title=\"{{'Expand all' | translate}}\">\r\n <svg fill=\"currentColor\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M20 2H4v2h16V2zM4 20v2h16v-2H4zM12 5l5 6H7l5-6zM17 13l-5 6-5-6h10z\"/>\r\n </svg>\r\n </button>\r\n <button (click)=\"toggleNodes(false)\"\r\n *ngIf=\"toolbar.expandAll\"\r\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\r\n title=\"{{'Collapse all' | translate}}\">\r\n <svg fill=\"currentColor\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path clip-rule=\"evenodd\" d=\"M17 3l-5 6-5-6h10zM4 13v-2h16v2H4zm8 2l5 6H7l5-6z\" fill-rule=\"evenodd\"/>\r\n </svg>\r\n </button>\r\n\r\n <div *ngIf=\"toolbar.groupSort\"\r\n class=\"c-btn-group\"\r\n container=\"body\"\r\n ngbDropdown>\r\n\r\n <button class=\"c-btn c-btn_border-free c-btn_small\"\r\n id=\"dropdownGroupType\"\r\n ngbDropdownToggle\r\n title=\"{{'Change the way parameters are grouped' | translate}}\">\r\n <i aria-hidden=\"true\" class=\"fa fa-object-group\"></i>\r\n <i aria-hidden=\"true\" class=\"c-caret\"></i>\r\n </button>\r\n\r\n <ul aria-labelledby=\"dropdownGroupType\"\r\n class=\"c-dropdown-menu c-dropdown-menu_right ng-star-inserted\"\r\n ngbDropdownMenu\r\n role=\"menu\">\r\n <li *ngFor=\"let item of toolbar.groupSort.label\"\r\n [ngClass]=\"{'is-dropdown-menu__listitem_active': item.value === groupMode}\"\r\n class=\"c-dropdown-menu__listitem is-dropdown-menu__listitem_active\"\r\n ngbDropdownItem\r\n role=\"menuitem\">\r\n <a (click)=\"toggleMode(item.value)\" class=\"c-dropdown-menu__content\">\r\n {{item.label}}\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n</p-table>\r\n", styles: ["@charset \"UTF-8\";.u-overflow-visible{overflow:visible!important}.row_status_success{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-success, #31AC51)}.row_status_error{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-error, #F95C5D)}.row_status_warning{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-warning, #EE9946)}.row_status_critical{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-critical, #F95C5D)}.row_status_falsevalue{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-falsevalue, #85B3CB)}.row_status_disabled{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-disabled)}.row_status_none{padding-left:9px!important;border-left:4px solid transparent}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--ids-theme-btn-default-color, #FFFFFF)}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}\n"], dependencies: [{ kind: "directive", type: i0.forwardRef(function () { return i1$2.NgClass; }), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$2.NgForOf; }), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$2.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$2.NgTemplateOutlet; }), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$2.NgSwitch; }), selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$2.NgSwitchCase; }), selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i0.forwardRef(function () { return i2$3.Table; }), selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "virtualRowHeight", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i0.forwardRef(function () { return i2.PrimeTemplate; }), selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i0.forwardRef(function () { return i2$3.SortableColumn; }), selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i0.forwardRef(function () { return i2$3.SelectableRow; }), selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { kind: "directive", type: i0.forwardRef(function () { return i2$3.ResizableColumn; }), selector: "[pResizableColumn]", inputs: ["pResizableColumnDisabled"] }, { kind: "component", type: i0.forwardRef(function () { return i2$3.SortIcon; }), selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i0.forwardRef(function () { return i2$3.TableCheckbox; }), selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i0.forwardRef(function () { return i2$3.TableHeaderCheckbox; }), selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$4.ɵNgNoValidate; }), selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i0.forwardRef(function () { return i1$4.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: i0.forwardRef(function () { return i1$4.NgControlStatus; }), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(function () { return i1$4.NgControlStatusGroup; }), selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i0.forwardRef(function () { return i1$4.RequiredValidator; }), selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$4.NgModel; }), selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$4.NgForm; }), selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i0.forwardRef(function () { return i5$1.Dropdown; }), selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "selectId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "overlayDirection", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i0.forwardRef(function () { return i6$1.MultiSelect; }), selector: "p-multiSelect", inputs: ["style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "label", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad"] }, { kind: "directive", type: i0.forwardRef(function () { return i7.NgbDropdown; }), selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "popperOptions", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { kind: "directive", type: i0.forwardRef(function () { return i7.NgbDropdownToggle; }), selector: "[ngbDropdownToggle]" }, { kind: "directive", type: i0.forwardRef(function () { return i7.NgbDropdownMenu; }), selector: "[ngbDropdownMenu]" }, { kind: "directive", type: i0.forwardRef(function () { return i7.NgbDropdownItem; }), selector: "[ngbDropdownItem]", inputs: ["disabled"] }, { kind: "component", type: i0.forwardRef(function () { return TableColumnsMultiselectComponent; }), selector: "in-table-columns-multiselect", inputs: ["columns", "disableActiveCheckboxes"], outputs: ["columnsChange"] }, { kind: "pipe", type: i0.forwardRef(function () { return PropertyValuePipe; }), name: "propertyValue" }, { kind: "pipe", type: i0.forwardRef(function () { return i1.TranslatePipe; }), name: "translate" }] });
|
|
1778
|
+
], queries: [{ propertyName: "templates", predicate: InsparkTemplate }], viewQueries: [{ propertyName: "dt", first: true, predicate: ["dt"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<span *ngIf=\"label\" class=\"c-label\">\n {{label}}\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n <span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\n</span>\n<p-table #dt\n (onFilter) = onFilter($event)\n (onSort)=\"onSort()\"\n (onStateRestore)=\"restoreSearchText()\"\n (onStateSave)=\"stateSave($event)\"\n (sortFunction)=\"sortFunction? sortFunction.emit($event): null\"\n [(selection)]=\"selectionValue\"\n [class]=\"class\"\n [columns]=\"filteredColumns\"\n [customSort]=\"customSort\"\n [dataKey]=\"dataKey || 'id'\"\n [globalFilterFields]=\"globalFilteredColumns\"\n [resizableColumns]=\"resizableColumns\"\n [scrollHeight]=\"scrollHeight\"\n [scrollable]=\"scrollable\"\n [selectionMode]=\"selectionMode\"\n [sortField]=\"sortField || 'id'\"\n [sortOrder]=\"isAscending ? 1 : -1\"\n [stateKey]=\"stateKey\"\n [stateStorage]=\"'local'\"\n [style]=\"style\"\n [value]=\"values\"\n columnResizeMode=\"expand\"\n\n>\n\n <ng-template *ngIf=\"colGroupTemplate\" let-columns pTemplate=\"body\">\n <ng-container\n *ngTemplateOutlet=\"colGroupTemplate; context: {$implicit: { columns: columns}}\"></ng-container>\n </ng-template>\n\n <ng-template *ngIf=\"!colGroupTemplate\" let-columns pTemplate=\"colgroup\">\n <colgroup *ngIf=\"!isMobileView\">\n <col *ngIf=\"checkboxSelection\" style=\"width: 44px;\">\n <col *ngFor=\"let col of filteredColumns; let idx = index\" [style.width]=\"calcWidth(idx, col.field, col.width)\">\n </colgroup>\n </ng-template>\n\n <ng-template let-columns pTemplate=\"header\">\n <ng-container *ngIf=\"showHeader\">\n <tr>\n <th *ngIf=\"checkboxSelection\" class=\"u-position-relative u-text_center\" pResizableColumn style=\"width: 44px;\">\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n </th>\n <th *ngFor=\"let col of filteredColumns\" [pSortableColumn]=\"col.field\" class=\"u-position-relative\"\n pResizableColumn>\n <div class=\"p-table-thead-title\"\n title=\"{{col.label | translate}}\">\n {{col.label | translate}}\n </div>\n <p-sortIcon *ngIf=\"isSortIcon\" [field]=\"col.field\"\n class=\"u-position-absolute u-position-absolute-right c-sorticon\"\n style=\"display: flex; width: 18px; top: 0; height: 100%;\"></p-sortIcon>\n </th>\n </tr>\n <tr *ngIf=\"toolbar && toolbar.filter && toolbar.filter.active\">\n <th *ngIf=\"checkboxSelection\" class=\"u-position-relative u-text_center\" pResizableColumn\n style=\"width: 44px;\"></th>\n <th *ngFor=\"let col of columns\" [ngSwitch]=\"col.field\">\n <input\n (input)=\"dt.filter($event.target.value, col.field, 'contains')\"\n *ngSwitchCase=\"colFilter(col.field).type === 'text' ? col.field : ''\"\n autofocus=\"\"\n class=\"c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\n pInputText\n type=\"text\">\n\n <p-dropdown (onChange)=\"dt.filter($event.value, col.field, 'equals')\"\n *ngSwitchCase=\"colFilter(col.field).type === 'dropdown' ? col.field : ''\"\n [options]=\"colFilter(col.field).options\"\n [style]=\"{ width: '100%', overflow: 'visible' }\"\n appendTo=\"body\"></p-dropdown>\n\n <p-multiSelect (onChange)=\"dt.filter($event.value, col.field, 'in')\"\n *ngSwitchCase=\"colFilter(col.field).type === 'multiselect' ? col.field : ''\"\n [options]=\"colFilter(col.field).options\"\n [style]=\"{ width: '100%', overflow: 'visible' }\" appendTo=\"body\"\n defaultLabel=\"{{'All' | translate}}\"></p-multiSelect>\n <input\n (input)=\"dt.filter($event.target.value, col.field + '2filter', 'contains')\"\n *ngSwitchCase=\"colFilter(col.field).type === 'datetext' ? col.field : ''\"\n autofocus=\"\"\n class=\"c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\n pInputText\n type=\"text\">\n </th>\n </tr>\n </ng-container>\n </ng-template>\n\n <ng-template *ngIf=\"bodyTemplate\" let-columns=\"columns\" let-rowData let-rowIndex=\"rowIndex\" pTemplate=\"body\">\n <ng-container\n *ngTemplateOutlet=\"bodyTemplate; context: {$implicit: { rowIndex: rowIndex, rowData: rowData, columns: columns}}\"></ng-container>\n </ng-template>\n\n <ng-template *ngIf=\"!bodyTemplate\" let-columns=\"columns\" let-index=\"rowIndex\" let-rowData pTemplate=\"body\">\n <tr\n (click)=\"toggleGroup(index, rowData.groupKey[groupMode])\"\n *ngIf=\"isGrouped && isShowGroup(rowData.groupKey[groupMode], index)\"\n class=\"row_hover_highlight\">\n <td [colSpan]=\"countVisibleColumns() + 1\">\n <span>\n <i\n [ngClass]=\"groupInfo[rowData.groupKey[groupMode]].isExpanded ? 'fa fa-fw fa-angle-down' : 'fa fa-fw fa-angle-right'\"></i>\n <span>{{rowData.groupKey[groupMode] | translate }} ({{countGroup(rowData.groupKey[groupMode], groupMode)}}\n )</span>\n </span>\n </td>\n </tr>\n <tr *ngIf=\"!isGrouped || groupInfo[(rowData.groupKey[groupMode])].isExpanded\"\n [ngClass]=\"{row_active: isRowActive(rowData)}\"\n [pSelectableRow]=\"rowData\"\n class=\"row\">\n <td *ngIf=\"checkboxSelection\" [ngClass]=\"{\n 'row_status_success': rowData.sdirparamstatecolor === 'success',\n 'row_status_error': rowData.sdirparamstatecolor === 'error',\n 'row_status_warning': rowData.sdirparamstatecolor === 'warning',\n 'row_status_critical': rowData.sdirparamstatecolor === 'critical',\n 'row_status_falsevalue': rowData.sdirparamstatecolor === 'falsevalue'\n }\" class=\"u-text_center\"\n style=\"width: 44px\"\n >\n <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\n </td>\n <td (click)=\"activeChange.emit(rowData)\"\n *ngFor=\"let col of filteredColumns\"\n class=\"u-overflow-visible\">\n <div (mouseover)=\"showTooltip($event)\" *ngIf=\"!valueTemplate\" class=\"p-table-tbody-content\" title>\n {{col.translatable ? (rowData | propertyValue: col.field | translate) : (rowData | propertyValue: col.field)}}\n </div>\n <ng-container\n *ngTemplateOutlet=\"valueTemplate; context: {$implicit: { data: rowData, col: col}}\"></ng-container>\n </td>\n </tr>\n </ng-template>\n\n <ng-template *ngIf=\"toolbar\" pTemplate=\"caption\">\n\n <div class=\"o-grid o-grid_no-gutter\">\n <div class=\"c-tree-table__toolbar-content u-display-inline-flex\">\n <div *ngIf=\"isTextSearch\" class=\"c-form c-form_inline u-display-inline-block\">\n <form class=\"c-label\">\n <div class=\"input-wrapper u-margin-right-tiny\">\n <input #searchTextInput\n (input)=\"localSearch(dt, searchText)\"\n [(ngModel)]=\"searchText\"\n [ngModelOptions]=\"{standalone: true}\"\n autofocus=\"\"\n class=\"search-box c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\n pInputText\n placeholder=\"{{('SHARED.SEARCH' | translate) + ':'}}\"\n required\n style=\"padding-right: 28px\"\n tabindex=\"1\"\n type=\"search\"\n >\n <button (click)=\"clear()\" class=\"button-reset\" type=\"reset\"\n [attr.title]=\"'Reset' | translate\">\n <i class=\"fa fa-close\"></i>\n </button>\n </div>\n </form>\n </div>\n <div class=\"c-btn c-btn_border-free c-btn_small\">\n <in-table-columns-multiselect (columnsChange)=\"columnsChange($event)\"\n [columns]=\"primaryColumns\"\n [disableActiveCheckboxes]=\"countVisibleColumns() === 1\"></in-table-columns-multiselect>\n </div>\n\n <button (click)=\"onFilterToolbar($event)\" *ngIf=\"toolbar.filter\"\n class=\"c-btn c-btn_border-free c-btn_small\"\n >\n <i class=\"fa fa-filter\" title=\"{{'Service filter' | translate}}\"></i>\n </button>\n\n <button (click)=\"addAction.emit($event)\" *ngIf=\"toolbar.add\" [disabled]=\"toolbar.add.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\"\n >\n <i class=\"fa fa-plus\" title=\"{{'Add' | translate}}\"></i>\n </button>\n\n <button (click)=\"linkAction.emit($event)\" *ngIf=\"toolbar.link\" [disabled]=\"toolbar.link.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\"\n >\n <i class=\"fa fa-link\" title=\"{{'Link' | translate}}\"></i>\n </button>\n <button (click)=\"csvAction.emit($event)\" *ngIf=\"toolbar.csv\" [disabled]=\"toolbar.csv.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\"\n >\n <i class=\"fa fa-file-csv\" title=\"{{'LOGS.SAVE_TO_SCV' | translate}}\"></i>\n </button>\n <button (click)=\"saveAction.emit($event)\" *ngIf=\"toolbar.save\"\n [disabled]=\"toolbar.save.disabled\"\n class=\"c-btn c-btn_primary c-btn_small\"\n title=\"{{'Save' | translate}}\"\n >\n {{'Save' | translate}}\n </button>\n <button (click)=\"groupEditAction.emit($event)\" *ngIf=\"toolbar.groupEdit && toolbar.groupEdit.active\"\n [disabled]=\"toolbar.groupEdit.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\">\n <i class=\"fa fa-pencil-square-o\" title=\"{{'groupEdit' | translate}}\"></i>\n </button>\n <ng-content select=\"[buttons]\"></ng-content>\n <button (click)=\"paramsEditAction.emit($event)\" *ngIf=\"toolbar.paramsEdit && toolbar.paramsEdit.active\"\n [disabled]=\"toolbar.paramsEdit.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\">\n <i class=\"fa fa-share-square-o\" title=\"{{'paramsEdit' | translate}}\"></i>\n </button>\n\n\n <button (click)=\"removeAction.emit($event)\" *ngIf=\"toolbar.remove && toolbar.remove.active\"\n [disabled]=\"toolbar.remove.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\">\n <i class=\"fa fa-trash\" title=\"{{'Delete' | translate}}\"></i>\n </button>\n <button (click)=\"unlinkAction.emit($event)\" *ngIf=\"toolbar.unlink\" [disabled]=\"toolbar.unlink.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\">\n <i class=\"fa fa-unlink\" title=\"{{'Detach tag from selected items' | translate}}\"></i>\n </button>\n <button (click)=\"toggleNodes(true)\"\n *ngIf=\"toolbar.expandAll\"\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\n title=\"{{'Expand all' | translate}}\">\n <svg fill=\"currentColor\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M20 2H4v2h16V2zM4 20v2h16v-2H4zM12 5l5 6H7l5-6zM17 13l-5 6-5-6h10z\"/>\n </svg>\n </button>\n <button (click)=\"toggleNodes(false)\"\n *ngIf=\"toolbar.expandAll\"\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\n title=\"{{'Collapse all' | translate}}\">\n <svg fill=\"currentColor\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path clip-rule=\"evenodd\" d=\"M17 3l-5 6-5-6h10zM4 13v-2h16v2H4zm8 2l5 6H7l5-6z\" fill-rule=\"evenodd\"/>\n </svg>\n </button>\n\n <div *ngIf=\"toolbar.groupSort\"\n class=\"c-btn-group\"\n container=\"body\"\n ngbDropdown>\n\n <button class=\"c-btn c-btn_border-free c-btn_small\"\n id=\"dropdownGroupType\"\n ngbDropdownToggle\n title=\"{{'Change the way parameters are grouped' | translate}}\">\n <i aria-hidden=\"true\" class=\"fa fa-object-group\"></i>\n <i aria-hidden=\"true\" class=\"c-caret\"></i>\n </button>\n\n <ul aria-labelledby=\"dropdownGroupType\"\n class=\"c-dropdown-menu c-dropdown-menu_right ng-star-inserted\"\n ngbDropdownMenu\n role=\"menu\">\n <li *ngFor=\"let item of toolbar.groupSort.label\"\n [ngClass]=\"{'is-dropdown-menu__listitem_active': item.value === groupMode}\"\n class=\"c-dropdown-menu__listitem is-dropdown-menu__listitem_active\"\n ngbDropdownItem\n role=\"menuitem\">\n <a (click)=\"toggleMode(item.value)\" class=\"c-dropdown-menu__content\">\n {{item.label}}\n </a>\n </li>\n </ul>\n </div>\n </div>\n </div>\n </ng-template>\n</p-table>\n", styles: ["@charset \"UTF-8\";.u-overflow-visible{overflow:visible!important}.row_status_success{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-success, #31AC51)}.row_status_error{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-error, #F95C5D)}.row_status_warning{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-warning, #EE9946)}.row_status_critical{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-critical, #F95C5D)}.row_status_falsevalue{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-falsevalue, #85B3CB)}.row_status_disabled{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-disabled)}.row_status_none{padding-left:9px!important;border-left:4px solid transparent}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--ids-theme-btn-default-color, #FFFFFF)}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}\n"], dependencies: [{ kind: "directive", type: i0.forwardRef(function () { return i1$2.NgClass; }), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$2.NgForOf; }), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$2.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$2.NgTemplateOutlet; }), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$2.NgSwitch; }), selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$2.NgSwitchCase; }), selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i0.forwardRef(function () { return i2$3.Table; }), selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "virtualRowHeight", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i0.forwardRef(function () { return i2.PrimeTemplate; }), selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i0.forwardRef(function () { return i2$3.SortableColumn; }), selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i0.forwardRef(function () { return i2$3.SelectableRow; }), selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { kind: "directive", type: i0.forwardRef(function () { return i2$3.ResizableColumn; }), selector: "[pResizableColumn]", inputs: ["pResizableColumnDisabled"] }, { kind: "component", type: i0.forwardRef(function () { return i2$3.SortIcon; }), selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i0.forwardRef(function () { return i2$3.TableCheckbox; }), selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i0.forwardRef(function () { return i2$3.TableHeaderCheckbox; }), selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$4.ɵNgNoValidate; }), selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i0.forwardRef(function () { return i1$4.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: i0.forwardRef(function () { return i1$4.NgControlStatus; }), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(function () { return i1$4.NgControlStatusGroup; }), selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i0.forwardRef(function () { return i1$4.RequiredValidator; }), selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$4.NgModel; }), selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i0.forwardRef(function () { return i1$4.NgForm; }), selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i0.forwardRef(function () { return i5$1.Dropdown; }), selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "selectId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "overlayDirection", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i0.forwardRef(function () { return i6$1.MultiSelect; }), selector: "p-multiSelect", inputs: ["style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "label", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad"] }, { kind: "directive", type: i0.forwardRef(function () { return i7.NgbDropdown; }), selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "popperOptions", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { kind: "directive", type: i0.forwardRef(function () { return i7.NgbDropdownToggle; }), selector: "[ngbDropdownToggle]" }, { kind: "directive", type: i0.forwardRef(function () { return i7.NgbDropdownMenu; }), selector: "[ngbDropdownMenu]" }, { kind: "directive", type: i0.forwardRef(function () { return i7.NgbDropdownItem; }), selector: "[ngbDropdownItem]", inputs: ["disabled"] }, { kind: "component", type: i0.forwardRef(function () { return TableColumnsMultiselectComponent; }), selector: "in-table-columns-multiselect", inputs: ["columns", "disableActiveCheckboxes"], outputs: ["columnsChange"] }, { kind: "pipe", type: i0.forwardRef(function () { return PropertyValuePipe; }), name: "propertyValue" }, { kind: "pipe", type: i0.forwardRef(function () { return i1.TranslatePipe; }), name: "translate" }] });
|
|
1779
1779
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TableComponent, decorators: [{
|
|
1780
1780
|
type: Component,
|
|
1781
1781
|
args: [{ selector: 'in-table', entryComponents: [], providers: [
|
|
@@ -1787,7 +1787,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
1787
1787
|
useFactory: tableFactory,
|
|
1788
1788
|
deps: [TableComponent], // new function depends on your wrapper
|
|
1789
1789
|
},
|
|
1790
|
-
], template: "<span *ngIf=\"label\" class=\"c-label\">\r\n {{label}}\r\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\r\n <span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\r\n</span>\r\n<p-table #dt\r\n (onFilter) = onFilter($event)\r\n (onSort)=\"onSort()\"\r\n (onStateRestore)=\"restoreSearchText()\"\r\n (onStateSave)=\"stateSave($event)\"\r\n (sortFunction)=\"sortFunction? sortFunction.emit($event): null\"\r\n [(selection)]=\"selectionValue\"\r\n [class]=\"class\"\r\n [columns]=\"filteredColumns\"\r\n [customSort]=\"customSort\"\r\n [dataKey]=\"dataKey || 'id'\"\r\n [globalFilterFields]=\"globalFilteredColumns\"\r\n [resizableColumns]=\"resizableColumns\"\r\n [scrollHeight]=\"scrollHeight\"\r\n [scrollable]=\"scrollable\"\r\n [selectionMode]=\"selectionMode\"\r\n [sortField]=\"sortField || 'id'\"\r\n [sortOrder]=\"isAscending ? 1 : -1\"\r\n [stateKey]=\"stateKey\"\r\n [stateStorage]=\"'local'\"\r\n [style]=\"style\"\r\n [value]=\"values\"\r\n columnResizeMode=\"expand\"\r\n\r\n>\r\n\r\n <ng-template *ngIf=\"colGroupTemplate\" let-columns pTemplate=\"body\">\r\n <ng-container\r\n *ngTemplateOutlet=\"colGroupTemplate; context: {$implicit: { columns: columns}}\"></ng-container>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"!colGroupTemplate\" let-columns pTemplate=\"colgroup\">\r\n <colgroup *ngIf=\"!isMobileView\">\r\n <col *ngIf=\"checkboxSelection\" style=\"width: 44px;\">\r\n <col *ngFor=\"let col of filteredColumns; let idx = index\" [style.width]=\"calcWidth(idx, col.field, col.width)\">\r\n </colgroup>\r\n </ng-template>\r\n\r\n <ng-template let-columns pTemplate=\"header\">\r\n <ng-container *ngIf=\"showHeader\">\r\n <tr>\r\n <th *ngIf=\"checkboxSelection\" class=\"u-position-relative u-text_center\" pResizableColumn style=\"width: 44px;\">\r\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\r\n </th>\r\n <th *ngFor=\"let col of filteredColumns\" [pSortableColumn]=\"col.field\" class=\"u-position-relative\"\r\n pResizableColumn>\r\n <div class=\"p-table-thead-title\"\r\n title=\"{{col.label | translate}}\">\r\n {{col.label | translate}}\r\n </div>\r\n <p-sortIcon *ngIf=\"isSortIcon\" [field]=\"col.field\"\r\n class=\"u-position-absolute u-position-absolute-right c-sorticon\"\r\n style=\"display: flex; width: 18px; top: 0; height: 100%;\"></p-sortIcon>\r\n </th>\r\n </tr>\r\n <tr *ngIf=\"toolbar && toolbar.filter && toolbar.filter.active\">\r\n <th *ngIf=\"checkboxSelection\" class=\"u-position-relative u-text_center\" pResizableColumn\r\n style=\"width: 44px;\"></th>\r\n <th *ngFor=\"let col of columns\" [ngSwitch]=\"col.field\">\r\n <input\r\n (input)=\"dt.filter($event.target.value, col.field, 'contains')\"\r\n *ngSwitchCase=\"colFilter(col.field).type === 'text' ? col.field : ''\"\r\n autofocus=\"\"\r\n class=\"c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\r\n pInputText\r\n type=\"text\">\r\n\r\n <p-dropdown (onChange)=\"dt.filter($event.value, col.field, 'equals')\"\r\n *ngSwitchCase=\"colFilter(col.field).type === 'dropdown' ? col.field : ''\"\r\n [options]=\"colFilter(col.field).options\"\r\n [style]=\"{ width: '100%', overflow: 'visible' }\"\r\n appendTo=\"body\"></p-dropdown>\r\n\r\n <p-multiSelect (onChange)=\"dt.filter($event.value, col.field, 'in')\"\r\n *ngSwitchCase=\"colFilter(col.field).type === 'multiselect' ? col.field : ''\"\r\n [options]=\"colFilter(col.field).options\"\r\n [style]=\"{ width: '100%', overflow: 'visible' }\" appendTo=\"body\"\r\n defaultLabel=\"{{'All' | translate}}\"></p-multiSelect>\r\n <input\r\n (input)=\"dt.filter($event.target.value, col.field + '2filter', 'contains')\"\r\n *ngSwitchCase=\"colFilter(col.field).type === 'datetext' ? col.field : ''\"\r\n autofocus=\"\"\r\n class=\"c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\r\n pInputText\r\n type=\"text\">\r\n </th>\r\n </tr>\r\n </ng-container>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"bodyTemplate\" let-columns=\"columns\" let-rowData let-rowIndex=\"rowIndex\" pTemplate=\"body\">\r\n <ng-container\r\n *ngTemplateOutlet=\"bodyTemplate; context: {$implicit: { rowIndex: rowIndex, rowData: rowData, columns: columns}}\"></ng-container>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"!bodyTemplate\" let-columns=\"columns\" let-index=\"rowIndex\" let-rowData pTemplate=\"body\">\r\n <tr\r\n (click)=\"toggleGroup(index, rowData.groupKey[groupMode])\"\r\n *ngIf=\"isGrouped && isShowGroup(rowData.groupKey[groupMode], index)\"\r\n class=\"row_hover_highlight\">\r\n <td [colSpan]=\"countVisibleColumns() + 1\">\r\n <span>\r\n <i\r\n [ngClass]=\"groupInfo[rowData.groupKey[groupMode]].isExpanded ? 'fa fa-fw fa-angle-down' : 'fa fa-fw fa-angle-right'\"></i>\r\n <span>{{rowData.groupKey[groupMode] | translate }} ({{countGroup(rowData.groupKey[groupMode], groupMode)}}\r\n )</span>\r\n </span>\r\n </td>\r\n </tr>\r\n <tr *ngIf=\"!isGrouped || groupInfo[(rowData.groupKey[groupMode])].isExpanded\"\r\n [ngClass]=\"{row_active: isRowActive(rowData)}\"\r\n [pSelectableRow]=\"rowData\"\r\n class=\"row\">\r\n <td *ngIf=\"checkboxSelection\" [ngClass]=\"{\r\n 'row_status_success': rowData.sdirparamstatecolor === 'success',\r\n 'row_status_error': rowData.sdirparamstatecolor === 'error',\r\n 'row_status_warning': rowData.sdirparamstatecolor === 'warning',\r\n 'row_status_critical': rowData.sdirparamstatecolor === 'critical',\r\n 'row_status_falsevalue': rowData.sdirparamstatecolor === 'falsevalue'\r\n }\" class=\"u-text_center\"\r\n style=\"width: 44px\"\r\n >\r\n <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\r\n </td>\r\n <td (click)=\"activeChange.emit(rowData)\"\r\n *ngFor=\"let col of filteredColumns\"\r\n class=\"u-overflow-visible\">\r\n <div (mouseover)=\"showTooltip($event)\" *ngIf=\"!valueTemplate\" class=\"p-table-tbody-content\" title>\r\n {{col.translatable ? (rowData | propertyValue: col.field | translate) : (rowData | propertyValue: col.field)}}\r\n </div>\r\n <ng-container\r\n *ngTemplateOutlet=\"valueTemplate; context: {$implicit: { data: rowData, col: col}}\"></ng-container>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"toolbar\" pTemplate=\"caption\">\r\n\r\n <div class=\"o-grid o-grid_no-gutter\">\r\n <div class=\"c-tree-table__toolbar-content u-display-inline-flex\">\r\n <div *ngIf=\"isTextSearch\" class=\"c-form c-form_inline u-display-inline-block\">\r\n <form class=\"c-label\">\r\n <div class=\"input-wrapper u-margin-right-tiny\">\r\n <input #searchTextInput\r\n (input)=\"localSearch(dt, searchText)\"\r\n [(ngModel)]=\"searchText\"\r\n [ngModelOptions]=\"{standalone: true}\"\r\n autofocus=\"\"\r\n class=\"search-box c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\r\n pInputText\r\n placeholder=\"{{('SHARED.SEARCH' | translate) + ':'}}\"\r\n required\r\n style=\"padding-right: 28px\"\r\n tabindex=\"1\"\r\n type=\"search\"\r\n >\r\n <button (click)=\"clear()\" class=\"button-reset\" type=\"reset\"\r\n [attr.title]=\"'Reset' | translate\">\r\n <i class=\"fa fa-close\"></i>\r\n </button>\r\n </div>\r\n </form>\r\n </div>\r\n <div class=\"c-btn c-btn_border-free c-btn_small\">\r\n <in-table-columns-multiselect (columnsChange)=\"columnsChange($event)\"\r\n [columns]=\"primaryColumns\"\r\n [disableActiveCheckboxes]=\"countVisibleColumns() === 1\"></in-table-columns-multiselect>\r\n </div>\r\n\r\n <button (click)=\"onFilterToolbar($event)\" *ngIf=\"toolbar.filter\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"fa fa-filter\" title=\"{{'Service filter' | translate}}\"></i>\r\n </button>\r\n\r\n <button (click)=\"addAction.emit($event)\" *ngIf=\"toolbar.add\" [disabled]=\"toolbar.add.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"fa fa-plus\" title=\"{{'Add' | translate}}\"></i>\r\n </button>\r\n\r\n <button (click)=\"linkAction.emit($event)\" *ngIf=\"toolbar.link\" [disabled]=\"toolbar.link.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"fa fa-link\" title=\"{{'Link' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"csvAction.emit($event)\" *ngIf=\"toolbar.csv\" [disabled]=\"toolbar.csv.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"fa fa-file-csv\" title=\"{{'LOGS.SAVE_TO_SCV' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"saveAction.emit($event)\" *ngIf=\"toolbar.save\"\r\n [disabled]=\"toolbar.save.disabled\"\r\n class=\"c-btn c-btn_primary c-btn_small\"\r\n title=\"{{'Save' | translate}}\"\r\n >\r\n {{'Save' | translate}}\r\n </button>\r\n <button (click)=\"groupEditAction.emit($event)\" *ngIf=\"toolbar.groupEdit && toolbar.groupEdit.active\"\r\n [disabled]=\"toolbar.groupEdit.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"fa fa-pencil-square-o\" title=\"{{'groupEdit' | translate}}\"></i>\r\n </button>\r\n <ng-content select=\"[buttons]\"></ng-content>\r\n <button (click)=\"paramsEditAction.emit($event)\" *ngIf=\"toolbar.paramsEdit && toolbar.paramsEdit.active\"\r\n [disabled]=\"toolbar.paramsEdit.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"fa fa-share-square-o\" title=\"{{'paramsEdit' | translate}}\"></i>\r\n </button>\r\n\r\n\r\n <button (click)=\"removeAction.emit($event)\" *ngIf=\"toolbar.remove && toolbar.remove.active\"\r\n [disabled]=\"toolbar.remove.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"fa fa-trash\" title=\"{{'Delete' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"unlinkAction.emit($event)\" *ngIf=\"toolbar.unlink\" [disabled]=\"toolbar.unlink.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"fa fa-unlink\" title=\"{{'Detach tag from selected items' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"toggleNodes(true)\"\r\n *ngIf=\"toolbar.expandAll\"\r\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\r\n title=\"{{'Expand all' | translate}}\">\r\n <svg fill=\"currentColor\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M20 2H4v2h16V2zM4 20v2h16v-2H4zM12 5l5 6H7l5-6zM17 13l-5 6-5-6h10z\"/>\r\n </svg>\r\n </button>\r\n <button (click)=\"toggleNodes(false)\"\r\n *ngIf=\"toolbar.expandAll\"\r\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\r\n title=\"{{'Collapse all' | translate}}\">\r\n <svg fill=\"currentColor\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path clip-rule=\"evenodd\" d=\"M17 3l-5 6-5-6h10zM4 13v-2h16v2H4zm8 2l5 6H7l5-6z\" fill-rule=\"evenodd\"/>\r\n </svg>\r\n </button>\r\n\r\n <div *ngIf=\"toolbar.groupSort\"\r\n class=\"c-btn-group\"\r\n container=\"body\"\r\n ngbDropdown>\r\n\r\n <button class=\"c-btn c-btn_border-free c-btn_small\"\r\n id=\"dropdownGroupType\"\r\n ngbDropdownToggle\r\n title=\"{{'Change the way parameters are grouped' | translate}}\">\r\n <i aria-hidden=\"true\" class=\"fa fa-object-group\"></i>\r\n <i aria-hidden=\"true\" class=\"c-caret\"></i>\r\n </button>\r\n\r\n <ul aria-labelledby=\"dropdownGroupType\"\r\n class=\"c-dropdown-menu c-dropdown-menu_right ng-star-inserted\"\r\n ngbDropdownMenu\r\n role=\"menu\">\r\n <li *ngFor=\"let item of toolbar.groupSort.label\"\r\n [ngClass]=\"{'is-dropdown-menu__listitem_active': item.value === groupMode}\"\r\n class=\"c-dropdown-menu__listitem is-dropdown-menu__listitem_active\"\r\n ngbDropdownItem\r\n role=\"menuitem\">\r\n <a (click)=\"toggleMode(item.value)\" class=\"c-dropdown-menu__content\">\r\n {{item.label}}\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n</p-table>\r\n", styles: ["@charset \"UTF-8\";.u-overflow-visible{overflow:visible!important}.row_status_success{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-success, #31AC51)}.row_status_error{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-error, #F95C5D)}.row_status_warning{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-warning, #EE9946)}.row_status_critical{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-critical, #F95C5D)}.row_status_falsevalue{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-falsevalue, #85B3CB)}.row_status_disabled{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-disabled)}.row_status_none{padding-left:9px!important;border-left:4px solid transparent}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--ids-theme-btn-default-color, #FFFFFF)}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}\n"] }]
|
|
1790
|
+
], template: "<span *ngIf=\"label\" class=\"c-label\">\n {{label}}\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n <span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\n</span>\n<p-table #dt\n (onFilter) = onFilter($event)\n (onSort)=\"onSort()\"\n (onStateRestore)=\"restoreSearchText()\"\n (onStateSave)=\"stateSave($event)\"\n (sortFunction)=\"sortFunction? sortFunction.emit($event): null\"\n [(selection)]=\"selectionValue\"\n [class]=\"class\"\n [columns]=\"filteredColumns\"\n [customSort]=\"customSort\"\n [dataKey]=\"dataKey || 'id'\"\n [globalFilterFields]=\"globalFilteredColumns\"\n [resizableColumns]=\"resizableColumns\"\n [scrollHeight]=\"scrollHeight\"\n [scrollable]=\"scrollable\"\n [selectionMode]=\"selectionMode\"\n [sortField]=\"sortField || 'id'\"\n [sortOrder]=\"isAscending ? 1 : -1\"\n [stateKey]=\"stateKey\"\n [stateStorage]=\"'local'\"\n [style]=\"style\"\n [value]=\"values\"\n columnResizeMode=\"expand\"\n\n>\n\n <ng-template *ngIf=\"colGroupTemplate\" let-columns pTemplate=\"body\">\n <ng-container\n *ngTemplateOutlet=\"colGroupTemplate; context: {$implicit: { columns: columns}}\"></ng-container>\n </ng-template>\n\n <ng-template *ngIf=\"!colGroupTemplate\" let-columns pTemplate=\"colgroup\">\n <colgroup *ngIf=\"!isMobileView\">\n <col *ngIf=\"checkboxSelection\" style=\"width: 44px;\">\n <col *ngFor=\"let col of filteredColumns; let idx = index\" [style.width]=\"calcWidth(idx, col.field, col.width)\">\n </colgroup>\n </ng-template>\n\n <ng-template let-columns pTemplate=\"header\">\n <ng-container *ngIf=\"showHeader\">\n <tr>\n <th *ngIf=\"checkboxSelection\" class=\"u-position-relative u-text_center\" pResizableColumn style=\"width: 44px;\">\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n </th>\n <th *ngFor=\"let col of filteredColumns\" [pSortableColumn]=\"col.field\" class=\"u-position-relative\"\n pResizableColumn>\n <div class=\"p-table-thead-title\"\n title=\"{{col.label | translate}}\">\n {{col.label | translate}}\n </div>\n <p-sortIcon *ngIf=\"isSortIcon\" [field]=\"col.field\"\n class=\"u-position-absolute u-position-absolute-right c-sorticon\"\n style=\"display: flex; width: 18px; top: 0; height: 100%;\"></p-sortIcon>\n </th>\n </tr>\n <tr *ngIf=\"toolbar && toolbar.filter && toolbar.filter.active\">\n <th *ngIf=\"checkboxSelection\" class=\"u-position-relative u-text_center\" pResizableColumn\n style=\"width: 44px;\"></th>\n <th *ngFor=\"let col of columns\" [ngSwitch]=\"col.field\">\n <input\n (input)=\"dt.filter($event.target.value, col.field, 'contains')\"\n *ngSwitchCase=\"colFilter(col.field).type === 'text' ? col.field : ''\"\n autofocus=\"\"\n class=\"c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\n pInputText\n type=\"text\">\n\n <p-dropdown (onChange)=\"dt.filter($event.value, col.field, 'equals')\"\n *ngSwitchCase=\"colFilter(col.field).type === 'dropdown' ? col.field : ''\"\n [options]=\"colFilter(col.field).options\"\n [style]=\"{ width: '100%', overflow: 'visible' }\"\n appendTo=\"body\"></p-dropdown>\n\n <p-multiSelect (onChange)=\"dt.filter($event.value, col.field, 'in')\"\n *ngSwitchCase=\"colFilter(col.field).type === 'multiselect' ? col.field : ''\"\n [options]=\"colFilter(col.field).options\"\n [style]=\"{ width: '100%', overflow: 'visible' }\" appendTo=\"body\"\n defaultLabel=\"{{'All' | translate}}\"></p-multiSelect>\n <input\n (input)=\"dt.filter($event.target.value, col.field + '2filter', 'contains')\"\n *ngSwitchCase=\"colFilter(col.field).type === 'datetext' ? col.field : ''\"\n autofocus=\"\"\n class=\"c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\n pInputText\n type=\"text\">\n </th>\n </tr>\n </ng-container>\n </ng-template>\n\n <ng-template *ngIf=\"bodyTemplate\" let-columns=\"columns\" let-rowData let-rowIndex=\"rowIndex\" pTemplate=\"body\">\n <ng-container\n *ngTemplateOutlet=\"bodyTemplate; context: {$implicit: { rowIndex: rowIndex, rowData: rowData, columns: columns}}\"></ng-container>\n </ng-template>\n\n <ng-template *ngIf=\"!bodyTemplate\" let-columns=\"columns\" let-index=\"rowIndex\" let-rowData pTemplate=\"body\">\n <tr\n (click)=\"toggleGroup(index, rowData.groupKey[groupMode])\"\n *ngIf=\"isGrouped && isShowGroup(rowData.groupKey[groupMode], index)\"\n class=\"row_hover_highlight\">\n <td [colSpan]=\"countVisibleColumns() + 1\">\n <span>\n <i\n [ngClass]=\"groupInfo[rowData.groupKey[groupMode]].isExpanded ? 'fa fa-fw fa-angle-down' : 'fa fa-fw fa-angle-right'\"></i>\n <span>{{rowData.groupKey[groupMode] | translate }} ({{countGroup(rowData.groupKey[groupMode], groupMode)}}\n )</span>\n </span>\n </td>\n </tr>\n <tr *ngIf=\"!isGrouped || groupInfo[(rowData.groupKey[groupMode])].isExpanded\"\n [ngClass]=\"{row_active: isRowActive(rowData)}\"\n [pSelectableRow]=\"rowData\"\n class=\"row\">\n <td *ngIf=\"checkboxSelection\" [ngClass]=\"{\n 'row_status_success': rowData.sdirparamstatecolor === 'success',\n 'row_status_error': rowData.sdirparamstatecolor === 'error',\n 'row_status_warning': rowData.sdirparamstatecolor === 'warning',\n 'row_status_critical': rowData.sdirparamstatecolor === 'critical',\n 'row_status_falsevalue': rowData.sdirparamstatecolor === 'falsevalue'\n }\" class=\"u-text_center\"\n style=\"width: 44px\"\n >\n <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\n </td>\n <td (click)=\"activeChange.emit(rowData)\"\n *ngFor=\"let col of filteredColumns\"\n class=\"u-overflow-visible\">\n <div (mouseover)=\"showTooltip($event)\" *ngIf=\"!valueTemplate\" class=\"p-table-tbody-content\" title>\n {{col.translatable ? (rowData | propertyValue: col.field | translate) : (rowData | propertyValue: col.field)}}\n </div>\n <ng-container\n *ngTemplateOutlet=\"valueTemplate; context: {$implicit: { data: rowData, col: col}}\"></ng-container>\n </td>\n </tr>\n </ng-template>\n\n <ng-template *ngIf=\"toolbar\" pTemplate=\"caption\">\n\n <div class=\"o-grid o-grid_no-gutter\">\n <div class=\"c-tree-table__toolbar-content u-display-inline-flex\">\n <div *ngIf=\"isTextSearch\" class=\"c-form c-form_inline u-display-inline-block\">\n <form class=\"c-label\">\n <div class=\"input-wrapper u-margin-right-tiny\">\n <input #searchTextInput\n (input)=\"localSearch(dt, searchText)\"\n [(ngModel)]=\"searchText\"\n [ngModelOptions]=\"{standalone: true}\"\n autofocus=\"\"\n class=\"search-box c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\n pInputText\n placeholder=\"{{('SHARED.SEARCH' | translate) + ':'}}\"\n required\n style=\"padding-right: 28px\"\n tabindex=\"1\"\n type=\"search\"\n >\n <button (click)=\"clear()\" class=\"button-reset\" type=\"reset\"\n [attr.title]=\"'Reset' | translate\">\n <i class=\"fa fa-close\"></i>\n </button>\n </div>\n </form>\n </div>\n <div class=\"c-btn c-btn_border-free c-btn_small\">\n <in-table-columns-multiselect (columnsChange)=\"columnsChange($event)\"\n [columns]=\"primaryColumns\"\n [disableActiveCheckboxes]=\"countVisibleColumns() === 1\"></in-table-columns-multiselect>\n </div>\n\n <button (click)=\"onFilterToolbar($event)\" *ngIf=\"toolbar.filter\"\n class=\"c-btn c-btn_border-free c-btn_small\"\n >\n <i class=\"fa fa-filter\" title=\"{{'Service filter' | translate}}\"></i>\n </button>\n\n <button (click)=\"addAction.emit($event)\" *ngIf=\"toolbar.add\" [disabled]=\"toolbar.add.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\"\n >\n <i class=\"fa fa-plus\" title=\"{{'Add' | translate}}\"></i>\n </button>\n\n <button (click)=\"linkAction.emit($event)\" *ngIf=\"toolbar.link\" [disabled]=\"toolbar.link.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\"\n >\n <i class=\"fa fa-link\" title=\"{{'Link' | translate}}\"></i>\n </button>\n <button (click)=\"csvAction.emit($event)\" *ngIf=\"toolbar.csv\" [disabled]=\"toolbar.csv.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\"\n >\n <i class=\"fa fa-file-csv\" title=\"{{'LOGS.SAVE_TO_SCV' | translate}}\"></i>\n </button>\n <button (click)=\"saveAction.emit($event)\" *ngIf=\"toolbar.save\"\n [disabled]=\"toolbar.save.disabled\"\n class=\"c-btn c-btn_primary c-btn_small\"\n title=\"{{'Save' | translate}}\"\n >\n {{'Save' | translate}}\n </button>\n <button (click)=\"groupEditAction.emit($event)\" *ngIf=\"toolbar.groupEdit && toolbar.groupEdit.active\"\n [disabled]=\"toolbar.groupEdit.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\">\n <i class=\"fa fa-pencil-square-o\" title=\"{{'groupEdit' | translate}}\"></i>\n </button>\n <ng-content select=\"[buttons]\"></ng-content>\n <button (click)=\"paramsEditAction.emit($event)\" *ngIf=\"toolbar.paramsEdit && toolbar.paramsEdit.active\"\n [disabled]=\"toolbar.paramsEdit.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\">\n <i class=\"fa fa-share-square-o\" title=\"{{'paramsEdit' | translate}}\"></i>\n </button>\n\n\n <button (click)=\"removeAction.emit($event)\" *ngIf=\"toolbar.remove && toolbar.remove.active\"\n [disabled]=\"toolbar.remove.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\">\n <i class=\"fa fa-trash\" title=\"{{'Delete' | translate}}\"></i>\n </button>\n <button (click)=\"unlinkAction.emit($event)\" *ngIf=\"toolbar.unlink\" [disabled]=\"toolbar.unlink.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\">\n <i class=\"fa fa-unlink\" title=\"{{'Detach tag from selected items' | translate}}\"></i>\n </button>\n <button (click)=\"toggleNodes(true)\"\n *ngIf=\"toolbar.expandAll\"\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\n title=\"{{'Expand all' | translate}}\">\n <svg fill=\"currentColor\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M20 2H4v2h16V2zM4 20v2h16v-2H4zM12 5l5 6H7l5-6zM17 13l-5 6-5-6h10z\"/>\n </svg>\n </button>\n <button (click)=\"toggleNodes(false)\"\n *ngIf=\"toolbar.expandAll\"\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\n title=\"{{'Collapse all' | translate}}\">\n <svg fill=\"currentColor\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path clip-rule=\"evenodd\" d=\"M17 3l-5 6-5-6h10zM4 13v-2h16v2H4zm8 2l5 6H7l5-6z\" fill-rule=\"evenodd\"/>\n </svg>\n </button>\n\n <div *ngIf=\"toolbar.groupSort\"\n class=\"c-btn-group\"\n container=\"body\"\n ngbDropdown>\n\n <button class=\"c-btn c-btn_border-free c-btn_small\"\n id=\"dropdownGroupType\"\n ngbDropdownToggle\n title=\"{{'Change the way parameters are grouped' | translate}}\">\n <i aria-hidden=\"true\" class=\"fa fa-object-group\"></i>\n <i aria-hidden=\"true\" class=\"c-caret\"></i>\n </button>\n\n <ul aria-labelledby=\"dropdownGroupType\"\n class=\"c-dropdown-menu c-dropdown-menu_right ng-star-inserted\"\n ngbDropdownMenu\n role=\"menu\">\n <li *ngFor=\"let item of toolbar.groupSort.label\"\n [ngClass]=\"{'is-dropdown-menu__listitem_active': item.value === groupMode}\"\n class=\"c-dropdown-menu__listitem is-dropdown-menu__listitem_active\"\n ngbDropdownItem\n role=\"menuitem\">\n <a (click)=\"toggleMode(item.value)\" class=\"c-dropdown-menu__content\">\n {{item.label}}\n </a>\n </li>\n </ul>\n </div>\n </div>\n </div>\n </ng-template>\n</p-table>\n", styles: ["@charset \"UTF-8\";.u-overflow-visible{overflow:visible!important}.row_status_success{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-success, #31AC51)}.row_status_error{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-error, #F95C5D)}.row_status_warning{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-warning, #EE9946)}.row_status_critical{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-critical, #F95C5D)}.row_status_falsevalue{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-falsevalue, #85B3CB)}.row_status_disabled{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-disabled)}.row_status_none{padding-left:9px!important;border-left:4px solid transparent}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--ids-theme-btn-default-color, #FFFFFF)}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}\n"] }]
|
|
1791
1791
|
}], propDecorators: { columns: [{
|
|
1792
1792
|
type: Input
|
|
1793
1793
|
}], values: [{
|
|
@@ -1992,10 +1992,10 @@ class ToolbarComponent {
|
|
|
1992
1992
|
}
|
|
1993
1993
|
}
|
|
1994
1994
|
ToolbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ToolbarComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$3.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
1995
|
-
ToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ToolbarComponent, selector: "in-toolbar", inputs: { title: "title" }, ngImport: i0, template: "<div class=\"toolbar-wrapper\">\n <in-sticky top=\"60\">\n\n <div class=\"c-panel toolbar-container\">\n <div class=\"c-toolbar\">\n <div class=\"c-toolbar__side-left\">\n <div class=\"c-toolbar__title\">{{title}}</div>\n </div>\n <div class=\"c-toolbar__side-center\">\n\n </div>\n <div class=\"c-toolbar__side-right\">\n <ng-content></ng-content>\n </div>\n\n </div>\n </div>\n </in-sticky>\n</div>\n", styles: [".toolbar-wrapper{padding-bottom:4px}.toolbar-container{padding:8px;position:relative}:host{position:sticky;z-index:2}.c-toolbar{display:inline-flex;width:100
|
|
1995
|
+
ToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ToolbarComponent, selector: "in-toolbar", inputs: { title: "title" }, ngImport: i0, template: "<div class=\"toolbar-wrapper\">\n <in-sticky top=\"60\">\n\n <div class=\"c-panel toolbar-container\">\n <div class=\"c-toolbar\">\n <div class=\"c-toolbar__side-left\">\n <div class=\"c-toolbar__title\">{{title}}</div>\n </div>\n <div class=\"c-toolbar__side-center\">\n\n </div>\n <div class=\"c-toolbar__side-right\">\n <ng-content></ng-content>\n </div>\n\n </div>\n </div>\n </in-sticky>\n</div>\n", styles: [".toolbar-wrapper{padding-bottom:4px}.toolbar-container{padding:8px;position:relative}:host{position:sticky;z-index:2}.c-toolbar{display:inline-flex;width:100%;flex-wrap:wrap}.c-toolbar__side-left{flex:100%;text-align:left}@media screen and (min-width: 1200px){.c-toolbar__side-left{flex:1}}.c-toolbar__title{display:inline-flex;vertical-align:middle;font-size:22px}.c-toolbar__side-right{display:flex;text-align:right}.add-widget{position:fixed;right:16px;bottom:16px}.widget-container{position:absolute;inset:40px 0 0;overflow:auto}.widget-block{position:absolute;inset:5px}.sidebar{background:var(--main-background);position:absolute;left:0;top:35px;bottom:0;height:100vh;z-index:100;width:300px;box-shadow:0 0 3px 8px #0000001a;overflow:auto}.right-side{display:flex;align-items:center;justify-content:flex-end;flex:1}.right-side>*{margin-left:5px}.left-side{white-space:nowrap;display:flex;align-items:center;justify-content:flex-start}.left-side>*{margin-right:5px}.controls-panel{height:41px;border-radius:2px;padding:4px 0;margin:0 5px 5px;display:flex}.dashboard-list{position:relative}.title{font-size:22px}\n"], dependencies: [{ kind: "component", type: InsparkStickyComponent, selector: "in-sticky", inputs: ["top", "isInline", "isFloated", "zIndex", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1996
1996
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ToolbarComponent, decorators: [{
|
|
1997
1997
|
type: Component,
|
|
1998
|
-
args: [{ selector: 'in-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, entryComponents: [], template: "<div class=\"toolbar-wrapper\">\n <in-sticky top=\"60\">\n\n <div class=\"c-panel toolbar-container\">\n <div class=\"c-toolbar\">\n <div class=\"c-toolbar__side-left\">\n <div class=\"c-toolbar__title\">{{title}}</div>\n </div>\n <div class=\"c-toolbar__side-center\">\n\n </div>\n <div class=\"c-toolbar__side-right\">\n <ng-content></ng-content>\n </div>\n\n </div>\n </div>\n </in-sticky>\n</div>\n", styles: [".toolbar-wrapper{padding-bottom:4px}.toolbar-container{padding:8px;position:relative}:host{position:sticky;z-index:2}.c-toolbar{display:inline-flex;width:100
|
|
1998
|
+
args: [{ selector: 'in-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, entryComponents: [], template: "<div class=\"toolbar-wrapper\">\n <in-sticky top=\"60\">\n\n <div class=\"c-panel toolbar-container\">\n <div class=\"c-toolbar\">\n <div class=\"c-toolbar__side-left\">\n <div class=\"c-toolbar__title\">{{title}}</div>\n </div>\n <div class=\"c-toolbar__side-center\">\n\n </div>\n <div class=\"c-toolbar__side-right\">\n <ng-content></ng-content>\n </div>\n\n </div>\n </div>\n </in-sticky>\n</div>\n", styles: [".toolbar-wrapper{padding-bottom:4px}.toolbar-container{padding:8px;position:relative}:host{position:sticky;z-index:2}.c-toolbar{display:inline-flex;width:100%;flex-wrap:wrap}.c-toolbar__side-left{flex:100%;text-align:left}@media screen and (min-width: 1200px){.c-toolbar__side-left{flex:1}}.c-toolbar__title{display:inline-flex;vertical-align:middle;font-size:22px}.c-toolbar__side-right{display:flex;text-align:right}.add-widget{position:fixed;right:16px;bottom:16px}.widget-container{position:absolute;inset:40px 0 0;overflow:auto}.widget-block{position:absolute;inset:5px}.sidebar{background:var(--main-background);position:absolute;left:0;top:35px;bottom:0;height:100vh;z-index:100;width:300px;box-shadow:0 0 3px 8px #0000001a;overflow:auto}.right-side{display:flex;align-items:center;justify-content:flex-end;flex:1}.right-side>*{margin-left:5px}.left-side{white-space:nowrap;display:flex;align-items:center;justify-content:flex-start}.left-side>*{margin-right:5px}.controls-panel{height:41px;border-radius:2px;padding:4px 0;margin:0 5px 5px;display:flex}.dashboard-list{position:relative}.title{font-size:22px}\n"] }]
|
|
1999
1999
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$3.Router }]; }, propDecorators: { title: [{
|
|
2000
2000
|
type: Input
|
|
2001
2001
|
}] } });
|
|
@@ -2448,10 +2448,10 @@ class LinkComponent {
|
|
|
2448
2448
|
}
|
|
2449
2449
|
}
|
|
2450
2450
|
LinkComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2451
|
-
LinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: LinkComponent, selector: "in-link", inputs: { color: "color", name: "name", testId: "testId", label: "label", icon: "icon", className: "className", svg: "svg", link: "link", linkType: "linkType", linkTarget: "linkTarget", pressed: "pressed", disabled: "disabled", iconPos: "iconPos", menuItems: "menuItems" }, outputs: { focus: "focus", blur: "blur", click: "click" }, viewQueries: [{ propertyName: "_menu", first: true, predicate: Menu, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<a (blur)=\"blur.emit($event)\"\
|
|
2451
|
+
LinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: LinkComponent, selector: "in-link", inputs: { color: "color", name: "name", testId: "testId", label: "label", icon: "icon", className: "className", svg: "svg", link: "link", linkType: "linkType", linkTarget: "linkTarget", pressed: "pressed", disabled: "disabled", iconPos: "iconPos", menuItems: "menuItems" }, outputs: { focus: "focus", blur: "blur", click: "click" }, viewQueries: [{ propertyName: "_menu", first: true, predicate: Menu, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<a (blur)=\"blur.emit($event)\"\n (focus)=\"focus.emit($event)\"\n *ngIf=\"link &&_linkType ==='external'\"\n [class]=\"className\"\n [href]=\"link\"\n [ngClass]=\"{'p-link p-state-default p-corner-all p-link-transparency':true,\n 'p-link-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'p-link-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'p-link-text-only': (!(icon || svg) && label),\n 'p-link-text-empty': (!(icon || svg) && !label),\n 'p-link-svg': svg,\n 'p-link-material': isMaterialIcon,\n 'p-state-disabled': disabled,\n 'p-link-primary': color === 'primary',\n 'p-link-secondary': color === 'secondary',\n 'p-link-danger': color === 'danger'}\"\n [style]=\"style\" [target]=\"_target\">\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\n</a>\n<a (blur)=\"blur.emit($event)\"\n (focus)=\"focus.emit($event)\"\n *ngIf=\"link && _linkType ==='internal'\"\n [class]=\"className\"\n [ngClass]=\"{'p-link p-state-default p-corner-all p-link-transparency':true,\n 'p-link-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'p-link-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'p-link-text-only': (!(icon || svg) && label),\n 'p-link-text-empty': (!(icon || svg) && !label),\n 'p-link-svg': svg,\n 'p-link-material': isMaterialIcon,\n 'p-state-disabled': disabled,\n 'p-link-primary': color === 'primary',\n 'p-link-secondary': color === 'secondary',\n 'p-link-danger': color === 'danger'}\"\n [routerLink]=\"link\"\n [style]=\"style\" [target]=\"_target\">\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\n</a>\n<span (blur)=\"blur.emit($event)\"\n (click)=\"_onClick($event)\"\n (focus)=\"focus.emit($event)\"\n *ngIf=\"!link\"\n [class]=\"className\"\n [ngClass]=\"{'p-link p-state-default p-corner-all p-link-transparency':true,\n 'p-link-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'p-link-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'p-link-text-only': (!(icon || svg) && label),\n 'p-link-text-empty': (!(icon || svg) && !label),\n 'p-link-svg': svg,\n 'p-link-material': isMaterialIcon,\n 'p-state-disabled': disabled,\n 'p-link-primary': color === 'primary',\n 'p-link-secondary': color === 'secondary',\n 'p-link-danger': color === 'danger'}\" [style]=\"style\">\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\n</span>\n<p-menu *ngIf=\"menuItems.length\" [model]=\"menuItems\" [popup]=\"true\" appendTo=\"body\" styleClass=\"button-menu\"></p-menu>\n\n<ng-template #content>\n <span *ngIf=\"!isMaterialIcon && icon\" [class]=\"icon\"\n [ngClass]=\"{'p-clickable': true,\n 'p-link-icon-left': (iconPos === 'left'),\n 'p-link-icon-right': (iconPos === 'right')}\"></span>\n <span *ngIf=\"isMaterialIcon && icon\" [ngClass]=\"{'p-clickable': true,\n 'p-link-icon-left': (iconPos === 'left'),\n 'p-link-icon-right': (iconPos === 'right')}\"\n ><i class=\"material-icons\">{{icon}}</i></span>\n <span *ngIf=\"svg\" [ngClass]=\"{'p-clickable': true,\n 'p-link-icon-left': (iconPos === 'left'),\n 'p-link-icon-right': (iconPos === 'right')}\">\n <in-svg [src]=\"svg\" height=\"20px\" width=\"20px\"></in-svg>\n </span>\n <span class=\"p-link-text p-clickable\">{{label}}</span>\n\n</ng-template>\n", styles: [".p-link{text-decoration:none;color:var(--colorLink);cursor:pointer}.p-link.p-link-secondary{color:var(--colorTextSecondary)}.p-link:hover{color:var(--colorLink)}.p-link:hover .p-link-text{text-decoration:underline;color:var(--colorLink)}button{outline:none}.p-link-icon-only .p-link-icon-left{margin-top:-9px}.p-link-text{vertical-align:middle}.p-link{margin-right:0;display:inline-flex;align-items:center;justify-content:center}.p-link-text-icon-left .p-link-text{padding-left:.6em}.p-link-icon-only{font-size:18px;display:inline-flex;align-items:center;justify-content:center}.p-link-icon-only .svg{display:inline-block;line-height:0}.p-link-transparency{background:none}.p-link.p-link-svg .p-clickable{height:20px}.p-link.p-link-svg .p-link-icon-left{left:6px;margin-top:-2px}.p-link.p-link-svg.p-link-icon-only .p-link-icon-left{left:50%;width:auto;transform:translate(-50%,-50%);margin-left:0;margin-top:0}.p-link-material .material-icons{font-size:16px}:host .p-menu .p-menuitem-link{font-size:16px}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$4.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "directive", type: i1$3.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: SvgComponent, selector: "in-svg", inputs: ["size", "width", "height", "src"] }] });
|
|
2452
2452
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LinkComponent, decorators: [{
|
|
2453
2453
|
type: Component,
|
|
2454
|
-
args: [{ selector: 'in-link', template: "<a (blur)=\"blur.emit($event)\"\
|
|
2454
|
+
args: [{ selector: 'in-link', template: "<a (blur)=\"blur.emit($event)\"\n (focus)=\"focus.emit($event)\"\n *ngIf=\"link &&_linkType ==='external'\"\n [class]=\"className\"\n [href]=\"link\"\n [ngClass]=\"{'p-link p-state-default p-corner-all p-link-transparency':true,\n 'p-link-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'p-link-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'p-link-text-only': (!(icon || svg) && label),\n 'p-link-text-empty': (!(icon || svg) && !label),\n 'p-link-svg': svg,\n 'p-link-material': isMaterialIcon,\n 'p-state-disabled': disabled,\n 'p-link-primary': color === 'primary',\n 'p-link-secondary': color === 'secondary',\n 'p-link-danger': color === 'danger'}\"\n [style]=\"style\" [target]=\"_target\">\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\n</a>\n<a (blur)=\"blur.emit($event)\"\n (focus)=\"focus.emit($event)\"\n *ngIf=\"link && _linkType ==='internal'\"\n [class]=\"className\"\n [ngClass]=\"{'p-link p-state-default p-corner-all p-link-transparency':true,\n 'p-link-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'p-link-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'p-link-text-only': (!(icon || svg) && label),\n 'p-link-text-empty': (!(icon || svg) && !label),\n 'p-link-svg': svg,\n 'p-link-material': isMaterialIcon,\n 'p-state-disabled': disabled,\n 'p-link-primary': color === 'primary',\n 'p-link-secondary': color === 'secondary',\n 'p-link-danger': color === 'danger'}\"\n [routerLink]=\"link\"\n [style]=\"style\" [target]=\"_target\">\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\n</a>\n<span (blur)=\"blur.emit($event)\"\n (click)=\"_onClick($event)\"\n (focus)=\"focus.emit($event)\"\n *ngIf=\"!link\"\n [class]=\"className\"\n [ngClass]=\"{'p-link p-state-default p-corner-all p-link-transparency':true,\n 'p-link-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'p-link-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'p-link-text-only': (!(icon || svg) && label),\n 'p-link-text-empty': (!(icon || svg) && !label),\n 'p-link-svg': svg,\n 'p-link-material': isMaterialIcon,\n 'p-state-disabled': disabled,\n 'p-link-primary': color === 'primary',\n 'p-link-secondary': color === 'secondary',\n 'p-link-danger': color === 'danger'}\" [style]=\"style\">\n <ng-container *ngTemplateOutlet=\"content;\"></ng-container>\n</span>\n<p-menu *ngIf=\"menuItems.length\" [model]=\"menuItems\" [popup]=\"true\" appendTo=\"body\" styleClass=\"button-menu\"></p-menu>\n\n<ng-template #content>\n <span *ngIf=\"!isMaterialIcon && icon\" [class]=\"icon\"\n [ngClass]=\"{'p-clickable': true,\n 'p-link-icon-left': (iconPos === 'left'),\n 'p-link-icon-right': (iconPos === 'right')}\"></span>\n <span *ngIf=\"isMaterialIcon && icon\" [ngClass]=\"{'p-clickable': true,\n 'p-link-icon-left': (iconPos === 'left'),\n 'p-link-icon-right': (iconPos === 'right')}\"\n ><i class=\"material-icons\">{{icon}}</i></span>\n <span *ngIf=\"svg\" [ngClass]=\"{'p-clickable': true,\n 'p-link-icon-left': (iconPos === 'left'),\n 'p-link-icon-right': (iconPos === 'right')}\">\n <in-svg [src]=\"svg\" height=\"20px\" width=\"20px\"></in-svg>\n </span>\n <span class=\"p-link-text p-clickable\">{{label}}</span>\n\n</ng-template>\n", styles: [".p-link{text-decoration:none;color:var(--colorLink);cursor:pointer}.p-link.p-link-secondary{color:var(--colorTextSecondary)}.p-link:hover{color:var(--colorLink)}.p-link:hover .p-link-text{text-decoration:underline;color:var(--colorLink)}button{outline:none}.p-link-icon-only .p-link-icon-left{margin-top:-9px}.p-link-text{vertical-align:middle}.p-link{margin-right:0;display:inline-flex;align-items:center;justify-content:center}.p-link-text-icon-left .p-link-text{padding-left:.6em}.p-link-icon-only{font-size:18px;display:inline-flex;align-items:center;justify-content:center}.p-link-icon-only .svg{display:inline-block;line-height:0}.p-link-transparency{background:none}.p-link.p-link-svg .p-clickable{height:20px}.p-link.p-link-svg .p-link-icon-left{left:6px;margin-top:-2px}.p-link.p-link-svg.p-link-icon-only .p-link-icon-left{left:50%;width:auto;transform:translate(-50%,-50%);margin-left:0;margin-top:0}.p-link-material .material-icons{font-size:16px}:host .p-menu .p-menuitem-link{font-size:16px}\n"] }]
|
|
2455
2455
|
}], propDecorators: { color: [{
|
|
2456
2456
|
type: Input
|
|
2457
2457
|
}], name: [{
|
|
@@ -2617,10 +2617,10 @@ class TreeTableComponent {
|
|
|
2617
2617
|
}
|
|
2618
2618
|
}
|
|
2619
2619
|
TreeTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TreeTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2620
|
-
TreeTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TreeTableComponent, selector: "in-tree-table", inputs: { columns: "columns", values: "values", scrollHeight: "scrollHeight", scrollable: "scrollable", selectionMode: "selectionMode", label: "label", error: "error", class: "class", required: "required", style: "style", toolbar: "toolbar", checkboxSelection: "checkboxSelection", active: "active", sortField: "sortField", isAscending: "isAscending", dataKey: "dataKey", selection: "selection" }, outputs: { activeChange: "activeChange", selectionChange: "selectionChange", addAction: "addAction", csvAction: "csvAction", saveAction: "saveAction", collapseAction: "collapseAction", removeAction: "removeAction", unlinkAction: "unlinkAction", groupEditAction: "groupEditAction", groupAddAction: "groupAddAction" }, queries: [{ propertyName: "templates", predicate: InsparkTemplate }], ngImport: i0, template: "<p-treeTable #dt\r\n [(selection)]=\"selectionValue\"\r\n [class]=\"class\"\r\n [columns]=\"visibleColumns()\"\r\n [resizableColumns]=\"true\"\r\n [scrollHeight]=\"scrollHeight\"\r\n [scrollable]=\"scrollable\"\r\n [selectionMode]=\"selectionMode\"\r\n [sortField]=\"sortField || 'id'\"\r\n [sortOrder]=\"isAscending ? 1 : -1\"\r\n [style]=\"style\"\r\n [value]=\"values\"\r\n columnResizeMode=\"expand\"\r\n>\r\n <ng-template let-columns pTemplate=\"colgroup\">\r\n <colgroup>\r\n <col *ngIf=\"checkboxSelection\" style=\"width:44px;\">\r\n <col *ngFor=\"let col of visibleColumns()\" [style.width]=\"col.width ? col.width : '10px'\">\r\n </colgroup>\r\n </ng-template>\r\n <ng-template let-columns pTemplate=\"header\">\r\n <tr>\r\n <th *ngIf=\"checkboxSelection\">\r\n <p-treeTableHeaderCheckbox></p-treeTableHeaderCheckbox>\r\n </th>\r\n <th *ngFor=\"let col of columns; let i = index\" [ttSortableColumn]=\"col.field\" class=\"u-position-relative\"\r\n ttResizableColumn>\r\n <div class=\"p-treetable-thead-title\" title=\"{{col.label | translate}}\">\r\n {{col.label | translate}}\r\n </div>\r\n <p-treeTableSortIcon [field]=\"col.field\" class=\"p-sortable-column-buttons\"></p-treeTableSortIcon>\r\n </th>\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template let-columns=\"columns\" let-rowData=\"rowData\" let-rowNode pTemplate=\"body\">\r\n <tr [ngClass]=\"{row_active: isRowActive(rowData)}\" [ttSelectableRow]=\"rowNode\" class=\"row\">\r\n <td *ngIf=\"checkboxSelection\">\r\n <p-treeTableCheckbox [value]=\"rowNode\"></p-treeTableCheckbox>\r\n </td>\r\n <td (click)=\"activeChange.emit(rowData)\" *ngFor=\"let col of columns; let i = index\"\r\n class=\"_u-overflow-visible\">\r\n <div class=\"\" style=\"display: flex; flex-wrap: nowrap;\">\r\n <ng-template [ngIf]=\"i == 0\">\r\n <p-treeTableToggler [rowNode]=\"rowNode\" style=\"align-self: center;\"></p-treeTableToggler>\r\n </ng-template>\r\n <div [ngClass]=\"{ 'p-treetable-tbody-content_has-toggler ': i == 0 }\"\r\n class=\"p-treetable-tbody-content cell-content_hover\"\r\n style=\"flex-grow: 1;\"\r\n title=\"{{rowData | propertyValue: col.field}}\">\r\n <ng-container *ngIf=\"!valueTemplate\">\r\n <i *ngIf=\"rowData.icon && i == 0\" [ngClass]=\"rowData.icon\" class=\"u-margin-right-tiny\"></i>\r\n {{rowData | propertyValue: col.field}}\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngTemplateOutlet=\"valueTemplate; context: {$implicit: { data: rowData, col: col}}\"></ng-container>\r\n </div>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"toolbar\" pTemplate=\"caption\">\r\n\r\n <div class=\"o-grid o-grid_no-gutter\">\r\n <div class=\"c-tree-table__toolbar-content u-display-inline-flex\">\r\n <div class=\"c-form c-form_inline u-display-inline-block\">\r\n <form class=\"c-label\">\r\n <div class=\"input-wrapper u-margin-right-tiny\">\r\n <input #searchTextInput\r\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\r\n [(ngModel)]=\"searchText\"\r\n [ngModelOptions]=\"{standalone: true}\"\r\n autofocus=\"\"\r\n class=\"search-box c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\r\n pInputText\r\n placeholder=\"{{('SHARED.SEARCH' | translate) + ':'}}\"\r\n required\r\n style=\"padding-right: 28px\"\r\n tabindex=\"1\"\r\n type=\"search\"\r\n >\r\n <button (click)=\"dt.filterGlobal($event.target.value, 'contains')\" class=\"button-reset\" type=\"reset\"\r\n [attr.title]=\"'Reset' | translate\">\r\n <i class=\"fa fa-close\"></i>\r\n </button>\r\n </div>\r\n </form>\r\n </div>\r\n <div class=\"c-btn c-btn_border-free c-btn_small\">\r\n <in-table-columns-multiselect (columnsChange)=\"columnsChange($event)\"\r\n [columns]=\"columns\"></in-table-columns-multiselect>\r\n </div>\r\n\r\n <button (click)=\"addAction.emit($event)\" *ngIf=\"toolbar.add\" [disabled]=\"toolbar.add.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"fa fa-plus\" [title]=\"toolbar.add.title || '\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C'\"></i>\r\n </button>\r\n\r\n <button (click)=\"groupAddAction.emit($event)\" *ngIf=\"toolbar.groupAdd\" [disabled]=\"toolbar.groupAdd.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"fa fa-folder\" [title]=\"toolbar.groupAdd.title || '\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0433\u0440\u0443\u043F\u043F\u0443'\"></i>\r\n </button>\r\n\r\n\r\n <button (click)=\"saveAction.emit($event)\" *ngIf=\"toolbar.save\"\r\n [disabled]=\"toolbar.save.disabled\"\r\n class=\"c-btn c-btn_primary c-btn_small\"\r\n title=\"{{'Save' | translate}}\"\r\n >\r\n {{'Save' | translate}}\r\n </button>\r\n <button (click)=\"groupEditAction.emit($event)\" *ngIf=\"toolbar.groupEdit && toolbar.groupEdit.active\"\r\n [disabled]=\"toolbar.groupEdit.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"fa fa-pencil-square-o\" title=\"{{'groupEdit' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"removeAction.emit($event)\" *ngIf=\"toolbar.remove && toolbar.remove.active\"\r\n [disabled]=\"toolbar.remove.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"fa fa-trash\" [title]=\"toolbar.remove?.title || '\u0423\u0434\u0430\u043B\u0438\u0442\u044C'\"></i>\r\n </button>\r\n <button (click)=\"unlinkAction.emit($event)\" *ngIf=\"toolbar.unlink\" [disabled]=\"toolbar.unlink.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"fa fa-unlink\" title=\"{{'Detach tag from selected items' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"csvAction.emit($event)\" *ngIf=\"toolbar.csv\" [disabled]=\"toolbar.csv.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"fas fa-file-csv\" title=\"\u0421\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u044C \u043A\u0430\u043A CSV\"></i>\r\n </button>\r\n <button *ngIf=\"toolbar.collapse\"\r\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\r\n (click)=\"collapse($event, dt)\"\r\n title=\"{{(isCollapse ? 'Expand all' : 'Collapse all') | translate}}\">\r\n <svg *ngIf=\"isCollapse\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path d=\"M20 2H4v2h16V2zM4 20v2h16v-2H4zM12 5l5 6H7l5-6zM17 13l-5 6-5-6h10z\"/>\r\n </svg>\r\n <svg *ngIf=\"!isCollapse\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path fill-rule=\"evenodd\" d=\"M17 3l-5 6-5-6h10zM4 13v-2h16v2H4zm8 2l5 6H7l5-6z\" clip-rule=\"evenodd\"/>\r\n </svg>\r\n </button>\r\n </div>\r\n </div>\r\n </ng-template>\r\n</p-treeTable>\r\n", styles: ["@charset \"UTF-8\";.p-sortable-column{cursor:pointer;position:relative}.p-sortable-column-buttons{position:absolute;top:0;right:0;width:18px;height:100%;display:inline-flex;align-items:center;z-index:10000}.p-sortable-column-buttons>a{position:absolute;top:50%;right:0;left:0;transform:translateY(-50%)}.u-overflow-visible{overflow:visible!important}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--colorIcon)}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$5.TreeTable, selector: "p-treeTable", inputs: ["columns", "style", "styleClass", "tableStyle", "tableStyleClass", "autoLayout", "lazy", "lazyLoadOnInit", "paginator", "rows", "first", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "customSort", "selectionMode", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "compareSelectionBy", "rowHover", "loading", "loadingIcon", "showLoader", "scrollable", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "frozenColumns", "resizableColumns", "columnResizeMode", "reorderableColumns", "contextMenu", "rowTrackBy", "filters", "globalFilterFields", "filterDelay", "filterMode", "filterLocale", "virtualRowHeight", "value", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection"], outputs: ["selectionChange", "contextMenuSelectionChange", "onFilter", "onNodeExpand", "onNodeCollapse", "onPage", "onSort", "onLazyLoad", "sortFunction", "onColResize", "onColReorder", "onNodeSelect", "onNodeUnselect", "onContextMenuSelect", "onHeaderCheckboxToggle", "onEditInit", "onEditComplete", "onEditCancel"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i2$5.TreeTableToggler, selector: "p-treeTableToggler", inputs: ["rowNode"] }, { kind: "directive", type: i2$5.TTSortableColumn, selector: "[ttSortableColumn]", inputs: ["ttSortableColumn", "ttSortableColumnDisabled"] }, { kind: "component", type: i2$5.TTSortIcon, selector: "p-treeTableSortIcon", inputs: ["field", "ariaLabelDesc", "ariaLabelAsc"] }, { kind: "directive", type: i2$5.TTResizableColumn, selector: "[ttResizableColumn]", inputs: ["ttResizableColumnDisabled"] }, { kind: "directive", type: i2$5.TTSelectableRow, selector: "[ttSelectableRow]", inputs: ["ttSelectableRow", "ttSelectableRowDisabled"] }, { kind: "component", type: i2$5.TTCheckbox, selector: "p-treeTableCheckbox", inputs: ["disabled", "value"] }, { kind: "component", type: i2$5.TTHeaderCheckbox, selector: "p-treeTableHeaderCheckbox" }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$4.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: TableColumnsMultiselectComponent, selector: "in-table-columns-multiselect", inputs: ["columns", "disableActiveCheckboxes"], outputs: ["columnsChange"] }, { kind: "pipe", type: PropertyValuePipe, name: "propertyValue" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
|
|
2620
|
+
TreeTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TreeTableComponent, selector: "in-tree-table", inputs: { columns: "columns", values: "values", scrollHeight: "scrollHeight", scrollable: "scrollable", selectionMode: "selectionMode", label: "label", error: "error", class: "class", required: "required", style: "style", toolbar: "toolbar", checkboxSelection: "checkboxSelection", active: "active", sortField: "sortField", isAscending: "isAscending", dataKey: "dataKey", selection: "selection" }, outputs: { activeChange: "activeChange", selectionChange: "selectionChange", addAction: "addAction", csvAction: "csvAction", saveAction: "saveAction", collapseAction: "collapseAction", removeAction: "removeAction", unlinkAction: "unlinkAction", groupEditAction: "groupEditAction", groupAddAction: "groupAddAction" }, queries: [{ propertyName: "templates", predicate: InsparkTemplate }], ngImport: i0, template: "<p-treeTable #dt\n [(selection)]=\"selectionValue\"\n [class]=\"class\"\n [columns]=\"visibleColumns()\"\n [resizableColumns]=\"true\"\n [scrollHeight]=\"scrollHeight\"\n [scrollable]=\"scrollable\"\n [selectionMode]=\"selectionMode\"\n [sortField]=\"sortField || 'id'\"\n [sortOrder]=\"isAscending ? 1 : -1\"\n [style]=\"style\"\n [value]=\"values\"\n columnResizeMode=\"expand\"\n>\n <ng-template let-columns pTemplate=\"colgroup\">\n <colgroup>\n <col *ngIf=\"checkboxSelection\" style=\"width:44px;\">\n <col *ngFor=\"let col of visibleColumns()\" [style.width]=\"col.width ? col.width : '10px'\">\n </colgroup>\n </ng-template>\n <ng-template let-columns pTemplate=\"header\">\n <tr>\n <th *ngIf=\"checkboxSelection\">\n <p-treeTableHeaderCheckbox></p-treeTableHeaderCheckbox>\n </th>\n <th *ngFor=\"let col of columns; let i = index\" [ttSortableColumn]=\"col.field\" class=\"u-position-relative\"\n ttResizableColumn>\n <div class=\"p-treetable-thead-title\" title=\"{{col.label | translate}}\">\n {{col.label | translate}}\n </div>\n <p-treeTableSortIcon [field]=\"col.field\" class=\"p-sortable-column-buttons\"></p-treeTableSortIcon>\n </th>\n </tr>\n </ng-template>\n\n <ng-template let-columns=\"columns\" let-rowData=\"rowData\" let-rowNode pTemplate=\"body\">\n <tr [ngClass]=\"{row_active: isRowActive(rowData)}\" [ttSelectableRow]=\"rowNode\" class=\"row\">\n <td *ngIf=\"checkboxSelection\">\n <p-treeTableCheckbox [value]=\"rowNode\"></p-treeTableCheckbox>\n </td>\n <td (click)=\"activeChange.emit(rowData)\" *ngFor=\"let col of columns; let i = index\"\n class=\"_u-overflow-visible\">\n <div class=\"\" style=\"display: flex; flex-wrap: nowrap;\">\n <ng-template [ngIf]=\"i == 0\">\n <p-treeTableToggler [rowNode]=\"rowNode\" style=\"align-self: center;\"></p-treeTableToggler>\n </ng-template>\n <div [ngClass]=\"{ 'p-treetable-tbody-content_has-toggler ': i == 0 }\"\n class=\"p-treetable-tbody-content cell-content_hover\"\n style=\"flex-grow: 1;\"\n title=\"{{rowData | propertyValue: col.field}}\">\n <ng-container *ngIf=\"!valueTemplate\">\n <i *ngIf=\"rowData.icon && i == 0\" [ngClass]=\"rowData.icon\" class=\"u-margin-right-tiny\"></i>\n {{rowData | propertyValue: col.field}}\n </ng-container>\n\n <ng-container\n *ngTemplateOutlet=\"valueTemplate; context: {$implicit: { data: rowData, col: col}}\"></ng-container>\n </div>\n </div>\n </td>\n </tr>\n </ng-template>\n\n <ng-template *ngIf=\"toolbar\" pTemplate=\"caption\">\n\n <div class=\"o-grid o-grid_no-gutter\">\n <div class=\"c-tree-table__toolbar-content u-display-inline-flex\">\n <div class=\"c-form c-form_inline u-display-inline-block\">\n <form class=\"c-label\">\n <div class=\"input-wrapper u-margin-right-tiny\">\n <input #searchTextInput\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n [(ngModel)]=\"searchText\"\n [ngModelOptions]=\"{standalone: true}\"\n autofocus=\"\"\n class=\"search-box c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\n pInputText\n placeholder=\"{{('SHARED.SEARCH' | translate) + ':'}}\"\n required\n style=\"padding-right: 28px\"\n tabindex=\"1\"\n type=\"search\"\n >\n <button (click)=\"dt.filterGlobal($event.target.value, 'contains')\" class=\"button-reset\" type=\"reset\"\n [attr.title]=\"'Reset' | translate\">\n <i class=\"fa fa-close\"></i>\n </button>\n </div>\n </form>\n </div>\n <div class=\"c-btn c-btn_border-free c-btn_small\">\n <in-table-columns-multiselect (columnsChange)=\"columnsChange($event)\"\n [columns]=\"columns\"></in-table-columns-multiselect>\n </div>\n\n <button (click)=\"addAction.emit($event)\" *ngIf=\"toolbar.add\" [disabled]=\"toolbar.add.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\"\n >\n <i class=\"fa fa-plus\" [title]=\"toolbar.add.title || '\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C'\"></i>\n </button>\n\n <button (click)=\"groupAddAction.emit($event)\" *ngIf=\"toolbar.groupAdd\" [disabled]=\"toolbar.groupAdd.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\"\n >\n <i class=\"fa fa-folder\" [title]=\"toolbar.groupAdd.title || '\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0433\u0440\u0443\u043F\u043F\u0443'\"></i>\n </button>\n\n\n <button (click)=\"saveAction.emit($event)\" *ngIf=\"toolbar.save\"\n [disabled]=\"toolbar.save.disabled\"\n class=\"c-btn c-btn_primary c-btn_small\"\n title=\"{{'Save' | translate}}\"\n >\n {{'Save' | translate}}\n </button>\n <button (click)=\"groupEditAction.emit($event)\" *ngIf=\"toolbar.groupEdit && toolbar.groupEdit.active\"\n [disabled]=\"toolbar.groupEdit.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\">\n <i class=\"fa fa-pencil-square-o\" title=\"{{'groupEdit' | translate}}\"></i>\n </button>\n <button (click)=\"removeAction.emit($event)\" *ngIf=\"toolbar.remove && toolbar.remove.active\"\n [disabled]=\"toolbar.remove.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\">\n <i class=\"fa fa-trash\" [title]=\"toolbar.remove?.title || '\u0423\u0434\u0430\u043B\u0438\u0442\u044C'\"></i>\n </button>\n <button (click)=\"unlinkAction.emit($event)\" *ngIf=\"toolbar.unlink\" [disabled]=\"toolbar.unlink.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\">\n <i class=\"fa fa-unlink\" title=\"{{'Detach tag from selected items' | translate}}\"></i>\n </button>\n <button (click)=\"csvAction.emit($event)\" *ngIf=\"toolbar.csv\" [disabled]=\"toolbar.csv.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\"\n >\n <i class=\"fas fa-file-csv\" title=\"\u0421\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u044C \u043A\u0430\u043A CSV\"></i>\n </button>\n <button *ngIf=\"toolbar.collapse\"\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\n (click)=\"collapse($event, dt)\"\n title=\"{{(isCollapse ? 'Expand all' : 'Collapse all') | translate}}\">\n <svg *ngIf=\"isCollapse\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M20 2H4v2h16V2zM4 20v2h16v-2H4zM12 5l5 6H7l5-6zM17 13l-5 6-5-6h10z\"/>\n </svg>\n <svg *ngIf=\"!isCollapse\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path fill-rule=\"evenodd\" d=\"M17 3l-5 6-5-6h10zM4 13v-2h16v2H4zm8 2l5 6H7l5-6z\" clip-rule=\"evenodd\"/>\n </svg>\n </button>\n </div>\n </div>\n </ng-template>\n</p-treeTable>\n", styles: ["@charset \"UTF-8\";.p-sortable-column{cursor:pointer;position:relative}.p-sortable-column-buttons{position:absolute;top:0;right:0;width:18px;height:100%;display:inline-flex;align-items:center;z-index:10000}.p-sortable-column-buttons>a{position:absolute;top:50%;right:0;left:0;transform:translateY(-50%)}.u-overflow-visible{overflow:visible!important}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--colorIcon)}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$5.TreeTable, selector: "p-treeTable", inputs: ["columns", "style", "styleClass", "tableStyle", "tableStyleClass", "autoLayout", "lazy", "lazyLoadOnInit", "paginator", "rows", "first", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "customSort", "selectionMode", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "compareSelectionBy", "rowHover", "loading", "loadingIcon", "showLoader", "scrollable", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "frozenColumns", "resizableColumns", "columnResizeMode", "reorderableColumns", "contextMenu", "rowTrackBy", "filters", "globalFilterFields", "filterDelay", "filterMode", "filterLocale", "virtualRowHeight", "value", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection"], outputs: ["selectionChange", "contextMenuSelectionChange", "onFilter", "onNodeExpand", "onNodeCollapse", "onPage", "onSort", "onLazyLoad", "sortFunction", "onColResize", "onColReorder", "onNodeSelect", "onNodeUnselect", "onContextMenuSelect", "onHeaderCheckboxToggle", "onEditInit", "onEditComplete", "onEditCancel"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i2$5.TreeTableToggler, selector: "p-treeTableToggler", inputs: ["rowNode"] }, { kind: "directive", type: i2$5.TTSortableColumn, selector: "[ttSortableColumn]", inputs: ["ttSortableColumn", "ttSortableColumnDisabled"] }, { kind: "component", type: i2$5.TTSortIcon, selector: "p-treeTableSortIcon", inputs: ["field", "ariaLabelDesc", "ariaLabelAsc"] }, { kind: "directive", type: i2$5.TTResizableColumn, selector: "[ttResizableColumn]", inputs: ["ttResizableColumnDisabled"] }, { kind: "directive", type: i2$5.TTSelectableRow, selector: "[ttSelectableRow]", inputs: ["ttSelectableRow", "ttSelectableRowDisabled"] }, { kind: "component", type: i2$5.TTCheckbox, selector: "p-treeTableCheckbox", inputs: ["disabled", "value"] }, { kind: "component", type: i2$5.TTHeaderCheckbox, selector: "p-treeTableHeaderCheckbox" }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$4.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: TableColumnsMultiselectComponent, selector: "in-table-columns-multiselect", inputs: ["columns", "disableActiveCheckboxes"], outputs: ["columnsChange"] }, { kind: "pipe", type: PropertyValuePipe, name: "propertyValue" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
|
|
2621
2621
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TreeTableComponent, decorators: [{
|
|
2622
2622
|
type: Component,
|
|
2623
|
-
args: [{ selector: 'in-tree-table', entryComponents: [], template: "<p-treeTable #dt\
|
|
2623
|
+
args: [{ selector: 'in-tree-table', entryComponents: [], template: "<p-treeTable #dt\n [(selection)]=\"selectionValue\"\n [class]=\"class\"\n [columns]=\"visibleColumns()\"\n [resizableColumns]=\"true\"\n [scrollHeight]=\"scrollHeight\"\n [scrollable]=\"scrollable\"\n [selectionMode]=\"selectionMode\"\n [sortField]=\"sortField || 'id'\"\n [sortOrder]=\"isAscending ? 1 : -1\"\n [style]=\"style\"\n [value]=\"values\"\n columnResizeMode=\"expand\"\n>\n <ng-template let-columns pTemplate=\"colgroup\">\n <colgroup>\n <col *ngIf=\"checkboxSelection\" style=\"width:44px;\">\n <col *ngFor=\"let col of visibleColumns()\" [style.width]=\"col.width ? col.width : '10px'\">\n </colgroup>\n </ng-template>\n <ng-template let-columns pTemplate=\"header\">\n <tr>\n <th *ngIf=\"checkboxSelection\">\n <p-treeTableHeaderCheckbox></p-treeTableHeaderCheckbox>\n </th>\n <th *ngFor=\"let col of columns; let i = index\" [ttSortableColumn]=\"col.field\" class=\"u-position-relative\"\n ttResizableColumn>\n <div class=\"p-treetable-thead-title\" title=\"{{col.label | translate}}\">\n {{col.label | translate}}\n </div>\n <p-treeTableSortIcon [field]=\"col.field\" class=\"p-sortable-column-buttons\"></p-treeTableSortIcon>\n </th>\n </tr>\n </ng-template>\n\n <ng-template let-columns=\"columns\" let-rowData=\"rowData\" let-rowNode pTemplate=\"body\">\n <tr [ngClass]=\"{row_active: isRowActive(rowData)}\" [ttSelectableRow]=\"rowNode\" class=\"row\">\n <td *ngIf=\"checkboxSelection\">\n <p-treeTableCheckbox [value]=\"rowNode\"></p-treeTableCheckbox>\n </td>\n <td (click)=\"activeChange.emit(rowData)\" *ngFor=\"let col of columns; let i = index\"\n class=\"_u-overflow-visible\">\n <div class=\"\" style=\"display: flex; flex-wrap: nowrap;\">\n <ng-template [ngIf]=\"i == 0\">\n <p-treeTableToggler [rowNode]=\"rowNode\" style=\"align-self: center;\"></p-treeTableToggler>\n </ng-template>\n <div [ngClass]=\"{ 'p-treetable-tbody-content_has-toggler ': i == 0 }\"\n class=\"p-treetable-tbody-content cell-content_hover\"\n style=\"flex-grow: 1;\"\n title=\"{{rowData | propertyValue: col.field}}\">\n <ng-container *ngIf=\"!valueTemplate\">\n <i *ngIf=\"rowData.icon && i == 0\" [ngClass]=\"rowData.icon\" class=\"u-margin-right-tiny\"></i>\n {{rowData | propertyValue: col.field}}\n </ng-container>\n\n <ng-container\n *ngTemplateOutlet=\"valueTemplate; context: {$implicit: { data: rowData, col: col}}\"></ng-container>\n </div>\n </div>\n </td>\n </tr>\n </ng-template>\n\n <ng-template *ngIf=\"toolbar\" pTemplate=\"caption\">\n\n <div class=\"o-grid o-grid_no-gutter\">\n <div class=\"c-tree-table__toolbar-content u-display-inline-flex\">\n <div class=\"c-form c-form_inline u-display-inline-block\">\n <form class=\"c-label\">\n <div class=\"input-wrapper u-margin-right-tiny\">\n <input #searchTextInput\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n [(ngModel)]=\"searchText\"\n [ngModelOptions]=\"{standalone: true}\"\n autofocus=\"\"\n class=\"search-box c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\n pInputText\n placeholder=\"{{('SHARED.SEARCH' | translate) + ':'}}\"\n required\n style=\"padding-right: 28px\"\n tabindex=\"1\"\n type=\"search\"\n >\n <button (click)=\"dt.filterGlobal($event.target.value, 'contains')\" class=\"button-reset\" type=\"reset\"\n [attr.title]=\"'Reset' | translate\">\n <i class=\"fa fa-close\"></i>\n </button>\n </div>\n </form>\n </div>\n <div class=\"c-btn c-btn_border-free c-btn_small\">\n <in-table-columns-multiselect (columnsChange)=\"columnsChange($event)\"\n [columns]=\"columns\"></in-table-columns-multiselect>\n </div>\n\n <button (click)=\"addAction.emit($event)\" *ngIf=\"toolbar.add\" [disabled]=\"toolbar.add.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\"\n >\n <i class=\"fa fa-plus\" [title]=\"toolbar.add.title || '\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C'\"></i>\n </button>\n\n <button (click)=\"groupAddAction.emit($event)\" *ngIf=\"toolbar.groupAdd\" [disabled]=\"toolbar.groupAdd.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\"\n >\n <i class=\"fa fa-folder\" [title]=\"toolbar.groupAdd.title || '\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0433\u0440\u0443\u043F\u043F\u0443'\"></i>\n </button>\n\n\n <button (click)=\"saveAction.emit($event)\" *ngIf=\"toolbar.save\"\n [disabled]=\"toolbar.save.disabled\"\n class=\"c-btn c-btn_primary c-btn_small\"\n title=\"{{'Save' | translate}}\"\n >\n {{'Save' | translate}}\n </button>\n <button (click)=\"groupEditAction.emit($event)\" *ngIf=\"toolbar.groupEdit && toolbar.groupEdit.active\"\n [disabled]=\"toolbar.groupEdit.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\">\n <i class=\"fa fa-pencil-square-o\" title=\"{{'groupEdit' | translate}}\"></i>\n </button>\n <button (click)=\"removeAction.emit($event)\" *ngIf=\"toolbar.remove && toolbar.remove.active\"\n [disabled]=\"toolbar.remove.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\">\n <i class=\"fa fa-trash\" [title]=\"toolbar.remove?.title || '\u0423\u0434\u0430\u043B\u0438\u0442\u044C'\"></i>\n </button>\n <button (click)=\"unlinkAction.emit($event)\" *ngIf=\"toolbar.unlink\" [disabled]=\"toolbar.unlink.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\">\n <i class=\"fa fa-unlink\" title=\"{{'Detach tag from selected items' | translate}}\"></i>\n </button>\n <button (click)=\"csvAction.emit($event)\" *ngIf=\"toolbar.csv\" [disabled]=\"toolbar.csv.disabled\"\n class=\"c-btn c-btn_border-free c-btn_small\"\n >\n <i class=\"fas fa-file-csv\" title=\"\u0421\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u044C \u043A\u0430\u043A CSV\"></i>\n </button>\n <button *ngIf=\"toolbar.collapse\"\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\n (click)=\"collapse($event, dt)\"\n title=\"{{(isCollapse ? 'Expand all' : 'Collapse all') | translate}}\">\n <svg *ngIf=\"isCollapse\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M20 2H4v2h16V2zM4 20v2h16v-2H4zM12 5l5 6H7l5-6zM17 13l-5 6-5-6h10z\"/>\n </svg>\n <svg *ngIf=\"!isCollapse\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path fill-rule=\"evenodd\" d=\"M17 3l-5 6-5-6h10zM4 13v-2h16v2H4zm8 2l5 6H7l5-6z\" clip-rule=\"evenodd\"/>\n </svg>\n </button>\n </div>\n </div>\n </ng-template>\n</p-treeTable>\n", styles: ["@charset \"UTF-8\";.p-sortable-column{cursor:pointer;position:relative}.p-sortable-column-buttons{position:absolute;top:0;right:0;width:18px;height:100%;display:inline-flex;align-items:center;z-index:10000}.p-sortable-column-buttons>a{position:absolute;top:50%;right:0;left:0;transform:translateY(-50%)}.u-overflow-visible{overflow:visible!important}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--colorIcon)}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}\n"] }]
|
|
2624
2624
|
}], propDecorators: { columns: [{
|
|
2625
2625
|
type: Input
|
|
2626
2626
|
}], values: [{
|
|
@@ -2774,10 +2774,10 @@ class SelectListComponent {
|
|
|
2774
2774
|
}
|
|
2775
2775
|
}
|
|
2776
2776
|
SelectListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectListComponent, deps: [{ token: i1$5.DynamicDialogRef }, { token: i1$5.DynamicDialogConfig }, { token: InsparkMessageService }, { token: i1$3.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
2777
|
-
SelectListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectListComponent, selector: "app-select-list", ngImport: i0, template: "<div class=\"c-panel__heading-title h4\">\
|
|
2777
|
+
SelectListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectListComponent, selector: "app-select-list", ngImport: i0, template: "<div class=\"c-panel__heading-title h4\">\n {{'Select objects for which to execute the command' | translate}}\n</div>\n<span *ngIf=\"isShowSpinner\"><ng-container *ngTemplateOutlet=\"spinner\"></ng-container></span>\n<div class=\"container\">\n <div class=\"c-form-group type_treeblock\">\n <div style=\"overflow: hidden; width: 100%; white-space: nowrap; display: inline-flex;\" *ngFor=\"let item of options; let i = index\">\n <span class=\"c-label c-label__content\" style=\"width: 100px; min-height: 30px;\">{{item.value}}</span>\n <input class=\"c-checkbox__input\" type=\"checkbox\" [checked]=\"options[i].checked\" >\n <i class=\"p-chkbox-box c-checkbox__icon\" (click)=\"select(i)\"></i>\n </div>\n\n </div>\n <div class=\"buttons\">\n <in-component-container>\n <in-button id=\"close\" (click)=\"closeModal()\"\n label=\"{{'Cancel' | translate}}\"></in-button>\n <in-button id=\"edit\" (click)=\"applySelection()\" type=\"submit\"\n label=\"{{'Apply' | translate}}\"\n color=\"primary\" [disabled]=\"\" [title]=\"'Select an action' | translate\"></in-button>\n </in-component-container>\n </div>\n</div>\n\n<ng-template #spinner><span class=\"c-spinner\">\n <i class=\"fa fa-circle-o-notch fa-spin \"></i>\n</span></ng-template>\n", styles: [".buttons{text-align:right}.buttons p-button{margin-left:8px}.container{padding:12px}:host ::ng-deep .c-select_block{position:relative;left:10px;width:30%}:host ::ng-deep .c-input_small{width:50%}:host ::ng-deep .my-tree{width:100%;display:inline-block;position:relative}:host ::ng-deep .my-tree .c-inputtext{width:500px}\n"], dependencies: [{ kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "in-button", inputs: ["size", "color", "type", "name", "testId", "label", "icon", "className", "notify", "svg", "width", "link", "isLoading", "shadow", "isIconOnly", "linkType", "linkTarget", "pressed", "disabled", "iconPos", "selectedItem", "menuPlacement", "menuItems"], outputs: ["focus", "blur", "click"] }, { kind: "component", type: ComponentContainerComponent, selector: "in-component-container", inputs: ["align"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
|
|
2778
2778
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectListComponent, decorators: [{
|
|
2779
2779
|
type: Component,
|
|
2780
|
-
args: [{ selector: 'app-select-list', template: "<div class=\"c-panel__heading-title h4\">\
|
|
2780
|
+
args: [{ selector: 'app-select-list', template: "<div class=\"c-panel__heading-title h4\">\n {{'Select objects for which to execute the command' | translate}}\n</div>\n<span *ngIf=\"isShowSpinner\"><ng-container *ngTemplateOutlet=\"spinner\"></ng-container></span>\n<div class=\"container\">\n <div class=\"c-form-group type_treeblock\">\n <div style=\"overflow: hidden; width: 100%; white-space: nowrap; display: inline-flex;\" *ngFor=\"let item of options; let i = index\">\n <span class=\"c-label c-label__content\" style=\"width: 100px; min-height: 30px;\">{{item.value}}</span>\n <input class=\"c-checkbox__input\" type=\"checkbox\" [checked]=\"options[i].checked\" >\n <i class=\"p-chkbox-box c-checkbox__icon\" (click)=\"select(i)\"></i>\n </div>\n\n </div>\n <div class=\"buttons\">\n <in-component-container>\n <in-button id=\"close\" (click)=\"closeModal()\"\n label=\"{{'Cancel' | translate}}\"></in-button>\n <in-button id=\"edit\" (click)=\"applySelection()\" type=\"submit\"\n label=\"{{'Apply' | translate}}\"\n color=\"primary\" [disabled]=\"\" [title]=\"'Select an action' | translate\"></in-button>\n </in-component-container>\n </div>\n</div>\n\n<ng-template #spinner><span class=\"c-spinner\">\n <i class=\"fa fa-circle-o-notch fa-spin \"></i>\n</span></ng-template>\n", styles: [".buttons{text-align:right}.buttons p-button{margin-left:8px}.container{padding:12px}:host ::ng-deep .c-select_block{position:relative;left:10px;width:30%}:host ::ng-deep .c-input_small{width:50%}:host ::ng-deep .my-tree{width:100%;display:inline-block;position:relative}:host ::ng-deep .my-tree .c-inputtext{width:500px}\n"] }]
|
|
2781
2781
|
}], ctorParameters: function () { return [{ type: i1$5.DynamicDialogRef }, { type: i1$5.DynamicDialogConfig }, { type: InsparkMessageService }, { type: i1$3.Router }]; } });
|
|
2782
2782
|
|
|
2783
2783
|
class ObjectTreeComponent {
|
|
@@ -2859,10 +2859,10 @@ class ModalInputTextComponent {
|
|
|
2859
2859
|
}
|
|
2860
2860
|
}
|
|
2861
2861
|
ModalInputTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ModalInputTextComponent, deps: [{ token: i1$5.DynamicDialogRef }, { token: i1$5.DynamicDialogConfig }, { token: i1.TranslateService }, { token: InsparkMessageService }, { token: i1$3.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
2862
|
-
ModalInputTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ModalInputTextComponent, selector: "app-modal-input-text", ngImport: i0, template: "<div class=\"c-panel__heading-title h4\">\
|
|
2862
|
+
ModalInputTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ModalInputTextComponent, selector: "app-modal-input-text", ngImport: i0, template: "<div class=\"c-panel__heading-title h4\">\n {{'Enter parameter value' | translate}}\n</div>\n<span *ngIf=\"isShowSpinner\"><ng-container *ngTemplateOutlet=\"spinner\"></ng-container></span>\n<div class=\"container\">\n <div *ngIf = this.options class=\"c-form-group type_treeblock\">\n <div *ngFor=\"let item of options; let i = index\">\n <label class=\"c-label type_bool\" style=\"overflow: hidden; width: 100%; white-space: nowrap; display: inline-flex;\">\n <span class=\"c-onecolumn-form_label__content\" [style.width]=\"maxLength + 'px'\" style=\"position: relative; top: 5px; min-height: 30px;\">\n {{item.value}}\n </span>\n <span class=\"c-onecolumn-form_label__content field_{{item.value}}\" style=\"min-height: 30px;\">\n <input class=\"c-checkbox__input field_{{item.value}}\" type=\"checkbox\" [checked]=\"options[i].checked\" (click)=\"select(i)\">\n <i class=\"p-chkbox-box c-checkbox__icon\" ></i>\n </span>\n </label>\n </div>\n </div>\n\n <div *ngIf=this.param class=\"o-grid o-grid_wrap\">\n <div class=\"o-grid__cell o-grid__cell_width-100 o-grid__cell_width-100@medium o-grid__cell_width-100@large\">\n <div class=\"c-form-group\">\n <label class=\"c-label type_varchars\">\n <span class=\"c-label__content\" style=\"width: 500px;white-space: pre-line\">{{translate(param.title)}}</span>\n <input [(ngModel)]=\"param.value\" class=\"c-input c-input_block field_{{config.data.command.label}}\" type=\"text\" maxlength=\"60\">\n </label>\n </div>\n </div>\n </div>\n <div class=\"buttons\">\n <in-component-container>\n <in-button id=\"close\" (click)=\"closeModal()\"\n label=\"{{'Cancel' | translate}}\"\n [name]=\"'Cancel'\"\n ></in-button>\n <in-button id=\"edit\" (click)=\"applySelection()\" type=\"submit\"\n label=\"{{'Apply' | translate}}\"\n [name]=\"'Apply'\"\n color=\"primary\" [disabled]=\"checkSelected()\" [title]=\"'Select an action' | translate\"></in-button>\n </in-component-container>\n </div>\n</div>\n\n<ng-template #spinner><span class=\"c-spinner\">\n <i class=\"fa fa-circle-o-notch fa-spin \"></i>\n</span></ng-template>\n", styles: [".buttons{text-align:right}.buttons p-button{margin-left:8px}.container{padding:12px}:host ::ng-deep .c-select_block{position:relative;left:10px;width:30%}:host ::ng-deep .c-input_small{width:50%}:host ::ng-deep .my-tree{width:100%;display:inline-block;position:relative}:host ::ng-deep .my-tree .c-inputtext{width:500px}\n"], dependencies: [{ kind: "directive", type: i1$4.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: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "in-button", inputs: ["size", "color", "type", "name", "testId", "label", "icon", "className", "notify", "svg", "width", "link", "isLoading", "shadow", "isIconOnly", "linkType", "linkTarget", "pressed", "disabled", "iconPos", "selectedItem", "menuPlacement", "menuItems"], outputs: ["focus", "blur", "click"] }, { kind: "component", type: ComponentContainerComponent, selector: "in-component-container", inputs: ["align"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
|
|
2863
2863
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ModalInputTextComponent, decorators: [{
|
|
2864
2864
|
type: Component,
|
|
2865
|
-
args: [{ selector: 'app-modal-input-text', template: "<div class=\"c-panel__heading-title h4\">\
|
|
2865
|
+
args: [{ selector: 'app-modal-input-text', template: "<div class=\"c-panel__heading-title h4\">\n {{'Enter parameter value' | translate}}\n</div>\n<span *ngIf=\"isShowSpinner\"><ng-container *ngTemplateOutlet=\"spinner\"></ng-container></span>\n<div class=\"container\">\n <div *ngIf = this.options class=\"c-form-group type_treeblock\">\n <div *ngFor=\"let item of options; let i = index\">\n <label class=\"c-label type_bool\" style=\"overflow: hidden; width: 100%; white-space: nowrap; display: inline-flex;\">\n <span class=\"c-onecolumn-form_label__content\" [style.width]=\"maxLength + 'px'\" style=\"position: relative; top: 5px; min-height: 30px;\">\n {{item.value}}\n </span>\n <span class=\"c-onecolumn-form_label__content field_{{item.value}}\" style=\"min-height: 30px;\">\n <input class=\"c-checkbox__input field_{{item.value}}\" type=\"checkbox\" [checked]=\"options[i].checked\" (click)=\"select(i)\">\n <i class=\"p-chkbox-box c-checkbox__icon\" ></i>\n </span>\n </label>\n </div>\n </div>\n\n <div *ngIf=this.param class=\"o-grid o-grid_wrap\">\n <div class=\"o-grid__cell o-grid__cell_width-100 o-grid__cell_width-100@medium o-grid__cell_width-100@large\">\n <div class=\"c-form-group\">\n <label class=\"c-label type_varchars\">\n <span class=\"c-label__content\" style=\"width: 500px;white-space: pre-line\">{{translate(param.title)}}</span>\n <input [(ngModel)]=\"param.value\" class=\"c-input c-input_block field_{{config.data.command.label}}\" type=\"text\" maxlength=\"60\">\n </label>\n </div>\n </div>\n </div>\n <div class=\"buttons\">\n <in-component-container>\n <in-button id=\"close\" (click)=\"closeModal()\"\n label=\"{{'Cancel' | translate}}\"\n [name]=\"'Cancel'\"\n ></in-button>\n <in-button id=\"edit\" (click)=\"applySelection()\" type=\"submit\"\n label=\"{{'Apply' | translate}}\"\n [name]=\"'Apply'\"\n color=\"primary\" [disabled]=\"checkSelected()\" [title]=\"'Select an action' | translate\"></in-button>\n </in-component-container>\n </div>\n</div>\n\n<ng-template #spinner><span class=\"c-spinner\">\n <i class=\"fa fa-circle-o-notch fa-spin \"></i>\n</span></ng-template>\n", styles: [".buttons{text-align:right}.buttons p-button{margin-left:8px}.container{padding:12px}:host ::ng-deep .c-select_block{position:relative;left:10px;width:30%}:host ::ng-deep .c-input_small{width:50%}:host ::ng-deep .my-tree{width:100%;display:inline-block;position:relative}:host ::ng-deep .my-tree .c-inputtext{width:500px}\n"] }]
|
|
2866
2866
|
}], ctorParameters: function () { return [{ type: i1$5.DynamicDialogRef }, { type: i1$5.DynamicDialogConfig }, { type: i1.TranslateService }, { type: InsparkMessageService }, { type: i1$3.Router }]; } });
|
|
2867
2867
|
|
|
2868
2868
|
class ContentToggleComponent {
|
|
@@ -3014,7 +3014,7 @@ InputGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
|
|
|
3014
3014
|
useExisting: forwardRef(() => InputGroupComponent),
|
|
3015
3015
|
multi: true,
|
|
3016
3016
|
}
|
|
3017
|
-
], ngImport: i0, template: "<label class=\"label type_varchars\">\
|
|
3017
|
+
], ngImport: i0, template: "<label class=\"label type_varchars\">\n <div class=\"p-inputgroup\">\n <span class=\"p-inputgroup-addon p-inputgroup-addon_trancated\" title=\"{{measureunit}}\">\n <span class=\"p-inputgroup-addon__content\">{{measureunit}}</span>\n </span>\n <input (focus)=\"this.focus.emit($event)\"\n (keydown)=\"numberOnly($event)\"\n [(ngModel)]=\"value\"\n [autocomplete]=\"autocomplete? 'on':'off'\"\n [disabled]=\"disabled || !isEditable\"\n [id]=\"id\"\n [maxlength]=\"30\"\n [ngStyle]=\"{textAlign: 'left', width: '100%'}\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n [size]=\"size\"\n class=\"p-inputtext c-input c-input_large field_{{id}}\"\n type=\"text\"/>\n <in-button (click)=\"changeValue(value)\"\n [color]=\"'primary'\"\n [disabled]=\"isApplyDisabled()\"\n [isIconOnly]=\"true\"\n [label]=\"\"\n [name]=\"'apply'\"\n [size]=\"'tiny'\"\n [title]=\"'Apply' | translate\"\n icon=\"fa fa-check\"></in-button>\n <in-button (click)=\"cancel()\"\n [isIconOnly]=\"true\"\n [label]=\"\"\n [name]=\"'cancel'\"\n [size]=\"'tiny'\"\n [title]=\"'Cancel' | translate\"\n color=\"transparent\"\n icon=\"fa fa-times\"></in-button>\n </div>\n\n</label>\n\n<!--<div *ngIf=\"!disabled\" class=\"button\">-->\n<!-- <in-button (click)=\"changeValue(value)\" [color]=\"'primary'\"-->\n<!-- [disabled]=\"isApplyDisabled()\"-->\n<!-- [isIconOnly]=\"true\"-->\n<!-- [label]=\"\"-->\n<!-- [name]=\"'apply'\"-->\n<!-- [ngStyle]=\"{'font-size':'1px', 'display': 'inline-block', 'line-height': '2px', position: 'relative', left: '70px',-->\n<!-- opacity: !isEditable ? '0' : '1',-->\n<!-- visibility: !isEditable ? 'hidden' : 'visible'-->\n<!-- }\"-->\n<!-- [size]=\"'tiny'\"-->\n<!-- [title]=\"'Apply' | translate\" color=\"transparent\" icon=\"fa fa-check\"></in-button>-->\n<!-- <in-button (click)=\"cancel()\" [isIconOnly]=\"true\" [label]=\"\"-->\n<!-- [name]=\"'cancel'\"-->\n<!-- [ngStyle]=\"{'font-size':'1px', 'display': 'inline-block', 'line-height': '2px', position: 'relative', left: '90px',-->\n<!-- opacity: !isEditable ? '0' : '1',-->\n<!-- visibility: !isEditable ? 'hidden' : 'visible'-->\n<!-- }\"-->\n<!-- [size]=\"'tiny'\"-->\n<!-- [title]=\"'Cancel' | translate\" color=\"transparent\" icon=\"fa fa-times\"></in-button>-->\n<!-- <in-button (click)=\"changeEditMode()\" [isIconOnly]=\"true\" [label]=\"\"-->\n<!-- [ngStyle]=\"{'font-size':'1px',-->\n<!-- 'display': 'inline-block',-->\n<!-- 'line-height': '2px',-->\n<!-- position: 'relative',-->\n<!-- left: '80px',-->\n<!-- top: '2px',-->\n<!-- opacity: isEditable ? '0' : '1',-->\n<!-- visibility: isEditable ? 'hidden' : 'visible'-->\n<!-- }\"-->\n<!-- [size]=\"'tiny'\"-->\n<!-- [title]=\"'Edit' | translate\"-->\n<!-- color=\"transparent\" icon=\"fa fa-pencil\" name=\"edit\"></in-button>-->\n<!--</div>-->\n\n", styles: [""], dependencies: [{ kind: "directive", type: i1$4.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: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ButtonComponent, selector: "in-button", inputs: ["size", "color", "type", "name", "testId", "label", "icon", "className", "notify", "svg", "width", "link", "isLoading", "shadow", "isIconOnly", "linkType", "linkTarget", "pressed", "disabled", "iconPos", "selectedItem", "menuPlacement", "menuItems"], outputs: ["focus", "blur", "click"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
|
|
3018
3018
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: InputGroupComponent, decorators: [{
|
|
3019
3019
|
type: Component,
|
|
3020
3020
|
args: [{ selector: 'in-input-group', providers: [
|
|
@@ -3023,7 +3023,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
3023
3023
|
useExisting: forwardRef(() => InputGroupComponent),
|
|
3024
3024
|
multi: true,
|
|
3025
3025
|
}
|
|
3026
|
-
], template: "<label class=\"label type_varchars\">\
|
|
3026
|
+
], template: "<label class=\"label type_varchars\">\n <div class=\"p-inputgroup\">\n <span class=\"p-inputgroup-addon p-inputgroup-addon_trancated\" title=\"{{measureunit}}\">\n <span class=\"p-inputgroup-addon__content\">{{measureunit}}</span>\n </span>\n <input (focus)=\"this.focus.emit($event)\"\n (keydown)=\"numberOnly($event)\"\n [(ngModel)]=\"value\"\n [autocomplete]=\"autocomplete? 'on':'off'\"\n [disabled]=\"disabled || !isEditable\"\n [id]=\"id\"\n [maxlength]=\"30\"\n [ngStyle]=\"{textAlign: 'left', width: '100%'}\"\n [placeholder]=\"placeholder\"\n [required]=\"required\"\n [size]=\"size\"\n class=\"p-inputtext c-input c-input_large field_{{id}}\"\n type=\"text\"/>\n <in-button (click)=\"changeValue(value)\"\n [color]=\"'primary'\"\n [disabled]=\"isApplyDisabled()\"\n [isIconOnly]=\"true\"\n [label]=\"\"\n [name]=\"'apply'\"\n [size]=\"'tiny'\"\n [title]=\"'Apply' | translate\"\n icon=\"fa fa-check\"></in-button>\n <in-button (click)=\"cancel()\"\n [isIconOnly]=\"true\"\n [label]=\"\"\n [name]=\"'cancel'\"\n [size]=\"'tiny'\"\n [title]=\"'Cancel' | translate\"\n color=\"transparent\"\n icon=\"fa fa-times\"></in-button>\n </div>\n\n</label>\n\n<!--<div *ngIf=\"!disabled\" class=\"button\">-->\n<!-- <in-button (click)=\"changeValue(value)\" [color]=\"'primary'\"-->\n<!-- [disabled]=\"isApplyDisabled()\"-->\n<!-- [isIconOnly]=\"true\"-->\n<!-- [label]=\"\"-->\n<!-- [name]=\"'apply'\"-->\n<!-- [ngStyle]=\"{'font-size':'1px', 'display': 'inline-block', 'line-height': '2px', position: 'relative', left: '70px',-->\n<!-- opacity: !isEditable ? '0' : '1',-->\n<!-- visibility: !isEditable ? 'hidden' : 'visible'-->\n<!-- }\"-->\n<!-- [size]=\"'tiny'\"-->\n<!-- [title]=\"'Apply' | translate\" color=\"transparent\" icon=\"fa fa-check\"></in-button>-->\n<!-- <in-button (click)=\"cancel()\" [isIconOnly]=\"true\" [label]=\"\"-->\n<!-- [name]=\"'cancel'\"-->\n<!-- [ngStyle]=\"{'font-size':'1px', 'display': 'inline-block', 'line-height': '2px', position: 'relative', left: '90px',-->\n<!-- opacity: !isEditable ? '0' : '1',-->\n<!-- visibility: !isEditable ? 'hidden' : 'visible'-->\n<!-- }\"-->\n<!-- [size]=\"'tiny'\"-->\n<!-- [title]=\"'Cancel' | translate\" color=\"transparent\" icon=\"fa fa-times\"></in-button>-->\n<!-- <in-button (click)=\"changeEditMode()\" [isIconOnly]=\"true\" [label]=\"\"-->\n<!-- [ngStyle]=\"{'font-size':'1px',-->\n<!-- 'display': 'inline-block',-->\n<!-- 'line-height': '2px',-->\n<!-- position: 'relative',-->\n<!-- left: '80px',-->\n<!-- top: '2px',-->\n<!-- opacity: isEditable ? '0' : '1',-->\n<!-- visibility: isEditable ? 'hidden' : 'visible'-->\n<!-- }\"-->\n<!-- [size]=\"'tiny'\"-->\n<!-- [title]=\"'Edit' | translate\"-->\n<!-- color=\"transparent\" icon=\"fa fa-pencil\" name=\"edit\"></in-button>-->\n<!--</div>-->\n\n" }]
|
|
3027
3027
|
}], propDecorators: { name: [{
|
|
3028
3028
|
type: Input
|
|
3029
3029
|
}], measureunit: [{
|
|
@@ -3131,7 +3131,7 @@ AutoCompleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
|
|
|
3131
3131
|
provide: NG_VALUE_ACCESSOR,
|
|
3132
3132
|
useExisting: forwardRef(() => AutoCompleteComponent),
|
|
3133
3133
|
multi: true
|
|
3134
|
-
}], queries: [{ propertyName: "templates", predicate: InsparkTemplate }], viewQueries: [{ propertyName: "inputEL", first: true, predicate: ["in"], descendants: true }, { propertyName: "multiInputEL", first: true, predicate: ["multiIn"], descendants: true }, { propertyName: "multiContainerEL", first: true, predicate: ["multiContainer"], descendants: true }, { propertyName: "dropdownButton", first: true, predicate: ["ddBtn"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span #container [ngClass]=\"{ 'p-autocomplete p-component': true, 'p-autocomplete-dd': dropdown, 'p-autocomplete-multiple': multiple }\" [ngStyle]=\"style\" [class]=\"styleClass\">\r\n <input\r\n pAutoFocus\r\n [autofocus]=\"autofocus\"\r\n *ngIf=\"!multiple\"\r\n #in\r\n [attr.type]=\"type\"\r\n [attr.id]=\"inputId\"\r\n [ngStyle]=\"inputStyle\"\r\n [class]=\"inputStyleClass\"\r\n [autocomplete]=\"autocomplete\"\r\n [attr.required]=\"required\"\r\n [attr.name]=\"name\"\r\n class=\"p-autocomplete-input p-inputtext p-component\"\r\n [ngClass]=\"{ 'p-autocomplete-dd-input': dropdown, 'p-disabled': disabled }\"\r\n [value]=\"inputFieldValue\"\r\n aria-autocomplete=\"list\"\r\n role=\"searchbox\"\r\n (click)=\"onInputClick($event)\"\r\n (input)=\"onInput($event)\"\r\n (keydown)=\"onKeydown($event)\"\r\n (keyup)=\"onKeyup($event)\"\r\n (focus)=\"onInputFocus($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n (change)=\"onInputChange($event)\"\r\n (paste)=\"onInputPaste($event)\"\r\n [attr.placeholder]=\"placeholder\"\r\n [attr.size]=\"size\"\r\n [attr.maxlength]=\"maxlength\"\r\n [attr.tabindex]=\"tabindex\"\r\n [readonly]=\"readonly\"\r\n [disabled]=\"disabled\"\r\n [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy\"\r\n [attr.aria-required]=\"required\"\r\n />\r\n <i *ngIf=\"!multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\r\n <i *ngIf=\"multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\r\n <ul *ngIf=\"multiple\" #multiContainer class=\"p-autocomplete-multiple-container p-component p-inputtext\" [ngClass]=\"{ 'p-disabled': disabled, 'p-focus': focus }\" (click)=\"multiIn.focus()\">\r\n <li #token *ngFor=\"let val of value\" class=\"p-autocomplete-token\">\r\n <ng-container *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: val }\"></ng-container>\r\n <span *ngIf=\"!selectedItemTemplate\" class=\"p-autocomplete-token-label\">{{ resolveFieldData(val) }}</span>\r\n <span class=\"p-autocomplete-token-icon pi pi-times-circle\" (click)=\"removeItem(token)\" *ngIf=\"!disabled && !readonly\"></span>\r\n </li>\r\n <li class=\"p-autocomplete-input-token\">\r\n <input\r\n pAutoFocus\r\n [autofocus]=\"autofocus\"\r\n #multiIn\r\n [attr.type]=\"type\"\r\n [attr.id]=\"inputId\"\r\n [disabled]=\"disabled\"\r\n [attr.placeholder]=\"value && value.length ? null : placeholder\"\r\n [attr.tabindex]=\"tabindex\"\r\n [attr.maxlength]=\"maxlength\"\r\n (input)=\"onInput($event)\"\r\n (click)=\"onInputClick($event)\"\r\n (keydown)=\"onKeydown($event)\"\r\n [readonly]=\"readonly\"\r\n (keyup)=\"onKeyup($event)\"\r\n (focus)=\"onInputFocus($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n (change)=\"onInputChange($event)\"\r\n (paste)=\"onInputPaste($event)\"\r\n [autocomplete]=\"autocomplete\"\r\n [ngStyle]=\"inputStyle\"\r\n [class]=\"inputStyleClass\"\r\n [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy\"\r\n [attr.aria-required]=\"required\"\r\n aria-autocomplete=\"list\"\r\n [attr.aria-controls]=\"listId\"\r\n role=\"searchbox\"\r\n [attr.aria-expanded]=\"overlayVisible\"\r\n aria-haspopup=\"true\"\r\n [attr.aria-activedescendant]=\"'p-highlighted-option'\"\r\n />\r\n </li>\r\n </ul>\r\n <i *ngIf=\"loading\" class=\"p-autocomplete-loader pi pi-spinner pi-spin\"></i\r\n ><button\r\n #ddBtn\r\n type=\"button\"\r\n pButton\r\n [icon]=\"dropdownIcon\"\r\n [attr.aria-label]=\"dropdownAriaLabel\"\r\n class=\"p-autocomplete-dropdown\"\r\n [disabled]=\"disabled\"\r\n pRipple\r\n (click)=\"handleDropdownClick($event)\"\r\n *ngIf=\"dropdown\"\r\n [attr.tabindex]=\"tabindex\"\r\n></button>\r\n <div\r\n #panel\r\n *ngIf=\"overlayVisible\"\r\n (click)=\"onOverlayClick($event)\"\r\n [ngClass]=\"['p-autocomplete-panel p-component']\"\r\n [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight\"\r\n [ngStyle]=\"panelStyle\"\r\n [class]=\"panelStyleClass\"\r\n [@overlayAnimation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\r\n (@overlayAnimation.start)=\"onOverlayAnimationStart($event)\"\r\n (@overlayAnimation.done)=\"onOverlayAnimationEnd($event)\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\r\n <p-scroller\r\n *ngIf=\"virtualScroll\"\r\n #scroller\r\n [items]=\"suggestions\"\r\n [style]=\"{ height: scrollHeight }\"\r\n [itemSize]=\"virtualScrollItemSize || _itemSize\"\r\n [autoSize]=\"true\"\r\n [lazy]=\"lazy\"\r\n (onLazyLoad)=\"onLazyLoad.emit($event)\"\r\n [options]=\"virtualScrollOptions\"\r\n >\r\n <ng-template pTemplate=\"content\" let-items let-scrollerOptions=\"options\">\r\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\r\n </ng-template>\r\n <ng-container *ngIf=\"loaderTemplate\">\r\n <ng-template pTemplate=\"loader\" let-scrollerOptions=\"options\">\r\n <ng-container *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\r\n </ng-template>\r\n </ng-container>\r\n </p-scroller>\r\n <ng-container *ngIf=\"!virtualScroll\">\r\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: suggestions, options: {} }\"></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\r\n <ul #items role=\"listbox\" [attr.id]=\"listId\" class=\"p-autocomplete-items\" [ngClass]=\"scrollerOptions.contentStyleClass\" [style]=\"scrollerOptions.contentStyle\">\r\n <ng-container *ngIf=\"group\">\r\n <ng-template ngFor let-optgroup [ngForOf]=\"items\">\r\n <li class=\"p-autocomplete-item-group\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\r\n <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || 'empty' }}</span>\r\n <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\r\n </li>\r\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup) }\"></ng-container>\r\n </ng-template>\r\n </ng-container>\r\n <ng-container *ngIf=\"!group\">\r\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: items }\"></ng-container>\r\n </ng-container>\r\n <ng-template #itemslist let-suggestionsToDisplay>\r\n <li\r\n role=\"option\"\r\n *ngFor=\"let option of suggestionsToDisplay; let idx = index\"\r\n class=\"p-autocomplete-item\"\r\n pRipple\r\n [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\r\n [ngClass]=\"{ 'p-highlight': option === highlightOption }\"\r\n [id]=\"highlightOption == option ? 'p-highlighted-option' : ''\"\r\n (click)=\"selectItem(option)\"\r\n >\r\n <span *ngIf=\"!itemTemplate\"\r\n [attr.title]=\"resolveFieldData(option)\">{{ resolveFieldData(option) }}</span>\r\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: option, index: scrollerOptions.getOptions ? scrollerOptions.getOptions(idx) : idx }\"></ng-container>\r\n </li>\r\n </ng-template>\r\n <li *ngIf=\"noResults && showEmptyMessage\" class=\"p-autocomplete-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\r\n <ng-container *ngIf=\"!emptyTemplate\">\r\n {{ emptyMessageLabel }}\r\n </ng-container>\r\n <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n </div>\r\n </span>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i6.Scroller, selector: "p-scroller", inputs: ["id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }], animations: [trigger('overlayAnimation', [transition(':enter', [style({
|
|
3134
|
+
}], queries: [{ propertyName: "templates", predicate: InsparkTemplate }], viewQueries: [{ propertyName: "inputEL", first: true, predicate: ["in"], descendants: true }, { propertyName: "multiInputEL", first: true, predicate: ["multiIn"], descendants: true }, { propertyName: "multiContainerEL", first: true, predicate: ["multiContainer"], descendants: true }, { propertyName: "dropdownButton", first: true, predicate: ["ddBtn"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span #container [ngClass]=\"{ 'p-autocomplete p-component': true, 'p-autocomplete-dd': dropdown, 'p-autocomplete-multiple': multiple }\" [ngStyle]=\"style\" [class]=\"styleClass\">\n <input\n pAutoFocus\n [autofocus]=\"autofocus\"\n *ngIf=\"!multiple\"\n #in\n [attr.type]=\"type\"\n [attr.id]=\"inputId\"\n [ngStyle]=\"inputStyle\"\n [class]=\"inputStyleClass\"\n [autocomplete]=\"autocomplete\"\n [attr.required]=\"required\"\n [attr.name]=\"name\"\n class=\"p-autocomplete-input p-inputtext p-component\"\n [ngClass]=\"{ 'p-autocomplete-dd-input': dropdown, 'p-disabled': disabled }\"\n [value]=\"inputFieldValue\"\n aria-autocomplete=\"list\"\n role=\"searchbox\"\n (click)=\"onInputClick($event)\"\n (input)=\"onInput($event)\"\n (keydown)=\"onKeydown($event)\"\n (keyup)=\"onKeyup($event)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (change)=\"onInputChange($event)\"\n (paste)=\"onInputPaste($event)\"\n [attr.placeholder]=\"placeholder\"\n [attr.size]=\"size\"\n [attr.maxlength]=\"maxlength\"\n [attr.tabindex]=\"tabindex\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.aria-required]=\"required\"\n />\n <i *ngIf=\"!multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\n <i *ngIf=\"multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\n <ul *ngIf=\"multiple\" #multiContainer class=\"p-autocomplete-multiple-container p-component p-inputtext\" [ngClass]=\"{ 'p-disabled': disabled, 'p-focus': focus }\" (click)=\"multiIn.focus()\">\n <li #token *ngFor=\"let val of value\" class=\"p-autocomplete-token\">\n <ng-container *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: val }\"></ng-container>\n <span *ngIf=\"!selectedItemTemplate\" class=\"p-autocomplete-token-label\">{{ resolveFieldData(val) }}</span>\n <span class=\"p-autocomplete-token-icon pi pi-times-circle\" (click)=\"removeItem(token)\" *ngIf=\"!disabled && !readonly\"></span>\n </li>\n <li class=\"p-autocomplete-input-token\">\n <input\n pAutoFocus\n [autofocus]=\"autofocus\"\n #multiIn\n [attr.type]=\"type\"\n [attr.id]=\"inputId\"\n [disabled]=\"disabled\"\n [attr.placeholder]=\"value && value.length ? null : placeholder\"\n [attr.tabindex]=\"tabindex\"\n [attr.maxlength]=\"maxlength\"\n (input)=\"onInput($event)\"\n (click)=\"onInputClick($event)\"\n (keydown)=\"onKeydown($event)\"\n [readonly]=\"readonly\"\n (keyup)=\"onKeyup($event)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (change)=\"onInputChange($event)\"\n (paste)=\"onInputPaste($event)\"\n [autocomplete]=\"autocomplete\"\n [ngStyle]=\"inputStyle\"\n [class]=\"inputStyleClass\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.aria-required]=\"required\"\n aria-autocomplete=\"list\"\n [attr.aria-controls]=\"listId\"\n role=\"searchbox\"\n [attr.aria-expanded]=\"overlayVisible\"\n aria-haspopup=\"true\"\n [attr.aria-activedescendant]=\"'p-highlighted-option'\"\n />\n </li>\n </ul>\n <i *ngIf=\"loading\" class=\"p-autocomplete-loader pi pi-spinner pi-spin\"></i\n ><button\n #ddBtn\n type=\"button\"\n pButton\n [icon]=\"dropdownIcon\"\n [attr.aria-label]=\"dropdownAriaLabel\"\n class=\"p-autocomplete-dropdown\"\n [disabled]=\"disabled\"\n pRipple\n (click)=\"handleDropdownClick($event)\"\n *ngIf=\"dropdown\"\n [attr.tabindex]=\"tabindex\"\n></button>\n <div\n #panel\n *ngIf=\"overlayVisible\"\n (click)=\"onOverlayClick($event)\"\n [ngClass]=\"['p-autocomplete-panel p-component']\"\n [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight\"\n [ngStyle]=\"panelStyle\"\n [class]=\"panelStyleClass\"\n [@overlayAnimation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\n (@overlayAnimation.start)=\"onOverlayAnimationStart($event)\"\n (@overlayAnimation.done)=\"onOverlayAnimationEnd($event)\"\n >\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n <p-scroller\n *ngIf=\"virtualScroll\"\n #scroller\n [items]=\"suggestions\"\n [style]=\"{ height: scrollHeight }\"\n [itemSize]=\"virtualScrollItemSize || _itemSize\"\n [autoSize]=\"true\"\n [lazy]=\"lazy\"\n (onLazyLoad)=\"onLazyLoad.emit($event)\"\n [options]=\"virtualScrollOptions\"\n >\n <ng-template pTemplate=\"content\" let-items let-scrollerOptions=\"options\">\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n </ng-template>\n <ng-container *ngIf=\"loaderTemplate\">\n <ng-template pTemplate=\"loader\" let-scrollerOptions=\"options\">\n <ng-container *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\n </ng-template>\n </ng-container>\n </p-scroller>\n <ng-container *ngIf=\"!virtualScroll\">\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: suggestions, options: {} }\"></ng-container>\n </ng-container>\n\n <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\n <ul #items role=\"listbox\" [attr.id]=\"listId\" class=\"p-autocomplete-items\" [ngClass]=\"scrollerOptions.contentStyleClass\" [style]=\"scrollerOptions.contentStyle\">\n <ng-container *ngIf=\"group\">\n <ng-template ngFor let-optgroup [ngForOf]=\"items\">\n <li class=\"p-autocomplete-item-group\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\n <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || 'empty' }}</span>\n <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\n </li>\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup) }\"></ng-container>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"!group\">\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: items }\"></ng-container>\n </ng-container>\n <ng-template #itemslist let-suggestionsToDisplay>\n <li\n role=\"option\"\n *ngFor=\"let option of suggestionsToDisplay; let idx = index\"\n class=\"p-autocomplete-item\"\n pRipple\n [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n [ngClass]=\"{ 'p-highlight': option === highlightOption }\"\n [id]=\"highlightOption == option ? 'p-highlighted-option' : ''\"\n (click)=\"selectItem(option)\"\n >\n <span *ngIf=\"!itemTemplate\"\n [attr.title]=\"resolveFieldData(option)\">{{ resolveFieldData(option) }}</span>\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: option, index: scrollerOptions.getOptions ? scrollerOptions.getOptions(idx) : idx }\"></ng-container>\n </li>\n </ng-template>\n <li *ngIf=\"noResults && showEmptyMessage\" class=\"p-autocomplete-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\n <ng-container *ngIf=\"!emptyTemplate\">\n {{ emptyMessageLabel }}\n </ng-container>\n <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n </li>\n </ul>\n </ng-template>\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n </div>\n </span>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i6.Scroller, selector: "p-scroller", inputs: ["id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }], animations: [trigger('overlayAnimation', [transition(':enter', [style({
|
|
3135
3135
|
opacity: 0,
|
|
3136
3136
|
transform: 'scaleY(0.8)'
|
|
3137
3137
|
}), animate('{{showTransitionParams}}')]), transition(':leave', [animate('{{hideTransitionParams}}', style({ opacity: 0 }))])])] });
|
|
@@ -3144,7 +3144,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
3144
3144
|
provide: NG_VALUE_ACCESSOR,
|
|
3145
3145
|
useExisting: forwardRef(() => AutoCompleteComponent),
|
|
3146
3146
|
multi: true
|
|
3147
|
-
}], template: "<span #container [ngClass]=\"{ 'p-autocomplete p-component': true, 'p-autocomplete-dd': dropdown, 'p-autocomplete-multiple': multiple }\" [ngStyle]=\"style\" [class]=\"styleClass\">\r\n <input\r\n pAutoFocus\r\n [autofocus]=\"autofocus\"\r\n *ngIf=\"!multiple\"\r\n #in\r\n [attr.type]=\"type\"\r\n [attr.id]=\"inputId\"\r\n [ngStyle]=\"inputStyle\"\r\n [class]=\"inputStyleClass\"\r\n [autocomplete]=\"autocomplete\"\r\n [attr.required]=\"required\"\r\n [attr.name]=\"name\"\r\n class=\"p-autocomplete-input p-inputtext p-component\"\r\n [ngClass]=\"{ 'p-autocomplete-dd-input': dropdown, 'p-disabled': disabled }\"\r\n [value]=\"inputFieldValue\"\r\n aria-autocomplete=\"list\"\r\n role=\"searchbox\"\r\n (click)=\"onInputClick($event)\"\r\n (input)=\"onInput($event)\"\r\n (keydown)=\"onKeydown($event)\"\r\n (keyup)=\"onKeyup($event)\"\r\n (focus)=\"onInputFocus($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n (change)=\"onInputChange($event)\"\r\n (paste)=\"onInputPaste($event)\"\r\n [attr.placeholder]=\"placeholder\"\r\n [attr.size]=\"size\"\r\n [attr.maxlength]=\"maxlength\"\r\n [attr.tabindex]=\"tabindex\"\r\n [readonly]=\"readonly\"\r\n [disabled]=\"disabled\"\r\n [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy\"\r\n [attr.aria-required]=\"required\"\r\n />\r\n <i *ngIf=\"!multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\r\n <i *ngIf=\"multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\r\n <ul *ngIf=\"multiple\" #multiContainer class=\"p-autocomplete-multiple-container p-component p-inputtext\" [ngClass]=\"{ 'p-disabled': disabled, 'p-focus': focus }\" (click)=\"multiIn.focus()\">\r\n <li #token *ngFor=\"let val of value\" class=\"p-autocomplete-token\">\r\n <ng-container *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: val }\"></ng-container>\r\n <span *ngIf=\"!selectedItemTemplate\" class=\"p-autocomplete-token-label\">{{ resolveFieldData(val) }}</span>\r\n <span class=\"p-autocomplete-token-icon pi pi-times-circle\" (click)=\"removeItem(token)\" *ngIf=\"!disabled && !readonly\"></span>\r\n </li>\r\n <li class=\"p-autocomplete-input-token\">\r\n <input\r\n pAutoFocus\r\n [autofocus]=\"autofocus\"\r\n #multiIn\r\n [attr.type]=\"type\"\r\n [attr.id]=\"inputId\"\r\n [disabled]=\"disabled\"\r\n [attr.placeholder]=\"value && value.length ? null : placeholder\"\r\n [attr.tabindex]=\"tabindex\"\r\n [attr.maxlength]=\"maxlength\"\r\n (input)=\"onInput($event)\"\r\n (click)=\"onInputClick($event)\"\r\n (keydown)=\"onKeydown($event)\"\r\n [readonly]=\"readonly\"\r\n (keyup)=\"onKeyup($event)\"\r\n (focus)=\"onInputFocus($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n (change)=\"onInputChange($event)\"\r\n (paste)=\"onInputPaste($event)\"\r\n [autocomplete]=\"autocomplete\"\r\n [ngStyle]=\"inputStyle\"\r\n [class]=\"inputStyleClass\"\r\n [attr.aria-label]=\"ariaLabel\"\r\n [attr.aria-labelledby]=\"ariaLabelledBy\"\r\n [attr.aria-required]=\"required\"\r\n aria-autocomplete=\"list\"\r\n [attr.aria-controls]=\"listId\"\r\n role=\"searchbox\"\r\n [attr.aria-expanded]=\"overlayVisible\"\r\n aria-haspopup=\"true\"\r\n [attr.aria-activedescendant]=\"'p-highlighted-option'\"\r\n />\r\n </li>\r\n </ul>\r\n <i *ngIf=\"loading\" class=\"p-autocomplete-loader pi pi-spinner pi-spin\"></i\r\n ><button\r\n #ddBtn\r\n type=\"button\"\r\n pButton\r\n [icon]=\"dropdownIcon\"\r\n [attr.aria-label]=\"dropdownAriaLabel\"\r\n class=\"p-autocomplete-dropdown\"\r\n [disabled]=\"disabled\"\r\n pRipple\r\n (click)=\"handleDropdownClick($event)\"\r\n *ngIf=\"dropdown\"\r\n [attr.tabindex]=\"tabindex\"\r\n></button>\r\n <div\r\n #panel\r\n *ngIf=\"overlayVisible\"\r\n (click)=\"onOverlayClick($event)\"\r\n [ngClass]=\"['p-autocomplete-panel p-component']\"\r\n [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight\"\r\n [ngStyle]=\"panelStyle\"\r\n [class]=\"panelStyleClass\"\r\n [@overlayAnimation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\r\n (@overlayAnimation.start)=\"onOverlayAnimationStart($event)\"\r\n (@overlayAnimation.done)=\"onOverlayAnimationEnd($event)\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\r\n <p-scroller\r\n *ngIf=\"virtualScroll\"\r\n #scroller\r\n [items]=\"suggestions\"\r\n [style]=\"{ height: scrollHeight }\"\r\n [itemSize]=\"virtualScrollItemSize || _itemSize\"\r\n [autoSize]=\"true\"\r\n [lazy]=\"lazy\"\r\n (onLazyLoad)=\"onLazyLoad.emit($event)\"\r\n [options]=\"virtualScrollOptions\"\r\n >\r\n <ng-template pTemplate=\"content\" let-items let-scrollerOptions=\"options\">\r\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\r\n </ng-template>\r\n <ng-container *ngIf=\"loaderTemplate\">\r\n <ng-template pTemplate=\"loader\" let-scrollerOptions=\"options\">\r\n <ng-container *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\r\n </ng-template>\r\n </ng-container>\r\n </p-scroller>\r\n <ng-container *ngIf=\"!virtualScroll\">\r\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: suggestions, options: {} }\"></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\r\n <ul #items role=\"listbox\" [attr.id]=\"listId\" class=\"p-autocomplete-items\" [ngClass]=\"scrollerOptions.contentStyleClass\" [style]=\"scrollerOptions.contentStyle\">\r\n <ng-container *ngIf=\"group\">\r\n <ng-template ngFor let-optgroup [ngForOf]=\"items\">\r\n <li class=\"p-autocomplete-item-group\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\r\n <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || 'empty' }}</span>\r\n <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\r\n </li>\r\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup) }\"></ng-container>\r\n </ng-template>\r\n </ng-container>\r\n <ng-container *ngIf=\"!group\">\r\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: items }\"></ng-container>\r\n </ng-container>\r\n <ng-template #itemslist let-suggestionsToDisplay>\r\n <li\r\n role=\"option\"\r\n *ngFor=\"let option of suggestionsToDisplay; let idx = index\"\r\n class=\"p-autocomplete-item\"\r\n pRipple\r\n [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\r\n [ngClass]=\"{ 'p-highlight': option === highlightOption }\"\r\n [id]=\"highlightOption == option ? 'p-highlighted-option' : ''\"\r\n (click)=\"selectItem(option)\"\r\n >\r\n <span *ngIf=\"!itemTemplate\"\r\n [attr.title]=\"resolveFieldData(option)\">{{ resolveFieldData(option) }}</span>\r\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: option, index: scrollerOptions.getOptions ? scrollerOptions.getOptions(idx) : idx }\"></ng-container>\r\n </li>\r\n </ng-template>\r\n <li *ngIf=\"noResults && showEmptyMessage\" class=\"p-autocomplete-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\r\n <ng-container *ngIf=\"!emptyTemplate\">\r\n {{ emptyMessageLabel }}\r\n </ng-container>\r\n <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n </div>\r\n </span>\r\n" }]
|
|
3147
|
+
}], template: "<span #container [ngClass]=\"{ 'p-autocomplete p-component': true, 'p-autocomplete-dd': dropdown, 'p-autocomplete-multiple': multiple }\" [ngStyle]=\"style\" [class]=\"styleClass\">\n <input\n pAutoFocus\n [autofocus]=\"autofocus\"\n *ngIf=\"!multiple\"\n #in\n [attr.type]=\"type\"\n [attr.id]=\"inputId\"\n [ngStyle]=\"inputStyle\"\n [class]=\"inputStyleClass\"\n [autocomplete]=\"autocomplete\"\n [attr.required]=\"required\"\n [attr.name]=\"name\"\n class=\"p-autocomplete-input p-inputtext p-component\"\n [ngClass]=\"{ 'p-autocomplete-dd-input': dropdown, 'p-disabled': disabled }\"\n [value]=\"inputFieldValue\"\n aria-autocomplete=\"list\"\n role=\"searchbox\"\n (click)=\"onInputClick($event)\"\n (input)=\"onInput($event)\"\n (keydown)=\"onKeydown($event)\"\n (keyup)=\"onKeyup($event)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (change)=\"onInputChange($event)\"\n (paste)=\"onInputPaste($event)\"\n [attr.placeholder]=\"placeholder\"\n [attr.size]=\"size\"\n [attr.maxlength]=\"maxlength\"\n [attr.tabindex]=\"tabindex\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.aria-required]=\"required\"\n />\n <i *ngIf=\"!multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\n <i *ngIf=\"multiple && filled && !disabled && showClear\" class=\"p-autocomplete-clear-icon pi pi-times\" (click)=\"clear()\"></i>\n <ul *ngIf=\"multiple\" #multiContainer class=\"p-autocomplete-multiple-container p-component p-inputtext\" [ngClass]=\"{ 'p-disabled': disabled, 'p-focus': focus }\" (click)=\"multiIn.focus()\">\n <li #token *ngFor=\"let val of value\" class=\"p-autocomplete-token\">\n <ng-container *ngTemplateOutlet=\"selectedItemTemplate; context: { $implicit: val }\"></ng-container>\n <span *ngIf=\"!selectedItemTemplate\" class=\"p-autocomplete-token-label\">{{ resolveFieldData(val) }}</span>\n <span class=\"p-autocomplete-token-icon pi pi-times-circle\" (click)=\"removeItem(token)\" *ngIf=\"!disabled && !readonly\"></span>\n </li>\n <li class=\"p-autocomplete-input-token\">\n <input\n pAutoFocus\n [autofocus]=\"autofocus\"\n #multiIn\n [attr.type]=\"type\"\n [attr.id]=\"inputId\"\n [disabled]=\"disabled\"\n [attr.placeholder]=\"value && value.length ? null : placeholder\"\n [attr.tabindex]=\"tabindex\"\n [attr.maxlength]=\"maxlength\"\n (input)=\"onInput($event)\"\n (click)=\"onInputClick($event)\"\n (keydown)=\"onKeydown($event)\"\n [readonly]=\"readonly\"\n (keyup)=\"onKeyup($event)\"\n (focus)=\"onInputFocus($event)\"\n (blur)=\"onInputBlur($event)\"\n (change)=\"onInputChange($event)\"\n (paste)=\"onInputPaste($event)\"\n [autocomplete]=\"autocomplete\"\n [ngStyle]=\"inputStyle\"\n [class]=\"inputStyleClass\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.aria-required]=\"required\"\n aria-autocomplete=\"list\"\n [attr.aria-controls]=\"listId\"\n role=\"searchbox\"\n [attr.aria-expanded]=\"overlayVisible\"\n aria-haspopup=\"true\"\n [attr.aria-activedescendant]=\"'p-highlighted-option'\"\n />\n </li>\n </ul>\n <i *ngIf=\"loading\" class=\"p-autocomplete-loader pi pi-spinner pi-spin\"></i\n ><button\n #ddBtn\n type=\"button\"\n pButton\n [icon]=\"dropdownIcon\"\n [attr.aria-label]=\"dropdownAriaLabel\"\n class=\"p-autocomplete-dropdown\"\n [disabled]=\"disabled\"\n pRipple\n (click)=\"handleDropdownClick($event)\"\n *ngIf=\"dropdown\"\n [attr.tabindex]=\"tabindex\"\n></button>\n <div\n #panel\n *ngIf=\"overlayVisible\"\n (click)=\"onOverlayClick($event)\"\n [ngClass]=\"['p-autocomplete-panel p-component']\"\n [style.max-height]=\"virtualScroll ? 'auto' : scrollHeight\"\n [ngStyle]=\"panelStyle\"\n [class]=\"panelStyleClass\"\n [@overlayAnimation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\n (@overlayAnimation.start)=\"onOverlayAnimationStart($event)\"\n (@overlayAnimation.done)=\"onOverlayAnimationEnd($event)\"\n >\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n <p-scroller\n *ngIf=\"virtualScroll\"\n #scroller\n [items]=\"suggestions\"\n [style]=\"{ height: scrollHeight }\"\n [itemSize]=\"virtualScrollItemSize || _itemSize\"\n [autoSize]=\"true\"\n [lazy]=\"lazy\"\n (onLazyLoad)=\"onLazyLoad.emit($event)\"\n [options]=\"virtualScrollOptions\"\n >\n <ng-template pTemplate=\"content\" let-items let-scrollerOptions=\"options\">\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: items, options: scrollerOptions }\"></ng-container>\n </ng-template>\n <ng-container *ngIf=\"loaderTemplate\">\n <ng-template pTemplate=\"loader\" let-scrollerOptions=\"options\">\n <ng-container *ngTemplateOutlet=\"loaderTemplate; context: { options: scrollerOptions }\"></ng-container>\n </ng-template>\n </ng-container>\n </p-scroller>\n <ng-container *ngIf=\"!virtualScroll\">\n <ng-container *ngTemplateOutlet=\"buildInItems; context: { $implicit: suggestions, options: {} }\"></ng-container>\n </ng-container>\n\n <ng-template #buildInItems let-items let-scrollerOptions=\"options\">\n <ul #items role=\"listbox\" [attr.id]=\"listId\" class=\"p-autocomplete-items\" [ngClass]=\"scrollerOptions.contentStyleClass\" [style]=\"scrollerOptions.contentStyle\">\n <ng-container *ngIf=\"group\">\n <ng-template ngFor let-optgroup [ngForOf]=\"items\">\n <li class=\"p-autocomplete-item-group\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\n <span *ngIf=\"!groupTemplate\">{{ getOptionGroupLabel(optgroup) || 'empty' }}</span>\n <ng-container *ngTemplateOutlet=\"groupTemplate; context: { $implicit: optgroup }\"></ng-container>\n </li>\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: getOptionGroupChildren(optgroup) }\"></ng-container>\n </ng-template>\n </ng-container>\n <ng-container *ngIf=\"!group\">\n <ng-container *ngTemplateOutlet=\"itemslist; context: { $implicit: items }\"></ng-container>\n </ng-container>\n <ng-template #itemslist let-suggestionsToDisplay>\n <li\n role=\"option\"\n *ngFor=\"let option of suggestionsToDisplay; let idx = index\"\n class=\"p-autocomplete-item\"\n pRipple\n [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\"\n [ngClass]=\"{ 'p-highlight': option === highlightOption }\"\n [id]=\"highlightOption == option ? 'p-highlighted-option' : ''\"\n (click)=\"selectItem(option)\"\n >\n <span *ngIf=\"!itemTemplate\"\n [attr.title]=\"resolveFieldData(option)\">{{ resolveFieldData(option) }}</span>\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: option, index: scrollerOptions.getOptions ? scrollerOptions.getOptions(idx) : idx }\"></ng-container>\n </li>\n </ng-template>\n <li *ngIf=\"noResults && showEmptyMessage\" class=\"p-autocomplete-empty-message\" [ngStyle]=\"{ height: scrollerOptions.itemSize + 'px' }\">\n <ng-container *ngIf=\"!emptyTemplate\">\n {{ emptyMessageLabel }}\n </ng-container>\n <ng-container #empty *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n </li>\n </ul>\n </ng-template>\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\n </div>\n </span>\n" }]
|
|
3148
3148
|
}], propDecorators: { minLength: [{
|
|
3149
3149
|
type: Input
|
|
3150
3150
|
}], delay: [{
|