UNPKG

@acrodata/gui

Version:

JSON powered GUI for configurable panels.

59 lines 10.3 kB
import { ChangeDetectionStrategy, Component, forwardRef, Input, ViewEncapsulation, } from '@angular/core'; import { FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms'; import { MatHint } from '@angular/material/form-field'; import { MatSlideToggle } from '@angular/material/slide-toggle'; import { GuiFieldLabel } from '../field-label/field-label'; import * as i0 from "@angular/core"; import * as i1 from "@angular/forms"; export class GuiSwitch { constructor(cdr) { this.cdr = cdr; this.config = {}; this.disabled = false; this.value = false; this.onChange = () => { }; this.onTouched = () => { }; } writeValue(value) { this.value = value; this.cdr.markForCheck(); } registerOnChange(fn) { this.onChange = fn; } registerOnTouched(fn) { this.onTouched = fn; } setDisabledState(isDisabled) { this.disabled = isDisabled; this.cdr.markForCheck(); } onValueChange() { this.onChange(this.value); } static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GuiSwitch, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); } static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: GuiSwitch, isStandalone: true, selector: "gui-switch", inputs: { config: "config", disabled: "disabled" }, host: { classAttribute: "gui-field gui-switch" }, providers: [ { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => GuiSwitch), multi: true, }, ], ngImport: i0, template: "<mat-slide-toggle [(ngModel)]=\"value\" [disabled]=\"disabled\" hideIcon (change)=\"onValueChange()\" />\n@if (config.parentType === 'inline') {\n <mat-hint>\n <gui-field-label [config]=\"config\" />\n </mat-hint>\n}\n", styles: [".gui-switch .mat-mdc-slide-toggle{--mat-switch-unselected-handle-size: .5rem;--mat-switch-selected-handle-size: .75rem;--mat-switch-pressed-handle-size: .75rem;--mat-switch-selected-handle-horizontal-margin: 0;--mat-switch-selected-pressed-handle-horizontal-margin: 0;--mat-switch-unselected-handle-horizontal-margin: 0 .25rem;--mat-switch-unselected-pressed-handle-horizontal-margin: 0 .125rem;--mat-switch-track-outline-width: 1px;--mdc-switch-track-width: 1.75rem;--mdc-switch-track-height: 1rem;--mdc-switch-track-shape: .5rem;--mdc-switch-handle-width: .875rem;--mdc-switch-state-layer-size: 1.5rem;line-height:var(--mdc-switch-state-layer-size)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { 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: GuiSwitch, decorators: [{ type: Component, args: [{ selector: 'gui-switch', host: { class: 'gui-field gui-switch', }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [ { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => GuiSwitch), multi: true, }, ], standalone: true, imports: [FormsModule, MatSlideToggle, MatHint, GuiFieldLabel], template: "<mat-slide-toggle [(ngModel)]=\"value\" [disabled]=\"disabled\" hideIcon (change)=\"onValueChange()\" />\n@if (config.parentType === 'inline') {\n <mat-hint>\n <gui-field-label [config]=\"config\" />\n </mat-hint>\n}\n", styles: [".gui-switch .mat-mdc-slide-toggle{--mat-switch-unselected-handle-size: .5rem;--mat-switch-selected-handle-size: .75rem;--mat-switch-pressed-handle-size: .75rem;--mat-switch-selected-handle-horizontal-margin: 0;--mat-switch-selected-pressed-handle-horizontal-margin: 0;--mat-switch-unselected-handle-horizontal-margin: 0 .25rem;--mat-switch-unselected-pressed-handle-horizontal-margin: 0 .125rem;--mat-switch-track-outline-width: 1px;--mdc-switch-track-width: 1.75rem;--mdc-switch-track-height: 1rem;--mdc-switch-track-shape: .5rem;--mdc-switch-handle-width: .875rem;--mdc-switch-state-layer-size: 1.5rem;line-height:var(--mdc-switch-state-layer-size)}\n"] }] }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { config: [{ type: Input }], disabled: [{ type: Input }] } }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3dpdGNoLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvZ3VpL3N3aXRjaC9zd2l0Y2gudHMiLCIuLi8uLi8uLi8uLi9wcm9qZWN0cy9ndWkvc3dpdGNoL3N3aXRjaC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCx1QkFBdUIsRUFFdkIsU0FBUyxFQUNULFVBQVUsRUFDVixLQUFLLEVBQ0wsaUJBQWlCLEdBQ2xCLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBd0IsV0FBVyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDdEYsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLDhCQUE4QixDQUFDO0FBQ3ZELE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSxnQ0FBZ0MsQ0FBQztBQUNoRSxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sNEJBQTRCLENBQUM7OztBQXNCM0QsTUFBTSxPQUFPLFNBQVM7SUFTcEIsWUFBb0IsR0FBc0I7UUFBdEIsUUFBRyxHQUFILEdBQUcsQ0FBbUI7UUFSakMsV0FBTSxHQUF3QixFQUFFLENBQUM7UUFDakMsYUFBUSxHQUFHLEtBQUssQ0FBQztRQUUxQixVQUFLLEdBQUcsS0FBSyxDQUFDO1FBRU4sYUFBUSxHQUE2QixHQUFHLEVBQUUsR0FBRSxDQUFDLENBQUM7UUFDOUMsY0FBUyxHQUFlLEdBQUcsRUFBRSxHQUFFLENBQUMsQ0FBQztJQUVJLENBQUM7SUFFOUMsVUFBVSxDQUFDLEtBQWM7UUFDdkIsSUFBSSxDQUFDLEtBQUssR0FBRyxLQUFLLENBQUM7UUFDbkIsSUFBSSxDQUFDLEdBQUcsQ0FBQyxZQUFZLEVBQUUsQ0FBQztJQUMxQixDQUFDO0lBRUQsZ0JBQWdCLENBQUMsRUFBNEI7UUFDM0MsSUFBSSxDQUFDLFFBQVEsR0FBRyxFQUFFLENBQUM7SUFDckIsQ0FBQztJQUVELGlCQUFpQixDQUFDLEVBQWM7UUFDOUIsSUFBSSxDQUFDLFNBQVMsR0FBRyxFQUFFLENBQUM7SUFDdEIsQ0FBQztJQUVELGdCQUFnQixDQUFDLFVBQW1CO1FBQ2xDLElBQUksQ0FBQyxRQUFRLEdBQUcsVUFBVSxDQUFDO1FBQzNCLElBQUksQ0FBQyxHQUFHLENBQUMsWUFBWSxFQUFFLENBQUM7SUFDMUIsQ0FBQztJQUVELGFBQWE7UUFDWCxJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUM1QixDQUFDOytHQS9CVSxTQUFTO21HQUFULFNBQVMsK0pBVlQ7WUFDVDtnQkFDRSxPQUFPLEVBQUUsaUJBQWlCO2dCQUMxQixXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSxDQUFDLFNBQVMsQ0FBQztnQkFDeEMsS0FBSyxFQUFFLElBQUk7YUFDWjtTQUNGLDBCQzdCSCxpT0FNQSxzc0JEeUJZLFdBQVcsK1ZBQUUsY0FBYywwVUFBRSxPQUFPLDhFQUFFLGFBQWE7OzRGQUVsRCxTQUFTO2tCQW5CckIsU0FBUzsrQkFDRSxZQUFZLFFBR2hCO3dCQUNKLEtBQUssRUFBRSxzQkFBc0I7cUJBQzlCLGlCQUNjLGlCQUFpQixDQUFDLElBQUksbUJBQ3BCLHVCQUF1QixDQUFDLE1BQU0sYUFDcEM7d0JBQ1Q7NEJBQ0UsT0FBTyxFQUFFLGlCQUFpQjs0QkFDMUIsV0FBVyxFQUFFLFVBQVUsQ0FBQyxHQUFHLEVBQUUsVUFBVSxDQUFDOzRCQUN4QyxLQUFLLEVBQUUsSUFBSTt5QkFDWjtxQkFDRixjQUNXLElBQUksV0FDUCxDQUFDLFdBQVcsRUFBRSxjQUFjLEVBQUUsT0FBTyxFQUFFLGFBQWEsQ0FBQztzRkFHckQsTUFBTTtzQkFBZCxLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ2hhbmdlRGV0ZWN0b3JSZWYsXG4gIENvbXBvbmVudCxcbiAgZm9yd2FyZFJlZixcbiAgSW5wdXQsXG4gIFZpZXdFbmNhcHN1bGF0aW9uLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbnRyb2xWYWx1ZUFjY2Vzc29yLCBGb3Jtc01vZHVsZSwgTkdfVkFMVUVfQUNDRVNTT1IgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQgeyBNYXRIaW50IH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvZm9ybS1maWVsZCc7XG5pbXBvcnQgeyBNYXRTbGlkZVRvZ2dsZSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL3NsaWRlLXRvZ2dsZSc7XG5pbXBvcnQgeyBHdWlGaWVsZExhYmVsIH0gZnJvbSAnLi4vZmllbGQtbGFiZWwvZmllbGQtbGFiZWwnO1xuaW1wb3J0IHsgR3VpQ29udHJvbCB9IGZyb20gJy4uL2ludGVyZmFjZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2d1aS1zd2l0Y2gnLFxuICB0ZW1wbGF0ZVVybDogJy4vc3dpdGNoLmh0bWwnLFxuICBzdHlsZVVybDogJy4vc3dpdGNoLnNjc3MnLFxuICBob3N0OiB7XG4gICAgY2xhc3M6ICdndWktZmllbGQgZ3VpLXN3aXRjaCcsXG4gIH0sXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBwcm92aWRlcnM6IFtcbiAgICB7XG4gICAgICBwcm92aWRlOiBOR19WQUxVRV9BQ0NFU1NPUixcbiAgICAgIHVzZUV4aXN0aW5nOiBmb3J3YXJkUmVmKCgpID0+IEd1aVN3aXRjaCksXG4gICAgICBtdWx0aTogdHJ1ZSxcbiAgICB9LFxuICBdLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbRm9ybXNNb2R1bGUsIE1hdFNsaWRlVG9nZ2xlLCBNYXRIaW50LCBHdWlGaWVsZExhYmVsXSxcbn0pXG5leHBvcnQgY2xhc3MgR3VpU3dpdGNoIGltcGxlbWVudHMgQ29udHJvbFZhbHVlQWNjZXNzb3Ige1xuICBASW5wdXQoKSBjb25maWc6IFBhcnRpYWw8R3VpQ29udHJvbD4gPSB7fTtcbiAgQElucHV0KCkgZGlzYWJsZWQgPSBmYWxzZTtcblxuICB2YWx1ZSA9IGZhbHNlO1xuXG4gIHByaXZhdGUgb25DaGFuZ2U6ICh2YWx1ZTogYm9vbGVhbikgPT4gdm9pZCA9ICgpID0+IHt9O1xuICBwcml2YXRlIG9uVG91Y2hlZDogKCkgPT4gdm9pZCA9ICgpID0+IHt9O1xuXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgY2RyOiBDaGFuZ2VEZXRlY3RvclJlZikge31cblxuICB3cml0ZVZhbHVlKHZhbHVlOiBib29sZWFuKSB7XG4gICAgdGhpcy52YWx1ZSA9IHZhbHVlO1xuICAgIHRoaXMuY2RyLm1hcmtGb3JDaGVjaygpO1xuICB9XG5cbiAgcmVnaXN0ZXJPbkNoYW5nZShmbjogKHZhbHVlOiBib29sZWFuKSA9PiB2b2lkKSB7XG4gICAgdGhpcy5vbkNoYW5nZSA9IGZuO1xuICB9XG5cbiAgcmVnaXN0ZXJPblRvdWNoZWQoZm46ICgpID0+IHZvaWQpIHtcbiAgICB0aGlzLm9uVG91Y2hlZCA9IGZuO1xuICB9XG5cbiAgc2V0RGlzYWJsZWRTdGF0ZShpc0Rpc2FibGVkOiBib29sZWFuKSB7XG4gICAgdGhpcy5kaXNhYmxlZCA9IGlzRGlzYWJsZWQ7XG4gICAgdGhpcy5jZHIubWFya0ZvckNoZWNrKCk7XG4gIH1cblxuICBvblZhbHVlQ2hhbmdlKCkge1xuICAgIHRoaXMub25DaGFuZ2UodGhpcy52YWx1ZSk7XG4gIH1cbn1cbiIsIjxtYXQtc2xpZGUtdG9nZ2xlIFsobmdNb2RlbCldPVwidmFsdWVcIiBbZGlzYWJsZWRdPVwiZGlzYWJsZWRcIiBoaWRlSWNvbiAoY2hhbmdlKT1cIm9uVmFsdWVDaGFuZ2UoKVwiIC8+XG5AaWYgKGNvbmZpZy5wYXJlbnRUeXBlID09PSAnaW5saW5lJykge1xuICA8bWF0LWhpbnQ+XG4gICAgPGd1aS1maWVsZC1sYWJlbCBbY29uZmlnXT1cImNvbmZpZ1wiIC8+XG4gIDwvbWF0LWhpbnQ+XG59XG4iXX0=