@maro-tech/form 0.1.1 → 0.1.2

package/types/maro-tech-form.d.ts

@@ -40,7 +40,7 @@ interface UiSelectOption {
     imageUrl?: string;
 }
 type UiSelectValue = string | string[] | null;
-declare class InputSelectComponent implements ControlValueAccessor, OnChanges, Validator {
+declare class InputSelectControlComponent implements ControlValueAccessor, OnChanges, Validator {
     readonly closeIcon: lucide_angular.LucideIconData;
     readonly chevronDownIcon: lucide_angular.LucideIconData;
     readonly checkIcon: lucide_angular.LucideIconData;
@@ -54,15 +54,12 @@ declare class InputSelectComponent implements ControlValueAccessor, OnChanges, V
     name?: string;
     data?: string;
     required: boolean;
-    fullWidth: boolean;
     disabled: boolean;
     multiple: boolean;
     includeBlankOption: boolean;
     blankOptionLabel: string;
     emptyStateLabel: string;
     searchable: boolean;
-    remoteSearch: boolean;
-    searchPlaceholder: string;
     private _options;
     set options(value: UiSelectOption[]);
     get options(): UiSelectOption[];
@@ -121,8 +118,8 @@ declare class InputSelectComponent implements ControlValueAccessor, OnChanges, V
     private normalizeSuggestItem;
     private loadSuggestItems;
     private loadSuggestItem;
-    static ɵfac: i0.ɵɵFactoryDeclaration<InputSelectComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputSelectComponent, "input-select", never, { "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "data": { "alias": "data"; "required": false; }; "required": { "alias": "required"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "includeBlankOption": { "alias": "includeBlankOption"; "required": false; }; "blankOptionLabel": { "alias": "blankOptionLabel"; "required": false; }; "emptyStateLabel": { "alias": "emptyStateLabel"; "required": false; }; "searchable": { "alias": "searchable"; "required": false; }; "remoteSearch": { "alias": "remoteSearch"; "required": false; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; }; "options": { "alias": "options"; "required": false; }; "error": { "alias": "error"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "triggerClass": { "alias": "triggerClass"; "required": false; }; "panelClass": { "alias": "panelClass"; "required": false; }; }, { "valueChange": "valueChange"; "searchChange": "searchChange"; }, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputSelectControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputSelectControlComponent, "input-select-control", never, { "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "data": { "alias": "data"; "required": false; }; "required": { "alias": "required"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "includeBlankOption": { "alias": "includeBlankOption"; "required": false; }; "blankOptionLabel": { "alias": "blankOptionLabel"; "required": false; }; "emptyStateLabel": { "alias": "emptyStateLabel"; "required": false; }; "searchable": { "alias": "searchable"; "required": false; }; "options": { "alias": "options"; "required": false; }; "error": { "alias": "error"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "triggerClass": { "alias": "triggerClass"; "required": false; }; "panelClass": { "alias": "panelClass"; "required": false; }; }, { "valueChange": "valueChange"; "searchChange": "searchChange"; }, never, never, true, never>;
     static ngAcceptInputType_multiple: unknown;
 }
 
@@ -149,61 +146,81 @@ interface UiDynamicFormFieldAction {
     condition?: string;
     variant?: 'primary' | 'secondary' | 'ghost' | 'danger';
 }
-interface UiDynamicFormBaseField {
+interface UiDynamicFormCommonField {
     id: string;
-    type?: UiDynamicFieldType;
     label?: string;
     title?: string;
     placeholder?: string;
     hint?: string;
     required?: boolean;
     disabled?: boolean;
+    col?: number;
+    hidden?: boolean | string;
+    default?: string | number | boolean | string[] | null;
+    actions?: UiDynamicFormFieldAction[];
+    className?: string;
+}
+interface UiDynamicFormTextField extends UiDynamicFormCommonField {
+    type?: Exclude<UiDynamicFieldType, 'select' | 'barcode' | 'checkbox' | 'color' | 'range' | 'file' | 'photo' | 'container' | 'template'>;
+    rows?: number;
+    pattern?: string;
+}
+interface UiDynamicFormSelectField extends UiDynamicFormCommonField {
+    type: 'select';
     data?: string;
     options?: UiSelectOption[];
     searchable?: boolean;
-    rows?: number;
-    fullWidth?: boolean;
-    col?: number;
+    multiple?: boolean;
+    lookupApi?: string;
+    lookupMap?: Record<string, string>;
+    lookupErrorField?: string;
+}
+interface UiDynamicFormFileField extends UiDynamicFormCommonField {
+    type: 'file';
+    accept?: string;
+    multiple?: boolean;
+}
+interface UiDynamicFormPhotoField extends UiDynamicFormCommonField {
+    type: 'photo';
     accept?: string;
     multiple?: boolean;
     limit?: number;
-    hidden?: boolean | string;
-    default?: string | number | boolean | string[] | null;
-    pattern?: string;
-    actions?: UiDynamicFormFieldAction[];
-    className?: string;
-    containerClassName?: string;
-    contentClassName?: string;
-    tag?: 'div' | 'section' | 'aside' | 'fieldset';
-    fields?: UiDynamicFormField[];
-    layout?: 'grid' | 'stack';
-    template?: string;
-    templateContext?: Record<string, unknown>;
-    autoOpen?: boolean;
-    searchButtonLabel?: string;
-    openCameraLabel?: string;
-    closeCameraLabel?: string;
-    cameraTitle?: string;
-    cameraStartingLabel?: string;
-    cameraHint?: string;
+}
+interface UiDynamicFormBarcodeField extends UiDynamicFormCommonField {
+    type: 'barcode';
     lookupApi?: string;
     lookupMap?: Record<string, string>;
     lookupErrorField?: string;
 }
-interface UiDynamicFormContainerField extends UiDynamicFormBaseField {
+interface UiDynamicFormCheckboxField extends UiDynamicFormCommonField {
+    type: 'checkbox';
+}
+interface UiDynamicFormColorField extends UiDynamicFormCommonField {
+    type: 'color';
+}
+interface UiDynamicFormRangeField extends UiDynamicFormCommonField {
+    type: 'range';
+}
+interface UiDynamicFormContainerField extends UiDynamicFormCommonField {
     type: 'container';
     fields: UiDynamicFormField[];
     layout?: 'grid' | 'stack';
+    title?: string;
+    hint?: string;
+    contentClassName?: string;
+    tag?: 'div' | 'section' | 'aside' | 'fieldset';
 }
-interface UiDynamicFormTemplateField extends UiDynamicFormBaseField {
+interface UiDynamicFormTemplateField extends UiDynamicFormCommonField {
     type: 'template';
     template: string;
     templateContext?: Record<string, unknown>;
+    tag?: 'div' | 'section' | 'aside' | 'fieldset';
 }
-type UiDynamicFormField = UiDynamicFormBaseField | UiDynamicFormContainerField | UiDynamicFormTemplateField;
+type UiDynamicFormField = UiDynamicFormTextField | UiDynamicFormSelectField | UiDynamicFormFileField | UiDynamicFormPhotoField | UiDynamicFormBarcodeField | UiDynamicFormCheckboxField | UiDynamicFormColorField | UiDynamicFormRangeField | UiDynamicFormContainerField | UiDynamicFormTemplateField;
 type UiDynamicFormValue = Record<string, string | number | boolean | string[] | File | File[] | null | undefined>;
 declare const isDynamicFormContainerField: (field: UiDynamicFormField) => field is UiDynamicFormContainerField;
 declare const isDynamicFormTemplateField: (field: UiDynamicFormField) => field is UiDynamicFormTemplateField;
+declare const isDynamicFormLookupField: (field: UiDynamicFormField) => field is UiDynamicFormSelectField | UiDynamicFormBarcodeField;
 declare const flattenDynamicFormFields: (fields: UiDynamicFormField[]) => UiDynamicFormField[];
 
 declare class UiFormLookupService {
@@ -258,8 +275,12 @@ declare class DynamicFormComponent implements OnChanges {
     getLookupError(fieldId: string): string;
     isLookupLoading(fieldId: string): boolean;
     resolveClassName(value: unknown): string;
-    isContainerField(field: UiDynamicFormField): boolean;
-    isTemplateField(field: UiDynamicFormField): boolean;
+    isContainerField(field: UiDynamicFormField): field is Extract<UiDynamicFormField, {
+        type: 'container';
+    }>;
+    isTemplateField(field: UiDynamicFormField): field is Extract<UiDynamicFormField, {
+        type: 'template';
+    }>;
     isFieldVisible(field: UiDynamicFormField): boolean;
     resolveInputType(field: UiDynamicFormField): string;
     renderTemplate(field: UiDynamicFormField): string;
@@ -349,7 +370,7 @@ declare class FieldInputComponent implements OnChanges, AfterViewInit {
     value: UiDynamicFormValue[string];
     error: string;
     disabled: boolean;
-    actions: UiDynamicFormFieldAction[];
+    visibleActions: UiDynamicFormFieldAction[];
     valueChange: EventEmitter<unknown>;
     actionTriggered: EventEmitter<UiDynamicFormFieldAction>;
     lookupRequested: EventEmitter<void>;
@@ -365,25 +386,35 @@ declare class FieldInputComponent implements OnChanges, AfterViewInit {
     private render;
     private syncInputs;
     static ɵfac: i0.ɵɵFactoryDeclaration<FieldInputComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<FieldInputComponent, "field-input", never, { "field": { "alias": "field"; "required": false; }; "value": { "alias": "value"; "required": false; }; "error": { "alias": "error"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "valueChange": "valueChange"; "actionTriggered": "actionTriggered"; "lookupRequested": "lookupRequested"; "barcodeScanned": "barcodeScanned"; "filesChange": "filesChange"; "uploadingChange": "uploadingChange"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FieldInputComponent, "field-input", never, { "field": { "alias": "field"; "required": false; }; "value": { "alias": "value"; "required": false; }; "error": { "alias": "error"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "visibleActions": { "alias": "visibleActions"; "required": false; }; }, { "valueChange": "valueChange"; "actionTriggered": "actionTriggered"; "lookupRequested": "lookupRequested"; "barcodeScanned": "barcodeScanned"; "filesChange": "filesChange"; "uploadingChange": "uploadingChange"; }, never, never, true, never>;
+}
+
+declare class FieldFrameComponent {
+    label?: string;
+    hint?: string;
+    error?: string;
+    required: boolean;
+    forId?: string;
+    disabled: boolean;
+    actions: UiDynamicFormFieldAction[];
+    actionTriggered: EventEmitter<UiDynamicFormFieldAction>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FieldFrameComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FieldFrameComponent, "field-frame", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "error": { "alias": "error"; "required": false; }; "required": { "alias": "required"; "required": false; }; "forId": { "alias": "forId"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, ["*"], true, never>;
 }
 
 type UiFormInputType = 'text' | 'number' | 'date' | 'datetime' | 'email' | 'password' | 'textarea' | 'select' | 'checkbox' | 'color' | 'slug' | 'file' | 'photo' | 'barcode';
 declare const UI_FORM_INPUT_REGISTRY: Record<UiFormInputType, Type<unknown>>;
 
-declare class InputBarcodeComponent implements OnChanges, AfterViewInit, OnDestroy {
+declare class InputBarcodeControlComponent implements OnChanges, AfterViewInit, OnDestroy {
+    readonly cameraIcon: lucide_angular.LucideIconData;
+    readonly cameraOffIcon: lucide_angular.LucideIconData;
     readonly value: i0.InputSignal<string>;
     readonly label: i0.InputSignal<string>;
     readonly placeholder: i0.InputSignal<string>;
     readonly hint: i0.InputSignal<string>;
+    readonly error: i0.InputSignal<string>;
+    readonly required: i0.InputSignal<boolean>;
     readonly disabled: i0.InputSignal<boolean>;
-    readonly autoOpen: i0.InputSignal<boolean>;
-    readonly searchButtonLabel: i0.InputSignal<string>;
-    readonly openCameraLabel: i0.InputSignal<string>;
-    readonly closeCameraLabel: i0.InputSignal<string>;
-    readonly cameraTitle: i0.InputSignal<string>;
-    readonly cameraStartingLabel: i0.InputSignal<string>;
-    readonly cameraHint: i0.InputSignal<string>;
     readonly valueChange: i0.OutputEmitterRef<string>;
     readonly scanned: i0.OutputEmitterRef<string>;
     readonly searchRequested: i0.OutputEmitterRef<void>;
@@ -414,15 +445,33 @@ declare class InputBarcodeComponent implements OnChanges, AfterViewInit, OnDestr
     private openZxingCamera;
     private scheduleNativeScan;
     private createNativeBarcodeDetector;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputBarcodeControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputBarcodeControlComponent, "input-barcode-control", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "scanned": "scanned"; "searchRequested": "searchRequested"; "cameraStateChange": "cameraStateChange"; }, never, never, true, never>;
+}
+
+declare class InputBarcodeComponent {
+    value: string;
+    label: string;
+    placeholder: string;
+    hint: string;
+    error: string;
+    required: boolean;
+    disabled: boolean;
+    valueChange: EventEmitter<string>;
+    scanned: EventEmitter<string>;
+    searchRequested: EventEmitter<void>;
+    cameraStateChange: EventEmitter<"error" | "idle" | "starting" | "open">;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputBarcodeComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputBarcodeComponent, "input-barcode", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "autoOpen": { "alias": "autoOpen"; "required": false; "isSignal": true; }; "searchButtonLabel": { "alias": "searchButtonLabel"; "required": false; "isSignal": true; }; "openCameraLabel": { "alias": "openCameraLabel"; "required": false; "isSignal": true; }; "closeCameraLabel": { "alias": "closeCameraLabel"; "required": false; "isSignal": true; }; "cameraTitle": { "alias": "cameraTitle"; "required": false; "isSignal": true; }; "cameraStartingLabel": { "alias": "cameraStartingLabel"; "required": false; "isSignal": true; }; "cameraHint": { "alias": "cameraHint"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "scanned": "scanned"; "searchRequested": "searchRequested"; "cameraStateChange": "cameraStateChange"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputBarcodeComponent, "input-barcode", never, { "value": { "alias": "value"; "required": false; }; "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "error": { "alias": "error"; "required": false; }; "required": { "alias": "required"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "valueChange": "valueChange"; "scanned": "scanned"; "searchRequested": "searchRequested"; "cameraStateChange": "cameraStateChange"; }, never, never, true, never>;
 }
 
 declare class InputCheckboxComponent implements ControlValueAccessor {
     label?: string;
+    hint?: string;
+    error?: string;
+    required: boolean;
     disabled: boolean;
     value: boolean;
-    valueChange: EventEmitter<boolean>;
     private onChange;
     onTouched: () => void;
     writeValue(value: boolean | null): void;
@@ -430,8 +479,19 @@ declare class InputCheckboxComponent implements ControlValueAccessor {
     registerOnTouched(fn: () => void): void;
     setDisabledState(isDisabled: boolean): void;
     onValueChange(event: Event): void;
+    handleValueChange(value: boolean): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputCheckboxComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputCheckboxComponent, "input-checkbox", never, { "label": { "alias": "label"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputCheckboxComponent, "input-checkbox", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "error": { "alias": "error"; "required": false; }; "required": { "alias": "required"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class InputCheckboxControlComponent {
+    value: boolean;
+    disabled: boolean;
+    valueChange: EventEmitter<boolean>;
+    touched: EventEmitter<void>;
+    onValueChange(event: Event): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputCheckboxControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputCheckboxControlComponent, "input-checkbox-control", never, { "value": { "alias": "value"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "valueChange": "valueChange"; "touched": "touched"; }, never, never, true, never>;
 }
 
 declare class InputColorComponent implements ControlValueAccessor, Validator {
@@ -441,7 +501,6 @@ declare class InputColorComponent implements ControlValueAccessor, Validator {
     name?: string;
     id?: string;
     required: boolean;
-    fullWidth: boolean;
     error?: string;
     disabled: boolean;
     value: string;
@@ -458,11 +517,24 @@ declare class InputColorComponent implements ControlValueAccessor, Validator {
     setDisabledState(isDisabled: boolean): void;
     onPickerChange(value: string): void;
     onHexInput(value: string): void;
+    handleValueChange(value: string): void;
     markTouched(): void;
     private normalizeHexInput;
     private isColorValue;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputColorComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputColorComponent, "input-color", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "required": { "alias": "required"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "error": { "alias": "error"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputColorComponent, "input-color", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "required": { "alias": "required"; "required": false; }; "error": { "alias": "error"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class InputColorControlComponent {
+    id?: string;
+    name?: string;
+    disabled: boolean;
+    value: string;
+    pickerValue: string;
+    valueChange: EventEmitter<string>;
+    touched: EventEmitter<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputColorControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputColorControlComponent, "input-color-control", never, { "id": { "alias": "id"; "required": false; }; "name": { "alias": "name"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; "pickerValue": { "alias": "pickerValue"; "required": false; }; }, { "valueChange": "valueChange"; "touched": "touched"; }, never, never, true, never>;
 }
 
 type UiInputElement$6 = 'input' | 'textarea';
@@ -472,7 +544,7 @@ interface CalendarDay$1 {
     currentMonth: boolean;
 }
 type CalendarView$1 = 'days' | 'months' | 'years';
-declare class InputDateComponent implements ControlValueAccessor, Validator {
+declare class InputDateControlComponent implements ControlValueAccessor, Validator {
     private readonly cdr;
     private readonly popupService;
     private readonly closeActivePopup;
@@ -488,7 +560,6 @@ declare class InputDateComponent implements ControlValueAccessor, Validator {
     readonly nextMonthIcon: lucide_angular.LucideIconData;
     rows: number;
     required: boolean;
-    fullWidth: boolean;
     autocomplete: string;
     pattern?: string;
     error?: string;
@@ -541,8 +612,36 @@ declare class InputDateComponent implements ControlValueAccessor, Validator {
     private parseDate;
     private parseInputDate;
     private toDateValue;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputDateControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputDateControlComponent, "input-date-control", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+}
+
+declare class InputDateComponent implements ControlValueAccessor, Validator, AfterViewInit {
+    private control?;
+    label?: string;
+    hint?: string;
+    error?: string;
+    placeholder?: string;
+    name?: string;
+    id?: string;
+    required: boolean;
+    disabled: boolean;
+    autocomplete: string;
+    pattern?: string;
+    rows: number;
+    actions: UiDynamicFormFieldAction[];
+    actionTriggered: EventEmitter<UiDynamicFormFieldAction>;
+    private pendingValue;
+    private onChange;
+    private onTouched;
+    ngAfterViewInit(): void;
+    writeValue(value: string | number | null): void;
+    registerOnChange(fn: (value: string | number | null) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(value: boolean): void;
+    validate(control: AbstractControl): ValidationErrors | null;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputDateComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputDateComponent, "input-date", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputDateComponent, "input-date", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "error": { "alias": "error"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "required": { "alias": "required"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
 }
 
 interface CalendarDay {
@@ -551,7 +650,7 @@ interface CalendarDay {
     currentMonth: boolean;
 }
 type CalendarView = 'days' | 'months' | 'years';
-declare class InputDatetimeComponent implements ControlValueAccessor, Validator {
+declare class InputDatetimeControlComponent implements ControlValueAccessor, Validator {
     private readonly cdr;
     private readonly popupService;
     private readonly closeActivePopup;
@@ -562,7 +661,6 @@ declare class InputDatetimeComponent implements ControlValueAccessor, Validator
     id?: string;
     rows: number;
     required: boolean;
-    fullWidth: boolean;
     autocomplete: string;
     pattern?: string;
     error?: string;
@@ -621,8 +719,36 @@ declare class InputDatetimeComponent implements ControlValueAccessor, Validator
     private startOfMonth;
     private parseDate;
     private toDateValue;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputDatetimeControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputDatetimeControlComponent, "input-datetime-control", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+}
+
+declare class InputDatetimeComponent implements ControlValueAccessor, Validator, AfterViewInit {
+    private control?;
+    label?: string;
+    hint?: string;
+    error?: string;
+    placeholder?: string;
+    name?: string;
+    id?: string;
+    required: boolean;
+    disabled: boolean;
+    autocomplete: string;
+    pattern?: string;
+    rows: number;
+    actions: UiDynamicFormFieldAction[];
+    actionTriggered: EventEmitter<UiDynamicFormFieldAction>;
+    private pendingValue;
+    private onChange;
+    private onTouched;
+    ngAfterViewInit(): void;
+    writeValue(value: string | number | null): void;
+    registerOnChange(fn: (value: string | number | null) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(value: boolean): void;
+    validate(control: AbstractControl): ValidationErrors | null;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputDatetimeComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputDatetimeComponent, "input-datetime", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputDatetimeComponent, "input-datetime", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "error": { "alias": "error"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "required": { "alias": "required"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
 }
 
 type UiInputElement$5 = 'input' | 'textarea';
@@ -637,7 +763,6 @@ declare class InputEmailComponent implements ControlValueAccessor, Validator {
     readonly element: UiInputElement$5;
     rows: number;
     required: boolean;
-    fullWidth: boolean;
     autocomplete?: string;
     pattern?: string;
     error?: string;
@@ -658,18 +783,33 @@ declare class InputEmailComponent implements ControlValueAccessor, Validator {
     onValueChange(value: string): void;
     triggerAction(action: UiDynamicFormFieldAction): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputEmailComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputEmailComponent, "input-email", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputEmailComponent, "input-email", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+}
+
+declare class InputEmailControlComponent {
+    placeholder?: string;
+    name?: string;
+    id?: string;
+    autocomplete?: string;
+    pattern?: string;
+    disabled: boolean;
+    value: string | number | null;
+    valueChange: EventEmitter<string>;
+    touched: EventEmitter<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputEmailControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputEmailControlComponent, "input-email-control", never, { "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; "touched": "touched"; }, never, never, true, never>;
 }
 
 declare class InputFileComponent implements ControlValueAccessor {
     label?: string;
     hint?: string;
+    error?: string;
+    required: boolean;
     accept?: string;
     multiple: boolean;
     disabled: boolean;
-    value: File | File[] | null;
-    valueChange: EventEmitter<File | File[] | null>;
     filesChange: EventEmitter<File[]>;
+    value: File | File[] | null;
     private onChange;
     onTouched: () => void;
     writeValue(value: File | File[] | null): void;
@@ -678,9 +818,23 @@ declare class InputFileComponent implements ControlValueAccessor {
     setDisabledState(isDisabled: boolean): void;
     get selectedFiles(): File[];
     onFilesSelected(event: Event): void;
+    handleFilesSelected(files: File[]): void;
     remove(index: number): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputFileComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputFileComponent, "input-file", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "accept": { "alias": "accept"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; "filesChange": "filesChange"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputFileComponent, "input-file", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "error": { "alias": "error"; "required": false; }; "required": { "alias": "required"; "required": false; }; "accept": { "alias": "accept"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "filesChange": "filesChange"; }, never, never, true, never>;
+}
+
+declare class InputFileControlComponent {
+    accept?: string;
+    multiple: boolean;
+    disabled: boolean;
+    selectedFiles: File[];
+    filesSelected: EventEmitter<File[]>;
+    removeFile: EventEmitter<number>;
+    touched: EventEmitter<void>;
+    onFilesSelected(event: Event): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputFileControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputFileControlComponent, "input-file-control", never, { "accept": { "alias": "accept"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "selectedFiles": { "alias": "selectedFiles"; "required": false; }; }, { "filesSelected": "filesSelected"; "removeFile": "removeFile"; "touched": "touched"; }, never, never, true, never>;
 }
 
 type UiInputElement$4 = 'input' | 'textarea';
@@ -695,7 +849,6 @@ declare class InputComponent implements ControlValueAccessor {
     element: UiInputElement$4;
     rows: number;
     required: boolean;
-    fullWidth: boolean;
     autocomplete?: string;
     pattern?: string;
     error?: string;
@@ -715,7 +868,24 @@ declare class InputComponent implements ControlValueAccessor {
     onValueChange(value: string): void;
     triggerAction(action: UiDynamicFormFieldAction): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputComponent, "input-base", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "type": { "alias": "type"; "required": false; }; "element": { "alias": "element"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputComponent, "input-base", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "type": { "alias": "type"; "required": false; }; "element": { "alias": "element"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+}
+
+declare class InputBaseControlComponent {
+    placeholder?: string;
+    name?: string;
+    id?: string;
+    type: string;
+    element: 'input' | 'textarea';
+    rows: number;
+    autocomplete?: string;
+    pattern?: string;
+    disabled: boolean;
+    value: string | number | null;
+    valueChange: EventEmitter<string>;
+    touched: EventEmitter<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputBaseControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputBaseControlComponent, "input-base-control", never, { "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "type": { "alias": "type"; "required": false; }; "element": { "alias": "element"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; "touched": "touched"; }, never, never, true, never>;
 }
 
 type UiInputElement$3 = 'input' | 'textarea';
@@ -730,7 +900,6 @@ declare class InputNumberComponent implements ControlValueAccessor, Validator {
     readonly element: UiInputElement$3;
     rows: number;
     required: boolean;
-    fullWidth: boolean;
     autocomplete?: string;
     disabled: boolean;
     pattern?: string;
@@ -752,7 +921,19 @@ declare class InputNumberComponent implements ControlValueAccessor, Validator {
     preventWheelChange(event: WheelEvent): void;
     triggerAction(action: UiDynamicFormFieldAction): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputNumberComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputNumberComponent, "input-number", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputNumberComponent, "input-number", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+}
+
+declare class InputNumberControlComponent {
+    placeholder?: string;
+    name?: string;
+    id?: string;
+    disabled: boolean;
+    value: string | number | null;
+    valueChange: EventEmitter<string>;
+    touched: EventEmitter<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputNumberControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputNumberControlComponent, "input-number-control", never, { "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; "touched": "touched"; }, never, never, true, never>;
 }
 
 type UiInputElement$2 = 'input' | 'textarea';
@@ -769,7 +950,6 @@ declare class InputPasswordComponent implements ControlValueAccessor, Validator
     readonly element: UiInputElement$2;
     rows: number;
     required: boolean;
-    fullWidth: boolean;
     autocomplete?: string;
     pattern?: string;
     error?: string;
@@ -792,7 +972,24 @@ declare class InputPasswordComponent implements ControlValueAccessor, Validator
     togglePassword(event: Event): void;
     triggerAction(action: UiDynamicFormFieldAction): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputPasswordComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputPasswordComponent, "input-password", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputPasswordComponent, "input-password", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+}
+
+declare class InputPasswordControlComponent {
+    readonly showIcon: lucide_angular.LucideIconData;
+    readonly hideIcon: lucide_angular.LucideIconData;
+    placeholder?: string;
+    name?: string;
+    id?: string;
+    autocomplete?: string;
+    pattern?: string;
+    disabled: boolean;
+    value: string | number | null;
+    valueChange: EventEmitter<string>;
+    touched: EventEmitter<void>;
+    visible: boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputPasswordControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputPasswordControlComponent, "input-password-control", never, { "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; "touched": "touched"; }, never, never, true, never>;
 }
 
 interface UiPhotoPreview {
@@ -805,14 +1002,15 @@ declare class InputPhotoComponent implements OnChanges, OnDestroy, ControlValueA
     private readonly http;
     label?: string;
     hint?: string;
+    error?: string;
+    required: boolean;
     accept: string;
     multiple: boolean;
     limit: number;
     disabled: boolean;
-    value: string | string[] | null;
-    valueChange: EventEmitter<string | string[] | null>;
     filesChange: EventEmitter<File[]>;
     uploadingChange: EventEmitter<boolean>;
+    value: string | string[] | null;
     pendingFiles: File[];
     previews: UiPhotoPreview[];
     uploading: boolean;
@@ -827,6 +1025,7 @@ declare class InputPhotoComponent implements OnChanges, OnDestroy, ControlValueA
     ngOnDestroy(): void;
     get canSelectMore(): boolean;
     onFilesSelected(event: Event): void;
+    handleFilesSelected(files: File[]): void;
     remove(index: number): void;
     drop(event: CdkDragDrop<UiPhotoPreview[]>): void;
     private get ids();
@@ -839,7 +1038,22 @@ declare class InputPhotoComponent implements OnChanges, OnDestroy, ControlValueA
     private resolveImageUrl;
     private isPreviewableType;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputPhotoComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputPhotoComponent, "input-photo", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "accept": { "alias": "accept"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "limit": { "alias": "limit"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; "filesChange": "filesChange"; "uploadingChange": "uploadingChange"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputPhotoComponent, "input-photo", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "error": { "alias": "error"; "required": false; }; "required": { "alias": "required"; "required": false; }; "accept": { "alias": "accept"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "limit": { "alias": "limit"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "filesChange": "filesChange"; "uploadingChange": "uploadingChange"; }, never, never, true, never>;
+}
+
+declare class InputPhotoControlComponent {
+    accept: string;
+    multiple: boolean;
+    disabled: boolean;
+    canSelectMore: boolean;
+    previews: UiPhotoPreview[];
+    filesSelected: EventEmitter<File[]>;
+    removed: EventEmitter<number>;
+    dropped: EventEmitter<CdkDragDrop<UiPhotoPreview[], UiPhotoPreview[], any>>;
+    touched: EventEmitter<void>;
+    selectFiles(event: Event): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputPhotoControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputPhotoControlComponent, "input-photo-control", never, { "accept": { "alias": "accept"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "canSelectMore": { "alias": "canSelectMore"; "required": false; }; "previews": { "alias": "previews"; "required": false; }; }, { "filesSelected": "filesSelected"; "removed": "removed"; "dropped": "dropped"; "touched": "touched"; }, never, never, true, never>;
 }
 
 interface UiPhotoGalleryEntry {
@@ -852,6 +1066,9 @@ interface UiPhotoGalleryEntry {
 declare class InputPhotoGalleryComponent implements OnInit, OnChanges, OnDestroy {
     private readonly http;
     label: string;
+    hint?: string;
+    error?: string;
+    required: boolean;
     orderLabel: string;
     imageIds: string[];
     disabled: boolean;
@@ -875,10 +1092,14 @@ declare class InputPhotoGalleryComponent implements OnInit, OnChanges, OnDestroy
     private uploadPendingImages;
     private uploadFile;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputPhotoGalleryComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputPhotoGalleryComponent, "input-photo-gallery", never, { "label": { "alias": "label"; "required": false; }; "orderLabel": { "alias": "orderLabel"; "required": false; }; "imageIds": { "alias": "imageIds"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "afterUpload": { "alias": "afterUpload"; "required": false; }; "resolveImageUrl": { "alias": "resolveImageUrl"; "required": false; }; "notify": { "alias": "notify"; "required": false; }; }, { "imageIdsChange": "imageIdsChange"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputPhotoGalleryComponent, "input-photo-gallery", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "error": { "alias": "error"; "required": false; }; "required": { "alias": "required"; "required": false; }; "orderLabel": { "alias": "orderLabel"; "required": false; }; "imageIds": { "alias": "imageIds"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "afterUpload": { "alias": "afterUpload"; "required": false; }; "resolveImageUrl": { "alias": "resolveImageUrl"; "required": false; }; "notify": { "alias": "notify"; "required": false; }; }, { "imageIdsChange": "imageIdsChange"; }, never, never, true, never>;
 }
 
 declare class InputRangeSliderComponent implements OnChanges, AfterViewInit {
+    label?: string;
+    hint?: string;
+    error?: string;
+    required: boolean;
     min: number;
     max: number;
     step: number;
@@ -908,7 +1129,41 @@ declare class InputRangeSliderComponent implements OnChanges, AfterViewInit {
     private syncNativeInputs;
     private syncNativeInput;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputRangeSliderComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputRangeSliderComponent, "input-range-slider", never, { "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "step": { "alias": "step"; "required": false; }; "startValue": { "alias": "startValue"; "required": false; }; "endValue": { "alias": "endValue"; "required": false; }; "startLabel": { "alias": "startLabel"; "required": false; }; "endLabel": { "alias": "endLabel"; "required": false; }; }, { "startValueChange": "startValueChange"; "endValueChange": "endValueChange"; "interactionEnd": "interactionEnd"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputRangeSliderComponent, "input-range-slider", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "error": { "alias": "error"; "required": false; }; "required": { "alias": "required"; "required": false; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "step": { "alias": "step"; "required": false; }; "startValue": { "alias": "startValue"; "required": false; }; "endValue": { "alias": "endValue"; "required": false; }; "startLabel": { "alias": "startLabel"; "required": false; }; "endLabel": { "alias": "endLabel"; "required": false; }; }, { "startValueChange": "startValueChange"; "endValueChange": "endValueChange"; "interactionEnd": "interactionEnd"; }, never, never, true, never>;
+}
+
+declare class InputSelectComponent implements ControlValueAccessor, Validator, AfterViewInit {
+    private control?;
+    label?: string;
+    hint?: string;
+    error?: string;
+    placeholder?: string;
+    name?: string;
+    data?: string;
+    required: boolean;
+    disabled: boolean;
+    multiple: boolean;
+    includeBlankOption: boolean;
+    blankOptionLabel: string;
+    emptyStateLabel: string;
+    searchable: boolean;
+    options: UiSelectOption[];
+    triggerClass: string;
+    panelClass: string;
+    valueChange: EventEmitter<UiSelectValue>;
+    searchChange: EventEmitter<string>;
+    private pendingValue;
+    private onChange;
+    private onTouched;
+    ngAfterViewInit(): void;
+    writeValue(value: UiSelectValue): void;
+    registerOnChange(fn: (value: UiSelectValue) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    validate(control: AbstractControl): ValidationErrors | null;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputSelectComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputSelectComponent, "input-select", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "error": { "alias": "error"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "data": { "alias": "data"; "required": false; }; "required": { "alias": "required"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "includeBlankOption": { "alias": "includeBlankOption"; "required": false; }; "blankOptionLabel": { "alias": "blankOptionLabel"; "required": false; }; "emptyStateLabel": { "alias": "emptyStateLabel"; "required": false; }; "searchable": { "alias": "searchable"; "required": false; }; "options": { "alias": "options"; "required": false; }; "triggerClass": { "alias": "triggerClass"; "required": false; }; "panelClass": { "alias": "panelClass"; "required": false; }; }, { "valueChange": "valueChange"; "searchChange": "searchChange"; }, never, never, true, never>;
+    static ngAcceptInputType_multiple: unknown;
 }
 
 declare class InputSlugComponent implements ControlValueAccessor, Validator {
@@ -918,7 +1173,6 @@ declare class InputSlugComponent implements ControlValueAccessor, Validator {
     name?: string;
     id?: string;
     required: boolean;
-    fullWidth: boolean;
     autocomplete: string;
     error?: string;
     invalidInput: EventEmitter<void>;
@@ -935,9 +1189,23 @@ declare class InputSlugComponent implements ControlValueAccessor, Validator {
     validate(control: AbstractControl): ValidationErrors | null;
     setDisabledState(isDisabled: boolean): void;
     onValueChange(target: HTMLInputElement): void;
+    handleValueChange(value: string): void;
     private normalizeSlug;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputSlugComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputSlugComponent, "input-slug", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "required": { "alias": "required"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "error": { "alias": "error"; "required": false; }; }, { "invalidInput": "invalidInput"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputSlugComponent, "input-slug", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "required": { "alias": "required"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "error": { "alias": "error"; "required": false; }; }, { "invalidInput": "invalidInput"; }, never, never, true, never>;
+}
+
+declare class InputSlugControlComponent {
+    placeholder?: string;
+    name?: string;
+    id?: string;
+    autocomplete: string;
+    disabled: boolean;
+    value: string;
+    valueChange: EventEmitter<string>;
+    touched: EventEmitter<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputSlugControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputSlugControlComponent, "input-slug-control", never, { "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; "touched": "touched"; }, never, never, true, never>;
 }
 
 type UiInputElement$1 = 'input' | 'textarea';
@@ -952,7 +1220,6 @@ declare class InputTextComponent implements ControlValueAccessor, Validator {
     readonly element: UiInputElement$1;
     rows: number;
     required: boolean;
-    fullWidth: boolean;
     autocomplete?: string;
     pattern?: string;
     error?: string;
@@ -973,7 +1240,24 @@ declare class InputTextComponent implements ControlValueAccessor, Validator {
     onValueChange(value: string): void;
     triggerAction(action: UiDynamicFormFieldAction): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputTextComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputTextComponent, "input-text", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputTextComponent, "input-text", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+}
+
+declare class InputTextControlComponent {
+    placeholder?: string;
+    name?: string;
+    id?: string;
+    type: string;
+    element: 'input' | 'textarea';
+    rows: number;
+    autocomplete?: string;
+    pattern?: string;
+    disabled: boolean;
+    value: string | number | null;
+    valueChange: EventEmitter<string>;
+    touched: EventEmitter<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputTextControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputTextControlComponent, "input-text-control", never, { "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "type": { "alias": "type"; "required": false; }; "element": { "alias": "element"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; "touched": "touched"; }, never, never, true, never>;
 }
 
 type UiInputElement = 'input' | 'textarea';
@@ -988,7 +1272,6 @@ declare class InputTextareaComponent implements ControlValueAccessor, Validator
     readonly element: UiInputElement;
     rows: number;
     required: boolean;
-    fullWidth: boolean;
     autocomplete?: string;
     pattern?: string;
     error?: string;
@@ -1009,8 +1292,21 @@ declare class InputTextareaComponent implements ControlValueAccessor, Validator
     onValueChange(value: string): void;
     triggerAction(action: UiDynamicFormFieldAction): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputTextareaComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputTextareaComponent, "input-textarea", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputTextareaComponent, "input-textarea", never, { "label": { "alias": "label"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "required": { "alias": "required"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "error": { "alias": "error"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionTriggered": "actionTriggered"; }, never, never, true, never>;
+}
+
+declare class InputTextareaControlComponent {
+    placeholder?: string;
+    name?: string;
+    id?: string;
+    rows: number;
+    disabled: boolean;
+    value: string | number | null;
+    valueChange: EventEmitter<string>;
+    touched: EventEmitter<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputTextareaControlComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputTextareaControlComponent, "input-textarea-control", never, { "placeholder": { "alias": "placeholder"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; "touched": "touched"; }, never, never, true, never>;
 }
 
-export { ACTION_API, ACTION_FORM, ACTION_PRINT, ACTION_SUBMIT, DynamicFormComponent, FieldInputComponent, FormModalComponent, InputBarcodeComponent, InputCheckboxComponent, InputColorComponent, InputComponent, InputDateComponent, InputDatetimeComponent, InputEmailComponent, InputFileComponent, InputNumberComponent, InputPasswordComponent, InputPhotoComponent, InputPhotoGalleryComponent, InputRangeSliderComponent, InputSelectComponent, InputSlugComponent, InputTextComponent, InputTextareaComponent, MaroFormsApiService, UI_FORM_INPUT_REGISTRY, UiFormContext, UiFormLookupService, flattenDynamicFormFields, isDynamicFormContainerField, isDynamicFormTemplateField };
-export type { ActionType, ApiPluginMethod, MaroFormViewAction, MaroFormViewResponse, UiDynamicFieldType, UiDynamicFormBaseField, UiDynamicFormContainerField, UiDynamicFormField, UiDynamicFormFieldAction, UiDynamicFormTemplateField, UiDynamicFormValue, UiFormErrors, UiFormInputType, UiFormSubmitState, UiFormValue, UiPhotoGalleryEntry, UiPhotoPreview, UiSelectOption, UiSelectValue };
+export { ACTION_API, ACTION_FORM, ACTION_PRINT, ACTION_SUBMIT, DynamicFormComponent, FieldFrameComponent, FieldInputComponent, FormModalComponent, InputBarcodeComponent, InputBarcodeControlComponent, InputBaseControlComponent, InputCheckboxComponent, InputCheckboxControlComponent, InputColorComponent, InputColorControlComponent, InputComponent, InputDateComponent, InputDateControlComponent, InputDatetimeComponent, InputDatetimeControlComponent, InputEmailComponent, InputEmailControlComponent, InputFileComponent, InputFileControlComponent, InputNumberComponent, InputNumberControlComponent, InputPasswordComponent, InputPasswordControlComponent, InputPhotoComponent, InputPhotoControlComponent, InputPhotoGalleryComponent, InputRangeSliderComponent, InputSelectComponent, InputSelectControlComponent, InputSlugComponent, InputSlugControlComponent, InputTextComponent, InputTextControlComponent, InputTextareaComponent, InputTextareaControlComponent, MaroFormsApiService, UI_FORM_INPUT_REGISTRY, UiFormContext, UiFormLookupService, flattenDynamicFormFields, isDynamicFormContainerField, isDynamicFormLookupField, isDynamicFormTemplateField };
+export type { ActionType, ApiPluginMethod, MaroFormViewAction, MaroFormViewResponse, UiDynamicFieldType, UiDynamicFormBarcodeField, UiDynamicFormCheckboxField, UiDynamicFormColorField, UiDynamicFormCommonField, UiDynamicFormContainerField, UiDynamicFormField, UiDynamicFormFieldAction, UiDynamicFormFileField, UiDynamicFormPhotoField, UiDynamicFormRangeField, UiDynamicFormSelectField, UiDynamicFormTemplateField, UiDynamicFormTextField, UiDynamicFormValue, UiFormErrors, UiFormInputType, UiFormSubmitState, UiFormValue, UiPhotoGalleryEntry, UiPhotoPreview, UiSelectOption, UiSelectValue };