@messaia/cdk 18.0.0-rc20 → 18.0.0-rc21

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.
@@ -29,6 +29,11 @@ export class FormFieldDefinition {
29
29
  * @property
30
30
  */
31
31
  chipText = 'name';
32
+ /**
33
+ * Theme color palette for the chip.
34
+ * @property
35
+ */
36
+ chipColor = 'accent';
32
37
  /**
33
38
  * Type of class to be instantiated.
34
39
  * @property
@@ -367,4 +372,4 @@ export class FormFieldDefinition {
367
372
  Object.assign(this, init);
368
373
  }
369
374
  }
370
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZm9ybS1maWVsZC1kZWZpbml0aW9uLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY2RrL3NyYy9saWIvZm9ybXMvbW9kZWxzL2Zvcm0tZmllbGQtZGVmaW5pdGlvbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFVQSxNQUFNLE9BQU8sbUJBQW1CO0lBQzVCOzs7T0FHRztJQUNJLG9CQUFvQixHQUFXLEVBQUUsQ0FBQztJQUV6Qzs7O09BR0c7SUFDSSxvQkFBb0IsQ0FBK0Y7SUFFMUg7OztPQUdHO0lBQ0ksZ0JBQWdCLEdBQVcsTUFBTSxDQUFDO0lBRXpDOzs7T0FHRztJQUNJLE1BQU0sQ0FBK0Y7SUFFNUc7OztPQUdHO0lBQ0ksWUFBWSxDQUErRjtJQUVsSDs7O09BR0c7SUFDSSxRQUFRLEdBQVcsTUFBTSxDQUFDO0lBRWpDOzs7T0FHRztJQUNJLFNBQVMsQ0FBYTtJQUU3Qjs7O09BR0c7SUFDSSxLQUFLLENBQWdGO0lBRTVGOzs7T0FHRztJQUNJLFdBQVcsQ0FBNkM7SUFFL0Q7OztPQUdHO0lBQ0ksUUFBUSxDQUFVO0lBRXpCOzs7T0FHRztJQUNJLFdBQVcsR0FBWSxLQUFLLENBQUM7SUFFcEM7OztPQUdHO0lBQ0ksVUFBVSxHQUFzQixDQUFDLElBQVMsRUFBRSxFQUFFLENBQUMsSUFBSSxDQUFDO0lBRTNEOzs7T0FHRztJQUNJLGVBQWUsQ0FBMEg7SUFFaEo7OztPQUdHO0lBQ0ksZ0JBQWdCLENBQWlIO0lBRXhJOzs7T0FHRztJQUNJLFFBQVEsQ0FBMkY7SUFFMUc7OztPQUdHO0lBQ0ksVUFBVSxDQUFpRjtJQUVsRzs7O09BR0c7SUFDSSxRQUFRLENBQU87SUFFdEI7OztPQUdHO0lBQ0ksWUFBWSxDQUFrQztJQUVyRDs7O09BR0c7SUFDSSxjQUFjLEdBQXFGLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQztJQUVySDs7O09BR0c7SUFDSSxTQUFTLENBQVk7SUFFNUI7OztPQUdHO0lBQ0ksY0FBYyxDQUFVO0lBRS9COzs7T0FHRztJQUNJLFFBQVEsQ0FBVTtJQUV6Qjs7O09BR0c7SUFDSSxJQUFJLENBQVU7SUFFckI7OztPQUdHO0lBQ0ksV0FBVyxDQUFXO0lBRTdCOzs7T0FHRztJQUNJLFdBQVcsR0FBVyxTQUFTLENBQUEsb0JBQW9CLENBQUM7SUFFM0Q7OztPQUdHO0lBQ0ksU0FBUyxDQUFVO0lBRTFCOzs7T0FHRztJQUNJLE1BQU0sQ0FBVztJQUV4Qjs7O09BR0c7SUFDSSxJQUFJLENBQWdGO0lBRTNGOzs7T0FHRztJQUNJLElBQUksQ0FBVTtJQUVyQjs7O09BR0c7SUFDSSxLQUFLLENBQVU7SUFFdEI7OztPQUdHO0lBQ0ksU0FBUyxDQUFVO0lBRTFCOzs7T0FHRztJQUNJLFlBQVksQ0FBVztJQUU5Qjs7O09BR0c7SUFDSSxVQUFVLENBQStGO0lBRWhIOzs7T0FHRztJQUNJLFVBQVUsQ0FBK0Y7SUFFaEg7OztPQUdHO0lBQ0ksS0FBSyxDQUE4RjtJQUUxRzs7O09BR0c7SUFDSSxNQUFNLENBQXFCO0lBRWxDOzs7T0FHRztJQUNJLEdBQUcsQ0FBaUI7SUFFM0I7OztPQUdHO0lBQ0ksU0FBUyxDQUFVO0lBRTFCOzs7T0FHRztJQUNJLFNBQVMsQ0FBVTtJQUUxQjs7O09BR0c7SUFDSSxRQUFRLENBQVU7SUFFekI7OztPQUdHO0lBQ0ksR0FBRyxDQUFpQjtJQUUzQjs7O09BR0c7SUFDSSxTQUFTLENBQVU7SUFFMUI7OztPQUdHO0lBQ0ksU0FBUyxDQUFXO0lBRTNCOzs7T0FHRztJQUNJLFFBQVEsR0FBWSxLQUFLLENBQUM7SUFFakM7OztPQUdHO0lBQ0ksV0FBVyxDQUFXO0lBRTdCOzs7T0FHRztJQUNJLFdBQVcsR0FBWSxLQUFLLENBQUM7SUFFcEM7OztPQUdHO0lBQ0ksSUFBSSxDQUFVO0lBRXJCOzs7T0FHRztJQUNJLE9BQU8sQ0FBd0k7SUFFdEo7OztPQUdHO0lBQ0ksYUFBYSxHQUFhLElBQUksQ0FBQztJQUV0Qzs7O09BR0c7SUFDSSxjQUFjLENBQStGO0lBRXBIOzs7T0FHRztJQUNJLGtCQUFrQixHQUFXLE1BQU0sQ0FBQztJQUUzQzs7O09BR0c7SUFDSSxtQkFBbUIsR0FBVyxJQUFJLENBQUM7SUFFMUM7OztPQUdHO0lBQ0kscUJBQXFCLENBQVU7SUFFdEM7O09BRUc7SUFDSSxVQUFVLENBQThHO0lBRS9IOzs7T0FHRztJQUNJLHFCQUFxQixDQUFVO0lBRXRDOzs7T0FHRztJQUNJLGlCQUFpQixHQUFZLDJCQUEyQixDQUFDO0lBRWhFOzs7T0FHRztJQUNJLE1BQU0sQ0FBdUY7SUFFcEc7OztPQUdHO0lBQ0ksT0FBTyxDQUFtQjtJQUVqQzs7O09BR0c7SUFDSSxVQUFVLEdBQXNCLEVBQUUsQ0FBQztJQUUxQzs7O09BR0c7SUFDSSxRQUFRLENBQW9GO0lBRW5HOzs7T0FHRztJQUNJLFFBQVEsQ0FBaUc7SUFFaEg7OztPQUdHO0lBQ0ksR0FBRyxHQUFXLENBQUMsQ0FBQztJQUV2Qjs7O09BR0c7SUFDSSxJQUFJLENBQVU7SUFFckI7OztPQUdHO0lBQ0ksV0FBVyxHQUFXLFFBQVEsQ0FBQztJQUV0Qzs7O09BR0c7SUFDSSxNQUFNLENBQWdGO0lBRTdGOzs7T0FHRztJQUNJLGFBQWEsR0FBa0UsRUFBRSxDQUFDO0lBRXpGOzs7T0FHRztJQUNJLGVBQWUsQ0FBVTtJQUVoQzs7O09BR0c7SUFDSSxhQUFhLENBQStGO0lBRW5IOzs7T0FHRztJQUNJLFdBQVcsQ0FBVTtJQUU1Qjs7O09BR0c7SUFDSSxlQUFlLENBQTZHO0lBRW5JOzs7T0FHRztJQUNJLElBQUksQ0FBNEc7SUFFdkg7OztPQUdHO0lBQ0ksT0FBTyxHQUFZLElBQUksQ0FBQztJQUUvQjs7OztPQUlHO0lBQ0gsWUFBbUIsSUFBNEM7UUFDM0QsTUFBTSxDQUFDLE1BQU0sQ0FBQyxJQUFJLEVBQUUsSUFBSSxDQUFDLENBQUM7SUFDOUIsQ0FBQztDQUNKIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgVHlwZSB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XHJcbmltcG9ydCB7IEZvcm1Hcm91cCB9IGZyb20gXCJAYW5ndWxhci9mb3Jtc1wiO1xyXG5pbXBvcnQgeyBEYXRlRmlsdGVyRm4sIE1hdERhdGVwaWNrZXIgfSBmcm9tIFwiQGFuZ3VsYXIvbWF0ZXJpYWwvZGF0ZXBpY2tlclwiO1xyXG5pbXBvcnQgeyBPYnNlcnZhYmxlIH0gZnJvbSBcInJ4anNcIjtcclxuaW1wb3J0IHsgSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudCB9IGZyb20gXCIuLi8uLi9iYXNlL2ludGVyZmFjZXMvaWdlbmVyaWMtZm9ybS1iYXNlXCI7XHJcbmltcG9ydCB7IEVudW1NZXRhZGF0YSB9IGZyb20gXCIuLi8uLi9jb21tb24vbW9kZWxzL2VudW0tbWV0YWRhdGFcIjtcclxuaW1wb3J0IHsgSWNvbiB9IGZyb20gXCIuLi8uLi9jb21tb24vbW9kZWxzL2ljb25cIjtcclxuaW1wb3J0IHsgU3VmZml4QnV0dG9uIH0gZnJvbSBcIi4uLy4uL2NvbW1vbi9tb2RlbHMvc3VmZml4LWJ1dHRvblwiO1xyXG5pbXBvcnQgeyBGb3JtRmllbGRUeXBlIH0gZnJvbSBcIi4uL2VudW1zL2Zvcm0tZmllbGQtdHlwZVwiO1xyXG5cclxuZXhwb3J0IGNsYXNzIEZvcm1GaWVsZERlZmluaXRpb248VEVudGl0eSA9IGFueSwgVFByb3BlcnR5ID0gYW55PiB7XHJcbiAgICAvKipcclxuICAgICAqIENTUyBjbGFzcyBmb3IgYXV0b2NvbXBsZXRlIGZ1bmN0aW9uYWxpdHkuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGF1dG9jb21wbGV0ZUNzc0NsYXNzOiBzdHJpbmcgPSAnJztcclxuXHJcbiAgICAvKipcclxuICAgICAqIFRlbXBsYXRlIGZvciBhdXRvY29tcGxldGUgZnVuY3Rpb25hbGl0eS5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgYXV0b2NvbXBsZXRlVGVtcGxhdGU/OiAoeDogVFByb3BlcnR5LCB5PzogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gYW55O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogVGV4dCB0byBkaXNwbGF5IGluIGF1dG9jb21wbGV0ZS5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgYXV0b2NvbXBsZXRlVGV4dDogc3RyaW5nID0gJ25hbWUnO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogQ2FsbGJhY2sgZnVuY3Rpb24gaW52b2tlZCBvbiBjaGFuZ2UuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGNoYW5nZT86ICh4OiBUUHJvcGVydHksIHk/OiBURW50aXR5LCBmPzogRm9ybUdyb3VwLCBjdHg/OiBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+KSA9PiBhbnk7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBUZW1wbGF0ZSBmb3IgY2hpcCBmdW5jdGlvbmFsaXR5LlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBjaGlwVGVtcGxhdGU/OiAoeDogVFByb3BlcnR5LCB5PzogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gYW55O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogVGV4dCB0byBkaXNwbGF5IGluIGNoaXAuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGNoaXBUZXh0OiBzdHJpbmcgPSAnbmFtZSc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBUeXBlIG9mIGNsYXNzIHRvIGJlIGluc3RhbnRpYXRlZC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgY2xhc3NUeXBlPzogVHlwZTxhbnk+O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogQ2FsbGJhY2sgZnVuY3Rpb24gaW52b2tlZCBvbiBjbGVhcmluZy5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgY2xlYXI/OiAoeDogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gYW55O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogRnVuY3Rpb24gdG8gY29tcGFyZSB0d28gdmFsdWVzLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBjb21wYXJlV2l0aD86IChvMTogVFByb3BlcnR5LCBvMjogVFByb3BlcnR5KSA9PiBib29sZWFuO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogQ1NTIGNsYXNzIGZvciBzdHlsaW5nLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBjc3NDbGFzcz86IHN0cmluZztcclxuXHJcbiAgICAvKipcclxuICAgICAqIEluZGljYXRlcyBpZiB0aGUgdmFsdWUgaXMgY3VzdG9tLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBjdXN0b21WYWx1ZTogYm9vbGVhbiA9IGZhbHNlO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogRnVuY3Rpb24gdG8gZmlsdGVyIGRhdGVzLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBkYXRlRmlsdGVyOiBEYXRlRmlsdGVyRm48YW55PiA9IChkYXRlOiBhbnkpID0+IHRydWU7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBBc3luY2hyb25vdXMgZnVuY3Rpb24gdG8gZmlsdGVyIGRhdGVzLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBkYXRlRmlsdGVyQXN5bmM/OiAoZDogRGF0ZSB8IGFueSwgeT86IFRFbnRpdHksIGY/OiBGb3JtR3JvdXAsIGN0eD86IElHZW5lcmljRm9ybUJhc2VDb21wb25lbnQ8VEVudGl0eT4pID0+IE9ic2VydmFibGU8RGF0ZUZpbHRlckZuPGFueT4+O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogQ2FsbGJhY2sgZnVuY3Rpb24gZm9yIHdoZW4gdGhlIGRhdGUgcGlja2VyIGlzIG9wZW5lZC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgZGF0ZVBpY2tlck9wZW5lZD86IChkYXRlUGlja2VyOiBNYXREYXRlcGlja2VyPGFueT4sIHk/OiBURW50aXR5LCBmPzogRm9ybUdyb3VwLCBjdHg/OiBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+KSA9PiBhbnk7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBFbmRwb2ludCBmb3IgZGF0YSByZXRyaWV2YWwuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGVuZHBvaW50PzogKCh4OiBURW50aXR5LCBmPzogRm9ybUdyb3VwLCBjdHg/OiBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+KSA9PiBhbnkpIHwgc3RyaW5nO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogRnVuY3Rpb24gdG8gZmlsdGVyIGVudW1zLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBlbnVtRmlsdGVyPzogKHk/OiBURW50aXR5LCBmPzogRm9ybUdyb3VwLCBjdHg/OiBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+KSA9PiBhbnk7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBUeXBlIG9mIGVudW0uXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGVudW1UeXBlPzogYW55O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogTWV0YWRhdGEgZm9yIGVudW0gdHlwZXMuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGVudW1NZXRhZGF0YT86IHsgW2tleSBpbiBhbnldOiBFbnVtTWV0YWRhdGEgfTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIEZ1bmN0aW9uIHRvIGRldGVybWluZSBpZiBkYXRhIHNob3VsZCBiZSBmZXRjaGVkLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBmZXRjaENvbmRpdGlvbjogKHg6IFRFbnRpdHksIGY/OiBGb3JtR3JvdXAsIGN0eD86IElHZW5lcmljRm9ybUJhc2VDb21wb25lbnQ8VEVudGl0eT4pID0+IGJvb2xlYW4gPSAoKSA9PiB0cnVlO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogQXJyYXkgb2YgZmllbGQgc2V0cy5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgZmllbGRTZXRzPzogc3RyaW5nW107XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBBbGxvd2VkIGZpbGUgZXh0ZW5zaW9ucy5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgZmlsZUV4dGVuc2lvbnM/OiBzdHJpbmc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBGaWxlIHBhdGguXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGZpbGVQYXRoPzogc3RyaW5nO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogRmxleCBsYXlvdXQgcHJvcGVydHkuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGZsZXg/OiBudW1iZXI7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBJbmRpY2F0ZXMgd2hldGhlciBzZWxlY3Rpb24gaXMgZm9yY2VkLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBmb3JjZVNlbGVjdD86IGJvb2xlYW47XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBHcm91cCBoZWFkZXIuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGdyb3VwSGVhZGVyOiBzdHJpbmcgPSAkbG9jYWxpemVgOkBAZGV0YWlsczpEZXRhaWxzYDtcclxuXHJcbiAgICAvKipcclxuICAgICAqIEdyb3VwIG5hbWUuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGdyb3VwTmFtZT86IHN0cmluZztcclxuXHJcbiAgICAvKipcclxuICAgICAqIEluZGljYXRlcyB3aGV0aGVyIHRoZSBjb2x1bW4gaXMgaGlkZGVuLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBoaWRkZW4/OiBib29sZWFuO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogQ2FsbGJhY2sgZnVuY3Rpb24gdG8gaGlkZSB0aGUgZmllbGQuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGhpZGU/OiAoeDogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gYW55O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogSGludCB0ZXh0IGZvciB0aGUgZmllbGQuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGhpbnQ/OiBzdHJpbmc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBJbmRleCBvZiB0aGUgZmllbGQuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGluZGV4PzogbnVtYmVyO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogVHlwZSBvZiBpbnB1dCAoZS5nLiwgdGV4dCwgbnVtYmVyKS5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgaW5wdXRUeXBlPzogc3RyaW5nO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogSW5kaWNhdGVzIGlmIHRoZSBmaWxlIGlzIHB1YmxpYy5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgaXNQdWJsaWNGaWxlPzogYm9vbGVhbjtcclxuXHJcbiAgICAvKipcclxuICAgICAqIENhbGxiYWNrIGZ1bmN0aW9uIGludm9rZWQgb24gaXRlbSBjaGFuZ2UuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGl0ZW1DaGFuZ2U/OiAoeDogVFByb3BlcnR5LCB5PzogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gYW55O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogQ2FsbGJhY2sgZnVuY3Rpb24gaW52b2tlZCBvbiBpdGVtIHNlbGVjdGlvbi5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgaXRlbVNlbGVjdD86ICh4OiBUUHJvcGVydHksIHk/OiBURW50aXR5LCBmPzogRm9ybUdyb3VwLCBjdHg/OiBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+KSA9PiBhbnk7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBMYWJlbCBmb3IgdGhlIGZpZWxkLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBsYWJlbD86ICgoeDogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gc3RyaW5nKSB8IHN0cmluZztcclxuXHJcbiAgICAvKipcclxuICAgICAqIEZ1bmN0aW9uIHRvIG1hcCB2YWx1ZXMuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIG1hcHBlcj86ICh4OiBhbnlbXSkgPT4gYW55O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogTWF4aW11bSB2YWx1ZS5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgbWF4PzogbnVtYmVyIHwgRGF0ZTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIE1heGltdW0gaGVpZ2h0LlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBtYXhIZWlnaHQ/OiBzdHJpbmc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBNYXhpbXVtIGxlbmd0aC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgbWF4TGVuZ3RoPzogbnVtYmVyO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogTWF4aW11bSB3aWR0aC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgbWF4V2lkdGg/OiBzdHJpbmc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBNaW5pbXVtIHZhbHVlLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBtaW4/OiBudW1iZXIgfCBEYXRlO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogTWluaW11bSBsZW5ndGguXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIG1pbkxlbmd0aD86IG51bWJlcjtcclxuXHJcbiAgICAvKipcclxuICAgICAqIEluZGljYXRlcyBpZiB0aGUgZmllbGQgc3VwcG9ydHMgbXVsdGlsaW5lIGlucHV0LlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBtdWx0aWxpbmU/OiBib29sZWFuO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogSW5kaWNhdGVzIGlmIG11bHRpcGxlIHNlbGVjdGlvbnMgYXJlIGFsbG93ZWQuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIG11bHRpcGxlOiBib29sZWFuID0gZmFsc2U7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBGbGFnIGluZGljYXRpbmcgaWYgb25seSBudW1iZXJzIGFyZSBhbGxvd2VkIGluIHRoZSBpbnB1dCBmaWVsZC5cclxuICAgICAqIEBwcm9wZXJ0eSB7Ym9vbGVhbn0gbnVtYmVyc09ubHkgLSBGbGFnIGluZGljYXRpbmcgaWYgb25seSBudW1iZXJzIGFyZSBhbGxvd2VkIGluIHRoZSBpbnB1dCBmaWVsZC5cclxuICAgICAqL1xyXG4gICAgcHVibGljIG51bWJlcnNPbmx5PzogYm9vbGVhbjtcclxuXHJcbiAgICAvKipcclxuICAgICAqIEluZGljYXRlcyB3aGV0aGVyIHRoZSBmaXJzdCBvcHRpb24gc2hvdWxkIGJlIGF1dG9tYXRpY2FsbHkgc2VsZWN0ZWQuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIHNlbGVjdEZpcnN0OiBib29sZWFuID0gZmFsc2U7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBOYW1lIG9mIHRoZSBmaWVsZC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgbmFtZT86IHN0cmluZztcclxuXHJcbiAgICAvKipcclxuICAgICAqIE9wdGlvbnMgZm9yIHNlbGVjdGlvbi5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgb3B0aW9ucz86ICgoeDogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4geyBpZDogYW55LCBuYW1lOiBzdHJpbmcgfVtdKSB8IHsgaWQ6IGFueSwgbmFtZTogc3RyaW5nIH1bXTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIEZsYWcgdG8gaW5kaWNhdGUgd2hldGhlciBhIGRlZmF1bHQgb3B0aW9uIHNob3VsZCBiZSBpbmNsdWRlZC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgZGVmYXVsdE9wdGlvbj86IGJvb2xlYW4gPSB0cnVlO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogVGVtcGxhdGUgZm9yIG9wdGlvbnMuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIG9wdGlvblRlbXBsYXRlPzogKHg6IFRQcm9wZXJ0eSwgeT86IFRFbnRpdHksIGY/OiBGb3JtR3JvdXAsIGN0eD86IElHZW5lcmljRm9ybUJhc2VDb21wb25lbnQ8VEVudGl0eT4pID0+IGFueTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIFRoZSBwcm9wZXJ0eSBuYW1lIGluIHRoZSBvcHRpb24gb2JqZWN0IGZvciB0aGUgdGV4dCB0byBkaXNwbGF5LlxyXG4gICAgICogVGhpcyBpcyB1c2VkIHRvIGRldGVybWluZSB3aGljaCBwcm9wZXJ0eSBvZiB0aGUgb3B0aW9uIG9iamVjdCB0byBzaG93IGFzIHRoZSBvcHRpb24ncyB0ZXh0LlxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgb3B0aW9uVGV4dFByb3BlcnR5OiBzdHJpbmcgPSAnbmFtZSc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBUaGUgcHJvcGVydHkgbmFtZSBpbiB0aGUgb3B0aW9uIG9iamVjdCBmb3IgdGhlIHZhbHVlIG9mIHRoZSBvcHRpb25zLlxyXG4gICAgICogVGhpcyBpcyB1c2VkIHRvIGlkZW50aWZ5IHRoZSB1bmlxdWUgdmFsdWUgZm9yIGVhY2ggb3B0aW9uLlxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgb3B0aW9uVmFsdWVQcm9wZXJ0eTogc3RyaW5nID0gJ2lkJztcclxuXHJcbiAgICAvKipcclxuICAgICAqIFRoZSBwcm9wZXJ0eSBuYW1lIGluIHRoZSBvcHRpb24gb2JqZWN0IGZvciB0aGUgTWF0ZXJpYWwgaWNvbi5cclxuICAgICAqIFRoaXMgY2FuIGJlIHVzZWQgdG8gZGlzcGxheSBhIE1hdGVyaWFsIGljb24gaW4gdGhlIG9wdGlvbnMgbGlzdC5cclxuICAgICAqL1xyXG4gICAgcHVibGljIG9wdGlvbk1hdEljb25Qcm9wZXJ0eT86IHN0cmluZztcclxuXHJcbiAgICAvKipcclxuICAgICAqIEEgZnVuY3Rpb24gdGhhdCByZXR1cm5zIHRoZSBpY29uIGJhc2VkIG9uIHRoZSBnaXZlbiBwcm9wZXJ0eSwgZW50aXR5LCBmb3JtIGdyb3VwLCBhbmQgY29udGV4dC5cclxuICAgICAqL1xyXG4gICAgcHVibGljIG9wdGlvbkljb24/OiAoeDogVFByb3BlcnR5LCB5PzogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gSWNvbjxURW50aXR5LCBhbnk+O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogVGhlIHByb3BlcnR5IG5hbWUgaW4gdGhlIG9wdGlvbiBvYmplY3QgZm9yIHRoZSBTVkcgaWNvbi5cclxuICAgICAqIFRoaXMgY2FuIGJlIHVzZWQgdG8gZGlzcGxheSBhbiBTVkcgaWNvbiBpbiB0aGUgb3B0aW9ucyBsaXN0LlxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgb3B0aW9uU3ZnSWNvblByb3BlcnR5Pzogc3RyaW5nO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogVGhlIGZvbnQgc2V0IHRvIGJlIHVzZWQgZm9yIHRoZSBpY29ucyBpbiB0aGUgb3B0aW9ucy5cclxuICAgICAqIFRoaXMgc3BlY2lmaWVzIGEgY3VzdG9tIGZvbnQgc2V0IGZvciB0aGUgaWNvbnMgZGlzcGxheWVkIGluIHRoZSBvcHRpb25zIGxpc3QuXHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBvcHRpb25JY29uRm9udFNldD86IHN0cmluZyA9ICdtYXRlcmlhbC1zeW1ib2xzLW91dGxpbmVkJztcclxuXHJcbiAgICAvKipcclxuICAgICAqIFBhcmFtZXRlcnMgZm9yIGRhdGEgcmV0cmlldmFsLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBwYXJhbXM/OiAoKHg6IFRFbnRpdHksIGY/OiBGb3JtR3JvdXAsIGN0eD86IElHZW5lcmljRm9ybUJhc2VDb21wb25lbnQ8VEVudGl0eT4pID0+IGFueSkgfCB7fTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIFJlZ3VsYXIgZXhwcmVzc2lvbiBwYXR0ZXJuIGZvciBpbnB1dCB2YWxpZGF0aW9uLlxyXG4gICAgICogQHByb3BlcnR5IHtSZWdFeHB9IHBhdHRlcm4gLSBSZWd1bGFyIGV4cHJlc3Npb24gcGF0dGVybiBmb3IgaW5wdXQgdmFsaWRhdGlvbi5cclxuICAgICAqL1xyXG4gICAgcHVibGljIHBhdHRlcm4/OiBSZWdFeHAgfCBzdHJpbmc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBQcm9qZWN0aW9uIGZvciBkYXRhIHJldHJpZXZhbC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgcHJvamVjdGlvbjogc3RyaW5nIHwgc3RyaW5nW10gPSAnJztcclxuXHJcbiAgICAvKipcclxuICAgICAqIENhbGxiYWNrIGZ1bmN0aW9uIHRvIGRldGVybWluZSBpZiB0aGUgZmllbGQgaXMgcmVhZG9ubHkuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIHJlYWRvbmx5PzogKHg6IFRFbnRpdHksIGY/OiBGb3JtR3JvdXAsIGN0eD86IElHZW5lcmljRm9ybUJhc2VDb21wb25lbnQ8VEVudGl0eT4pID0+IGJvb2xlYW47XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBDYWxsYmFjayBmdW5jdGlvbiB0byBkZXRlcm1pbmUgaWYgdGhlIGZpZWxkIGlzIHJlcXVpcmVkLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyByZXF1aXJlZD86ICgoeD86IFRFbnRpdHksIGY/OiBGb3JtR3JvdXAsIGN0eD86IElHZW5lcmljRm9ybUJhc2VDb21wb25lbnQ8VEVudGl0eT4pID0+IGJvb2xlYW4gfCBib29sZWFuKTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIFRoZSByb3cgbnVtYmVyIGluZGljYXRpbmcgdGhlIHBvc2l0aW9uIHdoZXJlIHRoZSBmaWVsZCBzaG91bGQgYmUgZGlzcGxheWVkLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyByb3c6IG51bWJlciA9IDE7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBUaGUgbnVtYmVyIG9mIHJvd3MgZm9yIG11bHRpLWxpbmUgaW5wdXQgZmllbGRzIChlLmcuLCB0ZXh0IGFyZWEpLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyByb3dzPzogbnVtYmVyO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogRmllbGQgdXNlZCBmb3Igc2VhcmNoaW5nLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBzZWFyY2hGaWVsZDogc3RyaW5nID0gJ3NlYXJjaCc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBDYWxsYmFjayBmdW5jdGlvbiBpbnZva2VkIG9uIHNlbGVjdGlvbi5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgc2VsZWN0PzogKHg6IFRFbnRpdHksIGY/OiBGb3JtR3JvdXAsIGN0eD86IElHZW5lcmljRm9ybUJhc2VDb21wb25lbnQ8VEVudGl0eT4pID0+IGFueTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIEFycmF5IG9mIHN1ZmZpeCBidXR0b25zLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBzdWZmaXhCdXR0b25zOiBTdWZmaXhCdXR0b248VFByb3BlcnR5LCBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+PltdID0gW107XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBDU1MgY2xhc3MgZm9yIHRyaWdnZXJzLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyB0cmlnZ2VyQ3NzQ2xhc3M/OiBzdHJpbmc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBDYWxsYmFjayBmdW5jdGlvbiB0byBtYXAgdHJpZ2dlciB2YWx1ZXMuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIHRyaWdnZXJNYXBwZXI/OiAoeDogVFByb3BlcnR5LCB5PzogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gYW55O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogTW9kZSBvZiB0aGUgdHJpZ2dlciAoZS5nLiwgY2hpcCkuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIHRyaWdnZXJNb2RlPzogJ2NoaXAnO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogVGVtcGxhdGUgZm9yIHRoZSB0cmlnZ2VyLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyB0cmlnZ2VyVGVtcGxhdGU/OiAoeDogVFByb3BlcnR5W10gfCBUUHJvcGVydHksIHk/OiBURW50aXR5LCBmPzogRm9ybUdyb3VwLCBjdHg/OiBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+KSA9PiBhbnk7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBGdW5jdGlvbiB0byBkZXRlcm1pbmUgdGhlIHR5cGUgb2YgdGhlIGZpZWxkLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyB0eXBlPzogKCh4OiBURW50aXR5LCBmPzogRm9ybUdyb3VwLCBjdHg/OiBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+KSA9PiBGb3JtRmllbGRUeXBlKSB8IEZvcm1GaWVsZFR5cGU7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBJbmRpY2F0ZXMgd2hldGhlciB0aGUgZmllbGQgaXMgd3JhcHBlZC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgd3JhcHBlZDogYm9vbGVhbiA9IHRydWU7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBDb25zdHJ1Y3RvciBmb3IgdGhlIEZvcm1GaWVsZERlZmluaXRpb24gY2xhc3MuXHJcbiAgICAgKiBAY29uc3RydWN0b3JcclxuICAgICAqIEBwYXJhbSBpbml0IC0gUGFydGlhbCBpbml0aWFsaXphdGlvbiBkYXRhIGZvciB0aGUgRm9ybUZpZWxkRGVmaW5pdGlvbi5cclxuICAgICAqL1xyXG4gICAgcHVibGljIGNvbnN0cnVjdG9yKGluaXQ/OiBQYXJ0aWFsPEZvcm1GaWVsZERlZmluaXRpb248VEVudGl0eT4+KSB7XHJcbiAgICAgICAgT2JqZWN0LmFzc2lnbih0aGlzLCBpbml0KTtcclxuICAgIH1cclxufSJdfQ==
375
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZm9ybS1maWVsZC1kZWZpbml0aW9uLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY2RrL3NyYy9saWIvZm9ybXMvbW9kZWxzL2Zvcm0tZmllbGQtZGVmaW5pdGlvbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFVQSxNQUFNLE9BQU8sbUJBQW1CO0lBQzVCOzs7T0FHRztJQUNJLG9CQUFvQixHQUFXLEVBQUUsQ0FBQztJQUV6Qzs7O09BR0c7SUFDSSxvQkFBb0IsQ0FBK0Y7SUFFMUg7OztPQUdHO0lBQ0ksZ0JBQWdCLEdBQVcsTUFBTSxDQUFDO0lBRXpDOzs7T0FHRztJQUNJLE1BQU0sQ0FBK0Y7SUFFNUc7OztPQUdHO0lBQ0ksWUFBWSxDQUErRjtJQUVsSDs7O09BR0c7SUFDSSxRQUFRLEdBQVcsTUFBTSxDQUFDO0lBRWpDOzs7T0FHRztJQUNJLFNBQVMsR0FBa0MsUUFBUSxDQUFDO0lBRTNEOzs7T0FHRztJQUNJLFNBQVMsQ0FBYTtJQUU3Qjs7O09BR0c7SUFDSSxLQUFLLENBQWdGO0lBRTVGOzs7T0FHRztJQUNJLFdBQVcsQ0FBNkM7SUFFL0Q7OztPQUdHO0lBQ0ksUUFBUSxDQUFVO0lBRXpCOzs7T0FHRztJQUNJLFdBQVcsR0FBWSxLQUFLLENBQUM7SUFFcEM7OztPQUdHO0lBQ0ksVUFBVSxHQUFzQixDQUFDLElBQVMsRUFBRSxFQUFFLENBQUMsSUFBSSxDQUFDO0lBRTNEOzs7T0FHRztJQUNJLGVBQWUsQ0FBMEg7SUFFaEo7OztPQUdHO0lBQ0ksZ0JBQWdCLENBQWlIO0lBRXhJOzs7T0FHRztJQUNJLFFBQVEsQ0FBMkY7SUFFMUc7OztPQUdHO0lBQ0ksVUFBVSxDQUFpRjtJQUVsRzs7O09BR0c7SUFDSSxRQUFRLENBQU87SUFFdEI7OztPQUdHO0lBQ0ksWUFBWSxDQUFrQztJQUVyRDs7O09BR0c7SUFDSSxjQUFjLEdBQXFGLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQztJQUVySDs7O09BR0c7SUFDSSxTQUFTLENBQVk7SUFFNUI7OztPQUdHO0lBQ0ksY0FBYyxDQUFVO0lBRS9COzs7T0FHRztJQUNJLFFBQVEsQ0FBVTtJQUV6Qjs7O09BR0c7SUFDSSxJQUFJLENBQVU7SUFFckI7OztPQUdHO0lBQ0ksV0FBVyxDQUFXO0lBRTdCOzs7T0FHRztJQUNJLFdBQVcsR0FBVyxTQUFTLENBQUEsb0JBQW9CLENBQUM7SUFFM0Q7OztPQUdHO0lBQ0ksU0FBUyxDQUFVO0lBRTFCOzs7T0FHRztJQUNJLE1BQU0sQ0FBVztJQUV4Qjs7O09BR0c7SUFDSSxJQUFJLENBQWdGO0lBRTNGOzs7T0FHRztJQUNJLElBQUksQ0FBVTtJQUVyQjs7O09BR0c7SUFDSSxLQUFLLENBQVU7SUFFdEI7OztPQUdHO0lBQ0ksU0FBUyxDQUFVO0lBRTFCOzs7T0FHRztJQUNJLFlBQVksQ0FBVztJQUU5Qjs7O09BR0c7SUFDSSxVQUFVLENBQStGO0lBRWhIOzs7T0FHRztJQUNJLFVBQVUsQ0FBK0Y7SUFFaEg7OztPQUdHO0lBQ0ksS0FBSyxDQUE4RjtJQUUxRzs7O09BR0c7SUFDSSxNQUFNLENBQXFCO0lBRWxDOzs7T0FHRztJQUNJLEdBQUcsQ0FBaUI7SUFFM0I7OztPQUdHO0lBQ0ksU0FBUyxDQUFVO0lBRTFCOzs7T0FHRztJQUNJLFNBQVMsQ0FBVTtJQUUxQjs7O09BR0c7SUFDSSxRQUFRLENBQVU7SUFFekI7OztPQUdHO0lBQ0ksR0FBRyxDQUFpQjtJQUUzQjs7O09BR0c7SUFDSSxTQUFTLENBQVU7SUFFMUI7OztPQUdHO0lBQ0ksU0FBUyxDQUFXO0lBRTNCOzs7T0FHRztJQUNJLFFBQVEsR0FBWSxLQUFLLENBQUM7SUFFakM7OztPQUdHO0lBQ0ksV0FBVyxDQUFXO0lBRTdCOzs7T0FHRztJQUNJLFdBQVcsR0FBWSxLQUFLLENBQUM7SUFFcEM7OztPQUdHO0lBQ0ksSUFBSSxDQUFVO0lBRXJCOzs7T0FHRztJQUNJLE9BQU8sQ0FBd0k7SUFFdEo7OztPQUdHO0lBQ0ksYUFBYSxHQUFhLElBQUksQ0FBQztJQUV0Qzs7O09BR0c7SUFDSSxjQUFjLENBQStGO0lBRXBIOzs7T0FHRztJQUNJLGtCQUFrQixHQUFXLE1BQU0sQ0FBQztJQUUzQzs7O09BR0c7SUFDSSxtQkFBbUIsR0FBVyxJQUFJLENBQUM7SUFFMUM7OztPQUdHO0lBQ0kscUJBQXFCLENBQVU7SUFFdEM7O09BRUc7SUFDSSxVQUFVLENBQThHO0lBRS9IOzs7T0FHRztJQUNJLHFCQUFxQixDQUFVO0lBRXRDOzs7T0FHRztJQUNJLGlCQUFpQixHQUFZLDJCQUEyQixDQUFDO0lBRWhFOzs7T0FHRztJQUNJLE1BQU0sQ0FBdUY7SUFFcEc7OztPQUdHO0lBQ0ksT0FBTyxDQUFtQjtJQUVqQzs7O09BR0c7SUFDSSxVQUFVLEdBQXNCLEVBQUUsQ0FBQztJQUUxQzs7O09BR0c7SUFDSSxRQUFRLENBQW9GO0lBRW5HOzs7T0FHRztJQUNJLFFBQVEsQ0FBaUc7SUFFaEg7OztPQUdHO0lBQ0ksR0FBRyxHQUFXLENBQUMsQ0FBQztJQUV2Qjs7O09BR0c7SUFDSSxJQUFJLENBQVU7SUFFckI7OztPQUdHO0lBQ0ksV0FBVyxHQUFXLFFBQVEsQ0FBQztJQUV0Qzs7O09BR0c7SUFDSSxNQUFNLENBQWdGO0lBRTdGOzs7T0FHRztJQUNJLGFBQWEsR0FBa0UsRUFBRSxDQUFDO0lBRXpGOzs7T0FHRztJQUNJLGVBQWUsQ0FBVTtJQUVoQzs7O09BR0c7SUFDSSxhQUFhLENBQStGO0lBRW5IOzs7T0FHRztJQUNJLFdBQVcsQ0FBVTtJQUU1Qjs7O09BR0c7SUFDSSxlQUFlLENBQTZHO0lBRW5JOzs7T0FHRztJQUNJLElBQUksQ0FBNEc7SUFFdkg7OztPQUdHO0lBQ0ksT0FBTyxHQUFZLElBQUksQ0FBQztJQUUvQjs7OztPQUlHO0lBQ0gsWUFBbUIsSUFBNEM7UUFDM0QsTUFBTSxDQUFDLE1BQU0sQ0FBQyxJQUFJLEVBQUUsSUFBSSxDQUFDLENBQUM7SUFDOUIsQ0FBQztDQUNKIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgVHlwZSB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XHJcbmltcG9ydCB7IEZvcm1Hcm91cCB9IGZyb20gXCJAYW5ndWxhci9mb3Jtc1wiO1xyXG5pbXBvcnQgeyBEYXRlRmlsdGVyRm4sIE1hdERhdGVwaWNrZXIgfSBmcm9tIFwiQGFuZ3VsYXIvbWF0ZXJpYWwvZGF0ZXBpY2tlclwiO1xyXG5pbXBvcnQgeyBPYnNlcnZhYmxlIH0gZnJvbSBcInJ4anNcIjtcclxuaW1wb3J0IHsgSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudCB9IGZyb20gXCIuLi8uLi9iYXNlL2ludGVyZmFjZXMvaWdlbmVyaWMtZm9ybS1iYXNlXCI7XHJcbmltcG9ydCB7IEVudW1NZXRhZGF0YSB9IGZyb20gXCIuLi8uLi9jb21tb24vbW9kZWxzL2VudW0tbWV0YWRhdGFcIjtcclxuaW1wb3J0IHsgSWNvbiB9IGZyb20gXCIuLi8uLi9jb21tb24vbW9kZWxzL2ljb25cIjtcclxuaW1wb3J0IHsgU3VmZml4QnV0dG9uIH0gZnJvbSBcIi4uLy4uL2NvbW1vbi9tb2RlbHMvc3VmZml4LWJ1dHRvblwiO1xyXG5pbXBvcnQgeyBGb3JtRmllbGRUeXBlIH0gZnJvbSBcIi4uL2VudW1zL2Zvcm0tZmllbGQtdHlwZVwiO1xyXG5cclxuZXhwb3J0IGNsYXNzIEZvcm1GaWVsZERlZmluaXRpb248VEVudGl0eSA9IGFueSwgVFByb3BlcnR5ID0gYW55PiB7XHJcbiAgICAvKipcclxuICAgICAqIENTUyBjbGFzcyBmb3IgYXV0b2NvbXBsZXRlIGZ1bmN0aW9uYWxpdHkuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGF1dG9jb21wbGV0ZUNzc0NsYXNzOiBzdHJpbmcgPSAnJztcclxuXHJcbiAgICAvKipcclxuICAgICAqIFRlbXBsYXRlIGZvciBhdXRvY29tcGxldGUgZnVuY3Rpb25hbGl0eS5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgYXV0b2NvbXBsZXRlVGVtcGxhdGU/OiAoeDogVFByb3BlcnR5LCB5PzogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gYW55O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogVGV4dCB0byBkaXNwbGF5IGluIGF1dG9jb21wbGV0ZS5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgYXV0b2NvbXBsZXRlVGV4dDogc3RyaW5nID0gJ25hbWUnO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogQ2FsbGJhY2sgZnVuY3Rpb24gaW52b2tlZCBvbiBjaGFuZ2UuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGNoYW5nZT86ICh4OiBUUHJvcGVydHksIHk/OiBURW50aXR5LCBmPzogRm9ybUdyb3VwLCBjdHg/OiBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+KSA9PiBhbnk7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBUZW1wbGF0ZSBmb3IgY2hpcCBmdW5jdGlvbmFsaXR5LlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBjaGlwVGVtcGxhdGU/OiAoeDogVFByb3BlcnR5LCB5PzogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gYW55O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogVGV4dCB0byBkaXNwbGF5IGluIGNoaXAuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGNoaXBUZXh0OiBzdHJpbmcgPSAnbmFtZSc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBUaGVtZSBjb2xvciBwYWxldHRlIGZvciB0aGUgY2hpcC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgY2hpcENvbG9yOiAncHJpbWFyeScgfCAnYWNjZW50JyB8ICd3YXJuJyA9ICdhY2NlbnQnO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogVHlwZSBvZiBjbGFzcyB0byBiZSBpbnN0YW50aWF0ZWQuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGNsYXNzVHlwZT86IFR5cGU8YW55PjtcclxuXHJcbiAgICAvKipcclxuICAgICAqIENhbGxiYWNrIGZ1bmN0aW9uIGludm9rZWQgb24gY2xlYXJpbmcuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGNsZWFyPzogKHg6IFRFbnRpdHksIGY/OiBGb3JtR3JvdXAsIGN0eD86IElHZW5lcmljRm9ybUJhc2VDb21wb25lbnQ8VEVudGl0eT4pID0+IGFueTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIEZ1bmN0aW9uIHRvIGNvbXBhcmUgdHdvIHZhbHVlcy5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgY29tcGFyZVdpdGg/OiAobzE6IFRQcm9wZXJ0eSwgbzI6IFRQcm9wZXJ0eSkgPT4gYm9vbGVhbjtcclxuXHJcbiAgICAvKipcclxuICAgICAqIENTUyBjbGFzcyBmb3Igc3R5bGluZy5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgY3NzQ2xhc3M/OiBzdHJpbmc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBJbmRpY2F0ZXMgaWYgdGhlIHZhbHVlIGlzIGN1c3RvbS5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgY3VzdG9tVmFsdWU6IGJvb2xlYW4gPSBmYWxzZTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIEZ1bmN0aW9uIHRvIGZpbHRlciBkYXRlcy5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgZGF0ZUZpbHRlcjogRGF0ZUZpbHRlckZuPGFueT4gPSAoZGF0ZTogYW55KSA9PiB0cnVlO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogQXN5bmNocm9ub3VzIGZ1bmN0aW9uIHRvIGZpbHRlciBkYXRlcy5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgZGF0ZUZpbHRlckFzeW5jPzogKGQ6IERhdGUgfCBhbnksIHk/OiBURW50aXR5LCBmPzogRm9ybUdyb3VwLCBjdHg/OiBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+KSA9PiBPYnNlcnZhYmxlPERhdGVGaWx0ZXJGbjxhbnk+PjtcclxuXHJcbiAgICAvKipcclxuICAgICAqIENhbGxiYWNrIGZ1bmN0aW9uIGZvciB3aGVuIHRoZSBkYXRlIHBpY2tlciBpcyBvcGVuZWQuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGRhdGVQaWNrZXJPcGVuZWQ/OiAoZGF0ZVBpY2tlcjogTWF0RGF0ZXBpY2tlcjxhbnk+LCB5PzogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gYW55O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogRW5kcG9pbnQgZm9yIGRhdGEgcmV0cmlldmFsLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBlbmRwb2ludD86ICgoeDogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gYW55KSB8IHN0cmluZztcclxuXHJcbiAgICAvKipcclxuICAgICAqIEZ1bmN0aW9uIHRvIGZpbHRlciBlbnVtcy5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgZW51bUZpbHRlcj86ICh5PzogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gYW55O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogVHlwZSBvZiBlbnVtLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBlbnVtVHlwZT86IGFueTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIE1ldGFkYXRhIGZvciBlbnVtIHR5cGVzLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBlbnVtTWV0YWRhdGE/OiB7IFtrZXkgaW4gYW55XTogRW51bU1ldGFkYXRhIH07XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBGdW5jdGlvbiB0byBkZXRlcm1pbmUgaWYgZGF0YSBzaG91bGQgYmUgZmV0Y2hlZC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgZmV0Y2hDb25kaXRpb246ICh4OiBURW50aXR5LCBmPzogRm9ybUdyb3VwLCBjdHg/OiBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+KSA9PiBib29sZWFuID0gKCkgPT4gdHJ1ZTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIEFycmF5IG9mIGZpZWxkIHNldHMuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGZpZWxkU2V0cz86IHN0cmluZ1tdO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogQWxsb3dlZCBmaWxlIGV4dGVuc2lvbnMuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGZpbGVFeHRlbnNpb25zPzogc3RyaW5nO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogRmlsZSBwYXRoLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBmaWxlUGF0aD86IHN0cmluZztcclxuXHJcbiAgICAvKipcclxuICAgICAqIEZsZXggbGF5b3V0IHByb3BlcnR5LlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBmbGV4PzogbnVtYmVyO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogSW5kaWNhdGVzIHdoZXRoZXIgc2VsZWN0aW9uIGlzIGZvcmNlZC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgZm9yY2VTZWxlY3Q/OiBib29sZWFuO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogR3JvdXAgaGVhZGVyLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBncm91cEhlYWRlcjogc3RyaW5nID0gJGxvY2FsaXplYDpAQGRldGFpbHM6RGV0YWlsc2A7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBHcm91cCBuYW1lLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBncm91cE5hbWU/OiBzdHJpbmc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBJbmRpY2F0ZXMgd2hldGhlciB0aGUgY29sdW1uIGlzIGhpZGRlbi5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgaGlkZGVuPzogYm9vbGVhbjtcclxuXHJcbiAgICAvKipcclxuICAgICAqIENhbGxiYWNrIGZ1bmN0aW9uIHRvIGhpZGUgdGhlIGZpZWxkLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBoaWRlPzogKHg6IFRFbnRpdHksIGY/OiBGb3JtR3JvdXAsIGN0eD86IElHZW5lcmljRm9ybUJhc2VDb21wb25lbnQ8VEVudGl0eT4pID0+IGFueTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIEhpbnQgdGV4dCBmb3IgdGhlIGZpZWxkLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBoaW50Pzogc3RyaW5nO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogSW5kZXggb2YgdGhlIGZpZWxkLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBpbmRleD86IG51bWJlcjtcclxuXHJcbiAgICAvKipcclxuICAgICAqIFR5cGUgb2YgaW5wdXQgKGUuZy4sIHRleHQsIG51bWJlcikuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGlucHV0VHlwZT86IHN0cmluZztcclxuXHJcbiAgICAvKipcclxuICAgICAqIEluZGljYXRlcyBpZiB0aGUgZmlsZSBpcyBwdWJsaWMuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGlzUHVibGljRmlsZT86IGJvb2xlYW47XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBDYWxsYmFjayBmdW5jdGlvbiBpbnZva2VkIG9uIGl0ZW0gY2hhbmdlLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBpdGVtQ2hhbmdlPzogKHg6IFRQcm9wZXJ0eSwgeT86IFRFbnRpdHksIGY/OiBGb3JtR3JvdXAsIGN0eD86IElHZW5lcmljRm9ybUJhc2VDb21wb25lbnQ8VEVudGl0eT4pID0+IGFueTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIENhbGxiYWNrIGZ1bmN0aW9uIGludm9rZWQgb24gaXRlbSBzZWxlY3Rpb24uXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGl0ZW1TZWxlY3Q/OiAoeDogVFByb3BlcnR5LCB5PzogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gYW55O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogTGFiZWwgZm9yIHRoZSBmaWVsZC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgbGFiZWw/OiAoKHg6IFRFbnRpdHksIGY/OiBGb3JtR3JvdXAsIGN0eD86IElHZW5lcmljRm9ybUJhc2VDb21wb25lbnQ8VEVudGl0eT4pID0+IHN0cmluZykgfCBzdHJpbmc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBGdW5jdGlvbiB0byBtYXAgdmFsdWVzLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBtYXBwZXI/OiAoeDogYW55W10pID0+IGFueTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIE1heGltdW0gdmFsdWUuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIG1heD86IG51bWJlciB8IERhdGU7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBNYXhpbXVtIGhlaWdodC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgbWF4SGVpZ2h0Pzogc3RyaW5nO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogTWF4aW11bSBsZW5ndGguXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIG1heExlbmd0aD86IG51bWJlcjtcclxuXHJcbiAgICAvKipcclxuICAgICAqIE1heGltdW0gd2lkdGguXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIG1heFdpZHRoPzogc3RyaW5nO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogTWluaW11bSB2YWx1ZS5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgbWluPzogbnVtYmVyIHwgRGF0ZTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIE1pbmltdW0gbGVuZ3RoLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBtaW5MZW5ndGg/OiBudW1iZXI7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBJbmRpY2F0ZXMgaWYgdGhlIGZpZWxkIHN1cHBvcnRzIG11bHRpbGluZSBpbnB1dC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgbXVsdGlsaW5lPzogYm9vbGVhbjtcclxuXHJcbiAgICAvKipcclxuICAgICAqIEluZGljYXRlcyBpZiBtdWx0aXBsZSBzZWxlY3Rpb25zIGFyZSBhbGxvd2VkLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBtdWx0aXBsZTogYm9vbGVhbiA9IGZhbHNlO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogRmxhZyBpbmRpY2F0aW5nIGlmIG9ubHkgbnVtYmVycyBhcmUgYWxsb3dlZCBpbiB0aGUgaW5wdXQgZmllbGQuXHJcbiAgICAgKiBAcHJvcGVydHkge2Jvb2xlYW59IG51bWJlcnNPbmx5IC0gRmxhZyBpbmRpY2F0aW5nIGlmIG9ubHkgbnVtYmVycyBhcmUgYWxsb3dlZCBpbiB0aGUgaW5wdXQgZmllbGQuXHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBudW1iZXJzT25seT86IGJvb2xlYW47XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBJbmRpY2F0ZXMgd2hldGhlciB0aGUgZmlyc3Qgb3B0aW9uIHNob3VsZCBiZSBhdXRvbWF0aWNhbGx5IHNlbGVjdGVkLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBzZWxlY3RGaXJzdDogYm9vbGVhbiA9IGZhbHNlO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogTmFtZSBvZiB0aGUgZmllbGQuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIG5hbWU/OiBzdHJpbmc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBPcHRpb25zIGZvciBzZWxlY3Rpb24uXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIG9wdGlvbnM/OiAoKHg6IFRFbnRpdHksIGY/OiBGb3JtR3JvdXAsIGN0eD86IElHZW5lcmljRm9ybUJhc2VDb21wb25lbnQ8VEVudGl0eT4pID0+IHsgaWQ6IGFueSwgbmFtZTogc3RyaW5nIH1bXSkgfCB7IGlkOiBhbnksIG5hbWU6IHN0cmluZyB9W107XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBGbGFnIHRvIGluZGljYXRlIHdoZXRoZXIgYSBkZWZhdWx0IG9wdGlvbiBzaG91bGQgYmUgaW5jbHVkZWQuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIGRlZmF1bHRPcHRpb24/OiBib29sZWFuID0gdHJ1ZTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIFRlbXBsYXRlIGZvciBvcHRpb25zLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBvcHRpb25UZW1wbGF0ZT86ICh4OiBUUHJvcGVydHksIHk/OiBURW50aXR5LCBmPzogRm9ybUdyb3VwLCBjdHg/OiBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+KSA9PiBhbnk7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBUaGUgcHJvcGVydHkgbmFtZSBpbiB0aGUgb3B0aW9uIG9iamVjdCBmb3IgdGhlIHRleHQgdG8gZGlzcGxheS5cclxuICAgICAqIFRoaXMgaXMgdXNlZCB0byBkZXRlcm1pbmUgd2hpY2ggcHJvcGVydHkgb2YgdGhlIG9wdGlvbiBvYmplY3QgdG8gc2hvdyBhcyB0aGUgb3B0aW9uJ3MgdGV4dC5cclxuICAgICAqL1xyXG4gICAgcHVibGljIG9wdGlvblRleHRQcm9wZXJ0eTogc3RyaW5nID0gJ25hbWUnO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogVGhlIHByb3BlcnR5IG5hbWUgaW4gdGhlIG9wdGlvbiBvYmplY3QgZm9yIHRoZSB2YWx1ZSBvZiB0aGUgb3B0aW9ucy5cclxuICAgICAqIFRoaXMgaXMgdXNlZCB0byBpZGVudGlmeSB0aGUgdW5pcXVlIHZhbHVlIGZvciBlYWNoIG9wdGlvbi5cclxuICAgICAqL1xyXG4gICAgcHVibGljIG9wdGlvblZhbHVlUHJvcGVydHk6IHN0cmluZyA9ICdpZCc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBUaGUgcHJvcGVydHkgbmFtZSBpbiB0aGUgb3B0aW9uIG9iamVjdCBmb3IgdGhlIE1hdGVyaWFsIGljb24uXHJcbiAgICAgKiBUaGlzIGNhbiBiZSB1c2VkIHRvIGRpc3BsYXkgYSBNYXRlcmlhbCBpY29uIGluIHRoZSBvcHRpb25zIGxpc3QuXHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBvcHRpb25NYXRJY29uUHJvcGVydHk/OiBzdHJpbmc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBBIGZ1bmN0aW9uIHRoYXQgcmV0dXJucyB0aGUgaWNvbiBiYXNlZCBvbiB0aGUgZ2l2ZW4gcHJvcGVydHksIGVudGl0eSwgZm9ybSBncm91cCwgYW5kIGNvbnRleHQuXHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBvcHRpb25JY29uPzogKHg6IFRQcm9wZXJ0eSwgeT86IFRFbnRpdHksIGY/OiBGb3JtR3JvdXAsIGN0eD86IElHZW5lcmljRm9ybUJhc2VDb21wb25lbnQ8VEVudGl0eT4pID0+IEljb248VEVudGl0eSwgYW55PjtcclxuXHJcbiAgICAvKipcclxuICAgICAqIFRoZSBwcm9wZXJ0eSBuYW1lIGluIHRoZSBvcHRpb24gb2JqZWN0IGZvciB0aGUgU1ZHIGljb24uXHJcbiAgICAgKiBUaGlzIGNhbiBiZSB1c2VkIHRvIGRpc3BsYXkgYW4gU1ZHIGljb24gaW4gdGhlIG9wdGlvbnMgbGlzdC5cclxuICAgICAqL1xyXG4gICAgcHVibGljIG9wdGlvblN2Z0ljb25Qcm9wZXJ0eT86IHN0cmluZztcclxuXHJcbiAgICAvKipcclxuICAgICAqIFRoZSBmb250IHNldCB0byBiZSB1c2VkIGZvciB0aGUgaWNvbnMgaW4gdGhlIG9wdGlvbnMuXHJcbiAgICAgKiBUaGlzIHNwZWNpZmllcyBhIGN1c3RvbSBmb250IHNldCBmb3IgdGhlIGljb25zIGRpc3BsYXllZCBpbiB0aGUgb3B0aW9ucyBsaXN0LlxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgb3B0aW9uSWNvbkZvbnRTZXQ/OiBzdHJpbmcgPSAnbWF0ZXJpYWwtc3ltYm9scy1vdXRsaW5lZCc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBQYXJhbWV0ZXJzIGZvciBkYXRhIHJldHJpZXZhbC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgcGFyYW1zPzogKCh4OiBURW50aXR5LCBmPzogRm9ybUdyb3VwLCBjdHg/OiBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+KSA9PiBhbnkpIHwge307XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBSZWd1bGFyIGV4cHJlc3Npb24gcGF0dGVybiBmb3IgaW5wdXQgdmFsaWRhdGlvbi5cclxuICAgICAqIEBwcm9wZXJ0eSB7UmVnRXhwfSBwYXR0ZXJuIC0gUmVndWxhciBleHByZXNzaW9uIHBhdHRlcm4gZm9yIGlucHV0IHZhbGlkYXRpb24uXHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBwYXR0ZXJuPzogUmVnRXhwIHwgc3RyaW5nO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogUHJvamVjdGlvbiBmb3IgZGF0YSByZXRyaWV2YWwuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIHByb2plY3Rpb246IHN0cmluZyB8IHN0cmluZ1tdID0gJyc7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBDYWxsYmFjayBmdW5jdGlvbiB0byBkZXRlcm1pbmUgaWYgdGhlIGZpZWxkIGlzIHJlYWRvbmx5LlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyByZWFkb25seT86ICh4OiBURW50aXR5LCBmPzogRm9ybUdyb3VwLCBjdHg/OiBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+KSA9PiBib29sZWFuO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogQ2FsbGJhY2sgZnVuY3Rpb24gdG8gZGV0ZXJtaW5lIGlmIHRoZSBmaWVsZCBpcyByZXF1aXJlZC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgcmVxdWlyZWQ/OiAoKHg/OiBURW50aXR5LCBmPzogRm9ybUdyb3VwLCBjdHg/OiBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+KSA9PiBib29sZWFuIHwgYm9vbGVhbik7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBUaGUgcm93IG51bWJlciBpbmRpY2F0aW5nIHRoZSBwb3NpdGlvbiB3aGVyZSB0aGUgZmllbGQgc2hvdWxkIGJlIGRpc3BsYXllZC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgcm93OiBudW1iZXIgPSAxO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogVGhlIG51bWJlciBvZiByb3dzIGZvciBtdWx0aS1saW5lIGlucHV0IGZpZWxkcyAoZS5nLiwgdGV4dCBhcmVhKS5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgcm93cz86IG51bWJlcjtcclxuXHJcbiAgICAvKipcclxuICAgICAqIEZpZWxkIHVzZWQgZm9yIHNlYXJjaGluZy5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgc2VhcmNoRmllbGQ6IHN0cmluZyA9ICdzZWFyY2gnO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogQ2FsbGJhY2sgZnVuY3Rpb24gaW52b2tlZCBvbiBzZWxlY3Rpb24uXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIHNlbGVjdD86ICh4OiBURW50aXR5LCBmPzogRm9ybUdyb3VwLCBjdHg/OiBJR2VuZXJpY0Zvcm1CYXNlQ29tcG9uZW50PFRFbnRpdHk+KSA9PiBhbnk7XHJcblxyXG4gICAgLyoqXHJcbiAgICAgKiBBcnJheSBvZiBzdWZmaXggYnV0dG9ucy5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgc3VmZml4QnV0dG9uczogU3VmZml4QnV0dG9uPFRQcm9wZXJ0eSwgSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5Pj5bXSA9IFtdO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogQ1NTIGNsYXNzIGZvciB0cmlnZ2Vycy5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgdHJpZ2dlckNzc0NsYXNzPzogc3RyaW5nO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogQ2FsbGJhY2sgZnVuY3Rpb24gdG8gbWFwIHRyaWdnZXIgdmFsdWVzLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyB0cmlnZ2VyTWFwcGVyPzogKHg6IFRQcm9wZXJ0eSwgeT86IFRFbnRpdHksIGY/OiBGb3JtR3JvdXAsIGN0eD86IElHZW5lcmljRm9ybUJhc2VDb21wb25lbnQ8VEVudGl0eT4pID0+IGFueTtcclxuXHJcbiAgICAvKipcclxuICAgICAqIE1vZGUgb2YgdGhlIHRyaWdnZXIgKGUuZy4sIGNoaXApLlxyXG4gICAgICogQHByb3BlcnR5XHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyB0cmlnZ2VyTW9kZT86ICdjaGlwJztcclxuXHJcbiAgICAvKipcclxuICAgICAqIFRlbXBsYXRlIGZvciB0aGUgdHJpZ2dlci5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgdHJpZ2dlclRlbXBsYXRlPzogKHg6IFRQcm9wZXJ0eVtdIHwgVFByb3BlcnR5LCB5PzogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gYW55O1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogRnVuY3Rpb24gdG8gZGV0ZXJtaW5lIHRoZSB0eXBlIG9mIHRoZSBmaWVsZC5cclxuICAgICAqIEBwcm9wZXJ0eVxyXG4gICAgICovXHJcbiAgICBwdWJsaWMgdHlwZT86ICgoeDogVEVudGl0eSwgZj86IEZvcm1Hcm91cCwgY3R4PzogSUdlbmVyaWNGb3JtQmFzZUNvbXBvbmVudDxURW50aXR5PikgPT4gRm9ybUZpZWxkVHlwZSkgfCBGb3JtRmllbGRUeXBlO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogSW5kaWNhdGVzIHdoZXRoZXIgdGhlIGZpZWxkIGlzIHdyYXBwZWQuXHJcbiAgICAgKiBAcHJvcGVydHlcclxuICAgICAqL1xyXG4gICAgcHVibGljIHdyYXBwZWQ6IGJvb2xlYW4gPSB0cnVlO1xyXG5cclxuICAgIC8qKlxyXG4gICAgICogQ29uc3RydWN0b3IgZm9yIHRoZSBGb3JtRmllbGREZWZpbml0aW9uIGNsYXNzLlxyXG4gICAgICogQGNvbnN0cnVjdG9yXHJcbiAgICAgKiBAcGFyYW0gaW5pdCAtIFBhcnRpYWwgaW5pdGlhbGl6YXRpb24gZGF0YSBmb3IgdGhlIEZvcm1GaWVsZERlZmluaXRpb24uXHJcbiAgICAgKi9cclxuICAgIHB1YmxpYyBjb25zdHJ1Y3Rvcihpbml0PzogUGFydGlhbDxGb3JtRmllbGREZWZpbml0aW9uPFRFbnRpdHk+Pikge1xyXG4gICAgICAgIE9iamVjdC5hc3NpZ24odGhpcywgaW5pdCk7XHJcbiAgICB9XHJcbn0iXX0=
@@ -8619,6 +8619,11 @@ class FormFieldDefinition {
8619
8619
  * @property
8620
8620
  */
8621
8621
  chipText = 'name';
8622
+ /**
8623
+ * Theme color palette for the chip.
8624
+ * @property
8625
+ */
8626
+ chipColor = 'accent';
8622
8627
  /**
8623
8628
  * Type of class to be instantiated.
8624
8629
  * @property
@@ -23869,11 +23874,11 @@ class VdGenericFormComponent {
23869
23874
  return func(option, this.formValue, this.formGroup, this.context);
23870
23875
  }
23871
23876
  /** @nocollapse */ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: VdGenericFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
23872
- /** @nocollapse */ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.6", type: VdGenericFormComponent, selector: "vd-generic-form", inputs: { formGroup: "formGroup", classType: "classType", formDefinition: "formDefinition", fieldGroups: "fieldGroups", groupName: "groupName", fieldSets: "fieldSets", context: "context", debugValue: "debugValue", readonly: "readonly", separatorKeysCodes: "separatorKeysCodes" }, queries: [{ propertyName: "editorTemplate", first: true, predicate: VdEditorDirective, descendants: true }, { propertyName: "codeTemplate", first: true, predicate: VdCodeDirective, descendants: true }, { propertyName: "fileTemplate", first: true, predicate: VdFileDirective, descendants: true }, { propertyName: "customTemplate", first: true, predicate: VdCustomDirective, descendants: true }, { propertyName: "bottom", first: true, predicate: ["bottom"], descendants: true }, { propertyName: "customFields", first: true, predicate: ["customFields"], descendants: true }, { propertyName: "customFieldsTemplates", predicate: VdGenericFormCustomFieldDirective }], ngImport: i0, template: "<div *ngIf=\"formGroup && fieldRows\" [formGroup]=\"formGroup\">\r\n <!-- #region Fields -->\r\n <ng-container *ngFor=\"let fields of fieldRows; let i = index\">\r\n <div layout-gt-sm=\"row\" layout=\"column\">\r\n <ng-container *ngFor=\"let field of fields\" [ngSwitch]=\"field.type\">\r\n <ng-container *ngIf=\"!field.hidden && !(field.hide && field.hide(formValue, formGroup, context))\">\r\n <ng-container *ngIf=\"field.wrapped\">\r\n <!-- #region Text input -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Text\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input [type]=\"field.inputType ?? 'text'\" [minlength]=\"field.minLength||null\" [maxlength]=\"field.maxLength||null\" [min]=\"field.min\" [max]=\"field.max\" matInput [formControlName]=\"field.name!\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [pattern]=\"(field.pattern??'')\" [onlyNumber]=\"(field.numbersOnly??false)\">\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any($any(formGroup.controls[field.name!]))['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Textarea -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.TextArea\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <textarea matInput [formControlName]=\"field.name!\" rows=\"field.rows||2\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\"></textarea>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Enum -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Enum\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-select [formControlName]=\"field.name!\" [enum]=\"field.enumType\" [enumMetadata]=\"field.enumMetadata\" [enumFilter]=\"field.enumFilter | func:formValue:formGroup:context\" [optionValueProperty]=\"field.optionValueProperty\" [optionTextProperty]=\"field.optionTextProperty\" [defaultOption]=\"field.defaultOption??true\" [multiple]=\"field.multiple\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [triggerCssClass]=\"field.triggerCssClass\" [triggerMode]=\"field.triggerMode\" layout=\"row\" flex>\r\n <ng-template vd-select-trigger let-trigger=\"trigger\" *ngIf=\"field.triggerTemplate\">\r\n <span [innerHTML]=\"field.triggerTemplate(trigger, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" *ngIf=\"field.optionTemplate\">\r\n <span [outerHTML]=\"field.optionTemplate(option, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" let-text=\"text\" *ngIf=\"field.optionIcon && !field.optionTemplate\">\r\n <div layout=\"row\" layout-align=\"start center\">\r\n <ng-template #optionIconTemplate [ngTemplateOutlet]=\"optionIconTemplate\" let-optionIcon=\"optionIcon\" [ngTemplateOutletContext]=\"{ optionIcon: field.optionIcon(option, formValue, formGroup, context) }\">\r\n <mat-icon *ngIf=\"optionIcon.svgIcon\" [svgIcon]=\"optionIcon.svgIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\"></mat-icon>\r\n <mat-icon *ngIf=\"optionIcon.matIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\">{{optionIcon.matIcon}}</mat-icon>\r\n </ng-template>\r\n <span>{{text}}</span>\r\n </div>\r\n </ng-template>\r\n </vd-select>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region VdSelect -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.VdSelect\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-select [formControlName]=\"field.name!\" [endpoint]=\"field.endpoint??'' | func:formValue:formGroup:context\" [params]=\"field.params??{} | func:formValue:formGroup:context\" [projection]=\"field.projection\" [mapper]=\"field.mapper\" [compareWith]=\"field.compareWith\" [loadData]=\"field.fetchCondition | func:formValue:formGroup:context\" [optionValueProperty]=\"field.optionValueProperty\" [optionTextProperty]=\"field.optionTextProperty\" [defaultOption]=\"field.defaultOption??true\" [matIconKey]=\"field.optionMatIconProperty\" [svgIconKey]=\"field.optionSvgIconProperty\" [fontSet]=\"field.optionIconFontSet\" [multiple]=\"field.multiple\" [selectFirst]=\"field.selectFirst\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [triggerCssClass]=\"field.triggerCssClass\" [triggerMode]=\"field.triggerMode\" (itemSelected)=\"field.itemSelect && field.itemSelect($event, formValue, formGroup, context);\" (itemChange)=\"field.itemChange && field.itemChange($event, formValue, formGroup, context);\" layout=\"row\" flex>\r\n <ng-template vd-select-trigger let-trigger=\"trigger\" *ngIf=\"field.triggerTemplate\">\r\n <span [innerHTML]=\"field.triggerTemplate(trigger, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-trigger let-trigger=\"trigger\" *ngIf=\"field.triggerMapper && field.multiple && field.triggerMode == 'chip'\">\r\n <mat-chip-set>\r\n <mat-chip *ngFor=\"let item of trigger\" color=\"primary\" highlighted selected>\r\n <span [innerHTML]=\"field.triggerMapper(item, formValue, formGroup, context)\"></span>\r\n </mat-chip>\r\n </mat-chip-set>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" *ngIf=\"field.optionTemplate\">\r\n <span [outerHTML]=\"field.optionTemplate(option, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" let-text=\"text\" *ngIf=\"field.optionIcon && !field.optionTemplate\">\r\n <div layout=\"row\" layout-align=\"start center\">\r\n <ng-template #optionIconTemplate [ngTemplateOutlet]=\"optionIconTemplate\" let-optionIcon=\"optionIcon\" [ngTemplateOutletContext]=\"{ optionIcon: field.optionIcon(option, formValue, formGroup, context) }\">\r\n <mat-icon *ngIf=\"optionIcon.svgIcon\" [svgIcon]=\"optionIcon.svgIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\"></mat-icon>\r\n <mat-icon *ngIf=\"optionIcon.matIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\">{{optionIcon.matIcon}}</mat-icon>\r\n </ng-template>\r\n <span>{{text}}</span>\r\n </div>\r\n </ng-template>\r\n </vd-select>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region VdList -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.VdList\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" floatLabel=\"always\" class=\"form-field-type-list\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-list [formControlName]=\"field.name!\" [endpoint]=\"field.endpoint??'' | func:formValue:formGroup:context\" [params]=\"field.params ??{} | func:formValue:formGroup:context\" [projection]=\"field.projection\" [mapper]=\"field.mapper\" [compareWith]=\"field.compareWith\" [loadData]=\"field.fetchCondition | func:formValue:formGroup:context\" [optionValueProperty]=\"field.optionValueProperty\" [optionTextProperty]=\"field.optionTextProperty\" [multiple]=\"field.multiple\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" (itemSelected)=\"field.itemSelect && field.itemSelect($event, formValue, formGroup, context);\" (itemChange)=\"field.itemChange && field.itemChange($event, formValue, formGroup, context);\" [style.max-width]=\"field.maxWidth\" [style.max-height]=\"field.maxHeight\" flex>\r\n <ng-template vd-list-option let-option=\"option\" *ngIf=\"field.optionTemplate\">\r\n <span [outerHTML]=\"field.optionTemplate(option, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n </vd-list>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Chips -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Chips\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <mat-chip-grid #chipList [formControlName]=\"field.name!\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\">\r\n <mat-chip-row *ngFor=\"let chip of $any(formGroup.controls[field.name!])?.value\" (removed)=\"removeChip(field, chip)\" color=\"primary\" selectable=\"true\" highlighted selected>\r\n <span>{{chip}}</span>\r\n <button matChipRemove>\r\n <mat-icon fontSet=\"material-symbols-outlined\">cancel</mat-icon>\r\n </button>\r\n </mat-chip-row>\r\n <input [placeholder]=\"$any(field.label)\" #chipInput [matChipInputFor]=\"chipList\" [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\" [matAutocomplete]=\"chipAutocomplete\" (input)=\"filterAutocomplete(field, chipInput)\" (matChipInputTokenEnd)=\"addChip(field, $event)\" autocomplete=\"off\">\r\n </mat-chip-grid>\r\n <mat-autocomplete autoActiveFirstOption #chipAutocomplete=\"matAutocomplete\" [class]=\"field.autocompleteCssClass\" (optionSelected)=\"autocompleteValueSelected(field, $event, chipInput)\">\r\n <mat-option *ngFor=\"let option of autocompleteFilteredOptions[field.name!]\" [value]=\"option.id\">\r\n {{option.name}}\r\n </mat-option>\r\n </mat-autocomplete>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region VdChips -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.VdChips\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-chips #vdChip [formControlName]=\"field.name!\" [endpoint]=\"field.endpoint??'' | func:formValue:formGroup:context\" [params]=\"field.params || {} | func:formValue:formGroup:context\" [searchField]=\"field.searchField\" [classType]=\"field.classType\" [projection]=\"field.projection\" [key]=\"field.optionValueProperty\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [removable]=\"!field.clear\" [context]=\"context\" [suffixButtons]=\"field.suffixButtons\" [autocompleteCssClass]=\"field.autocompleteCssClass\" (initSelect)=\"field.itemSelect && field.itemSelect($event, formValue, formGroup, context);\" (selected)=\"field.itemChange && field.itemChange($event, formValue, formGroup, context);\" (cleared)=\"field.clear && field.clear(formValue, formGroup, context);\" [customValue]=\"field.customValue\" layout=\"row\" flex>\r\n <ng-template vd-chip let-chip=\"chip\" *ngIf=\"field.chipTemplate\">\r\n <div [outerHTML]=\"field.chipTemplate(chip, formValue, formGroup, context)\"></div>\r\n </ng-template>\r\n <ng-template vd-autocomplete-option let-option=\"option\" *ngIf=\"field.autocompleteTemplate\">\r\n <div [outerHTML]=\"field.autocompleteTemplate(option, formValue, formGroup, context)\"></div>\r\n </ng-template>\r\n </vd-chips>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-hint *ngIf=\"vdChip.emptyResult\" class=\"tc-red-400\" i18n=\"@@noResultsFound\">No results were found.</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Select -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Select\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <mat-select [formControlName]=\"field.name!\" [multiple]=\"field.multiple\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" flex>\r\n <mat-option *ngFor=\"let option of $any(field.options)\" [value]=\"option.id\">{{option.name}}</mat-option>\r\n </mat-select>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Autocomplete -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Autocomplete\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input type=\"text\" matInput [formControlName]=\"field.name!\" [min]=\"field.min\" [max]=\"field.max\" [matAutocomplete]=\"auto\" #autocompleteInput (input)=\"filterAutocomplete(field, autocompleteInput)\" autocomplete=\"off\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\">\r\n <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" [class]=\"field.autocompleteCssClass\">\r\n <mat-option *ngFor=\"let option of autocompleteFilteredOptions[field.name!]\" [value]=\"option.id\">\r\n {{option.name}}\r\n </mat-option>\r\n </mat-autocomplete>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Date -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Date\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input matInput [formControlName]=\"field.name!\" [min]=\"field.min\" [max]=\"field.max\" autocomplete=\"off\" [matDatepicker]=\"datePicker\" [matDatepickerFilter]=\"field.dateFilter\" [readonly]=\"readonly || field.forceSelect || (field.readonly && field.readonly(formValue, formGroup, context))\">\r\n <mat-datepicker-toggle matSuffix [for]=\"datePicker\"></mat-datepicker-toggle>\r\n <mat-datepicker #datePicker [disabled]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" (monthSelected)=\"handleDatePickerFilterAsync(datePicker, field, $event )\" (opened)=\"handleDatePickerOpened(datePicker, field)\" [calendarHeaderComponent]=\"datePickerHeaderComponent\"></mat-datepicker>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Calendar -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Calendar\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" floatLabel=\"always\" class=\"form-field-type-calendar\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input input=\"hidden\" hidden matInput [formControlName]=\"field.name!\">\r\n <mat-calendar #calendar [selected]=\"formGroup.get(field.name!)?.value\" (selectedChange)=\"formGroup.get(field.name!)?.setValue($event);\" (monthSelected)=\"handleCalendarFilterAsync(calendar, field, $event )\" [headerComponent]=\"datePickerHeaderComponent\" style=\"width: 100%;\"></mat-calendar>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\" layout-margin>{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Color input -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Color\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input [type]=\"field.inputType ?? 'text'\" [minlength]=\"field.minLength||null\" [maxlength]=\"field.maxLength||null\" [min]=\"field.min\" [max]=\"field.max\" matInput [formControlName]=\"field.name!\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [pattern]=\"(field.pattern??'')\" [onlyNumber]=\"(field.numbersOnly??false)\">\r\n <ngx-colors matSuffix ngx-colors-trigger [formControlName]=\"field.name!\" [hideTextInput]=\"true\" (close)=\"this.formGroup.get(field.name!)?.setValue($event)\" format=\"hex\" class=\"color-picker\"></ngx-colors>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any($any(formGroup.controls[field.name!]))['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n </ng-container>\r\n\r\n <!-- #region Checkbox -->\r\n <div *ngSwitchCase=\"FormFieldType.Checkbox\" [attr.flex]=\"field.flex||0\" class=\"mat-checkbox-wrap\" [class]=\"field.cssClass\">\r\n <mat-checkbox [formControlName]=\"field.name!\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\">{{field.label}}</mat-checkbox>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\" layout-margin>{{errorMessage}}</mat-error>\r\n </div>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Editor -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.Editor\">\r\n <ng-template *ngIf=\"editorTemplate?.templateRef!\" [ngTemplateOutlet]=\"editorTemplate?.templateRef!\" [ngTemplateOutletContext]=\"{ field: field, formGroup: formGroup }\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Code -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.Code\">\r\n <ng-template *ngIf=\"codeTemplate?.templateRef!\" [ngTemplateOutlet]=\"codeTemplate?.templateRef!\" [ngTemplateOutletContext]=\"{ field: field, formGroup: formGroup }\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region File -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.File\">\r\n <mat-form-field [attr.flex]=\"field.flex||0\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <div vd-file-input [formControlName]=\"field.name!\" (select)=\"field.change && field.change(field, $event, formGroup, context)\" [accept]=\"field.fileExtensions\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" flex></div>\r\n </mat-form-field>\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Custom -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.Custom\">\r\n <ng-template *ngIf=\"customTemplate?.templateRef!\" [ngTemplateOutlet]=\"customTemplate?.templateRef!\" [ngTemplateOutletContext]=\"{ field: field, formGroup: formGroup }\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- #region Template for custom fields -->\r\n <ng-container *ngFor=\"let customField of customFieldsTemplates\">\r\n <ng-template *ngIf=\"customField?.templateRef && customField.row == fields[0]?.row && customField.inline\" [ngTemplateOutlet]=\"customField?.templateRef!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n </div>\r\n\r\n <!-- #region Template for custom fields -->\r\n <ng-container *ngIf=\"customFields\" [ngTemplateOutlet]=\"customFields\" [ngTemplateOutletContext]=\"{formGroup: formGroup, row: fields[0].row}\"></ng-container>\r\n <ng-container *ngFor=\"let customField of customFieldsTemplates\">\r\n <ng-template *ngIf=\"customField?.templateRef && customField.row == ((fields[0]?.row??0)+1) && !customField.inline\" [ngTemplateOutlet]=\"customField?.templateRef!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Form bottom -->\r\n <ng-container *ngIf=\"bottom\" [ngTemplateOutlet]=\"bottom\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Template for suffix buttons -->\r\n <ng-template #suffixButtons let-field>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n </ng-template>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Debug value -->\r\n <code *ngIf=\"debugValue\">\r\n <pre>{{formValue | json}}</pre>\r\n </code>\r\n <!-- #endregion -->\r\n</div>", styles: [".mat-checkbox-wrap mat-error{transform:translate(36px,-20px);max-width:93%;font-size:var(--mdc-typography-caption-font-size, 12px)}::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-icon-suffix .color-picker{width:40px;display:block}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-form-field-infix{padding-top:7px!important;padding-bottom:7px!important}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-chip{padding-top:0!important;padding-bottom:0!important;margin-top:2px!important;margin-bottom:2px!important;margin-left:4px!important}\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: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: DisableControlDirective, selector: "[disableControl]", inputs: ["disableControl"] }, { kind: "directive", type: OnlyNumberDirective, selector: "[onlyNumber]", inputs: ["onlyNumber"] }, { kind: "component", type: VdSelectComponent, selector: "vd-select", inputs: ["triggerCssClass", "triggerMode"] }, { kind: "directive", type: VdSelectOptionDirective, selector: "[vd-select-option]ng-template" }, { kind: "directive", type: VdSelectTriggerDirective, selector: "[vd-select-trigger]ng-template" }, { kind: "component", type: VdChipsComponent, selector: "vd-chips", inputs: ["classType", "chips", "endpoint", "params", "projection", "paginated", "customValue", "context", "key", "searchField", "searchFields", "removable", "debounce", "autocompleteCssClass", "suffixButtons"], outputs: ["initSelect", "selected", "cleared", "launch", "chipFocus"] }, { kind: "directive", type: VdAutocompleteOptionDirective, selector: "[vd-autocomplete-option]ng-template" }, { kind: "directive", type: VdChipDirective, selector: "[vd-chip]ng-template" }, { kind: "component", type: VdFileInputComponent, selector: "[vd-file-input]", inputs: ["accept", "placeholder", "required", "multiple", "disabled", "errorState"], outputs: ["select", "clear"] }, { kind: "component", type: VdListComponent, selector: "vd-list" }, { kind: "directive", type: VdListOptionDirective, selector: "[vd-list-option]ng-template" }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatLabel, selector: "mat-label" }, { kind: "directive", type: i6.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i6.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i5$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i2$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i8.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.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i20.MatCalendar, selector: "mat-calendar", inputs: ["headerComponent", "startAt", "startView", "selected", "minDate", "maxDate", "dateFilter", "dateClass", "comparisonStart", "comparisonEnd", "startDateAccessibleName", "endDateAccessibleName"], outputs: ["selectedChange", "yearSelected", "monthSelected", "viewChanged", "_userSelection", "_userDragDrop"], exportAs: ["matCalendar"] }, { kind: "component", type: i20.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i20.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i20.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i16.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"] }, { kind: "component", type: i10.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: i10.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i23.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled", "tabIndex"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: i23.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i23.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i23.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i23.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "component", type: i23.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "component", type: i24.NgxColorsComponent, selector: "ngx-colors" }, { kind: "directive", type: i24.NgxColorsTriggerDirective, selector: "[ngx-colors-trigger]", inputs: ["colorsAnimation", "palette", "format", "formats", "position", "hideTextInput", "hideColorPicker", "attachTo", "overlayClassName", "colorPickerControls", "acceptLabel", "cancelLabel"], outputs: ["change", "input", "slider", "close", "open"] }, { kind: "directive", type: NativeElementInjectorDirective, selector: "[ngModel], [formControl], [formControlName]" }, { kind: "directive", type: MatFormFieldReadonlyDirective, selector: "mat-form-field" }, { kind: "directive", type: EmptyStringResetDirective, selector: "[ngModel],[formControlName],[formControl]" }, { kind: "pipe", type: i3.JsonPipe, name: "json" }, { kind: "pipe", type: FuncPipe, name: "func" }] });
23877
+ /** @nocollapse */ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.6", type: VdGenericFormComponent, selector: "vd-generic-form", inputs: { formGroup: "formGroup", classType: "classType", formDefinition: "formDefinition", fieldGroups: "fieldGroups", groupName: "groupName", fieldSets: "fieldSets", context: "context", debugValue: "debugValue", readonly: "readonly", separatorKeysCodes: "separatorKeysCodes" }, queries: [{ propertyName: "editorTemplate", first: true, predicate: VdEditorDirective, descendants: true }, { propertyName: "codeTemplate", first: true, predicate: VdCodeDirective, descendants: true }, { propertyName: "fileTemplate", first: true, predicate: VdFileDirective, descendants: true }, { propertyName: "customTemplate", first: true, predicate: VdCustomDirective, descendants: true }, { propertyName: "bottom", first: true, predicate: ["bottom"], descendants: true }, { propertyName: "customFields", first: true, predicate: ["customFields"], descendants: true }, { propertyName: "customFieldsTemplates", predicate: VdGenericFormCustomFieldDirective }], ngImport: i0, template: "<div *ngIf=\"formGroup && fieldRows\" [formGroup]=\"formGroup\">\r\n <!-- #region Fields -->\r\n <ng-container *ngFor=\"let fields of fieldRows; let i = index\">\r\n <div layout-gt-sm=\"row\" layout=\"column\">\r\n <ng-container *ngFor=\"let field of fields\" [ngSwitch]=\"field.type\">\r\n <ng-container *ngIf=\"!field.hidden && !(field.hide && field.hide(formValue, formGroup, context))\">\r\n <ng-container *ngIf=\"field.wrapped\">\r\n <!-- #region Text input -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Text\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input [type]=\"field.inputType ?? 'text'\" [minlength]=\"field.minLength||null\" [maxlength]=\"field.maxLength||null\" [min]=\"field.min\" [max]=\"field.max\" matInput [formControlName]=\"field.name!\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [pattern]=\"(field.pattern??'')\" [onlyNumber]=\"(field.numbersOnly??false)\">\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any($any(formGroup.controls[field.name!]))['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Textarea -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.TextArea\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <textarea matInput [formControlName]=\"field.name!\" rows=\"field.rows||2\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\"></textarea>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Enum -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Enum\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-select [formControlName]=\"field.name!\" [enum]=\"field.enumType\" [enumMetadata]=\"field.enumMetadata\" [enumFilter]=\"field.enumFilter | func:formValue:formGroup:context\" [optionValueProperty]=\"field.optionValueProperty\" [optionTextProperty]=\"field.optionTextProperty\" [defaultOption]=\"field.defaultOption??true\" [multiple]=\"field.multiple\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [triggerCssClass]=\"field.triggerCssClass\" [triggerMode]=\"field.triggerMode\" layout=\"row\" flex>\r\n <ng-template vd-select-trigger let-trigger=\"trigger\" *ngIf=\"field.triggerTemplate\">\r\n <span [innerHTML]=\"field.triggerTemplate(trigger, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" *ngIf=\"field.optionTemplate\">\r\n <span [outerHTML]=\"field.optionTemplate(option, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" let-text=\"text\" *ngIf=\"field.optionIcon && !field.optionTemplate\">\r\n <div layout=\"row\" layout-align=\"start center\">\r\n <ng-template #optionIconTemplate [ngTemplateOutlet]=\"optionIconTemplate\" let-optionIcon=\"optionIcon\" [ngTemplateOutletContext]=\"{ optionIcon: field.optionIcon(option, formValue, formGroup, context) }\">\r\n <mat-icon *ngIf=\"optionIcon.svgIcon\" [svgIcon]=\"optionIcon.svgIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\"></mat-icon>\r\n <mat-icon *ngIf=\"optionIcon.matIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\">{{optionIcon.matIcon}}</mat-icon>\r\n </ng-template>\r\n <span>{{text}}</span>\r\n </div>\r\n </ng-template>\r\n </vd-select>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region VdSelect -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.VdSelect\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-select [formControlName]=\"field.name!\" [endpoint]=\"field.endpoint??'' | func:formValue:formGroup:context\" [params]=\"field.params??{} | func:formValue:formGroup:context\" [projection]=\"field.projection\" [mapper]=\"field.mapper\" [compareWith]=\"field.compareWith\" [loadData]=\"field.fetchCondition | func:formValue:formGroup:context\" [optionValueProperty]=\"field.optionValueProperty\" [optionTextProperty]=\"field.optionTextProperty\" [defaultOption]=\"field.defaultOption??true\" [matIconKey]=\"field.optionMatIconProperty\" [svgIconKey]=\"field.optionSvgIconProperty\" [fontSet]=\"field.optionIconFontSet\" [multiple]=\"field.multiple\" [selectFirst]=\"field.selectFirst\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [triggerCssClass]=\"field.triggerCssClass\" [triggerMode]=\"field.triggerMode\" (itemSelected)=\"field.itemSelect && field.itemSelect($event, formValue, formGroup, context);\" (itemChange)=\"field.itemChange && field.itemChange($event, formValue, formGroup, context);\" layout=\"row\" flex>\r\n <ng-template vd-select-trigger let-trigger=\"trigger\" *ngIf=\"field.triggerTemplate\">\r\n <span [innerHTML]=\"field.triggerTemplate(trigger, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-trigger let-trigger=\"trigger\" *ngIf=\"field.triggerMapper && field.multiple && field.triggerMode == 'chip'\">\r\n <mat-chip-set>\r\n <mat-chip *ngFor=\"let item of trigger\" [color]=\"field.chipColor\" [color]=\"field.chipColor\" highlighted selected>\r\n <span [innerHTML]=\"field.triggerMapper(item, formValue, formGroup, context)\"></span>\r\n </mat-chip>\r\n </mat-chip-set>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" *ngIf=\"field.optionTemplate\">\r\n <span [outerHTML]=\"field.optionTemplate(option, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" let-text=\"text\" *ngIf=\"field.optionIcon && !field.optionTemplate\">\r\n <div layout=\"row\" layout-align=\"start center\">\r\n <ng-template #optionIconTemplate [ngTemplateOutlet]=\"optionIconTemplate\" let-optionIcon=\"optionIcon\" [ngTemplateOutletContext]=\"{ optionIcon: field.optionIcon(option, formValue, formGroup, context) }\">\r\n <mat-icon *ngIf=\"optionIcon.svgIcon\" [svgIcon]=\"optionIcon.svgIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\"></mat-icon>\r\n <mat-icon *ngIf=\"optionIcon.matIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\">{{optionIcon.matIcon}}</mat-icon>\r\n </ng-template>\r\n <span>{{text}}</span>\r\n </div>\r\n </ng-template>\r\n </vd-select>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region VdList -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.VdList\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" floatLabel=\"always\" class=\"form-field-type-list\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-list [formControlName]=\"field.name!\" [endpoint]=\"field.endpoint??'' | func:formValue:formGroup:context\" [params]=\"field.params ??{} | func:formValue:formGroup:context\" [projection]=\"field.projection\" [mapper]=\"field.mapper\" [compareWith]=\"field.compareWith\" [loadData]=\"field.fetchCondition | func:formValue:formGroup:context\" [optionValueProperty]=\"field.optionValueProperty\" [optionTextProperty]=\"field.optionTextProperty\" [multiple]=\"field.multiple\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" (itemSelected)=\"field.itemSelect && field.itemSelect($event, formValue, formGroup, context);\" (itemChange)=\"field.itemChange && field.itemChange($event, formValue, formGroup, context);\" [style.max-width]=\"field.maxWidth\" [style.max-height]=\"field.maxHeight\" flex>\r\n <ng-template vd-list-option let-option=\"option\" *ngIf=\"field.optionTemplate\">\r\n <span [outerHTML]=\"field.optionTemplate(option, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n </vd-list>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Chips -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Chips\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <mat-chip-grid #chipList [formControlName]=\"field.name!\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\">\r\n <mat-chip-row *ngFor=\"let chip of $any(formGroup.controls[field.name!])?.value\" (removed)=\"removeChip(field, chip)\" [color]=\"field.chipColor\" selectable=\"true\" highlighted selected>\r\n <span>{{chip}}</span>\r\n <button matChipRemove>\r\n <mat-icon fontSet=\"material-symbols-outlined\">cancel</mat-icon>\r\n </button>\r\n </mat-chip-row>\r\n <input [placeholder]=\"$any(field.label)\" #chipInput [matChipInputFor]=\"chipList\" [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\" [matAutocomplete]=\"chipAutocomplete\" (input)=\"filterAutocomplete(field, chipInput)\" (matChipInputTokenEnd)=\"addChip(field, $event)\" autocomplete=\"off\">\r\n </mat-chip-grid>\r\n <mat-autocomplete autoActiveFirstOption #chipAutocomplete=\"matAutocomplete\" [class]=\"field.autocompleteCssClass\" (optionSelected)=\"autocompleteValueSelected(field, $event, chipInput)\">\r\n <mat-option *ngFor=\"let option of autocompleteFilteredOptions[field.name!]\" [value]=\"option.id\">\r\n {{option.name}}\r\n </mat-option>\r\n </mat-autocomplete>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region VdChips -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.VdChips\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-chips #vdChip [formControlName]=\"field.name!\" [endpoint]=\"field.endpoint??'' | func:formValue:formGroup:context\" [params]=\"field.params || {} | func:formValue:formGroup:context\" [searchField]=\"field.searchField\" [classType]=\"field.classType\" [projection]=\"field.projection\" [key]=\"field.optionValueProperty\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [removable]=\"!field.clear\" [context]=\"context\" [suffixButtons]=\"field.suffixButtons\" [autocompleteCssClass]=\"field.autocompleteCssClass\" (initSelect)=\"field.itemSelect && field.itemSelect($event, formValue, formGroup, context);\" (selected)=\"field.itemChange && field.itemChange($event, formValue, formGroup, context);\" (cleared)=\"field.clear && field.clear(formValue, formGroup, context);\" [customValue]=\"field.customValue\" layout=\"row\" flex>\r\n <ng-template vd-chip let-chip=\"chip\" *ngIf=\"field.chipTemplate\">\r\n <div [outerHTML]=\"field.chipTemplate(chip, formValue, formGroup, context)\"></div>\r\n </ng-template>\r\n <ng-template vd-autocomplete-option let-option=\"option\" *ngIf=\"field.autocompleteTemplate\">\r\n <div [outerHTML]=\"field.autocompleteTemplate(option, formValue, formGroup, context)\"></div>\r\n </ng-template>\r\n </vd-chips>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-hint *ngIf=\"vdChip.emptyResult\" class=\"tc-red-400\" i18n=\"@@noResultsFound\">No results were found.</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Select -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Select\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <mat-select [formControlName]=\"field.name!\" [multiple]=\"field.multiple\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" flex>\r\n <mat-option *ngFor=\"let option of $any(field.options)\" [value]=\"option.id\">{{option.name}}</mat-option>\r\n </mat-select>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Autocomplete -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Autocomplete\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input type=\"text\" matInput [formControlName]=\"field.name!\" [min]=\"field.min\" [max]=\"field.max\" [matAutocomplete]=\"auto\" #autocompleteInput (input)=\"filterAutocomplete(field, autocompleteInput)\" autocomplete=\"off\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\">\r\n <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" [class]=\"field.autocompleteCssClass\">\r\n <mat-option *ngFor=\"let option of autocompleteFilteredOptions[field.name!]\" [value]=\"option.id\">\r\n {{option.name}}\r\n </mat-option>\r\n </mat-autocomplete>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Date -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Date\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input matInput [formControlName]=\"field.name!\" [min]=\"field.min\" [max]=\"field.max\" autocomplete=\"off\" [matDatepicker]=\"datePicker\" [matDatepickerFilter]=\"field.dateFilter\" [readonly]=\"readonly || field.forceSelect || (field.readonly && field.readonly(formValue, formGroup, context))\">\r\n <mat-datepicker-toggle matSuffix [for]=\"datePicker\"></mat-datepicker-toggle>\r\n <mat-datepicker #datePicker [disabled]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" (monthSelected)=\"handleDatePickerFilterAsync(datePicker, field, $event )\" (opened)=\"handleDatePickerOpened(datePicker, field)\" [calendarHeaderComponent]=\"datePickerHeaderComponent\"></mat-datepicker>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Calendar -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Calendar\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" floatLabel=\"always\" class=\"form-field-type-calendar\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input input=\"hidden\" hidden matInput [formControlName]=\"field.name!\">\r\n <mat-calendar #calendar [selected]=\"formGroup.get(field.name!)?.value\" (selectedChange)=\"formGroup.get(field.name!)?.setValue($event);\" (monthSelected)=\"handleCalendarFilterAsync(calendar, field, $event )\" [headerComponent]=\"datePickerHeaderComponent\" style=\"width: 100%;\"></mat-calendar>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\" layout-margin>{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Color input -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Color\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input [type]=\"field.inputType ?? 'text'\" [minlength]=\"field.minLength||null\" [maxlength]=\"field.maxLength||null\" [min]=\"field.min\" [max]=\"field.max\" matInput [formControlName]=\"field.name!\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [pattern]=\"(field.pattern??'')\" [onlyNumber]=\"(field.numbersOnly??false)\">\r\n <ngx-colors matSuffix ngx-colors-trigger [formControlName]=\"field.name!\" [hideTextInput]=\"true\" (close)=\"this.formGroup.get(field.name!)?.setValue($event)\" format=\"hex\" class=\"color-picker\"></ngx-colors>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any($any(formGroup.controls[field.name!]))['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n </ng-container>\r\n\r\n <!-- #region Checkbox -->\r\n <div *ngSwitchCase=\"FormFieldType.Checkbox\" [attr.flex]=\"field.flex||0\" class=\"mat-checkbox-wrap\" [class]=\"field.cssClass\">\r\n <mat-checkbox [formControlName]=\"field.name!\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\">{{field.label}}</mat-checkbox>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\" layout-margin>{{errorMessage}}</mat-error>\r\n </div>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Editor -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.Editor\">\r\n <ng-template *ngIf=\"editorTemplate?.templateRef!\" [ngTemplateOutlet]=\"editorTemplate?.templateRef!\" [ngTemplateOutletContext]=\"{ field: field, formGroup: formGroup }\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Code -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.Code\">\r\n <ng-template *ngIf=\"codeTemplate?.templateRef!\" [ngTemplateOutlet]=\"codeTemplate?.templateRef!\" [ngTemplateOutletContext]=\"{ field: field, formGroup: formGroup }\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region File -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.File\">\r\n <mat-form-field [attr.flex]=\"field.flex||0\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <div vd-file-input [formControlName]=\"field.name!\" (select)=\"field.change && field.change(field, $event, formGroup, context)\" [accept]=\"field.fileExtensions\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" flex></div>\r\n </mat-form-field>\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Custom -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.Custom\">\r\n <ng-template *ngIf=\"customTemplate?.templateRef!\" [ngTemplateOutlet]=\"customTemplate?.templateRef!\" [ngTemplateOutletContext]=\"{ field: field, formGroup: formGroup }\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- #region Template for custom fields -->\r\n <ng-container *ngFor=\"let customField of customFieldsTemplates\">\r\n <ng-template *ngIf=\"customField?.templateRef && customField.row == fields[0]?.row && customField.inline\" [ngTemplateOutlet]=\"customField?.templateRef!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n </div>\r\n\r\n <!-- #region Template for custom fields -->\r\n <ng-container *ngIf=\"customFields\" [ngTemplateOutlet]=\"customFields\" [ngTemplateOutletContext]=\"{formGroup: formGroup, row: fields[0].row}\"></ng-container>\r\n <ng-container *ngFor=\"let customField of customFieldsTemplates\">\r\n <ng-template *ngIf=\"customField?.templateRef && customField.row == ((fields[0]?.row??0)+1) && !customField.inline\" [ngTemplateOutlet]=\"customField?.templateRef!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Form bottom -->\r\n <ng-container *ngIf=\"bottom\" [ngTemplateOutlet]=\"bottom\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Template for suffix buttons -->\r\n <ng-template #suffixButtons let-field>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n </ng-template>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Debug value -->\r\n <code *ngIf=\"debugValue\">\r\n <pre>{{formValue | json}}</pre>\r\n </code>\r\n <!-- #endregion -->\r\n</div>", styles: [".mat-checkbox-wrap mat-error{transform:translate(36px,-20px);max-width:93%;font-size:var(--mdc-typography-caption-font-size, 12px)}::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-icon-suffix .color-picker{width:40px;display:block}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-form-field-infix{padding-top:7px!important;padding-bottom:7px!important}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-chip{padding-top:0!important;padding-bottom:0!important;margin-top:2px!important;margin-bottom:2px!important;margin-left:4px!important}\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: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: DisableControlDirective, selector: "[disableControl]", inputs: ["disableControl"] }, { kind: "directive", type: OnlyNumberDirective, selector: "[onlyNumber]", inputs: ["onlyNumber"] }, { kind: "component", type: VdSelectComponent, selector: "vd-select", inputs: ["triggerCssClass", "triggerMode"] }, { kind: "directive", type: VdSelectOptionDirective, selector: "[vd-select-option]ng-template" }, { kind: "directive", type: VdSelectTriggerDirective, selector: "[vd-select-trigger]ng-template" }, { kind: "component", type: VdChipsComponent, selector: "vd-chips", inputs: ["classType", "chips", "endpoint", "params", "projection", "paginated", "customValue", "context", "key", "searchField", "searchFields", "removable", "debounce", "autocompleteCssClass", "suffixButtons"], outputs: ["initSelect", "selected", "cleared", "launch", "chipFocus"] }, { kind: "directive", type: VdAutocompleteOptionDirective, selector: "[vd-autocomplete-option]ng-template" }, { kind: "directive", type: VdChipDirective, selector: "[vd-chip]ng-template" }, { kind: "component", type: VdFileInputComponent, selector: "[vd-file-input]", inputs: ["accept", "placeholder", "required", "multiple", "disabled", "errorState"], outputs: ["select", "clear"] }, { kind: "component", type: VdListComponent, selector: "vd-list" }, { kind: "directive", type: VdListOptionDirective, selector: "[vd-list-option]ng-template" }, { kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatLabel, selector: "mat-label" }, { kind: "directive", type: i6.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i6.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i5$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i2$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i8.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.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i20.MatCalendar, selector: "mat-calendar", inputs: ["headerComponent", "startAt", "startView", "selected", "minDate", "maxDate", "dateFilter", "dateClass", "comparisonStart", "comparisonEnd", "startDateAccessibleName", "endDateAccessibleName"], outputs: ["selectedChange", "yearSelected", "monthSelected", "viewChanged", "_userSelection", "_userDragDrop"], exportAs: ["matCalendar"] }, { kind: "component", type: i20.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i20.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i20.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i16.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"] }, { kind: "component", type: i10.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: i10.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i23.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled", "tabIndex"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: i23.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i23.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i23.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i23.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "component", type: i23.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "component", type: i24.NgxColorsComponent, selector: "ngx-colors" }, { kind: "directive", type: i24.NgxColorsTriggerDirective, selector: "[ngx-colors-trigger]", inputs: ["colorsAnimation", "palette", "format", "formats", "position", "hideTextInput", "hideColorPicker", "attachTo", "overlayClassName", "colorPickerControls", "acceptLabel", "cancelLabel"], outputs: ["change", "input", "slider", "close", "open"] }, { kind: "directive", type: NativeElementInjectorDirective, selector: "[ngModel], [formControl], [formControlName]" }, { kind: "directive", type: MatFormFieldReadonlyDirective, selector: "mat-form-field" }, { kind: "directive", type: EmptyStringResetDirective, selector: "[ngModel],[formControlName],[formControl]" }, { kind: "pipe", type: i3.JsonPipe, name: "json" }, { kind: "pipe", type: FuncPipe, name: "func" }] });
23873
23878
  }
