boruto-xrmui 1.0.57 → 1.22.1
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/fesm2022/boruto-xrmui.mjs +310 -226
- package/fesm2022/boruto-xrmui.mjs.map +1 -1
- package/package.json +7 -6
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { ViewEncapsulation, Component, effect, input, output, HostListener, Directive, inject, ElementRef, Input, signal, ChangeDetectorRef, ViewChild, NgModule, Injectable, computed, DestroyRef, model, ViewChildren, EventEmitter, Output } from '@angular/core';
|
|
2
|
+
import { ViewEncapsulation, ChangeDetectionStrategy, Component, effect, input, output, HostListener, Directive, inject, ElementRef, Input, signal, ChangeDetectorRef, ViewChild, NgModule, Injectable, computed, DestroyRef, model, ViewChildren, EventEmitter, Output } from '@angular/core';
|
|
3
3
|
import { NgClass, NgStyle } from '@angular/common';
|
|
4
4
|
import { NativeDateAdapter } from '@angular/material/core';
|
|
5
5
|
import { MatIcon, MatIconModule } from '@angular/material/icon';
|
|
@@ -21,12 +21,12 @@ import { MatButtonModule } from '@angular/material/button';
|
|
|
21
21
|
class KoButtonGroupComponent {
|
|
22
22
|
constructor() {
|
|
23
23
|
}
|
|
24
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
25
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
24
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
25
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.1", type: KoButtonGroupComponent, isStandalone: true, selector: "ko-button-group", ngImport: i0, template: "<ng-content></ng-content>", styles: ["ko-button-group{position:absolute;inset:0;padding:2px}ko-button-group input,ko-button-group button{display:inline-block;margin-left:2px}ko-button-group div.divider{display:inline-block;width:1px;height:20px;background-color:#d3d3d3;overflow:hidden;margin-left:2px}ko-button-group button{border:solid;border-width:1px 1px 1px 1px;border-color:#000;color:#000;background-color:#fff;padding:2px 5px;cursor:pointer}ko-button-group button:disabled,ko-button-group button[disabled]{border-color:#d3d3d3;color:#d3d3d3;cursor:not-allowed}ko-button-group button:hover{background-color:#d3d3d3}ko-button-group button:disabled:hover,ko-button-group button[disabled]:hover{background-color:#fff}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
26
26
|
}
|
|
27
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
27
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoButtonGroupComponent, decorators: [{
|
|
28
28
|
type: Component,
|
|
29
|
-
args: [{ selector: 'ko-button-group', encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>", styles: ["ko-button-group{position:absolute;inset:0;padding:2px}ko-button-group input,ko-button-group button{display:inline-block;margin-left:2px}ko-button-group div.divider{display:inline-block;width:1px;height:20px;background-color:#d3d3d3;overflow:hidden;margin-left:2px}ko-button-group button{border:solid;border-width:1px 1px 1px 1px;border-color:#000;color:#000;background-color:#fff;padding:2px 5px;cursor:pointer}ko-button-group button:disabled,ko-button-group button[disabled]{border-color:#d3d3d3;color:#d3d3d3;cursor:not-allowed}ko-button-group button:hover{background-color:#d3d3d3}ko-button-group button:disabled:hover,ko-button-group button[disabled]:hover{background-color:#fff}\n"] }]
|
|
29
|
+
args: [{ selector: 'ko-button-group', changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>", styles: ["ko-button-group{position:absolute;inset:0;padding:2px}ko-button-group input,ko-button-group button{display:inline-block;margin-left:2px}ko-button-group div.divider{display:inline-block;width:1px;height:20px;background-color:#d3d3d3;overflow:hidden;margin-left:2px}ko-button-group button{border:solid;border-width:1px 1px 1px 1px;border-color:#000;color:#000;background-color:#fff;padding:2px 5px;cursor:pointer}ko-button-group button:disabled,ko-button-group button[disabled]{border-color:#d3d3d3;color:#d3d3d3;cursor:not-allowed}ko-button-group button:hover{background-color:#d3d3d3}ko-button-group button:disabled:hover,ko-button-group button[disabled]:hover{background-color:#fff}\n"] }]
|
|
30
30
|
}], ctorParameters: () => [] });
|
|
31
31
|
|
|
32
32
|
class KoDecimalDirective {
|
|
@@ -44,10 +44,11 @@ class KoDecimalDirective {
|
|
|
44
44
|
this.setValueString();
|
|
45
45
|
});
|
|
46
46
|
}
|
|
47
|
-
decimals = input(2, { ...(ngDevMode ? { debugName: "decimals" } : {}), alias: 'ko-decimals' });
|
|
48
|
-
value = input(null, { ...(ngDevMode ? { debugName: "value" } : {}), alias: 'ko-value' });
|
|
47
|
+
decimals = input(2, { ...(ngDevMode ? { debugName: "decimals" } : /* istanbul ignore next */ {}), alias: 'ko-decimals' });
|
|
48
|
+
value = input(null, { ...(ngDevMode ? { debugName: "value" } : /* istanbul ignore next */ {}), alias: 'ko-value' });
|
|
49
49
|
valueChanged = output({ alias: 'ko-valueChange' });
|
|
50
|
-
align = input('right',
|
|
50
|
+
align = input('right', /* @ts-ignore */
|
|
51
|
+
...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
|
|
51
52
|
controlDown = false;
|
|
52
53
|
syncThread;
|
|
53
54
|
onKeydown($event) {
|
|
@@ -167,10 +168,10 @@ class KoDecimalDirective {
|
|
|
167
168
|
var roundedValue = Math.round(value * round) / round;
|
|
168
169
|
return this.numberToString(roundedValue, decimals);
|
|
169
170
|
}
|
|
170
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
171
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
171
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoDecimalDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
172
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.1", type: KoDecimalDirective, isStandalone: true, selector: "[ko-decimal]", inputs: { decimals: { classPropertyName: "decimals", publicName: "ko-decimals", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "ko-value", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChanged: "ko-valueChange" }, host: { listeners: { "keydown": "onKeydown($event)", "blur": "onBlur()" } }, ngImport: i0 });
|
|
172
173
|
}
|
|
173
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
174
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoDecimalDirective, decorators: [{
|
|
174
175
|
type: Directive,
|
|
175
176
|
args: [{
|
|
176
177
|
selector: '[ko-decimal]'
|
|
@@ -185,7 +186,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
|
|
|
185
186
|
|
|
186
187
|
class KoFocusDirective {
|
|
187
188
|
hostElement = inject(ElementRef);
|
|
188
|
-
focus = input(false, { ...(ngDevMode ? { debugName: "focus" } : {}), alias: 'ko-focus' });
|
|
189
|
+
focus = input(false, { ...(ngDevMode ? { debugName: "focus" } : /* istanbul ignore next */ {}), alias: 'ko-focus' });
|
|
189
190
|
focusChange = output({ alias: 'ko-focusChange' });
|
|
190
191
|
constructor() {
|
|
191
192
|
effect(() => {
|
|
@@ -198,10 +199,10 @@ class KoFocusDirective {
|
|
|
198
199
|
}
|
|
199
200
|
});
|
|
200
201
|
}
|
|
201
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
202
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
202
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoFocusDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
203
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.1", type: KoFocusDirective, isStandalone: true, selector: "[ko-focus]", inputs: { focus: { classPropertyName: "focus", publicName: "ko-focus", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { focusChange: "ko-focusChange" }, ngImport: i0 });
|
|
203
204
|
}
|
|
204
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
205
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoFocusDirective, decorators: [{
|
|
205
206
|
type: Directive,
|
|
206
207
|
args: [{ selector: '[ko-focus]' }]
|
|
207
208
|
}], ctorParameters: () => [], propDecorators: { focus: [{ type: i0.Input, args: [{ isSignal: true, alias: "ko-focus", required: false }] }], focusChange: [{ type: i0.Output, args: ["ko-focusChange"] }] } });
|
|
@@ -210,29 +211,30 @@ class KoAlertComponent {
|
|
|
210
211
|
align = 'left';
|
|
211
212
|
constructor() {
|
|
212
213
|
}
|
|
213
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
214
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
214
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
215
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.1", type: KoAlertComponent, isStandalone: true, selector: "ko-alert", inputs: { align: "align" }, ngImport: i0, template: "<div [ngClass]=\"align\"><ng-content></ng-content></div>\r\n", styles: ["ko-alert{position:absolute;inset:0;transition:opacity 1s;overflow:hidden;border:none}ko-alert.warning{background-color:#fff19d;border:none}ko-alert.success{background-color:#247d2d;color:#fff;border:none}ko-alert.danger{background-color:#d12806;color:#fff;border:none}ko-alert:before{content:\"\";display:inline-block;vertical-align:middle;height:100%}ko-alert>div{display:inline-block;vertical-align:middle;margin-left:15px;margin-right:15px;width:calc(100% - 30px)}ko-alert.large>div{font-size:large}ko-alert>div.left{text-align:left}ko-alert div.right{text-align:right}ko-alert div.center{text-align:center}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
215
216
|
}
|
|
216
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
217
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoAlertComponent, decorators: [{
|
|
217
218
|
type: Component,
|
|
218
|
-
args: [{ selector: 'ko-alert', imports: [NgClass], encapsulation: ViewEncapsulation.None, template: "<div [ngClass]=\"align\"><ng-content></ng-content></div>\r\n", styles: ["ko-alert{position:absolute;inset:0;transition:opacity 1s;overflow:hidden;border:none}ko-alert.warning{background-color:#fff19d;border:none}ko-alert.success{background-color:#247d2d;color:#fff;border:none}ko-alert.danger{background-color:#d12806;color:#fff;border:none}ko-alert:before{content:\"\";display:inline-block;vertical-align:middle;height:100%}ko-alert>div{display:inline-block;vertical-align:middle;margin-left:15px;margin-right:15px;width:calc(100% - 30px)}ko-alert.large>div{font-size:large}ko-alert>div.left{text-align:left}ko-alert div.right{text-align:right}ko-alert div.center{text-align:center}\n"] }]
|
|
219
|
+
args: [{ selector: 'ko-alert', imports: [NgClass], changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<div [ngClass]=\"align\"><ng-content></ng-content></div>\r\n", styles: ["ko-alert{position:absolute;inset:0;transition:opacity 1s;overflow:hidden;border:none}ko-alert.warning{background-color:#fff19d;border:none}ko-alert.success{background-color:#247d2d;color:#fff;border:none}ko-alert.danger{background-color:#d12806;color:#fff;border:none}ko-alert:before{content:\"\";display:inline-block;vertical-align:middle;height:100%}ko-alert>div{display:inline-block;vertical-align:middle;margin-left:15px;margin-right:15px;width:calc(100% - 30px)}ko-alert.large>div{font-size:large}ko-alert>div.left{text-align:left}ko-alert div.right{text-align:right}ko-alert div.center{text-align:center}\n"] }]
|
|
219
220
|
}], ctorParameters: () => [], propDecorators: { align: [{
|
|
220
221
|
type: Input,
|
|
221
222
|
args: ['align']
|
|
222
223
|
}] } });
|
|
223
224
|
|
|
224
225
|
class KoHeaderComponent {
|
|
225
|
-
align = input('left',
|
|
226
|
-
|
|
227
|
-
static
|
|
226
|
+
align = input('left', /* @ts-ignore */
|
|
227
|
+
...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
|
|
228
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
229
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: KoHeaderComponent, isStandalone: true, selector: "ko-header", inputs: { align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div [ngClass]=\"align()\"><ng-content></ng-content></div>\r\n", styles: ["ko-header{position:absolute;inset:0;transition:opacity 1s;overflow:hidden;border:none}ko-header.warning{background-color:#fff19d;border:none}ko-header:before{content:\"\";display:inline-block;vertical-align:middle;height:100%}ko-header>div{display:inline-block;vertical-align:middle;margin-left:15px;margin-right:15px;font-size:large;width:calc(100% - 30px)}ko-header>div.left{text-align:left}ko-header div.right{text-align:right}ko-header div.center{text-align:center}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
228
230
|
}
|
|
229
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
231
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoHeaderComponent, decorators: [{
|
|
230
232
|
type: Component,
|
|
231
|
-
args: [{ selector: 'ko-header', imports: [NgClass], encapsulation: ViewEncapsulation.None, template: "<div [ngClass]=\"align()\"><ng-content></ng-content></div>\r\n", styles: ["ko-header{position:absolute;inset:0;transition:opacity 1s;overflow:hidden;border:none}ko-header.warning{background-color:#fff19d;border:none}ko-header:before{content:\"\";display:inline-block;vertical-align:middle;height:100%}ko-header>div{display:inline-block;vertical-align:middle;margin-left:15px;margin-right:15px;font-size:large;width:calc(100% - 30px)}ko-header>div.left{text-align:left}ko-header div.right{text-align:right}ko-header div.center{text-align:center}\n"] }]
|
|
233
|
+
args: [{ selector: 'ko-header', imports: [NgClass], changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<div [ngClass]=\"align()\"><ng-content></ng-content></div>\r\n", styles: ["ko-header{position:absolute;inset:0;transition:opacity 1s;overflow:hidden;border:none}ko-header.warning{background-color:#fff19d;border:none}ko-header:before{content:\"\";display:inline-block;vertical-align:middle;height:100%}ko-header>div{display:inline-block;vertical-align:middle;margin-left:15px;margin-right:15px;font-size:large;width:calc(100% - 30px)}ko-header>div.left{text-align:left}ko-header div.right{text-align:right}ko-header div.center{text-align:center}\n"] }]
|
|
232
234
|
}], propDecorators: { align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }] } });
|
|
233
235
|
|
|
234
236
|
class KoWriteDirective {
|
|
235
|
-
direction = input('up', { ...(ngDevMode ? { debugName: "direction" } : {}), alias: 'ko-write' });
|
|
237
|
+
direction = input('up', { ...(ngDevMode ? { debugName: "direction" } : /* istanbul ignore next */ {}), alias: 'ko-write' });
|
|
236
238
|
hostElement = inject(ElementRef);
|
|
237
239
|
constructor() {
|
|
238
240
|
effect(() => {
|
|
@@ -266,10 +268,10 @@ class KoWriteDirective {
|
|
|
266
268
|
}
|
|
267
269
|
}
|
|
268
270
|
}
|
|
269
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
270
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
271
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoWriteDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
272
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.1", type: KoWriteDirective, isStandalone: true, selector: "[ko-write]", inputs: { direction: { classPropertyName: "direction", publicName: "ko-write", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
|
|
271
273
|
}
|
|
272
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
274
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoWriteDirective, decorators: [{
|
|
273
275
|
type: Directive,
|
|
274
276
|
args: [{ selector: '[ko-write]' }]
|
|
275
277
|
}], ctorParameters: () => [], propDecorators: { direction: [{ type: i0.Input, args: [{ isSignal: true, alias: "ko-write", required: false }] }] } });
|
|
@@ -323,11 +325,15 @@ class KoNavigationByImageUrl {
|
|
|
323
325
|
|
|
324
326
|
class KoLeftMenuComponent {
|
|
325
327
|
er = inject(ElementRef);
|
|
326
|
-
items = input([],
|
|
327
|
-
|
|
328
|
+
items = input([], /* @ts-ignore */
|
|
329
|
+
...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
330
|
+
current = input(null, /* @ts-ignore */
|
|
331
|
+
...(ngDevMode ? [{ debugName: "current" }] : /* istanbul ignore next */ []));
|
|
328
332
|
currentChange = output();
|
|
329
|
-
itemheight$ = signal('',
|
|
330
|
-
|
|
333
|
+
itemheight$ = signal('', /* @ts-ignore */
|
|
334
|
+
...(ngDevMode ? [{ debugName: "itemheight$" }] : /* istanbul ignore next */ []));
|
|
335
|
+
over = signal(null, /* @ts-ignore */
|
|
336
|
+
...(ngDevMode ? [{ debugName: "over" }] : /* istanbul ignore next */ []));
|
|
331
337
|
constructor() {
|
|
332
338
|
}
|
|
333
339
|
itemheight(v) {
|
|
@@ -359,21 +365,25 @@ class KoLeftMenuComponent {
|
|
|
359
365
|
outItem() {
|
|
360
366
|
this.over.set(null);
|
|
361
367
|
}
|
|
362
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
363
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
368
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoLeftMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
369
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: KoLeftMenuComponent, isStandalone: true, selector: "ko-left-menu", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, current: { classPropertyName: "current", publicName: "current", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { currentChange: "currentChange" }, ngImport: i0, template: "@for(item of items(); track item) {\r\n<div\r\n (click)=\"setCurrent(item)\"\r\n class=\"ko-left-menu-item\"\r\n [ngClass]=\"{ current: item.id == current(), disabled: item.disabled == true && item.id != '##divider##', over: item == over(), divider: item.id == '##divider##' }\"\r\n (mouseover)=\"overItem(item)\"\r\n (mouseleave)=\"outItem()\"\r\n [style.height]=\"itemheight(item)\"\r\n >\r\n @if (item.title != null && item.title != '' && item.id != '##divider##' && item.cssClass == null && item.imgUrl == null){<span>{{ item.title }}</span>}\r\n @if (item.cssClass != null && item.cssClass != ''){ <span class=\"byclass\" [ngClass]=\"item.cssClass\" [title]=\"item.title\"></span> }\r\n @if (item.imgUrl != null){<img [src]=\"item.imgUrl\" [alt]=\"item.title\" />}\r\n</div>\r\n}\r\n<ng-content></ng-content>\r\n", styles: ["ko-left-menu{position:absolute;inset:0;background-color:#000;color:#f5f5f5;display:block}ko-left-menu>div.ko-left-menu-item{background-color:#31353a;color:#f7f4f2;padding:20px;cursor:pointer;width:calc(100% - 40px)}ko-left-menu>div.ko-left-menu-item.disabled{color:#dee2e8;cursor:not-allowed}ko-left-menu>div.ko-left-menu-item.current{padding:20px 16px 20px 20px;border:solid;border-width:0 4px 0 0;border-color:#ce5206;color:#fff}ko-left-menu>div.ko-left-menu-item.over{color:#ce5206}ko-left-menu>div.ko-left-menu-item.divider{height:2px;cursor:none;padding:0;margin:0;width:calc(100% - 30px);border:solid;border-width:0 15px 0 15px;border-color:#31353a;background-color:#dee2e8;overflow:hidden}ko-left-menu span.byclass{display:inline-block;width:100%;height:100%}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
364
370
|
}
|
|
365
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
371
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoLeftMenuComponent, decorators: [{
|
|
366
372
|
type: Component,
|
|
367
|
-
args: [{ selector: 'ko-left-menu', imports: [NgClass], encapsulation: ViewEncapsulation.None, template: "@for(item of items(); track item) {\r\n<div\r\n (click)=\"setCurrent(item)\"\r\n class=\"ko-left-menu-item\"\r\n [ngClass]=\"{ current: item.id == current(), disabled: item.disabled == true && item.id != '##divider##', over: item == over(), divider: item.id == '##divider##' }\"\r\n (mouseover)=\"overItem(item)\"\r\n (mouseleave)=\"outItem()\"\r\n [style.height]=\"itemheight(item)\"\r\n >\r\n @if (item.title != null && item.title != '' && item.id != '##divider##' && item.cssClass == null && item.imgUrl == null){<span>{{ item.title }}</span>}\r\n @if (item.cssClass != null && item.cssClass != ''){ <span class=\"byclass\" [ngClass]=\"item.cssClass\" [title]=\"item.title\"></span> }\r\n @if (item.imgUrl != null){<img [src]=\"item.imgUrl\" [alt]=\"item.title\" />}\r\n</div>\r\n}\r\n<ng-content></ng-content>\r\n", styles: ["ko-left-menu{position:absolute;inset:0;background-color:#000;color:#f5f5f5;display:block}ko-left-menu>div.ko-left-menu-item{background-color:#31353a;color:#f7f4f2;padding:20px;cursor:pointer;width:calc(100% - 40px)}ko-left-menu>div.ko-left-menu-item.disabled{color:#dee2e8;cursor:not-allowed}ko-left-menu>div.ko-left-menu-item.current{padding:20px 16px 20px 20px;border:solid;border-width:0 4px 0 0;border-color:#ce5206;color:#fff}ko-left-menu>div.ko-left-menu-item.over{color:#ce5206}ko-left-menu>div.ko-left-menu-item.divider{height:2px;cursor:none;padding:0;margin:0;width:calc(100% - 30px);border:solid;border-width:0 15px 0 15px;border-color:#31353a;background-color:#dee2e8;overflow:hidden}ko-left-menu span.byclass{display:inline-block;width:100%;height:100%}\n"] }]
|
|
373
|
+
args: [{ selector: 'ko-left-menu', imports: [NgClass], changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "@for(item of items(); track item) {\r\n<div\r\n (click)=\"setCurrent(item)\"\r\n class=\"ko-left-menu-item\"\r\n [ngClass]=\"{ current: item.id == current(), disabled: item.disabled == true && item.id != '##divider##', over: item == over(), divider: item.id == '##divider##' }\"\r\n (mouseover)=\"overItem(item)\"\r\n (mouseleave)=\"outItem()\"\r\n [style.height]=\"itemheight(item)\"\r\n >\r\n @if (item.title != null && item.title != '' && item.id != '##divider##' && item.cssClass == null && item.imgUrl == null){<span>{{ item.title }}</span>}\r\n @if (item.cssClass != null && item.cssClass != ''){ <span class=\"byclass\" [ngClass]=\"item.cssClass\" [title]=\"item.title\"></span> }\r\n @if (item.imgUrl != null){<img [src]=\"item.imgUrl\" [alt]=\"item.title\" />}\r\n</div>\r\n}\r\n<ng-content></ng-content>\r\n", styles: ["ko-left-menu{position:absolute;inset:0;background-color:#000;color:#f5f5f5;display:block}ko-left-menu>div.ko-left-menu-item{background-color:#31353a;color:#f7f4f2;padding:20px;cursor:pointer;width:calc(100% - 40px)}ko-left-menu>div.ko-left-menu-item.disabled{color:#dee2e8;cursor:not-allowed}ko-left-menu>div.ko-left-menu-item.current{padding:20px 16px 20px 20px;border:solid;border-width:0 4px 0 0;border-color:#ce5206;color:#fff}ko-left-menu>div.ko-left-menu-item.over{color:#ce5206}ko-left-menu>div.ko-left-menu-item.divider{height:2px;cursor:none;padding:0;margin:0;width:calc(100% - 30px);border:solid;border-width:0 15px 0 15px;border-color:#31353a;background-color:#dee2e8;overflow:hidden}ko-left-menu span.byclass{display:inline-block;width:100%;height:100%}\n"] }]
|
|
368
374
|
}], ctorParameters: () => [], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], current: [{ type: i0.Input, args: [{ isSignal: true, alias: "current", required: false }] }], currentChange: [{ type: i0.Output, args: ["currentChange"] }] } });
|
|
369
375
|
|
|
370
376
|
class KoTopMenuComponent {
|
|
371
377
|
er = inject(ElementRef);
|
|
372
|
-
items = input([],
|
|
373
|
-
|
|
378
|
+
items = input([], /* @ts-ignore */
|
|
379
|
+
...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
380
|
+
current = input(null, /* @ts-ignore */
|
|
381
|
+
...(ngDevMode ? [{ debugName: "current" }] : /* istanbul ignore next */ []));
|
|
374
382
|
currentChange = output();
|
|
375
|
-
over = signal(null,
|
|
376
|
-
|
|
383
|
+
over = signal(null, /* @ts-ignore */
|
|
384
|
+
...(ngDevMode ? [{ debugName: "over" }] : /* istanbul ignore next */ []));
|
|
385
|
+
topcornerwidth = signal('', /* @ts-ignore */
|
|
386
|
+
...(ngDevMode ? [{ debugName: "topcornerwidth" }] : /* istanbul ignore next */ []));
|
|
377
387
|
constructor() {
|
|
378
388
|
}
|
|
379
389
|
ngAfterViewInit() {
|
|
@@ -405,19 +415,19 @@ class KoTopMenuComponent {
|
|
|
405
415
|
outItem() {
|
|
406
416
|
this.over.set(null);
|
|
407
417
|
}
|
|
408
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
409
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
418
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoTopMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
419
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: KoTopMenuComponent, isStandalone: true, selector: "ko-top-menu", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, current: { classPropertyName: "current", publicName: "current", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { currentChange: "currentChange" }, ngImport: i0, template: "<div class=\"ko-top-menu-corner\" [style.width]=\"topcornerwidth()\"></div>\r\n@for (item of items(); track item) {\r\n<div (click)=\"setCurrent(item)\"\r\n class=\"ko-top-menu-item\"\r\n [ngClass]=\"{ current: item.id == current(), disabled: item.disabled == true && item.id != '##divider##', over: item == over(), divider: item.id == '##divider##' }\"\r\n (mouseover)=\"overItem(item)\"\r\n (mouseleave)=\"outItem()\"\r\n [style.width]=\"itemwidth(item)\">\r\n @if (item.title != null && item.title != '' && item.id != '##divider##' && item.cssClass==null && item.imgUrl==null) {<span>{{ item.title }}</span>}\r\n @if (item.cssClass != null && item.cssClass != ''){<span class=\"byclass\" [ngClass]=\"item.cssClass\" [title]=\"item.title\"></span>}\r\n @if (item.imgUrl != null) {<img [src]=\"item.imgUrl\" [alt]=\"item.title\" />}\r\n</div>\r\n}\r\n<ng-content></ng-content>\r\n", styles: ["ko-top-menu{position:absolute;inset:0;background-color:#000;color:#f5f5f5}ko-top-menu>div.ko-top-menu-corner{height:100%;float:left;cursor:none}ko-top-menu>div.ko-top-menu-item{height:100%;box-sizing:border-box;background-color:#31353a;color:#f7f4f2;padding:20px;display:block;float:left;cursor:pointer}ko-top-menu>div.ko-top-menu-item.disabled{color:#dee2e8;cursor:not-allowed}ko-top-menu>div.ko-top-menu-item.current{padding:20px 20px 16px;border:solid;border-width:0 0 4px 0;border-color:#ce5206;color:#fff}ko-top-menu>div.ko-top-menu-item.over{color:#ce5206}ko-top-menu>div.ko-top-menu-item.divider{width:0;cursor:none;padding:0;margin:0;box-sizing:border-box;height:100%;line-height:0;border:solid;border-width:0 2px 0 0;border-color:#dee2e8;background-color:#31353a;overflow:hidden}ko-top-menu span.byclass{display:inline-block;width:100%;height:100%}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
410
420
|
}
|
|
411
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
421
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoTopMenuComponent, decorators: [{
|
|
412
422
|
type: Component,
|
|
413
|
-
args: [{ selector: 'ko-top-menu', imports: [NgClass], encapsulation: ViewEncapsulation.None, template: "<div class=\"ko-top-menu-corner\" [style.width]=\"topcornerwidth()\"></div>\r\n@for (item of items(); track item) {\r\n<div (click)=\"setCurrent(item)\"\r\n class=\"ko-top-menu-item\"\r\n [ngClass]=\"{ current: item.id == current(), disabled: item.disabled == true && item.id != '##divider##', over: item == over(), divider: item.id == '##divider##' }\"\r\n (mouseover)=\"overItem(item)\"\r\n (mouseleave)=\"outItem()\"\r\n [style.width]=\"itemwidth(item)\">\r\n @if (item.title != null && item.title != '' && item.id != '##divider##' && item.cssClass==null && item.imgUrl==null) {<span>{{ item.title }}</span>}\r\n @if (item.cssClass != null && item.cssClass != ''){<span class=\"byclass\" [ngClass]=\"item.cssClass\" [title]=\"item.title\"></span>}\r\n @if (item.imgUrl != null) {<img [src]=\"item.imgUrl\" [alt]=\"item.title\" />}\r\n</div>\r\n}\r\n<ng-content></ng-content>\r\n", styles: ["ko-top-menu{position:absolute;inset:0;background-color:#000;color:#f5f5f5}ko-top-menu>div.ko-top-menu-corner{height:100%;float:left;cursor:none}ko-top-menu>div.ko-top-menu-item{height:100%;box-sizing:border-box;background-color:#31353a;color:#f7f4f2;padding:20px;display:block;float:left;cursor:pointer}ko-top-menu>div.ko-top-menu-item.disabled{color:#dee2e8;cursor:not-allowed}ko-top-menu>div.ko-top-menu-item.current{padding:20px 20px 16px;border:solid;border-width:0 0 4px 0;border-color:#ce5206;color:#fff}ko-top-menu>div.ko-top-menu-item.over{color:#ce5206}ko-top-menu>div.ko-top-menu-item.divider{width:0;cursor:none;padding:0;margin:0;box-sizing:border-box;height:100%;line-height:0;border:solid;border-width:0 2px 0 0;border-color:#dee2e8;background-color:#31353a;overflow:hidden}ko-top-menu span.byclass{display:inline-block;width:100%;height:100%}\n"] }]
|
|
423
|
+
args: [{ selector: 'ko-top-menu', imports: [NgClass], changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<div class=\"ko-top-menu-corner\" [style.width]=\"topcornerwidth()\"></div>\r\n@for (item of items(); track item) {\r\n<div (click)=\"setCurrent(item)\"\r\n class=\"ko-top-menu-item\"\r\n [ngClass]=\"{ current: item.id == current(), disabled: item.disabled == true && item.id != '##divider##', over: item == over(), divider: item.id == '##divider##' }\"\r\n (mouseover)=\"overItem(item)\"\r\n (mouseleave)=\"outItem()\"\r\n [style.width]=\"itemwidth(item)\">\r\n @if (item.title != null && item.title != '' && item.id != '##divider##' && item.cssClass==null && item.imgUrl==null) {<span>{{ item.title }}</span>}\r\n @if (item.cssClass != null && item.cssClass != ''){<span class=\"byclass\" [ngClass]=\"item.cssClass\" [title]=\"item.title\"></span>}\r\n @if (item.imgUrl != null) {<img [src]=\"item.imgUrl\" [alt]=\"item.title\" />}\r\n</div>\r\n}\r\n<ng-content></ng-content>\r\n", styles: ["ko-top-menu{position:absolute;inset:0;background-color:#000;color:#f5f5f5}ko-top-menu>div.ko-top-menu-corner{height:100%;float:left;cursor:none}ko-top-menu>div.ko-top-menu-item{height:100%;box-sizing:border-box;background-color:#31353a;color:#f7f4f2;padding:20px;display:block;float:left;cursor:pointer}ko-top-menu>div.ko-top-menu-item.disabled{color:#dee2e8;cursor:not-allowed}ko-top-menu>div.ko-top-menu-item.current{padding:20px 20px 16px;border:solid;border-width:0 0 4px 0;border-color:#ce5206;color:#fff}ko-top-menu>div.ko-top-menu-item.over{color:#ce5206}ko-top-menu>div.ko-top-menu-item.divider{width:0;cursor:none;padding:0;margin:0;box-sizing:border-box;height:100%;line-height:0;border:solid;border-width:0 2px 0 0;border-color:#dee2e8;background-color:#31353a;overflow:hidden}ko-top-menu span.byclass{display:inline-block;width:100%;height:100%}\n"] }]
|
|
414
424
|
}], ctorParameters: () => [], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], current: [{ type: i0.Input, args: [{ isSignal: true, alias: "current", required: false }] }], currentChange: [{ type: i0.Output, args: ["currentChange"] }] } });
|
|
415
425
|
|
|
416
426
|
class KoOverDirective {
|
|
417
427
|
el = inject(ElementRef);
|
|
418
428
|
constructor() {
|
|
419
429
|
}
|
|
420
|
-
current = input.required({ ...(ngDevMode ? { debugName: "current" } : {}), alias: 'ko-over' });
|
|
430
|
+
current = input.required({ ...(ngDevMode ? { debugName: "current" } : /* istanbul ignore next */ {}), alias: 'ko-over' });
|
|
421
431
|
onMouseover($event) {
|
|
422
432
|
const me = this.current();
|
|
423
433
|
if (this.current != null) {
|
|
@@ -430,10 +440,10 @@ class KoOverDirective {
|
|
|
430
440
|
delete me['over'];
|
|
431
441
|
}
|
|
432
442
|
}
|
|
433
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
434
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
443
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoOverDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
444
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.1", type: KoOverDirective, isStandalone: true, selector: "[ko-over]", inputs: { current: { classPropertyName: "current", publicName: "ko-over", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "mouseover": "onMouseover($event)", "mouseleave": "onMouseleave($event)" } }, ngImport: i0 });
|
|
435
445
|
}
|
|
436
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
446
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoOverDirective, decorators: [{
|
|
437
447
|
type: Directive,
|
|
438
448
|
args: [{
|
|
439
449
|
selector: '[ko-over]'
|
|
@@ -447,9 +457,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
|
|
|
447
457
|
}] } });
|
|
448
458
|
|
|
449
459
|
class KoExpansionPanelComponent {
|
|
450
|
-
expanded = input(false,
|
|
460
|
+
expanded = input(false, /* @ts-ignore */
|
|
461
|
+
...(ngDevMode ? [{ debugName: "expanded" }] : /* istanbul ignore next */ []));
|
|
451
462
|
expandedChange = output();
|
|
452
|
-
isExpanded = signal(false,
|
|
463
|
+
isExpanded = signal(false, /* @ts-ignore */
|
|
464
|
+
...(ngDevMode ? [{ debugName: "isExpanded" }] : /* istanbul ignore next */ []));
|
|
453
465
|
constructor() {
|
|
454
466
|
effect(() => {
|
|
455
467
|
this.isExpanded.set(this.expanded());
|
|
@@ -459,28 +471,30 @@ class KoExpansionPanelComponent {
|
|
|
459
471
|
this.isExpanded.set(!this.isExpanded());
|
|
460
472
|
this.expandedChange.emit(this.isExpanded());
|
|
461
473
|
}
|
|
462
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
463
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
474
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoExpansionPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
475
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: KoExpansionPanelComponent, isStandalone: true, selector: "ko-expansion-panel", inputs: { expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expandedChange: "expandedChange" }, ngImport: i0, template: "<div class=\"ko-container\">\r\n <div class=\"ko-title\">\r\n <div style=\"position: relative; width: 100%\">\r\n <div style=\"position: absolute; left: -25px; height: 40px; width: 20px; text-align: center; vertical-align: middle; cursor: pointer\" (click)=\"toggle()\">\r\n @if (!isExpanded()){<span class=\"fa fa-angle-up\"></span>}\r\n @if (isExpanded()){<span class=\"fa fa-angle-down\"></span>}\r\n </div>\r\n </div>\r\n <div (click)=\"toggle()\" style=\"cursor: pointer\"><ng-content select=\"[ko-title]\"></ng-content></div>\r\n </div>\r\n @if (isExpanded()) {\r\n <div class=\"ko-body\">\r\n <ng-content select=\"[ko-body]\"></ng-content>\r\n </div>\r\n }\r\n</div>\r\n", styles: ["ko-expansion-panel{display:block}ko-expansion-panel .ko-container{width:100%}ko-expansion-panel .ko-container .ko-title{margin-left:20px;margin-right:20px;height:40px;border:solid;border-width:0 0 1px 0;border-color:#a1a7af;line-height:40px;padding-left:5px}ko-expansion-panel .ko-container .ko-body{margin:20px}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
464
476
|
}
|
|
465
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
477
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoExpansionPanelComponent, decorators: [{
|
|
466
478
|
type: Component,
|
|
467
|
-
args: [{ selector: 'ko-expansion-panel', imports: [], encapsulation: ViewEncapsulation.None, template: "<div class=\"ko-container\">\r\n <div class=\"ko-title\">\r\n <div style=\"position: relative; width: 100%\">\r\n <div style=\"position: absolute; left: -25px; height: 40px; width: 20px; text-align: center; vertical-align: middle; cursor: pointer\" (click)=\"toggle()\">\r\n @if (!isExpanded()){<span class=\"fa fa-angle-up\"></span>}\r\n @if (isExpanded()){<span class=\"fa fa-angle-down\"></span>}\r\n </div>\r\n </div>\r\n <div (click)=\"toggle()\" style=\"cursor: pointer\"><ng-content select=\"[ko-title]\"></ng-content></div>\r\n </div>\r\n @if (isExpanded()) {\r\n <div class=\"ko-body\">\r\n <ng-content select=\"[ko-body]\"></ng-content>\r\n </div>\r\n }\r\n</div>\r\n", styles: ["ko-expansion-panel{display:block}ko-expansion-panel .ko-container{width:100%}ko-expansion-panel .ko-container .ko-title{margin-left:20px;margin-right:20px;height:40px;border:solid;border-width:0 0 1px 0;border-color:#a1a7af;line-height:40px;padding-left:5px}ko-expansion-panel .ko-container .ko-body{margin:20px}\n"] }]
|
|
479
|
+
args: [{ selector: 'ko-expansion-panel', imports: [], changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<div class=\"ko-container\">\r\n <div class=\"ko-title\">\r\n <div style=\"position: relative; width: 100%\">\r\n <div style=\"position: absolute; left: -25px; height: 40px; width: 20px; text-align: center; vertical-align: middle; cursor: pointer\" (click)=\"toggle()\">\r\n @if (!isExpanded()){<span class=\"fa fa-angle-up\"></span>}\r\n @if (isExpanded()){<span class=\"fa fa-angle-down\"></span>}\r\n </div>\r\n </div>\r\n <div (click)=\"toggle()\" style=\"cursor: pointer\"><ng-content select=\"[ko-title]\"></ng-content></div>\r\n </div>\r\n @if (isExpanded()) {\r\n <div class=\"ko-body\">\r\n <ng-content select=\"[ko-body]\"></ng-content>\r\n </div>\r\n }\r\n</div>\r\n", styles: ["ko-expansion-panel{display:block}ko-expansion-panel .ko-container{width:100%}ko-expansion-panel .ko-container .ko-title{margin-left:20px;margin-right:20px;height:40px;border:solid;border-width:0 0 1px 0;border-color:#a1a7af;line-height:40px;padding-left:5px}ko-expansion-panel .ko-container .ko-body{margin:20px}\n"] }]
|
|
468
480
|
}], ctorParameters: () => [], propDecorators: { expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "expanded", required: false }] }], expandedChange: [{ type: i0.Output, args: ["expandedChange"] }] } });
|
|
469
481
|
|
|
470
482
|
class KoHorizontalScrollComponent {
|
|
471
483
|
constructor() {
|
|
472
484
|
}
|
|
473
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
474
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
485
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoHorizontalScrollComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
486
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.1", type: KoHorizontalScrollComponent, isStandalone: true, selector: "ko-horizontal-scroll", ngImport: i0, template: "<ng-content></ng-content>", styles: ["ko-horizontal-scroll{position:absolute;inset:0;overflow-y:hidden;overflow-x:scroll;display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
475
487
|
}
|
|
476
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
488
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoHorizontalScrollComponent, decorators: [{
|
|
477
489
|
type: Component,
|
|
478
|
-
args: [{ selector: 'ko-horizontal-scroll', imports: [], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>", styles: ["ko-horizontal-scroll{position:absolute;inset:0;overflow-y:hidden;overflow-x:scroll;display:block}\n"] }]
|
|
490
|
+
args: [{ selector: 'ko-horizontal-scroll', imports: [], changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>", styles: ["ko-horizontal-scroll{position:absolute;inset:0;overflow-y:hidden;overflow-x:scroll;display:block}\n"] }]
|
|
479
491
|
}], ctorParameters: () => [] });
|
|
480
492
|
|
|
481
493
|
class KoHorizontalSplitComponent {
|
|
482
|
-
height = input("50%",
|
|
483
|
-
|
|
494
|
+
height = input("50%", /* @ts-ignore */
|
|
495
|
+
...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
|
|
496
|
+
fixed = input('top', /* @ts-ignore */
|
|
497
|
+
...(ngDevMode ? [{ debugName: "fixed" }] : /* istanbul ignore next */ []));
|
|
484
498
|
constructor() {
|
|
485
499
|
effect(() => {
|
|
486
500
|
const h = this.height();
|
|
@@ -488,8 +502,10 @@ class KoHorizontalSplitComponent {
|
|
|
488
502
|
this.init();
|
|
489
503
|
});
|
|
490
504
|
}
|
|
491
|
-
topStyle = signal({},
|
|
492
|
-
|
|
505
|
+
topStyle = signal({}, /* @ts-ignore */
|
|
506
|
+
...(ngDevMode ? [{ debugName: "topStyle" }] : /* istanbul ignore next */ []));
|
|
507
|
+
bottomStyle = signal({}, /* @ts-ignore */
|
|
508
|
+
...(ngDevMode ? [{ debugName: "bottomStyle" }] : /* istanbul ignore next */ []));
|
|
493
509
|
init() {
|
|
494
510
|
if (this.fixed() == 'top') {
|
|
495
511
|
this.topStyle.set({
|
|
@@ -508,30 +524,31 @@ class KoHorizontalSplitComponent {
|
|
|
508
524
|
});
|
|
509
525
|
}
|
|
510
526
|
}
|
|
511
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
512
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
527
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoHorizontalSplitComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
528
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: KoHorizontalSplitComponent, isStandalone: true, selector: "ko-horizontal-split", inputs: { height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, fixed: { classPropertyName: "fixed", publicName: "fixed", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"ko-top\" [ngStyle]=\"topStyle()\">\r\n <ng-content select=\"[ko-top]\"></ng-content>\r\n</div>\r\n<div class=\"ko-bottom\" [ngStyle]=\"bottomStyle()\">\r\n <ng-content select=\"[ko-bottom]\"></ng-content>\r\n</div>\r\n", styles: ["ko-horizontal-split{position:absolute;inset:0;display:block}ko-horizontal-split .ko-top{position:absolute;top:0;left:0;right:0;border:solid;border-width:0 0 1px 0;border-color:#d3d3d3}ko-horizontal-split.raw .ko-top,ko-horizontal-split.raw .ko-bottom{border:none;margin:0;padding:0}ko-horizontal-split .ko-bottom{position:absolute;bottom:0;left:0;right:0}\n"], dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
513
529
|
}
|
|
514
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
530
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoHorizontalSplitComponent, decorators: [{
|
|
515
531
|
type: Component,
|
|
516
|
-
args: [{ selector: 'ko-horizontal-split', imports: [NgStyle], encapsulation: ViewEncapsulation.None, template: "<div class=\"ko-top\" [ngStyle]=\"topStyle()\">\r\n <ng-content select=\"[ko-top]\"></ng-content>\r\n</div>\r\n<div class=\"ko-bottom\" [ngStyle]=\"bottomStyle()\">\r\n <ng-content select=\"[ko-bottom]\"></ng-content>\r\n</div>\r\n", styles: ["ko-horizontal-split{position:absolute;inset:0;display:block}ko-horizontal-split .ko-top{position:absolute;top:0;left:0;right:0;border:solid;border-width:0 0 1px 0;border-color:#d3d3d3}ko-horizontal-split.raw .ko-top,ko-horizontal-split.raw .ko-bottom{border:none;margin:0;padding:0}ko-horizontal-split .ko-bottom{position:absolute;bottom:0;left:0;right:0}\n"] }]
|
|
532
|
+
args: [{ selector: 'ko-horizontal-split', imports: [NgStyle], changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<div class=\"ko-top\" [ngStyle]=\"topStyle()\">\r\n <ng-content select=\"[ko-top]\"></ng-content>\r\n</div>\r\n<div class=\"ko-bottom\" [ngStyle]=\"bottomStyle()\">\r\n <ng-content select=\"[ko-bottom]\"></ng-content>\r\n</div>\r\n", styles: ["ko-horizontal-split{position:absolute;inset:0;display:block}ko-horizontal-split .ko-top{position:absolute;top:0;left:0;right:0;border:solid;border-width:0 0 1px 0;border-color:#d3d3d3}ko-horizontal-split.raw .ko-top,ko-horizontal-split.raw .ko-bottom{border:none;margin:0;padding:0}ko-horizontal-split .ko-bottom{position:absolute;bottom:0;left:0;right:0}\n"] }]
|
|
517
533
|
}], ctorParameters: () => [], propDecorators: { height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], fixed: [{ type: i0.Input, args: [{ isSignal: true, alias: "fixed", required: false }] }] } });
|
|
518
534
|
|
|
519
535
|
class KoMainComponent {
|
|
520
536
|
constructor() {
|
|
521
537
|
}
|
|
522
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
523
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
538
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoMainComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
539
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.1", type: KoMainComponent, isStandalone: true, selector: "ko-main", ngImport: i0, template: "<ng-content></ng-content>", styles: ["ko-main{position:absolute;inset:0;overflow:hidden;display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
524
540
|
}
|
|
525
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
541
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoMainComponent, decorators: [{
|
|
526
542
|
type: Component,
|
|
527
|
-
args: [{ selector: 'ko-main', imports: [], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>", styles: ["ko-main{position:absolute;inset:0;overflow:hidden;display:block}\n"] }]
|
|
543
|
+
args: [{ selector: 'ko-main', imports: [], changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>", styles: ["ko-main{position:absolute;inset:0;overflow:hidden;display:block}\n"] }]
|
|
528
544
|
}], ctorParameters: () => [] });
|
|
529
545
|
|
|
530
546
|
class KoTablePanelComponent {
|
|
531
547
|
tableheader;
|
|
532
548
|
tablebody;
|
|
533
549
|
tablefooter;
|
|
534
|
-
height = input('40px',
|
|
550
|
+
height = input('40px', /* @ts-ignore */
|
|
551
|
+
...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
|
|
535
552
|
cdRef = inject(ChangeDetectorRef);
|
|
536
553
|
constructor() {
|
|
537
554
|
effect(() => {
|
|
@@ -543,9 +560,12 @@ class KoTablePanelComponent {
|
|
|
543
560
|
fotHeight;
|
|
544
561
|
hasTop = true;
|
|
545
562
|
hasFot = true;
|
|
546
|
-
topStyle = signal({},
|
|
547
|
-
|
|
548
|
-
|
|
563
|
+
topStyle = signal({}, /* @ts-ignore */
|
|
564
|
+
...(ngDevMode ? [{ debugName: "topStyle" }] : /* istanbul ignore next */ []));
|
|
565
|
+
bodStyle = signal({}, /* @ts-ignore */
|
|
566
|
+
...(ngDevMode ? [{ debugName: "bodStyle" }] : /* istanbul ignore next */ []));
|
|
567
|
+
fotStyle = signal({}, /* @ts-ignore */
|
|
568
|
+
...(ngDevMode ? [{ debugName: "fotStyle" }] : /* istanbul ignore next */ []));
|
|
549
569
|
ngAfterViewInit() {
|
|
550
570
|
this.hasTop = this.tableheader.nativeElement != null && this.tableheader.nativeElement.children.length > 0;
|
|
551
571
|
this.hasFot = this.tablefooter.nativeElement != null && this.tablefooter.nativeElement.children.length > 0;
|
|
@@ -636,12 +656,12 @@ class KoTablePanelComponent {
|
|
|
636
656
|
});
|
|
637
657
|
}
|
|
638
658
|
}
|
|
639
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
640
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
659
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoTablePanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
660
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: KoTablePanelComponent, isStandalone: true, selector: "ko-table-panel", inputs: { height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "tableheader", first: true, predicate: ["tableheader"], descendants: true }, { propertyName: "tablebody", first: true, predicate: ["tablebody"], descendants: true }, { propertyName: "tablefooter", first: true, predicate: ["tablefooter"], descendants: true }], ngImport: i0, template: "<div class=\"ko-table\">\r\n <div class=\"ko-table-header\" [ngStyle]=\"topStyle()\" #tableheader>\r\n <ng-content select=\"[ko-table-header]\"></ng-content>\r\n </div>\r\n <div class=\"ko-table-body\" [ngStyle]=\"bodStyle()\" #tablebody (scroll)=\"updateScroll()\">\r\n <ng-content select=\"[ko-table-body]\"></ng-content>\r\n </div>\r\n <div class=\"ko-table-footer\" [ngStyle]=\"fotStyle()\" #tablefooter (scroll)=\"updateScroll()\">\r\n <ng-content select=\"[ko-table-footer]\"></ng-content>\r\n </div>\r\n</div>\r\n", styles: ["ko-table-panel{position:absolute;inset:0;display:block}ko-table-panel table{table-layout:fixed;width:100%}ko-table-panel div.ko-table{position:absolute;inset:0}ko-table-panel div.ko-table-header{position:absolute;left:0;right:0;top:0;height:40px;border:none;overflow:hidden;white-space:nowrap}ko-table-panel div.ko-table-body{position:absolute;left:0;right:0;border:none;overflow-x:auto;overflow-y:scroll}ko-table-panel div.ko-table-footer{position:absolute;left:0;right:0;bottom:0;height:40px;border:none;overflow:auto;white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
641
661
|
}
|
|
642
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
662
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoTablePanelComponent, decorators: [{
|
|
643
663
|
type: Component,
|
|
644
|
-
args: [{ selector: 'ko-table-panel', imports: [NgStyle], encapsulation: ViewEncapsulation.None, template: "<div class=\"ko-table\">\r\n <div class=\"ko-table-header\" [ngStyle]=\"topStyle()\" #tableheader>\r\n <ng-content select=\"[ko-table-header]\"></ng-content>\r\n </div>\r\n <div class=\"ko-table-body\" [ngStyle]=\"bodStyle()\" #tablebody (scroll)=\"updateScroll()\">\r\n <ng-content select=\"[ko-table-body]\"></ng-content>\r\n </div>\r\n <div class=\"ko-table-footer\" [ngStyle]=\"fotStyle()\" #tablefooter (scroll)=\"updateScroll()\">\r\n <ng-content select=\"[ko-table-footer]\"></ng-content>\r\n </div>\r\n</div>\r\n", styles: ["ko-table-panel{position:absolute;inset:0;display:block}ko-table-panel table{table-layout:fixed;width:100%}ko-table-panel div.ko-table{position:absolute;inset:0}ko-table-panel div.ko-table-header{position:absolute;left:0;right:0;top:0;height:40px;border:none;overflow:hidden;white-space:nowrap}ko-table-panel div.ko-table-body{position:absolute;left:0;right:0;border:none;overflow-x:auto;overflow-y:scroll}ko-table-panel div.ko-table-footer{position:absolute;left:0;right:0;bottom:0;height:40px;border:none;overflow:auto;white-space:nowrap}\n"] }]
|
|
664
|
+
args: [{ selector: 'ko-table-panel', imports: [NgStyle], changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<div class=\"ko-table\">\r\n <div class=\"ko-table-header\" [ngStyle]=\"topStyle()\" #tableheader>\r\n <ng-content select=\"[ko-table-header]\"></ng-content>\r\n </div>\r\n <div class=\"ko-table-body\" [ngStyle]=\"bodStyle()\" #tablebody (scroll)=\"updateScroll()\">\r\n <ng-content select=\"[ko-table-body]\"></ng-content>\r\n </div>\r\n <div class=\"ko-table-footer\" [ngStyle]=\"fotStyle()\" #tablefooter (scroll)=\"updateScroll()\">\r\n <ng-content select=\"[ko-table-footer]\"></ng-content>\r\n </div>\r\n</div>\r\n", styles: ["ko-table-panel{position:absolute;inset:0;display:block}ko-table-panel table{table-layout:fixed;width:100%}ko-table-panel div.ko-table{position:absolute;inset:0}ko-table-panel div.ko-table-header{position:absolute;left:0;right:0;top:0;height:40px;border:none;overflow:hidden;white-space:nowrap}ko-table-panel div.ko-table-body{position:absolute;left:0;right:0;border:none;overflow-x:auto;overflow-y:scroll}ko-table-panel div.ko-table-footer{position:absolute;left:0;right:0;bottom:0;height:40px;border:none;overflow:auto;white-space:nowrap}\n"] }]
|
|
645
665
|
}], ctorParameters: () => [], propDecorators: { tableheader: [{
|
|
646
666
|
type: ViewChild,
|
|
647
667
|
args: ['tableheader']
|
|
@@ -656,39 +676,41 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
|
|
|
656
676
|
class KoTitlePanelComponent {
|
|
657
677
|
constructor() {
|
|
658
678
|
}
|
|
659
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
660
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
679
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoTitlePanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
680
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.1", type: KoTitlePanelComponent, isStandalone: true, selector: "ko-title-panel", ngImport: i0, template: "<div class=\"ko-container\">\r\n <div class=\"ko-title\">\r\n <ng-content select=\"[ko-title]\"></ng-content>\r\n </div>\r\n <div class=\"ko-body\">\r\n <ng-content select=\"[ko-body]\"></ng-content>\r\n </div>\r\n</div>\r\n", styles: ["ko-title-panel{position:absolute;inset:0;display:block}ko-title-panel .ko-container{position:absolute;inset:5px;border:solid;border-width:1px 1px 1px 1px;border-color:#00000020;border-radius:4px}ko-title-panel.raw .ko-container{position:absolute;inset:0;border:none;border-radius:unset}ko-title-panel .ko-container .ko-title{position:absolute;left:0;right:0;top:0;height:50px;padding:4px;background-color:#00000008;border-bottom:1px solid rgba(0,0,0,.125)}:ko-title-panel.raw .ko-container .ko-title{padding:0;border:none}ko-title-panel.no-padding .ko-container .ko-title{padding:0}ko-title-panel.raw .ko-container .ko-body{top:59px;padding:0}ko-title-panel .ko-container .ko-body{position:absolute;inset:55px 0 0;overflow-x:hidden;overflow-y:auto;padding:4px}ko-title-panel.no-padding .ko-container .ko-body{padding:0}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
661
681
|
}
|
|
662
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
682
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoTitlePanelComponent, decorators: [{
|
|
663
683
|
type: Component,
|
|
664
|
-
args: [{ selector: 'ko-title-panel', imports: [], encapsulation: ViewEncapsulation.None, template: "<div class=\"ko-container\">\r\n <div class=\"ko-title\">\r\n <ng-content select=\"[ko-title]\"></ng-content>\r\n </div>\r\n <div class=\"ko-body\">\r\n <ng-content select=\"[ko-body]\"></ng-content>\r\n </div>\r\n</div>\r\n", styles: ["ko-title-panel{position:absolute;inset:0;display:block}ko-title-panel .ko-container{position:absolute;inset:5px;border:solid;border-width:1px 1px 1px 1px;border-color:#00000020;border-radius:4px}ko-title-panel.raw .ko-container{position:absolute;inset:0;border:none;border-radius:unset}ko-title-panel .ko-container .ko-title{position:absolute;left:0;right:0;top:0;height:50px;padding:4px;background-color:#00000008;border-bottom:1px solid rgba(0,0,0,.125)}:ko-title-panel.raw .ko-container .ko-title{padding:0;border:none}ko-title-panel.no-padding .ko-container .ko-title{padding:0}ko-title-panel.raw .ko-container .ko-body{top:59px;padding:0}ko-title-panel .ko-container .ko-body{position:absolute;inset:55px 0 0;overflow-x:hidden;overflow-y:auto;padding:4px}ko-title-panel.no-padding .ko-container .ko-body{padding:0}\n"] }]
|
|
684
|
+
args: [{ selector: 'ko-title-panel', imports: [], changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<div class=\"ko-container\">\r\n <div class=\"ko-title\">\r\n <ng-content select=\"[ko-title]\"></ng-content>\r\n </div>\r\n <div class=\"ko-body\">\r\n <ng-content select=\"[ko-body]\"></ng-content>\r\n </div>\r\n</div>\r\n", styles: ["ko-title-panel{position:absolute;inset:0;display:block}ko-title-panel .ko-container{position:absolute;inset:5px;border:solid;border-width:1px 1px 1px 1px;border-color:#00000020;border-radius:4px}ko-title-panel.raw .ko-container{position:absolute;inset:0;border:none;border-radius:unset}ko-title-panel .ko-container .ko-title{position:absolute;left:0;right:0;top:0;height:50px;padding:4px;background-color:#00000008;border-bottom:1px solid rgba(0,0,0,.125)}:ko-title-panel.raw .ko-container .ko-title{padding:0;border:none}ko-title-panel.no-padding .ko-container .ko-title{padding:0}ko-title-panel.raw .ko-container .ko-body{top:59px;padding:0}ko-title-panel .ko-container .ko-body{position:absolute;inset:55px 0 0;overflow-x:hidden;overflow-y:auto;padding:4px}ko-title-panel.no-padding .ko-container .ko-body{padding:0}\n"] }]
|
|
665
685
|
}], ctorParameters: () => [] });
|
|
666
686
|
|
|
667
687
|
class KoVerticalScrollComponent {
|
|
668
688
|
constructor() {
|
|
669
689
|
}
|
|
670
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
671
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
690
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoVerticalScrollComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
691
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.1", type: KoVerticalScrollComponent, isStandalone: true, selector: "ko-vertical-scroll", ngImport: i0, template: "<ng-content></ng-content>", styles: ["ko-vertical-scroll{position:absolute;inset:0;overflow-x:hidden;overflow-y:scroll;display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
672
692
|
}
|
|
673
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
693
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoVerticalScrollComponent, decorators: [{
|
|
674
694
|
type: Component,
|
|
675
|
-
args: [{ selector: 'ko-vertical-scroll', imports: [], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>", styles: ["ko-vertical-scroll{position:absolute;inset:0;overflow-x:hidden;overflow-y:scroll;display:block}\n"] }]
|
|
695
|
+
args: [{ selector: 'ko-vertical-scroll', imports: [], changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>", styles: ["ko-vertical-scroll{position:absolute;inset:0;overflow-x:hidden;overflow-y:scroll;display:block}\n"] }]
|
|
676
696
|
}], ctorParameters: () => [] });
|
|
677
697
|
|
|
678
698
|
class KoViewComponent {
|
|
679
699
|
constructor() {
|
|
680
700
|
}
|
|
681
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
682
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
701
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
702
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.1", type: KoViewComponent, isStandalone: true, selector: "ko-view", ngImport: i0, template: "<ng-content></ng-content>", styles: ["ko-view{position:absolute;inset:0;overflow-x:hidden;overflow-y:auto;padding:2px;display:block}ko-view.no-padding{padding:0;overflow-x:initial;overflow-y:initial}ko-view.pad20{overflow-x:hidden;overflow-y:auto;padding:20px}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
683
703
|
}
|
|
684
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
704
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoViewComponent, decorators: [{
|
|
685
705
|
type: Component,
|
|
686
|
-
args: [{ selector: 'ko-view', imports: [], encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>", styles: ["ko-view{position:absolute;inset:0;overflow-x:hidden;overflow-y:auto;padding:2px;display:block}ko-view.no-padding{padding:0;overflow-x:initial;overflow-y:initial}ko-view.pad20{overflow-x:hidden;overflow-y:auto;padding:20px}\n"] }]
|
|
706
|
+
args: [{ selector: 'ko-view', imports: [], changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>", styles: ["ko-view{position:absolute;inset:0;overflow-x:hidden;overflow-y:auto;padding:2px;display:block}ko-view.no-padding{padding:0;overflow-x:initial;overflow-y:initial}ko-view.pad20{overflow-x:hidden;overflow-y:auto;padding:20px}\n"] }]
|
|
687
707
|
}], ctorParameters: () => [] });
|
|
688
708
|
|
|
689
709
|
class KoVerticalSplitComponent {
|
|
690
|
-
width = input('50%',
|
|
691
|
-
|
|
710
|
+
width = input('50%', /* @ts-ignore */
|
|
711
|
+
...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
|
|
712
|
+
fixed = input('left', /* @ts-ignore */
|
|
713
|
+
...(ngDevMode ? [{ debugName: "fixed" }] : /* istanbul ignore next */ []));
|
|
692
714
|
constructor() {
|
|
693
715
|
effect(() => {
|
|
694
716
|
const w = this.width();
|
|
@@ -696,8 +718,10 @@ class KoVerticalSplitComponent {
|
|
|
696
718
|
this.init();
|
|
697
719
|
});
|
|
698
720
|
}
|
|
699
|
-
leftStyle = signal({},
|
|
700
|
-
|
|
721
|
+
leftStyle = signal({}, /* @ts-ignore */
|
|
722
|
+
...(ngDevMode ? [{ debugName: "leftStyle" }] : /* istanbul ignore next */ []));
|
|
723
|
+
rightStyle = signal({}, /* @ts-ignore */
|
|
724
|
+
...(ngDevMode ? [{ debugName: "rightStyle" }] : /* istanbul ignore next */ []));
|
|
701
725
|
init() {
|
|
702
726
|
if (this.fixed() == 'left') {
|
|
703
727
|
this.leftStyle.set({
|
|
@@ -716,17 +740,17 @@ class KoVerticalSplitComponent {
|
|
|
716
740
|
});
|
|
717
741
|
}
|
|
718
742
|
}
|
|
719
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
720
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
743
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoVerticalSplitComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
744
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: KoVerticalSplitComponent, isStandalone: true, selector: "ko-vertical-split", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, fixed: { classPropertyName: "fixed", publicName: "fixed", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"ko-left\" [ngStyle]=\"leftStyle()\">\r\n <ng-content select=\"[ko-left]\"></ng-content>\r\n</div>\r\n<div class=\"ko-right\" [ngStyle]=\"rightStyle()\">\r\n <ng-content select=\"[ko-right]\"></ng-content>\r\n</div>\r\n", styles: ["ko-vertical-split{position:absolute;inset:0}ko-vertical-split .ko-left{position:absolute;top:0;left:0;bottom:0;border:solid;border-width:0 1px 0 0;border-color:#d3d3d3}ko-vertical-split .ko-right{position:absolute;top:0;bottom:0;right:0}ko-vertical-split.raw .ko-left,ko-vertical-split.raw .ko-right{border:none;margin:0;padding:0}\n"], dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
721
745
|
}
|
|
722
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
746
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KoVerticalSplitComponent, decorators: [{
|
|
723
747
|
type: Component,
|
|
724
|
-
args: [{ selector: 'ko-vertical-split', imports: [NgStyle], encapsulation: ViewEncapsulation.None, template: "<div class=\"ko-left\" [ngStyle]=\"leftStyle()\">\r\n <ng-content select=\"[ko-left]\"></ng-content>\r\n</div>\r\n<div class=\"ko-right\" [ngStyle]=\"rightStyle()\">\r\n <ng-content select=\"[ko-right]\"></ng-content>\r\n</div>\r\n", styles: ["ko-vertical-split{position:absolute;inset:0}ko-vertical-split .ko-left{position:absolute;top:0;left:0;bottom:0;border:solid;border-width:0 1px 0 0;border-color:#d3d3d3}ko-vertical-split .ko-right{position:absolute;top:0;bottom:0;right:0}ko-vertical-split.raw .ko-left,ko-vertical-split.raw .ko-right{border:none;margin:0;padding:0}\n"] }]
|
|
748
|
+
args: [{ selector: 'ko-vertical-split', imports: [NgStyle], changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<div class=\"ko-left\" [ngStyle]=\"leftStyle()\">\r\n <ng-content select=\"[ko-left]\"></ng-content>\r\n</div>\r\n<div class=\"ko-right\" [ngStyle]=\"rightStyle()\">\r\n <ng-content select=\"[ko-right]\"></ng-content>\r\n</div>\r\n", styles: ["ko-vertical-split{position:absolute;inset:0}ko-vertical-split .ko-left{position:absolute;top:0;left:0;bottom:0;border:solid;border-width:0 1px 0 0;border-color:#d3d3d3}ko-vertical-split .ko-right{position:absolute;top:0;bottom:0;right:0}ko-vertical-split.raw .ko-left,ko-vertical-split.raw .ko-right{border:none;margin:0;padding:0}\n"] }]
|
|
725
749
|
}], ctorParameters: () => [], propDecorators: { width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], fixed: [{ type: i0.Input, args: [{ isSignal: true, alias: "fixed", required: false }] }] } });
|
|
726
750
|
|
|
727
751
|
class KiponUiModule {
|
|
728
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
729
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
752
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KiponUiModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
753
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.1", ngImport: i0, type: KiponUiModule, imports: [KoHorizontalScrollComponent,
|
|
730
754
|
KoHorizontalSplitComponent,
|
|
731
755
|
KoMainComponent,
|
|
732
756
|
KoTitlePanelComponent,
|
|
@@ -761,9 +785,9 @@ class KiponUiModule {
|
|
|
761
785
|
KoTopMenuComponent,
|
|
762
786
|
KoLeftMenuComponent,
|
|
763
787
|
KoWriteDirective] });
|
|
764
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
788
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KiponUiModule });
|
|
765
789
|
}
|
|
766
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
790
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: KiponUiModule, decorators: [{
|
|
767
791
|
type: NgModule,
|
|
768
792
|
args: [{
|
|
769
793
|
imports: [
|
|
@@ -833,10 +857,10 @@ class DKCustomDateAdapter extends NativeDateAdapter {
|
|
|
833
857
|
pad(n) {
|
|
834
858
|
return n < 10 ? `0${n}` : `${n}`;
|
|
835
859
|
}
|
|
836
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
837
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
860
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: DKCustomDateAdapter, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
|
|
861
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: DKCustomDateAdapter, providedIn: "root" });
|
|
838
862
|
}
|
|
839
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
863
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: DKCustomDateAdapter, decorators: [{
|
|
840
864
|
type: Injectable,
|
|
841
865
|
args: [{ providedIn: "root" }]
|
|
842
866
|
}] });
|
|
@@ -972,23 +996,28 @@ class SelectedService {
|
|
|
972
996
|
}
|
|
973
997
|
return true;
|
|
974
998
|
}
|
|
975
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
976
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
999
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: SelectedService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1000
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: SelectedService, providedIn: 'root' });
|
|
977
1001
|
}
|
|
978
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1002
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: SelectedService, decorators: [{
|
|
979
1003
|
type: Injectable,
|
|
980
1004
|
args: [{ providedIn: 'root' }]
|
|
981
1005
|
}], ctorParameters: () => [] });
|
|
982
1006
|
|
|
983
1007
|
class XrmuiInfo {
|
|
984
1008
|
selectedService = inject(SelectedService);
|
|
985
|
-
label = input(
|
|
986
|
-
|
|
987
|
-
|
|
988
|
-
|
|
1009
|
+
label = input(/* @ts-ignore */
|
|
1010
|
+
...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
|
|
1011
|
+
onlyshowselected = input(false, /* @ts-ignore */
|
|
1012
|
+
...(ngDevMode ? [{ debugName: "onlyshowselected" }] : /* istanbul ignore next */ []));
|
|
1013
|
+
items = input(/* @ts-ignore */
|
|
1014
|
+
...(ngDevMode ? [undefined, { debugName: "items" }] : /* istanbul ignore next */ []));
|
|
1015
|
+
icon = input(/* @ts-ignore */
|
|
1016
|
+
...(ngDevMode ? [undefined, { debugName: "icon" }] : /* istanbul ignore next */ []));
|
|
989
1017
|
click = output();
|
|
990
1018
|
clear = output();
|
|
991
|
-
badget = input(
|
|
1019
|
+
badget = input(/* @ts-ignore */
|
|
1020
|
+
...(ngDevMode ? [undefined, { debugName: "badget" }] : /* istanbul ignore next */ []));
|
|
992
1021
|
list$;
|
|
993
1022
|
list = [];
|
|
994
1023
|
select$;
|
|
@@ -1066,12 +1095,12 @@ class XrmuiInfo {
|
|
|
1066
1095
|
});
|
|
1067
1096
|
this.grouped = result;
|
|
1068
1097
|
}
|
|
1069
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1070
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1098
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiInfo, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1099
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: XrmuiInfo, isStandalone: true, selector: "xrmui-info", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, onlyshowselected: { classPropertyName: "onlyshowselected", publicName: "onlyshowselected", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, badget: { classPropertyName: "badget", publicName: "badget", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { click: "click", clear: "clear" }, ngImport: i0, template: "@if (!onlyshowselected() || list.length > 0) {\r\n <div class=\"line\" (click)=\"onClick()\">\r\n @if (icon() != undefined){\r\n <div class=\"ic\">\r\n @let bad = badget() ?? 0;\r\n @if ( bad == 0) {<mat-icon fontSet=\"material-symbols-outlined\">{{ icon() }}</mat-icon>}\r\n @if (bad > 0) {<mat-icon fontSet=\"material-symbols-outlined\" [matBadge]=\"badget()\" aria-hidden=\"false\">{{ icon()\r\n }}</mat-icon>}\r\n </div>}\r\n @if (label() != undefined){<div class=\"lab\">{{ label() }}</div>}\r\n <div class=\"con\">\r\n <ng-content></ng-content>\r\n @if (list.length > 0) {\r\n @for(gr of grouped; track gr) {\r\n @if (gr.group != undefined && gr.group != '') {\r\n <div class=\"selected-item\"><b>{{ gr.group }}</b></div>\r\n }\r\n @for(li of gr.items; track li) {\r\n <div class=\"selected-item\" (mouseover)=\"isover(li)\" (mouseleave)=\"isout()\">\r\n <div class=\"selected-item-name\">{{ li.name }}</div>\r\n @if (over == li){<div class=\"selected-item-tool\" title=\"Fjern fra valgt listen\"\r\n (click)=\"remove($event, li)\"><mat-icon fontSet=\"material-symbols-outlined\"\r\n style=\"color: gray; font-size: small; height: 16px\">delete</mat-icon></div>}\r\n </div>\r\n }\r\n }\r\n }\r\n </div>\r\n </div>\r\n }", styles: [":host{font-size:small;cursor:pointer;display:block}:host div.line{display:flex}:host div.ic{width:40px;min-width:40px;text-align:center;padding:3px 0;border:solid;border-width:0 1px 0 0}:host div.lab{width:100px;height:24px;line-height:24px;font-weight:700;padding-left:3px}:host div.con{flex-grow:1;min-height:24px;line-height:24px;overflow-x:hidden;overflow-y:hidden}:host div.toggler{height:30px;width:20px}:host div.selected-item{flex-grow:1;display:flex;position:relative}:host div.selected-item-name{flex-grow:1}:host div.selected-item-tool{position:absolute;z-index:1000;right:10px;top:5px}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
1071
1100
|
}
|
|
1072
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1101
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiInfo, decorators: [{
|
|
1073
1102
|
type: Component,
|
|
1074
|
-
args: [{ selector: 'xrmui-info', imports: [MatIcon, MatBadge], template: "@if (!onlyshowselected() || list.length > 0) {\r\n <div class=\"line\" (click)=\"onClick()\">\r\n @if (icon() != undefined){\r\n <div class=\"ic\">\r\n @let bad = badget() ?? 0;\r\n @if ( bad == 0) {<mat-icon fontSet=\"material-symbols-outlined\">{{ icon() }}</mat-icon>}\r\n @if (bad > 0) {<mat-icon fontSet=\"material-symbols-outlined\" [matBadge]=\"badget()\" aria-hidden=\"false\">{{ icon()\r\n }}</mat-icon>}\r\n </div>}\r\n @if (label() != undefined){<div class=\"lab\">{{ label() }}</div>}\r\n <div class=\"con\">\r\n <ng-content></ng-content>\r\n @if (list.length > 0) {\r\n @for(gr of grouped; track gr) {\r\n @if (gr.group != undefined && gr.group != '') {\r\n <div class=\"selected-item\"><b>{{ gr.group }}</b></div>\r\n }\r\n @for(li of gr.items; track li) {\r\n <div class=\"selected-item\" (mouseover)=\"isover(li)\" (mouseleave)=\"isout()\">\r\n <div class=\"selected-item-name\">{{ li.name }}</div>\r\n @if (over == li){<div class=\"selected-item-tool\" title=\"Fjern fra valgt listen\"\r\n (click)=\"remove($event, li)\"><mat-icon fontSet=\"material-symbols-outlined\"\r\n style=\"color: gray; font-size: small; height: 16px\">delete</mat-icon></div>}\r\n </div>\r\n }\r\n }\r\n }\r\n </div>\r\n </div>\r\n }", styles: [":host{font-size:small;cursor:pointer;display:block}:host div.line{display:flex}:host div.ic{width:40px;min-width:40px;text-align:center;padding:3px 0;border:solid;border-width:0 1px 0 0}:host div.lab{width:100px;height:24px;line-height:24px;font-weight:700;padding-left:3px}:host div.con{flex-grow:1;min-height:24px;line-height:24px;overflow-x:hidden;overflow-y:hidden}:host div.toggler{height:30px;width:20px}:host div.selected-item{flex-grow:1;display:flex;position:relative}:host div.selected-item-name{flex-grow:1}:host div.selected-item-tool{position:absolute;z-index:1000;right:10px;top:5px}\n"] }]
|
|
1103
|
+
args: [{ selector: 'xrmui-info', changeDetection: ChangeDetectionStrategy.Eager, imports: [MatIcon, MatBadge], template: "@if (!onlyshowselected() || list.length > 0) {\r\n <div class=\"line\" (click)=\"onClick()\">\r\n @if (icon() != undefined){\r\n <div class=\"ic\">\r\n @let bad = badget() ?? 0;\r\n @if ( bad == 0) {<mat-icon fontSet=\"material-symbols-outlined\">{{ icon() }}</mat-icon>}\r\n @if (bad > 0) {<mat-icon fontSet=\"material-symbols-outlined\" [matBadge]=\"badget()\" aria-hidden=\"false\">{{ icon()\r\n }}</mat-icon>}\r\n </div>}\r\n @if (label() != undefined){<div class=\"lab\">{{ label() }}</div>}\r\n <div class=\"con\">\r\n <ng-content></ng-content>\r\n @if (list.length > 0) {\r\n @for(gr of grouped; track gr) {\r\n @if (gr.group != undefined && gr.group != '') {\r\n <div class=\"selected-item\"><b>{{ gr.group }}</b></div>\r\n }\r\n @for(li of gr.items; track li) {\r\n <div class=\"selected-item\" (mouseover)=\"isover(li)\" (mouseleave)=\"isout()\">\r\n <div class=\"selected-item-name\">{{ li.name }}</div>\r\n @if (over == li){<div class=\"selected-item-tool\" title=\"Fjern fra valgt listen\"\r\n (click)=\"remove($event, li)\"><mat-icon fontSet=\"material-symbols-outlined\"\r\n style=\"color: gray; font-size: small; height: 16px\">delete</mat-icon></div>}\r\n </div>\r\n }\r\n }\r\n }\r\n </div>\r\n </div>\r\n }", styles: [":host{font-size:small;cursor:pointer;display:block}:host div.line{display:flex}:host div.ic{width:40px;min-width:40px;text-align:center;padding:3px 0;border:solid;border-width:0 1px 0 0}:host div.lab{width:100px;height:24px;line-height:24px;font-weight:700;padding-left:3px}:host div.con{flex-grow:1;min-height:24px;line-height:24px;overflow-x:hidden;overflow-y:hidden}:host div.toggler{height:30px;width:20px}:host div.selected-item{flex-grow:1;display:flex;position:relative}:host div.selected-item-name{flex-grow:1}:host div.selected-item-tool{position:absolute;z-index:1000;right:10px;top:5px}\n"] }]
|
|
1075
1104
|
}], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], onlyshowselected: [{ type: i0.Input, args: [{ isSignal: true, alias: "onlyshowselected", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], click: [{ type: i0.Output, args: ["click"] }], clear: [{ type: i0.Output, args: ["clear"] }], badget: [{ type: i0.Input, args: [{ isSignal: true, alias: "badget", required: false }] }] } });
|
|
1076
1105
|
|
|
1077
1106
|
let XrmuiPanel$1 = class XrmuiPanel {
|
|
@@ -1142,24 +1171,34 @@ let XrmuiPanel$1 = class XrmuiPanel {
|
|
|
1142
1171
|
};
|
|
1143
1172
|
|
|
1144
1173
|
class XrmuiLayout {
|
|
1145
|
-
_panels = input('', { ...(ngDevMode ? { debugName: "_panels" } : {}), alias: 'panels' });
|
|
1146
|
-
_orientation = input('horizontal', { ...(ngDevMode ? { debugName: "_orientation" } : {}), alias: 'orientation' });
|
|
1147
|
-
_resizeable = input(false, { ...(ngDevMode ? { debugName: "_resizeable" } : {}), alias: 'resizeable' });
|
|
1148
|
-
panels = signal('',
|
|
1149
|
-
|
|
1150
|
-
|
|
1174
|
+
_panels = input('', { ...(ngDevMode ? { debugName: "_panels" } : /* istanbul ignore next */ {}), alias: 'panels' });
|
|
1175
|
+
_orientation = input('horizontal', { ...(ngDevMode ? { debugName: "_orientation" } : /* istanbul ignore next */ {}), alias: 'orientation' });
|
|
1176
|
+
_resizeable = input(false, { ...(ngDevMode ? { debugName: "_resizeable" } : /* istanbul ignore next */ {}), alias: 'resizeable' });
|
|
1177
|
+
panels = signal('', /* @ts-ignore */
|
|
1178
|
+
...(ngDevMode ? [{ debugName: "panels" }] : /* istanbul ignore next */ []));
|
|
1179
|
+
orientation = signal('horizontal', /* @ts-ignore */
|
|
1180
|
+
...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
|
|
1181
|
+
resizeable = signal(false, /* @ts-ignore */
|
|
1182
|
+
...(ngDevMode ? [{ debugName: "resizeable" }] : /* istanbul ignore next */ []));
|
|
1151
1183
|
totalHeight = 0;
|
|
1152
1184
|
totalWidth = 0;
|
|
1153
1185
|
unit = 'px';
|
|
1154
|
-
panellist$ = signal([],
|
|
1155
|
-
|
|
1186
|
+
panellist$ = signal([], /* @ts-ignore */
|
|
1187
|
+
...(ngDevMode ? [{ debugName: "panellist$" }] : /* istanbul ignore next */ []));
|
|
1188
|
+
resized = signal(0, /* @ts-ignore */
|
|
1189
|
+
...(ngDevMode ? [{ debugName: "resized" }] : /* istanbul ignore next */ []));
|
|
1156
1190
|
panellist = this.panellist$.asReadonly();
|
|
1157
1191
|
viewInitialized = false;
|
|
1158
|
-
style0 = computed(() => { return this.styleFor(0); },
|
|
1159
|
-
|
|
1160
|
-
|
|
1161
|
-
|
|
1162
|
-
|
|
1192
|
+
style0 = computed(() => { return this.styleFor(0); }, /* @ts-ignore */
|
|
1193
|
+
...(ngDevMode ? [{ debugName: "style0" }] : /* istanbul ignore next */ []));
|
|
1194
|
+
style1 = computed(() => { return this.styleFor(1); }, /* @ts-ignore */
|
|
1195
|
+
...(ngDevMode ? [{ debugName: "style1" }] : /* istanbul ignore next */ []));
|
|
1196
|
+
style2 = computed(() => { return this.styleFor(2); }, /* @ts-ignore */
|
|
1197
|
+
...(ngDevMode ? [{ debugName: "style2" }] : /* istanbul ignore next */ []));
|
|
1198
|
+
style3 = computed(() => { return this.styleFor(3); }, /* @ts-ignore */
|
|
1199
|
+
...(ngDevMode ? [{ debugName: "style3" }] : /* istanbul ignore next */ []));
|
|
1200
|
+
style4 = computed(() => { return this.styleFor(4); }, /* @ts-ignore */
|
|
1201
|
+
...(ngDevMode ? [{ debugName: "style4" }] : /* istanbul ignore next */ []));
|
|
1163
1202
|
styleFor(i) {
|
|
1164
1203
|
const panels = this.panellist();
|
|
1165
1204
|
const resize = this.resized();
|
|
@@ -1357,31 +1396,34 @@ class XrmuiLayout {
|
|
|
1357
1396
|
}
|
|
1358
1397
|
return result;
|
|
1359
1398
|
}
|
|
1360
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1361
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1399
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiLayout, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1400
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: XrmuiLayout, isStandalone: true, selector: "xrmui-layout", inputs: { _panels: { classPropertyName: "_panels", publicName: "panels", isSignal: true, isRequired: false, transformFunction: null }, _orientation: { classPropertyName: "_orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, _resizeable: { classPropertyName: "_resizeable", publicName: "resizeable", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div [style]=\"style0().style\" [ngClass]=\"{ dynamics: style0().dyn, horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\">\r\n <ng-content select=\"[c1]\"></ng-content>\r\n</div>\r\n\r\n@if (panellist().length > 1 && resizeable()) {\r\n <div \r\n [style]=\"panellist()[0].resizeStyle\" \r\n class=\"resizer\" \r\n cdkDrag \r\n [cdkDragLockAxis]=\"orientation() == 'horizontal' ? 'y' : 'x'\" \r\n (cdkDragMoved)=\"resize($event, panellist()[0])\"\r\n (cdkDragEnded)=\"drop($event, panellist()[0])\"\r\n [ngClass]=\"{ horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\"></div>\r\n}\r\n <div [style]=\"style1().style\" [ngClass]=\"{ dynamics: style1().dyn, horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\"><ng-content select=\"[c2]\"></ng-content></div>\r\n <div [style]=\"style2().style\" [ngClass]=\"{ dynamics: style2().dyn, horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\"><ng-content select=\"[c3]\"></ng-content></div>\r\n <div [style]=\"style3().style\" [ngClass]=\"{ dynamics: style3().dyn, horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\"><ng-content select=\"[c4]\"></ng-content></div>\r\n <div [style]=\"style4().style\" [ngClass]=\"{ dynamics: style4().dyn, horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\"><ng-content select=\"[c5]\"></ng-content></div>\r\n", styles: [":host{position:absolute;inset:0;margin:0;padding:0;overflow:hidden;display:block}:host div.horizontal{position:absolute;left:0;right:0;overflow:hidden}:host div.vertical{position:absolute;top:0;bottom:0;overflow:hidden}:host div.dynamic{overflow-x:hidden;overflow-y:auto}:host div.vertical.resizer{position:absolute;top:0;bottom:0;width:1px;background-color:transparent;cursor:pointer;z-index:1;cursor:ew-resize}:host div.vertical.resizer:hover{width:3px;background-color:#a9a9a9}:host div.horizontal.resizer{position:absolute;left:0;right:0;height:1px;background-color:transparent;cursor:pointer;z-index:1;cursor:ns-resize}:host div.horizontal.resizer:hover{height:3px;background-color:#a9a9a9}\n"], dependencies: [{ kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
1362
1401
|
}
|
|
1363
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1402
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiLayout, decorators: [{
|
|
1364
1403
|
type: Component,
|
|
1365
|
-
args: [{ selector: 'xrmui-layout', imports: [CdkDrag, NgClass], template: "<div [style]=\"style0().style\" [ngClass]=\"{ dynamics: style0().dyn, horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\">\r\n <ng-content select=\"[c1]\"></ng-content>\r\n</div>\r\n\r\n@if (panellist().length > 1 && resizeable()) {\r\n <div \r\n [style]=\"panellist()[0].resizeStyle\" \r\n class=\"resizer\" \r\n cdkDrag \r\n [cdkDragLockAxis]=\"orientation() == 'horizontal' ? 'y' : 'x'\" \r\n (cdkDragMoved)=\"resize($event, panellist()[0])\"\r\n (cdkDragEnded)=\"drop($event, panellist()[0])\"\r\n [ngClass]=\"{ horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\"></div>\r\n}\r\n <div [style]=\"style1().style\" [ngClass]=\"{ dynamics: style1().dyn, horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\"><ng-content select=\"[c2]\"></ng-content></div>\r\n <div [style]=\"style2().style\" [ngClass]=\"{ dynamics: style2().dyn, horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\"><ng-content select=\"[c3]\"></ng-content></div>\r\n <div [style]=\"style3().style\" [ngClass]=\"{ dynamics: style3().dyn, horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\"><ng-content select=\"[c4]\"></ng-content></div>\r\n <div [style]=\"style4().style\" [ngClass]=\"{ dynamics: style4().dyn, horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\"><ng-content select=\"[c5]\"></ng-content></div>\r\n", styles: [":host{position:absolute;inset:0;margin:0;padding:0;overflow:hidden;display:block}:host div.horizontal{position:absolute;left:0;right:0;overflow:hidden}:host div.vertical{position:absolute;top:0;bottom:0;overflow:hidden}:host div.dynamic{overflow-x:hidden;overflow-y:auto}:host div.vertical.resizer{position:absolute;top:0;bottom:0;width:1px;background-color:transparent;cursor:pointer;z-index:1;cursor:ew-resize}:host div.vertical.resizer:hover{width:3px;background-color:#a9a9a9}:host div.horizontal.resizer{position:absolute;left:0;right:0;height:1px;background-color:transparent;cursor:pointer;z-index:1;cursor:ns-resize}:host div.horizontal.resizer:hover{height:3px;background-color:#a9a9a9}\n"] }]
|
|
1404
|
+
args: [{ selector: 'xrmui-layout', changeDetection: ChangeDetectionStrategy.Eager, imports: [CdkDrag, NgClass], template: "<div [style]=\"style0().style\" [ngClass]=\"{ dynamics: style0().dyn, horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\">\r\n <ng-content select=\"[c1]\"></ng-content>\r\n</div>\r\n\r\n@if (panellist().length > 1 && resizeable()) {\r\n <div \r\n [style]=\"panellist()[0].resizeStyle\" \r\n class=\"resizer\" \r\n cdkDrag \r\n [cdkDragLockAxis]=\"orientation() == 'horizontal' ? 'y' : 'x'\" \r\n (cdkDragMoved)=\"resize($event, panellist()[0])\"\r\n (cdkDragEnded)=\"drop($event, panellist()[0])\"\r\n [ngClass]=\"{ horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\"></div>\r\n}\r\n <div [style]=\"style1().style\" [ngClass]=\"{ dynamics: style1().dyn, horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\"><ng-content select=\"[c2]\"></ng-content></div>\r\n <div [style]=\"style2().style\" [ngClass]=\"{ dynamics: style2().dyn, horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\"><ng-content select=\"[c3]\"></ng-content></div>\r\n <div [style]=\"style3().style\" [ngClass]=\"{ dynamics: style3().dyn, horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\"><ng-content select=\"[c4]\"></ng-content></div>\r\n <div [style]=\"style4().style\" [ngClass]=\"{ dynamics: style4().dyn, horizontal: orientation() == 'horizontal', vertical: orientation() == 'vertical'}\"><ng-content select=\"[c5]\"></ng-content></div>\r\n", styles: [":host{position:absolute;inset:0;margin:0;padding:0;overflow:hidden;display:block}:host div.horizontal{position:absolute;left:0;right:0;overflow:hidden}:host div.vertical{position:absolute;top:0;bottom:0;overflow:hidden}:host div.dynamic{overflow-x:hidden;overflow-y:auto}:host div.vertical.resizer{position:absolute;top:0;bottom:0;width:1px;background-color:transparent;cursor:pointer;z-index:1;cursor:ew-resize}:host div.vertical.resizer:hover{width:3px;background-color:#a9a9a9}:host div.horizontal.resizer{position:absolute;left:0;right:0;height:1px;background-color:transparent;cursor:pointer;z-index:1;cursor:ns-resize}:host div.horizontal.resizer:hover{height:3px;background-color:#a9a9a9}\n"] }]
|
|
1366
1405
|
}], ctorParameters: () => [], propDecorators: { _panels: [{ type: i0.Input, args: [{ isSignal: true, alias: "panels", required: false }] }], _orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], _resizeable: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizeable", required: false }] }] } });
|
|
1367
1406
|
|
|
1368
1407
|
class XrmuiPanel {
|
|
1369
1408
|
constructor() {
|
|
1370
1409
|
}
|
|
1371
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1372
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1410
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1411
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.1", type: XrmuiPanel, isStandalone: true, selector: "xrmui-panel", ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{position:absolute;inset:0;margin:0;padding:0;overflow-x:hidden;overflow-y:auto;display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
1373
1412
|
}
|
|
1374
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1413
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiPanel, decorators: [{
|
|
1375
1414
|
type: Component,
|
|
1376
|
-
args: [{ selector: 'xrmui-panel', imports: [], template: "<ng-content></ng-content>", styles: [":host{position:absolute;inset:0;margin:0;padding:0;overflow-x:hidden;overflow-y:auto;display:block}\n"] }]
|
|
1415
|
+
args: [{ selector: 'xrmui-panel', changeDetection: ChangeDetectionStrategy.Eager, imports: [], template: "<ng-content></ng-content>", styles: [":host{position:absolute;inset:0;margin:0;padding:0;overflow-x:hidden;overflow-y:auto;display:block}\n"] }]
|
|
1377
1416
|
}], ctorParameters: () => [] });
|
|
1378
1417
|
|
|
1379
1418
|
class XrmuiIcon {
|
|
1380
1419
|
host = inject(ElementRef);
|
|
1381
|
-
_icon = input('', { ...(ngDevMode ? { debugName: "_icon" } : {}), alias: 'icon' });
|
|
1382
|
-
disabled = input(false,
|
|
1383
|
-
|
|
1384
|
-
|
|
1420
|
+
_icon = input('', { ...(ngDevMode ? { debugName: "_icon" } : /* istanbul ignore next */ {}), alias: 'icon' });
|
|
1421
|
+
disabled = input(false, /* @ts-ignore */
|
|
1422
|
+
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
1423
|
+
type = input('mat', /* @ts-ignore */
|
|
1424
|
+
...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
|
|
1425
|
+
icon = signal('', /* @ts-ignore */
|
|
1426
|
+
...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
|
|
1385
1427
|
classes = computed(() => {
|
|
1386
1428
|
const i = this.icon();
|
|
1387
1429
|
const d = this.disabled();
|
|
@@ -1395,7 +1437,8 @@ class XrmuiIcon {
|
|
|
1395
1437
|
return ['fa', i, 'disabled'];
|
|
1396
1438
|
}
|
|
1397
1439
|
return ['fa', i];
|
|
1398
|
-
},
|
|
1440
|
+
}, /* @ts-ignore */
|
|
1441
|
+
...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
|
|
1399
1442
|
constructor() {
|
|
1400
1443
|
effect(() => {
|
|
1401
1444
|
const i = this._icon();
|
|
@@ -1413,16 +1456,17 @@ class XrmuiIcon {
|
|
|
1413
1456
|
}
|
|
1414
1457
|
}
|
|
1415
1458
|
}
|
|
1416
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1417
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1459
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiIcon, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1460
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: XrmuiIcon, isStandalone: true, selector: "xrmui-icon", inputs: { _icon: { classPropertyName: "_icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<span style=\"display: none;\"><ng-content></ng-content></span>\r\n@if (icon() != '') {\r\n@if (type() == 'mat') {\r\n <mat-icon [ngClass]=\"classes()\" fontSet=\"material-symbols-outlined\">{{ icon() }}</mat-icon>\r\n}\r\n@if (type() == 'fa') {\r\n <i [ngClass]=\"classes()\"></i>\r\n}\r\n}", styles: [":host mat-icon.disabled{opacity:20%}:host .fa.disabled{opacity:20%}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
1418
1461
|
}
|
|
1419
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1462
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiIcon, decorators: [{
|
|
1420
1463
|
type: Component,
|
|
1421
|
-
args: [{ selector: 'xrmui-icon', imports: [NgClass, MatIcon], template: "<span style=\"display: none;\"><ng-content></ng-content></span>\r\n@if (icon() != '') {\r\n@if (type() == 'mat') {\r\n <mat-icon [ngClass]=\"classes()\" fontSet=\"material-symbols-outlined\">{{ icon() }}</mat-icon>\r\n}\r\n@if (type() == 'fa') {\r\n <i [ngClass]=\"classes()\"></i>\r\n}\r\n}", styles: [":host mat-icon.disabled{opacity:20%}:host .fa.disabled{opacity:20%}\n"] }]
|
|
1464
|
+
args: [{ selector: 'xrmui-icon', changeDetection: ChangeDetectionStrategy.Eager, imports: [NgClass, MatIcon], template: "<span style=\"display: none;\"><ng-content></ng-content></span>\r\n@if (icon() != '') {\r\n@if (type() == 'mat') {\r\n <mat-icon [ngClass]=\"classes()\" fontSet=\"material-symbols-outlined\">{{ icon() }}</mat-icon>\r\n}\r\n@if (type() == 'fa') {\r\n <i [ngClass]=\"classes()\"></i>\r\n}\r\n}", styles: [":host mat-icon.disabled{opacity:20%}:host .fa.disabled{opacity:20%}\n"] }]
|
|
1422
1465
|
}], ctorParameters: () => [], propDecorators: { _icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }] } });
|
|
1423
1466
|
|
|
1424
1467
|
class ChangeScopeDirective {
|
|
1425
|
-
changeScope = input.required(
|
|
1468
|
+
changeScope = input.required(/* @ts-ignore */
|
|
1469
|
+
...(ngDevMode ? [{ debugName: "changeScope" }] : /* istanbul ignore next */ []));
|
|
1426
1470
|
notifyChanged() {
|
|
1427
1471
|
const cp = this.changeScope();
|
|
1428
1472
|
if (cp) {
|
|
@@ -1433,10 +1477,10 @@ class ChangeScopeDirective {
|
|
|
1433
1477
|
}
|
|
1434
1478
|
}
|
|
1435
1479
|
}
|
|
1436
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1437
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
1480
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: ChangeScopeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
1481
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.1", type: ChangeScopeDirective, isStandalone: true, selector: "[changeScope]", inputs: { changeScope: { classPropertyName: "changeScope", publicName: "changeScope", isSignal: true, isRequired: true, transformFunction: null } }, exportAs: ["changeScope"], ngImport: i0 });
|
|
1438
1482
|
}
|
|
1439
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1483
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: ChangeScopeDirective, decorators: [{
|
|
1440
1484
|
type: Directive,
|
|
1441
1485
|
args: [{
|
|
1442
1486
|
selector: '[changeScope]',
|
|
@@ -1446,11 +1490,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
|
|
|
1446
1490
|
}], propDecorators: { changeScope: [{ type: i0.Input, args: [{ isSignal: true, alias: "changeScope", required: true }] }] } });
|
|
1447
1491
|
|
|
1448
1492
|
class FormScopeDirective {
|
|
1449
|
-
formScope = input.required(
|
|
1450
|
-
|
|
1451
|
-
static
|
|
1493
|
+
formScope = input.required(/* @ts-ignore */
|
|
1494
|
+
...(ngDevMode ? [{ debugName: "formScope" }] : /* istanbul ignore next */ []));
|
|
1495
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: FormScopeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
1496
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.1", type: FormScopeDirective, isStandalone: true, selector: "[formScope]", inputs: { formScope: { classPropertyName: "formScope", publicName: "formScope", isSignal: true, isRequired: true, transformFunction: null } }, exportAs: ["formScope"], ngImport: i0 });
|
|
1452
1497
|
}
|
|
1453
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1498
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: FormScopeDirective, decorators: [{
|
|
1454
1499
|
type: Directive,
|
|
1455
1500
|
args: [{
|
|
1456
1501
|
selector: '[formScope]',
|
|
@@ -1472,8 +1517,9 @@ class XrmuiInput {
|
|
|
1472
1517
|
formScope = inject(FormScopeDirective, { optional: true, host: true });
|
|
1473
1518
|
destroyRef = inject(DestroyRef);
|
|
1474
1519
|
blurThead;
|
|
1475
|
-
label = input('',
|
|
1476
|
-
|
|
1520
|
+
label = input('', /* @ts-ignore */
|
|
1521
|
+
...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
1522
|
+
_shortLabel = input(undefined, { ...(ngDevMode ? { debugName: "_shortLabel" } : /* istanbul ignore next */ {}), alias: 'short-label' });
|
|
1477
1523
|
shortLabel = computed(() => {
|
|
1478
1524
|
const sl = this._shortLabel();
|
|
1479
1525
|
if (sl)
|
|
@@ -1485,10 +1531,13 @@ class XrmuiInput {
|
|
|
1485
1531
|
return "above";
|
|
1486
1532
|
}
|
|
1487
1533
|
return false;
|
|
1488
|
-
},
|
|
1489
|
-
|
|
1490
|
-
|
|
1491
|
-
|
|
1534
|
+
}, /* @ts-ignore */
|
|
1535
|
+
...(ngDevMode ? [{ debugName: "shortLabel" }] : /* istanbul ignore next */ []));
|
|
1536
|
+
placeholder = input('', /* @ts-ignore */
|
|
1537
|
+
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
1538
|
+
value = model(null, /* @ts-ignore */
|
|
1539
|
+
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
1540
|
+
_disabled = input(undefined, { ...(ngDevMode ? { debugName: "_disabled" } : /* istanbul ignore next */ {}), alias: 'disabled' });
|
|
1492
1541
|
disabled = computed(() => {
|
|
1493
1542
|
const d = this._disabled();
|
|
1494
1543
|
if (d != undefined) {
|
|
@@ -1498,8 +1547,9 @@ class XrmuiInput {
|
|
|
1498
1547
|
return this.formScope.formScope().disabled ?? false;
|
|
1499
1548
|
}
|
|
1500
1549
|
return false;
|
|
1501
|
-
},
|
|
1502
|
-
|
|
1550
|
+
}, /* @ts-ignore */
|
|
1551
|
+
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
1552
|
+
_showlock = input(undefined, { ...(ngDevMode ? { debugName: "_showlock" } : /* istanbul ignore next */ {}), alias: 'showlock' });
|
|
1503
1553
|
showlock = computed(() => {
|
|
1504
1554
|
const sl = this._showlock();
|
|
1505
1555
|
if (sl != undefined) {
|
|
@@ -1509,27 +1559,43 @@ class XrmuiInput {
|
|
|
1509
1559
|
return this.formScope.formScope().showlock ?? true;
|
|
1510
1560
|
}
|
|
1511
1561
|
return true;
|
|
1512
|
-
},
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1516
|
-
|
|
1517
|
-
|
|
1518
|
-
|
|
1519
|
-
|
|
1520
|
-
|
|
1562
|
+
}, /* @ts-ignore */
|
|
1563
|
+
...(ngDevMode ? [{ debugName: "showlock" }] : /* istanbul ignore next */ []));
|
|
1564
|
+
required = input(false, /* @ts-ignore */
|
|
1565
|
+
...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
|
|
1566
|
+
type = input('text', /* @ts-ignore */
|
|
1567
|
+
...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
|
|
1568
|
+
setfocus = model(false, /* @ts-ignore */
|
|
1569
|
+
...(ngDevMode ? [{ debugName: "setfocus" }] : /* istanbul ignore next */ []));
|
|
1570
|
+
autocomplete = input(null, /* @ts-ignore */
|
|
1571
|
+
...(ngDevMode ? [{ debugName: "autocomplete" }] : /* istanbul ignore next */ []));
|
|
1572
|
+
selectable = input(null, /* @ts-ignore */
|
|
1573
|
+
...(ngDevMode ? [{ debugName: "selectable" }] : /* istanbul ignore next */ []));
|
|
1574
|
+
selected = model(undefined, /* @ts-ignore */
|
|
1575
|
+
...(ngDevMode ? [{ debugName: "selected" }] : /* istanbul ignore next */ []));
|
|
1576
|
+
optionsetvalue = input(null, /* @ts-ignore */
|
|
1577
|
+
...(ngDevMode ? [{ debugName: "optionsetvalue" }] : /* istanbul ignore next */ []));
|
|
1578
|
+
entityreference = input(null, /* @ts-ignore */
|
|
1579
|
+
...(ngDevMode ? [{ debugName: "entityreference" }] : /* istanbul ignore next */ []));
|
|
1521
1580
|
onselect = output();
|
|
1522
|
-
error = input(false,
|
|
1523
|
-
|
|
1524
|
-
|
|
1581
|
+
error = input(false, /* @ts-ignore */
|
|
1582
|
+
...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
|
|
1583
|
+
validate = model(null, /* @ts-ignore */
|
|
1584
|
+
...(ngDevMode ? [{ debugName: "validate" }] : /* istanbul ignore next */ []));
|
|
1585
|
+
decimals = input(undefined, /* @ts-ignore */
|
|
1586
|
+
...(ngDevMode ? [{ debugName: "decimals" }] : /* istanbul ignore next */ []));
|
|
1525
1587
|
onfocusEvent = output({ alias: 'focus' });
|
|
1526
1588
|
onblurEvent = output({ alias: 'blur' });
|
|
1527
1589
|
click = output();
|
|
1528
|
-
resizeable = input(true,
|
|
1529
|
-
|
|
1530
|
-
|
|
1531
|
-
|
|
1532
|
-
|
|
1590
|
+
resizeable = input(true, /* @ts-ignore */
|
|
1591
|
+
...(ngDevMode ? [{ debugName: "resizeable" }] : /* istanbul ignore next */ []));
|
|
1592
|
+
info = input(null, /* @ts-ignore */
|
|
1593
|
+
...(ngDevMode ? [{ debugName: "info" }] : /* istanbul ignore next */ []));
|
|
1594
|
+
notdark = input(false, /* @ts-ignore */
|
|
1595
|
+
...(ngDevMode ? [{ debugName: "notdark" }] : /* istanbul ignore next */ []));
|
|
1596
|
+
_autoopenonblank = input(undefined, { ...(ngDevMode ? { debugName: "_autoopenonblank" } : /* istanbul ignore next */ {}), alias: "autoopenonblank" });
|
|
1597
|
+
nullable = input(true, /* @ts-ignore */
|
|
1598
|
+
...(ngDevMode ? [{ debugName: "nullable" }] : /* istanbul ignore next */ []));
|
|
1533
1599
|
autoopenonblank = computed(() => {
|
|
1534
1600
|
const au = this._autoopenonblank();
|
|
1535
1601
|
if (au != undefined) {
|
|
@@ -1539,37 +1605,50 @@ class XrmuiInput {
|
|
|
1539
1605
|
return this.formScope.formScope().autoopenonblank ?? false;
|
|
1540
1606
|
}
|
|
1541
1607
|
return false;
|
|
1542
|
-
},
|
|
1608
|
+
}, /* @ts-ignore */
|
|
1609
|
+
...(ngDevMode ? [{ debugName: "autoopenonblank" }] : /* istanbul ignore next */ []));
|
|
1543
1610
|
decimalsUsed = output();
|
|
1544
1611
|
onEnter = output();
|
|
1545
|
-
toolIcon = input(null,
|
|
1612
|
+
toolIcon = input(null, /* @ts-ignore */
|
|
1613
|
+
...(ngDevMode ? [{ debugName: "toolIcon" }] : /* istanbul ignore next */ []));
|
|
1546
1614
|
toolClick = output();
|
|
1547
|
-
numberoflines = input(1,
|
|
1548
|
-
|
|
1549
|
-
|
|
1615
|
+
numberoflines = input(1, /* @ts-ignore */
|
|
1616
|
+
...(ngDevMode ? [{ debugName: "numberoflines" }] : /* istanbul ignore next */ []));
|
|
1617
|
+
maxlength = input(null, /* @ts-ignore */
|
|
1618
|
+
...(ngDevMode ? [{ debugName: "maxlength" }] : /* istanbul ignore next */ []));
|
|
1619
|
+
hasfocus = signal(false, /* @ts-ignore */
|
|
1620
|
+
...(ngDevMode ? [{ debugName: "hasfocus" }] : /* istanbul ignore next */ []));
|
|
1550
1621
|
search = '';
|
|
1551
1622
|
// private items: ISelectable[] | null = null;
|
|
1552
|
-
itemlist = signal([],
|
|
1553
|
-
|
|
1623
|
+
itemlist = signal([], /* @ts-ignore */
|
|
1624
|
+
...(ngDevMode ? [{ debugName: "itemlist" }] : /* istanbul ignore next */ []));
|
|
1625
|
+
showitems = signal(false, /* @ts-ignore */
|
|
1626
|
+
...(ngDevMode ? [{ debugName: "showitems" }] : /* istanbul ignore next */ []));
|
|
1554
1627
|
searchthread = null;
|
|
1555
1628
|
searchnumber = 0;
|
|
1556
1629
|
current;
|
|
1557
1630
|
currentindex = -1;
|
|
1558
|
-
shadowValue = signal('',
|
|
1559
|
-
|
|
1560
|
-
|
|
1631
|
+
shadowValue = signal('', /* @ts-ignore */
|
|
1632
|
+
...(ngDevMode ? [{ debugName: "shadowValue" }] : /* istanbul ignore next */ []));
|
|
1633
|
+
shadowDate = signal(null, /* @ts-ignore */
|
|
1634
|
+
...(ngDevMode ? [{ debugName: "shadowDate" }] : /* istanbul ignore next */ []));
|
|
1635
|
+
shadowBool = signal(false, /* @ts-ignore */
|
|
1636
|
+
...(ngDevMode ? [{ debugName: "shadowBool" }] : /* istanbul ignore next */ []));
|
|
1561
1637
|
isselect = computed(() => {
|
|
1562
1638
|
const s = this.selectable();
|
|
1563
1639
|
if (s && s.length > 0)
|
|
1564
1640
|
return true;
|
|
1565
1641
|
return false;
|
|
1566
|
-
},
|
|
1567
|
-
|
|
1642
|
+
}, /* @ts-ignore */
|
|
1643
|
+
...(ngDevMode ? [{ debugName: "isselect" }] : /* istanbul ignore next */ []));
|
|
1644
|
+
isnumber = computed(() => this.validate() == 'decimal' || this.validate() == 'number', /* @ts-ignore */
|
|
1645
|
+
...(ngDevMode ? [{ debugName: "isnumber" }] : /* istanbul ignore next */ []));
|
|
1568
1646
|
inputclasses = computed(() => {
|
|
1569
1647
|
if (!this.isnumber())
|
|
1570
1648
|
return this.type();
|
|
1571
1649
|
return this.type() + ' ' + 'number';
|
|
1572
|
-
},
|
|
1650
|
+
}, /* @ts-ignore */
|
|
1651
|
+
...(ngDevMode ? [{ debugName: "inputclasses" }] : /* istanbul ignore next */ []));
|
|
1573
1652
|
constructor() {
|
|
1574
1653
|
this.destroyRef.onDestroy(() => {
|
|
1575
1654
|
if (this.blurThead) {
|
|
@@ -1949,12 +2028,12 @@ class XrmuiInput {
|
|
|
1949
2028
|
this.shadowValue.set(nFormater.flex(v));
|
|
1950
2029
|
}
|
|
1951
2030
|
}
|
|
1952
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1953
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: XrmuiInput, isStandalone: true, selector: "xrmui-input", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, _shortLabel: { classPropertyName: "_shortLabel", publicName: "short-label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, _disabled: { classPropertyName: "_disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, _showlock: { classPropertyName: "_showlock", publicName: "showlock", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, setfocus: { classPropertyName: "setfocus", publicName: "setfocus", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, optionsetvalue: { classPropertyName: "optionsetvalue", publicName: "optionsetvalue", isSignal: true, isRequired: false, transformFunction: null }, entityreference: { classPropertyName: "entityreference", publicName: "entityreference", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, validate: { classPropertyName: "validate", publicName: "validate", isSignal: true, isRequired: false, transformFunction: null }, decimals: { classPropertyName: "decimals", publicName: "decimals", isSignal: true, isRequired: false, transformFunction: null }, resizeable: { classPropertyName: "resizeable", publicName: "resizeable", isSignal: true, isRequired: false, transformFunction: null }, info: { classPropertyName: "info", publicName: "info", isSignal: true, isRequired: false, transformFunction: null }, notdark: { classPropertyName: "notdark", publicName: "notdark", isSignal: true, isRequired: false, transformFunction: null }, _autoopenonblank: { classPropertyName: "_autoopenonblank", publicName: "autoopenonblank", isSignal: true, isRequired: false, transformFunction: null }, nullable: { classPropertyName: "nullable", publicName: "nullable", isSignal: true, isRequired: false, transformFunction: null }, toolIcon: { classPropertyName: "toolIcon", publicName: "toolIcon", isSignal: true, isRequired: false, transformFunction: null }, numberoflines: { classPropertyName: "numberoflines", publicName: "numberoflines", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", setfocus: "setfocusChange", selected: "selectedChange", onselect: "onselect", validate: "validateChange", onfocusEvent: "focus", onblurEvent: "blur", click: "click", decimalsUsed: "decimalsUsed", onEnter: "onEnter", toolClick: "toolClick" }, viewQueries: [{ propertyName: "searchElement", first: true, predicate: ["inputfield"], descendants: true }, { propertyName: "textareaElement", first: true, predicate: ["textareafield"], descendants: true }, { propertyName: "datefieldElement", first: true, predicate: ["datefield"], descendants: true }, { propertyName: "options", predicate: ["option"], descendants: true }], ngImport: i0, template: "@if (showitems()) {\r\n <div class=\"autocomplete\" [ngClass]=\"{ nolabel: (!label() || label().length == 0 || shortLabel() == 'above'), shortLabel: shortLabel() == true, notdark: notdark() }\">\r\n @if (itemlist().length == 0) {\r\n <div class=\"element\"><div class=\"item\">Ingen fundet</div>div></div>\r\n }\r\n @for (elm of itemlist(); track elm) {\r\n <div #option class=\"element\" [ngClass]=\"{ current: current == elm, selectable: !elm.disabled }\" (click)=\"select($event, elm)\">\r\n <div class=\"item\">{{ elm.name }}</div>\r\n </div>\r\n }\r\n </div>\r\n}\r\n@if (label() != '' && label().length > 0 && shortLabel() != 'above') {\r\n<div class=\"label\" [ngClass]=\"{ short: shortLabel() == true }\" (click)=\"focusMe($event)\">{{ label() }}</div>\r\n}\r\n@if ((label() != '' || type() == 'number') && showlock()) {\r\n<div class=\"locked\">\r\n @if (required() && shortLabel() != 'above') {\r\n <div style=\"display: inline-block;height: 10px;color: red; position: relative; top: -8px; right: 0\">*</div>\r\n }\r\n @if (disabled()) {\r\n <mat-icon fontSet=\"material-symbols-outlined\">lock</mat-icon>\r\n }\r\n</div>\r\n}\r\n<div class=\"input\" [ngClass]=\"{ focus: hasfocus(), error: error(), textarea: numberoflines() > 1, labelabove: shortLabel() == 'above', toolicon: toolIcon()?.length ?? 0 > 0 }\" (click)=\"focusMe($event)\">\r\n @if (shortLabel() == 'above' && label() != '') {\r\n <div class=\"label-above\">\r\n {{ label() }}\r\n @if (required()) {<span style=\"color: red\"> *</span>}\r\n </div>\r\n }\r\n @if (numberoflines() == 1 && validate() != 'date' && validate() != 'checkbox' && !isselect()) {\r\n <input \r\n #inputfield \r\n [ngClass]=\"inputclasses()\"\r\n [type]=\"type() != 'password'? 'text' : 'password'\"\r\n [disabled]=\"disabled()\" \r\n [placeholder]=\"placeholder()\" \r\n [(ngModel)]=\"shadowValue\" \r\n (ngModelChange)=\"onValueChanged()\" \r\n (focus)=\"onFocus()\" \r\n (blur)=\"onBlur()\"\r\n (keydown.arrowdown)=\"ondown($event)\"\r\n (keydown.arrowup)=\"onup($event)\"\r\n (keydown.enter)=\"onenter($event)\"\r\n (keydown.esc)=\"onesc($event)\"\r\n (keydown)=\"onkeydown($event)\"\r\n [maxlength]=\"maxlength()\"/>\r\n }\r\n @if (validate() == 'checkbox') {\r\n <div class=\"checkbox\">\r\n <input \r\n type=\"checkbox\"\r\n class=\"text checkbox\"\r\n [(ngModel)]=\"shadowBool\"\r\n [disabled]=\"disabled()\"\r\n (ngModelChange)=\"onCheckboxToggle()\" \r\n (focus)=\"onFocus()\" \r\n (blur)=\"onBlurCheckbox()\"\r\n />\r\n </div>\r\n }\r\n @if (numberoflines() == 1 && validate() == 'date' && !isselect()) {\r\n <input\r\n #datefield\r\n class=\"text datepicker\"\r\n [matDatepicker]=\"picker\"\r\n [value]=\"shadowDate()\"\r\n (dateChange)=\"pickDate($event)\"\r\n [disabled]=\"disabled()\" \r\n [placeholder]=\"placeholder()\" \r\n (focus)=\"onFocus()\"\r\n (blur)=\"onBlurDate()\"/>\r\n @if (!disabled()) {\r\n <mat-icon \r\n class=\"calendar-icon\" \r\n fontSet=\"material-symbols-outlined\"\r\n (click)=\"picker.open()\">calendar_month</mat-icon>\r\n }\r\n <mat-datepicker #picker></mat-datepicker>\r\n }\r\n @if (numberoflines() > 1 && !isselect()) {\r\n <textarea\r\n #textareafield\r\n [maxlength]=\"maxlength()\"\r\n [rows]=\"numberoflines()\"\r\n [disabled]=\"disabled()\" \r\n [placeholder]=\"placeholder()\" \r\n [(ngModel)]=\"shadowValue\" \r\n [ngClass]=\"{ noresize: !resizeable() }\"\r\n (ngModelChange)=\"onValueChanged()\" \r\n (focus)=\"onFocus()\" \r\n (blur)=\"onBlur()\"\r\n (keydown.arrowdown)=\"ondown($event)\"\r\n (keydown.arrowup)=\"onup($event)\"\r\n (keydown.enter)=\"onenter($event)\"\r\n (keydown.esc)=\"onesc($event)\"\r\n (keydown)=\"onkeydown($event)\"></textarea>\r\n }\r\n @let options = selectable();\r\n @if (options && options.length > 0) {\r\n <select \r\n (change)=\"setchoice($event)\"\r\n (focus)=\"onFocus()\"\r\n (blur)=\"onBlur()\"\r\n [disabled]=\"disabled()\">\r\n @for (option of options; track option) {\r\n <option [value]=\"option.id\" [selected]=\"option == selected()\">{{ option.name }}</option>\r\n }\r\n </select>\r\n @if (!disabled()) {\r\n <mat-icon class=\"dropdown\" fontSet=\"material-symbols-outlined\">arrow_drop_down</mat-icon>\r\n }\r\n }\r\n @let ti = toolIcon();\r\n @if (!disabled() && ti && ti.length > 0) {\r\n <mat-icon class=\"toolicon\" fontSet=\"material-symbols-outlined\" (click)=\"toolClicked($event)\">{{ ti }}</mat-icon>\r\n }\r\n</div>\r\n\r\n@if (label() == '' && type() != 'number' && showlock()) {\r\n <div class=\"locked\" style=\"text-align: left;\">\r\n @if (disabled()) {\r\n <mat-icon fontSet=\"material-symbols-outlined\">lock</mat-icon>\r\n }\r\n </div>\r\n}\r\n\r\n@if (info()) {<div class=\"info\" [title]=\"info()\"><mat-icon class=\"info\">info</mat-icon></div>}\r\n", styles: [":host{position:relative;display:flex;margin-bottom:10px}:host div.autocomplete{position:absolute;z-index:100;top:37px;left:215px;right:0;background-color:red;min-height:40px;background-color:#fff;color:#000;border:solid;border-width:1px 1px 1px 1px;border-color:#d3d3d3;border-radius:4px;padding:5px;max-height:200px;overflow-x:hidden;overflow-y:auto}:host div.autocomplete.nolabel{left:0}:host div.autocomplete.shortLabel{left:124px}:host div.autocomplete div.element.selectable{cursor:pointer}@media(prefers-color-scheme:dark){:host div.autocomplete{background-color:#000;color:#fff}}@media(prefers-color-scheme:dark){:host div.autocomplete.notdark{background-color:#fff;color:#000}}:host div.autocomplete div.element{margin:5px;padding:5px;display:flex;border:solid;border-width:0 0 1px 0;border-color:#d3d3d3;font-size:14px;color:gray}:host div.autocomplete div.element.current{border-color:#0f6cbd;color:#000}:host div.autocomplete div.element div.item{flex-grow:1}:host div.label{width:180px;min-width:180px;max-height:180px;height:32px;line-height:32px}:host div.label.short{width:90px;min-width:90px}:host div.locked{width:30px;min-width:30px;max-width:30px;height:32px;line-height:32px;text-align:right;padding-right:3px}:host div.input{flex-grow:1;height:32px;line-height:32px;background-color:#e6e8e8;border-radius:3px;margin:0;padding:0;border:solid;border-width:0 0 3px 0;border-color:transparent}:host div.input.labelabove{height:48px}:host div.input.labelabove div.label-above{font-size:12px;line-height:12px;width:100%;padding-left:15px;padding-top:5px;color:gray}:host div.input.focus.labelabove div.label-above{color:#0f6cbd}:host div.input.textarea{height:inherit}:host div.info{width:30px}:host div textarea{background-color:#e6e8e8;border-radius:3px;margin:0;padding:10px 15px;border:solid;border-width:0 0 3px 0;border-color:transparent;width:100%;box-sizing:border-box}:host div.input.focus,:host div.textarea.focus,:host div.select.focus{border-color:#0f6cbd}:host div.input.error,:host div.input.focus.error,:host div.select.focus.error{border-color:red;color:red}:host input{background-color:transparent;margin:0;border:none;height:29px;padding:0 0 0 15px;width:100%;box-sizing:border-box}:host input.number{text-align:right}:host select{background-color:transparent;margin:0;border:none;height:29px;padding:0 0 0 15px;width:calc(100% - 10px);box-sizing:border-box}:host input.datepicker{width:calc(100% - 35px)}:host div.input>div.checkbox{margin-left:15px;margin-top:5px}:host div.input.above>div.checkbox{margin-top:2px}:host input.checkbox{width:15px;height:15px}:host div.input.toolicon input{width:calc(100% - 35px)}@media(prefers-color-scheme:dark){:host input{color:#000}:host input:disabled{color:#5f615f}}:host input.number{text-align:right;padding-right:15px;padding-left:0}:host *:focus{outline:none}:host mat-icon{color:#d3d3d3;font-size:12px;position:relative;top:5px;width:12px}:host textarea.noresize{resize:none}:host mat-icon.info{font-size:30px;width:30px;height:30px;color:gray}:host mat-icon.info:hover{color:#000}:host mat-icon.calendar-icon{font-size:25px;width:25px;height:25px;color:#a9a9a9}:host mat-icon.toolicon{cursor:pointer;font-size:25px;width:25px;height:25px;color:gray}:host mat-icon.dropdown{position:absolute;right:10px;top:4px;font-size:25px;width:25px;height:25px;color:gray;pointer-events:none}:host div.input.labelabove mat-icon.dropdown{top:12px}:host div.input.labelabove mat-icon.toolicon,:host div.input.labelabove mat-icon.calendar-icon{position:relative;top:-5px}:host select{appearance:none;-webkit-appearance:none;-moz-appearance:none}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "ngmodule", type: MatCheckboxModule }] });
|
|
2031
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiInput, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2032
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: XrmuiInput, isStandalone: true, selector: "xrmui-input", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, _shortLabel: { classPropertyName: "_shortLabel", publicName: "short-label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, _disabled: { classPropertyName: "_disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, _showlock: { classPropertyName: "_showlock", publicName: "showlock", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, setfocus: { classPropertyName: "setfocus", publicName: "setfocus", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, optionsetvalue: { classPropertyName: "optionsetvalue", publicName: "optionsetvalue", isSignal: true, isRequired: false, transformFunction: null }, entityreference: { classPropertyName: "entityreference", publicName: "entityreference", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, validate: { classPropertyName: "validate", publicName: "validate", isSignal: true, isRequired: false, transformFunction: null }, decimals: { classPropertyName: "decimals", publicName: "decimals", isSignal: true, isRequired: false, transformFunction: null }, resizeable: { classPropertyName: "resizeable", publicName: "resizeable", isSignal: true, isRequired: false, transformFunction: null }, info: { classPropertyName: "info", publicName: "info", isSignal: true, isRequired: false, transformFunction: null }, notdark: { classPropertyName: "notdark", publicName: "notdark", isSignal: true, isRequired: false, transformFunction: null }, _autoopenonblank: { classPropertyName: "_autoopenonblank", publicName: "autoopenonblank", isSignal: true, isRequired: false, transformFunction: null }, nullable: { classPropertyName: "nullable", publicName: "nullable", isSignal: true, isRequired: false, transformFunction: null }, toolIcon: { classPropertyName: "toolIcon", publicName: "toolIcon", isSignal: true, isRequired: false, transformFunction: null }, numberoflines: { classPropertyName: "numberoflines", publicName: "numberoflines", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", setfocus: "setfocusChange", selected: "selectedChange", onselect: "onselect", validate: "validateChange", onfocusEvent: "focus", onblurEvent: "blur", click: "click", decimalsUsed: "decimalsUsed", onEnter: "onEnter", toolClick: "toolClick" }, viewQueries: [{ propertyName: "searchElement", first: true, predicate: ["inputfield"], descendants: true }, { propertyName: "textareaElement", first: true, predicate: ["textareafield"], descendants: true }, { propertyName: "datefieldElement", first: true, predicate: ["datefield"], descendants: true }, { propertyName: "options", predicate: ["option"], descendants: true }], ngImport: i0, template: "@if (showitems()) {\r\n <div class=\"autocomplete\" [ngClass]=\"{ nolabel: (!label() || label().length == 0 || shortLabel() == 'above'), shortLabel: shortLabel() == true, notdark: notdark() }\">\r\n @if (itemlist().length == 0) {\r\n <div class=\"element\"><div class=\"item\">Ingen fundet</div>div></div>\r\n }\r\n @for (elm of itemlist(); track elm) {\r\n <div #option class=\"element\" [ngClass]=\"{ current: current == elm, selectable: !elm.disabled }\" (click)=\"select($event, elm)\">\r\n <div class=\"item\">{{ elm.name }}</div>\r\n </div>\r\n }\r\n </div>\r\n}\r\n@if (label() != '' && label().length > 0 && shortLabel() != 'above') {\r\n<div class=\"label\" [ngClass]=\"{ short: shortLabel() == true }\" (click)=\"focusMe($event)\">{{ label() }}</div>\r\n}\r\n@if ((label() != '' || type() == 'number') && showlock()) {\r\n<div class=\"locked\">\r\n @if (required() && shortLabel() != 'above') {\r\n <div style=\"display: inline-block;height: 10px;color: red; position: relative; top: -8px; right: 0\">*</div>\r\n }\r\n @if (disabled()) {\r\n <mat-icon fontSet=\"material-symbols-outlined\">lock</mat-icon>\r\n }\r\n</div>\r\n}\r\n<div class=\"input\" [ngClass]=\"{ focus: hasfocus(), error: error(), textarea: numberoflines() > 1, labelabove: shortLabel() == 'above', toolicon: toolIcon()?.length ?? 0 > 0 }\" (click)=\"focusMe($event)\">\r\n @if (shortLabel() == 'above' && label() != '') {\r\n <div class=\"label-above\">\r\n {{ label() }}\r\n @if (required()) {<span style=\"color: red\"> *</span>}\r\n </div>\r\n }\r\n @if (numberoflines() == 1 && validate() != 'date' && validate() != 'checkbox' && !isselect()) {\r\n <input \r\n #inputfield \r\n [ngClass]=\"inputclasses()\"\r\n [type]=\"type() != 'password'? 'text' : 'password'\"\r\n [disabled]=\"disabled()\" \r\n [placeholder]=\"placeholder()\" \r\n [(ngModel)]=\"shadowValue\" \r\n (ngModelChange)=\"onValueChanged()\" \r\n (focus)=\"onFocus()\" \r\n (blur)=\"onBlur()\"\r\n (keydown.arrowdown)=\"ondown($event)\"\r\n (keydown.arrowup)=\"onup($event)\"\r\n (keydown.enter)=\"onenter($event)\"\r\n (keydown.esc)=\"onesc($event)\"\r\n (keydown)=\"onkeydown($event)\"\r\n [maxlength]=\"maxlength()\"/>\r\n }\r\n @if (validate() == 'checkbox') {\r\n <div class=\"checkbox\">\r\n <input \r\n type=\"checkbox\"\r\n class=\"text checkbox\"\r\n [(ngModel)]=\"shadowBool\"\r\n [disabled]=\"disabled()\"\r\n (ngModelChange)=\"onCheckboxToggle()\" \r\n (focus)=\"onFocus()\" \r\n (blur)=\"onBlurCheckbox()\"\r\n />\r\n </div>\r\n }\r\n @if (numberoflines() == 1 && validate() == 'date' && !isselect()) {\r\n <input\r\n #datefield\r\n class=\"text datepicker\"\r\n [matDatepicker]=\"picker\"\r\n [value]=\"shadowDate()\"\r\n (dateChange)=\"pickDate($event)\"\r\n [disabled]=\"disabled()\" \r\n [placeholder]=\"placeholder()\" \r\n (focus)=\"onFocus()\"\r\n (blur)=\"onBlurDate()\"/>\r\n @if (!disabled()) {\r\n <mat-icon \r\n class=\"calendar-icon\" \r\n fontSet=\"material-symbols-outlined\"\r\n (click)=\"picker.open()\">calendar_month</mat-icon>\r\n }\r\n <mat-datepicker #picker></mat-datepicker>\r\n }\r\n @if (numberoflines() > 1 && !isselect()) {\r\n <textarea\r\n #textareafield\r\n [maxlength]=\"maxlength()\"\r\n [rows]=\"numberoflines()\"\r\n [disabled]=\"disabled()\" \r\n [placeholder]=\"placeholder()\" \r\n [(ngModel)]=\"shadowValue\" \r\n [ngClass]=\"{ noresize: !resizeable() }\"\r\n (ngModelChange)=\"onValueChanged()\" \r\n (focus)=\"onFocus()\" \r\n (blur)=\"onBlur()\"\r\n (keydown.arrowdown)=\"ondown($event)\"\r\n (keydown.arrowup)=\"onup($event)\"\r\n (keydown.enter)=\"onenter($event)\"\r\n (keydown.esc)=\"onesc($event)\"\r\n (keydown)=\"onkeydown($event)\"></textarea>\r\n }\r\n @let options = selectable();\r\n @if (options && options.length > 0) {\r\n <select \r\n (change)=\"setchoice($event)\"\r\n (focus)=\"onFocus()\"\r\n (blur)=\"onBlur()\"\r\n [disabled]=\"disabled()\">\r\n @for (option of options; track option) {\r\n <option [value]=\"option.id\" [selected]=\"option == selected()\">{{ option.name }}</option>\r\n }\r\n </select>\r\n @if (!disabled()) {\r\n <mat-icon class=\"dropdown\" fontSet=\"material-symbols-outlined\">arrow_drop_down</mat-icon>\r\n }\r\n }\r\n @let ti = toolIcon();\r\n @if (!disabled() && ti && ti.length > 0) {\r\n <mat-icon class=\"toolicon\" fontSet=\"material-symbols-outlined\" (click)=\"toolClicked($event)\">{{ ti }}</mat-icon>\r\n }\r\n</div>\r\n\r\n@if (label() == '' && type() != 'number' && showlock()) {\r\n <div class=\"locked\" style=\"text-align: left;\">\r\n @if (disabled()) {\r\n <mat-icon fontSet=\"material-symbols-outlined\">lock</mat-icon>\r\n }\r\n </div>\r\n}\r\n\r\n@if (info()) {<div class=\"info\" [title]=\"info()\"><mat-icon class=\"info\">info</mat-icon></div>}\r\n", styles: [":host{position:relative;display:flex;margin-bottom:10px}:host div.autocomplete{position:absolute;z-index:100;top:37px;left:215px;right:0;background-color:red;min-height:40px;background-color:#fff;color:#000;border:solid;border-width:1px 1px 1px 1px;border-color:#d3d3d3;border-radius:4px;padding:5px;max-height:200px;overflow-x:hidden;overflow-y:auto}:host div.autocomplete.nolabel{left:0}:host div.autocomplete.shortLabel{left:124px}:host div.autocomplete div.element.selectable{cursor:pointer}@media(prefers-color-scheme:dark){:host div.autocomplete{background-color:#000;color:#fff}}@media(prefers-color-scheme:dark){:host div.autocomplete.notdark{background-color:#fff;color:#000}}:host div.autocomplete div.element{margin:5px;padding:5px;display:flex;border:solid;border-width:0 0 1px 0;border-color:#d3d3d3;font-size:14px;color:gray}:host div.autocomplete div.element.current{border-color:#0f6cbd;color:#000}:host div.autocomplete div.element div.item{flex-grow:1}:host div.label{width:180px;min-width:180px;max-height:180px;height:32px;line-height:32px}:host div.label.short{width:90px;min-width:90px}:host div.locked{width:30px;min-width:30px;max-width:30px;height:32px;line-height:32px;text-align:right;padding-right:3px}:host div.input{flex-grow:1;height:32px;line-height:32px;background-color:#e6e8e8;border-radius:3px;margin:0;padding:0;border:solid;border-width:0 0 3px 0;border-color:transparent}:host div.input.labelabove{height:48px}:host div.input.labelabove div.label-above{font-size:12px;line-height:12px;width:100%;padding-left:15px;padding-top:5px;color:gray}:host div.input.focus.labelabove div.label-above{color:#0f6cbd}:host div.input.textarea{height:inherit}:host div.info{width:30px}:host div textarea{background-color:#e6e8e8;border-radius:3px;margin:0;padding:10px 15px;border:solid;border-width:0 0 3px 0;border-color:transparent;width:100%;box-sizing:border-box}:host div.input.focus,:host div.textarea.focus,:host div.select.focus{border-color:#0f6cbd}:host div.input.error,:host div.input.focus.error,:host div.select.focus.error{border-color:red;color:red}:host input{background-color:transparent;margin:0;border:none;height:29px;padding:0 0 0 15px;width:100%;box-sizing:border-box}:host input.number{text-align:right}:host select{background-color:transparent;margin:0;border:none;height:29px;padding:0 0 0 15px;width:calc(100% - 10px);box-sizing:border-box}:host input.datepicker{width:calc(100% - 35px)}:host div.input>div.checkbox{margin-left:15px;margin-top:5px}:host div.input.above>div.checkbox{margin-top:2px}:host input.checkbox{width:15px;height:15px}:host div.input.toolicon input{width:calc(100% - 35px)}@media(prefers-color-scheme:dark){:host input{color:#000}:host input:disabled{color:#5f615f}}:host input.number{text-align:right;padding-right:15px;padding-left:0}:host *:focus{outline:none}:host mat-icon{color:#d3d3d3;font-size:12px;position:relative;top:5px;width:12px}:host textarea.noresize{resize:none}:host mat-icon.info{font-size:30px;width:30px;height:30px;color:gray}:host mat-icon.info:hover{color:#000}:host mat-icon.calendar-icon{font-size:25px;width:25px;height:25px;color:#a9a9a9}:host mat-icon.toolicon{cursor:pointer;font-size:25px;width:25px;height:25px;color:gray}:host mat-icon.dropdown{position:absolute;right:10px;top:4px;font-size:25px;width:25px;height:25px;color:gray;pointer-events:none}:host div.input.labelabove mat-icon.dropdown{top:12px}:host div.input.labelabove mat-icon.toolicon,:host div.input.labelabove mat-icon.calendar-icon{position:relative;top:-5px}:host select{appearance:none;-webkit-appearance:none;-moz-appearance:none}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox]:not([ngNoCva])[formControlName],input[type=checkbox]:not([ngNoCva])[formControl],input[type=checkbox]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "ngmodule", type: MatCheckboxModule }], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
1954
2033
|
}
|
|
1955
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2034
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiInput, decorators: [{
|
|
1956
2035
|
type: Component,
|
|
1957
|
-
args: [{ selector: 'xrmui-input', imports: [FormsModule, NgClass, MatIcon, TextFieldModule, MatDatepickerModule, MatCheckboxModule], template: "@if (showitems()) {\r\n <div class=\"autocomplete\" [ngClass]=\"{ nolabel: (!label() || label().length == 0 || shortLabel() == 'above'), shortLabel: shortLabel() == true, notdark: notdark() }\">\r\n @if (itemlist().length == 0) {\r\n <div class=\"element\"><div class=\"item\">Ingen fundet</div>div></div>\r\n }\r\n @for (elm of itemlist(); track elm) {\r\n <div #option class=\"element\" [ngClass]=\"{ current: current == elm, selectable: !elm.disabled }\" (click)=\"select($event, elm)\">\r\n <div class=\"item\">{{ elm.name }}</div>\r\n </div>\r\n }\r\n </div>\r\n}\r\n@if (label() != '' && label().length > 0 && shortLabel() != 'above') {\r\n<div class=\"label\" [ngClass]=\"{ short: shortLabel() == true }\" (click)=\"focusMe($event)\">{{ label() }}</div>\r\n}\r\n@if ((label() != '' || type() == 'number') && showlock()) {\r\n<div class=\"locked\">\r\n @if (required() && shortLabel() != 'above') {\r\n <div style=\"display: inline-block;height: 10px;color: red; position: relative; top: -8px; right: 0\">*</div>\r\n }\r\n @if (disabled()) {\r\n <mat-icon fontSet=\"material-symbols-outlined\">lock</mat-icon>\r\n }\r\n</div>\r\n}\r\n<div class=\"input\" [ngClass]=\"{ focus: hasfocus(), error: error(), textarea: numberoflines() > 1, labelabove: shortLabel() == 'above', toolicon: toolIcon()?.length ?? 0 > 0 }\" (click)=\"focusMe($event)\">\r\n @if (shortLabel() == 'above' && label() != '') {\r\n <div class=\"label-above\">\r\n {{ label() }}\r\n @if (required()) {<span style=\"color: red\"> *</span>}\r\n </div>\r\n }\r\n @if (numberoflines() == 1 && validate() != 'date' && validate() != 'checkbox' && !isselect()) {\r\n <input \r\n #inputfield \r\n [ngClass]=\"inputclasses()\"\r\n [type]=\"type() != 'password'? 'text' : 'password'\"\r\n [disabled]=\"disabled()\" \r\n [placeholder]=\"placeholder()\" \r\n [(ngModel)]=\"shadowValue\" \r\n (ngModelChange)=\"onValueChanged()\" \r\n (focus)=\"onFocus()\" \r\n (blur)=\"onBlur()\"\r\n (keydown.arrowdown)=\"ondown($event)\"\r\n (keydown.arrowup)=\"onup($event)\"\r\n (keydown.enter)=\"onenter($event)\"\r\n (keydown.esc)=\"onesc($event)\"\r\n (keydown)=\"onkeydown($event)\"\r\n [maxlength]=\"maxlength()\"/>\r\n }\r\n @if (validate() == 'checkbox') {\r\n <div class=\"checkbox\">\r\n <input \r\n type=\"checkbox\"\r\n class=\"text checkbox\"\r\n [(ngModel)]=\"shadowBool\"\r\n [disabled]=\"disabled()\"\r\n (ngModelChange)=\"onCheckboxToggle()\" \r\n (focus)=\"onFocus()\" \r\n (blur)=\"onBlurCheckbox()\"\r\n />\r\n </div>\r\n }\r\n @if (numberoflines() == 1 && validate() == 'date' && !isselect()) {\r\n <input\r\n #datefield\r\n class=\"text datepicker\"\r\n [matDatepicker]=\"picker\"\r\n [value]=\"shadowDate()\"\r\n (dateChange)=\"pickDate($event)\"\r\n [disabled]=\"disabled()\" \r\n [placeholder]=\"placeholder()\" \r\n (focus)=\"onFocus()\"\r\n (blur)=\"onBlurDate()\"/>\r\n @if (!disabled()) {\r\n <mat-icon \r\n class=\"calendar-icon\" \r\n fontSet=\"material-symbols-outlined\"\r\n (click)=\"picker.open()\">calendar_month</mat-icon>\r\n }\r\n <mat-datepicker #picker></mat-datepicker>\r\n }\r\n @if (numberoflines() > 1 && !isselect()) {\r\n <textarea\r\n #textareafield\r\n [maxlength]=\"maxlength()\"\r\n [rows]=\"numberoflines()\"\r\n [disabled]=\"disabled()\" \r\n [placeholder]=\"placeholder()\" \r\n [(ngModel)]=\"shadowValue\" \r\n [ngClass]=\"{ noresize: !resizeable() }\"\r\n (ngModelChange)=\"onValueChanged()\" \r\n (focus)=\"onFocus()\" \r\n (blur)=\"onBlur()\"\r\n (keydown.arrowdown)=\"ondown($event)\"\r\n (keydown.arrowup)=\"onup($event)\"\r\n (keydown.enter)=\"onenter($event)\"\r\n (keydown.esc)=\"onesc($event)\"\r\n (keydown)=\"onkeydown($event)\"></textarea>\r\n }\r\n @let options = selectable();\r\n @if (options && options.length > 0) {\r\n <select \r\n (change)=\"setchoice($event)\"\r\n (focus)=\"onFocus()\"\r\n (blur)=\"onBlur()\"\r\n [disabled]=\"disabled()\">\r\n @for (option of options; track option) {\r\n <option [value]=\"option.id\" [selected]=\"option == selected()\">{{ option.name }}</option>\r\n }\r\n </select>\r\n @if (!disabled()) {\r\n <mat-icon class=\"dropdown\" fontSet=\"material-symbols-outlined\">arrow_drop_down</mat-icon>\r\n }\r\n }\r\n @let ti = toolIcon();\r\n @if (!disabled() && ti && ti.length > 0) {\r\n <mat-icon class=\"toolicon\" fontSet=\"material-symbols-outlined\" (click)=\"toolClicked($event)\">{{ ti }}</mat-icon>\r\n }\r\n</div>\r\n\r\n@if (label() == '' && type() != 'number' && showlock()) {\r\n <div class=\"locked\" style=\"text-align: left;\">\r\n @if (disabled()) {\r\n <mat-icon fontSet=\"material-symbols-outlined\">lock</mat-icon>\r\n }\r\n </div>\r\n}\r\n\r\n@if (info()) {<div class=\"info\" [title]=\"info()\"><mat-icon class=\"info\">info</mat-icon></div>}\r\n", styles: [":host{position:relative;display:flex;margin-bottom:10px}:host div.autocomplete{position:absolute;z-index:100;top:37px;left:215px;right:0;background-color:red;min-height:40px;background-color:#fff;color:#000;border:solid;border-width:1px 1px 1px 1px;border-color:#d3d3d3;border-radius:4px;padding:5px;max-height:200px;overflow-x:hidden;overflow-y:auto}:host div.autocomplete.nolabel{left:0}:host div.autocomplete.shortLabel{left:124px}:host div.autocomplete div.element.selectable{cursor:pointer}@media(prefers-color-scheme:dark){:host div.autocomplete{background-color:#000;color:#fff}}@media(prefers-color-scheme:dark){:host div.autocomplete.notdark{background-color:#fff;color:#000}}:host div.autocomplete div.element{margin:5px;padding:5px;display:flex;border:solid;border-width:0 0 1px 0;border-color:#d3d3d3;font-size:14px;color:gray}:host div.autocomplete div.element.current{border-color:#0f6cbd;color:#000}:host div.autocomplete div.element div.item{flex-grow:1}:host div.label{width:180px;min-width:180px;max-height:180px;height:32px;line-height:32px}:host div.label.short{width:90px;min-width:90px}:host div.locked{width:30px;min-width:30px;max-width:30px;height:32px;line-height:32px;text-align:right;padding-right:3px}:host div.input{flex-grow:1;height:32px;line-height:32px;background-color:#e6e8e8;border-radius:3px;margin:0;padding:0;border:solid;border-width:0 0 3px 0;border-color:transparent}:host div.input.labelabove{height:48px}:host div.input.labelabove div.label-above{font-size:12px;line-height:12px;width:100%;padding-left:15px;padding-top:5px;color:gray}:host div.input.focus.labelabove div.label-above{color:#0f6cbd}:host div.input.textarea{height:inherit}:host div.info{width:30px}:host div textarea{background-color:#e6e8e8;border-radius:3px;margin:0;padding:10px 15px;border:solid;border-width:0 0 3px 0;border-color:transparent;width:100%;box-sizing:border-box}:host div.input.focus,:host div.textarea.focus,:host div.select.focus{border-color:#0f6cbd}:host div.input.error,:host div.input.focus.error,:host div.select.focus.error{border-color:red;color:red}:host input{background-color:transparent;margin:0;border:none;height:29px;padding:0 0 0 15px;width:100%;box-sizing:border-box}:host input.number{text-align:right}:host select{background-color:transparent;margin:0;border:none;height:29px;padding:0 0 0 15px;width:calc(100% - 10px);box-sizing:border-box}:host input.datepicker{width:calc(100% - 35px)}:host div.input>div.checkbox{margin-left:15px;margin-top:5px}:host div.input.above>div.checkbox{margin-top:2px}:host input.checkbox{width:15px;height:15px}:host div.input.toolicon input{width:calc(100% - 35px)}@media(prefers-color-scheme:dark){:host input{color:#000}:host input:disabled{color:#5f615f}}:host input.number{text-align:right;padding-right:15px;padding-left:0}:host *:focus{outline:none}:host mat-icon{color:#d3d3d3;font-size:12px;position:relative;top:5px;width:12px}:host textarea.noresize{resize:none}:host mat-icon.info{font-size:30px;width:30px;height:30px;color:gray}:host mat-icon.info:hover{color:#000}:host mat-icon.calendar-icon{font-size:25px;width:25px;height:25px;color:#a9a9a9}:host mat-icon.toolicon{cursor:pointer;font-size:25px;width:25px;height:25px;color:gray}:host mat-icon.dropdown{position:absolute;right:10px;top:4px;font-size:25px;width:25px;height:25px;color:gray;pointer-events:none}:host div.input.labelabove mat-icon.dropdown{top:12px}:host div.input.labelabove mat-icon.toolicon,:host div.input.labelabove mat-icon.calendar-icon{position:relative;top:-5px}:host select{appearance:none;-webkit-appearance:none;-moz-appearance:none}\n"] }]
|
|
2036
|
+
args: [{ selector: 'xrmui-input', changeDetection: ChangeDetectionStrategy.Eager, imports: [FormsModule, NgClass, MatIcon, TextFieldModule, MatDatepickerModule, MatCheckboxModule], template: "@if (showitems()) {\r\n <div class=\"autocomplete\" [ngClass]=\"{ nolabel: (!label() || label().length == 0 || shortLabel() == 'above'), shortLabel: shortLabel() == true, notdark: notdark() }\">\r\n @if (itemlist().length == 0) {\r\n <div class=\"element\"><div class=\"item\">Ingen fundet</div>div></div>\r\n }\r\n @for (elm of itemlist(); track elm) {\r\n <div #option class=\"element\" [ngClass]=\"{ current: current == elm, selectable: !elm.disabled }\" (click)=\"select($event, elm)\">\r\n <div class=\"item\">{{ elm.name }}</div>\r\n </div>\r\n }\r\n </div>\r\n}\r\n@if (label() != '' && label().length > 0 && shortLabel() != 'above') {\r\n<div class=\"label\" [ngClass]=\"{ short: shortLabel() == true }\" (click)=\"focusMe($event)\">{{ label() }}</div>\r\n}\r\n@if ((label() != '' || type() == 'number') && showlock()) {\r\n<div class=\"locked\">\r\n @if (required() && shortLabel() != 'above') {\r\n <div style=\"display: inline-block;height: 10px;color: red; position: relative; top: -8px; right: 0\">*</div>\r\n }\r\n @if (disabled()) {\r\n <mat-icon fontSet=\"material-symbols-outlined\">lock</mat-icon>\r\n }\r\n</div>\r\n}\r\n<div class=\"input\" [ngClass]=\"{ focus: hasfocus(), error: error(), textarea: numberoflines() > 1, labelabove: shortLabel() == 'above', toolicon: toolIcon()?.length ?? 0 > 0 }\" (click)=\"focusMe($event)\">\r\n @if (shortLabel() == 'above' && label() != '') {\r\n <div class=\"label-above\">\r\n {{ label() }}\r\n @if (required()) {<span style=\"color: red\"> *</span>}\r\n </div>\r\n }\r\n @if (numberoflines() == 1 && validate() != 'date' && validate() != 'checkbox' && !isselect()) {\r\n <input \r\n #inputfield \r\n [ngClass]=\"inputclasses()\"\r\n [type]=\"type() != 'password'? 'text' : 'password'\"\r\n [disabled]=\"disabled()\" \r\n [placeholder]=\"placeholder()\" \r\n [(ngModel)]=\"shadowValue\" \r\n (ngModelChange)=\"onValueChanged()\" \r\n (focus)=\"onFocus()\" \r\n (blur)=\"onBlur()\"\r\n (keydown.arrowdown)=\"ondown($event)\"\r\n (keydown.arrowup)=\"onup($event)\"\r\n (keydown.enter)=\"onenter($event)\"\r\n (keydown.esc)=\"onesc($event)\"\r\n (keydown)=\"onkeydown($event)\"\r\n [maxlength]=\"maxlength()\"/>\r\n }\r\n @if (validate() == 'checkbox') {\r\n <div class=\"checkbox\">\r\n <input \r\n type=\"checkbox\"\r\n class=\"text checkbox\"\r\n [(ngModel)]=\"shadowBool\"\r\n [disabled]=\"disabled()\"\r\n (ngModelChange)=\"onCheckboxToggle()\" \r\n (focus)=\"onFocus()\" \r\n (blur)=\"onBlurCheckbox()\"\r\n />\r\n </div>\r\n }\r\n @if (numberoflines() == 1 && validate() == 'date' && !isselect()) {\r\n <input\r\n #datefield\r\n class=\"text datepicker\"\r\n [matDatepicker]=\"picker\"\r\n [value]=\"shadowDate()\"\r\n (dateChange)=\"pickDate($event)\"\r\n [disabled]=\"disabled()\" \r\n [placeholder]=\"placeholder()\" \r\n (focus)=\"onFocus()\"\r\n (blur)=\"onBlurDate()\"/>\r\n @if (!disabled()) {\r\n <mat-icon \r\n class=\"calendar-icon\" \r\n fontSet=\"material-symbols-outlined\"\r\n (click)=\"picker.open()\">calendar_month</mat-icon>\r\n }\r\n <mat-datepicker #picker></mat-datepicker>\r\n }\r\n @if (numberoflines() > 1 && !isselect()) {\r\n <textarea\r\n #textareafield\r\n [maxlength]=\"maxlength()\"\r\n [rows]=\"numberoflines()\"\r\n [disabled]=\"disabled()\" \r\n [placeholder]=\"placeholder()\" \r\n [(ngModel)]=\"shadowValue\" \r\n [ngClass]=\"{ noresize: !resizeable() }\"\r\n (ngModelChange)=\"onValueChanged()\" \r\n (focus)=\"onFocus()\" \r\n (blur)=\"onBlur()\"\r\n (keydown.arrowdown)=\"ondown($event)\"\r\n (keydown.arrowup)=\"onup($event)\"\r\n (keydown.enter)=\"onenter($event)\"\r\n (keydown.esc)=\"onesc($event)\"\r\n (keydown)=\"onkeydown($event)\"></textarea>\r\n }\r\n @let options = selectable();\r\n @if (options && options.length > 0) {\r\n <select \r\n (change)=\"setchoice($event)\"\r\n (focus)=\"onFocus()\"\r\n (blur)=\"onBlur()\"\r\n [disabled]=\"disabled()\">\r\n @for (option of options; track option) {\r\n <option [value]=\"option.id\" [selected]=\"option == selected()\">{{ option.name }}</option>\r\n }\r\n </select>\r\n @if (!disabled()) {\r\n <mat-icon class=\"dropdown\" fontSet=\"material-symbols-outlined\">arrow_drop_down</mat-icon>\r\n }\r\n }\r\n @let ti = toolIcon();\r\n @if (!disabled() && ti && ti.length > 0) {\r\n <mat-icon class=\"toolicon\" fontSet=\"material-symbols-outlined\" (click)=\"toolClicked($event)\">{{ ti }}</mat-icon>\r\n }\r\n</div>\r\n\r\n@if (label() == '' && type() != 'number' && showlock()) {\r\n <div class=\"locked\" style=\"text-align: left;\">\r\n @if (disabled()) {\r\n <mat-icon fontSet=\"material-symbols-outlined\">lock</mat-icon>\r\n }\r\n </div>\r\n}\r\n\r\n@if (info()) {<div class=\"info\" [title]=\"info()\"><mat-icon class=\"info\">info</mat-icon></div>}\r\n", styles: [":host{position:relative;display:flex;margin-bottom:10px}:host div.autocomplete{position:absolute;z-index:100;top:37px;left:215px;right:0;background-color:red;min-height:40px;background-color:#fff;color:#000;border:solid;border-width:1px 1px 1px 1px;border-color:#d3d3d3;border-radius:4px;padding:5px;max-height:200px;overflow-x:hidden;overflow-y:auto}:host div.autocomplete.nolabel{left:0}:host div.autocomplete.shortLabel{left:124px}:host div.autocomplete div.element.selectable{cursor:pointer}@media(prefers-color-scheme:dark){:host div.autocomplete{background-color:#000;color:#fff}}@media(prefers-color-scheme:dark){:host div.autocomplete.notdark{background-color:#fff;color:#000}}:host div.autocomplete div.element{margin:5px;padding:5px;display:flex;border:solid;border-width:0 0 1px 0;border-color:#d3d3d3;font-size:14px;color:gray}:host div.autocomplete div.element.current{border-color:#0f6cbd;color:#000}:host div.autocomplete div.element div.item{flex-grow:1}:host div.label{width:180px;min-width:180px;max-height:180px;height:32px;line-height:32px}:host div.label.short{width:90px;min-width:90px}:host div.locked{width:30px;min-width:30px;max-width:30px;height:32px;line-height:32px;text-align:right;padding-right:3px}:host div.input{flex-grow:1;height:32px;line-height:32px;background-color:#e6e8e8;border-radius:3px;margin:0;padding:0;border:solid;border-width:0 0 3px 0;border-color:transparent}:host div.input.labelabove{height:48px}:host div.input.labelabove div.label-above{font-size:12px;line-height:12px;width:100%;padding-left:15px;padding-top:5px;color:gray}:host div.input.focus.labelabove div.label-above{color:#0f6cbd}:host div.input.textarea{height:inherit}:host div.info{width:30px}:host div textarea{background-color:#e6e8e8;border-radius:3px;margin:0;padding:10px 15px;border:solid;border-width:0 0 3px 0;border-color:transparent;width:100%;box-sizing:border-box}:host div.input.focus,:host div.textarea.focus,:host div.select.focus{border-color:#0f6cbd}:host div.input.error,:host div.input.focus.error,:host div.select.focus.error{border-color:red;color:red}:host input{background-color:transparent;margin:0;border:none;height:29px;padding:0 0 0 15px;width:100%;box-sizing:border-box}:host input.number{text-align:right}:host select{background-color:transparent;margin:0;border:none;height:29px;padding:0 0 0 15px;width:calc(100% - 10px);box-sizing:border-box}:host input.datepicker{width:calc(100% - 35px)}:host div.input>div.checkbox{margin-left:15px;margin-top:5px}:host div.input.above>div.checkbox{margin-top:2px}:host input.checkbox{width:15px;height:15px}:host div.input.toolicon input{width:calc(100% - 35px)}@media(prefers-color-scheme:dark){:host input{color:#000}:host input:disabled{color:#5f615f}}:host input.number{text-align:right;padding-right:15px;padding-left:0}:host *:focus{outline:none}:host mat-icon{color:#d3d3d3;font-size:12px;position:relative;top:5px;width:12px}:host textarea.noresize{resize:none}:host mat-icon.info{font-size:30px;width:30px;height:30px;color:gray}:host mat-icon.info:hover{color:#000}:host mat-icon.calendar-icon{font-size:25px;width:25px;height:25px;color:#a9a9a9}:host mat-icon.toolicon{cursor:pointer;font-size:25px;width:25px;height:25px;color:gray}:host mat-icon.dropdown{position:absolute;right:10px;top:4px;font-size:25px;width:25px;height:25px;color:gray;pointer-events:none}:host div.input.labelabove mat-icon.dropdown{top:12px}:host div.input.labelabove mat-icon.toolicon,:host div.input.labelabove mat-icon.calendar-icon{position:relative;top:-5px}:host select{appearance:none;-webkit-appearance:none;-moz-appearance:none}\n"] }]
|
|
1958
2037
|
}], ctorParameters: () => [], propDecorators: { searchElement: [{
|
|
1959
2038
|
type: ViewChild,
|
|
1960
2039
|
args: ['inputfield']
|
|
@@ -1970,15 +2049,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
|
|
|
1970
2049
|
}], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], _shortLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "short-label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], _disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], _showlock: [{ type: i0.Input, args: [{ isSignal: true, alias: "showlock", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], setfocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "setfocus", required: false }] }, { type: i0.Output, args: ["setfocusChange"] }], autocomplete: [{ type: i0.Input, args: [{ isSignal: true, alias: "autocomplete", required: false }] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }, { type: i0.Output, args: ["selectedChange"] }], optionsetvalue: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionsetvalue", required: false }] }], entityreference: [{ type: i0.Input, args: [{ isSignal: true, alias: "entityreference", required: false }] }], onselect: [{ type: i0.Output, args: ["onselect"] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], validate: [{ type: i0.Input, args: [{ isSignal: true, alias: "validate", required: false }] }, { type: i0.Output, args: ["validateChange"] }], decimals: [{ type: i0.Input, args: [{ isSignal: true, alias: "decimals", required: false }] }], onfocusEvent: [{ type: i0.Output, args: ["focus"] }], onblurEvent: [{ type: i0.Output, args: ["blur"] }], click: [{ type: i0.Output, args: ["click"] }], resizeable: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizeable", required: false }] }], info: [{ type: i0.Input, args: [{ isSignal: true, alias: "info", required: false }] }], notdark: [{ type: i0.Input, args: [{ isSignal: true, alias: "notdark", required: false }] }], _autoopenonblank: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoopenonblank", required: false }] }], nullable: [{ type: i0.Input, args: [{ isSignal: true, alias: "nullable", required: false }] }], decimalsUsed: [{ type: i0.Output, args: ["decimalsUsed"] }], onEnter: [{ type: i0.Output, args: ["onEnter"] }], toolIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "toolIcon", required: false }] }], toolClick: [{ type: i0.Output, args: ["toolClick"] }], numberoflines: [{ type: i0.Input, args: [{ isSignal: true, alias: "numberoflines", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }] } });
|
|
1971
2050
|
|
|
1972
2051
|
class XrmuiRibbon {
|
|
1973
|
-
fill = input(true,
|
|
2052
|
+
fill = input(true, /* @ts-ignore */
|
|
2053
|
+
...(ngDevMode ? [{ debugName: "fill" }] : /* istanbul ignore next */ []));
|
|
1974
2054
|
constructor() {
|
|
1975
2055
|
}
|
|
1976
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1977
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2056
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiRibbon, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2057
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: XrmuiRibbon, isStandalone: true, selector: "xrmui-ribbon", inputs: { fill: { classPropertyName: "fill", publicName: "fill", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ng-content></ng-content>\r\n@if (fill()) {<div class=\"therest\"> </div>}", styles: [":host{border:solid;border-width:1px 1px 1px 1px;border-color:#d3d3d3;border-style:solid;border-radius:5px;display:block;margin:10px;padding:0 15px;box-shadow:1px 1px #d3d3d3;line-height:30px;display:flex}:host.raw{margin:0}:host div.therest{flex-grow:1}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
1978
2058
|
}
|
|
1979
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2059
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiRibbon, decorators: [{
|
|
1980
2060
|
type: Component,
|
|
1981
|
-
args: [{ selector: 'xrmui-ribbon', template: "<ng-content></ng-content>\r\n@if (fill()) {<div class=\"therest\"> </div>}", styles: [":host{border:solid;border-width:1px 1px 1px 1px;border-color:#d3d3d3;border-style:solid;border-radius:5px;display:block;margin:10px;padding:0 15px;box-shadow:1px 1px #d3d3d3;line-height:30px;display:flex}:host.raw{margin:0}:host div.therest{flex-grow:1}\n"] }]
|
|
2061
|
+
args: [{ selector: 'xrmui-ribbon', changeDetection: ChangeDetectionStrategy.Eager, template: "<ng-content></ng-content>\r\n@if (fill()) {<div class=\"therest\"> </div>}", styles: [":host{border:solid;border-width:1px 1px 1px 1px;border-color:#d3d3d3;border-style:solid;border-radius:5px;display:block;margin:10px;padding:0 15px;box-shadow:1px 1px #d3d3d3;line-height:30px;display:flex}:host.raw{margin:0}:host div.therest{flex-grow:1}\n"] }]
|
|
1982
2062
|
}], ctorParameters: () => [], propDecorators: { fill: [{ type: i0.Input, args: [{ isSignal: true, alias: "fill", required: false }] }] } });
|
|
1983
2063
|
|
|
1984
2064
|
class XrmuiSpinner {
|
|
@@ -2002,12 +2082,12 @@ class XrmuiSpinner {
|
|
|
2002
2082
|
}
|
|
2003
2083
|
}
|
|
2004
2084
|
}
|
|
2005
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2006
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
2085
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiSpinner, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2086
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.1", type: XrmuiSpinner, isStandalone: true, selector: "xrmui-spinner", inputs: { diameter: "diameter" }, ngImport: i0, template: "<mat-progress-spinner mode=\"indeterminate\" [diameter]=\"diameter\" />", styles: [""], dependencies: [{ kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
2007
2087
|
}
|
|
2008
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2088
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiSpinner, decorators: [{
|
|
2009
2089
|
type: Component,
|
|
2010
|
-
args: [{ selector: 'xrmui-spinner', imports: [MatProgressSpinnerModule], template: "<mat-progress-spinner mode=\"indeterminate\" [diameter]=\"diameter\" />" }]
|
|
2090
|
+
args: [{ selector: 'xrmui-spinner', changeDetection: ChangeDetectionStrategy.Eager, imports: [MatProgressSpinnerModule], template: "<mat-progress-spinner mode=\"indeterminate\" [diameter]=\"diameter\" />" }]
|
|
2011
2091
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { diameter: [{
|
|
2012
2092
|
type: Input,
|
|
2013
2093
|
args: ['diameter']
|
|
@@ -2044,12 +2124,12 @@ class XrmuiButton {
|
|
|
2044
2124
|
ngOnChanges(changes) {
|
|
2045
2125
|
this.isCurrent = this.menu.length > 0 && this.current != undefined && this.menu.find(m => m == this.current) != null;
|
|
2046
2126
|
}
|
|
2047
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2048
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2127
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiButton, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2128
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: XrmuiButton, isStandalone: true, selector: "xrmui-button", inputs: { label: "label", icon: "icon", disabled: "disabled", working: "working", menu: "menu", current: "current", selected: "selected" }, outputs: { clicked: "click" }, usesOnChanges: true, ngImport: i0, template: "@if (menu == undefined || menu.length == 0 || disabled) {\r\n<button [disabled]=\"disabled\" (click)=\"onClick($event)\" [ngClass]=\"{ selected: selected }\">\r\n @if (working) {\r\n <div class=\"spin\">\r\n <xrmui-spinner [diameter]=\"20\"></xrmui-spinner>\r\n </div>\r\n }\r\n @if (icon != ''){<mat-icon fontSet=\"material-symbols-outlined\">{{ icon }}</mat-icon>}\r\n @if (label != ''){ {{ label }} }\r\n </button>\r\n}\r\n@if (menu != null && menu.length > 0 && !disabled) {\r\n <button [matMenuTriggerFor]=\"menupopup\" [ngClass]=\"{ selected: isCurrent || selected }\" (click)=\"ignore($event)\">\r\n @if (!isCurrent) {\r\n @if (icon != '') {<mat-icon fontSet=\"material-symbols-outlined\">{{ icon }}</mat-icon>}\r\n @if (label != '') { {{ label }} }\r\n }\r\n @if (current != undefined && isCurrent) {\r\n @if (current.icon != undefined && current.icon != '') {<mat-icon fontSet=\"material-symbols-outlined\">{{ current.icon }}</mat-icon>}\r\n @if (current.label != undefined && current.label != '') { {{ current.label }} }\r\n }\r\n </button>\r\n <mat-menu #menupopup>\r\n @for (m of menu; track m.label) {\r\n <button mat-menu-item (click)=\"onClick($event, m)\">\r\n @if (m.icon != undefined && m.icon != '') {<mat-icon fontSet=\"material-symbols-outlined\">{{ m.icon }}</mat-icon>}\r\n @if (m.label != undefined && m.label != '') { {{ m.label }} }\r\n </button>\r\n }\r\n </mat-menu>\r\n}\r\n", styles: [":host button{border:solid;border-width:1px;border-color:transparent;border-radius:3px;background-color:transparent;cursor:pointer;line-height:20px;padding-left:3px;padding-right:3px;margin-top:2px;margin-bottom:2px;margin-right:3px;color:#5c5858}@media(prefers-color-scheme:dark){:host button{color:#fff}}:host div.spin{position:absolute;margin:auto;padding-left:25px}:host(.selected) button:hover,:host button:hover{background-color:#f0eded;border-color:#f0eded;color:#5c5858}@media(prefers-color-scheme:dark){:host(.selected) button:hover,:host button:hover{background-color:#5c5858;border-color:#5c5858;color:#f0eded}}:host(.ommit-over) button:hover,:host(.selected.ommit-over) button:hover,:host button:hover{background-color:transparent;border-color:transparent;color:#5c5858}@media(prefers-color-scheme:dark){:host(.ommit-over) button:hover,:host(.selected.ommit-over) button:hover,:host button:hover{color:#fff}}:host button:disabled,:host button:hover:disabled{cursor:default;color:#d1cfcf;background-color:transparent;border-color:transparent}:host(.selected) button{background-color:#5c5858;border-color:#5c5858;color:#fff}@media(prefers-color-scheme:dark){:host(.selected) button{background-color:#fff;border-color:#fff;color:#5c5858}}:host mat-icon{position:relative;top:3px;margin-right:2px;font-size:16px;height:16px}:host button.selected{background-color:#5c5858;border-color:#5c5858;color:#fff}@media(prefers-color-scheme:dark){:host button.selected{background-color:#fff;border-color:#fff;color:#5c5858}}\n"], dependencies: [{ kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i1$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: XrmuiSpinner, selector: "xrmui-spinner", inputs: ["diameter"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
2049
2129
|
}
|
|
2050
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2130
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiButton, decorators: [{
|
|
2051
2131
|
type: Component,
|
|
2052
|
-
args: [{ selector: 'xrmui-button', imports: [MatMenuModule, NgClass, MatIcon, XrmuiSpinner], template: "@if (menu == undefined || menu.length == 0 || disabled) {\r\n<button [disabled]=\"disabled\" (click)=\"onClick($event)\" [ngClass]=\"{ selected: selected }\">\r\n @if (working) {\r\n <div class=\"spin\">\r\n <xrmui-spinner [diameter]=\"20\"></xrmui-spinner>\r\n </div>\r\n }\r\n @if (icon != ''){<mat-icon fontSet=\"material-symbols-outlined\">{{ icon }}</mat-icon>}\r\n @if (label != ''){ {{ label }} }\r\n </button>\r\n}\r\n@if (menu != null && menu.length > 0 && !disabled) {\r\n <button [matMenuTriggerFor]=\"menupopup\" [ngClass]=\"{ selected: isCurrent || selected }\" (click)=\"ignore($event)\">\r\n @if (!isCurrent) {\r\n @if (icon != '') {<mat-icon fontSet=\"material-symbols-outlined\">{{ icon }}</mat-icon>}\r\n @if (label != '') { {{ label }} }\r\n }\r\n @if (current != undefined && isCurrent) {\r\n @if (current.icon != undefined && current.icon != '') {<mat-icon fontSet=\"material-symbols-outlined\">{{ current.icon }}</mat-icon>}\r\n @if (current.label != undefined && current.label != '') { {{ current.label }} }\r\n }\r\n </button>\r\n <mat-menu #menupopup>\r\n @for (m of menu; track m.label) {\r\n <button mat-menu-item (click)=\"onClick($event, m)\">\r\n @if (m.icon != undefined && m.icon != '') {<mat-icon fontSet=\"material-symbols-outlined\">{{ m.icon }}</mat-icon>}\r\n @if (m.label != undefined && m.label != '') { {{ m.label }} }\r\n </button>\r\n }\r\n </mat-menu>\r\n}\r\n", styles: [":host button{border:solid;border-width:1px;border-color:transparent;border-radius:3px;background-color:transparent;cursor:pointer;line-height:20px;padding-left:3px;padding-right:3px;margin-top:2px;margin-bottom:2px;margin-right:3px;color:#5c5858}@media(prefers-color-scheme:dark){:host button{color:#fff}}:host div.spin{position:absolute;margin:auto;padding-left:25px}:host(.selected) button:hover,:host button:hover{background-color:#f0eded;border-color:#f0eded;color:#5c5858}@media(prefers-color-scheme:dark){:host(.selected) button:hover,:host button:hover{background-color:#5c5858;border-color:#5c5858;color:#f0eded}}:host(.ommit-over) button:hover,:host(.selected.ommit-over) button:hover,:host button:hover{background-color:transparent;border-color:transparent;color:#5c5858}@media(prefers-color-scheme:dark){:host(.ommit-over) button:hover,:host(.selected.ommit-over) button:hover,:host button:hover{color:#fff}}:host button:disabled,:host button:hover:disabled{cursor:default;color:#d1cfcf;background-color:transparent;border-color:transparent}:host(.selected) button{background-color:#5c5858;border-color:#5c5858;color:#fff}@media(prefers-color-scheme:dark){:host(.selected) button{background-color:#fff;border-color:#fff;color:#5c5858}}:host mat-icon{position:relative;top:3px;margin-right:2px;font-size:16px;height:16px}:host button.selected{background-color:#5c5858;border-color:#5c5858;color:#fff}@media(prefers-color-scheme:dark){:host button.selected{background-color:#fff;border-color:#fff;color:#5c5858}}\n"] }]
|
|
2132
|
+
args: [{ selector: 'xrmui-button', changeDetection: ChangeDetectionStrategy.Eager, imports: [MatMenuModule, NgClass, MatIcon, XrmuiSpinner], template: "@if (menu == undefined || menu.length == 0 || disabled) {\r\n<button [disabled]=\"disabled\" (click)=\"onClick($event)\" [ngClass]=\"{ selected: selected }\">\r\n @if (working) {\r\n <div class=\"spin\">\r\n <xrmui-spinner [diameter]=\"20\"></xrmui-spinner>\r\n </div>\r\n }\r\n @if (icon != ''){<mat-icon fontSet=\"material-symbols-outlined\">{{ icon }}</mat-icon>}\r\n @if (label != ''){ {{ label }} }\r\n </button>\r\n}\r\n@if (menu != null && menu.length > 0 && !disabled) {\r\n <button [matMenuTriggerFor]=\"menupopup\" [ngClass]=\"{ selected: isCurrent || selected }\" (click)=\"ignore($event)\">\r\n @if (!isCurrent) {\r\n @if (icon != '') {<mat-icon fontSet=\"material-symbols-outlined\">{{ icon }}</mat-icon>}\r\n @if (label != '') { {{ label }} }\r\n }\r\n @if (current != undefined && isCurrent) {\r\n @if (current.icon != undefined && current.icon != '') {<mat-icon fontSet=\"material-symbols-outlined\">{{ current.icon }}</mat-icon>}\r\n @if (current.label != undefined && current.label != '') { {{ current.label }} }\r\n }\r\n </button>\r\n <mat-menu #menupopup>\r\n @for (m of menu; track m.label) {\r\n <button mat-menu-item (click)=\"onClick($event, m)\">\r\n @if (m.icon != undefined && m.icon != '') {<mat-icon fontSet=\"material-symbols-outlined\">{{ m.icon }}</mat-icon>}\r\n @if (m.label != undefined && m.label != '') { {{ m.label }} }\r\n </button>\r\n }\r\n </mat-menu>\r\n}\r\n", styles: [":host button{border:solid;border-width:1px;border-color:transparent;border-radius:3px;background-color:transparent;cursor:pointer;line-height:20px;padding-left:3px;padding-right:3px;margin-top:2px;margin-bottom:2px;margin-right:3px;color:#5c5858}@media(prefers-color-scheme:dark){:host button{color:#fff}}:host div.spin{position:absolute;margin:auto;padding-left:25px}:host(.selected) button:hover,:host button:hover{background-color:#f0eded;border-color:#f0eded;color:#5c5858}@media(prefers-color-scheme:dark){:host(.selected) button:hover,:host button:hover{background-color:#5c5858;border-color:#5c5858;color:#f0eded}}:host(.ommit-over) button:hover,:host(.selected.ommit-over) button:hover,:host button:hover{background-color:transparent;border-color:transparent;color:#5c5858}@media(prefers-color-scheme:dark){:host(.ommit-over) button:hover,:host(.selected.ommit-over) button:hover,:host button:hover{color:#fff}}:host button:disabled,:host button:hover:disabled{cursor:default;color:#d1cfcf;background-color:transparent;border-color:transparent}:host(.selected) button{background-color:#5c5858;border-color:#5c5858;color:#fff}@media(prefers-color-scheme:dark){:host(.selected) button{background-color:#fff;border-color:#fff;color:#5c5858}}:host mat-icon{position:relative;top:3px;margin-right:2px;font-size:16px;height:16px}:host button.selected{background-color:#5c5858;border-color:#5c5858;color:#fff}@media(prefers-color-scheme:dark){:host button.selected{background-color:#fff;border-color:#fff;color:#5c5858}}\n"] }]
|
|
2053
2133
|
}], ctorParameters: () => [], propDecorators: { label: [{
|
|
2054
2134
|
type: Input,
|
|
2055
2135
|
args: ['label']
|
|
@@ -2077,34 +2157,38 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
|
|
|
2077
2157
|
}] } });
|
|
2078
2158
|
|
|
2079
2159
|
class XrmuiDevider {
|
|
2080
|
-
orientation = input('vertical',
|
|
2160
|
+
orientation = input('vertical', /* @ts-ignore */
|
|
2161
|
+
...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
|
|
2081
2162
|
constructor() {
|
|
2082
2163
|
}
|
|
2083
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2084
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
2164
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiDevider, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2165
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.1", type: XrmuiDevider, isStandalone: true, selector: "xrmui-devider", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div [ngClass]=\"orientation()\"> </div>", styles: [":host div.horizontal{width:100%;height:1px;background-color:#d3d3d3;overflow:hidden;margin-left:5px;margin-right:5px;display:block}:host div.vertical{display:inline-block;line-height:100%;background-color:#d3d3d3;width:1px;overflow:hidden;margin:3px 5px;height:80%}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
2085
2166
|
}
|
|
2086
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2167
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiDevider, decorators: [{
|
|
2087
2168
|
type: Component,
|
|
2088
|
-
args: [{ selector: 'xrmui-devider', imports: [NgClass], template: "<div [ngClass]=\"orientation()\"> </div>", styles: [":host div.horizontal{width:100%;height:1px;background-color:#d3d3d3;overflow:hidden;margin-left:5px;margin-right:5px;display:block}:host div.vertical{display:inline-block;line-height:100%;background-color:#d3d3d3;width:1px;overflow:hidden;margin:3px 5px;height:80%}\n"] }]
|
|
2169
|
+
args: [{ selector: 'xrmui-devider', changeDetection: ChangeDetectionStrategy.Eager, imports: [NgClass], template: "<div [ngClass]=\"orientation()\"> </div>", styles: [":host div.horizontal{width:100%;height:1px;background-color:#d3d3d3;overflow:hidden;margin-left:5px;margin-right:5px;display:block}:host div.vertical{display:inline-block;line-height:100%;background-color:#d3d3d3;width:1px;overflow:hidden;margin:3px 5px;height:80%}\n"] }]
|
|
2089
2170
|
}], ctorParameters: () => [], propDecorators: { orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }] } });
|
|
2090
2171
|
|
|
2091
2172
|
class XrmuiTabs {
|
|
2092
|
-
tabs = input.required(
|
|
2093
|
-
|
|
2094
|
-
|
|
2173
|
+
tabs = input.required(/* @ts-ignore */
|
|
2174
|
+
...(ngDevMode ? [{ debugName: "tabs" }] : /* istanbul ignore next */ []));
|
|
2175
|
+
burgers = input([], /* @ts-ignore */
|
|
2176
|
+
...(ngDevMode ? [{ debugName: "burgers" }] : /* istanbul ignore next */ []));
|
|
2177
|
+
current = model.required(/* @ts-ignore */
|
|
2178
|
+
...(ngDevMode ? [{ debugName: "current" }] : /* istanbul ignore next */ []));
|
|
2095
2179
|
constructor() {
|
|
2096
2180
|
}
|
|
2097
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2098
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2181
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiTabs, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2182
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: XrmuiTabs, isStandalone: true, selector: "xrmui-tabs", inputs: { tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: true, transformFunction: null }, burgers: { classPropertyName: "burgers", publicName: "burgers", isSignal: true, isRequired: false, transformFunction: null }, current: { classPropertyName: "current", publicName: "current", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { current: "currentChange" }, providers: [], ngImport: i0, template: "<div class=\"xrmui-tabs\">\r\n@for (tab of tabs(); track tab; let idx = $index) {\r\n @if (tab.visible == undefined || tab.visible()) {\r\n <div class=\"xrmui-tab\" [ngClass]=\"{ 'current' : tab == current(), 'disabled': tab.disabled, error: tab != current() && tab.error != undefined && tab.error()}\" (click)=\"current.set(tab)\">\r\n @if (tab.badget != undefined && tab.badget > 0) {\r\n <div [matBadge]=\"tab.badget\" [matBadgeOverlap]=\"false\">\r\n @if (tab.icon != undefined && tab.icon != null && tab.icon != ''){<div class=\"icon\"><mat-icon class=\"mat-icon-14\">{{ tab.icon }}</mat-icon></div>}\r\n <span>\r\n @if (tab.label != undefined && tab.label != null && tab.label != '') { {{ tab.label }} }\r\n @if (tab.label == undefined || tab.label == null || tab.label == '') { {{ tab.id }} }\r\n </span>\r\n </div>\r\n }\r\n\r\n @if (tab.badget == undefined || tab.badget == 0) {\r\n @if (tab.icon != undefined && tab.icon != null && tab.icon != ''){<div class=\"icon\"><mat-icon class=\"mat-icon-14\">{{ tab.icon }}</mat-icon></div>}\r\n <span>\r\n @if (tab.label != undefined && tab.label != null && tab.label != '') { {{ tab.label }} }\r\n @if (tab.label == undefined || tab.label == null || tab.label == '') { {{ tab.id }} }\r\n </span>\r\n }\r\n </div>\r\n }\r\n}\r\n</div>", styles: [":host div.xrmui-tabs{display:flex}:host div.xrmui-tab{margin:10px 5px 5px;padding:10px 10px 8px;font-family:var(--mat-sys-body-medium-font);border:solid;border-width:0 0 2px 0;border-color:#d3d3d3;color:gray;cursor:pointer;font-size:small}:host div.xrmui-tab.current{border-color:#0f6cbd;color:#0f6cbd}:host div.xrmui-tab.disabled{border-color:#d3d3d3;color:#d3d3d3;cursor:auto}:host div.xrmui-tab.space{flex-grow:1;border-color:transparent;cursor:default}:host div.xrmui-burger{padding-top:15px;width:20px;cursor:pointer}:host button.xrmui-burger-button{border:none;background-color:transparent;height:25px;overflow:hidden;margin:0;padding:0}:host div.icon{float:left;padding-right:3px}:host mat-icon.mat-icon-14{font-size:14px;width:14px;height:14px}:host .error{--color1: #FF6347;--color2: #f7f7f7;--duration: 3s;background-color:var(--color1);-webkit-animation-name:colorPulser;-webkit-animation-duration:var(--duration);animation-name:colorPulser;animation-duration:var(--duration);animation-iteration-count:infinite}@-webkit-keyframes colorPulser{0%{background-color:var(--color1)}50%{background-color:var(--color2)}to{background-color:var(--color1)}}@keyframes colorPulser{0%{background-color:var(--color1)}50%{background-color:var(--color2)}to{background-color:var(--color1)}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatIconModule }], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
2099
2183
|
}
|
|
2100
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2184
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: XrmuiTabs, decorators: [{
|
|
2101
2185
|
type: Component,
|
|
2102
|
-
args: [{ selector: 'xrmui-tabs', imports: [NgClass, MatIcon, MatBadge, MatButtonModule, MatMenuModule, MatIconModule], providers: [], template: "<div class=\"xrmui-tabs\">\r\n@for (tab of tabs(); track tab; let idx = $index) {\r\n @if (tab.visible == undefined || tab.visible()) {\r\n <div class=\"xrmui-tab\" [ngClass]=\"{ 'current' : tab == current(), 'disabled': tab.disabled, error: tab != current() && tab.error != undefined && tab.error()}\" (click)=\"current.set(tab)\">\r\n @if (tab.badget != undefined && tab.badget > 0) {\r\n <div [matBadge]=\"tab.badget\" [matBadgeOverlap]=\"false\">\r\n @if (tab.icon != undefined && tab.icon != null && tab.icon != ''){<div class=\"icon\"><mat-icon class=\"mat-icon-14\">{{ tab.icon }}</mat-icon></div>}\r\n <span>\r\n @if (tab.label != undefined && tab.label != null && tab.label != '') { {{ tab.label }} }\r\n @if (tab.label == undefined || tab.label == null || tab.label == '') { {{ tab.id }} }\r\n </span>\r\n </div>\r\n }\r\n\r\n @if (tab.badget == undefined || tab.badget == 0) {\r\n @if (tab.icon != undefined && tab.icon != null && tab.icon != ''){<div class=\"icon\"><mat-icon class=\"mat-icon-14\">{{ tab.icon }}</mat-icon></div>}\r\n <span>\r\n @if (tab.label != undefined && tab.label != null && tab.label != '') { {{ tab.label }} }\r\n @if (tab.label == undefined || tab.label == null || tab.label == '') { {{ tab.id }} }\r\n </span>\r\n }\r\n </div>\r\n }\r\n}\r\n</div>", styles: [":host div.xrmui-tabs{display:flex}:host div.xrmui-tab{margin:10px 5px 5px;padding:10px 10px 8px;font-family:var(--mat-sys-body-medium-font);border:solid;border-width:0 0 2px 0;border-color:#d3d3d3;color:gray;cursor:pointer;font-size:small}:host div.xrmui-tab.current{border-color:#0f6cbd;color:#0f6cbd}:host div.xrmui-tab.disabled{border-color:#d3d3d3;color:#d3d3d3;cursor:auto}:host div.xrmui-tab.space{flex-grow:1;border-color:transparent;cursor:default}:host div.xrmui-burger{padding-top:15px;width:20px;cursor:pointer}:host button.xrmui-burger-button{border:none;background-color:transparent;height:25px;overflow:hidden;margin:0;padding:0}:host div.icon{float:left;padding-right:3px}:host mat-icon.mat-icon-14{font-size:14px;width:14px;height:14px}:host .error{--color1: #FF6347;--color2: #f7f7f7;--duration: 3s;background-color:var(--color1);-webkit-animation-name:colorPulser;-webkit-animation-duration:var(--duration);animation-name:colorPulser;animation-duration:var(--duration);animation-iteration-count:infinite}@-webkit-keyframes colorPulser{0%{background-color:var(--color1)}50%{background-color:var(--color2)}to{background-color:var(--color1)}}@keyframes colorPulser{0%{background-color:var(--color1)}50%{background-color:var(--color2)}to{background-color:var(--color1)}}\n"] }]
|
|
2186
|
+
args: [{ selector: 'xrmui-tabs', imports: [NgClass, MatIcon, MatBadge, MatButtonModule, MatMenuModule, MatIconModule], changeDetection: ChangeDetectionStrategy.Eager, providers: [], template: "<div class=\"xrmui-tabs\">\r\n@for (tab of tabs(); track tab; let idx = $index) {\r\n @if (tab.visible == undefined || tab.visible()) {\r\n <div class=\"xrmui-tab\" [ngClass]=\"{ 'current' : tab == current(), 'disabled': tab.disabled, error: tab != current() && tab.error != undefined && tab.error()}\" (click)=\"current.set(tab)\">\r\n @if (tab.badget != undefined && tab.badget > 0) {\r\n <div [matBadge]=\"tab.badget\" [matBadgeOverlap]=\"false\">\r\n @if (tab.icon != undefined && tab.icon != null && tab.icon != ''){<div class=\"icon\"><mat-icon class=\"mat-icon-14\">{{ tab.icon }}</mat-icon></div>}\r\n <span>\r\n @if (tab.label != undefined && tab.label != null && tab.label != '') { {{ tab.label }} }\r\n @if (tab.label == undefined || tab.label == null || tab.label == '') { {{ tab.id }} }\r\n </span>\r\n </div>\r\n }\r\n\r\n @if (tab.badget == undefined || tab.badget == 0) {\r\n @if (tab.icon != undefined && tab.icon != null && tab.icon != ''){<div class=\"icon\"><mat-icon class=\"mat-icon-14\">{{ tab.icon }}</mat-icon></div>}\r\n <span>\r\n @if (tab.label != undefined && tab.label != null && tab.label != '') { {{ tab.label }} }\r\n @if (tab.label == undefined || tab.label == null || tab.label == '') { {{ tab.id }} }\r\n </span>\r\n }\r\n </div>\r\n }\r\n}\r\n</div>", styles: [":host div.xrmui-tabs{display:flex}:host div.xrmui-tab{margin:10px 5px 5px;padding:10px 10px 8px;font-family:var(--mat-sys-body-medium-font);border:solid;border-width:0 0 2px 0;border-color:#d3d3d3;color:gray;cursor:pointer;font-size:small}:host div.xrmui-tab.current{border-color:#0f6cbd;color:#0f6cbd}:host div.xrmui-tab.disabled{border-color:#d3d3d3;color:#d3d3d3;cursor:auto}:host div.xrmui-tab.space{flex-grow:1;border-color:transparent;cursor:default}:host div.xrmui-burger{padding-top:15px;width:20px;cursor:pointer}:host button.xrmui-burger-button{border:none;background-color:transparent;height:25px;overflow:hidden;margin:0;padding:0}:host div.icon{float:left;padding-right:3px}:host mat-icon.mat-icon-14{font-size:14px;width:14px;height:14px}:host .error{--color1: #FF6347;--color2: #f7f7f7;--duration: 3s;background-color:var(--color1);-webkit-animation-name:colorPulser;-webkit-animation-duration:var(--duration);animation-name:colorPulser;animation-duration:var(--duration);animation-iteration-count:infinite}@-webkit-keyframes colorPulser{0%{background-color:var(--color1)}50%{background-color:var(--color2)}to{background-color:var(--color1)}}@keyframes colorPulser{0%{background-color:var(--color1)}50%{background-color:var(--color2)}to{background-color:var(--color1)}}\n"] }]
|
|
2103
2187
|
}], ctorParameters: () => [], propDecorators: { tabs: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabs", required: true }] }], burgers: [{ type: i0.Input, args: [{ isSignal: true, alias: "burgers", required: false }] }], current: [{ type: i0.Input, args: [{ isSignal: true, alias: "current", required: true }] }, { type: i0.Output, args: ["currentChange"] }] } });
|
|
2104
2188
|
|
|
2105
2189
|
class BorutoXrmUIModule {
|
|
2106
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2107
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
2190
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: BorutoXrmUIModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
2191
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.1", ngImport: i0, type: BorutoXrmUIModule, imports: [XrmuiInfo,
|
|
2108
2192
|
XrmuiLayout,
|
|
2109
2193
|
XrmuiPanel,
|
|
2110
2194
|
XrmuiIcon,
|
|
@@ -2127,14 +2211,14 @@ class BorutoXrmUIModule {
|
|
|
2127
2211
|
XrmuiTabs,
|
|
2128
2212
|
ChangeScopeDirective,
|
|
2129
2213
|
FormScopeDirective] });
|
|
2130
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
2214
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: BorutoXrmUIModule, imports: [XrmuiInfo,
|
|
2131
2215
|
XrmuiIcon,
|
|
2132
2216
|
XrmuiInput,
|
|
2133
2217
|
XrmuiSpinner,
|
|
2134
2218
|
XrmuiButton,
|
|
2135
2219
|
XrmuiTabs] });
|
|
2136
2220
|
}
|
|
2137
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2221
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: BorutoXrmUIModule, decorators: [{
|
|
2138
2222
|
type: NgModule,
|
|
2139
2223
|
args: [{
|
|
2140
2224
|
imports: [
|