@ajf/material 15.3.5 → 15.3.6

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.
@@ -170,10 +170,10 @@ export class AjfFormBuilder {
170
170
  }
171
171
  }
172
172
  AjfFormBuilder.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFormBuilder, deps: [{ token: i1.AjfFormBuilderService }, { token: i2.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
173
- AjfFormBuilder.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfFormBuilder, selector: "ajf-form-builder", inputs: { form: "form" }, viewQueries: [{ propertyName: "designerCont", first: true, predicate: ["designer"], descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar class=\"ajf-formbuilder-toolbar\">\n <button mat-icon-button (click)=\"leftSidenav.toggle()\">\n <mat-icon>add_box</mat-icon>\n </button>\n <button mat-button [matMenuTriggerFor]=\"choicesMenu\">{{'Choices'|transloco}}</button>\n <button mat-button (click)=\"editStringIdentifier()\">{{'Identifier'|transloco}}</button>\n <button mat-icon-button aria-label=\"Collapsed\" matTooltip=\"Keep slides collapsed\">\n <mat-icon>unfold_less</mat-icon>\n </button>\n <mat-slide-toggle color=\"primary\" (change)=\"expandToggle($event)\"></mat-slide-toggle>\n <button mat-icon-button aria-label=\"Expanded\" matTooltip=\"Keep slides expanded\">\n <mat-icon>unfold_more</mat-icon>\n </button>\n <mat-menu #choicesMenu>\n <button (click)=\"createChoicesOrigin()\" mat-menu-item>{{'New..'|transloco}}</button>\n <ng-container *ngIf=\"choicesOrigins|async as cos\">\n <button\n *ngFor=\"let choicesOrigin of cos\"\n (click)=\"editChoicesOrigin(choicesOrigin)\"\n mat-menu-item\n >\n {{ (choicesOrigin.label || choicesOrigin.name)| transloco }}\n </button>\n </ng-container>\n </mat-menu>\n <span class=\"ajf-spacer\"></span>\n</mat-toolbar>\n<div class=\"ajf-formtree-container\">\n <mat-drawer-container cdkDropListGroup class=\"ajf-formtree-drawer-container\">\n <mat-drawer #leftSidenav position=\"start\" mode=\"over\">\n <div\n #sourceDropList\n cdkDropList\n [cdkDropListConnectedTo]=\"(connectedDropLists|async)!\"\n [cdkDropListEnterPredicate]=\"disableDrop\"\n [cdkDropListData]=\"nodeTypes\"\n >\n <ajf-fb-node-type-entry\n *ngFor=\"let nodeType of nodeTypes\"\n cdkDrag\n [cdkDragData]=\"nodeType\"\n (cdkDragStarted)=\"leftSidenav.close()\"\n [nodeType]=\"nodeType\"\n ></ajf-fb-node-type-entry>\n </div>\n </mat-drawer>\n <div #designer class=\"ajf-designer\">\n <ajf-fb-node-entry\n id=\"slides-list\"\n cdkDropList\n (cdkDropListDropped)=\"onDrop($event)\"\n [cdkDropListEnterPredicate]=\"disableFieldDrop\"\n *ngFor=\"let nodeEntry of (nodeEntriesTree|async); let isFirst = first\"\n [isFirst]=\"isFirst\"\n [nodeEntry]=\"nodeEntry\"\n ></ajf-fb-node-entry>\n </div>\n </mat-drawer-container>\n <div class=\"ajf-formtree-properties\" #rightSidenav position=\"end\" mode=\"side\">\n <ajf-fb-node-properties></ajf-fb-node-properties>\n </div>\n</div>\n", styles: ["ajf-form-builder{display:flex;position:relative;min-height:300px;flex-direction:column;align-items:stretch;overflow-y:auto}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar{position:sticky;top:0;z-index:2;padding:2px 0}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-button]{flex:1 0 auto}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-icon-button]{flex:0 0 auto}ajf-form-builder .ajf-formtree-container{display:flex;flex-flow:row;align-items:start;justify-content:space-between}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container{flex:1 0 auto;min-height:50vh}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container mat-drawer{max-width:20%}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .ajf-designer{padding:2}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .mat-expansion-panel-body{padding:10px}ajf-form-builder .ajf-formtree-container .ajf-formtree-properties{flex:0 1 auto;max-width:20%}ajf-form-builder mat-toolbar .ajf-spacer{flex:1 1 auto}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i4.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "directive", type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i7.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i7.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i8.MatDrawer, selector: "mat-drawer", inputs: ["position", "mode", "disableClose", "autoFocus", "opened"], outputs: ["openedChange", "opened", "openedStart", "closed", "closedStart", "positionChanged"], exportAs: ["matDrawer"] }, { kind: "component", type: i8.MatDrawerContainer, selector: "mat-drawer-container", inputs: ["autosize", "hasBackdrop"], outputs: ["backdropClick"], exportAs: ["matDrawerContainer"] }, { kind: "component", type: i9.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i10.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i11.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "component", type: i12.AjfFbNodeEntry, selector: "ajf-fb-node-entry", inputs: ["isFirst", "nodeEntry", "level", "isDraggable", "originOffset", "firstBranchColor"] }, { kind: "component", type: i13.AjfFbNodeProperties, selector: "ajf-fb-node-properties" }, { kind: "component", type: i14.AjfFbNodeTypeEntry, selector: "ajf-fb-node-type-entry", inputs: ["nodeType"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i15.TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
173
+ AjfFormBuilder.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfFormBuilder, selector: "ajf-form-builder", inputs: { form: "form" }, viewQueries: [{ propertyName: "designerCont", first: true, predicate: ["designer"], descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar class=\"ajf-formbuilder-toolbar\">\n <button mat-icon-button (click)=\"leftSidenav.toggle()\">\n <mat-icon>add_box</mat-icon>\n </button>\n <button mat-button [matMenuTriggerFor]=\"choicesMenu\">{{'Choices'|transloco}}</button>\n <button mat-button (click)=\"editStringIdentifier()\">{{'Identifier'|transloco}}</button>\n <button mat-icon-button aria-label=\"Collapsed\" matTooltip=\"Keep slides collapsed\">\n <mat-icon>unfold_less</mat-icon>\n </button>\n <mat-slide-toggle color=\"primary\" (change)=\"expandToggle($event)\"></mat-slide-toggle>\n <button mat-icon-button aria-label=\"Expanded\" matTooltip=\"Keep slides expanded\">\n <mat-icon>unfold_more</mat-icon>\n </button>\n <mat-menu #choicesMenu>\n <button (click)=\"createChoicesOrigin()\" mat-menu-item>{{'New..'|transloco}}</button>\n <ng-container *ngIf=\"choicesOrigins|async as cos\">\n <button\n *ngFor=\"let choicesOrigin of cos\"\n (click)=\"editChoicesOrigin(choicesOrigin)\"\n mat-menu-item\n >\n {{ (choicesOrigin.label || choicesOrigin.name)| transloco }}\n </button>\n </ng-container>\n </mat-menu>\n <span class=\"ajf-spacer\"></span>\n</mat-toolbar>\n<div class=\"ajf-formtree-container\">\n <mat-drawer-container cdkDropListGroup class=\"ajf-formtree-drawer-container\">\n <mat-drawer #leftSidenav position=\"start\" mode=\"over\">\n <div\n #sourceDropList\n cdkDropList\n [cdkDropListConnectedTo]=\"(connectedDropLists|async)!\"\n [cdkDropListEnterPredicate]=\"disableDrop\"\n [cdkDropListData]=\"nodeTypes\"\n >\n <ajf-fb-node-type-entry\n *ngFor=\"let nodeType of nodeTypes\"\n cdkDrag\n [cdkDragData]=\"nodeType\"\n (cdkDragStarted)=\"leftSidenav.close()\"\n [nodeType]=\"nodeType\"\n ></ajf-fb-node-type-entry>\n </div>\n </mat-drawer>\n <div #designer class=\"ajf-designer\">\n <ajf-fb-node-entry\n id=\"slides-list\"\n cdkDropList\n (cdkDropListDropped)=\"onDrop($event)\"\n [cdkDropListEnterPredicate]=\"disableFieldDrop\"\n *ngFor=\"let nodeEntry of (nodeEntriesTree|async); let isFirst = first\"\n [isFirst]=\"isFirst\"\n [nodeEntry]=\"nodeEntry\"\n ></ajf-fb-node-entry>\n </div>\n </mat-drawer-container>\n <div class=\"ajf-formtree-properties\" #rightSidenav position=\"end\" mode=\"side\">\n <ajf-fb-node-properties></ajf-fb-node-properties>\n </div>\n</div>\n", styles: ["ajf-form-builder{display:flex;position:relative;min-height:300px;flex-direction:column;align-items:stretch}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar{position:sticky;top:0;z-index:2;padding:2px 0}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-button]{flex:1 0 auto}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-icon-button]{flex:0 0 auto}ajf-form-builder .ajf-formtree-container{display:flex;flex-flow:row;align-items:start;justify-content:space-between}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container{flex:1 0 auto;min-height:50vh}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container mat-drawer{max-width:20%}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .ajf-designer{padding:2}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .mat-expansion-panel-body{padding:10px}ajf-form-builder .ajf-formtree-container .ajf-formtree-properties{flex:0 1 auto;max-width:20%}ajf-form-builder mat-toolbar .ajf-spacer{flex:1 1 auto}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i4.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "directive", type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i7.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i7.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i8.MatDrawer, selector: "mat-drawer", inputs: ["position", "mode", "disableClose", "autoFocus", "opened"], outputs: ["openedChange", "opened", "openedStart", "closed", "closedStart", "positionChanged"], exportAs: ["matDrawer"] }, { kind: "component", type: i8.MatDrawerContainer, selector: "mat-drawer-container", inputs: ["autosize", "hasBackdrop"], outputs: ["backdropClick"], exportAs: ["matDrawerContainer"] }, { kind: "component", type: i9.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i10.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i11.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "component", type: i12.AjfFbNodeEntry, selector: "ajf-fb-node-entry", inputs: ["isFirst", "nodeEntry", "level", "isDraggable", "originOffset", "firstBranchColor"] }, { kind: "component", type: i13.AjfFbNodeProperties, selector: "ajf-fb-node-properties" }, { kind: "component", type: i14.AjfFbNodeTypeEntry, selector: "ajf-fb-node-type-entry", inputs: ["nodeType"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i15.TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
174
174
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFormBuilder, decorators: [{
175
175
  type: Component,
176
- args: [{ selector: 'ajf-form-builder', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<mat-toolbar class=\"ajf-formbuilder-toolbar\">\n <button mat-icon-button (click)=\"leftSidenav.toggle()\">\n <mat-icon>add_box</mat-icon>\n </button>\n <button mat-button [matMenuTriggerFor]=\"choicesMenu\">{{'Choices'|transloco}}</button>\n <button mat-button (click)=\"editStringIdentifier()\">{{'Identifier'|transloco}}</button>\n <button mat-icon-button aria-label=\"Collapsed\" matTooltip=\"Keep slides collapsed\">\n <mat-icon>unfold_less</mat-icon>\n </button>\n <mat-slide-toggle color=\"primary\" (change)=\"expandToggle($event)\"></mat-slide-toggle>\n <button mat-icon-button aria-label=\"Expanded\" matTooltip=\"Keep slides expanded\">\n <mat-icon>unfold_more</mat-icon>\n </button>\n <mat-menu #choicesMenu>\n <button (click)=\"createChoicesOrigin()\" mat-menu-item>{{'New..'|transloco}}</button>\n <ng-container *ngIf=\"choicesOrigins|async as cos\">\n <button\n *ngFor=\"let choicesOrigin of cos\"\n (click)=\"editChoicesOrigin(choicesOrigin)\"\n mat-menu-item\n >\n {{ (choicesOrigin.label || choicesOrigin.name)| transloco }}\n </button>\n </ng-container>\n </mat-menu>\n <span class=\"ajf-spacer\"></span>\n</mat-toolbar>\n<div class=\"ajf-formtree-container\">\n <mat-drawer-container cdkDropListGroup class=\"ajf-formtree-drawer-container\">\n <mat-drawer #leftSidenav position=\"start\" mode=\"over\">\n <div\n #sourceDropList\n cdkDropList\n [cdkDropListConnectedTo]=\"(connectedDropLists|async)!\"\n [cdkDropListEnterPredicate]=\"disableDrop\"\n [cdkDropListData]=\"nodeTypes\"\n >\n <ajf-fb-node-type-entry\n *ngFor=\"let nodeType of nodeTypes\"\n cdkDrag\n [cdkDragData]=\"nodeType\"\n (cdkDragStarted)=\"leftSidenav.close()\"\n [nodeType]=\"nodeType\"\n ></ajf-fb-node-type-entry>\n </div>\n </mat-drawer>\n <div #designer class=\"ajf-designer\">\n <ajf-fb-node-entry\n id=\"slides-list\"\n cdkDropList\n (cdkDropListDropped)=\"onDrop($event)\"\n [cdkDropListEnterPredicate]=\"disableFieldDrop\"\n *ngFor=\"let nodeEntry of (nodeEntriesTree|async); let isFirst = first\"\n [isFirst]=\"isFirst\"\n [nodeEntry]=\"nodeEntry\"\n ></ajf-fb-node-entry>\n </div>\n </mat-drawer-container>\n <div class=\"ajf-formtree-properties\" #rightSidenav position=\"end\" mode=\"side\">\n <ajf-fb-node-properties></ajf-fb-node-properties>\n </div>\n</div>\n", styles: ["ajf-form-builder{display:flex;position:relative;min-height:300px;flex-direction:column;align-items:stretch;overflow-y:auto}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar{position:sticky;top:0;z-index:2;padding:2px 0}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-button]{flex:1 0 auto}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-icon-button]{flex:0 0 auto}ajf-form-builder .ajf-formtree-container{display:flex;flex-flow:row;align-items:start;justify-content:space-between}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container{flex:1 0 auto;min-height:50vh}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container mat-drawer{max-width:20%}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .ajf-designer{padding:2}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .mat-expansion-panel-body{padding:10px}ajf-form-builder .ajf-formtree-container .ajf-formtree-properties{flex:0 1 auto;max-width:20%}ajf-form-builder mat-toolbar .ajf-spacer{flex:1 1 auto}\n"] }]
176
+ args: [{ selector: 'ajf-form-builder', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<mat-toolbar class=\"ajf-formbuilder-toolbar\">\n <button mat-icon-button (click)=\"leftSidenav.toggle()\">\n <mat-icon>add_box</mat-icon>\n </button>\n <button mat-button [matMenuTriggerFor]=\"choicesMenu\">{{'Choices'|transloco}}</button>\n <button mat-button (click)=\"editStringIdentifier()\">{{'Identifier'|transloco}}</button>\n <button mat-icon-button aria-label=\"Collapsed\" matTooltip=\"Keep slides collapsed\">\n <mat-icon>unfold_less</mat-icon>\n </button>\n <mat-slide-toggle color=\"primary\" (change)=\"expandToggle($event)\"></mat-slide-toggle>\n <button mat-icon-button aria-label=\"Expanded\" matTooltip=\"Keep slides expanded\">\n <mat-icon>unfold_more</mat-icon>\n </button>\n <mat-menu #choicesMenu>\n <button (click)=\"createChoicesOrigin()\" mat-menu-item>{{'New..'|transloco}}</button>\n <ng-container *ngIf=\"choicesOrigins|async as cos\">\n <button\n *ngFor=\"let choicesOrigin of cos\"\n (click)=\"editChoicesOrigin(choicesOrigin)\"\n mat-menu-item\n >\n {{ (choicesOrigin.label || choicesOrigin.name)| transloco }}\n </button>\n </ng-container>\n </mat-menu>\n <span class=\"ajf-spacer\"></span>\n</mat-toolbar>\n<div class=\"ajf-formtree-container\">\n <mat-drawer-container cdkDropListGroup class=\"ajf-formtree-drawer-container\">\n <mat-drawer #leftSidenav position=\"start\" mode=\"over\">\n <div\n #sourceDropList\n cdkDropList\n [cdkDropListConnectedTo]=\"(connectedDropLists|async)!\"\n [cdkDropListEnterPredicate]=\"disableDrop\"\n [cdkDropListData]=\"nodeTypes\"\n >\n <ajf-fb-node-type-entry\n *ngFor=\"let nodeType of nodeTypes\"\n cdkDrag\n [cdkDragData]=\"nodeType\"\n (cdkDragStarted)=\"leftSidenav.close()\"\n [nodeType]=\"nodeType\"\n ></ajf-fb-node-type-entry>\n </div>\n </mat-drawer>\n <div #designer class=\"ajf-designer\">\n <ajf-fb-node-entry\n id=\"slides-list\"\n cdkDropList\n (cdkDropListDropped)=\"onDrop($event)\"\n [cdkDropListEnterPredicate]=\"disableFieldDrop\"\n *ngFor=\"let nodeEntry of (nodeEntriesTree|async); let isFirst = first\"\n [isFirst]=\"isFirst\"\n [nodeEntry]=\"nodeEntry\"\n ></ajf-fb-node-entry>\n </div>\n </mat-drawer-container>\n <div class=\"ajf-formtree-properties\" #rightSidenav position=\"end\" mode=\"side\">\n <ajf-fb-node-properties></ajf-fb-node-properties>\n </div>\n</div>\n", styles: ["ajf-form-builder{display:flex;position:relative;min-height:300px;flex-direction:column;align-items:stretch}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar{position:sticky;top:0;z-index:2;padding:2px 0}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-button]{flex:1 0 auto}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-icon-button]{flex:0 0 auto}ajf-form-builder .ajf-formtree-container{display:flex;flex-flow:row;align-items:start;justify-content:space-between}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container{flex:1 0 auto;min-height:50vh}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container mat-drawer{max-width:20%}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .ajf-designer{padding:2}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .mat-expansion-panel-body{padding:10px}ajf-form-builder .ajf-formtree-container .ajf-formtree-properties{flex:0 1 auto;max-width:20%}ajf-form-builder mat-toolbar .ajf-spacer{flex:1 1 auto}\n"] }]
177
177
  }], ctorParameters: function () { return [{ type: i1.AjfFormBuilderService }, { type: i2.MatDialog }]; }, propDecorators: { designerCont: [{
178
178
  type: ViewChild,
179
179
  args: ['designer', { static: true }]
@@ -2945,10 +2945,10 @@ class AjfFormBuilder {
2945
2945
  }
2946
2946
  }
2947
2947
  AjfFormBuilder.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFormBuilder, deps: [{ token: AjfFormBuilderService }, { token: i2.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
2948
- AjfFormBuilder.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfFormBuilder, selector: "ajf-form-builder", inputs: { form: "form" }, viewQueries: [{ propertyName: "designerCont", first: true, predicate: ["designer"], descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar class=\"ajf-formbuilder-toolbar\">\n <button mat-icon-button (click)=\"leftSidenav.toggle()\">\n <mat-icon>add_box</mat-icon>\n </button>\n <button mat-button [matMenuTriggerFor]=\"choicesMenu\">{{'Choices'|transloco}}</button>\n <button mat-button (click)=\"editStringIdentifier()\">{{'Identifier'|transloco}}</button>\n <button mat-icon-button aria-label=\"Collapsed\" matTooltip=\"Keep slides collapsed\">\n <mat-icon>unfold_less</mat-icon>\n </button>\n <mat-slide-toggle color=\"primary\" (change)=\"expandToggle($event)\"></mat-slide-toggle>\n <button mat-icon-button aria-label=\"Expanded\" matTooltip=\"Keep slides expanded\">\n <mat-icon>unfold_more</mat-icon>\n </button>\n <mat-menu #choicesMenu>\n <button (click)=\"createChoicesOrigin()\" mat-menu-item>{{'New..'|transloco}}</button>\n <ng-container *ngIf=\"choicesOrigins|async as cos\">\n <button\n *ngFor=\"let choicesOrigin of cos\"\n (click)=\"editChoicesOrigin(choicesOrigin)\"\n mat-menu-item\n >\n {{ (choicesOrigin.label || choicesOrigin.name)| transloco }}\n </button>\n </ng-container>\n </mat-menu>\n <span class=\"ajf-spacer\"></span>\n</mat-toolbar>\n<div class=\"ajf-formtree-container\">\n <mat-drawer-container cdkDropListGroup class=\"ajf-formtree-drawer-container\">\n <mat-drawer #leftSidenav position=\"start\" mode=\"over\">\n <div\n #sourceDropList\n cdkDropList\n [cdkDropListConnectedTo]=\"(connectedDropLists|async)!\"\n [cdkDropListEnterPredicate]=\"disableDrop\"\n [cdkDropListData]=\"nodeTypes\"\n >\n <ajf-fb-node-type-entry\n *ngFor=\"let nodeType of nodeTypes\"\n cdkDrag\n [cdkDragData]=\"nodeType\"\n (cdkDragStarted)=\"leftSidenav.close()\"\n [nodeType]=\"nodeType\"\n ></ajf-fb-node-type-entry>\n </div>\n </mat-drawer>\n <div #designer class=\"ajf-designer\">\n <ajf-fb-node-entry\n id=\"slides-list\"\n cdkDropList\n (cdkDropListDropped)=\"onDrop($event)\"\n [cdkDropListEnterPredicate]=\"disableFieldDrop\"\n *ngFor=\"let nodeEntry of (nodeEntriesTree|async); let isFirst = first\"\n [isFirst]=\"isFirst\"\n [nodeEntry]=\"nodeEntry\"\n ></ajf-fb-node-entry>\n </div>\n </mat-drawer-container>\n <div class=\"ajf-formtree-properties\" #rightSidenav position=\"end\" mode=\"side\">\n <ajf-fb-node-properties></ajf-fb-node-properties>\n </div>\n</div>\n", styles: ["ajf-form-builder{display:flex;position:relative;min-height:300px;flex-direction:column;align-items:stretch;overflow-y:auto}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar{position:sticky;top:0;z-index:2;padding:2px 0}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-button]{flex:1 0 auto}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-icon-button]{flex:0 0 auto}ajf-form-builder .ajf-formtree-container{display:flex;flex-flow:row;align-items:start;justify-content:space-between}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container{flex:1 0 auto;min-height:50vh}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container mat-drawer{max-width:20%}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .ajf-designer{padding:2}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .mat-expansion-panel-body{padding:10px}ajf-form-builder .ajf-formtree-container .ajf-formtree-properties{flex:0 1 auto;max-width:20%}ajf-form-builder mat-toolbar .ajf-spacer{flex:1 1 auto}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i4$1.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "directive", type: i4$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7$3.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i7$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i7$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i8$3.MatDrawer, selector: "mat-drawer", inputs: ["position", "mode", "disableClose", "autoFocus", "opened"], outputs: ["openedChange", "opened", "openedStart", "closed", "closedStart", "positionChanged"], exportAs: ["matDrawer"] }, { kind: "component", type: i8$3.MatDrawerContainer, selector: "mat-drawer-container", inputs: ["autosize", "hasBackdrop"], outputs: ["backdropClick"], exportAs: ["matDrawerContainer"] }, { kind: "component", type: i9$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i11.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "component", type: AjfFbNodeEntry, selector: "ajf-fb-node-entry", inputs: ["isFirst", "nodeEntry", "level", "isDraggable", "originOffset", "firstBranchColor"] }, { kind: "component", type: AjfFbNodeProperties, selector: "ajf-fb-node-properties" }, { kind: "component", type: AjfFbNodeTypeEntry, selector: "ajf-fb-node-type-entry", inputs: ["nodeType"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i6$1.TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
2948
+ AjfFormBuilder.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfFormBuilder, selector: "ajf-form-builder", inputs: { form: "form" }, viewQueries: [{ propertyName: "designerCont", first: true, predicate: ["designer"], descendants: true, static: true }], ngImport: i0, template: "<mat-toolbar class=\"ajf-formbuilder-toolbar\">\n <button mat-icon-button (click)=\"leftSidenav.toggle()\">\n <mat-icon>add_box</mat-icon>\n </button>\n <button mat-button [matMenuTriggerFor]=\"choicesMenu\">{{'Choices'|transloco}}</button>\n <button mat-button (click)=\"editStringIdentifier()\">{{'Identifier'|transloco}}</button>\n <button mat-icon-button aria-label=\"Collapsed\" matTooltip=\"Keep slides collapsed\">\n <mat-icon>unfold_less</mat-icon>\n </button>\n <mat-slide-toggle color=\"primary\" (change)=\"expandToggle($event)\"></mat-slide-toggle>\n <button mat-icon-button aria-label=\"Expanded\" matTooltip=\"Keep slides expanded\">\n <mat-icon>unfold_more</mat-icon>\n </button>\n <mat-menu #choicesMenu>\n <button (click)=\"createChoicesOrigin()\" mat-menu-item>{{'New..'|transloco}}</button>\n <ng-container *ngIf=\"choicesOrigins|async as cos\">\n <button\n *ngFor=\"let choicesOrigin of cos\"\n (click)=\"editChoicesOrigin(choicesOrigin)\"\n mat-menu-item\n >\n {{ (choicesOrigin.label || choicesOrigin.name)| transloco }}\n </button>\n </ng-container>\n </mat-menu>\n <span class=\"ajf-spacer\"></span>\n</mat-toolbar>\n<div class=\"ajf-formtree-container\">\n <mat-drawer-container cdkDropListGroup class=\"ajf-formtree-drawer-container\">\n <mat-drawer #leftSidenav position=\"start\" mode=\"over\">\n <div\n #sourceDropList\n cdkDropList\n [cdkDropListConnectedTo]=\"(connectedDropLists|async)!\"\n [cdkDropListEnterPredicate]=\"disableDrop\"\n [cdkDropListData]=\"nodeTypes\"\n >\n <ajf-fb-node-type-entry\n *ngFor=\"let nodeType of nodeTypes\"\n cdkDrag\n [cdkDragData]=\"nodeType\"\n (cdkDragStarted)=\"leftSidenav.close()\"\n [nodeType]=\"nodeType\"\n ></ajf-fb-node-type-entry>\n </div>\n </mat-drawer>\n <div #designer class=\"ajf-designer\">\n <ajf-fb-node-entry\n id=\"slides-list\"\n cdkDropList\n (cdkDropListDropped)=\"onDrop($event)\"\n [cdkDropListEnterPredicate]=\"disableFieldDrop\"\n *ngFor=\"let nodeEntry of (nodeEntriesTree|async); let isFirst = first\"\n [isFirst]=\"isFirst\"\n [nodeEntry]=\"nodeEntry\"\n ></ajf-fb-node-entry>\n </div>\n </mat-drawer-container>\n <div class=\"ajf-formtree-properties\" #rightSidenav position=\"end\" mode=\"side\">\n <ajf-fb-node-properties></ajf-fb-node-properties>\n </div>\n</div>\n", styles: ["ajf-form-builder{display:flex;position:relative;min-height:300px;flex-direction:column;align-items:stretch}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar{position:sticky;top:0;z-index:2;padding:2px 0}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-button]{flex:1 0 auto}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-icon-button]{flex:0 0 auto}ajf-form-builder .ajf-formtree-container{display:flex;flex-flow:row;align-items:start;justify-content:space-between}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container{flex:1 0 auto;min-height:50vh}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container mat-drawer{max-width:20%}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .ajf-designer{padding:2}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .mat-expansion-panel-body{padding:10px}ajf-form-builder .ajf-formtree-container .ajf-formtree-properties{flex:0 1 auto;max-width:20%}ajf-form-builder mat-toolbar .ajf-spacer{flex:1 1 auto}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4$1.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i4$1.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "directive", type: i4$1.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i10.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7$3.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i7$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i7$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i8$3.MatDrawer, selector: "mat-drawer", inputs: ["position", "mode", "disableClose", "autoFocus", "opened"], outputs: ["openedChange", "opened", "openedStart", "closed", "closedStart", "positionChanged"], exportAs: ["matDrawer"] }, { kind: "component", type: i8$3.MatDrawerContainer, selector: "mat-drawer-container", inputs: ["autosize", "hasBackdrop"], outputs: ["backdropClick"], exportAs: ["matDrawerContainer"] }, { kind: "component", type: i9$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i11.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "component", type: AjfFbNodeEntry, selector: "ajf-fb-node-entry", inputs: ["isFirst", "nodeEntry", "level", "isDraggable", "originOffset", "firstBranchColor"] }, { kind: "component", type: AjfFbNodeProperties, selector: "ajf-fb-node-properties" }, { kind: "component", type: AjfFbNodeTypeEntry, selector: "ajf-fb-node-type-entry", inputs: ["nodeType"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i6$1.TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
2949
2949
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFormBuilder, decorators: [{
2950
2950
  type: Component,
2951
- args: [{ selector: 'ajf-form-builder', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<mat-toolbar class=\"ajf-formbuilder-toolbar\">\n <button mat-icon-button (click)=\"leftSidenav.toggle()\">\n <mat-icon>add_box</mat-icon>\n </button>\n <button mat-button [matMenuTriggerFor]=\"choicesMenu\">{{'Choices'|transloco}}</button>\n <button mat-button (click)=\"editStringIdentifier()\">{{'Identifier'|transloco}}</button>\n <button mat-icon-button aria-label=\"Collapsed\" matTooltip=\"Keep slides collapsed\">\n <mat-icon>unfold_less</mat-icon>\n </button>\n <mat-slide-toggle color=\"primary\" (change)=\"expandToggle($event)\"></mat-slide-toggle>\n <button mat-icon-button aria-label=\"Expanded\" matTooltip=\"Keep slides expanded\">\n <mat-icon>unfold_more</mat-icon>\n </button>\n <mat-menu #choicesMenu>\n <button (click)=\"createChoicesOrigin()\" mat-menu-item>{{'New..'|transloco}}</button>\n <ng-container *ngIf=\"choicesOrigins|async as cos\">\n <button\n *ngFor=\"let choicesOrigin of cos\"\n (click)=\"editChoicesOrigin(choicesOrigin)\"\n mat-menu-item\n >\n {{ (choicesOrigin.label || choicesOrigin.name)| transloco }}\n </button>\n </ng-container>\n </mat-menu>\n <span class=\"ajf-spacer\"></span>\n</mat-toolbar>\n<div class=\"ajf-formtree-container\">\n <mat-drawer-container cdkDropListGroup class=\"ajf-formtree-drawer-container\">\n <mat-drawer #leftSidenav position=\"start\" mode=\"over\">\n <div\n #sourceDropList\n cdkDropList\n [cdkDropListConnectedTo]=\"(connectedDropLists|async)!\"\n [cdkDropListEnterPredicate]=\"disableDrop\"\n [cdkDropListData]=\"nodeTypes\"\n >\n <ajf-fb-node-type-entry\n *ngFor=\"let nodeType of nodeTypes\"\n cdkDrag\n [cdkDragData]=\"nodeType\"\n (cdkDragStarted)=\"leftSidenav.close()\"\n [nodeType]=\"nodeType\"\n ></ajf-fb-node-type-entry>\n </div>\n </mat-drawer>\n <div #designer class=\"ajf-designer\">\n <ajf-fb-node-entry\n id=\"slides-list\"\n cdkDropList\n (cdkDropListDropped)=\"onDrop($event)\"\n [cdkDropListEnterPredicate]=\"disableFieldDrop\"\n *ngFor=\"let nodeEntry of (nodeEntriesTree|async); let isFirst = first\"\n [isFirst]=\"isFirst\"\n [nodeEntry]=\"nodeEntry\"\n ></ajf-fb-node-entry>\n </div>\n </mat-drawer-container>\n <div class=\"ajf-formtree-properties\" #rightSidenav position=\"end\" mode=\"side\">\n <ajf-fb-node-properties></ajf-fb-node-properties>\n </div>\n</div>\n", styles: ["ajf-form-builder{display:flex;position:relative;min-height:300px;flex-direction:column;align-items:stretch;overflow-y:auto}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar{position:sticky;top:0;z-index:2;padding:2px 0}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-button]{flex:1 0 auto}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-icon-button]{flex:0 0 auto}ajf-form-builder .ajf-formtree-container{display:flex;flex-flow:row;align-items:start;justify-content:space-between}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container{flex:1 0 auto;min-height:50vh}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container mat-drawer{max-width:20%}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .ajf-designer{padding:2}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .mat-expansion-panel-body{padding:10px}ajf-form-builder .ajf-formtree-container .ajf-formtree-properties{flex:0 1 auto;max-width:20%}ajf-form-builder mat-toolbar .ajf-spacer{flex:1 1 auto}\n"] }]
2951
+ args: [{ selector: 'ajf-form-builder', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<mat-toolbar class=\"ajf-formbuilder-toolbar\">\n <button mat-icon-button (click)=\"leftSidenav.toggle()\">\n <mat-icon>add_box</mat-icon>\n </button>\n <button mat-button [matMenuTriggerFor]=\"choicesMenu\">{{'Choices'|transloco}}</button>\n <button mat-button (click)=\"editStringIdentifier()\">{{'Identifier'|transloco}}</button>\n <button mat-icon-button aria-label=\"Collapsed\" matTooltip=\"Keep slides collapsed\">\n <mat-icon>unfold_less</mat-icon>\n </button>\n <mat-slide-toggle color=\"primary\" (change)=\"expandToggle($event)\"></mat-slide-toggle>\n <button mat-icon-button aria-label=\"Expanded\" matTooltip=\"Keep slides expanded\">\n <mat-icon>unfold_more</mat-icon>\n </button>\n <mat-menu #choicesMenu>\n <button (click)=\"createChoicesOrigin()\" mat-menu-item>{{'New..'|transloco}}</button>\n <ng-container *ngIf=\"choicesOrigins|async as cos\">\n <button\n *ngFor=\"let choicesOrigin of cos\"\n (click)=\"editChoicesOrigin(choicesOrigin)\"\n mat-menu-item\n >\n {{ (choicesOrigin.label || choicesOrigin.name)| transloco }}\n </button>\n </ng-container>\n </mat-menu>\n <span class=\"ajf-spacer\"></span>\n</mat-toolbar>\n<div class=\"ajf-formtree-container\">\n <mat-drawer-container cdkDropListGroup class=\"ajf-formtree-drawer-container\">\n <mat-drawer #leftSidenav position=\"start\" mode=\"over\">\n <div\n #sourceDropList\n cdkDropList\n [cdkDropListConnectedTo]=\"(connectedDropLists|async)!\"\n [cdkDropListEnterPredicate]=\"disableDrop\"\n [cdkDropListData]=\"nodeTypes\"\n >\n <ajf-fb-node-type-entry\n *ngFor=\"let nodeType of nodeTypes\"\n cdkDrag\n [cdkDragData]=\"nodeType\"\n (cdkDragStarted)=\"leftSidenav.close()\"\n [nodeType]=\"nodeType\"\n ></ajf-fb-node-type-entry>\n </div>\n </mat-drawer>\n <div #designer class=\"ajf-designer\">\n <ajf-fb-node-entry\n id=\"slides-list\"\n cdkDropList\n (cdkDropListDropped)=\"onDrop($event)\"\n [cdkDropListEnterPredicate]=\"disableFieldDrop\"\n *ngFor=\"let nodeEntry of (nodeEntriesTree|async); let isFirst = first\"\n [isFirst]=\"isFirst\"\n [nodeEntry]=\"nodeEntry\"\n ></ajf-fb-node-entry>\n </div>\n </mat-drawer-container>\n <div class=\"ajf-formtree-properties\" #rightSidenav position=\"end\" mode=\"side\">\n <ajf-fb-node-properties></ajf-fb-node-properties>\n </div>\n</div>\n", styles: ["ajf-form-builder{display:flex;position:relative;min-height:300px;flex-direction:column;align-items:stretch}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar{position:sticky;top:0;z-index:2;padding:2px 0}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-button]{flex:1 0 auto}ajf-form-builder mat-toolbar.ajf-formbuilder-toolbar mat-menu div[mat-menu-item]>button[mat-icon-button]{flex:0 0 auto}ajf-form-builder .ajf-formtree-container{display:flex;flex-flow:row;align-items:start;justify-content:space-between}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container{flex:1 0 auto;min-height:50vh}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container mat-drawer{max-width:20%}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .ajf-designer{padding:2}ajf-form-builder .ajf-formtree-container mat-drawer-container.ajf-formtree-drawer-container .mat-expansion-panel-body{padding:10px}ajf-form-builder .ajf-formtree-container .ajf-formtree-properties{flex:0 1 auto;max-width:20%}ajf-form-builder mat-toolbar .ajf-spacer{flex:1 1 auto}\n"] }]
2952
2952
  }], ctorParameters: function () { return [{ type: AjfFormBuilderService }, { type: i2.MatDialog }]; }, propDecorators: { designerCont: [{
2953
2953
  type: ViewChild,
2954
2954
  args: ['designer', { static: true }]