23874
23879
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: VdGenericFormComponent, decorators: [{
23875
23880
  type: Component,
23876
- args: [{ selector: 'vd-generic-form', template: "<div *ngIf=\"formGroup && fieldRows\" [formGroup]=\"formGroup\">\r\n <!-- #region Fields -->\r\n <ng-container *ngFor=\"let fields of fieldRows; let i = index\">\r\n <div layout-gt-sm=\"row\" layout=\"column\">\r\n <ng-container *ngFor=\"let field of fields\" [ngSwitch]=\"field.type\">\r\n <ng-container *ngIf=\"!field.hidden && !(field.hide && field.hide(formValue, formGroup, context))\">\r\n <ng-container *ngIf=\"field.wrapped\">\r\n <!-- #region Text input -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Text\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input [type]=\"field.inputType ?? 'text'\" [minlength]=\"field.minLength||null\" [maxlength]=\"field.maxLength||null\" [min]=\"field.min\" [max]=\"field.max\" matInput [formControlName]=\"field.name!\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [pattern]=\"(field.pattern??'')\" [onlyNumber]=\"(field.numbersOnly??false)\">\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any($any(formGroup.controls[field.name!]))['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Textarea -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.TextArea\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <textarea matInput [formControlName]=\"field.name!\" rows=\"field.rows||2\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\"></textarea>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Enum -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Enum\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-select [formControlName]=\"field.name!\" [enum]=\"field.enumType\" [enumMetadata]=\"field.enumMetadata\" [enumFilter]=\"field.enumFilter | func:formValue:formGroup:context\" [optionValueProperty]=\"field.optionValueProperty\" [optionTextProperty]=\"field.optionTextProperty\" [defaultOption]=\"field.defaultOption??true\" [multiple]=\"field.multiple\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [triggerCssClass]=\"field.triggerCssClass\" [triggerMode]=\"field.triggerMode\" layout=\"row\" flex>\r\n <ng-template vd-select-trigger let-trigger=\"trigger\" *ngIf=\"field.triggerTemplate\">\r\n <span [innerHTML]=\"field.triggerTemplate(trigger, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" *ngIf=\"field.optionTemplate\">\r\n <span [outerHTML]=\"field.optionTemplate(option, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" let-text=\"text\" *ngIf=\"field.optionIcon && !field.optionTemplate\">\r\n <div layout=\"row\" layout-align=\"start center\">\r\n <ng-template #optionIconTemplate [ngTemplateOutlet]=\"optionIconTemplate\" let-optionIcon=\"optionIcon\" [ngTemplateOutletContext]=\"{ optionIcon: field.optionIcon(option, formValue, formGroup, context) }\">\r\n <mat-icon *ngIf=\"optionIcon.svgIcon\" [svgIcon]=\"optionIcon.svgIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\"></mat-icon>\r\n <mat-icon *ngIf=\"optionIcon.matIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\">{{optionIcon.matIcon}}</mat-icon>\r\n </ng-template>\r\n <span>{{text}}</span>\r\n </div>\r\n </ng-template>\r\n </vd-select>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region VdSelect -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.VdSelect\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-select [formControlName]=\"field.name!\" [endpoint]=\"field.endpoint??'' | func:formValue:formGroup:context\" [params]=\"field.params??{} | func:formValue:formGroup:context\" [projection]=\"field.projection\" [mapper]=\"field.mapper\" [compareWith]=\"field.compareWith\" [loadData]=\"field.fetchCondition | func:formValue:formGroup:context\" [optionValueProperty]=\"field.optionValueProperty\" [optionTextProperty]=\"field.optionTextProperty\" [defaultOption]=\"field.defaultOption??true\" [matIconKey]=\"field.optionMatIconProperty\" [svgIconKey]=\"field.optionSvgIconProperty\" [fontSet]=\"field.optionIconFontSet\" [multiple]=\"field.multiple\" [selectFirst]=\"field.selectFirst\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [triggerCssClass]=\"field.triggerCssClass\" [triggerMode]=\"field.triggerMode\" (itemSelected)=\"field.itemSelect && field.itemSelect($event, formValue, formGroup, context);\" (itemChange)=\"field.itemChange && field.itemChange($event, formValue, formGroup, context);\" layout=\"row\" flex>\r\n <ng-template vd-select-trigger let-trigger=\"trigger\" *ngIf=\"field.triggerTemplate\">\r\n <span [innerHTML]=\"field.triggerTemplate(trigger, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-trigger let-trigger=\"trigger\" *ngIf=\"field.triggerMapper && field.multiple && field.triggerMode == 'chip'\">\r\n <mat-chip-set>\r\n <mat-chip *ngFor=\"let item of trigger\" color=\"primary\" highlighted selected>\r\n <span [innerHTML]=\"field.triggerMapper(item, formValue, formGroup, context)\"></span>\r\n </mat-chip>\r\n </mat-chip-set>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" *ngIf=\"field.optionTemplate\">\r\n <span [outerHTML]=\"field.optionTemplate(option, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" let-text=\"text\" *ngIf=\"field.optionIcon && !field.optionTemplate\">\r\n <div layout=\"row\" layout-align=\"start center\">\r\n <ng-template #optionIconTemplate [ngTemplateOutlet]=\"optionIconTemplate\" let-optionIcon=\"optionIcon\" [ngTemplateOutletContext]=\"{ optionIcon: field.optionIcon(option, formValue, formGroup, context) }\">\r\n <mat-icon *ngIf=\"optionIcon.svgIcon\" [svgIcon]=\"optionIcon.svgIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\"></mat-icon>\r\n <mat-icon *ngIf=\"optionIcon.matIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\">{{optionIcon.matIcon}}</mat-icon>\r\n </ng-template>\r\n <span>{{text}}</span>\r\n </div>\r\n </ng-template>\r\n </vd-select>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region VdList -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.VdList\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" floatLabel=\"always\" class=\"form-field-type-list\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-list [formControlName]=\"field.name!\" [endpoint]=\"field.endpoint??'' | func:formValue:formGroup:context\" [params]=\"field.params ??{} | func:formValue:formGroup:context\" [projection]=\"field.projection\" [mapper]=\"field.mapper\" [compareWith]=\"field.compareWith\" [loadData]=\"field.fetchCondition | func:formValue:formGroup:context\" [optionValueProperty]=\"field.optionValueProperty\" [optionTextProperty]=\"field.optionTextProperty\" [multiple]=\"field.multiple\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" (itemSelected)=\"field.itemSelect && field.itemSelect($event, formValue, formGroup, context);\" (itemChange)=\"field.itemChange && field.itemChange($event, formValue, formGroup, context);\" [style.max-width]=\"field.maxWidth\" [style.max-height]=\"field.maxHeight\" flex>\r\n <ng-template vd-list-option let-option=\"option\" *ngIf=\"field.optionTemplate\">\r\n <span [outerHTML]=\"field.optionTemplate(option, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n </vd-list>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Chips -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Chips\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <mat-chip-grid #chipList [formControlName]=\"field.name!\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\">\r\n <mat-chip-row *ngFor=\"let chip of $any(formGroup.controls[field.name!])?.value\" (removed)=\"removeChip(field, chip)\" color=\"primary\" selectable=\"true\" highlighted selected>\r\n <span>{{chip}}</span>\r\n <button matChipRemove>\r\n <mat-icon fontSet=\"material-symbols-outlined\">cancel</mat-icon>\r\n </button>\r\n </mat-chip-row>\r\n <input [placeholder]=\"$any(field.label)\" #chipInput [matChipInputFor]=\"chipList\" [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\" [matAutocomplete]=\"chipAutocomplete\" (input)=\"filterAutocomplete(field, chipInput)\" (matChipInputTokenEnd)=\"addChip(field, $event)\" autocomplete=\"off\">\r\n </mat-chip-grid>\r\n <mat-autocomplete autoActiveFirstOption #chipAutocomplete=\"matAutocomplete\" [class]=\"field.autocompleteCssClass\" (optionSelected)=\"autocompleteValueSelected(field, $event, chipInput)\">\r\n <mat-option *ngFor=\"let option of autocompleteFilteredOptions[field.name!]\" [value]=\"option.id\">\r\n {{option.name}}\r\n </mat-option>\r\n </mat-autocomplete>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region VdChips -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.VdChips\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-chips #vdChip [formControlName]=\"field.name!\" [endpoint]=\"field.endpoint??'' | func:formValue:formGroup:context\" [params]=\"field.params || {} | func:formValue:formGroup:context\" [searchField]=\"field.searchField\" [classType]=\"field.classType\" [projection]=\"field.projection\" [key]=\"field.optionValueProperty\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [removable]=\"!field.clear\" [context]=\"context\" [suffixButtons]=\"field.suffixButtons\" [autocompleteCssClass]=\"field.autocompleteCssClass\" (initSelect)=\"field.itemSelect && field.itemSelect($event, formValue, formGroup, context);\" (selected)=\"field.itemChange && field.itemChange($event, formValue, formGroup, context);\" (cleared)=\"field.clear && field.clear(formValue, formGroup, context);\" [customValue]=\"field.customValue\" layout=\"row\" flex>\r\n <ng-template vd-chip let-chip=\"chip\" *ngIf=\"field.chipTemplate\">\r\n <div [outerHTML]=\"field.chipTemplate(chip, formValue, formGroup, context)\"></div>\r\n </ng-template>\r\n <ng-template vd-autocomplete-option let-option=\"option\" *ngIf=\"field.autocompleteTemplate\">\r\n <div [outerHTML]=\"field.autocompleteTemplate(option, formValue, formGroup, context)\"></div>\r\n </ng-template>\r\n </vd-chips>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-hint *ngIf=\"vdChip.emptyResult\" class=\"tc-red-400\" i18n=\"@@noResultsFound\">No results were found.</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Select -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Select\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <mat-select [formControlName]=\"field.name!\" [multiple]=\"field.multiple\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" flex>\r\n <mat-option *ngFor=\"let option of $any(field.options)\" [value]=\"option.id\">{{option.name}}</mat-option>\r\n </mat-select>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Autocomplete -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Autocomplete\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input type=\"text\" matInput [formControlName]=\"field.name!\" [min]=\"field.min\" [max]=\"field.max\" [matAutocomplete]=\"auto\" #autocompleteInput (input)=\"filterAutocomplete(field, autocompleteInput)\" autocomplete=\"off\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\">\r\n <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" [class]=\"field.autocompleteCssClass\">\r\n <mat-option *ngFor=\"let option of autocompleteFilteredOptions[field.name!]\" [value]=\"option.id\">\r\n {{option.name}}\r\n </mat-option>\r\n </mat-autocomplete>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Date -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Date\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input matInput [formControlName]=\"field.name!\" [min]=\"field.min\" [max]=\"field.max\" autocomplete=\"off\" [matDatepicker]=\"datePicker\" [matDatepickerFilter]=\"field.dateFilter\" [readonly]=\"readonly || field.forceSelect || (field.readonly && field.readonly(formValue, formGroup, context))\">\r\n <mat-datepicker-toggle matSuffix [for]=\"datePicker\"></mat-datepicker-toggle>\r\n <mat-datepicker #datePicker [disabled]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" (monthSelected)=\"handleDatePickerFilterAsync(datePicker, field, $event )\" (opened)=\"handleDatePickerOpened(datePicker, field)\" [calendarHeaderComponent]=\"datePickerHeaderComponent\"></mat-datepicker>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Calendar -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Calendar\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" floatLabel=\"always\" class=\"form-field-type-calendar\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input input=\"hidden\" hidden matInput [formControlName]=\"field.name!\">\r\n <mat-calendar #calendar [selected]=\"formGroup.get(field.name!)?.value\" (selectedChange)=\"formGroup.get(field.name!)?.setValue($event);\" (monthSelected)=\"handleCalendarFilterAsync(calendar, field, $event )\" [headerComponent]=\"datePickerHeaderComponent\" style=\"width: 100%;\"></mat-calendar>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\" layout-margin>{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Color input -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Color\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input [type]=\"field.inputType ?? 'text'\" [minlength]=\"field.minLength||null\" [maxlength]=\"field.maxLength||null\" [min]=\"field.min\" [max]=\"field.max\" matInput [formControlName]=\"field.name!\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [pattern]=\"(field.pattern??'')\" [onlyNumber]=\"(field.numbersOnly??false)\">\r\n <ngx-colors matSuffix ngx-colors-trigger [formControlName]=\"field.name!\" [hideTextInput]=\"true\" (close)=\"this.formGroup.get(field.name!)?.setValue($event)\" format=\"hex\" class=\"color-picker\"></ngx-colors>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any($any(formGroup.controls[field.name!]))['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n </ng-container>\r\n\r\n <!-- #region Checkbox -->\r\n <div *ngSwitchCase=\"FormFieldType.Checkbox\" [attr.flex]=\"field.flex||0\" class=\"mat-checkbox-wrap\" [class]=\"field.cssClass\">\r\n <mat-checkbox [formControlName]=\"field.name!\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\">{{field.label}}</mat-checkbox>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\" layout-margin>{{errorMessage}}</mat-error>\r\n </div>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Editor -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.Editor\">\r\n <ng-template *ngIf=\"editorTemplate?.templateRef!\" [ngTemplateOutlet]=\"editorTemplate?.templateRef!\" [ngTemplateOutletContext]=\"{ field: field, formGroup: formGroup }\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Code -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.Code\">\r\n <ng-template *ngIf=\"codeTemplate?.templateRef!\" [ngTemplateOutlet]=\"codeTemplate?.templateRef!\" [ngTemplateOutletContext]=\"{ field: field, formGroup: formGroup }\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region File -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.File\">\r\n <mat-form-field [attr.flex]=\"field.flex||0\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <div vd-file-input [formControlName]=\"field.name!\" (select)=\"field.change && field.change(field, $event, formGroup, context)\" [accept]=\"field.fileExtensions\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" flex></div>\r\n </mat-form-field>\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Custom -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.Custom\">\r\n <ng-template *ngIf=\"customTemplate?.templateRef!\" [ngTemplateOutlet]=\"customTemplate?.templateRef!\" [ngTemplateOutletContext]=\"{ field: field, formGroup: formGroup }\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- #region Template for custom fields -->\r\n <ng-container *ngFor=\"let customField of customFieldsTemplates\">\r\n <ng-template *ngIf=\"customField?.templateRef && customField.row == fields[0]?.row && customField.inline\" [ngTemplateOutlet]=\"customField?.templateRef!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n </div>\r\n\r\n <!-- #region Template for custom fields -->\r\n <ng-container *ngIf=\"customFields\" [ngTemplateOutlet]=\"customFields\" [ngTemplateOutletContext]=\"{formGroup: formGroup, row: fields[0].row}\"></ng-container>\r\n <ng-container *ngFor=\"let customField of customFieldsTemplates\">\r\n <ng-template *ngIf=\"customField?.templateRef && customField.row == ((fields[0]?.row??0)+1) && !customField.inline\" [ngTemplateOutlet]=\"customField?.templateRef!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Form bottom -->\r\n <ng-container *ngIf=\"bottom\" [ngTemplateOutlet]=\"bottom\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Template for suffix buttons -->\r\n <ng-template #suffixButtons let-field>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n </ng-template>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Debug value -->\r\n <code *ngIf=\"debugValue\">\r\n <pre>{{formValue | json}}</pre>\r\n </code>\r\n <!-- #endregion -->\r\n</div>", styles: [".mat-checkbox-wrap mat-error{transform:translate(36px,-20px);max-width:93%;font-size:var(--mdc-typography-caption-font-size, 12px)}::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-icon-suffix .color-picker{width:40px;display:block}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-form-field-infix{padding-top:7px!important;padding-bottom:7px!important}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-chip{padding-top:0!important;padding-bottom:0!important;margin-top:2px!important;margin-bottom:2px!important;margin-left:4px!important}\n"] }]
23881
+ args: [{ selector: 'vd-generic-form', template: "<div *ngIf=\"formGroup && fieldRows\" [formGroup]=\"formGroup\">\r\n <!-- #region Fields -->\r\n <ng-container *ngFor=\"let fields of fieldRows; let i = index\">\r\n <div layout-gt-sm=\"row\" layout=\"column\">\r\n <ng-container *ngFor=\"let field of fields\" [ngSwitch]=\"field.type\">\r\n <ng-container *ngIf=\"!field.hidden && !(field.hide && field.hide(formValue, formGroup, context))\">\r\n <ng-container *ngIf=\"field.wrapped\">\r\n <!-- #region Text input -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Text\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input [type]=\"field.inputType ?? 'text'\" [minlength]=\"field.minLength||null\" [maxlength]=\"field.maxLength||null\" [min]=\"field.min\" [max]=\"field.max\" matInput [formControlName]=\"field.name!\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [pattern]=\"(field.pattern??'')\" [onlyNumber]=\"(field.numbersOnly??false)\">\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any($any(formGroup.controls[field.name!]))['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Textarea -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.TextArea\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <textarea matInput [formControlName]=\"field.name!\" rows=\"field.rows||2\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\"></textarea>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Enum -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Enum\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-select [formControlName]=\"field.name!\" [enum]=\"field.enumType\" [enumMetadata]=\"field.enumMetadata\" [enumFilter]=\"field.enumFilter | func:formValue:formGroup:context\" [optionValueProperty]=\"field.optionValueProperty\" [optionTextProperty]=\"field.optionTextProperty\" [defaultOption]=\"field.defaultOption??true\" [multiple]=\"field.multiple\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [triggerCssClass]=\"field.triggerCssClass\" [triggerMode]=\"field.triggerMode\" layout=\"row\" flex>\r\n <ng-template vd-select-trigger let-trigger=\"trigger\" *ngIf=\"field.triggerTemplate\">\r\n <span [innerHTML]=\"field.triggerTemplate(trigger, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" *ngIf=\"field.optionTemplate\">\r\n <span [outerHTML]=\"field.optionTemplate(option, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" let-text=\"text\" *ngIf=\"field.optionIcon && !field.optionTemplate\">\r\n <div layout=\"row\" layout-align=\"start center\">\r\n <ng-template #optionIconTemplate [ngTemplateOutlet]=\"optionIconTemplate\" let-optionIcon=\"optionIcon\" [ngTemplateOutletContext]=\"{ optionIcon: field.optionIcon(option, formValue, formGroup, context) }\">\r\n <mat-icon *ngIf=\"optionIcon.svgIcon\" [svgIcon]=\"optionIcon.svgIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\"></mat-icon>\r\n <mat-icon *ngIf=\"optionIcon.matIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\">{{optionIcon.matIcon}}</mat-icon>\r\n </ng-template>\r\n <span>{{text}}</span>\r\n </div>\r\n </ng-template>\r\n </vd-select>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region VdSelect -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.VdSelect\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-select [formControlName]=\"field.name!\" [endpoint]=\"field.endpoint??'' | func:formValue:formGroup:context\" [params]=\"field.params??{} | func:formValue:formGroup:context\" [projection]=\"field.projection\" [mapper]=\"field.mapper\" [compareWith]=\"field.compareWith\" [loadData]=\"field.fetchCondition | func:formValue:formGroup:context\" [optionValueProperty]=\"field.optionValueProperty\" [optionTextProperty]=\"field.optionTextProperty\" [defaultOption]=\"field.defaultOption??true\" [matIconKey]=\"field.optionMatIconProperty\" [svgIconKey]=\"field.optionSvgIconProperty\" [fontSet]=\"field.optionIconFontSet\" [multiple]=\"field.multiple\" [selectFirst]=\"field.selectFirst\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [triggerCssClass]=\"field.triggerCssClass\" [triggerMode]=\"field.triggerMode\" (itemSelected)=\"field.itemSelect && field.itemSelect($event, formValue, formGroup, context);\" (itemChange)=\"field.itemChange && field.itemChange($event, formValue, formGroup, context);\" layout=\"row\" flex>\r\n <ng-template vd-select-trigger let-trigger=\"trigger\" *ngIf=\"field.triggerTemplate\">\r\n <span [innerHTML]=\"field.triggerTemplate(trigger, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-trigger let-trigger=\"trigger\" *ngIf=\"field.triggerMapper && field.multiple && field.triggerMode == 'chip'\">\r\n <mat-chip-set>\r\n <mat-chip *ngFor=\"let item of trigger\" [color]=\"field.chipColor\" [color]=\"field.chipColor\" highlighted selected>\r\n <span [innerHTML]=\"field.triggerMapper(item, formValue, formGroup, context)\"></span>\r\n </mat-chip>\r\n </mat-chip-set>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" *ngIf=\"field.optionTemplate\">\r\n <span [outerHTML]=\"field.optionTemplate(option, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n <ng-template vd-select-option let-option=\"option\" let-text=\"text\" *ngIf=\"field.optionIcon && !field.optionTemplate\">\r\n <div layout=\"row\" layout-align=\"start center\">\r\n <ng-template #optionIconTemplate [ngTemplateOutlet]=\"optionIconTemplate\" let-optionIcon=\"optionIcon\" [ngTemplateOutletContext]=\"{ optionIcon: field.optionIcon(option, formValue, formGroup, context) }\">\r\n <mat-icon *ngIf=\"optionIcon.svgIcon\" [svgIcon]=\"optionIcon.svgIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\"></mat-icon>\r\n <mat-icon *ngIf=\"optionIcon.matIcon\" [fontSet]=\"optionIcon.fontSet || 'material-symbols-outlined'\" [ngStyle]=\"{ color: optionIcon.iconColor??'' }\">{{optionIcon.matIcon}}</mat-icon>\r\n </ng-template>\r\n <span>{{text}}</span>\r\n </div>\r\n </ng-template>\r\n </vd-select>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region VdList -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.VdList\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" floatLabel=\"always\" class=\"form-field-type-list\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-list [formControlName]=\"field.name!\" [endpoint]=\"field.endpoint??'' | func:formValue:formGroup:context\" [params]=\"field.params ??{} | func:formValue:formGroup:context\" [projection]=\"field.projection\" [mapper]=\"field.mapper\" [compareWith]=\"field.compareWith\" [loadData]=\"field.fetchCondition | func:formValue:formGroup:context\" [optionValueProperty]=\"field.optionValueProperty\" [optionTextProperty]=\"field.optionTextProperty\" [multiple]=\"field.multiple\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" (itemSelected)=\"field.itemSelect && field.itemSelect($event, formValue, formGroup, context);\" (itemChange)=\"field.itemChange && field.itemChange($event, formValue, formGroup, context);\" [style.max-width]=\"field.maxWidth\" [style.max-height]=\"field.maxHeight\" flex>\r\n <ng-template vd-list-option let-option=\"option\" *ngIf=\"field.optionTemplate\">\r\n <span [outerHTML]=\"field.optionTemplate(option, formValue, formGroup, context)\"></span>\r\n </ng-template>\r\n </vd-list>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Chips -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Chips\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <mat-chip-grid #chipList [formControlName]=\"field.name!\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\">\r\n <mat-chip-row *ngFor=\"let chip of $any(formGroup.controls[field.name!])?.value\" (removed)=\"removeChip(field, chip)\" [color]=\"field.chipColor\" selectable=\"true\" highlighted selected>\r\n <span>{{chip}}</span>\r\n <button matChipRemove>\r\n <mat-icon fontSet=\"material-symbols-outlined\">cancel</mat-icon>\r\n </button>\r\n </mat-chip-row>\r\n <input [placeholder]=\"$any(field.label)\" #chipInput [matChipInputFor]=\"chipList\" [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\" [matAutocomplete]=\"chipAutocomplete\" (input)=\"filterAutocomplete(field, chipInput)\" (matChipInputTokenEnd)=\"addChip(field, $event)\" autocomplete=\"off\">\r\n </mat-chip-grid>\r\n <mat-autocomplete autoActiveFirstOption #chipAutocomplete=\"matAutocomplete\" [class]=\"field.autocompleteCssClass\" (optionSelected)=\"autocompleteValueSelected(field, $event, chipInput)\">\r\n <mat-option *ngFor=\"let option of autocompleteFilteredOptions[field.name!]\" [value]=\"option.id\">\r\n {{option.name}}\r\n </mat-option>\r\n </mat-autocomplete>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region VdChips -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.VdChips\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <vd-chips #vdChip [formControlName]=\"field.name!\" [endpoint]=\"field.endpoint??'' | func:formValue:formGroup:context\" [params]=\"field.params || {} | func:formValue:formGroup:context\" [searchField]=\"field.searchField\" [classType]=\"field.classType\" [projection]=\"field.projection\" [key]=\"field.optionValueProperty\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [removable]=\"!field.clear\" [context]=\"context\" [suffixButtons]=\"field.suffixButtons\" [autocompleteCssClass]=\"field.autocompleteCssClass\" (initSelect)=\"field.itemSelect && field.itemSelect($event, formValue, formGroup, context);\" (selected)=\"field.itemChange && field.itemChange($event, formValue, formGroup, context);\" (cleared)=\"field.clear && field.clear(formValue, formGroup, context);\" [customValue]=\"field.customValue\" layout=\"row\" flex>\r\n <ng-template vd-chip let-chip=\"chip\" *ngIf=\"field.chipTemplate\">\r\n <div [outerHTML]=\"field.chipTemplate(chip, formValue, formGroup, context)\"></div>\r\n </ng-template>\r\n <ng-template vd-autocomplete-option let-option=\"option\" *ngIf=\"field.autocompleteTemplate\">\r\n <div [outerHTML]=\"field.autocompleteTemplate(option, formValue, formGroup, context)\"></div>\r\n </ng-template>\r\n </vd-chips>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-hint *ngIf=\"vdChip.emptyResult\" class=\"tc-red-400\" i18n=\"@@noResultsFound\">No results were found.</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Select -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Select\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <mat-select [formControlName]=\"field.name!\" [multiple]=\"field.multiple\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" flex>\r\n <mat-option *ngFor=\"let option of $any(field.options)\" [value]=\"option.id\">{{option.name}}</mat-option>\r\n </mat-select>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Autocomplete -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Autocomplete\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input type=\"text\" matInput [formControlName]=\"field.name!\" [min]=\"field.min\" [max]=\"field.max\" [matAutocomplete]=\"auto\" #autocompleteInput (input)=\"filterAutocomplete(field, autocompleteInput)\" autocomplete=\"off\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\">\r\n <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" [class]=\"field.autocompleteCssClass\">\r\n <mat-option *ngFor=\"let option of autocompleteFilteredOptions[field.name!]\" [value]=\"option.id\">\r\n {{option.name}}\r\n </mat-option>\r\n </mat-autocomplete>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Date -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Date\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input matInput [formControlName]=\"field.name!\" [min]=\"field.min\" [max]=\"field.max\" autocomplete=\"off\" [matDatepicker]=\"datePicker\" [matDatepickerFilter]=\"field.dateFilter\" [readonly]=\"readonly || field.forceSelect || (field.readonly && field.readonly(formValue, formGroup, context))\">\r\n <mat-datepicker-toggle matSuffix [for]=\"datePicker\"></mat-datepicker-toggle>\r\n <mat-datepicker #datePicker [disabled]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" (monthSelected)=\"handleDatePickerFilterAsync(datePicker, field, $event )\" (opened)=\"handleDatePickerOpened(datePicker, field)\" [calendarHeaderComponent]=\"datePickerHeaderComponent\"></mat-datepicker>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Calendar -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Calendar\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" floatLabel=\"always\" class=\"form-field-type-calendar\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input input=\"hidden\" hidden matInput [formControlName]=\"field.name!\">\r\n <mat-calendar #calendar [selected]=\"formGroup.get(field.name!)?.value\" (selectedChange)=\"formGroup.get(field.name!)?.setValue($event);\" (monthSelected)=\"handleCalendarFilterAsync(calendar, field, $event )\" [headerComponent]=\"datePickerHeaderComponent\" style=\"width: 100%;\"></mat-calendar>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\" layout-margin>{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Color input -->\r\n <mat-form-field *ngSwitchCase=\"FormFieldType.Color\" [attr.flex]=\"field.flex||0\" [class]=\"field.cssClass\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <input [type]=\"field.inputType ?? 'text'\" [minlength]=\"field.minLength||null\" [maxlength]=\"field.maxLength||null\" [min]=\"field.min\" [max]=\"field.max\" matInput [formControlName]=\"field.name!\" [readonly]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" [pattern]=\"(field.pattern??'')\" [onlyNumber]=\"(field.numbersOnly??false)\">\r\n <ngx-colors matSuffix ngx-colors-trigger [formControlName]=\"field.name!\" [hideTextInput]=\"true\" (close)=\"this.formGroup.get(field.name!)?.setValue($event)\" format=\"hex\" class=\"color-picker\"></ngx-colors>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n <mat-hint *ngIf=\"field.hint\">{{field.hint}}</mat-hint>\r\n <mat-error *ngFor=\"let errorMessage of $any($any(formGroup.controls[field.name!]))['errorMessages']\">{{errorMessage}}</mat-error>\r\n </mat-form-field>\r\n <!-- #endregion -->\r\n </ng-container>\r\n\r\n <!-- #region Checkbox -->\r\n <div *ngSwitchCase=\"FormFieldType.Checkbox\" [attr.flex]=\"field.flex||0\" class=\"mat-checkbox-wrap\" [class]=\"field.cssClass\">\r\n <mat-checkbox [formControlName]=\"field.name!\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\">{{field.label}}</mat-checkbox>\r\n <mat-error *ngFor=\"let errorMessage of $any(formGroup.controls[field.name!])['errorMessages']\" layout-margin>{{errorMessage}}</mat-error>\r\n </div>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Editor -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.Editor\">\r\n <ng-template *ngIf=\"editorTemplate?.templateRef!\" [ngTemplateOutlet]=\"editorTemplate?.templateRef!\" [ngTemplateOutletContext]=\"{ field: field, formGroup: formGroup }\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Code -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.Code\">\r\n <ng-template *ngIf=\"codeTemplate?.templateRef!\" [ngTemplateOutlet]=\"codeTemplate?.templateRef!\" [ngTemplateOutletContext]=\"{ field: field, formGroup: formGroup }\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region File -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.File\">\r\n <mat-form-field [attr.flex]=\"field.flex||0\" layout-margin>\r\n <mat-label>{{field.label}}</mat-label>\r\n <div vd-file-input [formControlName]=\"field.name!\" (select)=\"field.change && field.change(field, $event, formGroup, context)\" [accept]=\"field.fileExtensions\" [disableControl]=\"(readonly || (field.readonly && field.readonly(formValue, formGroup, context)))??false\" flex></div>\r\n </mat-form-field>\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Custom -->\r\n <ng-container *ngSwitchCase=\"FormFieldType.Custom\">\r\n <ng-template *ngIf=\"customTemplate?.templateRef!\" [ngTemplateOutlet]=\"customTemplate?.templateRef!\" [ngTemplateOutletContext]=\"{ field: field, formGroup: formGroup }\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- #region Template for custom fields -->\r\n <ng-container *ngFor=\"let customField of customFieldsTemplates\">\r\n <ng-template *ngIf=\"customField?.templateRef && customField.row == fields[0]?.row && customField.inline\" [ngTemplateOutlet]=\"customField?.templateRef!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n </div>\r\n\r\n <!-- #region Template for custom fields -->\r\n <ng-container *ngIf=\"customFields\" [ngTemplateOutlet]=\"customFields\" [ngTemplateOutletContext]=\"{formGroup: formGroup, row: fields[0].row}\"></ng-container>\r\n <ng-container *ngFor=\"let customField of customFieldsTemplates\">\r\n <ng-template *ngIf=\"customField?.templateRef && customField.row == ((fields[0]?.row??0)+1) && !customField.inline\" [ngTemplateOutlet]=\"customField?.templateRef!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\r\n </ng-container>\r\n <!-- #endregion -->\r\n </ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Form bottom -->\r\n <ng-container *ngIf=\"bottom\" [ngTemplateOutlet]=\"bottom\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-container>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Template for suffix buttons -->\r\n <ng-template #suffixButtons let-field>\r\n <ng-container *ngFor=\"let suffixButton of field.suffixButtons\" matSuffix>\r\n <button type=\"button\" mat-icon-button *ngIf=\"!suffixButton.hide || !suffixButton.hide(formValue, context)\" (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\r\n <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\r\n </button>\r\n </ng-container>\r\n </ng-template>\r\n <!-- #endregion -->\r\n\r\n <!-- #region Debug value -->\r\n <code *ngIf=\"debugValue\">\r\n <pre>{{formValue | json}}</pre>\r\n </code>\r\n <!-- #endregion -->\r\n</div>", styles: [".mat-checkbox-wrap mat-error{transform:translate(36px,-20px);max-width:93%;font-size:var(--mdc-typography-caption-font-size, 12px)}::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-icon-suffix .color-picker{width:40px;display:block}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-form-field-infix{padding-top:7px!important;padding-bottom:7px!important}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-chip{padding-top:0!important;padding-bottom:0!important;margin-top:2px!important;margin-bottom:2px!important;margin-left:4px!important}\n"] }]
23877
23882
  }], propDecorators: { formGroup: [{
23878
23883
  type: Input
23879
23884
  }], classType: [{