@jsonforms/angular-material
Version:
Material Renderer Set for Angular module of JSON Forms
934 lines (893 loc) • 142 kB
JavaScript
import 'hammerjs';
import * as i2 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i5 from '@angular/forms';
import { ReactiveFormsModule } from '@angular/forms';
import * as i7 from '@angular/material/autocomplete';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import * as i5$2 from '@angular/material/button';
import { MatButtonModule } from '@angular/material/button';
import * as i7$1 from '@angular/material/badge';
import { MatBadgeModule } from '@angular/material/badge';
import * as i3$2 from '@angular/material/card';
import { MatCardModule } from '@angular/material/card';
import * as i4$1 from '@angular/material/checkbox';
import { MatCheckboxModule } from '@angular/material/checkbox';
import * as i5$1 from '@angular/material/datepicker';
import { MatDatepickerModule } from '@angular/material/datepicker';
import * as i3 from '@angular/material/form-field';
import { MatFormFieldModule } from '@angular/material/form-field';
import * as i6$2 from '@angular/material/tooltip';
import { MatTooltipModule } from '@angular/material/tooltip';
import * as i6$1 from '@angular/material/icon';
import { MatIconModule } from '@angular/material/icon';
import * as i4 from '@angular/material/input';
import { MatInputModule } from '@angular/material/input';
import * as i4$4 from '@angular/material/list';
import { MatListModule } from '@angular/material/list';
import * as i6 from '@angular/material/core';
import { NativeDateAdapter, MAT_DATE_FORMATS, DateAdapter, MatNativeDateModule } from '@angular/material/core';
import { MatSelectModule } from '@angular/material/select';
import * as i3$1 from '@angular/material/sidenav';
import { MatSidenavModule } from '@angular/material/sidenav';
import * as i4$2 from '@angular/material/slider';
import { MatSliderModule } from '@angular/material/slider';
import * as i4$3 from '@angular/material/slide-toggle';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import * as i5$3 from '@angular/material/table';
import { MatTableModule } from '@angular/material/table';
import * as i3$3 from '@angular/material/tabs';
import { MatTabsModule } from '@angular/material/tabs';
import { MatToolbarModule } from '@angular/material/toolbar';
import * as i0 from '@angular/core';
import { Component, ChangeDetectionStrategy, Input, Injectable, ViewEncapsulation, Inject, Pipe, NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import * as i1 from '@jsonforms/angular';
import { JsonFormsControl, JsonFormsBaseRenderer, JsonFormsArrayControl, JsonFormsControlWithDetail, JsonFormsAbstractControl, JsonFormsModule } from '@jsonforms/angular';
import { composeWithUi, Actions, rankWith, isEnumControl, isBooleanControl, defaultDateFormat, isDateControl, isNumberControl, or, isIntegerControl, isRangeControl, isMultiLineControl, isStringControl, and, optionIs, mapStateToLabelProps, uiTypeIs, decode, mapDispatchToArrayControlProps, findUISchema, setReadonly, getFirstPrimitiveProp, createDefaultValue, mapStateToArrayControlProps, defaultJsonFormsI18nState, getArrayTranslations, arrayDefaultTranslations, Generate, isObjectControl, encode, deriveTypes, isObjectArrayControl, isPrimitiveArrayControl, Paths, mapStateToLayoutProps, isVisible, getAjv, deriveLabelForUISchemaElement, categorizationHasCategory, mapStateToArrayLayoutProps, unsetReadonly, isObjectArrayWithNesting } from '@jsonforms/core';
import { startWith, map } from 'rxjs/operators';
import dayjs from 'dayjs';
import customParsing from 'dayjs/plugin/customParseFormat';
import merge from 'lodash/merge';
import some from 'lodash/some';
import get from 'lodash/get';
import isEmpty from 'lodash/isEmpty';
import startCase from 'lodash/startCase';
import { cloneDeep } from 'lodash';
/*
The MIT License
Copyright (c) 2017-2019 EclipseSource Munich
https://github.com/eclipsesource/jsonforms
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
*/
/**
* To use this component you will need to add your own tester:
* <pre><code>
* ...
* export const AutocompleteControlRendererTester: RankedTester = rankWith(2, isEnumControl);
* ...
* </code></pre>
* Add the tester and renderer to JSONForms registry:
* <pre><code>
* ...
* { tester: AutocompleteControlRendererTester, renderer: AutocompleteControlRenderer },
* ...
* </code></pre>
* Furthermore you need to update your module.
* <pre><code>
* ...
* imports: [JsonFormsAngularMaterialModule, MatAutocompleteModule],
* declarations: [AutocompleteControlRenderer]
* ...
* </code></pre>
*
*/
class AutocompleteControlRenderer extends JsonFormsControl {
options;
filteredOptions;
shouldFilter;
focused = false;
constructor(jsonformsService) {
super(jsonformsService);
}
getEventValue = (event) => event.target.value;
ngOnInit() {
super.ngOnInit();
this.shouldFilter = false;
this.filteredOptions = this.form.valueChanges.pipe(startWith(''), map((val) => this.filter(val)));
}
updateFilter(event) {
// ENTER
if (event.keyCode === 13) {
this.shouldFilter = false;
}
else {
this.shouldFilter = true;
}
}
onSelect(ev) {
const path = composeWithUi(this.uischema, this.path);
this.shouldFilter = false;
this.jsonFormsService.updateCore(Actions.update(path, () => ev.option.value));
this.triggerValidation();
}
filter(val) {
return (this.options || this.scopedSchema.enum || []).filter((option) => !this.shouldFilter ||
!val ||
option.toLowerCase().indexOf(val.toLowerCase()) === 0);
}
getOwnProps() {
return {
...super.getOwnProps(),
options: this.options,
};
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: AutocompleteControlRenderer, deps: [{ token: i1.JsonFormsAngularService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: AutocompleteControlRenderer, selector: "AutocompleteControlRenderer", inputs: { options: "options" }, usesInheritance: true, ngImport: i0, template: `
<mat-form-field [ngStyle]="{ display: hidden ? 'none' : '' }">
<mat-label>{{ label }}</mat-label>
<input
matInput
type="text"
(change)="onChange($event)"
[id]="id"
[formControl]="form"
[matAutocomplete]="auto"
(keydown)="updateFilter($event)"
(focus)="focused = true"
(focusout)="focused = false"
/>
<mat-autocomplete
autoActiveFirstOption
#auto="matAutocomplete"
(optionSelected)="onSelect($event)"
>
<mat-option
*ngFor="let option of filteredOptions | async"
[value]="option"
>
{{ option }}
</mat-option>
</mat-autocomplete>
<mat-hint *ngIf="shouldShowUnfocusedDescription() || focused">{{
description
}}</mat-hint>
<mat-error>{{ error }}</mat-error>
</mat-form-field>
`, isInline: true, styles: [":host{display:flex;flex-direction:row}mat-form-field{flex:1 1 auto}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.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"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i6.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i7.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i7.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: AutocompleteControlRenderer, decorators: [{
type: Component,
args: [{ selector: 'AutocompleteControlRenderer', template: `
<mat-form-field [ngStyle]="{ display: hidden ? 'none' : '' }">
<mat-label>{{ label }}</mat-label>
<input
matInput
type="text"
(change)="onChange($event)"
[id]="id"
[formControl]="form"
[matAutocomplete]="auto"
(keydown)="updateFilter($event)"
(focus)="focused = true"
(focusout)="focused = false"
/>
<mat-autocomplete
autoActiveFirstOption
#auto="matAutocomplete"
(optionSelected)="onSelect($event)"
>
<mat-option
*ngFor="let option of filteredOptions | async"
[value]="option"
>
{{ option }}
</mat-option>
</mat-autocomplete>
<mat-hint *ngIf="shouldShowUnfocusedDescription() || focused">{{
description
}}</mat-hint>
<mat-error>{{ error }}</mat-error>
</mat-form-field>
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:flex;flex-direction:row}mat-form-field{flex:1 1 auto}\n"] }]
}], ctorParameters: () => [{ type: i1.JsonFormsAngularService }], propDecorators: { options: [{
type: Input
}] } });
const enumControlTester = rankWith(2, isEnumControl);
/*
The MIT License
Copyright (c) 2017-2019 EclipseSource Munich
https://github.com/eclipsesource/jsonforms
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
*/
class BooleanControlRenderer extends JsonFormsControl {
changeDetectionRef;
constructor(jsonformsService, changeDetectionRef) {
super(jsonformsService);
this.changeDetectionRef = changeDetectionRef;
}
isChecked = () => this.data || false;
getEventValue = (event) => event.checked;
mapAdditionalProps() {
if (!this.changeDetectionRef.destroyed) {
this.changeDetectionRef.markForCheck();
}
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: BooleanControlRenderer, deps: [{ token: i1.JsonFormsAngularService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: BooleanControlRenderer, selector: "BooleanControlRenderer", usesInheritance: true, ngImport: i0, template: `
<div [ngStyle]="{ display: hidden ? 'none' : '' }" class="boolean-control">
<mat-checkbox
(change)="onChange($event)"
[checked]="isChecked()"
[disabled]="!isEnabled()"
[id]="id"
>
{{ label }}
</mat-checkbox>
<mat-hint class="mat-caption" *ngIf="shouldShowUnfocusedDescription()">{{
description
}}</mat-hint>
<mat-error class="mat-caption">{{ error }}</mat-error>
</div>
`, isInline: true, styles: [":host{display:flex;flex-direction:row}.boolean-control{flex:1 1 auto;display:flex;flex-direction:column;justify-content:center;height:100%}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i4$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: BooleanControlRenderer, decorators: [{
type: Component,
args: [{ selector: 'BooleanControlRenderer', template: `
<div [ngStyle]="{ display: hidden ? 'none' : '' }" class="boolean-control">
<mat-checkbox
(change)="onChange($event)"
[checked]="isChecked()"
[disabled]="!isEnabled()"
[id]="id"
>
{{ label }}
</mat-checkbox>
<mat-hint class="mat-caption" *ngIf="shouldShowUnfocusedDescription()">{{
description
}}</mat-hint>
<mat-error class="mat-caption">{{ error }}</mat-error>
</div>
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:flex;flex-direction:row}.boolean-control{flex:1 1 auto;display:flex;flex-direction:column;justify-content:center;height:100%}\n"] }]
}], ctorParameters: () => [{ type: i1.JsonFormsAngularService }, { type: i0.ChangeDetectorRef }] });
const booleanControlTester = rankWith(2, isBooleanControl);
class MyFormat {
displayFormat = 'M/D/YYYY';
setDisplayFormat(displayFormat) {
this.displayFormat = displayFormat;
}
get display() {
return {
monthYearLabel: 'YYYY-MM',
dateA11yLabel: 'YYYY-MM-DD',
monthYearA11yLabel: 'YYYY-MM',
dateInput: this.displayFormat,
};
}
get parse() {
return {
dateInput: this.displayFormat,
};
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: MyFormat, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: MyFormat });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: MyFormat, decorators: [{
type: Injectable
}] });
/*
The MIT License
Copyright (c) 2017-2019 EclipseSource Munich
https://github.com/eclipsesource/jsonforms
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
*/
// allows to parse date strings with custom format
dayjs.extend(customParsing);
/**
* date adapter for dayjs to parse and format dates
*/
class DayJsDateAdapter extends NativeDateAdapter {
saveFormat = defaultDateFormat;
setSaveFormat(format) {
this.saveFormat = format;
}
/**
* parses a given data prop string in the save-format into a date object
* @param value date string to be parsed
* @returns date object or null if parsing failed
*/
parseSaveFormat(value) {
return this.parse(value, this.saveFormat);
}
parse(value, format) {
if (!value) {
return null;
}
const date = dayjs(value, format);
if (date.isValid()) {
return date.toDate();
}
else {
return null;
}
}
toSaveFormat(value) {
if (!value) {
return undefined;
}
const date = dayjs(value);
if (date.isValid()) {
return date.format(this.saveFormat);
}
else {
return undefined;
}
}
/**
* transforms the date to a string representation for display
* @param date date to be formatted
* @param displayFormat format to be used for formatting the date e.g. YYYY-MM-DD
* @returns string representation of the date
*/
format(date, displayFormat) {
return dayjs(date).format(displayFormat);
}
deserialize(value) {
if (!value) {
return null;
}
const date = dayjs(value);
if (date.isValid()) {
return date.toDate();
}
else {
return null;
}
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: DayJsDateAdapter, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: DayJsDateAdapter });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: DayJsDateAdapter, decorators: [{
type: Injectable
}] });
/*
The MIT License
Copyright (c) 2017-2019 EclipseSource Munich
https://github.com/eclipsesource/jsonforms
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
*/
class DateControlRenderer extends JsonFormsControl {
dateFormat;
dateAdapter;
focused = false;
views = [];
startView = '';
panelClass = '';
constructor(jsonformsService, dateFormat, dateAdapter) {
super(jsonformsService);
this.dateFormat = dateFormat;
this.dateAdapter = dateAdapter;
}
getEventValue = (event) => {
const value = event.value ? event.value : event;
return this.dateAdapter.toSaveFormat(value);
};
mapToProps(state) {
const props = super.mapToProps(state);
const saveFormat = this.uischema?.options?.dateSaveFormat
? this.uischema.options.dateSaveFormat
: defaultDateFormat;
this.views = this.uischema?.options?.views
? this.uischema.options.views
: ['year', 'month', 'day'];
this.setViewProperties();
const dateFormat = this.uischema?.options?.dateFormat;
if (dateFormat) {
this.dateFormat.setDisplayFormat(dateFormat);
}
this.dateAdapter.setSaveFormat(saveFormat);
if (this.jsonFormsService.getLocale()) {
this.dateAdapter.setLocale(this.jsonFormsService.getLocale());
}
const date = this.dateAdapter.parseSaveFormat(props.data);
return { ...props, data: date };
}
yearSelected($event, datepicker) {
if (!this.views.includes('day') && !this.views.includes('month')) {
this.onChange($event);
datepicker.close();
}
}
monthSelected($event, datepicker) {
if (!this.views.includes('day')) {
this.onChange($event);
datepicker.close();
}
}
setViewProperties() {
if (!this.views.includes('day')) {
this.startView = 'multi-year';
this.panelClass = 'no-panel-navigation';
}
else {
this.startView = 'month';
}
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: DateControlRenderer, deps: [{ token: i1.JsonFormsAngularService }, { token: MAT_DATE_FORMATS }, { token: DateAdapter }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: DateControlRenderer, selector: "DateControlRenderer", providers: [
{
provide: DateAdapter,
useClass: DayJsDateAdapter,
},
{
provide: MAT_DATE_FORMATS,
useClass: MyFormat,
},
], usesInheritance: true, ngImport: i0, template: `
<mat-form-field
class="date-control-renderer"
[ngStyle]="{ display: hidden ? 'none' : '' }"
>
<mat-label>{{ label }}</mat-label>
<input
matInput
(dateChange)="onChange($event)"
[id]="id"
[formControl]="form"
[matDatepicker]="datepicker"
(focus)="focused = true"
(focusout)="focused = false"
/>
<mat-datepicker-toggle
matSuffix
[for]="datepicker"
></mat-datepicker-toggle>
<mat-datepicker
#datepicker
(monthSelected)="monthSelected($event, datepicker)"
(yearSelected)="yearSelected($event, datepicker)"
[startView]="startView"
[panelClass]="panelClass"
></mat-datepicker>
<mat-hint *ngIf="shouldShowUnfocusedDescription() || focused">{{
description
}}</mat-hint>
<mat-error>{{ error }}</mat-error>
</mat-form-field>
`, isInline: true, styles: ["DateControlRenderer{display:flex;flex-direction:row}.date-control-renderer{flex:1 1 auto}.no-panel-navigation .mat-calendar-period-button{pointer-events:none}.no-panel-navigation .mat-calendar-arrow{display:none}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i4.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"] }, { kind: "component", type: i5$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: DateControlRenderer, decorators: [{
type: Component,
args: [{ selector: 'DateControlRenderer', template: `
<mat-form-field
class="date-control-renderer"
[ngStyle]="{ display: hidden ? 'none' : '' }"
>
<mat-label>{{ label }}</mat-label>
<input
matInput
(dateChange)="onChange($event)"
[id]="id"
[formControl]="form"
[matDatepicker]="datepicker"
(focus)="focused = true"
(focusout)="focused = false"
/>
<mat-datepicker-toggle
matSuffix
[for]="datepicker"
></mat-datepicker-toggle>
<mat-datepicker
#datepicker
(monthSelected)="monthSelected($event, datepicker)"
(yearSelected)="yearSelected($event, datepicker)"
[startView]="startView"
[panelClass]="panelClass"
></mat-datepicker>
<mat-hint *ngIf="shouldShowUnfocusedDescription() || focused">{{
description
}}</mat-hint>
<mat-error>{{ error }}</mat-error>
</mat-form-field>
`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
{
provide: DateAdapter,
useClass: DayJsDateAdapter,
},
{
provide: MAT_DATE_FORMATS,
useClass: MyFormat,
},
], styles: ["DateControlRenderer{display:flex;flex-direction:row}.date-control-renderer{flex:1 1 auto}.no-panel-navigation .mat-calendar-period-button{pointer-events:none}.no-panel-navigation .mat-calendar-arrow{display:none}\n"] }]
}], ctorParameters: () => [{ type: i1.JsonFormsAngularService }, { type: MyFormat, decorators: [{
type: Inject,
args: [MAT_DATE_FORMATS]
}] }, { type: DayJsDateAdapter, decorators: [{
type: Inject,
args: [DateAdapter]
}] }] });
const DateControlRendererTester = rankWith(2, isDateControl);
/*
The MIT License
Copyright (c) 2017-2019 EclipseSource Munich
https://github.com/eclipsesource/jsonforms
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
*/
class NumberControlRenderer extends JsonFormsControl {
MAXIMUM_FRACTIONAL_DIGITS = 20;
oldValue;
min;
max;
multipleOf;
locale;
numberFormat;
decimalSeparator;
focused = false;
constructor(jsonformsService) {
super(jsonformsService);
}
onChange(ev) {
const data = this.oldValue
? ev.target.value.replace(this.oldValue, '')
: ev.target.value;
// ignore these
if (data === '.' ||
data === ',' ||
data === ' ' ||
// if the value is 0 and we already have a value then we ignore
(data === '0' &&
this.getValue() !== '' &&
// a 0 in the first place
((ev.target.selectionStart === 1 && ev.target.selectionEnd === 1) ||
// or in the last place as this doesn't change the value (when there is a separator)
(ev.target.selectionStart === ev.target.value.length &&
ev.target.selectionEnd === ev.target.value.length &&
ev.target.value.indexOf(this.decimalSeparator) !== -1)))) {
this.oldValue = ev.target.value;
return;
}
super.onChange(ev);
this.oldValue = this.getValue();
}
getEventValue = (event) => {
const cleanPattern = new RegExp(`[^-+0-9${this.decimalSeparator}]`, 'g');
const cleaned = event.target.value.replace(cleanPattern, '');
const normalized = cleaned.replace(this.decimalSeparator, '.');
if (normalized === '') {
return undefined;
}
// convert to number
const number = +normalized;
// if not a number just return the string
if (Number.isNaN(number)) {
return event.target.value;
}
return number;
};
getValue = () => {
if (this.data !== undefined && this.data !== null) {
if (typeof this.data === 'number') {
return this.numberFormat.format(this.data);
}
return this.data;
}
return '';
};
mapAdditionalProps(props) {
if (this.scopedSchema) {
const testerContext = {
rootSchema: this.rootSchema,
config: props.config,
};
const defaultStep = isNumberControl(this.uischema, this.rootSchema, testerContext)
? 0.1
: 1;
this.min = this.scopedSchema.minimum;
this.max = this.scopedSchema.maximum;
this.multipleOf = this.scopedSchema.multipleOf || defaultStep;
const appliedUiSchemaOptions = merge({}, props.config, this.uischema.options);
const currentLocale = this.jsonFormsService.getLocale();
if (this.locale === undefined || this.locale !== currentLocale) {
this.locale = currentLocale;
this.numberFormat = new Intl.NumberFormat(this.locale, {
useGrouping: appliedUiSchemaOptions.useGrouping,
maximumFractionDigits: this.MAXIMUM_FRACTIONAL_DIGITS,
});
this.determineDecimalSeparator();
this.oldValue = this.getValue();
}
this.form.setValue(this.getValue());
}
}
determineDecimalSeparator() {
const example = this.numberFormat.format(1.1);
this.decimalSeparator = example.charAt(1);
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NumberControlRenderer, deps: [{ token: i1.JsonFormsAngularService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: NumberControlRenderer, selector: "NumberControlRenderer", usesInheritance: true, ngImport: i0, template: `
<mat-form-field [ngStyle]="{ display: hidden ? 'none' : '' }">
<mat-label>{{ label }}</mat-label>
<input
matInput
(input)="onChange($event)"
[value]="getValue()"
[id]="id"
[formControl]="form"
[min]="min"
[max]="max"
[step]="multipleOf"
(focus)="focused = true"
(focusout)="focused = false"
/>
<mat-hint *ngIf="shouldShowUnfocusedDescription() || focused">{{
description
}}</mat-hint>
<mat-error>{{ error }}</mat-error>
</mat-form-field>
`, isInline: true, styles: [":host{display:flex;flex-direction:row}mat-form-field{flex:1 1 auto}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.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"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NumberControlRenderer, decorators: [{
type: Component,
args: [{ selector: 'NumberControlRenderer', template: `
<mat-form-field [ngStyle]="{ display: hidden ? 'none' : '' }">
<mat-label>{{ label }}</mat-label>
<input
matInput
(input)="onChange($event)"
[value]="getValue()"
[id]="id"
[formControl]="form"
[min]="min"
[max]="max"
[step]="multipleOf"
(focus)="focused = true"
(focusout)="focused = false"
/>
<mat-hint *ngIf="shouldShowUnfocusedDescription() || focused">{{
description
}}</mat-hint>
<mat-error>{{ error }}</mat-error>
</mat-form-field>
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:flex;flex-direction:row}mat-form-field{flex:1 1 auto}\n"] }]
}], ctorParameters: () => [{ type: i1.JsonFormsAngularService }] });
const NumberControlRendererTester = rankWith(2, or(isNumberControl, isIntegerControl));
/*
The MIT License
Copyright (c) 2017-2019 EclipseSource Munich
https://github.com/eclipsesource/jsonforms
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
*/
class RangeControlRenderer extends JsonFormsControl {
changeDetectorRef;
min;
max;
multipleOf;
focused = false;
constructor(jsonformsService, changeDetectorRef) {
super(jsonformsService);
this.changeDetectorRef = changeDetectorRef;
}
getEventValue = (event) => Number(event);
mapAdditionalProps() {
if (this.scopedSchema) {
this.min = this.scopedSchema.minimum;
this.max = this.scopedSchema.maximum;
this.multipleOf = this.scopedSchema.multipleOf || 1;
}
this.changeDetectorRef.markForCheck();
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: RangeControlRenderer, deps: [{ token: i1.JsonFormsAngularService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: RangeControlRenderer, selector: "RangeControlRenderer", usesInheritance: true, ngImport: i0, template: `
<div [ngStyle]="{ display: hidden ? 'none' : '' }" class="range-control">
<label class="mat-caption" style="color:rgba(0,0,0,.54)">{{
label
}}</label>
<mat-slider
[disabled]="!isEnabled()"
[max]="max"
[min]="min"
[step]="multipleOf"
[discrete]="true"
[id]="id"
showTickMarks
#ngSlider
>
<input matSliderThumb (valueChange)="onChange($event)" />
</mat-slider>
<mat-hint class="mat-caption" *ngIf="shouldShowUnfocusedDescription()">{{
description
}}</mat-hint>
<mat-error class="mat-caption">{{ error }}</mat-error>
</div>
`, isInline: true, styles: [":host{display:flex;flex-direction:row}.range-control{flex:1 1 auto;display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i4$2.MatSlider, selector: "mat-slider", inputs: ["disabled", "discrete", "showTickMarks", "min", "color", "disableRipple", "max", "step", "displayWith"], exportAs: ["matSlider"] }, { kind: "directive", type: i4$2.MatSliderThumb, selector: "input[matSliderThumb]", inputs: ["value"], outputs: ["valueChange", "dragStart", "dragEnd"], exportAs: ["matSliderThumb"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: RangeControlRenderer, decorators: [{
type: Component,
args: [{ selector: 'RangeControlRenderer', template: `
<div [ngStyle]="{ display: hidden ? 'none' : '' }" class="range-control">
<label class="mat-caption" style="color:rgba(0,0,0,.54)">{{
label
}}</label>
<mat-slider
[disabled]="!isEnabled()"
[max]="max"
[min]="min"
[step]="multipleOf"
[discrete]="true"
[id]="id"
showTickMarks
#ngSlider
>
<input matSliderThumb (valueChange)="onChange($event)" />
</mat-slider>
<mat-hint class="mat-caption" *ngIf="shouldShowUnfocusedDescription()">{{
description
}}</mat-hint>
<mat-error class="mat-caption">{{ error }}</mat-error>
</div>
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:flex;flex-direction:row}.range-control{flex:1 1 auto;display:flex;flex-direction:column}\n"] }]
}], ctorParameters: () => [{ type: i1.JsonFormsAngularService }, { type: i0.ChangeDetectorRef }] });
const RangeControlRendererTester = rankWith(4, isRangeControl);
/*
The MIT License
Copyright (c) 2017-2019 EclipseSource Munich
https://github.com/eclipsesource/jsonforms
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
*/
class TextAreaRenderer extends JsonFormsControl {
focused = false;
constructor(jsonformsService) {
super(jsonformsService);
}
getEventValue = (event) => event.target.value || undefined;
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: TextAreaRenderer, deps: [{ token: i1.JsonFormsAngularService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: TextAreaRenderer, selector: "TextAreaRenderer", usesInheritance: true, ngImport: i0, template: `
<mat-form-field [ngStyle]="{ display: hidden ? 'none' : '' }">
<mat-label>{{ label }}</mat-label>
<textarea
matInput
(input)="onChange($event)"
[id]="id"
[formControl]="form"
(focus)="focused = true"
(focusout)="focused = false"
></textarea>
<mat-hint *ngIf="shouldShowUnfocusedDescription() || focused">{{
description
}}</mat-hint>
<mat-error>{{ error }}</mat-error>
</mat-form-field>
`, isInline: true, styles: [":host{display:flex;flex-direction:row}mat-form-field{flex:1 1 auto}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.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"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: TextAreaRenderer, decorators: [{
type: Component,
args: [{ selector: 'TextAreaRenderer', template: `
<mat-form-field [ngStyle]="{ display: hidden ? 'none' : '' }">
<mat-label>{{ label }}</mat-label>
<textarea
matInput
(input)="onChange($event)"
[id]="id"
[formControl]="form"
(focus)="focused = true"
(focusout)="focused = false"
></textarea>
<mat-hint *ngIf="shouldShowUnfocusedDescription() || focused">{{
description
}}</mat-hint>
<mat-error>{{ error }}</mat-error>
</mat-form-field>
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:flex;flex-direction:row}mat-form-field{flex:1 1 auto}\n"] }]
}], ctorParameters: () => [{ type: i1.JsonFormsAngularService }] });
const TextAreaRendererTester = rankWith(2, isMultiLineControl);
/*
The MIT License
Copyright (c) 2017-2019 EclipseSource Munich
https://github.com/eclipsesource/jsonforms
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES