@inspark/inspark-components 1.0.0 → 1.0.4
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/bundles/inspark-inspark-components.umd.js +217 -9
- package/full/bundles/inspark-inspark-components.umd.js.map +1 -1
- package/full/bundles/inspark-inspark-components.umd.min.js +2 -2
- package/full/bundles/inspark-inspark-components.umd.min.js.map +1 -1
- package/full/components/button/button.component.d.ts +1 -1
- package/full/components/input-group/input-group.component.d.ts +54 -0
- package/full/components/table/table-menu-overlay/table-menu-overlay.component.d.ts +0 -1
- package/full/components/table/table.component.d.ts +2 -0
- package/full/esm2015/components/button/button.component.js +2 -2
- package/full/esm2015/components/input-group/input-group.component.js +197 -0
- package/full/esm2015/components/input-text/input-text.component.js +2 -2
- package/full/esm2015/components/inspark.module.js +6 -3
- package/full/esm2015/components/table/table-menu-overlay/table-menu-overlay.component.js +2 -2
- package/full/esm2015/components/table/table.component.js +13 -3
- package/full/esm2015/components/tooltip/tooltip.component.js +1 -1
- package/full/esm2015/components/tree-table/tree-table.component.js +2 -2
- package/full/esm2015/inspark-inspark-components.js +2 -1
- package/full/esm5/components/button/button.component.js +2 -2
- package/full/esm5/components/input-group/input-group.component.js +199 -0
- package/full/esm5/components/input-text/input-text.component.js +2 -2
- package/full/esm5/components/inspark.module.js +6 -3
- package/full/esm5/components/table/table-menu-overlay/table-menu-overlay.component.js +2 -2
- package/full/esm5/components/table/table.component.js +13 -3
- package/full/esm5/components/tooltip/tooltip.component.js +1 -1
- package/full/esm5/components/tree-table/tree-table.component.js +2 -2
- package/full/esm5/inspark-inspark-components.js +2 -1
- package/full/fesm2015/inspark-inspark-components.js +215 -10
- package/full/fesm2015/inspark-inspark-components.js.map +1 -1
- package/full/fesm5/inspark-inspark-components.js +217 -10
- package/full/fesm5/inspark-inspark-components.js.map +1 -1
- package/full/index.css +1 -1
- package/full/inspark-inspark-components.d.ts +1 -0
- package/full/inspark-inspark-components.metadata.json +1 -1
- package/full/package.json +1 -1
- package/interface/package.json +1 -1
- package/package.json +1 -26
|
@@ -817,7 +817,7 @@
|
|
|
817
817
|
ButtonComponent = __decorate([
|
|
818
818
|
core.Component({
|
|
819
819
|
selector: 'in-button',
|
|
820
|
-
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]=\"{'ui-button ui-widget ui-state-default ui-corner-all':true,\n 'ui-button-icon-only': ((icon || svg) && !label),\n 'ui-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'ui-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'ui-button-text-only': (!(icon || svg) && label),\n 'ui-button-text-empty': (!(icon || svg) && !label),\n 'ui-button-svg': svg,\n 'ui-button-material': isMaterialIcon,\n 'ui-state-disabled': disabled,\n 'ui-button-small': size === 'small',\n 'ui-button-large': size === 'large',\n 'ui-button-primary': color === 'primary',\n 'ui-button-secondary': color === 'secondary',\n 'ui-button-danger': color === 'danger',\n 'ui-button-transparency': color === 'transparent',\n 'ui-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]=\"{'ui-button ui-widget ui-state-default ui-corner-all':true,\n 'ui-button-icon-only': ((icon || svg) && !label),\n 'ui-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'ui-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'ui-button-text-only': (!(icon || svg) && label),\n 'ui-button-text-empty': (!(icon || svg) && !label),\n 'ui-button-svg': svg,\n 'ui-button-material': isMaterialIcon,\n 'ui-state-disabled': disabled,\n 'ui-button-small': size === 'small',\n 'ui-button-large': size === 'large',\n 'ui-button-primary': color === 'primary',\n 'ui-button-secondary': color === 'secondary',\n 'ui-button-danger': color === 'danger',\n 'ui-button-transparency': color === 'transparent',\n 'ui-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]=\" {'ui-button ui-widget ui-state-default ui-corner-all':true,\n 'ui-button-icon-only': ((icon || svg) && !label),\n 'ui-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'ui-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'ui-button-text-only': (!(icon || svg) && label),\n 'ui-button-text-empty': (!(icon || svg) && !label),\n 'ui-button-svg': svg,\n 'ui-button-material': isMaterialIcon,\n 'ui-state-disabled': disabled,\n 'ui-button-small': size === 'small',\n 'ui-button-large': size === 'large',\n 'ui-button-primary': color === 'primary',\n 'ui-button-secondary': color === 'secondary',\n 'ui-button-danger': color === 'danger',\n 'ui-button-transparency': color === 'transparent',\n 'ui-button-shadowed': shadow === true,\n 'ui-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]=\" {'ui-button ui-widget ui-state-default ui-corner-all':true,\n 'ui-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'ui-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'ui-button-text-only': (!(icon || svg) && label),\n 'ui-button-text-empty': (!(icon || svg) && !label),\n 'ui-button-svg': svg,\n 'ui-button-material': isMaterialIcon,\n 'ui-
|
|
820
|
+
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]=\"{'ui-button ui-widget ui-state-default ui-corner-all':true,\n 'ui-button-icon-only': ((icon || svg) && !label),\n 'ui-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'ui-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'ui-button-text-only': (!(icon || svg) && label),\n 'ui-button-text-empty': (!(icon || svg) && !label),\n 'ui-button-svg': svg,\n 'ui-button-material': isMaterialIcon,\n 'ui-state-disabled': disabled,\n 'ui-button-tiny': size === 'tiny',\n 'ui-button-small': size === 'small',\n 'ui-button-large': size === 'large',\n 'ui-button-primary': color === 'primary',\n 'ui-button-secondary': color === 'secondary',\n 'ui-button-danger': color === 'danger',\n 'ui-button-transparency': color === 'transparent',\n 'ui-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]=\"{'ui-button ui-widget ui-state-default ui-corner-all':true,\n 'ui-button-icon-only': ((icon || svg) && !label),\n 'ui-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'ui-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'ui-button-text-only': (!(icon || svg) && label),\n 'ui-button-text-empty': (!(icon || svg) && !label),\n 'ui-button-svg': svg,\n 'ui-button-material': isMaterialIcon,\n 'ui-state-disabled': disabled,\n 'ui-button-tiny': size === 'tiny',\n 'ui-button-small': size === 'small',\n 'ui-button-large': size === 'large',\n 'ui-button-primary': color === 'primary',\n 'ui-button-secondary': color === 'secondary',\n 'ui-button-danger': color === 'danger',\n 'ui-button-transparency': color === 'transparent',\n 'ui-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]=\" {'ui-button ui-widget ui-state-default ui-corner-all':true,\n 'ui-button-icon-only': ((icon || svg) && !label),\n 'ui-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'ui-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'ui-button-text-only': (!(icon || svg) && label),\n 'ui-button-text-empty': (!(icon || svg) && !label),\n 'ui-button-svg': svg,\n 'ui-button-material': isMaterialIcon,\n 'ui-state-disabled': disabled,\n 'ui-button-tiny': size === 'tiny',\n 'ui-button-small': size === 'small',\n 'ui-button-large': size === 'large',\n 'ui-button-primary': color === 'primary',\n 'ui-button-secondary': color === 'secondary',\n 'ui-button-danger': color === 'danger',\n 'ui-button-transparency': color === 'transparent',\n 'ui-button-shadowed': shadow === true,\n 'ui-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]=\" {'ui-button ui-widget ui-state-default ui-corner-all':true,\n 'ui-button-icon-only': ((icon || svg) && !label) || isIconOnly,\n 'ui-button-text-icon-left': ((icon || svg) && label && iconPos === 'left'),\n 'ui-button-text-icon-right': ((icon || svg) && label && iconPos === 'right'),\n 'ui-button-text-only': (!(icon || svg) && label),\n 'ui-button-text-empty': (!(icon || svg) && !label),\n 'ui-button-svg': svg,\n 'ui-button-material': isMaterialIcon,\n 'ui-state-disabled': disabled,\n 'ui-button-tiny': size === 'tiny',\n 'ui-button-small': size === 'small',\n 'ui-button-large': size === 'large',\n 'ui-button-primary': color === 'primary',\n 'ui-button-secondary': color === 'secondary',\n 'ui-button-danger': color === 'danger',\n 'ui-button-transparency': color === 'transparent',\n 'ui-button-shadowed': shadow === true,\n 'ui-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]=\"{'ui-clickable': true,\n 'ui-button-icon-left': (iconPos === 'left'),\n 'ui-button-icon-right': (iconPos === 'right')}\"></span>\n <span *ngIf=\"isMaterialIcon && icon && !isLoading\" [ngClass]=\"{'ui-clickable': true,\n 'ui-button-icon-left': (iconPos === 'left'),\n 'ui-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=\"ui-button-text ui-clickable\">{{label}}</span>\n <span *ngIf=\"svg && !isLoading\" [ngClass]=\"{'ui-clickable': true,\n 'ui-button-icon-left': (iconPos === 'left'),\n 'ui-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",
|
|
821
821
|
encapsulation: core.ViewEncapsulation.Emulated,
|
|
822
822
|
changeDetection: core.ChangeDetectionStrategy.OnPush,
|
|
823
823
|
styles: ["@charset \"UTF-8\";.container{display:inline-block}.button-container{position:relative;display:inline-block}button{outline:0;width:100%}.ui-button-icon-only .ui-button-icon-left{margin-top:-9px}.ui-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)}.ui-button{margin-right:0;height:36px;display:inline-flex;align-items:center;justify-content:center}.ui-button.ui-button-pressed{background-color:var(--colorBgLevel4)}.ui-button.ui-button-large{height:48px}.ui-button.ui-button-large .ui-button-icon-left{font-size:18px;margin-top:-8px}.ui-button.ui-button-large .ui-button-text{padding:0 1em 0 48px;margin-top:6px}.ui-button-text-icon-left .ui-button-text{padding:0 1em 0 2.4em}.ui-button-icon-only{font-size:18px;display:inline-flex;align-items:center;justify-content:center}.ui-button-icon-only.ui-button-large{width:48px;height:48px}.ui-button-icon-only .svg,.ui-button-icon-only.ui-button-large .svg{display:inline-block;line-height:0}.ui-button-transparency{background:0 0;color:currentColor}.ui-button-transparency:hover{color:var(--colorText)}.ui-button-shadowed{box-shadow:0 2px 6px 0 rgba(0,0,0,.2)}.ui-button.ui-button-svg.ui-button-small .ui-button-icon-left{margin-top:-4px}.ui-button.ui-button-svg.ui-button-small.ui-button-icon-only .ui-button-icon-left{margin-top:-2px}.ui-button.ui-button-svg .ui-button-icon-left{left:6px;transform:translateY(-50%);margin-top:-4px}.ui-button.ui-button-svg.ui-button-icon-only .ui-button-icon-left{left:50%;width:auto;transform:translate(-50%,-50%);margin-left:0;margin-top:0}.ui-button.ui-button-svg.ui-button-large.ui-button-icon-only .ui-button-icon-left{margin-top:0}.ui-button-material.ui-button-icon-only .material-icons{font-size:20px}.ui-button-material.ui-button-icon-only .ui-button-icon-left{margin-top:-10px;margin-left:-12px}.ui-button-material .material-icons{font-size:16px}.ui-button-material .ui-button-icon-left{margin-top:-8px;margin-left:-2px}.ui-button-material.ui-button-small .ui-button-icon-left{margin-top:-7px}.ui-button-material.ui-button-small .material-icons{font-size:14px}.ui-button-material.ui-button-small.ui-button-icon-only .ui-button-icon-left{margin-top:-12px;margin-left:-10px}.ui-button-material.ui-button-small.ui-button-icon-only .ui-button-icon-left .material-icons{font-size:18px}.ui-button-material.ui-button-large .material-icons{font-size:24px}.ui-button-material.ui-button-large .ui-button-icon-left{margin-top:-11px}.ui-button-material.ui-button-large.ui-button-icon-only .ui-button-icon-left{margin-top:-11px;margin-left:-13px}:host .ui-menu .ui-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 rgba(0,0,0,.2)}.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 .ui-button,.in-dropdown-menu .in-dropdown-menu-item in-button ::ng-deep button .ui-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)}"]
|
|
@@ -968,7 +968,7 @@
|
|
|
968
968
|
InputTextComponent = InputTextComponent_1 = __decorate([
|
|
969
969
|
core.Component({
|
|
970
970
|
selector: 'in-input-text',
|
|
971
|
-
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}}
|
|
971
|
+
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 <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 [placeholder]=\"placeholder\"\n [required]=\"required\"\n [size]=\"size\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n class=\"c-input c-input_large field_{{id}}\"\n type=\"text\"\n />\n</label>\n",
|
|
972
972
|
providers: [
|
|
973
973
|
{
|
|
974
974
|
provide: forms.NG_VALUE_ACCESSOR,
|
|
@@ -1660,7 +1660,7 @@
|
|
|
1660
1660
|
selector: 'in-table-menu-overlay',
|
|
1661
1661
|
template: "<div class=\"c-overlay is-dropdown_open\">\n <div (click)=\"isExpanded = !isExpanded;\"\n class=\"c-overlay__toggle\">\n <ng-content select=\"host\"></ng-content>\n </div>\n <ng-container *ngIf=\"isExpanded\">\n <div (clickedOutside)=\"isClickedOutsideOverlay($event)\" class=\"c-overlay__body\"\n inClickOutside>\n <!--{{positionClass}}-->\n <ng-content select=\"body\"></ng-content>\n </div>\n </ng-container>\n</div>\n",
|
|
1662
1662
|
changeDetection: core.ChangeDetectionStrategy.OnPush,
|
|
1663
|
-
styles: ["@charset \"UTF-8\";.c-overlay{position:relative;display:inline-block}.c-overlay__toggle{display:inline-block}.c-overlay__body{text-align:left;position:absolute;top:100%;padding:6px 12px;z-index:1050;box-shadow:0 10px 20px rgba(0,0,0,.19),0 6px 6px rgba(0,0,0,.23);max-height:500px;overflow:auto}:host-context(.theme-dark) .c-overlay__body{background-color:#53555c;background-color:var(--ids-theme-color-gray-35,#53555c)}", "@charset \"UTF-8\";:host-context(.theme-contrast) .c-overlay__body{background-color:#ebebeb;background-color:var(--ids-theme-color-gray-5,#ebebeb)}", "@charset \"UTF-8\";:host-context(.theme-light) .c-overlay__body{background-color:#ebebeb;background-color:var(--ids-theme-color-gray-5,#ebebeb)}", "@charset \"UTF-8\";:host-context(.theme-green) .c-overlay__body{background-color:#ebebeb;background-color:var(--ids-theme-color-gray-5,#ebebeb)}"]
|
|
1663
|
+
styles: ["@charset \"UTF-8\";.c-overlay{position:relative;display:inline-block}.c-overlay__toggle{display:inline-block}.c-overlay__body{text-align:left;position:absolute;top:100%;padding:6px 12px;z-index:1050;box-shadow:0 10px 20px rgba(0,0,0,.19),0 6px 6px rgba(0,0,0,.23);max-height:500px;overflow:auto}:host-context(.theme-dark) .c-overlay__body{background-color:#53555c;background-color:var(--ids-theme-color-gray-35,#53555c)}", "@charset \"UTF-8\";:host-context(.theme-contrast) .c-overlay__body{background-color:#ebebeb;background-color:var(--ids-theme-color-gray-5,#ebebeb)}", "@charset \"UTF-8\";:host-context(.theme-light) .c-overlay__body{background-color:#ebebeb;background-color:var(--ids-theme-color-gray-5,#ebebeb)}", "@charset \"UTF-8\";:host-context(.theme-green) .c-overlay__body{background-color:#ebebeb;background-color:var(--ids-theme-color-gray-5,#ebebeb)}", "@charset \"UTF-8\";:host-context(.theme-blue) .c-overlay__body{background-color:#202127;background-color:var(--colorBgLevel1,#202127)}"]
|
|
1664
1664
|
}),
|
|
1665
1665
|
__metadata("design:paramtypes", [core.ElementRef])
|
|
1666
1666
|
], TableMenuOverlayComponent);
|
|
@@ -1711,6 +1711,7 @@
|
|
|
1711
1711
|
this.primaryColumns = [];
|
|
1712
1712
|
this.values = [];
|
|
1713
1713
|
this.checkboxSelection = true;
|
|
1714
|
+
this.showHeader = true;
|
|
1714
1715
|
this.activeChange = new core.EventEmitter();
|
|
1715
1716
|
this.selectionChange = new core.EventEmitter();
|
|
1716
1717
|
this.addAction = new core.EventEmitter();
|
|
@@ -1718,6 +1719,7 @@
|
|
|
1718
1719
|
this.saveAction = new core.EventEmitter();
|
|
1719
1720
|
this.removeAction = new core.EventEmitter();
|
|
1720
1721
|
this.unlinkAction = new core.EventEmitter();
|
|
1722
|
+
this.linkAction = new core.EventEmitter();
|
|
1721
1723
|
this.groupEditAction = new core.EventEmitter();
|
|
1722
1724
|
this.sortFunction = new core.EventEmitter();
|
|
1723
1725
|
this.groupMode = 0;
|
|
@@ -2060,6 +2062,10 @@
|
|
|
2060
2062
|
core.Input(),
|
|
2061
2063
|
__metadata("design:type", Boolean)
|
|
2062
2064
|
], TableComponent.prototype, "isGroupedExpanded", void 0);
|
|
2065
|
+
__decorate([
|
|
2066
|
+
core.Input(),
|
|
2067
|
+
__metadata("design:type", Boolean)
|
|
2068
|
+
], TableComponent.prototype, "showHeader", void 0);
|
|
2063
2069
|
__decorate([
|
|
2064
2070
|
core.Output(),
|
|
2065
2071
|
__metadata("design:type", Object)
|
|
@@ -2092,6 +2098,10 @@
|
|
|
2092
2098
|
core.Output(),
|
|
2093
2099
|
__metadata("design:type", core.EventEmitter)
|
|
2094
2100
|
], TableComponent.prototype, "unlinkAction", void 0);
|
|
2101
|
+
__decorate([
|
|
2102
|
+
core.Output(),
|
|
2103
|
+
__metadata("design:type", core.EventEmitter)
|
|
2104
|
+
], TableComponent.prototype, "linkAction", void 0);
|
|
2095
2105
|
__decorate([
|
|
2096
2106
|
core.Output(),
|
|
2097
2107
|
__metadata("design:type", core.EventEmitter)
|
|
@@ -2112,9 +2122,9 @@
|
|
|
2112
2122
|
TableComponent = __decorate([
|
|
2113
2123
|
core.Component({
|
|
2114
2124
|
selector: 'in-table',
|
|
2115
|
-
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 (onSort)=\"onSort()\"\n (onStateRestore)=\"restoreSearchText()\"\n (onStateSave)=\"stateSave($event)\"\n [(selection)]=\"selectionValue\"\n [class]=\"class\"\n [columns]=\"filteredColumns\"\n [dataKey]=\"dataKey || 'id'\"\n [globalFilterFields]=\"globalFilteredColumns\"\n [resizableColumns]=\"true\"\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 (sortFunction)=\"sortFunction? sortFunction.emit($event): null\"\n [customSort]=\"true\"\n\n>\n <ng-template let-columns pTemplate=\"colgroup\">\n <colgroup>\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 <ng-template let-columns pTemplate=\"header\">\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=\"ui-table-thead-title\"\n title=\"{{col.label | translate}}\">\n {{col.label | translate}}\n </div>\n <p-sortIcon [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\n </th>\n </tr>\n </ng-template>\n\n <ng-template *ngIf=\"bodyTemplate\" let-columns=\"columns\" let-rowIndex=\"rowIndex\" let-rowData 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=\"ui-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 class=\"c-form c-form_inline u-display-inline-block\">\n <label class=\"c-label\">\n <input #searchTextInput\n (input)=\"localSearch(dt, $event.target.value)\"\n [(ngModel)]=\"searchText\"\n autofocus=\"\"\n class=\"c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\n pInputText\n placeholder=\"{{('SHARED.SEARCH' | translate) + ':'}}\"\n tabindex=\"1\"\n type=\"search\"\n >\n </label>\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)=\"onFilter($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 <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 <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 *ngIf=\"toolbar.expandAll\"\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24\"\n (click)=\"toggleNodes(true)\"\n title=\"{{'Expand all' | translate}}\">\n <svg 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 </button>\n <button *ngIf=\"toolbar.expandAll\"\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24\"\n (click)=\"toggleNodes(false)\"\n title=\"{{'Collapse all' | translate}}\">\n <svg 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\n <div *ngIf=\"toolbar.groupSort\"\n container=\"body\"\n ngbDropdown\n class=\"c-btn-group\">\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 ngbDropdownMenu\n class=\"c-dropdown-menu c-dropdown-menu_right ng-star-inserted\"\n role=\"menu\">\n <li ngbDropdownItem\n *ngFor=\"let item of toolbar.groupSort.label\"\n class=\"c-dropdown-menu__listitem is-dropdown-menu__listitem_active\"\n [ngClass]=\"{'is-dropdown-menu__listitem_active': item.value === groupMode}\"\n role=\"menuitem\">\n <a class=\"c-dropdown-menu__content\" (click)=\"toggleMode(item.value)\">\n {{item.label}}\n </a>\n </li>\n </ul>\n </div>\n </div>\n </div>\n </ng-template>\n</p-table>\n",
|
|
2125
|
+
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 (onSort)=\"onSort()\"\n (onStateRestore)=\"restoreSearchText()\"\n (onStateSave)=\"stateSave($event)\"\n [(selection)]=\"selectionValue\"\n [class]=\"class\"\n [columns]=\"filteredColumns\"\n [dataKey]=\"dataKey || 'id'\"\n [globalFilterFields]=\"globalFilteredColumns\"\n [resizableColumns]=\"true\"\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 (sortFunction)=\"sortFunction? sortFunction.emit($event): null\"\n [customSort]=\"true\"\n\n>\n <ng-template let-columns pTemplate=\"colgroup\">\n <colgroup>\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=\"ui-table-thead-title\"\n title=\"{{col.label | translate}}\">\n {{col.label | translate}}\n </div>\n <p-sortIcon [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\n </th>\n </tr>\n </ng-container>\n </ng-template>\n\n <ng-template *ngIf=\"bodyTemplate\" let-columns=\"columns\" let-rowIndex=\"rowIndex\" let-rowData 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=\"ui-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 class=\"c-form c-form_inline u-display-inline-block\">\n <label class=\"c-label\">\n <input #searchTextInput\n (input)=\"localSearch(dt, $event.target.value)\"\n [(ngModel)]=\"searchText\"\n autofocus=\"\"\n class=\"c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\n pInputText\n placeholder=\"{{('SHARED.SEARCH' | translate) + ':'}}\"\n tabindex=\"1\"\n type=\"search\"\n >\n </label>\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)=\"onFilter($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 <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 *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 (click)=\"toggleNodes(true)\"\n title=\"{{'Expand all' | translate}}\">\n <svg 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 </button>\n <button *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 (click)=\"toggleNodes(false)\"\n title=\"{{'Collapse all' | translate}}\">\n <svg 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\n <div *ngIf=\"toolbar.groupSort\"\n container=\"body\"\n ngbDropdown\n class=\"c-btn-group\">\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 ngbDropdownMenu\n class=\"c-dropdown-menu c-dropdown-menu_right ng-star-inserted\"\n role=\"menu\">\n <li ngbDropdownItem\n *ngFor=\"let item of toolbar.groupSort.label\"\n class=\"c-dropdown-menu__listitem is-dropdown-menu__listitem_active\"\n [ngClass]=\"{'is-dropdown-menu__listitem_active': item.value === groupMode}\"\n role=\"menuitem\">\n <a class=\"c-dropdown-menu__content\" (click)=\"toggleMode(item.value)\">\n {{item.label}}\n </a>\n </li>\n </ul>\n </div>\n </div>\n </div>\n </ng-template>\n</p-table>\n",
|
|
2116
2126
|
entryComponents: [],
|
|
2117
|
-
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}"]
|
|
2127
|
+
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}input[type=search]::-webkit-search-cancel-button{-webkit-appearance:searchfield-cancel-button}"]
|
|
2118
2128
|
})
|
|
2119
2129
|
], TableComponent);
|
|
2120
2130
|
return TableComponent;
|
|
@@ -3005,7 +3015,7 @@
|
|
|
3005
3015
|
selector: 'in-tooltip',
|
|
3006
3016
|
template: "<div class=\"c-tooltip c-tooltip_left\">\n <ng-content></ng-content>\n <div class=\"c-tooltip__content\" style=\"width: 12em;\" >\n <ng-content select=\"tooltip_content\"></ng-content>\n </div>\n</div>\n\n",
|
|
3007
3017
|
changeDetection: core.ChangeDetectionStrategy.OnPush,
|
|
3008
|
-
styles: [".c-tooltip{display:inline-block;position:relative;text-align:left;overflow:visible}.c-tooltip:hover .c-tooltip__content{visibility:visible;opacity:1}.c-tooltip_left>.c-tooltip__content{left:auto;right:100%;top:50%;bottom:auto;margin-right:12px;border-top-right-radius:0}.c-tooltip__content{position:absolute;width:auto;margin:0 0 12px;padding:9px 12px;font-size:13px;font-weight:400;letter-spacing:normal;border-radius:3px;line-height:1.64286;visibility:hidden;opacity:0;transition:opacity .3s linear;z-index:1070;background:
|
|
3018
|
+
styles: [".c-tooltip{display:inline-block;position:relative;text-align:left;overflow:visible}.c-tooltip:hover .c-tooltip__content{visibility:visible;opacity:1}.c-tooltip_left>.c-tooltip__content{left:auto;right:100%;top:50%;bottom:auto;margin-right:12px;border-top-right-radius:0}.c-tooltip_left>.c-tooltip__content:before{border-top-color:var(--colorBgLevel2,#282a31);border-left-color:var(--colorBgLevel2,#282a31)}.c-tooltip__content{position:absolute;width:auto;margin:0 0 12px;padding:9px 12px;font-size:13px;font-weight:400;letter-spacing:normal;border-radius:3px;line-height:1.64286;visibility:hidden;opacity:0;transition:opacity .3s linear;z-index:1070;background:var(--colorBgLevel2,#282a31);color:var(--ids-theme-text-color,#fff);white-space:normal;text-transform:none}"]
|
|
3009
3019
|
}),
|
|
3010
3020
|
__metadata("design:paramtypes", [])
|
|
3011
3021
|
], TooltipComponent);
|
|
@@ -3261,7 +3271,7 @@
|
|
|
3261
3271
|
TreeTableComponent = __decorate([
|
|
3262
3272
|
core.Component({
|
|
3263
3273
|
selector: 'in-tree-table',
|
|
3264
|
-
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=\"ui-treetable-thead-title\" title=\"{{col.label | translate}}\">\n {{col.label | translate}}\n </div>\n <p-treeTableSortIcon [field]=\"col.field\" class=\"ui-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]=\"{ 'ui-treetable-tbody-content_has-toggler ': i == 0 }\"\n class=\"ui-treetable-tbody-content cell-content_hover\"\n style=\"flex-grow: 1;\"\n title=\"{{rowData | propertyValue: col.field}}\">\n <ng-container *ngIf=\"!valueTemplate\">\n
|
|
3274
|
+
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=\"ui-treetable-thead-title\" title=\"{{col.label | translate}}\">\n {{col.label | translate}}\n </div>\n <p-treeTableSortIcon [field]=\"col.field\" class=\"ui-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]=\"{ 'ui-treetable-tbody-content_has-toggler ': i == 0 }\"\n class=\"ui-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 <label class=\"c-label\">\n <input #searchTextInput\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n [(ngModel)]=\"searchText\"\n autofocus=\"\"\n class=\"c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\n pInputText\n placeholder=\"{{('SHARED.SEARCH' | translate) + ':'}}\"\n tabindex=\"1\"\n type=\"search\"\n >\n </label>\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",
|
|
3265
3275
|
entryComponents: [],
|
|
3266
3276
|
styles: ["@charset \"UTF-8\";.ui-sortable-column{cursor:pointer;position:relative}.ui-sortable-column-buttons{position:absolute;top:0;right:0;width:18px;height:100%;display:inline-flex;align-items:center;z-index:10000}.ui-sortable-column-buttons>a{position:absolute;top:50%;right:0;left:0;transform:translateY(-50%)}.u-overflow-visible{overflow:visible!important}"]
|
|
3267
3277
|
})
|
|
@@ -3558,6 +3568,201 @@
|
|
|
3558
3568
|
return ContentToggleComponent;
|
|
3559
3569
|
}());
|
|
3560
3570
|
|
|
3571
|
+
var InputGroupComponent = /** @class */ (function () {
|
|
3572
|
+
function InputGroupComponent() {
|
|
3573
|
+
this.name = null;
|
|
3574
|
+
this.measureunit = null;
|
|
3575
|
+
this.autocomplete = true;
|
|
3576
|
+
this.label = null;
|
|
3577
|
+
this.required = false;
|
|
3578
|
+
this.error = null;
|
|
3579
|
+
this.size = 100000;
|
|
3580
|
+
this.maxlength = 100000;
|
|
3581
|
+
this.width = 'auto';
|
|
3582
|
+
this.placeholder = '';
|
|
3583
|
+
this.id = null;
|
|
3584
|
+
this.testId = null;
|
|
3585
|
+
this.opacity = true;
|
|
3586
|
+
this.shadow = false;
|
|
3587
|
+
this.isEditMode = true;
|
|
3588
|
+
this.focus = new core.EventEmitter();
|
|
3589
|
+
this.blur = new core.EventEmitter();
|
|
3590
|
+
this.updateValue = new core.EventEmitter();
|
|
3591
|
+
this.disableEditableView = new core.EventEmitter();
|
|
3592
|
+
this.validators = [/^-?\d*\.?\d*$/];
|
|
3593
|
+
this.isEditable = true;
|
|
3594
|
+
this.propagateChange = function (_) {
|
|
3595
|
+
};
|
|
3596
|
+
}
|
|
3597
|
+
InputGroupComponent_1 = InputGroupComponent;
|
|
3598
|
+
InputGroupComponent.prototype.ngOnInit = function () {
|
|
3599
|
+
this._value = this.value;
|
|
3600
|
+
};
|
|
3601
|
+
/**
|
|
3602
|
+
* Write form value to the DOM element (model => view)
|
|
3603
|
+
*/
|
|
3604
|
+
InputGroupComponent.prototype.writeValue = function (value) {
|
|
3605
|
+
this.value = value ? value : this.name;
|
|
3606
|
+
this._value = this.value;
|
|
3607
|
+
};
|
|
3608
|
+
/**
|
|
3609
|
+
* Write form disabled state to the DOM element (model => view)
|
|
3610
|
+
*/
|
|
3611
|
+
InputGroupComponent.prototype.setDisabledState = function (isDisabled) {
|
|
3612
|
+
this.disabled = isDisabled;
|
|
3613
|
+
};
|
|
3614
|
+
/**
|
|
3615
|
+
* Update form when DOM element value changes (view => model)
|
|
3616
|
+
*/
|
|
3617
|
+
InputGroupComponent.prototype.registerOnChange = function (fn) {
|
|
3618
|
+
// Store the provided function as an internal method.
|
|
3619
|
+
this.propagateChange = fn;
|
|
3620
|
+
};
|
|
3621
|
+
/**
|
|
3622
|
+
* Update form when DOM element is blurred (view => model)
|
|
3623
|
+
*/
|
|
3624
|
+
InputGroupComponent.prototype.registerOnTouched = function (fn) {
|
|
3625
|
+
// Store the provided function as an internal method.
|
|
3626
|
+
this.onTouched = fn;
|
|
3627
|
+
};
|
|
3628
|
+
InputGroupComponent.prototype.onChange = function (_) {
|
|
3629
|
+
this.propagateChange(this.value);
|
|
3630
|
+
};
|
|
3631
|
+
InputGroupComponent.prototype.onTouched = function () {
|
|
3632
|
+
};
|
|
3633
|
+
InputGroupComponent.prototype.cancel = function () {
|
|
3634
|
+
this.isEditable = false;
|
|
3635
|
+
this.disableEditableView.emit(false);
|
|
3636
|
+
this.value = this._value;
|
|
3637
|
+
};
|
|
3638
|
+
InputGroupComponent.prototype.numberOnly = function (event) {
|
|
3639
|
+
if (event.keyCode === 8) {
|
|
3640
|
+
return true;
|
|
3641
|
+
}
|
|
3642
|
+
var test = '';
|
|
3643
|
+
if (this.value) {
|
|
3644
|
+
test = this.value + event.key;
|
|
3645
|
+
}
|
|
3646
|
+
else {
|
|
3647
|
+
test = event.key;
|
|
3648
|
+
}
|
|
3649
|
+
return this.validators[0].test(test);
|
|
3650
|
+
};
|
|
3651
|
+
InputGroupComponent.prototype.changeEditMode = function () {
|
|
3652
|
+
this.isEditable = !this.isEditable;
|
|
3653
|
+
};
|
|
3654
|
+
//
|
|
3655
|
+
// disableEditableView() {
|
|
3656
|
+
// this.isEditableView.emit(false);
|
|
3657
|
+
// }
|
|
3658
|
+
InputGroupComponent.prototype.changeValue = function (value) {
|
|
3659
|
+
this.value = value;
|
|
3660
|
+
this._value = this.value;
|
|
3661
|
+
// this.isEditable = false;
|
|
3662
|
+
this.updateValue.emit(value);
|
|
3663
|
+
this.disableEditableView.emit(false);
|
|
3664
|
+
};
|
|
3665
|
+
InputGroupComponent.prototype.isApplyDisabled = function () {
|
|
3666
|
+
return this.value != null ? false : true;
|
|
3667
|
+
};
|
|
3668
|
+
var InputGroupComponent_1;
|
|
3669
|
+
__decorate([
|
|
3670
|
+
core.Input(),
|
|
3671
|
+
__metadata("design:type", Object)
|
|
3672
|
+
], InputGroupComponent.prototype, "name", void 0);
|
|
3673
|
+
__decorate([
|
|
3674
|
+
core.Input(),
|
|
3675
|
+
__metadata("design:type", Object)
|
|
3676
|
+
], InputGroupComponent.prototype, "measureunit", void 0);
|
|
3677
|
+
__decorate([
|
|
3678
|
+
core.Input(),
|
|
3679
|
+
__metadata("design:type", Object)
|
|
3680
|
+
], InputGroupComponent.prototype, "autocomplete", void 0);
|
|
3681
|
+
__decorate([
|
|
3682
|
+
core.Input(),
|
|
3683
|
+
__metadata("design:type", Object)
|
|
3684
|
+
], InputGroupComponent.prototype, "label", void 0);
|
|
3685
|
+
__decorate([
|
|
3686
|
+
core.Input(),
|
|
3687
|
+
__metadata("design:type", Object)
|
|
3688
|
+
], InputGroupComponent.prototype, "required", void 0);
|
|
3689
|
+
__decorate([
|
|
3690
|
+
core.Input(),
|
|
3691
|
+
__metadata("design:type", Object)
|
|
3692
|
+
], InputGroupComponent.prototype, "error", void 0);
|
|
3693
|
+
__decorate([
|
|
3694
|
+
core.Input(),
|
|
3695
|
+
__metadata("design:type", Object)
|
|
3696
|
+
], InputGroupComponent.prototype, "size", void 0);
|
|
3697
|
+
__decorate([
|
|
3698
|
+
core.Input(),
|
|
3699
|
+
__metadata("design:type", Object)
|
|
3700
|
+
], InputGroupComponent.prototype, "maxlength", void 0);
|
|
3701
|
+
__decorate([
|
|
3702
|
+
core.Input(),
|
|
3703
|
+
__metadata("design:type", Object)
|
|
3704
|
+
], InputGroupComponent.prototype, "width", void 0);
|
|
3705
|
+
__decorate([
|
|
3706
|
+
core.Input(),
|
|
3707
|
+
__metadata("design:type", Object)
|
|
3708
|
+
], InputGroupComponent.prototype, "placeholder", void 0);
|
|
3709
|
+
__decorate([
|
|
3710
|
+
core.Input(),
|
|
3711
|
+
__metadata("design:type", Object)
|
|
3712
|
+
], InputGroupComponent.prototype, "id", void 0);
|
|
3713
|
+
__decorate([
|
|
3714
|
+
core.Input(),
|
|
3715
|
+
__metadata("design:type", Object)
|
|
3716
|
+
], InputGroupComponent.prototype, "testId", void 0);
|
|
3717
|
+
__decorate([
|
|
3718
|
+
core.Input(),
|
|
3719
|
+
__metadata("design:type", Boolean)
|
|
3720
|
+
], InputGroupComponent.prototype, "disabled", void 0);
|
|
3721
|
+
__decorate([
|
|
3722
|
+
core.Input(),
|
|
3723
|
+
__metadata("design:type", Object)
|
|
3724
|
+
], InputGroupComponent.prototype, "opacity", void 0);
|
|
3725
|
+
__decorate([
|
|
3726
|
+
core.Input(),
|
|
3727
|
+
__metadata("design:type", Object)
|
|
3728
|
+
], InputGroupComponent.prototype, "shadow", void 0);
|
|
3729
|
+
__decorate([
|
|
3730
|
+
core.Input(),
|
|
3731
|
+
__metadata("design:type", Object)
|
|
3732
|
+
], InputGroupComponent.prototype, "isEditMode", void 0);
|
|
3733
|
+
__decorate([
|
|
3734
|
+
core.Output(),
|
|
3735
|
+
__metadata("design:type", core.EventEmitter)
|
|
3736
|
+
], InputGroupComponent.prototype, "focus", void 0);
|
|
3737
|
+
__decorate([
|
|
3738
|
+
core.Output(),
|
|
3739
|
+
__metadata("design:type", core.EventEmitter)
|
|
3740
|
+
], InputGroupComponent.prototype, "blur", void 0);
|
|
3741
|
+
__decorate([
|
|
3742
|
+
core.Output(),
|
|
3743
|
+
__metadata("design:type", core.EventEmitter)
|
|
3744
|
+
], InputGroupComponent.prototype, "updateValue", void 0);
|
|
3745
|
+
__decorate([
|
|
3746
|
+
core.Output(),
|
|
3747
|
+
__metadata("design:type", core.EventEmitter)
|
|
3748
|
+
], InputGroupComponent.prototype, "disableEditableView", void 0);
|
|
3749
|
+
InputGroupComponent = InputGroupComponent_1 = __decorate([
|
|
3750
|
+
core.Component({
|
|
3751
|
+
selector: 'in-input-group',
|
|
3752
|
+
template: "<label class=\"label type_varchars\">\n <div class=\"ui-inputgroup\">\n <span class=\"ui-inputgroup-addon ui-inputgroup-addon_trancated\" title=\"{{measureunit}}\">\n <span class=\"ui-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=\"ui-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",
|
|
3753
|
+
providers: [
|
|
3754
|
+
{
|
|
3755
|
+
provide: forms.NG_VALUE_ACCESSOR,
|
|
3756
|
+
useExisting: core.forwardRef(function () { return InputGroupComponent_1; }),
|
|
3757
|
+
multi: true,
|
|
3758
|
+
}
|
|
3759
|
+
],
|
|
3760
|
+
styles: [""]
|
|
3761
|
+
})
|
|
3762
|
+
], InputGroupComponent);
|
|
3763
|
+
return InputGroupComponent;
|
|
3764
|
+
}());
|
|
3765
|
+
|
|
3561
3766
|
var InsparkComponentsModule = /** @class */ (function () {
|
|
3562
3767
|
function InsparkComponentsModule() {
|
|
3563
3768
|
}
|
|
@@ -3606,7 +3811,8 @@
|
|
|
3606
3811
|
TooltipComponent,
|
|
3607
3812
|
RadiobuttonComponent,
|
|
3608
3813
|
ObjectTreeComponent,
|
|
3609
|
-
ContentToggleComponent
|
|
3814
|
+
ContentToggleComponent,
|
|
3815
|
+
InputGroupComponent,
|
|
3610
3816
|
],
|
|
3611
3817
|
exports: [
|
|
3612
3818
|
ButtonComponent,
|
|
@@ -3640,7 +3846,8 @@
|
|
|
3640
3846
|
TooltipComponent,
|
|
3641
3847
|
RadiobuttonComponent,
|
|
3642
3848
|
ObjectTreeComponent,
|
|
3643
|
-
ContentToggleComponent
|
|
3849
|
+
ContentToggleComponent,
|
|
3850
|
+
InputGroupComponent
|
|
3644
3851
|
],
|
|
3645
3852
|
entryComponents: [SelectListComponent, ModalInputTextComponent],
|
|
3646
3853
|
schemas: [core.NO_ERRORS_SCHEMA]
|
|
@@ -3751,6 +3958,7 @@
|
|
|
3751
3958
|
exports.ɵm = TableColumnsMultiselectComponent;
|
|
3752
3959
|
exports.ɵn = TableMenuOverlayComponent;
|
|
3753
3960
|
exports.ɵo = TableClickOutsideDirective;
|
|
3961
|
+
exports.ɵp = InputGroupComponent;
|
|
3754
3962
|
|
|
3755
3963
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
3756
3964
|
|