@ajf/material 13.2.11 → 13.2.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/form-builder/form-builder-service.mjs +20 -6
- package/esm2020/form-builder/node-properties.mjs +3 -3
- package/fesm2015/ajf-material-form-builder.mjs +22 -8
- package/fesm2015/ajf-material-form-builder.mjs.map +1 -1
- package/fesm2020/ajf-material-form-builder.mjs +22 -8
- package/fesm2020/ajf-material-form-builder.mjs.map +1 -1
- package/package.json +2 -2
|
@@ -50,7 +50,7 @@ import { MatToolbarModule } from '@angular/material/toolbar';
|
|
|
50
50
|
import * as i6$2 from '@angular/material/tooltip';
|
|
51
51
|
import { MatTooltipModule } from '@angular/material/tooltip';
|
|
52
52
|
import * as i1 from '@ajf/core/forms';
|
|
53
|
-
import { isChoicesFixedOrigin, isContainerNode,
|
|
53
|
+
import { isChoicesFixedOrigin, isContainerNode, AjfFieldType, AjfNodeType, createField, createContainerNode, createForm, createChoicesFixedOrigin, isSlidesNode, isFieldWithChoices, isRepeatingContainerNode, isField, createValidationGroup, notEmptyValidation, minValidation, maxValidation, minDigitsValidation, maxDigitsValidation, createValidation, createWarningGroup, notEmptyWarning, createWarning, isRangeField, isTableField, isNumberField } from '@ajf/core/forms';
|
|
54
54
|
import { DataSource } from '@angular/cdk/collections';
|
|
55
55
|
import { BehaviorSubject, of, Subject, Subscription, combineLatest } from 'rxjs';
|
|
56
56
|
import * as i6$1 from '@ngneat/transloco';
|
|
@@ -267,7 +267,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImpor
|
|
|
267
267
|
*
|
|
268
268
|
*/
|
|
269
269
|
function getNodeContainer(c, node) {
|
|
270
|
-
if (c.nodes.indexOf(node) > -1) {
|
|
270
|
+
if (c.nodes.indexOf(node) > -1 || c.nodes.map(n => n.id).indexOf(node.id) > -1) {
|
|
271
271
|
return c;
|
|
272
272
|
}
|
|
273
273
|
const cns = c.nodes.filter(n => isContainerNode(n));
|
|
@@ -280,6 +280,21 @@ function getNodeContainer(c, node) {
|
|
|
280
280
|
}
|
|
281
281
|
return null;
|
|
282
282
|
}
|
|
283
|
+
function getDefaultValue(value, node) {
|
|
284
|
+
let defaultValue = value && value.trim() != '' ? value : null;
|
|
285
|
+
if (defaultValue) {
|
|
286
|
+
switch (node.fieldType) {
|
|
287
|
+
case AjfFieldType.Boolean:
|
|
288
|
+
return defaultValue === 'true' || defaultValue === '1';
|
|
289
|
+
case AjfFieldType.MultipleChoice:
|
|
290
|
+
return [defaultValue];
|
|
291
|
+
case AjfFieldType.Number:
|
|
292
|
+
const v = +defaultValue;
|
|
293
|
+
return isNaN(v) ? 0 : v;
|
|
294
|
+
}
|
|
295
|
+
}
|
|
296
|
+
return defaultValue;
|
|
297
|
+
}
|
|
283
298
|
function buildFormBuilderNodesSubtree(nodes, parent, ignoreConditionalBranches = false) {
|
|
284
299
|
const entries = nodes
|
|
285
300
|
.filter(n => n.parent === parent.id)
|
|
@@ -815,7 +830,7 @@ class AjfFormBuilderService {
|
|
|
815
830
|
}
|
|
816
831
|
if (isField(node)) {
|
|
817
832
|
node.description = properties.description;
|
|
818
|
-
node.defaultValue = properties.defaultValue;
|
|
833
|
+
node.defaultValue = getDefaultValue(properties.defaultValue, node);
|
|
819
834
|
node.formula =
|
|
820
835
|
properties.formula != null ? createFormula({ formula: properties.formula }) : undefined;
|
|
821
836
|
const forceValue = properties.value;
|
|
@@ -880,7 +895,6 @@ class AjfFormBuilderService {
|
|
|
880
895
|
? createCondition({ condition: properties.nextSlideCondition })
|
|
881
896
|
: undefined;
|
|
882
897
|
node.size = properties.size;
|
|
883
|
-
node.defaultValue = properties.defaultValue;
|
|
884
898
|
if (isFieldWithChoices(node)) {
|
|
885
899
|
node.choicesOriginRef = properties.choicesOriginRef;
|
|
886
900
|
node.forceExpanded = properties.forceExpanded;
|
|
@@ -908,7 +922,7 @@ class AjfFormBuilderService {
|
|
|
908
922
|
// TODO: @trik check this, was always true?
|
|
909
923
|
// if (cn instanceof AjfNode) {
|
|
910
924
|
const replaceNodes = cn.nodes === nodes;
|
|
911
|
-
const idx = cn.nodes.indexOf(origNode);
|
|
925
|
+
const idx = cn.nodes.map(n => n.id).indexOf(origNode.id);
|
|
912
926
|
let newNodes = cn.nodes.slice(0, idx);
|
|
913
927
|
newNodes.push(node);
|
|
914
928
|
newNodes = newNodes.concat(cn.nodes.slice(idx + 1));
|
|
@@ -943,7 +957,7 @@ class AjfFormBuilderService {
|
|
|
943
957
|
let cn = getNodeContainer({ nodes }, node);
|
|
944
958
|
if (cn != null) {
|
|
945
959
|
const replaceNodes = cn.nodes === nodes;
|
|
946
|
-
const idx = cn.nodes.indexOf(node);
|
|
960
|
+
const idx = cn.nodes.map(n => n.id).indexOf(node.id);
|
|
947
961
|
let newNodes = cn.nodes.slice(0, idx);
|
|
948
962
|
newNodes = newNodes.concat(cn.nodes.slice(idx + 1));
|
|
949
963
|
cn.nodes = newNodes;
|
|
@@ -2395,10 +2409,10 @@ class AjfFbNodeProperties {
|
|
|
2395
2409
|
}
|
|
2396
2410
|
}
|
|
2397
2411
|
AjfFbNodeProperties.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfFbNodeProperties, deps: [{ token: i0.ChangeDetectorRef }, { token: AjfFormBuilderService }, { token: i2$1.MatDialog }, { token: i3$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
|
|
2398
|
-
AjfFbNodeProperties.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfFbNodeProperties, selector: "ajf-fb-node-properties", ngImport: i0, template: "<div\n [style.display]=\"(enabled|async) ? 'none' : 'block'\"\n class=\"ajf-disabled-overlay\"\n></div>\n<div class=\"ajf-header\">\n <h3>{{'Properties'|transloco}}</h3>\n <mat-icon (click)=\"save()\">save</mat-icon>\n <mat-icon (click)=\"cancel()\">cancel</mat-icon>\n</div>\n<ng-container *ngIf=\"nodeEntry|async as ne\">\n <ng-container *ngIf=\"propertiesForm|async as pf\">\n <form [formGroup]=\"pf!\" novalidate>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"name\"\n [placeholder]=\"'Name' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"label\"\n [placeholder]=\"'Label' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <mat-label>{{'Visibility'|transloco}}</mat-label>\n <mat-select\n formControlName=\"visibilityOpt\"\n [placeholder]=\"'Visible' | transloco\"\n >\n <mat-option value=\"always\">{{'Always'|transloco}}</mat-option>\n <mat-option value=\"never\">{{'Never'|transloco}}</mat-option>\n <mat-option value=\"condition\"\n >{{'Condition...'|transloco}}</mat-option\n >\n </mat-select>\n </mat-form-field>\n <button\n (click)=\"editVisibility()\"\n [disabled]=\"pf!.value.visibilityOpt !== 'condition'\"\n mat-raised-button\n [matTooltip]=\"curVisibility || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curVisibility }}</span>\n </div>\n </button>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Branches'|transloco}}</label></div>\n <div>\n <mat-slider\n formControlName=\"conditionalBranchesNum\"\n thumbLabel\n tickInterval=\"auto\"\n min=\"1\"\n max=\"5\"\n step=\"1\"\n ></mat-slider>\n </div>\n <div *ngFor=\"let branch of conditionalBranches; let idx = index\">\n <button\n (click)=\"editConditionalBranch(idx)\"\n mat-raised-button\n [matTooltip]=\"branch\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ branch }}</span>\n </div>\n </button>\n </div>\n </div>\n <ng-template [ngIf]=\"isRepeatingContainerNode(ne)\">\n <div class=\"ajf-prop\">\n <div><label>{{'Repetitions'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editFormulaReps()\"\n mat-raised-button\n [matTooltip]=\"curFormulaReps || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curFormulaReps }}</span>\n </div>\n </button>\n </div>\n <div><label>{{'Min repetitions'|transloco}}</label></div>\n <div>\n <mat-slider\n formControlName=\"minReps\"\n thumbLabel\n tickInterval=\"auto\"\n min=\"1\"\n max=\"5\"\n step=\"1\"\n ></mat-slider>\n </div>\n <div><label>{{'Max repetitions'|transloco}}</label></div>\n <div>\n <mat-slider\n formControlName=\"maxReps\"\n thumbLabel\n tickInterval=\"auto\"\n min=\"1\"\n max=\"5\"\n step=\"1\"\n ></mat-slider>\n </div>\n </div>\n </ng-template>\n <ng-template [ngIf]=\"isField(ne)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <mat-label>{{'Field size'|transloco}}</mat-label>\n <mat-select\n formControlName=\"size\"\n [placeholder]=\"'Size' | transloco\"\n >\n <mat-option\n *ngFor=\"let fieldSize of fieldSizes\"\n [value]=\"fieldSize.value\"\n >\n {{ fieldSize.label|transloco }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"hint\"\n [placeholder]=\"'Hint' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <textarea\n matInput\n formControlName=\"description\"\n [placeholder]=\"'Description' | transloco\"\n ></textarea>\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"defaultValue\"\n [placeholder]=\"'Default value' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Formula'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editFormula()\"\n mat-raised-button\n [matTooltip]=\"curFormula || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curFormula }}</span>\n </div>\n </button>\n </div>\n </div>\n <!-- <div class=\"ajf-prop\">\n <div><label>{{'Force value'|translco}}</label></div>\n <div>\n <button (click)=\"editForceValue()\" mat-raised-button [matTooltip]=\"curForceValue\">\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curForceValue }}</span>\n </div>\n </button>\n </div>\n </div> -->\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"notEmpty\"\n >{{'Not empty'|transloco}}</mat-checkbox\n >\n </div>\n <ng-template [ngIf]=\"isNumericField(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"minValue\"\n [placeholder]=\"'Min value' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"maxValue\"\n [placeholder]=\"'Max value' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"minDigits\"\n [placeholder]=\"'Min digits' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"maxDigits\"\n [placeholder]=\"'Max digits' | transloco\"\n />\n </mat-form-field>\n </div>\n </ng-template>\n <ng-template [ngIf]=\"isRangeField(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n type=\"number\"\n formControlName=\"start\"\n [placeholder]=\"'Start' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n type=\"number\"\n formControlName=\"end\"\n [placeholder]=\"'End' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n type=\"number\"\n formControlName=\"step\"\n [placeholder]=\"'Step' | transloco\"\n />\n </mat-form-field>\n </div>\n </ng-template>\n <div class=\"ajf-prop\">\n <div class=\"ajf-header\">\n <label>{{ 'Validation' | transloco }}</label>\n <mat-icon class=\"ajf-pointer\" (click)=\"addValidationCondition()\"\n >add_circle_outline</mat-icon\n >\n </div>\n <div\n *ngIf=\"validationConditions.length === 0\"\n class=\"ajf-validation-row ajf-emph\"\n >\n {{'No conditions'|transloco}}\n </div>\n <div\n class=\"ajf-validation-row\"\n *ngFor=\"let validationCondition of validationConditions; let idx = index\"\n >\n <button\n (click)=\"editValidationCondition(idx)\"\n mat-raised-button\n [matTooltip]=\"validationCondition.condition\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ validationCondition.condition }}</span>\n </div>\n </button>\n <mat-icon\n class=\"ajf-pointer\"\n (click)=\"removeValidationCondition(idx)\"\n >remove_circle_outline</mat-icon\n >\n </div>\n </div>\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"notEmptyWarning\"\n >{{'Not empty warning'|transloco}}</mat-checkbox\n >\n </div>\n <div class=\"ajf-prop\">\n <div class=\"ajf-header\">\n <label>{{'Warnings'|transloco}}</label>\n <mat-icon class=\"ajf-pointer\" (click)=\"addWarningCondition()\"\n >add_circle_outline</mat-icon\n >\n </div>\n <div\n *ngIf=\"warningConditions.length === 0\"\n class=\"ajf-validation-row ajf-emph\"\n >\n {{'No warnings'|transloco}}\n </div>\n <div\n class=\"ajf-validation-row\"\n *ngFor=\"let warningCondition of warningConditions; let idx = index\"\n >\n <button\n (click)=\"editWarningCondition(idx)\"\n mat-raised-button\n [matTooltip]=\"warningCondition.condition\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ warningCondition.condition }}</span>\n </div>\n </button>\n <mat-icon class=\"ajf-pointer\" (click)=\"removeWarningCondition(idx)\"\n >remove_circle_outline</mat-icon\n >\n </div>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Go to next slide condition'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editNextSlideCondition()\"\n mat-raised-button\n [matTooltip]=\"nextSlideCondition || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ nextSlideCondition }}</span>\n </div>\n </button>\n </div>\n </div>\n <ng-template [ngIf]=\"isFieldWithChoices(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <mat-label>{{'Choices origins'|transloco}}</mat-label>\n <mat-select\n formControlName=\"choicesOriginRef\"\n [placeholder]=\"'Choices' | transloco\"\n >\n <mat-option\n *ngFor=\"let choicesOrigin of choicesOrigins\"\n [value]=\"choicesOrigin.name\"\n >\n {{ (choicesOrigin.label || choicesOrigin.name)|transloco }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Choices filter'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editChoicesFilter()\"\n mat-raised-button\n [matTooltip]=\"curChoicesFilter || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curChoicesFilter }}</span>\n </div>\n </button>\n </div>\n </div>\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"forceExpanded\"\n >{{'Force expanded selection'|transloco}}</mat-checkbox\n >\n </div>\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"forceNarrow\"\n >{{'Force narrow selection'|transloco}}</mat-checkbox\n >\n </div>\n <div class=\"ajf-prop\">\n <div class=\"ajf-header\">\n <label>{{'Trigger selection'|transloco}}</label>\n <mat-icon class=\"ajf-pointer\" (click)=\"addTriggerCondition()\"\n >add_circle_outline</mat-icon\n >\n </div>\n <div\n *ngIf=\"triggerConditions.length === 0\"\n class=\"ajf-validation-row ajf-emph\"\n >\n {{'No trigger condition'|transloco}}\n </div>\n <div\n class=\"ajf-validation-row\"\n *ngFor=\"let triggerCondition of triggerConditions; let idx = index\"\n >\n <button\n (click)=\"editTriggerCondition(idx)\"\n mat-raised-button\n [matTooltip]=\"triggerCondition\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ triggerCondition }}</span>\n </div>\n </button>\n <mat-icon class=\"pointer\" (click)=\"removeTriggerCondition(idx)\"\n >remove_circle_outline</mat-icon\n >\n </div>\n </div>\n </ng-template>\n <ng-container *ngIf=\"isTableField(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"hideEmptyRows\">{{'Hide empty rows'|transloco}}</mat-checkbox>\n <mat-form-field>\n <textarea\n matInput\n type=\"number\"\n formControlName=\"tableDef\"\n [placeholder]=\"'Table definition' | transloco\"\n ></textarea>\n </mat-form-field>\n </div>\n </ng-container>\n </ng-template>\n </form>\n </ng-container>\n</ng-container>\n", styles: ["ajf-fb-node-properties{display:block;padding:1em;position:relative}ajf-fb-node-properties mat-icon{cursor:pointer}ajf-fb-node-properties .ajf-header{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap}ajf-fb-node-properties .ajf-header>h3,ajf-fb-node-properties .ajf-header>label{flex:1 0 auto;margin-right:.5em}ajf-fb-node-properties .ajf-header>mat-icon{flex:0 0 auto;margin-left:.5em}ajf-fb-node-properties .ajf-disabled-overlay{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.4;background-color:#fff}ajf-fb-node-properties .ajf-emph{font-style:italic}ajf-fb-node-properties [mat-raised-button]{margin:.5em 0}ajf-fb-node-properties [mat-raised-button].ajf-pointer{cursor:pointer}ajf-fb-node-properties [mat-raised-button] .ajf-icon-cont{display:flex;flex-direction:row;align-items:center}ajf-fb-node-properties [mat-raised-button] .ajf-icon-cont span{flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;display:block;min-height:36px}ajf-fb-node-properties .ajf-validation-row{margin:.5em 0;display:flex;flex-direction:row;align-items:center}ajf-fb-node-properties .ajf-validation-row button{flex:1 1 auto}ajf-fb-node-properties .ajf-validation-row mat-icon{flex:0 0 auto}ajf-fb-node-properties .ajf-prop{margin:.5em 0}ajf-fb-node-properties mat-form-field,ajf-fb-node-properties mat-slider,ajf-fb-node-properties [mat-raised-button]{width:100%}\n"], components: [{ type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i5.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i9.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i8$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i9$1.MatSlider, selector: "mat-slider", inputs: ["disabled", "color", "tabIndex", "invert", "max", "min", "step", "thumbLabel", "tickInterval", "value", "displayWith", "valueText", "vertical"], outputs: ["change", "input", "valueChange"], exportAs: ["matSlider"] }, { type: i10.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }], directives: [{ type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i3$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i5.MatLabel, selector: "mat-label" }, { type: i6$2.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i8.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }], pipes: { "async": i8.AsyncPipe, "transloco": i6$1.TranslocoPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2412
|
+
AjfFbNodeProperties.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfFbNodeProperties, selector: "ajf-fb-node-properties", ngImport: i0, template: "<div\n [style.display]=\"(enabled|async) ? 'none' : 'block'\"\n class=\"ajf-disabled-overlay\"\n></div>\n<div class=\"ajf-header\">\n <h3>{{'Properties'|transloco}}</h3>\n <mat-icon (click)=\"save()\">save</mat-icon>\n <mat-icon (click)=\"cancel()\">cancel</mat-icon>\n</div>\n<ng-container *ngIf=\"nodeEntry|async as ne\">\n <ng-container *ngIf=\"propertiesForm|async as pf\">\n <form [formGroup]=\"pf!\" novalidate>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"name\"\n [placeholder]=\"'Name' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"label\"\n [placeholder]=\"'Label' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <mat-label>{{'Visibility'|transloco}}</mat-label>\n <mat-select\n formControlName=\"visibilityOpt\"\n [placeholder]=\"'Visible' | transloco\"\n >\n <mat-option value=\"always\">{{'Always'|transloco}}</mat-option>\n <mat-option value=\"never\">{{'Never'|transloco}}</mat-option>\n <mat-option value=\"condition\"\n >{{'Condition...'|transloco}}</mat-option\n >\n </mat-select>\n </mat-form-field>\n <button\n (click)=\"editVisibility()\"\n [disabled]=\"pf!.value.visibilityOpt !== 'condition'\"\n mat-raised-button\n [matTooltip]=\"curVisibility || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curVisibility }}</span>\n </div>\n </button>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Branches'|transloco}}</label></div>\n <div>\n <mat-slider\n formControlName=\"conditionalBranchesNum\"\n thumbLabel\n tickInterval=\"auto\"\n min=\"1\"\n max=\"5\"\n step=\"1\"\n ></mat-slider>\n </div>\n <div *ngFor=\"let branch of conditionalBranches; let idx = index\">\n <button\n (click)=\"editConditionalBranch(idx)\"\n mat-raised-button\n [matTooltip]=\"branch\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ branch }}</span>\n </div>\n </button>\n </div>\n </div>\n <ng-template [ngIf]=\"isRepeatingContainerNode(ne)\">\n <div class=\"ajf-prop\">\n <div><label>{{'Repetitions'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editFormulaReps()\"\n mat-raised-button\n [matTooltip]=\"curFormulaReps || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curFormulaReps }}</span>\n </div>\n </button>\n </div>\n <div><label>{{'Min repetitions'|transloco}}</label></div>\n <div>\n <mat-slider\n formControlName=\"minReps\"\n thumbLabel\n tickInterval=\"auto\"\n min=\"1\"\n max=\"5\"\n step=\"1\"\n ></mat-slider>\n </div>\n <div><label>{{'Max repetitions'|transloco}}</label></div>\n <div>\n <mat-slider\n formControlName=\"maxReps\"\n thumbLabel\n tickInterval=\"auto\"\n min=\"1\"\n max=\"5\"\n step=\"1\"\n ></mat-slider>\n </div>\n </div>\n </ng-template>\n <ng-template [ngIf]=\"isField(ne)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <mat-label>{{'Field size'|transloco}}</mat-label>\n <mat-select\n formControlName=\"size\"\n [placeholder]=\"'Size' | transloco\"\n >\n <mat-option\n *ngFor=\"let fieldSize of fieldSizes\"\n [value]=\"fieldSize.value\"\n >\n {{ fieldSize.label|transloco }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"hint\"\n [placeholder]=\"'Hint' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <textarea\n matInput\n formControlName=\"description\"\n [placeholder]=\"'Description' | transloco\"\n ></textarea>\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"defaultValue\"\n [placeholder]=\"'Default value' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Formula'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editFormula()\"\n mat-raised-button\n [matTooltip]=\"curFormula || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curFormula }}</span>\n </div>\n </button>\n </div>\n </div>\n <!-- <div class=\"ajf-prop\">\n <div><label>{{'Force value'|translco}}</label></div>\n <div>\n <button (click)=\"editForceValue()\" mat-raised-button [matTooltip]=\"curForceValue\">\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curForceValue }}</span>\n </div>\n </button>\n </div>\n </div> -->\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"notEmpty\"\n >{{'Not empty'|transloco}}</mat-checkbox\n >\n </div>\n <ng-template [ngIf]=\"isNumericField(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"minValue\"\n [placeholder]=\"'Min value' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"maxValue\"\n [placeholder]=\"'Max value' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"minDigits\"\n [placeholder]=\"'Min digits' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"maxDigits\"\n [placeholder]=\"'Max digits' | transloco\"\n />\n </mat-form-field>\n </div>\n </ng-template>\n <ng-template [ngIf]=\"isRangeField(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n type=\"number\"\n formControlName=\"start\"\n [placeholder]=\"'Start' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n type=\"number\"\n formControlName=\"end\"\n [placeholder]=\"'End' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n type=\"number\"\n formControlName=\"step\"\n [placeholder]=\"'Step' | transloco\"\n />\n </mat-form-field>\n </div>\n </ng-template>\n <div class=\"ajf-prop\">\n <div class=\"ajf-header\">\n <label>{{ 'Validation' | transloco }}</label>\n <mat-icon class=\"ajf-pointer\" (click)=\"addValidationCondition()\"\n >add_circle_outline</mat-icon\n >\n </div>\n <div\n *ngIf=\"validationConditions.length === 0\"\n class=\"ajf-validation-row ajf-emph\"\n >\n {{'No conditions'|transloco}}\n </div>\n <div\n class=\"ajf-validation-row\"\n *ngFor=\"let validationCondition of validationConditions; let idx = index\"\n >\n <button\n (click)=\"editValidationCondition(idx)\"\n mat-raised-button\n [matTooltip]=\"validationCondition.condition\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ validationCondition.condition }}</span>\n </div>\n </button>\n <mat-icon\n class=\"ajf-pointer\"\n (click)=\"removeValidationCondition(idx)\"\n >remove_circle_outline</mat-icon\n >\n </div>\n </div>\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"notEmptyWarning\"\n >{{'Not empty warning'|transloco}}</mat-checkbox\n >\n </div>\n <div class=\"ajf-prop\">\n <div class=\"ajf-header\">\n <label>{{'Warnings'|transloco}}</label>\n <mat-icon class=\"ajf-pointer\" (click)=\"addWarningCondition()\"\n >add_circle_outline</mat-icon\n >\n </div>\n <div\n *ngIf=\"warningConditions.length === 0\"\n class=\"ajf-validation-row ajf-emph\"\n >\n {{'No warnings'|transloco}}\n </div>\n <div\n class=\"ajf-validation-row\"\n *ngFor=\"let warningCondition of warningConditions; let idx = index\"\n >\n <button\n (click)=\"editWarningCondition(idx)\"\n mat-raised-button\n [matTooltip]=\"warningCondition.condition\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ warningCondition.condition }}</span>\n </div>\n </button>\n <mat-icon class=\"ajf-pointer\" (click)=\"removeWarningCondition(idx)\"\n >remove_circle_outline</mat-icon\n >\n </div>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Go to next slide condition'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editNextSlideCondition()\"\n mat-raised-button\n [matTooltip]=\"nextSlideCondition || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ nextSlideCondition }}</span>\n </div>\n </button>\n </div>\n </div>\n <ng-template [ngIf]=\"isFieldWithChoices(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <mat-label>{{'Choices origins'|transloco}}</mat-label>\n <mat-select\n formControlName=\"choicesOriginRef\"\n [placeholder]=\"'Choices' | transloco\"\n >\n <mat-option\n *ngFor=\"let choicesOrigin of choicesOrigins\"\n [value]=\"choicesOrigin.name\"\n >\n {{ (choicesOrigin.label || choicesOrigin.name)|transloco }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Choices filter'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editChoicesFilter()\"\n mat-raised-button\n [matTooltip]=\"curChoicesFilter || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curChoicesFilter }}</span>\n </div>\n </button>\n </div>\n </div>\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"forceExpanded\"\n >{{'Force expanded selection'|transloco}}</mat-checkbox\n >\n </div>\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"forceNarrow\"\n >{{'Force narrow selection'|transloco}}</mat-checkbox\n >\n </div>\n <div class=\"ajf-prop\">\n <div class=\"ajf-header\">\n <label>{{'Trigger selection'|transloco}}</label>\n <mat-icon class=\"ajf-pointer\" (click)=\"addTriggerCondition()\"\n >add_circle_outline</mat-icon\n >\n </div>\n <div\n *ngIf=\"!triggerConditions || triggerConditions.length === 0\"\n class=\"ajf-validation-row ajf-emph\"\n >\n {{'No trigger condition'|transloco}}\n </div>\n <div\n class=\"ajf-validation-row\"\n *ngFor=\"let triggerCondition of triggerConditions; let idx = index\"\n >\n <button\n (click)=\"editTriggerCondition(idx)\"\n mat-raised-button\n [matTooltip]=\"triggerCondition\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ triggerCondition }}</span>\n </div>\n </button>\n <mat-icon class=\"pointer\" (click)=\"removeTriggerCondition(idx)\"\n >remove_circle_outline</mat-icon\n >\n </div>\n </div>\n </ng-template>\n <ng-container *ngIf=\"isTableField(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"hideEmptyRows\">{{'Hide empty rows'|transloco}}</mat-checkbox>\n <mat-form-field>\n <textarea\n matInput\n type=\"number\"\n formControlName=\"tableDef\"\n [placeholder]=\"'Table definition' | transloco\"\n ></textarea>\n </mat-form-field>\n </div>\n </ng-container>\n </ng-template>\n </form>\n </ng-container>\n</ng-container>\n", styles: ["ajf-fb-node-properties{display:block;padding:1em;position:relative}ajf-fb-node-properties mat-icon{cursor:pointer}ajf-fb-node-properties .ajf-header{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap}ajf-fb-node-properties .ajf-header>h3,ajf-fb-node-properties .ajf-header>label{flex:1 0 auto;margin-right:.5em}ajf-fb-node-properties .ajf-header>mat-icon{flex:0 0 auto;margin-left:.5em}ajf-fb-node-properties .ajf-disabled-overlay{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.4;background-color:#fff}ajf-fb-node-properties .ajf-emph{font-style:italic}ajf-fb-node-properties [mat-raised-button]{margin:.5em 0}ajf-fb-node-properties [mat-raised-button].ajf-pointer{cursor:pointer}ajf-fb-node-properties [mat-raised-button] .ajf-icon-cont{display:flex;flex-direction:row;align-items:center}ajf-fb-node-properties [mat-raised-button] .ajf-icon-cont span{flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;display:block;min-height:36px}ajf-fb-node-properties .ajf-validation-row{margin:.5em 0;display:flex;flex-direction:row;align-items:center}ajf-fb-node-properties .ajf-validation-row button{flex:1 1 auto}ajf-fb-node-properties .ajf-validation-row mat-icon{flex:0 0 auto}ajf-fb-node-properties .ajf-prop{margin:.5em 0}ajf-fb-node-properties mat-form-field,ajf-fb-node-properties mat-slider,ajf-fb-node-properties [mat-raised-button]{width:100%}\n"], components: [{ type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i5.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i9.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i8$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i9$1.MatSlider, selector: "mat-slider", inputs: ["disabled", "color", "tabIndex", "invert", "max", "min", "step", "thumbLabel", "tickInterval", "value", "displayWith", "valueText", "vertical"], outputs: ["change", "input", "valueChange"], exportAs: ["matSlider"] }, { type: i10.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }], directives: [{ type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i3$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i5.MatLabel, selector: "mat-label" }, { type: i6$2.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i8.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }], pipes: { "async": i8.AsyncPipe, "transloco": i6$1.TranslocoPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2399
2413
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfFbNodeProperties, decorators: [{
|
|
2400
2414
|
type: Component,
|
|
2401
|
-
args: [{ selector: 'ajf-fb-node-properties', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [style.display]=\"(enabled|async) ? 'none' : 'block'\"\n class=\"ajf-disabled-overlay\"\n></div>\n<div class=\"ajf-header\">\n <h3>{{'Properties'|transloco}}</h3>\n <mat-icon (click)=\"save()\">save</mat-icon>\n <mat-icon (click)=\"cancel()\">cancel</mat-icon>\n</div>\n<ng-container *ngIf=\"nodeEntry|async as ne\">\n <ng-container *ngIf=\"propertiesForm|async as pf\">\n <form [formGroup]=\"pf!\" novalidate>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"name\"\n [placeholder]=\"'Name' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"label\"\n [placeholder]=\"'Label' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <mat-label>{{'Visibility'|transloco}}</mat-label>\n <mat-select\n formControlName=\"visibilityOpt\"\n [placeholder]=\"'Visible' | transloco\"\n >\n <mat-option value=\"always\">{{'Always'|transloco}}</mat-option>\n <mat-option value=\"never\">{{'Never'|transloco}}</mat-option>\n <mat-option value=\"condition\"\n >{{'Condition...'|transloco}}</mat-option\n >\n </mat-select>\n </mat-form-field>\n <button\n (click)=\"editVisibility()\"\n [disabled]=\"pf!.value.visibilityOpt !== 'condition'\"\n mat-raised-button\n [matTooltip]=\"curVisibility || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curVisibility }}</span>\n </div>\n </button>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Branches'|transloco}}</label></div>\n <div>\n <mat-slider\n formControlName=\"conditionalBranchesNum\"\n thumbLabel\n tickInterval=\"auto\"\n min=\"1\"\n max=\"5\"\n step=\"1\"\n ></mat-slider>\n </div>\n <div *ngFor=\"let branch of conditionalBranches; let idx = index\">\n <button\n (click)=\"editConditionalBranch(idx)\"\n mat-raised-button\n [matTooltip]=\"branch\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ branch }}</span>\n </div>\n </button>\n </div>\n </div>\n <ng-template [ngIf]=\"isRepeatingContainerNode(ne)\">\n <div class=\"ajf-prop\">\n <div><label>{{'Repetitions'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editFormulaReps()\"\n mat-raised-button\n [matTooltip]=\"curFormulaReps || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curFormulaReps }}</span>\n </div>\n </button>\n </div>\n <div><label>{{'Min repetitions'|transloco}}</label></div>\n <div>\n <mat-slider\n formControlName=\"minReps\"\n thumbLabel\n tickInterval=\"auto\"\n min=\"1\"\n max=\"5\"\n step=\"1\"\n ></mat-slider>\n </div>\n <div><label>{{'Max repetitions'|transloco}}</label></div>\n <div>\n <mat-slider\n formControlName=\"maxReps\"\n thumbLabel\n tickInterval=\"auto\"\n min=\"1\"\n max=\"5\"\n step=\"1\"\n ></mat-slider>\n </div>\n </div>\n </ng-template>\n <ng-template [ngIf]=\"isField(ne)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <mat-label>{{'Field size'|transloco}}</mat-label>\n <mat-select\n formControlName=\"size\"\n [placeholder]=\"'Size' | transloco\"\n >\n <mat-option\n *ngFor=\"let fieldSize of fieldSizes\"\n [value]=\"fieldSize.value\"\n >\n {{ fieldSize.label|transloco }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"hint\"\n [placeholder]=\"'Hint' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <textarea\n matInput\n formControlName=\"description\"\n [placeholder]=\"'Description' | transloco\"\n ></textarea>\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"defaultValue\"\n [placeholder]=\"'Default value' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Formula'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editFormula()\"\n mat-raised-button\n [matTooltip]=\"curFormula || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curFormula }}</span>\n </div>\n </button>\n </div>\n </div>\n <!-- <div class=\"ajf-prop\">\n <div><label>{{'Force value'|translco}}</label></div>\n <div>\n <button (click)=\"editForceValue()\" mat-raised-button [matTooltip]=\"curForceValue\">\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curForceValue }}</span>\n </div>\n </button>\n </div>\n </div> -->\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"notEmpty\"\n >{{'Not empty'|transloco}}</mat-checkbox\n >\n </div>\n <ng-template [ngIf]=\"isNumericField(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"minValue\"\n [placeholder]=\"'Min value' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"maxValue\"\n [placeholder]=\"'Max value' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"minDigits\"\n [placeholder]=\"'Min digits' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"maxDigits\"\n [placeholder]=\"'Max digits' | transloco\"\n />\n </mat-form-field>\n </div>\n </ng-template>\n <ng-template [ngIf]=\"isRangeField(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n type=\"number\"\n formControlName=\"start\"\n [placeholder]=\"'Start' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n type=\"number\"\n formControlName=\"end\"\n [placeholder]=\"'End' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n type=\"number\"\n formControlName=\"step\"\n [placeholder]=\"'Step' | transloco\"\n />\n </mat-form-field>\n </div>\n </ng-template>\n <div class=\"ajf-prop\">\n <div class=\"ajf-header\">\n <label>{{ 'Validation' | transloco }}</label>\n <mat-icon class=\"ajf-pointer\" (click)=\"addValidationCondition()\"\n >add_circle_outline</mat-icon\n >\n </div>\n <div\n *ngIf=\"validationConditions.length === 0\"\n class=\"ajf-validation-row ajf-emph\"\n >\n {{'No conditions'|transloco}}\n </div>\n <div\n class=\"ajf-validation-row\"\n *ngFor=\"let validationCondition of validationConditions; let idx = index\"\n >\n <button\n (click)=\"editValidationCondition(idx)\"\n mat-raised-button\n [matTooltip]=\"validationCondition.condition\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ validationCondition.condition }}</span>\n </div>\n </button>\n <mat-icon\n class=\"ajf-pointer\"\n (click)=\"removeValidationCondition(idx)\"\n >remove_circle_outline</mat-icon\n >\n </div>\n </div>\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"notEmptyWarning\"\n >{{'Not empty warning'|transloco}}</mat-checkbox\n >\n </div>\n <div class=\"ajf-prop\">\n <div class=\"ajf-header\">\n <label>{{'Warnings'|transloco}}</label>\n <mat-icon class=\"ajf-pointer\" (click)=\"addWarningCondition()\"\n >add_circle_outline</mat-icon\n >\n </div>\n <div\n *ngIf=\"warningConditions.length === 0\"\n class=\"ajf-validation-row ajf-emph\"\n >\n {{'No warnings'|transloco}}\n </div>\n <div\n class=\"ajf-validation-row\"\n *ngFor=\"let warningCondition of warningConditions; let idx = index\"\n >\n <button\n (click)=\"editWarningCondition(idx)\"\n mat-raised-button\n [matTooltip]=\"warningCondition.condition\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ warningCondition.condition }}</span>\n </div>\n </button>\n <mat-icon class=\"ajf-pointer\" (click)=\"removeWarningCondition(idx)\"\n >remove_circle_outline</mat-icon\n >\n </div>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Go to next slide condition'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editNextSlideCondition()\"\n mat-raised-button\n [matTooltip]=\"nextSlideCondition || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ nextSlideCondition }}</span>\n </div>\n </button>\n </div>\n </div>\n <ng-template [ngIf]=\"isFieldWithChoices(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <mat-label>{{'Choices origins'|transloco}}</mat-label>\n <mat-select\n formControlName=\"choicesOriginRef\"\n [placeholder]=\"'Choices' | transloco\"\n >\n <mat-option\n *ngFor=\"let choicesOrigin of choicesOrigins\"\n [value]=\"choicesOrigin.name\"\n >\n {{ (choicesOrigin.label || choicesOrigin.name)|transloco }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Choices filter'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editChoicesFilter()\"\n mat-raised-button\n [matTooltip]=\"curChoicesFilter || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curChoicesFilter }}</span>\n </div>\n </button>\n </div>\n </div>\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"forceExpanded\"\n >{{'Force expanded selection'|transloco}}</mat-checkbox\n >\n </div>\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"forceNarrow\"\n >{{'Force narrow selection'|transloco}}</mat-checkbox\n >\n </div>\n <div class=\"ajf-prop\">\n <div class=\"ajf-header\">\n <label>{{'Trigger selection'|transloco}}</label>\n <mat-icon class=\"ajf-pointer\" (click)=\"addTriggerCondition()\"\n >add_circle_outline</mat-icon\n >\n </div>\n <div\n *ngIf=\"triggerConditions.length === 0\"\n class=\"ajf-validation-row ajf-emph\"\n >\n {{'No trigger condition'|transloco}}\n </div>\n <div\n class=\"ajf-validation-row\"\n *ngFor=\"let triggerCondition of triggerConditions; let idx = index\"\n >\n <button\n (click)=\"editTriggerCondition(idx)\"\n mat-raised-button\n [matTooltip]=\"triggerCondition\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ triggerCondition }}</span>\n </div>\n </button>\n <mat-icon class=\"pointer\" (click)=\"removeTriggerCondition(idx)\"\n >remove_circle_outline</mat-icon\n >\n </div>\n </div>\n </ng-template>\n <ng-container *ngIf=\"isTableField(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"hideEmptyRows\">{{'Hide empty rows'|transloco}}</mat-checkbox>\n <mat-form-field>\n <textarea\n matInput\n type=\"number\"\n formControlName=\"tableDef\"\n [placeholder]=\"'Table definition' | transloco\"\n ></textarea>\n </mat-form-field>\n </div>\n </ng-container>\n </ng-template>\n </form>\n </ng-container>\n</ng-container>\n", styles: ["ajf-fb-node-properties{display:block;padding:1em;position:relative}ajf-fb-node-properties mat-icon{cursor:pointer}ajf-fb-node-properties .ajf-header{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap}ajf-fb-node-properties .ajf-header>h3,ajf-fb-node-properties .ajf-header>label{flex:1 0 auto;margin-right:.5em}ajf-fb-node-properties .ajf-header>mat-icon{flex:0 0 auto;margin-left:.5em}ajf-fb-node-properties .ajf-disabled-overlay{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.4;background-color:#fff}ajf-fb-node-properties .ajf-emph{font-style:italic}ajf-fb-node-properties [mat-raised-button]{margin:.5em 0}ajf-fb-node-properties [mat-raised-button].ajf-pointer{cursor:pointer}ajf-fb-node-properties [mat-raised-button] .ajf-icon-cont{display:flex;flex-direction:row;align-items:center}ajf-fb-node-properties [mat-raised-button] .ajf-icon-cont span{flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;display:block;min-height:36px}ajf-fb-node-properties .ajf-validation-row{margin:.5em 0;display:flex;flex-direction:row;align-items:center}ajf-fb-node-properties .ajf-validation-row button{flex:1 1 auto}ajf-fb-node-properties .ajf-validation-row mat-icon{flex:0 0 auto}ajf-fb-node-properties .ajf-prop{margin:.5em 0}ajf-fb-node-properties mat-form-field,ajf-fb-node-properties mat-slider,ajf-fb-node-properties [mat-raised-button]{width:100%}\n"] }]
|
|
2415
|
+
args: [{ selector: 'ajf-fb-node-properties', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [style.display]=\"(enabled|async) ? 'none' : 'block'\"\n class=\"ajf-disabled-overlay\"\n></div>\n<div class=\"ajf-header\">\n <h3>{{'Properties'|transloco}}</h3>\n <mat-icon (click)=\"save()\">save</mat-icon>\n <mat-icon (click)=\"cancel()\">cancel</mat-icon>\n</div>\n<ng-container *ngIf=\"nodeEntry|async as ne\">\n <ng-container *ngIf=\"propertiesForm|async as pf\">\n <form [formGroup]=\"pf!\" novalidate>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"name\"\n [placeholder]=\"'Name' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"label\"\n [placeholder]=\"'Label' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <mat-label>{{'Visibility'|transloco}}</mat-label>\n <mat-select\n formControlName=\"visibilityOpt\"\n [placeholder]=\"'Visible' | transloco\"\n >\n <mat-option value=\"always\">{{'Always'|transloco}}</mat-option>\n <mat-option value=\"never\">{{'Never'|transloco}}</mat-option>\n <mat-option value=\"condition\"\n >{{'Condition...'|transloco}}</mat-option\n >\n </mat-select>\n </mat-form-field>\n <button\n (click)=\"editVisibility()\"\n [disabled]=\"pf!.value.visibilityOpt !== 'condition'\"\n mat-raised-button\n [matTooltip]=\"curVisibility || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curVisibility }}</span>\n </div>\n </button>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Branches'|transloco}}</label></div>\n <div>\n <mat-slider\n formControlName=\"conditionalBranchesNum\"\n thumbLabel\n tickInterval=\"auto\"\n min=\"1\"\n max=\"5\"\n step=\"1\"\n ></mat-slider>\n </div>\n <div *ngFor=\"let branch of conditionalBranches; let idx = index\">\n <button\n (click)=\"editConditionalBranch(idx)\"\n mat-raised-button\n [matTooltip]=\"branch\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ branch }}</span>\n </div>\n </button>\n </div>\n </div>\n <ng-template [ngIf]=\"isRepeatingContainerNode(ne)\">\n <div class=\"ajf-prop\">\n <div><label>{{'Repetitions'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editFormulaReps()\"\n mat-raised-button\n [matTooltip]=\"curFormulaReps || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curFormulaReps }}</span>\n </div>\n </button>\n </div>\n <div><label>{{'Min repetitions'|transloco}}</label></div>\n <div>\n <mat-slider\n formControlName=\"minReps\"\n thumbLabel\n tickInterval=\"auto\"\n min=\"1\"\n max=\"5\"\n step=\"1\"\n ></mat-slider>\n </div>\n <div><label>{{'Max repetitions'|transloco}}</label></div>\n <div>\n <mat-slider\n formControlName=\"maxReps\"\n thumbLabel\n tickInterval=\"auto\"\n min=\"1\"\n max=\"5\"\n step=\"1\"\n ></mat-slider>\n </div>\n </div>\n </ng-template>\n <ng-template [ngIf]=\"isField(ne)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <mat-label>{{'Field size'|transloco}}</mat-label>\n <mat-select\n formControlName=\"size\"\n [placeholder]=\"'Size' | transloco\"\n >\n <mat-option\n *ngFor=\"let fieldSize of fieldSizes\"\n [value]=\"fieldSize.value\"\n >\n {{ fieldSize.label|transloco }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"hint\"\n [placeholder]=\"'Hint' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <textarea\n matInput\n formControlName=\"description\"\n [placeholder]=\"'Description' | transloco\"\n ></textarea>\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"defaultValue\"\n [placeholder]=\"'Default value' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Formula'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editFormula()\"\n mat-raised-button\n [matTooltip]=\"curFormula || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curFormula }}</span>\n </div>\n </button>\n </div>\n </div>\n <!-- <div class=\"ajf-prop\">\n <div><label>{{'Force value'|translco}}</label></div>\n <div>\n <button (click)=\"editForceValue()\" mat-raised-button [matTooltip]=\"curForceValue\">\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curForceValue }}</span>\n </div>\n </button>\n </div>\n </div> -->\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"notEmpty\"\n >{{'Not empty'|transloco}}</mat-checkbox\n >\n </div>\n <ng-template [ngIf]=\"isNumericField(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"minValue\"\n [placeholder]=\"'Min value' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"maxValue\"\n [placeholder]=\"'Max value' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"minDigits\"\n [placeholder]=\"'Min digits' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n formControlName=\"maxDigits\"\n [placeholder]=\"'Max digits' | transloco\"\n />\n </mat-form-field>\n </div>\n </ng-template>\n <ng-template [ngIf]=\"isRangeField(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n type=\"number\"\n formControlName=\"start\"\n [placeholder]=\"'Start' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n type=\"number\"\n formControlName=\"end\"\n [placeholder]=\"'End' | transloco\"\n />\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <mat-form-field>\n <input\n matInput\n type=\"number\"\n formControlName=\"step\"\n [placeholder]=\"'Step' | transloco\"\n />\n </mat-form-field>\n </div>\n </ng-template>\n <div class=\"ajf-prop\">\n <div class=\"ajf-header\">\n <label>{{ 'Validation' | transloco }}</label>\n <mat-icon class=\"ajf-pointer\" (click)=\"addValidationCondition()\"\n >add_circle_outline</mat-icon\n >\n </div>\n <div\n *ngIf=\"validationConditions.length === 0\"\n class=\"ajf-validation-row ajf-emph\"\n >\n {{'No conditions'|transloco}}\n </div>\n <div\n class=\"ajf-validation-row\"\n *ngFor=\"let validationCondition of validationConditions; let idx = index\"\n >\n <button\n (click)=\"editValidationCondition(idx)\"\n mat-raised-button\n [matTooltip]=\"validationCondition.condition\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ validationCondition.condition }}</span>\n </div>\n </button>\n <mat-icon\n class=\"ajf-pointer\"\n (click)=\"removeValidationCondition(idx)\"\n >remove_circle_outline</mat-icon\n >\n </div>\n </div>\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"notEmptyWarning\"\n >{{'Not empty warning'|transloco}}</mat-checkbox\n >\n </div>\n <div class=\"ajf-prop\">\n <div class=\"ajf-header\">\n <label>{{'Warnings'|transloco}}</label>\n <mat-icon class=\"ajf-pointer\" (click)=\"addWarningCondition()\"\n >add_circle_outline</mat-icon\n >\n </div>\n <div\n *ngIf=\"warningConditions.length === 0\"\n class=\"ajf-validation-row ajf-emph\"\n >\n {{'No warnings'|transloco}}\n </div>\n <div\n class=\"ajf-validation-row\"\n *ngFor=\"let warningCondition of warningConditions; let idx = index\"\n >\n <button\n (click)=\"editWarningCondition(idx)\"\n mat-raised-button\n [matTooltip]=\"warningCondition.condition\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ warningCondition.condition }}</span>\n </div>\n </button>\n <mat-icon class=\"ajf-pointer\" (click)=\"removeWarningCondition(idx)\"\n >remove_circle_outline</mat-icon\n >\n </div>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Go to next slide condition'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editNextSlideCondition()\"\n mat-raised-button\n [matTooltip]=\"nextSlideCondition || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ nextSlideCondition }}</span>\n </div>\n </button>\n </div>\n </div>\n <ng-template [ngIf]=\"isFieldWithChoices(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-form-field>\n <mat-label>{{'Choices origins'|transloco}}</mat-label>\n <mat-select\n formControlName=\"choicesOriginRef\"\n [placeholder]=\"'Choices' | transloco\"\n >\n <mat-option\n *ngFor=\"let choicesOrigin of choicesOrigins\"\n [value]=\"choicesOrigin.name\"\n >\n {{ (choicesOrigin.label || choicesOrigin.name)|transloco }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n </div>\n <div class=\"ajf-prop\">\n <div><label>{{'Choices filter'|transloco}}</label></div>\n <div>\n <button\n (click)=\"editChoicesFilter()\"\n mat-raised-button\n [matTooltip]=\"curChoicesFilter || ''\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ curChoicesFilter }}</span>\n </div>\n </button>\n </div>\n </div>\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"forceExpanded\"\n >{{'Force expanded selection'|transloco}}</mat-checkbox\n >\n </div>\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"forceNarrow\"\n >{{'Force narrow selection'|transloco}}</mat-checkbox\n >\n </div>\n <div class=\"ajf-prop\">\n <div class=\"ajf-header\">\n <label>{{'Trigger selection'|transloco}}</label>\n <mat-icon class=\"ajf-pointer\" (click)=\"addTriggerCondition()\"\n >add_circle_outline</mat-icon\n >\n </div>\n <div\n *ngIf=\"!triggerConditions || triggerConditions.length === 0\"\n class=\"ajf-validation-row ajf-emph\"\n >\n {{'No trigger condition'|transloco}}\n </div>\n <div\n class=\"ajf-validation-row\"\n *ngFor=\"let triggerCondition of triggerConditions; let idx = index\"\n >\n <button\n (click)=\"editTriggerCondition(idx)\"\n mat-raised-button\n [matTooltip]=\"triggerCondition\"\n >\n <div class=\"ajf-icon-cont\">\n <mat-icon>edit</mat-icon>\n <span>{{ triggerCondition }}</span>\n </div>\n </button>\n <mat-icon class=\"pointer\" (click)=\"removeTriggerCondition(idx)\"\n >remove_circle_outline</mat-icon\n >\n </div>\n </div>\n </ng-template>\n <ng-container *ngIf=\"isTableField(ne!.node)\">\n <div class=\"ajf-prop\">\n <mat-checkbox formControlName=\"hideEmptyRows\">{{'Hide empty rows'|transloco}}</mat-checkbox>\n <mat-form-field>\n <textarea\n matInput\n type=\"number\"\n formControlName=\"tableDef\"\n [placeholder]=\"'Table definition' | transloco\"\n ></textarea>\n </mat-form-field>\n </div>\n </ng-container>\n </ng-template>\n </form>\n </ng-container>\n</ng-container>\n", styles: ["ajf-fb-node-properties{display:block;padding:1em;position:relative}ajf-fb-node-properties mat-icon{cursor:pointer}ajf-fb-node-properties .ajf-header{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap}ajf-fb-node-properties .ajf-header>h3,ajf-fb-node-properties .ajf-header>label{flex:1 0 auto;margin-right:.5em}ajf-fb-node-properties .ajf-header>mat-icon{flex:0 0 auto;margin-left:.5em}ajf-fb-node-properties .ajf-disabled-overlay{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.4;background-color:#fff}ajf-fb-node-properties .ajf-emph{font-style:italic}ajf-fb-node-properties [mat-raised-button]{margin:.5em 0}ajf-fb-node-properties [mat-raised-button].ajf-pointer{cursor:pointer}ajf-fb-node-properties [mat-raised-button] .ajf-icon-cont{display:flex;flex-direction:row;align-items:center}ajf-fb-node-properties [mat-raised-button] .ajf-icon-cont span{flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;display:block;min-height:36px}ajf-fb-node-properties .ajf-validation-row{margin:.5em 0;display:flex;flex-direction:row;align-items:center}ajf-fb-node-properties .ajf-validation-row button{flex:1 1 auto}ajf-fb-node-properties .ajf-validation-row mat-icon{flex:0 0 auto}ajf-fb-node-properties .ajf-prop{margin:.5em 0}ajf-fb-node-properties mat-form-field,ajf-fb-node-properties mat-slider,ajf-fb-node-properties [mat-raised-button]{width:100%}\n"] }]
|
|
2402
2416
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: AjfFormBuilderService }, { type: i2$1.MatDialog }, { type: i3$1.FormBuilder }]; } });
|
|
2403
2417
|
|
|
2404
2418
|
/**
|