@acrodata/gui
Version:
JSON powered GUI for configurable panels.
30 lines • 7 kB
JavaScript
import { ChangeDetectionStrategy, Component, Input, ViewEncapsulation, } from '@angular/core';
import { GuiFieldLabel } from '../field-label/field-label';
import * as i0 from "@angular/core";
export class GuiFieldGroup {
constructor(differs, cdr) {
this.differs = differs;
this.cdr = cdr;
this.config = {};
}
ngOnInit() {
this.configDiffer = this.differs.find(this.config).create();
}
ngDoCheck() {
const changes = this.configDiffer?.diff(this.config);
changes?.forEachChangedItem(record => {
this.cdr.markForCheck();
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GuiFieldGroup, deps: [{ token: i0.KeyValueDiffers }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: GuiFieldGroup, isStandalone: true, selector: "gui-field-group", inputs: { config: "config" }, host: { classAttribute: "gui-field-group" }, ngImport: i0, template: "@if (config.parentType !== 'inline' && config.name) {\n <gui-field-label [config]=\"config\" [index]=\"config.index\" />\n}\n<ng-content />\n", styles: [".gui-field-group{display:flex;padding:.25rem .5rem}.gui-field{--mat-form-field-container-vertical-padding: .25rem;--mat-form-field-container-text-line-height: 1rem;--mat-form-field-container-text-size: .75rem;display:inline-flex;flex:1;flex-wrap:wrap}.gui-field>.mat-mdc-form-field{flex:1;width:0;max-width:100%}.gui-field .mat-mdc-text-field-wrapper,.gui-field .mat-mdc-form-field-hint-wrapper{position:relative;padding:0 .5rem;border-radius:var(--mdc-filled-text-field-container-shape)}[dir=rtl] .gui-field .mat-mdc-text-field-wrapper,[dir=rtl] .gui-field .mat-mdc-form-field-hint-wrapper{padding:0 .5rem}.gui-field .mat-mdc-form-field-infix{min-height:auto}.gui-field .mat-mdc-form-field-hint-spacer,.gui-field .mat-mdc-form-field-bottom-align:before,.gui-field .mdc-line-ripple{display:none}\n"], dependencies: [{ kind: "component", type: GuiFieldLabel, selector: "gui-field-label", inputs: ["config", "index"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GuiFieldGroup, decorators: [{
type: Component,
args: [{ selector: 'gui-field-group', host: {
class: 'gui-field-group',
}, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [GuiFieldLabel], template: "@if (config.parentType !== 'inline' && config.name) {\n <gui-field-label [config]=\"config\" [index]=\"config.index\" />\n}\n<ng-content />\n", styles: [".gui-field-group{display:flex;padding:.25rem .5rem}.gui-field{--mat-form-field-container-vertical-padding: .25rem;--mat-form-field-container-text-line-height: 1rem;--mat-form-field-container-text-size: .75rem;display:inline-flex;flex:1;flex-wrap:wrap}.gui-field>.mat-mdc-form-field{flex:1;width:0;max-width:100%}.gui-field .mat-mdc-text-field-wrapper,.gui-field .mat-mdc-form-field-hint-wrapper{position:relative;padding:0 .5rem;border-radius:var(--mdc-filled-text-field-container-shape)}[dir=rtl] .gui-field .mat-mdc-text-field-wrapper,[dir=rtl] .gui-field .mat-mdc-form-field-hint-wrapper{padding:0 .5rem}.gui-field .mat-mdc-form-field-infix{min-height:auto}.gui-field .mat-mdc-form-field-hint-spacer,.gui-field .mat-mdc-form-field-bottom-align:before,.gui-field .mdc-line-ripple{display:none}\n"] }]
}], ctorParameters: () => [{ type: i0.KeyValueDiffers }, { type: i0.ChangeDetectorRef }], propDecorators: { config: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmllbGQtZ3JvdXAuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9ndWkvZmllbGQtZ3JvdXAvZmllbGQtZ3JvdXAudHMiLCIuLi8uLi8uLi8uLi9wcm9qZWN0cy9ndWkvZmllbGQtZ3JvdXAvZmllbGQtZ3JvdXAuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ0wsdUJBQXVCLEVBRXZCLFNBQVMsRUFFVCxLQUFLLEVBSUwsaUJBQWlCLEdBQ2xCLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQzs7QUFlM0QsTUFBTSxPQUFPLGFBQWE7SUFLeEIsWUFDVSxPQUF3QixFQUN4QixHQUFzQjtRQUR0QixZQUFPLEdBQVAsT0FBTyxDQUFpQjtRQUN4QixRQUFHLEdBQUgsR0FBRyxDQUFtQjtRQU52QixXQUFNLEdBQXdCLEVBQUUsQ0FBQztJQU92QyxDQUFDO0lBRUosUUFBUTtRQUNOLElBQUksQ0FBQyxZQUFZLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDLE1BQU0sRUFBRSxDQUFDO0lBQzlELENBQUM7SUFFRCxTQUFTO1FBQ1AsTUFBTSxPQUFPLEdBQUcsSUFBSSxDQUFDLFlBQVksRUFBRSxJQUFJLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDO1FBQ3JELE9BQU8sRUFBRSxrQkFBa0IsQ0FBQyxNQUFNLENBQUMsRUFBRTtZQUNuQyxJQUFJLENBQUMsR0FBRyxDQUFDLFlBQVksRUFBRSxDQUFDO1FBQzFCLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQzsrR0FuQlUsYUFBYTttR0FBYixhQUFhLHNKQzFCMUIsZ0pBSUEsdTFCRG9CWSxhQUFhOzs0RkFFWixhQUFhO2tCQVp6QixTQUFTOytCQUNFLGlCQUFpQixRQUdyQjt3QkFDSixLQUFLLEVBQUUsaUJBQWlCO3FCQUN6QixpQkFDYyxpQkFBaUIsQ0FBQyxJQUFJLG1CQUNwQix1QkFBdUIsQ0FBQyxNQUFNLGNBQ25DLElBQUksV0FDUCxDQUFDLGFBQWEsQ0FBQztvSEFHZixNQUFNO3NCQUFkLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ2hhbmdlRGV0ZWN0b3JSZWYsXG4gIENvbXBvbmVudCxcbiAgRG9DaGVjayxcbiAgSW5wdXQsXG4gIEtleVZhbHVlRGlmZmVyLFxuICBLZXlWYWx1ZURpZmZlcnMsXG4gIE9uSW5pdCxcbiAgVmlld0VuY2Fwc3VsYXRpb24sXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgR3VpRmllbGRMYWJlbCB9IGZyb20gJy4uL2ZpZWxkLWxhYmVsL2ZpZWxkLWxhYmVsJztcbmltcG9ydCB7IEd1aUNvbnRyb2wgfSBmcm9tICcuLi9pbnRlcmZhY2UnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdndWktZmllbGQtZ3JvdXAnLFxuICB0ZW1wbGF0ZVVybDogJy4vZmllbGQtZ3JvdXAuaHRtbCcsXG4gIHN0eWxlVXJsOiAnLi9maWVsZC1ncm91cC5zY3NzJyxcbiAgaG9zdDoge1xuICAgIGNsYXNzOiAnZ3VpLWZpZWxkLWdyb3VwJyxcbiAgfSxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtHdWlGaWVsZExhYmVsXSxcbn0pXG5leHBvcnQgY2xhc3MgR3VpRmllbGRHcm91cCBpbXBsZW1lbnRzIE9uSW5pdCwgRG9DaGVjayB7XG4gIEBJbnB1dCgpIGNvbmZpZzogUGFydGlhbDxHdWlDb250cm9sPiA9IHt9O1xuXG4gIHByaXZhdGUgY29uZmlnRGlmZmVyPzogS2V5VmFsdWVEaWZmZXI8c3RyaW5nLCBhbnk+O1xuXG4gIGNvbnN0cnVjdG9yKFxuICAgIHByaXZhdGUgZGlmZmVyczogS2V5VmFsdWVEaWZmZXJzLFxuICAgIHByaXZhdGUgY2RyOiBDaGFuZ2VEZXRlY3RvclJlZlxuICApIHt9XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgdGhpcy5jb25maWdEaWZmZXIgPSB0aGlzLmRpZmZlcnMuZmluZCh0aGlzLmNvbmZpZykuY3JlYXRlKCk7XG4gIH1cblxuICBuZ0RvQ2hlY2soKTogdm9pZCB7XG4gICAgY29uc3QgY2hhbmdlcyA9IHRoaXMuY29uZmlnRGlmZmVyPy5kaWZmKHRoaXMuY29uZmlnKTtcbiAgICBjaGFuZ2VzPy5mb3JFYWNoQ2hhbmdlZEl0ZW0ocmVjb3JkID0+IHtcbiAgICAgIHRoaXMuY2RyLm1hcmtGb3JDaGVjaygpO1xuICAgIH0pO1xuICB9XG59XG4iLCJAaWYgKGNvbmZpZy5wYXJlbnRUeXBlICE9PSAnaW5saW5lJyAmJiBjb25maWcubmFtZSkge1xuICA8Z3VpLWZpZWxkLWxhYmVsIFtjb25maWddPVwiY29uZmlnXCIgW2luZGV4XT1cImNvbmZpZy5pbmRleFwiIC8+XG59XG48bmctY29udGVudCAvPlxuIl19