@ng-forge/dynamic-forms-material 0.7.0 → 0.8.0-next.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ng-forge/dynamic-forms-material",
-  "version": "0.7.0",
+  "version": "0.8.0-next.1",
   "description": "Angular Material integration for @ng-forge/dynamic-forms. Pre-built Material Design form components.",
   "type": "module",
   "license": "MIT",
@@ -32,7 +32,7 @@
     "@angular/core": "~21.2.0",
     "@angular/forms": "~21.2.0",
     "@angular/material": "~21.2.0",
-    "@ng-forge/dynamic-forms": "~0.7.0",
+    "@ng-forge/dynamic-forms": "~0.8.0-next.1",
     "rxjs": ">=7.0.0"
   },
   "module": "fesm2022/ng-forge-dynamic-forms-material.mjs",
@@ -49,4 +49,4 @@
   "dependencies": {
     "tslib": "^2.3.0"
   }
-}
+}

package/types/ng-forge-dynamic-forms-material.d.ts

@@ -6,7 +6,7 @@ import { FieldTree } from '@angular/forms/signals';
 import { DynamicText, CheckedFieldComponent, FieldMeta, ValidationMessages, ValueFieldComponent, ValueType, FieldOption, FormEvent, NextPageEvent, PreviousPageEvent, AppendArrayItemEvent, ArrayAllowedChildren, PrependArrayItemEvent, InsertArrayItemEvent, RemoveAtIndexEvent, PopArrayItemEvent, ShiftArrayItemEvent, FieldComponent, FormEventConstructor, ArrayItemContext, FieldTypeDefinition, NarrowFields, RegisteredFieldTypes, InferFormValue, FormConfig } from '@ng-forge/dynamic-forms';
 import { ThemePalette } from '@angular/material/core';
 import * as _angular_material_form_field from '@angular/material/form-field';
-import { MatFormFieldAppearance, SubscriptSizing } from '@angular/material/form-field';
+import { MatFormFieldAppearance, SubscriptSizing, FloatLabelType } from '@angular/material/form-field';
 
 interface MatCheckboxProps {
     color?: ThemePalette;
@@ -73,6 +73,8 @@ interface MatDatepickerProps extends DatepickerProps {
     color?: 'primary' | 'accent' | 'warn';
     disableRipple?: boolean;
     subscriptSizing?: SubscriptSizing;
+    floatLabel?: FloatLabelType;
+    hideRequiredMarker?: boolean;
     startView?: 'month' | 'year' | 'multi-year';
     touchUi?: boolean;
     hint?: DynamicText;
@@ -99,6 +101,8 @@ declare class MatDatepickerFieldComponent implements MatDatepickerComponent {
     readonly defaultValidationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
     readonly effectiveAppearance: _angular_core.Signal<_angular_material_form_field.MatFormFieldAppearance>;
     readonly effectiveSubscriptSizing: _angular_core.Signal<_angular_material_form_field.SubscriptSizing>;
+    readonly effectiveFloatLabel: _angular_core.Signal<_angular_material_form_field.FloatLabelType>;
+    readonly effectiveHideRequiredMarker: _angular_core.Signal<boolean>;
     readonly resolvedErrors: _angular_core.Signal<_ng_forge_dynamic_forms_integration.ResolvedError[]>;
     readonly showErrors: _angular_core.Signal<boolean>;
     readonly errorsToDisplay: _angular_core.Signal<_ng_forge_dynamic_forms_integration.ResolvedError[]>;
@@ -120,6 +124,8 @@ interface MatInputProps extends InputProps {
     appearance?: MatFormFieldAppearance;
     disableRipple?: boolean;
     subscriptSizing?: SubscriptSizing;
+    floatLabel?: FloatLabelType;
+    hideRequiredMarker?: boolean;
     type?: 'text' | 'email' | 'password' | 'number' | 'tel' | 'url';
     hint?: DynamicText;
 }
@@ -167,6 +173,8 @@ declare class MatInputFieldComponent implements MatInputComponent {
     private readonly syncReadonlyToDom;
     readonly effectiveAppearance: _angular_core.Signal<_angular_material_form_field.MatFormFieldAppearance>;
     readonly effectiveSubscriptSizing: _angular_core.Signal<_angular_material_form_field.SubscriptSizing>;
+    readonly effectiveFloatLabel: _angular_core.Signal<_angular_material_form_field.FloatLabelType>;
+    readonly effectiveHideRequiredMarker: _angular_core.Signal<boolean>;
     readonly resolvedErrors: _angular_core.Signal<_ng_forge_dynamic_forms_integration.ResolvedError[]>;
     readonly showErrors: _angular_core.Signal<boolean>;
     readonly errorsToDisplay: _angular_core.Signal<_ng_forge_dynamic_forms_integration.ResolvedError[]>;
@@ -274,6 +282,8 @@ interface MatSelectProps extends SelectProps {
     multiple?: boolean;
     panelMaxHeight?: string;
     subscriptSizing?: SubscriptSizing;
+    floatLabel?: FloatLabelType;
+    hideRequiredMarker?: boolean;
     compareWith?: (o1: ValueType, o2: ValueType) => boolean;
     hint?: DynamicText;
 }
@@ -296,6 +306,8 @@ declare class MatSelectFieldComponent implements MatSelectComponent {
     readonly defaultValidationMessages: _angular_core.InputSignal<ValidationMessages | undefined>;
     readonly effectiveAppearance: _angular_core.Signal<_angular_material_form_field.MatFormFieldAppearance>;
     readonly effectiveSubscriptSizing: _angular_core.Signal<_angular_material_form_field.SubscriptSizing>;
+    readonly effectiveFloatLabel: _angular_core.Signal<_angular_material_form_field.FloatLabelType>;
+    readonly effectiveHideRequiredMarker: _angular_core.Signal<boolean>;
     readonly resolvedErrors: _angular_core.Signal<_ng_forge_dynamic_forms_integration.ResolvedError[]>;
     readonly showErrors: _angular_core.Signal<boolean>;
     readonly errorsToDisplay: _angular_core.Signal<_ng_forge_dynamic_forms_integration.ResolvedError[]>;
@@ -491,6 +503,8 @@ interface MatTextareaProps extends TextareaProps {
     hint?: DynamicText;
     appearance?: MatFormFieldAppearance;
     subscriptSizing?: SubscriptSizing;
+    floatLabel?: FloatLabelType;
+    hideRequiredMarker?: boolean;
     rows?: number;
     cols?: number;
     resize?: 'none' | 'both' | 'horizontal' | 'vertical';
@@ -540,6 +554,8 @@ declare class MatTextareaFieldComponent implements MatTextareaComponent {
     private readonly syncReadonlyToDom;
     readonly effectiveAppearance: _angular_core.Signal<_angular_material_form_field.MatFormFieldAppearance>;
     readonly effectiveSubscriptSizing: _angular_core.Signal<_angular_material_form_field.SubscriptSizing>;
+    readonly effectiveFloatLabel: _angular_core.Signal<_angular_material_form_field.FloatLabelType>;
+    readonly effectiveHideRequiredMarker: _angular_core.Signal<boolean>;
     readonly resolvedErrors: _angular_core.Signal<_ng_forge_dynamic_forms_integration.ResolvedError[]>;
     readonly showErrors: _angular_core.Signal<boolean>;
     readonly errorsToDisplay: _angular_core.Signal<_ng_forge_dynamic_forms_integration.ResolvedError[]>;
@@ -667,6 +683,16 @@ interface MaterialConfig {
      * @default 'after'
      */
     labelPosition?: 'before' | 'after';
+    /**
+     * Default float label behavior for form fields
+     * @default 'auto'
+     */
+    floatLabel?: FloatLabelType;
+    /**
+     * Whether to hide the required marker by default
+     * @default false
+     */
+    hideRequiredMarker?: boolean;
 }
 
 /**
@@ -795,11 +821,14 @@ declare module '@ng-forge/dynamic-forms' {
 }
 
 /**
- * Field type definitions with optional config providers
+ * Field type definitions for Material Design components.
  */
-type FieldTypeDefinitionsWithConfig = FieldTypeDefinition[] & {
-    __configProviders?: Provider[];
+type MaterialFieldTypes = FieldTypeDefinition[];
+type MaterialConfigFeature = {
+    ɵkind: 'material-config';
+    ɵproviders: Provider[];
 };
+type MaterialFieldsWithConfig = [...MaterialFieldTypes, MaterialConfigFeature];
 /**
  * Configure dynamic forms with Material Design field types.
  * Provides all Material Design field types for use with provideDynamicForm.
@@ -835,30 +864,11 @@ type FieldTypeDefinitionsWithConfig = FieldTypeDefinition[] & {
  * };
  * ```
  *
- * @returns Array of field type definitions for Material Design components
+ * @returns Array of field type definitions and optionally a config feature
  */
-declare function withMaterialFields(config?: MaterialConfig): FieldTypeDefinitionsWithConfig;
-/**
- * Module augmentation to extend the global DynamicFormFieldRegistry
- * with Material Design field types
- */
-declare module '@ng-forge/dynamic-forms' {
-    interface DynamicFormFieldRegistry {
-        input: MatInputField;
-        select: MatSelectField<any>;
-        checkbox: MatCheckboxField;
-        button: MatButtonField<any>;
-        submit: MatSubmitButtonField;
-        next: MatNextButtonField;
-        previous: MatPreviousButtonField;
-        textarea: MatTextareaField;
-        radio: MatRadioField<any>;
-        'multi-checkbox': MatMultiCheckboxField<any>;
-        datepicker: MatDatepickerField;
-        slider: MatSliderField;
-        toggle: MatToggleField;
-    }
-}
+declare function withMaterialFields(): MaterialFieldTypes;
+declare function withMaterialFields(config: MaterialConfig): MaterialFieldsWithConfig;
+declare function withMaterialFields(config: MaterialConfig | undefined): MaterialFieldTypes | MaterialFieldsWithConfig;
 
 export { MATERIAL_CONFIG, MATERIAL_FIELD_TYPES, MatButtonFieldComponent, MatCheckboxFieldComponent, MatDatepickerFieldComponent, MatField, MatInputFieldComponent, MatMultiCheckboxFieldComponent, MatRadioFieldComponent, MatSelectFieldComponent, MatSliderFieldComponent, MatTextareaFieldComponent, MatToggleFieldComponent, withMaterialFields };
 export type { AddArrayItemButtonField, InsertArrayItemButtonField, MatButtonField, MatButtonProps, MatCheckboxComponent, MatCheckboxField, MatCheckboxProps, MatDatepickerComponent, MatDatepickerField, MatDatepickerProps, MatFieldType, MatFormConfig, MatFormProps, MatInputComponent, MatInputField, MatInputProps, MatMultiCheckboxComponent, MatMultiCheckboxField, MatMultiCheckboxProps, MatNextButtonField, MatPreviousButtonField, MatRadioComponent, MatRadioField, MatRadioProps, MatSelectComponent, MatSelectField, MatSelectProps, MatSliderComponent, MatSliderField, MatSliderProps, MatSubmitButtonField, MatTextareaComponent, MatTextareaField, MatTextareaProps, MatToggleComponent, MatToggleField, MatToggleProps, MaterialConfig, PopArrayItemButtonField, PrependArrayItemButtonField, RemoveArrayItemButtonField, ShiftArrayItemButtonField };