@dereekb/dbx-form 13.2.1 → 13.3.0

package/fesm2022/dereekb-dbx-form.mjs

@@ -76,20 +76,47 @@ var DbxFormState;
      */
     DbxFormState[DbxFormState["USED"] = 1] = "USED";
 })(DbxFormState || (DbxFormState = {}));
+/**
+ * Default key used when disabling/enabling a form without specifying a custom key.
+ */
 const DEFAULT_FORM_DISABLED_KEY = 'dbx_form_disabled';
 /**
  * Form that has an event stream, value, and state items.
  */
 class DbxForm {
 }
+/**
+ * Mutable extension of {@link DbxForm} that supports setting values, resetting, and disabling the form.
+ *
+ * @typeParam T - The form value type.
+ */
 class DbxMutableForm extends DbxForm {
 }
+/**
+ * Provides the given type as a {@link DbxForm} in Angular's dependency injection system.
+ *
+ * @param sourceType - The concrete form type to register as a provider.
+ * @returns An array of Angular providers.
+ */
 function provideDbxForm(sourceType) {
     return [{ provide: DbxForm, useExisting: forwardRef(() => sourceType) }];
 }
+/**
+ * Provides the given type as both a {@link DbxForm} and {@link DbxMutableForm} in Angular's dependency injection system.
+ *
+ * @param sourceType - The concrete mutable form type to register as a provider.
+ * @returns An array of Angular providers.
+ */
 function provideDbxMutableForm(sourceType) {
     return [...provideDbxForm(sourceType), { provide: DbxMutableForm, useExisting: forwardRef(() => sourceType) }];
 }
+/**
+ * Enables or disables an Angular form control based on the provided flag.
+ *
+ * @param form - The Angular abstract control to enable or disable.
+ * @param isDisabled - Whether to disable (`true`) or enable (`false`) the control.
+ * @param config - Optional configuration passed to the control's `disable()` or `enable()` methods.
+ */
 function toggleDisableFormControl(form, isDisabled, config) {
     if (isDisabled) {
         form.disable(config);
@@ -99,6 +126,9 @@ function toggleDisableFormControl(form, isDisabled, config) {
     }
 }
 
+/**
+ * Disabled key used by {@link DbxActionFormDirective} to manage the form's disabled state during action processing.
+ */
 const APP_ACTION_FORM_DISABLED_KEY = 'dbx_action_form';
 /**
  * Used with an action to bind a form to an action as it's value source.
@@ -106,6 +136,11 @@ const APP_ACTION_FORM_DISABLED_KEY = 'dbx_action_form';
  * If the form has errors when the action is trigger, it will reject the action.
  *
  * If the source is not considered modified, the trigger will be ignored.
+ *
+ * @selector `[dbxActionForm]`
+ *
+ * @typeParam T - The form value type.
+ * @typeParam O - The output value type passed to the action source.
  */
 class DbxActionFormDirective {
     form = inject((DbxMutableForm), { host: true });
@@ -227,6 +262,13 @@ class DbxActionFormDirective {
             this.form.setDisabled(APP_ACTION_FORM_DISABLED_KEY, disable);
         });
     }
+    /**
+     * Checks whether the given form value is both valid and modified, optionally applying override functions.
+     *
+     * @param value - The current form value to check.
+     * @param overrides - Optional override functions for the validity and modification checks.
+     * @returns An observable emitting a tuple of `[isValid, isModified]`.
+     */
     checkIsValidAndIsModified(value, overrides) {
         const { isModifiedFunction: overrideIsModifiedFunction, isValidFunction: overrideIsValidFunction } = overrides ?? {};
         const isValidFunctionObs = overrideIsValidFunction != null ? of(overrideIsValidFunction) : this.isValidFunction$;
@@ -235,9 +277,21 @@ class DbxActionFormDirective {
             return combineLatest([isValid(value), isModified(value)]).pipe(map(([valid, modified]) => [valid, modified]));
         }));
     }
+    /**
+     * Pre-checks whether the form value is valid and modified before marking it as ready.
+     *
+     * @param value - The current form value.
+     * @returns An observable emitting a tuple of `[isValid, isModified]`.
+     */
     preCheckReadyValue(value) {
         return this.checkIsValidAndIsModified(value);
     }
+    /**
+     * Transforms the form value into an action value result, applying the optional map function if provided.
+     *
+     * @param value - The validated form value.
+     * @returns An observable emitting the action value getter result.
+     */
     readyValue(value) {
         return this.mapValueFunction$.pipe(switchMap((mapFunction) => {
             if (mapFunction) {
@@ -260,12 +314,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }], ctorParameters: () => [], propDecorators: { dbxActionFormDisabledOnWorking: [{ type: i0.Input, args: [{ isSignal: true, alias: "dbxActionFormDisabledOnWorking", required: false }] }], dbxActionFormIsValid: [{ type: i0.Input, args: [{ isSignal: true, alias: "dbxActionFormIsValid", required: false }] }], dbxActionFormIsEqual: [{ type: i0.Input, args: [{ isSignal: true, alias: "dbxActionFormIsEqual", required: false }] }], dbxActionFormIsModified: [{ type: i0.Input, args: [{ isSignal: true, alias: "dbxActionFormIsModified", required: false }] }], dbxActionFormMapValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "dbxActionFormMapValue", required: false }] }] } });
 
 /**
- * Extension of DbxActionTransitionSafetyDirective that forces the form to update first.
+ * Extension of {@link DbxActionTransitionSafetyDirective} that forces the form to update before
+ * evaluating transition safety. This ensures the latest form state is considered when deciding
+ * whether to block or allow a route transition.
+ *
+ * NOTE: Only works with UIRouter.
  *
- * NOTE: Only works with UIRouter
+ * @selector `[dbxActionFormSafety]`
+ *
+ * @typeParam T - The form value type.
+ * @typeParam O - The output value type passed to the action source.
  */
 class DbxActionFormSafetyDirective extends DbxActionTransitionSafetyDirective {
     dbxActionForm = inject((DbxActionFormDirective), { host: true });
+    /**
+     * The safety type that controls when transitions are blocked.
+     *
+     * Defaults to `'auto'`, which blocks transitions when the form has unsaved changes.
+     */
     dbxActionFormSafety = input('auto', ...(ngDevMode ? [{ debugName: "dbxActionFormSafety" }] : []));
     _dbxActionFormSafetyUpdateEffect = effect(() => this._safetyType.next(this.dbxActionFormSafety()), ...(ngDevMode ? [{ debugName: "_dbxActionFormSafetyUpdateEffect" }] : []));
     _handleOnBeforeTransition(transition) {
@@ -559,9 +625,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }], ctorParameters: () => [], propDecorators: { formlyForm: [{ type: i0.ViewChild, args: [i0.forwardRef(() => FormlyForm), { isSignal: true }] }] } });
 
+/**
+ * Creates an observable that pipes input values to a form based on the specified mode.
+ *
+ * This is a convenience wrapper around {@link dbxFormSourceObservableFromStream} that
+ * extracts the stream from the form instance.
+ *
+ * @param form - The mutable form to derive stream state from.
+ * @param inputObs - The source observable or value to pipe into the form.
+ * @param modeObs - Observable controlling when values are forwarded (reset, always, or every).
+ * @returns An observable of values to be set on the form.
+ */
 function dbxFormSourceObservable(form, inputObs, modeObs) {
     return dbxFormSourceObservableFromStream(form.stream$, inputObs, modeObs);
 }
+/**
+ * Creates an observable that pipes input values to a form based on the form's stream state and the specified mode.
+ *
+ * - `'reset'`: Only forwards the value when the form enters the RESET state.
+ * - `'always'`: Forwards values while not initializing, with throttling and loop detection.
+ * - `'every'`: Forwards values while not initializing, without throttling or loop protection.
+ *
+ * @param streamObs - Observable of the form's state stream.
+ * @param inputObs - The source observable or value to pipe into the form.
+ * @param modeObs - Observable or value controlling when values are forwarded.
+ * @returns An observable of values to be set on the form.
+ */
 function dbxFormSourceObservableFromStream(streamObs, inputObs, modeObs) {
     const value$ = asObservable(inputObs).pipe(shareReplay(1)); // catch/share the latest emission
     const state$ = streamObs.pipe(map((x) => x.state), distinctUntilChanged());
@@ -618,11 +707,26 @@ function dbxFormSourceObservableFromStream(streamObs, inputObs, modeObs) {
     }));
 }
 /**
- * Used with a FormComponent to set the value based on the input value.
+ * Directive that sets a form's value based on an input observable or value source.
+ *
+ * Supports different modes for when the value is forwarded to the form:
+ * - `'reset'` (default): Only sets the form value when the form is reset.
+ * - `'always'`: Sets the form value on every emission, with throttling and loop detection.
+ * - `'every'`: Sets the form value on every emission, without throttling.
+ *
+ * @selector `[dbxFormSource]`
+ *
+ * @typeParam T - The form value type.
  */
 class DbxFormSourceDirective {
     form = inject((DbxMutableForm), { host: true });
+    /**
+     * The mode controlling when the source value is forwarded to the form.
+     */
     dbxFormSourceMode = input(...(ngDevMode ? [undefined, { debugName: "dbxFormSourceMode" }] : []));
+    /**
+     * The source value or observable to pipe into the form.
+     */
     dbxFormSource = input(...(ngDevMode ? [undefined, { debugName: "dbxFormSource" }] : []));
     _effectSub = cleanSubscription();
     _setFormSourceObservableEffect = effect(() => {
@@ -648,7 +752,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }], propDecorators: { dbxFormSourceMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "dbxFormSourceMode", required: false }] }], dbxFormSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dbxFormSource", required: false }] }] } });
 
 /**
+ * A standalone dialog component that renders a dynamic Formly form within a Material dialog.
+ *
+ * Provides a header, a configurable form, and a submit button wired to an action handler.
+ * The dialog closes with the submitted form value on success, or `undefined` if dismissed.
  *
+ * Use {@link DbxFormActionDialogComponent.openDialogWithForm} to open the dialog programmatically.
+ *
+ * @typeParam O - The form value type produced by the dialog.
  */
 class DbxFormActionDialogComponent extends AbstractDialogDirective {
     _fieldsSub = cleanSubscription();
@@ -665,10 +776,20 @@ class DbxFormActionDialogComponent extends AbstractDialogDirective {
             this.context.fields = fields;
         }));
     }
+    /**
+     * Action handler that marks the action as successful and closes the dialog with the submitted value.
+     */
     handleSubmitValue = (value, context) => {
         context.success();
         this.close(value);
     };
+    /**
+     * Opens a new dialog with a dynamic Formly form using the provided configuration.
+     *
+     * @param matDialog - The Angular Material dialog service.
+     * @param config - Configuration for the dialog, including fields, header, and initial value.
+     * @returns A reference to the opened dialog, which resolves to the submitted value or `undefined`.
+     */
     static openDialogWithForm(matDialog, config) {
         const dialogRef = matDialog.open((DbxFormActionDialogComponent), {
             width: '90vw',
@@ -710,15 +831,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Default mode for the {@link DbxFormLoadingSourceDirective}, which only passes values on form reset.
+ */
 const DEFAULT_DBX_FORM_LOADING_SOURCE_DIRECTIVE_MODE = 'reset';
 /**
- * Used with a FormComponent to set the value from a LoadingState when the value is available.
+ * Directive that sets a form's value from a {@link LoadingState} source once loading is complete.
  *
- * Only passes non-null values from the source.
+ * Only passes non-null values from the source. Extracts the value from the finished loading state
+ * and forwards it to the form using the configured mode.
+ *
+ * @selector `[dbxFormLoadingSource]`
+ *
+ * @typeParam T - The form value type (must extend object).
  */
 class DbxFormLoadingSourceDirective {
     form = inject((DbxMutableForm), { host: true });
+    /**
+     * The mode controlling when the loading source value is forwarded to the form.
+     *
+     * Defaults to `'reset'`.
+     */
     dbxFormLoadingSourceMode = input(DEFAULT_DBX_FORM_LOADING_SOURCE_DIRECTIVE_MODE, { ...(ngDevMode ? { debugName: "dbxFormLoadingSourceMode" } : {}), transform: (x) => x ?? DEFAULT_DBX_FORM_LOADING_SOURCE_DIRECTIVE_MODE });
+    /**
+     * The loading state source to observe. The form value is set once loading finishes with a non-null value.
+     */
     dbxFormLoadingSource = input(...(ngDevMode ? [undefined, { debugName: "dbxFormLoadingSource" }] : []));
     mode$ = toObservable(this.dbxFormLoadingSourceMode);
     source$ = toObservable(this.dbxFormLoadingSource).pipe(maybeValueFromObservableOrValue(), filterMaybe(), valueFromFinishedLoadingState());
@@ -739,12 +876,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }], ctorParameters: () => [], propDecorators: { dbxFormLoadingSourceMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "dbxFormLoadingSourceMode", required: false }] }], dbxFormLoadingSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dbxFormLoadingSource", required: false }] }] } });
 
 /**
- * Used to see form value changes.
+ * Directive that observes form value changes and emits the current value when the form is complete/valid,
+ * or `undefined` when the form is incomplete.
  *
- * Emits undefined when the form is incomplete, and the value when the form is complete.
+ * Subscribes to the form's stream during `ngOnInit` to ensure the first emission occurs after initialization.
+ *
+ * @selector `[dbxFormValueChange]`
+ *
+ * @typeParam T - The form value type.
  */
 class DbxFormValueChangeDirective {
     form = inject((DbxForm), { host: true });
+    /**
+     * Emits the current form value when the form is complete/valid, or `undefined` when incomplete.
+     */
     dbxFormValueChange = output();
     _sub = cleanSubscription();
     ngOnInit() {
@@ -774,15 +919,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
 /**
  * Streams a value from the input control at the given path. If no path is specified, streams the value from the control.
  *
- * @param fromControl
- * @param path
- * @returns
+ * Returns `undefined` if the control at the given path does not exist.
+ *
+ * @param fromControl - The root control to retrieve the target control from.
+ * @param path - Optional dot-delimited path to a nested control.
+ * @returns An observable of the control's value changes (starting with the current value), or `undefined` if the control was not found.
+ *
+ * @example
+ * ```ts
+ * const name$ = streamValueFromControl<string>(formGroup, 'user.name');
+ * ```
  */
 function streamValueFromControl(fromControl, path) {
     const control = path ? fromControl.get(path) : fromControl;
     return control?.valueChanges.pipe(startWith(control.value));
 }
 
+/**
+ * Root Angular module for the dbx-form library.
+ *
+ * Serves as the base module for form-related functionality. Import this module
+ * to access the core form features provided by the library.
+ */
 class DbxFormModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormModule });
@@ -795,30 +953,91 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Returns a validation message indicating the minimum character length was not met.
+ *
+ * @param err - The validation error object.
+ * @param field - The Formly field configuration containing `minLength` in its props.
+ * @returns A human-readable validation message string.
+ */
 function minLengthValidationMessage(err, field) {
     return `Should have atleast ${field.props.minLength} characters.`;
 }
+/**
+ * Returns a validation message indicating the maximum character length was exceeded.
+ *
+ * @param err - The validation error object.
+ * @param field - The Formly field configuration containing `maxLength` in its props.
+ * @returns A human-readable validation message string.
+ */
 function maxLengthValidationMessage(err, field) {
     return `This value should be less than ${field.props.maxLength} characters.`;
 }
+/**
+ * Returns a validation message indicating the value is below the minimum allowed.
+ *
+ * @param err - The validation error object.
+ * @param field - The Formly field configuration containing `min` in its props.
+ * @returns A human-readable validation message string.
+ */
 function minValidationMessage(err, field) {
     return `This value should be more than or equal to ${field.props.min}.`;
 }
+/**
+ * Returns a validation message indicating the value exceeds the maximum allowed.
+ *
+ * @param err - The validation error object.
+ * @param field - The Formly field configuration containing `max` in its props.
+ * @returns A human-readable validation message string.
+ */
 function maxValidationMessage(err, field) {
     return `This value should be less than or equal to ${field.props.max}.`;
 }
+/**
+ * Validation message option for required fields.
+ */
 const REQUIRED_VALIDATION_MESSAGE = { name: 'required', message: 'This field is required.' };
+/**
+ * Validation message option for minimum length violations.
+ */
 const MIN_LENGTH_VALIDATION_MESSAGE = { name: 'minLength', message: minLengthValidationMessage };
+/**
+ * Validation message option for maximum length violations.
+ */
 const MAX_LENGTH_VALIDATION_MESSAGE = { name: 'maxLength', message: maxLengthValidationMessage };
+/**
+ * Validation message option for minimum value violations.
+ */
 const MIN_VALIDATION_MESSAGE = { name: 'min', message: minValidationMessage };
+/**
+ * Validation message option for maximum value violations.
+ */
 const MAX_VALIDATION_MESSAGE = { name: 'max', message: maxValidationMessage };
+/**
+ * Validation message option for invalid phone numbers.
+ */
 const INVALID_PHONE_NUMBER_MESSAGE = { name: 'validatePhoneNumber', message: 'This is not a valid phone number.' };
+/**
+ * Validation message option for invalid phone number extensions.
+ */
 const INVALID_PHONE_NUMBER_EXTENSION_MESSAGE = { name: 'validatePhoneNumberExtension', message: 'This is not a valid phone number extension.' };
+/**
+ * Returns the full set of default validation messages used by the form system.
+ *
+ * Includes messages for: required, minLength, maxLength, min, max, phone number, and phone number extension.
+ *
+ * @returns An array of {@link ValidationMessageOption} objects.
+ */
 function defaultValidationMessages() {
     return [REQUIRED_VALIDATION_MESSAGE, MIN_LENGTH_VALIDATION_MESSAGE, MAX_LENGTH_VALIDATION_MESSAGE, MIN_VALIDATION_MESSAGE, MAX_VALIDATION_MESSAGE, INVALID_PHONE_NUMBER_MESSAGE, INVALID_PHONE_NUMBER_EXTENSION_MESSAGE];
 }
 
 // MARK: Default
+/**
+ * Default display component for checklist items.
+ *
+ * Renders label, sublabel, and description text from the injected {@link ChecklistItemDisplayContent}.
+ */
 class DbxDefaultChecklistItemFieldDisplayComponent {
     _displayContentSignal = signal(undefined, ...(ngDevMode ? [{ debugName: "_displayContentSignal" }] : []));
     displayContentSignal = this._displayContentSignal.asReadonly();
@@ -866,6 +1085,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Wrapper component that injects dynamic display content into a checklist item
+ * via {@link DbxInjectionComponent}. Subscribes to the parent field's display content observable.
+ */
 class DbxChecklistItemContentComponent {
     checklistItemFieldComponent = inject((DbxChecklistItemFieldComponent));
     config = {
@@ -893,6 +1116,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                     imports: [DbxInjectionComponent]
                 }]
         }] });
+/**
+ * Formly field component that renders a single checklist item with a checkbox,
+ * optional anchor link, and dynamic display content.
+ *
+ * The display content is provided as an observable and rendered via a configurable
+ * component class (defaults to {@link DbxDefaultChecklistItemFieldDisplayComponent}).
+ */
 class DbxChecklistItemFieldComponent extends FieldType {
     _displayContentObs = signal(undefined, ...(ngDevMode ? [{ debugName: "_displayContentObs" }] : []));
     displayContent$ = toObservable(this._displayContentObs).pipe(switchMapFilterMaybe(), distinctUntilChanged(), shareReplay(1));
@@ -936,6 +1166,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
             args: [{ changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [ReactiveFormsModule, MatCheckboxModule, DbxAnchorComponent, MatRippleModule, MatIconModule, DbxChecklistItemContentComponent], template: "<div class=\"dbx-checklist-item-wrapper\" [formGroup]=\"formGroup\">\n  @if (label) {\n    <div class=\"dbx-checklist-item-label\">{{ label }}</div>\n  }\n  <div class=\"dbx-checklist-item\">\n    <div class=\"dbx-checklist-item-check\">\n      <mat-checkbox [formControlName]=\"formControlName\"></mat-checkbox>\n    </div>\n    <div class=\"dbx-checklist-item-content-wrapper\">\n      <dbx-anchor [block]=\"true\" [anchor]=\"anchorSignal()\">\n        <div class=\"dbx-checklist-item-content\" matRipple [matRippleDisabled]=\"rippleDisabledSignal()\">\n          <dbx-checklist-item-content-component></dbx-checklist-item-content-component>\n          <span class=\"spacer\"></span>\n          @if (!rippleDisabledSignal()) {\n            <mat-icon>navigate_next</mat-icon>\n          }\n        </div>\n      </dbx-anchor>\n    </div>\n  </div>\n  @if (description) {\n    <div class=\"dbx-hint\">{{ description }}</div>\n  }\n</div>\n" }]
         }] });
 
+/**
+ * Formly wrapper that renders a Material info icon button beside the wrapped field.
+ * Clicking the button invokes the configured `onInfoClick` callback.
+ *
+ * Registered as Formly wrapper `'info'`.
+ */
 class DbxFormInfoWrapperComponent extends FieldWrapper {
     get infoWrapper() {
         return this.props;
@@ -978,6 +1214,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Formly wrapper that renders the wrapped field inside a `dbx-section` layout
+ * with an optional header and hint text.
+ *
+ * Registered as Formly wrapper `'section'`.
+ *
+ * @selector dbx-form-section-wrapper
+ */
 class DbxFormSectionWrapperComponent extends FieldWrapper {
     get headerConfig() {
         return this.props;
@@ -1004,6 +1248,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Formly wrapper that arranges child fields in a responsive flex layout
+ * using the `dbxFlexGroup` directive.
+ *
+ * Registered as Formly wrapper `'flex'`.
+ */
 class DbxFormFlexWrapperComponent extends FieldWrapper {
     get flexWrapper() {
         return this.props;
@@ -1038,6 +1288,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Formly wrapper that renders the wrapped field inside a `dbx-subsection` layout
+ * with an optional header and hint text.
+ *
+ * Registered as Formly wrapper `'subsection'`.
+ *
+ * @selector dbx-form-subsection-wrapper
+ */
 class DbxFormSubsectionWrapperComponent extends FieldWrapper {
     get headerConfig() {
         return this.props;
@@ -1064,7 +1322,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Default value existence check that returns `true` if the object is non-empty.
+ */
 const DEFAULT_HAS_VALUE_FN = (x) => !objectIsEmpty(x);
+/**
+ * Abstract base directive for expandable form section wrappers.
+ *
+ * Manages the show/hide state based on whether the field has a value or
+ * whether the user manually opened the section. Subclasses provide the
+ * specific UI (expand button, toggle, etc.).
+ */
 class AbstractFormExpandSectionWrapperDirective extends FieldWrapper {
     _formControlObs = new BehaviorSubject(undefined);
     _toggleOpen = new BehaviorSubject(undefined);
@@ -1223,6 +1491,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Formly wrapper that applies dynamic CSS classes and inline styles to the wrapped field.
+ *
+ * Supports both static values and reactive observables for `[ngClass]` and `[ngStyle]`.
+ *
+ * Registered as Formly wrapper `'style'`.
+ */
 class DbxFormStyleWrapperComponent extends FieldWrapper {
     _style = new BehaviorSubject(undefined);
     _class = new BehaviorSubject(undefined);
@@ -1309,14 +1584,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/** Formly wrapper key for the auto-touch behavior wrapper. */
 const AUTO_TOUCH_WRAPPER_KEY = 'autotouch';
+/** Formly wrapper key for the toggle (slide-toggle expand/collapse) wrapper. */
 const TOGGLE_WRAPPER_KEY = 'toggle';
+/** Formly wrapper key for the section layout wrapper. */
 const SECTION_WRAPPER_KEY = 'section';
+/** Formly wrapper key for the subsection layout wrapper. */
 const SUBSECTION_WRAPPER_KEY = 'subsection';
+/** Formly wrapper key for the info button wrapper. */
 const INFO_WRAPPER_KEY = 'info';
+/** Formly wrapper key for the flex layout wrapper. */
 const FLEX_WRAPPER_KEY = 'flex';
+/** Formly wrapper key for the dynamic style/class wrapper. */
 const STYLE_WRAPPER_KEY = 'style';
+/** Formly wrapper key for the async loading indicator wrapper. */
 const WORKING_WRAPPER_KEY = 'working';
+/** Formly wrapper key for the expand/collapse section wrapper. */
 const EXPAND_WRAPPER_KEY = 'expand';
 
 const importsAndExports$g = [
@@ -1333,6 +1617,7 @@ const importsAndExports$g = [
     FormlyModule,
     FormlyMaterialModule
 ];
+/** Registers all Formly field wrapper types (section, flex, expand, toggle, style, info, working, autotouch, subsection). */
 class DbxFormFormlyWrapperModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyWrapperModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyWrapperModule, imports: [AutoTouchFieldWrapperComponent,
@@ -1406,6 +1691,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }] });
 
 const importsAndExports$f = [DbxChecklistItemFieldComponent, DbxChecklistItemContentComponent, DbxDefaultChecklistItemFieldDisplayComponent];
+/** Registers the `checklistitem` Formly field type with wrapper support. */
 class DbxFormFormlyChecklistItemFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyChecklistItemFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyChecklistItemFieldModule, imports: [DbxChecklistItemFieldComponent, DbxChecklistItemContentComponent, DbxDefaultChecklistItemFieldDisplayComponent, DbxFormFormlyWrapperModule, i1$1.FormlyModule], exports: [DbxChecklistItemFieldComponent, DbxChecklistItemContentComponent, DbxDefaultChecklistItemFieldDisplayComponent] });
@@ -1454,14 +1740,28 @@ function propsAndConfigForFieldConfig(fieldConfig, override) {
         parsers
     };
 }
+/** Keys from {@link PartialPotentialFieldConfig} that are merged into Formly props. */
 const partialPotentialFieldConfigKeys = ['label', 'placeholder', 'required', 'readonly', 'description', 'autocomplete'];
+/** Filter configuration for extracting field config keys from objects. */
 const partialPotentialFieldConfigKeysFilter = {
     keysFilter: partialPotentialFieldConfigKeys
 };
+/** Merge function that combines multiple partial field configs, picking only the recognized keys. */
 const mergePropsValueObjects = mergeObjectsFunction(partialPotentialFieldConfigKeysFilter);
+/** Filter function that extracts only the recognized field config keys from an object. */
 const filterPartialPotentialFieldConfigValuesFromObject = filterFromPOJOFunction({
     filter: partialPotentialFieldConfigKeysFilter
 });
+/**
+ * Builds a Formly props object from a field config and optional overrides.
+ *
+ * Merges label, placeholder, required, readonly, description, attributes, and autocomplete
+ * settings. When autocomplete is `false`, disables browser autofill via special attributes.
+ *
+ * @param fieldConfig - Base field configuration
+ * @param override - Optional property overrides
+ * @returns Merged props object suitable for use in a {@link FormlyFieldConfig}
+ */
 function propsValueForFieldConfig(fieldConfig, override) {
     const { label, placeholder, required, readonly, description, autocomplete } = mergePropsValueObjects([fieldConfig, override]);
     const attributes = mergeObjects([fieldConfig.attributes, override?.attributes]);
@@ -1498,6 +1798,21 @@ function disableFormlyFieldAutofillAttributes() {
         autocomplete: 'off'
     };
 }
+/**
+ * Converts Angular validators, async validators, and validation messages into the
+ * Formly-compatible validator configuration format.
+ *
+ * @param input - Validators, async validators, and messages to convert
+ * @returns A Formly-compatible validator config, or undefined if no validators provided
+ *
+ * @example
+ * ```typescript
+ * const config = validatorsForFieldConfig({
+ *   validators: [Validators.required],
+ *   messages: { required: 'This field is required' }
+ * });
+ * ```
+ */
 function validatorsForFieldConfig(input) {
     const validators = asArray(input.validators);
     const asyncValidators = asArray(input.asyncValidators);
@@ -1524,6 +1839,21 @@ function validatorsForFieldConfig(input) {
     return config;
 }
 
+/**
+ * Creates a Formly field configuration for a single checklist item with a checkbox
+ * and display content (label, sublabel, description, anchor).
+ *
+ * @param config - Checklist item configuration with key and display content
+ * @returns A validated {@link FormlyFieldConfig} with type `'checklistitem'`
+ *
+ * @example
+ * ```typescript
+ * const field = checklistItemField({
+ *   key: 'emailNotifications',
+ *   displayContent: of({ label: 'Email Notifications', description: 'Receive updates via email' })
+ * });
+ * ```
+ */
 function checklistItemField(config) {
     const { key, displayContent, componentClass } = config;
     const fieldConfig = formlyField({
@@ -1636,6 +1966,12 @@ class ChecklistItemFieldDataSetBuilder {
     }
 }
 
+/**
+ * Formly field component that renders a custom Angular component via dynamic injection.
+ *
+ * Uses {@link DbxInjectionComponent} to instantiate the component class specified in the field's
+ * `componentField` configuration.
+ */
 class DbxFormComponentFieldComponent extends FieldType {
     get config() {
         return this.field.componentField;
@@ -1658,6 +1994,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }] });
 
 const importsAndExports$e = [DbxFormComponentFieldComponent];
+/** Registers the `component` Formly field type for custom Angular component injection. */
 class DbxFormFormlyComponentFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyComponentFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyComponentFieldModule, imports: [DbxFormComponentFieldComponent, i1$1.FormlyModule], exports: [DbxFormComponentFieldComponent] });
@@ -1678,6 +2015,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Creates a Formly field configuration that renders a custom Angular component.
+ *
+ * @param config - Component field configuration
+ * @returns A {@link DbxFormComponentFormlyFieldConfig} with type `'component'`
+ *
+ * @example
+ * ```typescript
+ * const field = componentField({ componentClass: MyCustomFormComponent });
+ * ```
+ */
 function componentField(config) {
     return {
         type: 'component',
@@ -1685,6 +2033,22 @@ function componentField(config) {
     };
 }
 
+/**
+ * Creates a Formly field configuration for a dbx selection list field.
+ *
+ * @param config - List field configuration including the list component class and state observable
+ * @returns A validated {@link FormlyFieldConfig} with type `'dbxlistfield'`
+ *
+ * @example
+ * ```typescript
+ * const field = dbxListField({
+ *   key: 'selectedItems',
+ *   label: 'Items',
+ *   listComponentClass: MyListComponent,
+ *   state$: items$
+ * });
+ * ```
+ */
 function dbxListField(config) {
     const { key, listComponentClass, readKey, state$, loadMore } = config;
     return formlyField({
@@ -1700,7 +2064,10 @@ function dbxListField(config) {
 }
 
 /**
- * Used for picking items by identifier from a DbxList component.
+ * Formly field component that allows picking items by identifier from a dynamic DbxList component.
+ *
+ * The list component class is provided as an observable, enabling lazy loading. Selected items
+ * are tracked by key and synchronized with the form control value.
  */
 class DbxItemListFieldComponent extends FieldType {
     _selectionEventSub = new SubscriptionObject();
@@ -1778,6 +2145,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }] });
 
 const importsAndExports$d = [DbxItemListFieldComponent];
+/** Registers the `dbxlistfield` Formly field type for item list selection. */
 class DbxFormFormlyDbxListFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyDbxListFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyDbxListFieldModule, imports: [DbxItemListFieldComponent, i1$1.FormlyModule], exports: [DbxItemListFieldComponent] });
@@ -1799,7 +2167,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }] });
 
 /**
- * Used for picking pre-set values using items as the presentation.
+ * Abstract base directive for pickable item fields that manages value loading,
+ * display caching, text filtering, and selection state.
+ *
+ * Subclasses provide the specific UI presentation (chips, lists, etc.).
  */
 class AbstractDbxPickableItemFieldDirective extends FieldType$1 {
     filterMatInput = viewChild('matInput', { ...(ngDevMode ? { debugName: "filterMatInput" } : {}), read: MatInput });
@@ -1873,6 +2244,13 @@ class AbstractDbxPickableItemFieldDirective extends FieldType$1 {
     filterResultsContext = listLoadingStateContext({ obs: this.filteredSearchResultsState$, showLoadingOnNoValue: true });
     itemsSignal = toSignal(this.items$);
     noItemsAvailableSignal = toSignal(this.noItemsAvailable$);
+    /**
+     * Signal that is true when all visible items are currently selected.
+     */
+    allSelectedSignal = computed(() => {
+        const items = this.itemsSignal();
+        return items != null && items.length > 0 && items.every((x) => x.selected);
+    }, ...(ngDevMode ? [{ debugName: "allSelectedSignal" }] : []));
     get readonly() {
         return this.props.readonly;
     }
@@ -1906,6 +2284,9 @@ class AbstractDbxPickableItemFieldDirective extends FieldType$1 {
     get changeSelectionModeToViewOnDisabled() {
         return this.pickableField.changeSelectionModeToViewOnDisabled ?? false;
     }
+    get showSelectAllButton() {
+        return this.pickableField.showSelectAllButton ?? false;
+    }
     get sortItems() {
         return this.pickableField.sortItems;
     }
@@ -2033,6 +2414,31 @@ class AbstractDbxPickableItemFieldDirective extends FieldType$1 {
         const values = this.values.filter((x) => this.hashForValue(x) !== hashToFilter);
         this.setValues(values);
     }
+    /**
+     * Selects all currently visible items.
+     */
+    selectAll() {
+        const items = this.itemsSignal() ?? [];
+        const allValues = items.filter((x) => !x.disabled).map((x) => x.itemValue.value);
+        this.setValues(allValues);
+    }
+    /**
+     * Deselects all currently visible items.
+     */
+    deselectAll() {
+        this.setValues([]);
+    }
+    /**
+     * Toggles between selecting all and deselecting all visible items.
+     */
+    toggleAll() {
+        if (this.allSelectedSignal()) {
+            this.deselectAll();
+        }
+        else {
+            this.selectAll();
+        }
+    }
     setValues(values) {
         // Use to filter non-unique values.
         if (this.hashForValue) {
@@ -2061,7 +2467,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }], propDecorators: { filterMatInput: [{ type: i0.ViewChild, args: ['matInput', { ...{ read: MatInput }, isSignal: true }] }] } });
 
 /**
- * Used for picking pre-set values using chips as the presentation.
+ * Formly field component that renders pickable values as Material chips.
+ *
+ * Clicking a chip toggles its selection state unless the field is readonly or disabled.
  */
 class DbxPickableChipListFieldComponent extends AbstractDbxPickableItemFieldDirective {
     itemClicked(item) {
@@ -2075,14 +2483,17 @@ class DbxPickableChipListFieldComponent extends AbstractDbxPickableItemFieldDire
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxPickableChipListFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: DbxPickableChipListFieldComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div class=\"dbx-pickable-item-field\">\n  <dbx-loading [context]=\"context\" [linear]=\"true\">\n    @if (showFilterInput) {\n      <ng-container *ngTemplateOutlet=\"filterTemplate\"></ng-container>\n    }\n    <!-- Content -->\n    <div class=\"dbx-pickable-item-field-chips\">\n      <mat-chip-listbox [multiple]=\"multiSelect\" [required]=\"required\" [selectable]=\"!isReadonlyOrDisabled\" [disabled]=\"readonly\" #chipList>\n        @for (item of itemsSignal(); track item.itemValue.value) {\n          <mat-chip-option (click)=\"itemClicked(item)\" [selected]=\"item.selected\" [disabled]=\"isReadonlyOrDisabled || item.disabled\">\n            @if (item.itemValue.icon) {\n              <mat-icon matChipAvatar>{{ item.itemValue.icon }}</mat-icon>\n            }\n            <span class=\"dbx-chip-label\">{{ item.itemValue.label }}</span>\n            @if (item.itemValue.sublabel) {\n              <span class=\"dbx-chip-sublabel\">{{ item.itemValue.sublabel }}</span>\n            }\n          </mat-chip-option>\n        }\n      </mat-chip-listbox>\n      <dbx-injection [config]=\"footerConfig\"></dbx-injection>\n    </div>\n  </dbx-loading>\n</div>\n\n<!-- Filter Input -->\n<ng-template #filterTemplate>\n  <div class=\"dbx-pickable-item-field-filter\">\n    <div class=\"dbx-label\">{{ filterLabel }}</div>\n    <input [name]=\"name\" autocomplete=\"{{ autocomplete }}\" #filterMatInput=\"matInput\" matInput [placeholder]=\"placeholder\" [formControl]=\"inputCtrl\" />\n    <mat-divider></mat-divider>\n    <dbx-loading [linear]=\"true\" [context]=\"filterResultsContext\"></dbx-loading>\n    <!-- No items found. -->\n    @if (noItemsAvailableSignal()) {\n      <p class=\"dbx-label\">No items match this filter.</p>\n    }\n  </div>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: MatChipsModule }, { kind: "directive", type: i1$4.MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]" }, { kind: "component", type: i1$4.MatChipListbox, selector: "mat-chip-listbox", inputs: ["multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "component", type: i1$4.MatChipOption, selector: "mat-basic-chip-option, [mat-basic-chip-option], mat-chip-option, [mat-chip-option]", inputs: ["selectable", "selected"], outputs: ["selectionChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { 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: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: DbxLoadingComponent, selector: "dbx-loading", inputs: ["padding", "show", "text", "mode", "color", "diameter", "linear", "loading", "error", "context"] }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: DbxInjectionComponent, selector: "dbx-injection, [dbxInjection], [dbx-injection]", inputs: ["config", "template"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: DbxPickableChipListFieldComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div class=\"dbx-pickable-item-field\">\n  <dbx-loading [context]=\"context\" [linear]=\"true\">\n    @if (showFilterInput) {\n      <ng-container *ngTemplateOutlet=\"filterTemplate\"></ng-container>\n    }\n    <!-- Content -->\n    <div class=\"dbx-pickable-item-field-chips\">\n      <mat-chip-listbox [multiple]=\"multiSelect\" [required]=\"required\" [selectable]=\"!isReadonlyOrDisabled\" [disabled]=\"readonly\" #chipList>\n        @if (showSelectAllButton && multiSelect && !isReadonlyOrDisabled) {\n          <mat-chip-option (click)=\"toggleAll()\" [selected]=\"allSelectedSignal()\">\n            <span class=\"dbx-chip-label\">All</span>\n          </mat-chip-option>\n        }\n        @for (item of itemsSignal(); track item.itemValue.value) {\n          <mat-chip-option (click)=\"itemClicked(item)\" [selected]=\"item.selected\" [disabled]=\"isReadonlyOrDisabled || item.disabled\">\n            @if (item.itemValue.icon) {\n              <mat-icon matChipAvatar>{{ item.itemValue.icon }}</mat-icon>\n            }\n            <span class=\"dbx-chip-label\">{{ item.itemValue.label }}</span>\n            @if (item.itemValue.sublabel) {\n              <span class=\"dbx-chip-sublabel\">{{ item.itemValue.sublabel }}</span>\n            }\n          </mat-chip-option>\n        }\n      </mat-chip-listbox>\n      <dbx-injection [config]=\"footerConfig\"></dbx-injection>\n    </div>\n  </dbx-loading>\n</div>\n\n<!-- Filter Input -->\n<ng-template #filterTemplate>\n  <div class=\"dbx-pickable-item-field-filter\">\n    <div class=\"dbx-label\">{{ filterLabel }}</div>\n    <input [name]=\"name\" autocomplete=\"{{ autocomplete }}\" #filterMatInput=\"matInput\" matInput [placeholder]=\"placeholder\" [formControl]=\"inputCtrl\" />\n    <mat-divider></mat-divider>\n    <dbx-loading [linear]=\"true\" [context]=\"filterResultsContext\"></dbx-loading>\n    <!-- No items found. -->\n    @if (noItemsAvailableSignal()) {\n      <p class=\"dbx-label\">No items match this filter.</p>\n    }\n  </div>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: MatChipsModule }, { kind: "directive", type: i1$4.MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]" }, { kind: "component", type: i1$4.MatChipListbox, selector: "mat-chip-listbox", inputs: ["multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "component", type: i1$4.MatChipOption, selector: "mat-basic-chip-option, [mat-basic-chip-option], mat-chip-option, [mat-chip-option]", inputs: ["selectable", "selected"], outputs: ["selectionChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { 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: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: DbxLoadingComponent, selector: "dbx-loading", inputs: ["padding", "show", "text", "mode", "color", "diameter", "linear", "loading", "error", "context"] }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: DbxInjectionComponent, selector: "dbx-injection, [dbxInjection], [dbx-injection]", inputs: ["config", "template"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxPickableChipListFieldComponent, decorators: [{
             type: Component,
-            args: [{ imports: [MatChipsModule, NgTemplateOutlet, FormsModule, ReactiveFormsModule, MatIconModule, MatInputModule, DbxLoadingComponent, MatDivider, DbxInjectionComponent], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"dbx-pickable-item-field\">\n  <dbx-loading [context]=\"context\" [linear]=\"true\">\n    @if (showFilterInput) {\n      <ng-container *ngTemplateOutlet=\"filterTemplate\"></ng-container>\n    }\n    <!-- Content -->\n    <div class=\"dbx-pickable-item-field-chips\">\n      <mat-chip-listbox [multiple]=\"multiSelect\" [required]=\"required\" [selectable]=\"!isReadonlyOrDisabled\" [disabled]=\"readonly\" #chipList>\n        @for (item of itemsSignal(); track item.itemValue.value) {\n          <mat-chip-option (click)=\"itemClicked(item)\" [selected]=\"item.selected\" [disabled]=\"isReadonlyOrDisabled || item.disabled\">\n            @if (item.itemValue.icon) {\n              <mat-icon matChipAvatar>{{ item.itemValue.icon }}</mat-icon>\n            }\n            <span class=\"dbx-chip-label\">{{ item.itemValue.label }}</span>\n            @if (item.itemValue.sublabel) {\n              <span class=\"dbx-chip-sublabel\">{{ item.itemValue.sublabel }}</span>\n            }\n          </mat-chip-option>\n        }\n      </mat-chip-listbox>\n      <dbx-injection [config]=\"footerConfig\"></dbx-injection>\n    </div>\n  </dbx-loading>\n</div>\n\n<!-- Filter Input -->\n<ng-template #filterTemplate>\n  <div class=\"dbx-pickable-item-field-filter\">\n    <div class=\"dbx-label\">{{ filterLabel }}</div>\n    <input [name]=\"name\" autocomplete=\"{{ autocomplete }}\" #filterMatInput=\"matInput\" matInput [placeholder]=\"placeholder\" [formControl]=\"inputCtrl\" />\n    <mat-divider></mat-divider>\n    <dbx-loading [linear]=\"true\" [context]=\"filterResultsContext\"></dbx-loading>\n    <!-- No items found. -->\n    @if (noItemsAvailableSignal()) {\n      <p class=\"dbx-label\">No items match this filter.</p>\n    }\n  </div>\n</ng-template>\n" }]
+            args: [{ imports: [MatChipsModule, NgTemplateOutlet, FormsModule, ReactiveFormsModule, MatIconModule, MatInputModule, DbxLoadingComponent, MatDivider, DbxInjectionComponent], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"dbx-pickable-item-field\">\n  <dbx-loading [context]=\"context\" [linear]=\"true\">\n    @if (showFilterInput) {\n      <ng-container *ngTemplateOutlet=\"filterTemplate\"></ng-container>\n    }\n    <!-- Content -->\n    <div class=\"dbx-pickable-item-field-chips\">\n      <mat-chip-listbox [multiple]=\"multiSelect\" [required]=\"required\" [selectable]=\"!isReadonlyOrDisabled\" [disabled]=\"readonly\" #chipList>\n        @if (showSelectAllButton && multiSelect && !isReadonlyOrDisabled) {\n          <mat-chip-option (click)=\"toggleAll()\" [selected]=\"allSelectedSignal()\">\n            <span class=\"dbx-chip-label\">All</span>\n          </mat-chip-option>\n        }\n        @for (item of itemsSignal(); track item.itemValue.value) {\n          <mat-chip-option (click)=\"itemClicked(item)\" [selected]=\"item.selected\" [disabled]=\"isReadonlyOrDisabled || item.disabled\">\n            @if (item.itemValue.icon) {\n              <mat-icon matChipAvatar>{{ item.itemValue.icon }}</mat-icon>\n            }\n            <span class=\"dbx-chip-label\">{{ item.itemValue.label }}</span>\n            @if (item.itemValue.sublabel) {\n              <span class=\"dbx-chip-sublabel\">{{ item.itemValue.sublabel }}</span>\n            }\n          </mat-chip-option>\n        }\n      </mat-chip-listbox>\n      <dbx-injection [config]=\"footerConfig\"></dbx-injection>\n    </div>\n  </dbx-loading>\n</div>\n\n<!-- Filter Input -->\n<ng-template #filterTemplate>\n  <div class=\"dbx-pickable-item-field-filter\">\n    <div class=\"dbx-label\">{{ filterLabel }}</div>\n    <input [name]=\"name\" autocomplete=\"{{ autocomplete }}\" #filterMatInput=\"matInput\" matInput [placeholder]=\"placeholder\" [formControl]=\"inputCtrl\" />\n    <mat-divider></mat-divider>\n    <dbx-loading [linear]=\"true\" [context]=\"filterResultsContext\"></dbx-loading>\n    <!-- No items found. -->\n    @if (noItemsAvailableSignal()) {\n      <p class=\"dbx-label\">No items match this filter.</p>\n    }\n  </div>\n</ng-template>\n" }]
         }] });
 
 // MARK: Selection List
+/**
+ * Wrapper component for the pickable item selection list, providing the list view container.
+ */
 class DbxPickableListFieldItemListComponent extends AbstractDbxSelectionListWrapperDirective {
     constructor() {
         super({
@@ -2104,7 +2515,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }], ctorParameters: () => [] });
 /**
- * NOTE: Values input are PickableItemFieldItem<T>, but output values are PickableValueFieldDisplayValue<T>.
+ * List view component that renders pickable items with selection support.
+ *
+ * Input values are {@link PickableItemFieldItem}, but output selection events emit {@link PickableValueFieldDisplayValue}.
  */
 class DbxPickableListFieldItemListViewComponent extends AbstractDbxSelectionListViewDirective {
     dbxPickableListFieldComponent = inject((DbxPickableListFieldComponent));
@@ -2178,9 +2591,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                     standalone: true
                 }]
         }] });
-// List Field Component
+// MARK: List Field Component
 /**
- * Used for picking pre-set values using a selection list as the presentation.
+ * Formly field component that renders pickable values as a selectable list.
+ *
+ * Delegates to {@link DbxPickableListFieldItemListComponent} for list rendering and
+ * handles selection change events to update the form control value.
  */
 class DbxPickableListFieldComponent extends AbstractDbxPickableItemFieldDirective {
     onSelectionChange(event) {
@@ -2197,6 +2613,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }] });
 
 const importsAndExports$c = [DbxPickableChipListFieldComponent, DbxPickableListFieldComponent, DbxPickableListFieldItemListComponent, DbxPickableListFieldItemListViewComponent, DbxPickableListFieldItemListViewItemComponent];
+/** Registers the `pickablechipfield` and `pickablelistfield` Formly field types. */
 class DbxFormFormlyPickableFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyPickableFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyPickableFieldModule, imports: [DbxPickableChipListFieldComponent, DbxPickableListFieldComponent, DbxPickableListFieldItemListComponent, DbxPickableListFieldItemListViewComponent, DbxPickableListFieldItemListViewItemComponent, i1$1.FormlyModule], exports: [DbxPickableChipListFieldComponent, DbxPickableListFieldComponent, DbxPickableListFieldItemListComponent, DbxPickableListFieldItemListViewComponent, DbxPickableListFieldItemListViewItemComponent] });
@@ -2223,6 +2640,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Creates a Formly field configuration for a pickable chip field that displays
+ * selected values as Material chips.
+ *
+ * @param config - Pickable item configuration including load and display functions
+ * @returns A validated {@link FormlyFieldConfig} with type `'pickablechipfield'`
+ *
+ * @example
+ * ```typescript
+ * const field = pickableItemChipField({
+ *   key: 'tags',
+ *   label: 'Tags',
+ *   loadValues: () => tags$,
+ *   hashForValue: (tag) => tag.id
+ * });
+ * ```
+ */
 function pickableItemChipField(config) {
     const { key, materialFormField } = config;
     return formlyField({
@@ -2235,6 +2669,23 @@ function pickableItemChipField(config) {
         })
     });
 }
+/**
+ * Creates a Formly field configuration for a pickable list field that displays
+ * selected values in a selection list.
+ *
+ * @param config - Pickable item configuration including load and display functions
+ * @returns A validated {@link FormlyFieldConfig} with type `'pickablelistfield'`
+ *
+ * @example
+ * ```typescript
+ * const field = pickableItemListField({
+ *   key: 'categories',
+ *   label: 'Categories',
+ *   loadValues: () => categories$,
+ *   hashForValue: (cat) => cat.id
+ * });
+ * ```
+ */
 function pickableItemListField(config) {
     const { key, materialFormField } = config;
     return formlyField({
@@ -2248,10 +2699,20 @@ function pickableItemListField(config) {
     });
 }
 
+/** Case-insensitive filter function that matches pickable display values by their label using indexOf. */
 const filterPickableItemFieldValuesByLabelFilterFunction = searchStringFilterFunction({
     readStrings: (x) => [x.label],
     decisionFactory: caseInsensitiveFilterByIndexOfDecisionFactory
 });
+/**
+ * Filters pickable display values by label text, returning their underlying values.
+ *
+ * Returns all values when filter text is empty.
+ *
+ * @param filterText - Text to filter by
+ * @param values - Display values to filter
+ * @returns Observable emitting the filtered value array
+ */
 function filterPickableItemFieldValuesByLabel(filterText, values) {
     let filteredValues;
     if (filterText) {
@@ -2262,10 +2723,33 @@ function filterPickableItemFieldValuesByLabel(filterText, values) {
     }
     return of(filteredValues.map((x) => x.value));
 }
+/** String sort comparator that orders pickable items alphabetically by label. */
 const sortPickableItemsByLabelStringFunction = sortByStringFunction((x) => x.itemValue.label);
+/**
+ * Sorts pickable items alphabetically by their label.
+ *
+ * @param chips - Items to sort
+ * @returns The sorted array (mutated in place)
+ */
 function sortPickableItemsByLabel(chips) {
     return chips.sort(sortPickableItemsByLabelStringFunction);
 }
+/**
+ * Creates `loadValues`, `displayForValue`, and `filterValues` functions from a static array of labeled values.
+ *
+ * Simplifies pickable field setup when all options are known upfront.
+ *
+ * @param input - Array of labeled values or a config object with options and unknown label
+ * @returns Props subset for configuring a pickable field
+ *
+ * @example
+ * ```typescript
+ * const config = pickableValueFieldValuesConfigForStaticLabeledValues([
+ *   { value: 'a', label: 'Option A' },
+ *   { value: 'b', label: 'Option B' }
+ * ]);
+ * ```
+ */
 function pickableValueFieldValuesConfigForStaticLabeledValues(input) {
     const config = Array.isArray(input) ? { allOptions: input } : input;
     const { allOptions, unknownOptionLabel = 'UNKNOWN' } = config;
@@ -2281,7 +2765,14 @@ function pickableValueFieldValuesConfigForStaticLabeledValues(input) {
     };
 }
 
+/** Injection token providing the {@link ConfiguredSearchableValueFieldDisplayValue} to autocomplete item display components. */
 const DBX_SEARCHABLE_FIELD_COMPONENT_DATA_TOKEN = new InjectionToken('DbxSearchableField');
+/**
+ * Renders a single autocomplete suggestion item using dynamic component injection.
+ *
+ * Wraps the display component in a {@link DbxAnchorComponent} and provides the display
+ * value data via {@link DBX_SEARCHABLE_FIELD_COMPONENT_DATA_TOKEN}.
+ */
 class DbxSearchableFieldAutocompleteItemComponent {
     displayValue = input.required(...(ngDevMode ? [{ debugName: "displayValue" }] : []));
     configSignal = computed(() => {
@@ -2320,6 +2811,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }], propDecorators: { displayValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayValue", required: true }] }] } });
 // MARK: Default
+/**
+ * Abstract base directive for custom searchable field display components.
+ *
+ * Injects the {@link ConfiguredSearchableValueFieldDisplayValue} via the
+ * {@link DBX_SEARCHABLE_FIELD_COMPONENT_DATA_TOKEN} for use in custom templates.
+ */
 class AbstractDbxSearchableFieldDisplayDirective {
     displayValue = inject(DBX_SEARCHABLE_FIELD_COMPONENT_DATA_TOKEN);
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AbstractDbxSearchableFieldDisplayDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
@@ -2328,6 +2825,11 @@ class AbstractDbxSearchableFieldDisplayDirective {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AbstractDbxSearchableFieldDisplayDirective, decorators: [{
             type: Directive
         }] });
+/**
+ * Default display component for searchable field autocomplete items.
+ *
+ * Renders an optional icon, a label, and an optional sublabel in a horizontal flex layout.
+ */
 class DbxDefaultSearchableFieldDisplayComponent extends AbstractDbxSearchableFieldDisplayDirective {
     icon = this.displayValue.icon;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxDefaultSearchableFieldDisplayComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
@@ -2564,6 +3066,7 @@ class AbstractDbxSearchableValueFieldDirective extends FieldType$1 {
             this.inputCtrl.setValue(text.trim());
         }
         if (!this.inputCtrl.valid) {
+            this.inputCtrl.markAsTouched();
             return;
         }
         if (text) {
@@ -2571,6 +3074,21 @@ class AbstractDbxSearchableValueFieldDirective extends FieldType$1 {
             this.addValue(value);
         }
     }
+    /**
+     * Returns the first validation error message from the input control, if any.
+     */
+    get inputErrorMessage() {
+        const errors = this.inputCtrl.errors;
+        if (errors) {
+            for (const key of Object.keys(errors)) {
+                const error = errors[key];
+                if (error?.message) {
+                    return error.message;
+                }
+            }
+        }
+        return undefined;
+    }
     addWithDisplayValue(displayValue) {
         this.addValue(displayValue.value);
     }
@@ -2641,6 +3159,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
             type: Directive
         }], propDecorators: { textInput: [{ type: i0.ViewChild, args: ['textInput', { ...{ read: (ElementRef) }, isSignal: true }] }] } });
 
+/**
+ * Formly field component that combines a search autocomplete with Material chips
+ * for selecting multiple values.
+ *
+ * Supports adding values by typing (if string values are allowed), selecting from
+ * autocomplete results, and removing chips. Handles tab and blur events to auto-add text input.
+ */
 class DbxSearchableChipFieldComponent extends AbstractDbxSearchableValueFieldDirective {
     get multiSelect() {
         return this.props.multiSelect ?? true;
@@ -2684,11 +3209,11 @@ class DbxSearchableChipFieldComponent extends AbstractDbxSearchableValueFieldDir
         this._blur.next();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxSearchableChipFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: DbxSearchableChipFieldComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div class=\"dbx-searchable-field\">\n  <!-- View -->\n  <mat-chip-grid [required]=\"required\" [disabled]=\"readonly\" #chipList>\n    @for (displayValue of displayValuesSignal(); track displayValue.value) {\n      <mat-chip-row [removable]=\"true\" (removed)=\"removeWithDisplayValue(displayValue)\">\n        @if (displayValue.icon) {\n          <mat-icon matChipAvatar>{{ displayValue.icon }}</mat-icon>\n        }\n        <span class=\"dbx-chip-label\">{{ displayValue.label }}</span>\n        @if (displayValue.sublabel) {\n          <span class=\"dbx-chip-sublabel\">{{ displayValue.sublabel }}</span>\n        }\n        @if (!readonly) {\n          <mat-icon matChipRemove>cancel</mat-icon>\n        }\n      </mat-chip-row>\n    }\n    <input #textInput [name]=\"name\" [placeholder]=\"searchInputPlaceholder\" [formControl]=\"inputCtrl\" [matAutocomplete]=\"auto\" autocomplete=\"{{ autocomplete }}\" [matAutocompleteDisabled]=\"readonly\" [matChipInputFor]=\"chipList\" (keydown)=\"tabPressedOnInput($event)\" [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\" (matChipInputTokenEnd)=\"addChip($event)\" (blur)=\"onBlur()\" />\n  </mat-chip-grid>\n  <div class=\"searchable-field-form-loading\">\n    <dbx-loading [linear]=\"true\" [context]=\"searchContext\"></dbx-loading>\n  </div>\n</div>\n\n<!-- Autocomplete -->\n<mat-autocomplete class=\"dbx-searchable-text-field-autocomplete\" #auto=\"matAutocomplete\" (optionSelected)=\"selected($event)\">\n  @for (displayValue of searchResultsSignal(); track displayValue.value) {\n    <mat-option [value]=\"displayValue\">\n      <dbx-searchable-field-autocomplete-item [displayValue]=\"displayValue\"></dbx-searchable-field-autocomplete-item>\n    </mat-option>\n  }\n</mat-autocomplete>\n", dependencies: [{ kind: "ngmodule", type: MatChipsModule }, { kind: "directive", type: i1$4.MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]" }, { kind: "component", type: i1$4.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i1$4.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled", "readonly", "matChipInputDisabledInteractive"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i1$4.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i1$4.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: FormsModule }, { 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: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: DbxLoadingModule }, { kind: "component", type: i1$2.DbxLoadingComponent, selector: "dbx-loading", inputs: ["padding", "show", "text", "mode", "color", "diameter", "linear", "loading", "error", "context"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i5.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: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "component", type: DbxSearchableFieldAutocompleteItemComponent, selector: "dbx-searchable-field-autocomplete-item", inputs: ["displayValue"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: DbxSearchableChipFieldComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div class=\"dbx-searchable-field\">\n  <!-- View -->\n  <mat-chip-grid [required]=\"required\" [disabled]=\"readonly\" #chipList>\n    @for (displayValue of displayValuesSignal(); track displayValue.value) {\n      <mat-chip-row [removable]=\"true\" (removed)=\"removeWithDisplayValue(displayValue)\">\n        @if (displayValue.icon) {\n          <mat-icon matChipAvatar>{{ displayValue.icon }}</mat-icon>\n        }\n        <span class=\"dbx-chip-label\">{{ displayValue.label }}</span>\n        @if (displayValue.sublabel) {\n          <span class=\"dbx-chip-sublabel\">{{ displayValue.sublabel }}</span>\n        }\n        @if (!readonly) {\n          <mat-icon matChipRemove>cancel</mat-icon>\n        }\n      </mat-chip-row>\n    }\n    <input #textInput [name]=\"name\" [placeholder]=\"searchInputPlaceholder\" [formControl]=\"inputCtrl\" [matAutocomplete]=\"auto\" autocomplete=\"{{ autocomplete }}\" [matAutocompleteDisabled]=\"readonly\" [matChipInputFor]=\"chipList\" (keydown)=\"tabPressedOnInput($event)\" [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\" (matChipInputTokenEnd)=\"addChip($event)\" (blur)=\"onBlur()\" />\n  </mat-chip-grid>\n  <div class=\"searchable-field-form-loading\">\n    <dbx-loading [linear]=\"true\" [context]=\"searchContext\"></dbx-loading>\n  </div>\n  @if (inputCtrl.touched && inputErrorMessage) {\n    <span class=\"dbx-chip-input-error\">{{ inputErrorMessage }}</span>\n  }\n</div>\n\n<!-- Autocomplete -->\n<mat-autocomplete class=\"dbx-searchable-text-field-autocomplete\" #auto=\"matAutocomplete\" (optionSelected)=\"selected($event)\">\n  @for (displayValue of searchResultsSignal(); track displayValue.value) {\n    <mat-option [value]=\"displayValue\">\n      <dbx-searchable-field-autocomplete-item [displayValue]=\"displayValue\"></dbx-searchable-field-autocomplete-item>\n    </mat-option>\n  }\n</mat-autocomplete>\n", dependencies: [{ kind: "ngmodule", type: MatChipsModule }, { kind: "directive", type: i1$4.MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]" }, { kind: "component", type: i1$4.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i1$4.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled", "readonly", "matChipInputDisabledInteractive"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i1$4.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i1$4.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: FormsModule }, { 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: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: DbxLoadingModule }, { kind: "component", type: i1$2.DbxLoadingComponent, selector: "dbx-loading", inputs: ["padding", "show", "text", "mode", "color", "diameter", "linear", "loading", "error", "context"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i5.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: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "component", type: DbxSearchableFieldAutocompleteItemComponent, selector: "dbx-searchable-field-autocomplete-item", inputs: ["displayValue"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxSearchableChipFieldComponent, decorators: [{
             type: Component,
-            args: [{ imports: [MatChipsModule, MatIconModule, FormsModule, ReactiveFormsModule, DbxLoadingModule, MatAutocompleteModule, MatOptionModule, DbxSearchableFieldAutocompleteItemComponent], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"dbx-searchable-field\">\n  <!-- View -->\n  <mat-chip-grid [required]=\"required\" [disabled]=\"readonly\" #chipList>\n    @for (displayValue of displayValuesSignal(); track displayValue.value) {\n      <mat-chip-row [removable]=\"true\" (removed)=\"removeWithDisplayValue(displayValue)\">\n        @if (displayValue.icon) {\n          <mat-icon matChipAvatar>{{ displayValue.icon }}</mat-icon>\n        }\n        <span class=\"dbx-chip-label\">{{ displayValue.label }}</span>\n        @if (displayValue.sublabel) {\n          <span class=\"dbx-chip-sublabel\">{{ displayValue.sublabel }}</span>\n        }\n        @if (!readonly) {\n          <mat-icon matChipRemove>cancel</mat-icon>\n        }\n      </mat-chip-row>\n    }\n    <input #textInput [name]=\"name\" [placeholder]=\"searchInputPlaceholder\" [formControl]=\"inputCtrl\" [matAutocomplete]=\"auto\" autocomplete=\"{{ autocomplete }}\" [matAutocompleteDisabled]=\"readonly\" [matChipInputFor]=\"chipList\" (keydown)=\"tabPressedOnInput($event)\" [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\" (matChipInputTokenEnd)=\"addChip($event)\" (blur)=\"onBlur()\" />\n  </mat-chip-grid>\n  <div class=\"searchable-field-form-loading\">\n    <dbx-loading [linear]=\"true\" [context]=\"searchContext\"></dbx-loading>\n  </div>\n</div>\n\n<!-- Autocomplete -->\n<mat-autocomplete class=\"dbx-searchable-text-field-autocomplete\" #auto=\"matAutocomplete\" (optionSelected)=\"selected($event)\">\n  @for (displayValue of searchResultsSignal(); track displayValue.value) {\n    <mat-option [value]=\"displayValue\">\n      <dbx-searchable-field-autocomplete-item [displayValue]=\"displayValue\"></dbx-searchable-field-autocomplete-item>\n    </mat-option>\n  }\n</mat-autocomplete>\n" }]
+            args: [{ imports: [MatChipsModule, MatIconModule, FormsModule, ReactiveFormsModule, DbxLoadingModule, MatAutocompleteModule, MatOptionModule, DbxSearchableFieldAutocompleteItemComponent], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"dbx-searchable-field\">\n  <!-- View -->\n  <mat-chip-grid [required]=\"required\" [disabled]=\"readonly\" #chipList>\n    @for (displayValue of displayValuesSignal(); track displayValue.value) {\n      <mat-chip-row [removable]=\"true\" (removed)=\"removeWithDisplayValue(displayValue)\">\n        @if (displayValue.icon) {\n          <mat-icon matChipAvatar>{{ displayValue.icon }}</mat-icon>\n        }\n        <span class=\"dbx-chip-label\">{{ displayValue.label }}</span>\n        @if (displayValue.sublabel) {\n          <span class=\"dbx-chip-sublabel\">{{ displayValue.sublabel }}</span>\n        }\n        @if (!readonly) {\n          <mat-icon matChipRemove>cancel</mat-icon>\n        }\n      </mat-chip-row>\n    }\n    <input #textInput [name]=\"name\" [placeholder]=\"searchInputPlaceholder\" [formControl]=\"inputCtrl\" [matAutocomplete]=\"auto\" autocomplete=\"{{ autocomplete }}\" [matAutocompleteDisabled]=\"readonly\" [matChipInputFor]=\"chipList\" (keydown)=\"tabPressedOnInput($event)\" [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\" (matChipInputTokenEnd)=\"addChip($event)\" (blur)=\"onBlur()\" />\n  </mat-chip-grid>\n  <div class=\"searchable-field-form-loading\">\n    <dbx-loading [linear]=\"true\" [context]=\"searchContext\"></dbx-loading>\n  </div>\n  @if (inputCtrl.touched && inputErrorMessage) {\n    <span class=\"dbx-chip-input-error\">{{ inputErrorMessage }}</span>\n  }\n</div>\n\n<!-- Autocomplete -->\n<mat-autocomplete class=\"dbx-searchable-text-field-autocomplete\" #auto=\"matAutocomplete\" (optionSelected)=\"selected($event)\">\n  @for (displayValue of searchResultsSignal(); track displayValue.value) {\n    <mat-option [value]=\"displayValue\">\n      <dbx-searchable-field-autocomplete-item [displayValue]=\"displayValue\"></dbx-searchable-field-autocomplete-item>\n    </mat-option>\n  }\n</mat-autocomplete>\n" }]
         }] });
 
 /**
@@ -2725,12 +3250,35 @@ function makeMetaFilterSearchableFieldValueDisplayFn({ loadMetaForValues, makeDi
         return allValues.pipe(switchMap(makeDisplayForValues));
     };
 }
+/**
+ * Creates a searchable chip field pre-configured for string values.
+ *
+ * @param config - String-specific searchable chip field configuration
+ * @returns A {@link FormlyFieldConfig} with type `'searchablechipfield'`
+ *
+ * @example
+ * ```typescript
+ * const field = searchableStringChipField({ key: 'tags', label: 'Tags', search: searchFn });
+ * ```
+ */
 function searchableStringChipField(config) {
     return searchableChipField({
         ...config,
         allowStringValues: true
     });
 }
+/**
+ * Creates a Formly field configuration for a searchable chip field where users
+ * can search for and select values displayed as Material chips.
+ *
+ * @param config - Searchable chip field configuration
+ * @returns A validated {@link FormlyFieldConfig} with type `'searchablechipfield'`
+ *
+ * @example
+ * ```typescript
+ * const field = searchableChipField({ key: 'skills', label: 'Skills', search: searchFn, hashForValue: (s) => s.id });
+ * ```
+ */
 function searchableChipField(config) {
     const { key, placeholder, materialFormField } = config;
     return formlyField({
@@ -2744,6 +3292,18 @@ function searchableChipField(config) {
         })
     });
 }
+/**
+ * Creates a Formly field configuration for a searchable text field with autocomplete
+ * dropdown for selecting values.
+ *
+ * @param config - Searchable text field configuration
+ * @returns A validated {@link FormlyFieldConfig} with type `'searchabletextfield'`
+ *
+ * @example
+ * ```typescript
+ * const field = searchableTextField({ key: 'assignee', label: 'Assignee', search: searchFn });
+ * ```
+ */
 function searchableTextField(config) {
     const { key, materialFormField } = config;
     return formlyField({
@@ -2758,7 +3318,10 @@ function searchableTextField(config) {
 }
 
 /**
- * Display component for selecting a single item/value.
+ * Formly field component for selecting a single value via text search with autocomplete.
+ *
+ * Syncs the selected value's label back to the text input. Supports optional display
+ * of the currently selected value and clear functionality.
  */
 class DbxSearchableTextFieldComponent extends AbstractDbxSearchableValueFieldDirective {
     allowSyncValueToInput = true;
@@ -2812,6 +3375,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }] });
 
 const importsAndExports$b = [DbxSearchableChipFieldComponent, DbxSearchableTextFieldComponent, DbxSearchableFieldAutocompleteItemComponent, DbxDefaultSearchableFieldDisplayComponent];
+/** Registers the `searchablechipfield` and `searchabletextfield` Formly field types. */
 class DbxFormFormlySearchableFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlySearchableFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlySearchableFieldModule, imports: [DbxSearchableChipFieldComponent, DbxSearchableTextFieldComponent, DbxSearchableFieldAutocompleteItemComponent, DbxDefaultSearchableFieldDisplayComponent, i1$1.FormlyModule], exports: [DbxSearchableChipFieldComponent, DbxSearchableTextFieldComponent, DbxSearchableFieldAutocompleteItemComponent, DbxDefaultSearchableFieldDisplayComponent] });
@@ -2838,6 +3402,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Creates a searchable chip field for freeform text entry where each entered string
+ * becomes a chip. Values are lowercased by default unless `caseSensitive` is true.
+ *
+ * @param config - Text chip field configuration
+ * @returns A {@link FormlyFieldConfig} for text chip input
+ *
+ * @example
+ * ```typescript
+ * const field = chipTextField({ key: 'tags', label: 'Tags' });
+ * ```
+ */
 function chipTextField(config) {
     const convertStringValue = config.caseSensitive ? (x) => x : (x) => x?.toLowerCase();
     return searchableChipField({
@@ -2852,7 +3428,11 @@ function chipTextField(config) {
 }
 
 /**
- * Component that displays a select view (multi or not)
+ * Formly field component that renders a Material select dropdown populated from
+ * multiple data sources (open source dialogs, loaded sources, and form control values).
+ *
+ * Merges values from all sources, deduplicates by value key, groups options by label,
+ * and caches display values and metadata for performance.
  */
 class DbxFormSourceSelectFieldComponent extends FieldType$2 {
     _cacheMetaSub = new SubscriptionObject();
@@ -3164,6 +3744,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
             args: [{ selector: 'dbx-form-sourceselectfield', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatSelect, MatOption, FormsModule, ReactiveFormsModule, DbxButtonComponent, MatOptgroup, DbxButtonSpacerDirective, DbxActionModule, DbxLoadingComponent], standalone: true, template: "<div class=\"dbx-source-select-field\">\n  <div class=\"dbx-source-select-field-content\">\n    <mat-select class=\"dbx-source-select-field-select\" [id]=\"id\" [formControl]=\"formControl\" [multiple]=\"props.multiple\">\n      @for (value of nonGroupedValuesSignal(); track value.value) {\n        <mat-option [value]=\"value.value\">\n          {{ value.label }}\n        </mat-option>\n      }\n      @for (optionGroup of groupedOptionsSignal(); track optionGroup.label) {\n        <mat-optgroup [label]=\"optionGroup.label\">\n          @for (value of optionGroup.values; track value.value) {\n            <mat-option [value]=\"value.value\">\n              {{ value.label }}\n            </mat-option>\n          }\n        </mat-optgroup>\n      }\n    </mat-select>\n    @if (showOpenSourceButton) {\n      <dbx-button-spacer></dbx-button-spacer>\n      <dbx-action dbxActionValue [dbxActionHandler]=\"handleSelectOptions\" class=\"dbx-source-select-field-button\">\n        <dbx-button #button dbxActionButton [fab]=\"true\" [iconOnly]=\"true\" [icon]=\"selectButtonIcon\"></dbx-button>\n      </dbx-action>\n    }\n  </div>\n  <dbx-loading class=\"dbx-source-select-field-loading\" [linear]=\"true\" [context]=\"context\"></dbx-loading>\n</div>\n" }]
         }], propDecorators: { buttonElement: [{ type: i0.ViewChild, args: ['button', { ...{ read: (ElementRef) }, isSignal: true }] }] } });
 
+/**
+ * Creates a Formly field configuration for a source-select field that loads and
+ * displays selectable values from one or more external data sources.
+ *
+ * @param config - Source-select field configuration
+ * @returns A validated {@link FormlyFieldConfig} with type `'sourceselectfield'`
+ *
+ * @example
+ * ```typescript
+ * const field = sourceSelectField({
+ *   key: 'source',
+ *   label: 'Source',
+ *   loadSources: () => sources$,
+ *   metaReader: (meta) => meta.id
+ * });
+ * ```
+ */
 function sourceSelectField(config) {
     const { key, materialFormField } = config;
     return formlyField({
@@ -3177,6 +3774,7 @@ function sourceSelectField(config) {
     });
 }
 
+/** Registers the `sourceselectfield` Formly field type. */
 class DbxFormFormlySourceSelectModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlySourceSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlySourceSelectModule, imports: [DbxFormSourceSelectFieldComponent, i1$1.FormlyModule], exports: [DbxFormSourceSelectFieldComponent] });
@@ -3198,6 +3796,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Creates a Formly select field configuration with support for native/material select,
+ * clear option, multiple selection, and "select all".
+ *
+ * @param config - Selection field configuration
+ * @returns A validated {@link FormlyFieldConfig} with type `'select'` or `'native-select'`
+ *
+ * @example
+ * ```typescript
+ * const field = valueSelectionField({
+ *   key: 'color',
+ *   label: 'Color',
+ *   options: [{ label: 'Red', value: 'red' }, { label: 'Blue', value: 'blue' }]
+ * });
+ * ```
+ */
 function valueSelectionField(config) {
     const { key, native = false, addClearOption = false, selectAllOption: inputSelectAllOption, options: inputOptions, materialFormField } = config;
     let selectAllOptionConfig;
@@ -3221,6 +3835,13 @@ function valueSelectionField(config) {
         parsers
     });
 }
+/**
+ * Creates a function that prepends a "clear" option to the selection options array
+ * if one doesn't already exist.
+ *
+ * @param label - Optional label for the clear option
+ * @returns A function that transforms selection options by prepending a clear option
+ */
 function addValueSelectionOptionFunction(label) {
     return (options) => {
         const hasClear = options.findIndex((x) => x.clear) !== -1;
@@ -3233,6 +3854,12 @@ function addValueSelectionOptionFunction(label) {
     };
 }
 
+/**
+ * Formly field component providing a rich text editor powered by ngx-editor.
+ *
+ * Outputs HTML format and marks the form control dirty on editor value changes
+ * while focused. Supports compact mode via {@link CompactContextStore}.
+ */
 class DbxTextEditorFieldComponent extends FieldType$1 {
     _compactContextStore = inject(CompactContextStore, { optional: true });
     _editor;
@@ -3319,6 +3946,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }] });
 
 const importsAndExports$a = [DbxTextEditorFieldComponent];
+/** Registers the `texteditor` Formly field type for rich text editing. */
 class DbxFormFormlyTextEditorFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyTextEditorFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyTextEditorFieldModule, imports: [DbxTextEditorFieldComponent, i1$1.FormlyModule], exports: [DbxTextEditorFieldComponent] });
@@ -3339,6 +3967,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Creates a Formly field configuration for a rich text editor.
+ *
+ * The field defaults to an empty string and updates the model on blur events.
+ *
+ * @param config - Text editor field configuration
+ * @returns A validated {@link FormlyFieldConfig} with type `'texteditor'`
+ *
+ * @example
+ * ```typescript
+ * const field = textEditorField({ key: 'bio', label: 'Biography', maxLength: 2000 });
+ * ```
+ */
 function textEditorField(config) {
     const { key, minLength, maxLength, materialFormField } = config;
     const fieldConfig = formlyField({
@@ -3359,6 +4000,14 @@ function textEditorField(config) {
     return fieldConfig;
 }
 
+/**
+ * Formly custom field type for dynamically repeatable arrays of field groups.
+ *
+ * Renders a list of field groups that users can add to, remove from, duplicate,
+ * and rearrange via drag-and-drop. Enforces an optional maximum item count.
+ *
+ * Registered as Formly type `'repeatarray'`.
+ */
 class DbxFormRepeatArrayTypeComponent extends FieldArrayType {
     _labelForField = cachedGetter(() => {
         const input = this.repeatArrayField.labelForField;
@@ -3579,6 +4228,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }] });
 
 const importsAndExports$9 = [DbxFormRepeatArrayTypeComponent];
+/** Registers the `repeatarray` Formly field type for dynamic array fields. */
 class DbxFormFormlyArrayFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyArrayFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyArrayFieldModule, imports: [DbxFormRepeatArrayTypeComponent, i1$1.FormlyModule], exports: [DbxFormRepeatArrayTypeComponent] });
@@ -3599,6 +4249,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Creates a Formly field configuration for a repeatable array of field groups.
+ *
+ * Users can dynamically add, remove, duplicate, and rearrange entries.
+ *
+ * @param config - Repeat array configuration including the template field group
+ * @returns A validated {@link FormlyFieldConfig} with type `'repeatarray'`
+ *
+ * @example
+ * ```typescript
+ * const field = repeatArrayField({
+ *   key: 'items',
+ *   label: 'Items',
+ *   addText: 'Add Item',
+ *   removeText: 'Remove Item',
+ *   repeatFieldGroup: [textField({ key: 'name', label: 'Name' })]
+ * });
+ * ```
+ */
 function repeatArrayField(config) {
     const { key, label, description, repeatFieldGroup, maxLength, addText, addTemplate, removeText, duplicateText, labelForField, disableRearrange, allowAdd, allowRemove, allowDuplicate, addDuplicateToEnd } = config;
     return formlyField({
@@ -3626,6 +4295,7 @@ function repeatArrayField(config) {
 }
 
 const importsAndExports$8 = [FormlyMaterialModule, FormlyMatCheckboxModule, FormlyMatToggleModule];
+/** Provides Formly Material checkbox and toggle field support. */
 class DbxFormFormlyBooleanFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyBooleanFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyBooleanFieldModule, imports: [FormlyMaterialModule, FormlyMatCheckboxModule, FormlyMatToggleModule], exports: [FormlyMaterialModule, FormlyMatCheckboxModule, FormlyMatToggleModule] });
@@ -3639,6 +4309,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Creates a Formly field configuration for a Material slide toggle.
+ *
+ * Defaults to `false` when no default value is specified. Uses auto-touch and style wrappers.
+ *
+ * @param config - Toggle field configuration
+ * @returns A validated {@link FormlyFieldConfig} with type `'toggle'`
+ *
+ * @example
+ * ```typescript
+ * const field = toggleField({ key: 'active', label: 'Active', defaultValue: true });
+ * ```
+ */
 function toggleField(config) {
     const { key, defaultValue, materialFormField } = config;
     const classGetter = 'dbx-mat-form-toggle-field-wrapper';
@@ -3653,6 +4336,19 @@ function toggleField(config) {
         })
     });
 }
+/**
+ * Creates a Formly field configuration for a Material checkbox.
+ *
+ * Defaults to `false` when no default value is specified. Uses a style wrapper.
+ *
+ * @param config - Checkbox field configuration
+ * @returns A validated {@link FormlyFieldConfig} with type `'checkbox'`
+ *
+ * @example
+ * ```typescript
+ * const field = checkboxField({ key: 'agree', label: 'I agree to the terms' });
+ * ```
+ */
 function checkboxField(config) {
     const { key, defaultValue, materialFormField } = config;
     const classGetter = 'dbx-mat-form-checkbox-field-wrapper';
@@ -3713,7 +4409,19 @@ function dateTimePreset(config) {
     };
 }
 
+/**
+ * Injection token for providing default date-time field menu presets application-wide.
+ */
 const DBX_DATE_TIME_FIELD_MENU_PRESETS_TOKEN = new InjectionToken('DbxDateTimeFieldMenuPresetsServicePresets');
+/**
+ * Service that manages default date-time preset configurations for all date-time fields.
+ *
+ * Presets are shown in the date-time field dropdown menu and allow users to quickly
+ * select common date/time values (e.g., "Now", "Start of day").
+ *
+ * Provide default presets via {@link DBX_DATE_TIME_FIELD_MENU_PRESETS_TOKEN}, or set them
+ * dynamically via the `configurations` setter.
+ */
 class DbxDateTimeFieldMenuPresetsService {
     _configurations = new BehaviorSubject(inject(DBX_DATE_TIME_FIELD_MENU_PRESETS_TOKEN, { optional: true }) ?? []);
     configurations$ = this._configurations.asObservable();
@@ -3760,6 +4468,22 @@ var DbxDateTimeValueMode;
      */
     DbxDateTimeValueMode[DbxDateTimeValueMode["SYSTEM_MINUTE_OF_DAY"] = 5] = "SYSTEM_MINUTE_OF_DAY";
 })(DbxDateTimeValueMode || (DbxDateTimeValueMode = {}));
+/**
+ * Creates a parser function that converts raw form input values (Date, string, or number)
+ * into JavaScript Date objects based on the specified value mode.
+ *
+ * Handles timezone conversion when a timezone instance is provided and the mode requires it.
+ *
+ * @param mode - Determines how the input value is interpreted
+ * @param timezoneInstance - Optional timezone converter for UTC-normal date handling
+ * @returns A function that parses input values to Date objects
+ *
+ * @example
+ * ```typescript
+ * const parser = dbxDateTimeInputValueParseFactory(DbxDateTimeValueMode.DATE_STRING, timezoneInstance);
+ * const date = parser('2024-01-15T10:00:00Z');
+ * ```
+ */
 function dbxDateTimeInputValueParseFactory(mode, timezoneInstance) {
     let factory;
     let useTimezoneInstance = true;
@@ -3820,6 +4544,22 @@ function dbxDateTimeInputValueParseFactory(mode, timezoneInstance) {
     }
     return factory;
 }
+/**
+ * Creates a formatter function that converts JavaScript Date objects into the appropriate
+ * output format (Date, ISO string, timestamp, or minute-of-day) based on the specified value mode.
+ *
+ * Handles timezone conversion when a timezone instance is provided and the mode requires it.
+ *
+ * @param mode - Determines the output format
+ * @param timezoneInstance - Optional timezone converter for UTC-normal date handling
+ * @returns A function that formats Date objects to the target output type
+ *
+ * @example
+ * ```typescript
+ * const formatter = dbxDateTimeOutputValueFactory(DbxDateTimeValueMode.DAY_STRING, null);
+ * const dayString = formatter(new Date()); // e.g., '2024-01-15'
+ * ```
+ */
 function dbxDateTimeOutputValueFactory(mode, timezoneInstance) {
     let factory;
     let useTimezoneInstance = true;
@@ -3856,10 +4596,26 @@ function dbxDateTimeOutputValueFactory(mode, timezoneInstance) {
     }
     return factory;
 }
+/**
+ * Compares two date-time field values for equality, handling Date, ISO8601DayString, and number (timestamp/minute) types.
+ *
+ * For string and number types, performs strict equality. For Date objects, compares hours and minutes.
+ *
+ * @param a - First date-time value
+ * @param b - Second date-time value
+ * @returns Whether the two values represent the same date-time
+ */
 function dbxDateTimeIsSameDateTimeFieldValue(a, b) {
     const typeofA = typeof a;
     return a && b ? (typeofA === 'string' || typeofA === 'number' ? a === b : isSameDateHoursAndMinutes(a, b)) : a == b;
 }
+/**
+ * Compares two date range field values for equality by comparing both start and end values.
+ *
+ * @param a - First date range value
+ * @param b - Second date range value
+ * @returns Whether the two date ranges represent the same range
+ */
 function dbxDateRangeIsSameDateRangeFieldValue(a, b) {
     return a && b ? dbxDateTimeIsSameDateTimeFieldValue(a.start, b.start) && dbxDateTimeIsSameDateTimeFieldValue(a.end, b.end) : a == b;
 }
@@ -3879,9 +4635,20 @@ var DbxDateTimeFieldTimeMode;
      */
     DbxDateTimeFieldTimeMode["NONE"] = "none";
 })(DbxDateTimeFieldTimeMode || (DbxDateTimeFieldTimeMode = {}));
+/**
+ * Type guard that checks whether the input is a {@link DbxDateTimeFieldTimeDateConfig}.
+ */
 function isDbxDateTimeFieldTimeDateConfig(input) {
     return input != null && typeof input === 'object' && typeof input.path === 'string';
 }
+/**
+ * Creates an observable that emits the current Date value from a synced field control
+ * matching the specified sync type ('before' or 'after').
+ *
+ * @param parseConfigsObs - Observable of parsed sync field configurations
+ * @param type - The sync direction to filter for
+ * @returns Observable of the synced date value, or null if no matching sync config
+ */
 function syncConfigValueObs(parseConfigsObs, type) {
     return parseConfigsObs.pipe(switchMap((x) => {
         const config = x.find((y) => y.syncType === type);
@@ -3905,6 +4672,15 @@ const DBX_DATE_TIME_FIELD_DATE_NOT_IN_SCHEDULE_ERROR = 'dateTimeFieldDateNotInSc
  * Error code used when the selected time/time input is not in the limited range.
  */
 const DBX_DATE_TIME_FIELD_TIME_NOT_IN_RANGE_ERROR = 'dateTimeFieldTimeNotInRange';
+/**
+ * Formly custom field type for date and time selection.
+ *
+ * Supports date-only, time-only, and combined date-time modes. Handles timezone conversion,
+ * sync with other date fields, configurable presets, and keyboard navigation (arrow keys for
+ * incrementing date/time).
+ *
+ * Registered as Formly type `'datetime'`.
+ */
 class DbxDateTimeFieldComponent extends FieldType$1 {
     dbxDateTimeFieldConfigService = inject(DbxDateTimeFieldMenuPresetsService);
     _sub = new SubscriptionObject();
@@ -4593,6 +5369,15 @@ function dbxFixedDateRangeOutputValueFactory(mode, timezoneInstance) {
     };
 }
 const TIME_OUTPUT_THROTTLE_TIME = 10;
+/**
+ * Formly custom field type for selecting a fixed date range using an inline calendar.
+ *
+ * Supports multiple selection modes (single date, normal range, arbitrary range),
+ * timezone conversion, date range input configuration, and optional text inputs for
+ * start/end dates.
+ *
+ * Registered as Formly type `'fixeddaterange'`.
+ */
 class DbxFixedDateRangeFieldComponent extends FieldType$1 {
     dbxDateTimeFieldMenuPresetsService = inject(DbxDateTimeFieldMenuPresetsService);
     calendar = viewChild.required(MatCalendar);
@@ -5012,6 +5797,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                         }
                     ], imports: [MatDatepickerModule, MatFormFieldModule, FormsModule, ReactiveFormsModule, MatInputModule, MatError, NgClass], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"dbx-fixeddaterange-field\">\n  <mat-calendar #calendarView [selected]=\"calendarSelectionSignal()\" [dateFilter]=\"pickerFilterSignal()\" [minDate]=\"minDateSignal()\" [maxDate]=\"maxDateSignal()\" (selectedChange)=\"selectedChange($event)\"></mat-calendar>\n  <mat-form-field class=\"dbx-fixeddaterange-field-input\" appearance=\"fill\">\n    @if (showRangeInput) {\n      <mat-date-range-input [formGroup]=\"inputRangeForm\">\n        <input #startDateInput matStartDate formControlName=\"start\" placeholder=\"Start date\" />\n        <input #endDateInput [ngClass]=\"endDisabledSignal() ? 'dbx-fixeddaterange-field-input-end' : ''\" [attr.tabindex]=\"endDisabledSignal() ? -1 : 0\" matEndDate formControlName=\"end\" placeholder=\"End date\" />\n      </mat-date-range-input>\n    }\n  </mat-form-field>\n  @if (formControl.hasError('required')) {\n    <mat-error>Date range is required</mat-error>\n  }\n</div>\n" }]
         }], propDecorators: { calendar: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MatCalendar), { isSignal: true }] }], startDateInputElement: [{ type: i0.ViewChild, args: ['startDateInput', { ...{ read: ElementRef }, isSignal: true }] }], endDateInputElement: [{ type: i0.ViewChild, args: ['endDateInput', { ...{ read: ElementRef }, isSignal: true }] }] } });
+/**
+ * Custom Material date range selection strategy for the fixed date range field.
+ *
+ * Provides preview highlighting on the calendar based on the current selection mode
+ * and boundary constraints.
+ */
 class DbxFixedDateRangeFieldSelectionStrategy {
     _dateAdapter = inject((DateAdapter));
     dbxFixedDateRangeFieldComponent = inject(DbxFixedDateRangeFieldComponent);
@@ -5068,6 +5859,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }] });
 
 const importsAndExports$7 = [DbxDateTimeFieldComponent, DbxFixedDateRangeFieldComponent, DbxFormFormlyWrapperModule];
+/** Registers the `datetime` and `fixeddaterange` Formly field types with style and form-field wrappers. */
 class DbxFormFormlyDateFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyDateFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyDateFieldModule, imports: [DbxDateTimeFieldComponent, DbxFixedDateRangeFieldComponent, DbxFormFormlyWrapperModule, i1$1.FormlyModule], exports: [DbxDateTimeFieldComponent, DbxFixedDateRangeFieldComponent, DbxFormFormlyWrapperModule] });
@@ -5096,6 +5888,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Wraps a Formly field config with a named wrapper and its associated props.
+ *
+ * @param fieldConfig - The field config to wrap
+ * @param wrapperKey - The registered wrapper key
+ * @param wrapperProps - Configuration props for the wrapper
+ * @returns A new field config with the wrapper applied
+ *
+ * @example
+ * ```typescript
+ * const wrapped = addWrapperToFormlyFieldConfig(myField, 'section', { header: 'Details' });
+ * ```
+ */
 function addWrapperToFormlyFieldConfig(fieldConfig, wrapperKey, wrapperProps) {
     return {
         wrappers: [wrapperKey],
@@ -5103,30 +5908,58 @@ function addWrapperToFormlyFieldConfig(fieldConfig, wrapperKey, wrapperProps) {
         fieldGroup: [fieldConfig]
     };
 }
+/**
+ * Wraps a field with the auto-touch wrapper that marks the control as touched on value change.
+ */
 function autoTouchWrapper(fieldConfig, autoTouchWrapper = {}) {
     return addWrapperToFormlyFieldConfig(fieldConfig, AUTO_TOUCH_WRAPPER_KEY, autoTouchWrapper);
 }
+/**
+ * Wraps a field with the expand wrapper that shows/hides the field based on value or user click.
+ */
 function expandWrapper(fieldConfig, expandWrapper = {}) {
     return addWrapperToFormlyFieldConfig(fieldConfig, EXPAND_WRAPPER_KEY, expandWrapper);
 }
+/**
+ * Wraps a field with the toggle wrapper that uses a slide toggle to show/hide content.
+ */
 function toggleWrapper(fieldConfig, toggleWrapper = {}) {
     return addWrapperToFormlyFieldConfig(fieldConfig, TOGGLE_WRAPPER_KEY, toggleWrapper);
 }
+/**
+ * Wraps a field group in a section layout with an optional header and hint.
+ */
 function sectionWrapper(fieldConfig, sectionWrapper = {}) {
     return addWrapperToFormlyFieldConfig(fieldConfig, SECTION_WRAPPER_KEY, sectionWrapper);
 }
+/**
+ * Wraps a field group in a subsection layout with an optional header and hint.
+ */
 function subsectionWrapper(fieldConfig, subsectionWrapper = {}) {
     return addWrapperToFormlyFieldConfig(fieldConfig, SUBSECTION_WRAPPER_KEY, subsectionWrapper);
 }
+/**
+ * Wraps a field with an info button that triggers a callback when clicked.
+ */
 function infoWrapper(fieldConfig, infoWrapper) {
     return addWrapperToFormlyFieldConfig(fieldConfig, INFO_WRAPPER_KEY, infoWrapper);
 }
+/**
+ * Wraps a field with dynamic CSS class and style bindings.
+ */
 function styleWrapper(fieldConfig, styleWrapper) {
     return addWrapperToFormlyFieldConfig(fieldConfig, STYLE_WRAPPER_KEY, styleWrapper);
 }
+/**
+ * Wraps a field with a loading indicator that shows during async validation.
+ */
 function workingWrapper(fieldConfig, workingWrapper = {}) {
     return addWrapperToFormlyFieldConfig(fieldConfig, WORKING_WRAPPER_KEY, workingWrapper);
 }
+/**
+ * Type guard that checks if the input is a {@link DbxFlexLayoutWrapperGroupFieldConfig}
+ * (has a `field` property) rather than a plain {@link FormlyFieldConfig}.
+ */
 function checkIsFieldFlexLayoutGroupFieldConfig(input) {
     if (input.field != null) {
         return true;
@@ -5135,6 +5968,22 @@ function checkIsFieldFlexLayoutGroupFieldConfig(input) {
         return false;
     }
 }
+/**
+ * Creates a flex-layout-wrapped field group that arranges child fields horizontally
+ * with configurable sizing, breakpoints, and responsive behavior.
+ *
+ * @param fieldConfigs - Array of field configs or field config pairs with size overrides
+ * @param options - Flex layout defaults including breakpoint, relative sizing, and default size
+ * @returns A {@link FormlyFieldConfig} with flex wrapper applied
+ *
+ * @example
+ * ```typescript
+ * const layout = flexLayoutWrapper([
+ *   { field: textField({ key: 'first' }), size: 2 },
+ *   { field: textField({ key: 'last' }), size: 2 }
+ * ], { relative: true });
+ * ```
+ */
 function flexLayoutWrapper(fieldConfigs, { relative, breakpoint, breakToColumn, size: defaultSize = 2 } = {}) {
     return {
         wrappers: ['flex'],
@@ -5172,6 +6021,10 @@ readonly addonLeft?: Maybe<NumberFieldAddon>;
 readonly addonRight?: Maybe<NumberFieldAddon>;
 */
 
+/**
+ * Factory that returns an observable of a date-time picker configuration
+ * that automatically selects the next upcoming time, rounded down to the nearest minute.
+ */
 const TAKE_NEXT_UPCOMING_TIME_CONFIG_OBS = () => of({
     takeNextUpcomingTime: true,
     roundDownToMinute: true
@@ -5186,6 +6039,18 @@ function timeOnlyField(config = {}) {
         timeOnly: true
     });
 }
+/**
+ * Creates a Formly field configuration for a date-time picker with optional time selection,
+ * timezone awareness, and preset values.
+ *
+ * @param config - Optional overrides; defaults to key `'date'`, time mode `REQUIRED`
+ * @returns A validated {@link FormlyFieldConfig} with type `'datetime'`
+ *
+ * @example
+ * ```typescript
+ * const field = dateTimeField({ key: 'startDate', label: 'Start', required: true });
+ * ```
+ */
 function dateTimeField(config = {}) {
     const { key = 'date', showClearButton, dateLabel, timeLabel, allDayLabel, atTimeLabel, timeDate, timezone, minuteStep, showTimezone, timeMode = DbxDateTimeFieldTimeMode.REQUIRED, valueMode, alwaysShowDateInput, autofillDateWhenTimeIsPicked, fullDayInUTC, fullDayFieldName, pickerConfig, getSyncFieldsObs, hideDatePicker, hideDateHint, timeOnly = false, presets, materialFormField } = config;
     const classGetter = 'dbx-mat-form-field-disable-underline dbx-mat-form-date-time-field-wrapper';
@@ -5220,6 +6085,18 @@ function dateTimeField(config = {}) {
     });
     return fieldConfig;
 }
+/**
+ * Creates a pair of date pickers for selecting a date range (start and end dates)
+ * arranged in a flex layout. The pickers are synchronized so the start date stays before the end date.
+ *
+ * @param config - Date range configuration with optional start/end overrides
+ * @returns A {@link FormlyFieldConfig} containing the start and end date field pair
+ *
+ * @example
+ * ```typescript
+ * const field = dateRangeField({ required: true, start: { key: 'from' }, end: { key: 'to' } });
+ * ```
+ */
 function dateRangeField(config = {}) {
     const { required: inputRequired, start, end, timeDate, timezone, showTimezone, presets, valueMode, minuteStep } = config;
     const required = inputRequired ?? start?.required ?? false;
@@ -5260,6 +6137,18 @@ function dateRangeField(config = {}) {
         fieldGroup: [flexLayoutWrapper([startField, endField], { relative: true, breakToColumn: true, breakpoint: 'large' })]
     };
 }
+/**
+ * Creates a pair of time-only pickers for selecting a time range (start and end times)
+ * arranged in a flex layout.
+ *
+ * @param inputConfig - Time range configuration with optional start/end overrides
+ * @returns A {@link FormlyFieldConfig} containing the start and end time field pair
+ *
+ * @example
+ * ```typescript
+ * const field = dateTimeRangeField({ required: true });
+ * ```
+ */
 function dateTimeRangeField(inputConfig = {}) {
     const { required = false, start: inputStart, end: inputEnd, timezone, timeDate, showTimezone, presets, valueMode, minuteStep } = inputConfig;
     function dateTimeRangeFieldConfig(config) {
@@ -5296,6 +6185,17 @@ function dateTimeRangeField(inputConfig = {}) {
     };
     return dateRangeField(config);
 }
+/**
+ * Creates a Formly field configuration for a fixed date range picker.
+ *
+ * @param config - Optional overrides; defaults to key `'dateRange'`
+ * @returns A validated {@link FormlyFieldConfig} with type `'fixeddaterange'`
+ *
+ * @example
+ * ```typescript
+ * const field = fixedDateRangeField({ key: 'eventDates', required: true });
+ * ```
+ */
 function fixedDateRangeField(config = {}) {
     const { key = 'dateRange', dateRangeInput, pickerConfig, timezone, selectionMode, showTimezone, valueMode, fullDayInUTC, presets, showRangeInput, materialFormField } = config;
     const classGetter = 'dbx-mat-form-field-disable-underline dbx-form-fixed-date-range-field-wrapper';
@@ -5545,31 +6445,47 @@ const IS_NOT_WEBSITE_URL_WITH_EXPECTED_DOMAIN_VALIDATION_KEY = 'isNotWebsiteUrlW
  * @returns
  */
 function isWebsiteUrlValidator(config) {
-    const { requirePrefix, validDomains: inputValidDomains } = config ?? {};
+    const { requirePrefix, allowPorts, validDomains: inputValidDomains } = config ?? {};
     const isPrefixRequired = requirePrefix ?? true;
+    const isAllowPorts = allowPorts ?? false;
     const validDomains = asArray(inputValidDomains);
     const validDomainsSet = new Set(validDomains);
     const validateDomains = validDomainsSet.size > 0;
+    function isValidUrl(details) {
+        if (isPrefixRequired) {
+            if (isWebsiteUrlWithPrefix(details.input)) {
+                return true;
+            }
+        }
+        else if (details.isWebsiteUrl) {
+            return true;
+        }
+        if (isAllowPorts && details.hasPortNumber) {
+            return isPrefixRequired ? details.hasHttpPrefix : true;
+        }
+        return false;
+    }
+    const portNumbersMessagePart = isAllowPorts ? '' : ' Urls with port numbers (e.g. localhost:8080) are not allowed.';
     const validateWebsiteValue = isPrefixRequired
         ? (details) => {
-            return isWebsiteUrlWithPrefix(details.input)
+            return isValidUrl(details)
                 ? null
                 : {
                     [IS_NOT_WEBSITE_URL_WITH_PREFIX_VALIDATION_KEY]: {
                         value: details.input,
                         isPrefixRequired,
-                        message: `Value is not a website url with an http/https prefix.`
+                        message: `Value is not a website url with an http/https prefix.${portNumbersMessagePart}`
                     }
                 };
         }
         : (details) => {
-            return details.isWebsiteUrl
+            return isValidUrl(details)
                 ? null
                 : {
                     [IS_NOT_WEBSITE_URL_VALIDATION_KEY]: {
                         value: details.input,
                         isPrefixRequired,
-                        message: `Value is not a valid website url.`
+                        message: `Value is not a valid website url.${portNumbersMessagePart}`
                     }
                 };
         };
@@ -5602,6 +6518,18 @@ function isWebsiteUrlValidator(config) {
     };
 }
 
+/**
+ * Builds an array of value parsers for a number field, incorporating any configured
+ * number transformation (e.g., precision, rounding) as a parser prepended to existing parsers.
+ *
+ * @param config - Parser and transform configuration
+ * @returns Array of value parsers, or undefined if none configured
+ *
+ * @example
+ * ```typescript
+ * const parsers = numberFieldTransformParser({ transform: { precision: 2 } });
+ * ```
+ */
 function numberFieldTransformParser(config) {
     const { parsers: inputParsers, transform } = config;
     let parsers;
@@ -5614,6 +6542,19 @@ function numberFieldTransformParser(config) {
     }
     return parsers;
 }
+/**
+ * Creates a Formly field configuration for a numeric input.
+ *
+ * Adds a divisibility validator when both `step` and `enforceStep` are set.
+ *
+ * @param config - Number field configuration
+ * @returns A validated {@link FormlyFieldConfig} with type `'input'` and input type `'number'`
+ *
+ * @example
+ * ```typescript
+ * const field = numberField({ key: 'quantity', label: 'Quantity', min: 1, max: 100, step: 1 });
+ * ```
+ */
 function numberField(config) {
     const { key, min, max, step, enforceStep, inputType: type = 'number', materialFormField } = config;
     const parsers = numberFieldTransformParser(config);
@@ -5637,6 +6578,17 @@ function numberField(config) {
         parsers
     });
 }
+/**
+ * Creates a Formly field configuration for a Material slider input.
+ *
+ * @param config - Slider field configuration including max (required), thumb label, and tick interval
+ * @returns A validated {@link FormlyFieldConfig} with type `'slider'`
+ *
+ * @example
+ * ```typescript
+ * const field = numberSliderField({ key: 'rating', label: 'Rating', min: 0, max: 10, step: 1 });
+ * ```
+ */
 function numberSliderField(config) {
     const { key, min, max, step, enforceStep, inputType: type = 'number', materialFormField, thumbLabel: inputThumbLabel, tickInterval: inputTickInterval, invertSelectionColoring: invertedSelectionColoring = false, displayWith } = config;
     const parsers = numberFieldTransformParser(config);
@@ -5670,11 +6622,23 @@ function numberSliderField(config) {
         parsers
     });
 }
+/**
+ * Creates a number field pre-configured for dollar amount input with cent-level precision.
+ *
+ * @param config - Number field configuration (precision is overridden to dollar amount precision)
+ * @returns A {@link FormlyFieldConfig} for dollar amount input
+ *
+ * @example
+ * ```typescript
+ * const field = dollarAmountField({ key: 'price', label: 'Price', min: 0, required: true });
+ * ```
+ */
 function dollarAmountField(config) {
     return numberField({ ...config, transform: { ...config.transform, precision: config.transform?.precision ?? DOLLAR_AMOUNT_PRECISION } }); // TODO: Add wrapper addon, addonLeft: { text: '$' }
 }
 
 const importsAndExports$6 = [FormlyMaterialModule, FormlyMatSliderModule];
+/** Provides Formly Material number input and slider support. */
 class DbxFormFormlyNumberFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyNumberFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyNumberFieldModule, imports: [FormlyMaterialModule, FormlyMatSliderModule], exports: [FormlyMaterialModule, FormlyMatSliderModule] });
@@ -5688,7 +6652,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/** Default preferred countries shown at the top of the phone country dropdown. */
 const DEFAULT_PREFERRED_COUNTRIES = ['us'];
+/**
+ * Formly custom field type for international phone number input with optional extension support.
+ *
+ * Uses ngx-mat-input-tel for the country-aware phone input and manages E.164 phone number
+ * formatting. Supports splitting phone + extension pairs for storage and display.
+ *
+ * Registered as Formly type `'intphone'`.
+ */
 class DbxPhoneFieldComponent extends FieldType$1 {
     inputSync = new SubscriptionObject();
     outputSync = new SubscriptionObject();
@@ -5780,6 +6753,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }] });
 
 const importsAndExports$5 = [DbxPhoneFieldComponent];
+/** Registers the `intphone` Formly field type for international phone number input. */
 class DbxFormFormlyPhoneFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyPhoneFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyPhoneFieldModule, imports: [DbxPhoneFieldComponent, i1$1.FormlyModule], exports: [DbxPhoneFieldComponent] });
@@ -5800,6 +6774,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Builds an array of value parsers for a text field, incorporating any configured
+ * string transformation (e.g., trim, lowercase) as a parser prepended to existing parsers.
+ *
+ * @param config - Parser and transform configuration
+ * @returns Array of value parsers, or undefined if none configured
+ *
+ * @example
+ * ```typescript
+ * const parsers = textFieldTransformParser({ transform: { trim: true, toLowercase: true } });
+ * ```
+ */
 function textFieldTransformParser(config) {
     const { parsers: inputParsers, transform } = config;
     let parsers;
@@ -5812,6 +6798,17 @@ function textFieldTransformParser(config) {
     }
     return parsers;
 }
+/**
+ * Creates a Formly field configuration for a single-line text input.
+ *
+ * @param config - Text field configuration including key, label, validation, and transform options
+ * @returns A validated {@link FormlyFieldConfig} with type `'input'`
+ *
+ * @example
+ * ```typescript
+ * const field = textField({ key: 'username', label: 'Username', maxLength: 50, required: true });
+ * ```
+ */
 function textField(config) {
     const { transform, key, pattern, minLength, maxLength, inputType: type = 'text', materialFormField } = config;
     const parsers = textFieldTransformParser(config);
@@ -5828,6 +6825,17 @@ function textField(config) {
         parsers
     });
 }
+/**
+ * Creates a Formly field configuration for a multi-line textarea input.
+ *
+ * @param config - Textarea field configuration including key, label, rows, and validation options
+ * @returns A validated {@link FormlyFieldConfig} with type `'textarea'`
+ *
+ * @example
+ * ```typescript
+ * const field = textAreaField({ key: 'bio', label: 'Biography', rows: 5, maxLength: 500 });
+ * ```
+ */
 function textAreaField(config) {
     const { key, rows = 3, pattern, minLength, maxLength, materialFormField } = config;
     const parsers = textFieldTransformParser(config);
@@ -5845,6 +6853,18 @@ function textAreaField(config) {
     });
 }
 
+/**
+ * Creates a Formly field configuration for an international phone number input
+ * with E.164 validation.
+ *
+ * @param config - Optional overrides; defaults to key `'phone'`, label `'Phone Number'`
+ * @returns A validated {@link FormlyFieldConfig} with type `'intphone'`
+ *
+ * @example
+ * ```typescript
+ * const field = phoneField({ preferredCountries: ['us', 'ca'], required: true });
+ * ```
+ */
 function phoneField(config = {}) {
     const { key = 'phone', label = 'Phone Number', preferredCountries, enableSearch, onlyCountries, allowExtension: inputAllowExtension } = config;
     const allowExtension = inputAllowExtension ?? false;
@@ -5865,9 +6885,16 @@ function phoneField(config = {}) {
     return fieldConfig;
 }
 /**
- * Puts a phone and
- * @param param0
- * @returns
+ * Creates a flex-layout-wrapped pair of a phone number field and a label text field,
+ * useful for collecting named phone numbers (e.g., "Work", "Home").
+ *
+ * @param config - Optional phone and label field configurations
+ * @returns A flex-layout-wrapped {@link FormlyFieldConfig}
+ *
+ * @example
+ * ```typescript
+ * const field = wrappedPhoneAndLabelField({ phoneField: { required: true } });
+ * ```
  */
 function wrappedPhoneAndLabelField({ phoneField: phone, labelField: label } = {}) {
     return flexLayoutWrapper([
@@ -5886,6 +6913,17 @@ function wrappedPhoneAndLabelField({ phoneField: phone, labelField: label } = {}
         }
     ], { relative: true });
 }
+/**
+ * Creates a section-wrapped phone + label field pair with a configurable header.
+ *
+ * @param config - Optional overrides; defaults to header `'Phone Number'`
+ * @returns A section-wrapped {@link FormlyFieldConfig}
+ *
+ * @example
+ * ```typescript
+ * const field = phoneAndLabelSectionField({ header: 'Contact Phone' });
+ * ```
+ */
 function phoneAndLabelSectionField({ key, header = 'Phone Number', hint, phoneField, labelField } = {}) {
     return sectionWrapper({
         key,
@@ -5895,6 +6933,17 @@ function phoneAndLabelSectionField({ key, header = 'Phone Number', hint, phoneFi
         hint
     });
 }
+/**
+ * Creates a repeat-array field that allows the user to add multiple phone number entries.
+ *
+ * @param repeatConfig - Optional overrides; defaults to key `'phones'`, label `'Phone Numbers'`
+ * @returns A {@link FormlyFieldConfig} with repeat-array type for multiple phone entries
+ *
+ * @example
+ * ```typescript
+ * const field = phoneListField({ phoneAndLabel: { phoneField: { preferredCountries: ['us'] } } });
+ * ```
+ */
 function phoneListField(repeatConfig = {}) {
     const { key = 'phones', label = 'Phone Numbers', addText = 'Add Phone Number', removeText = 'Remove Phone Number', repeatFieldGroup, phoneAndLabel } = repeatConfig;
     return repeatArrayField({
@@ -5907,10 +6956,24 @@ function phoneListField(repeatConfig = {}) {
     });
 }
 
+/** Maximum character length for a phone label field. */
 const PHONE_LABEL_MAX_LENGTH = 100;
+/** Maximum character length for a generic label string field. */
 const LABEL_STRING_MAX_LENGTH = 100;
+/** Maximum character length for a search string field. */
 const SEARCH_STRING_MAX_LENGTH = 100;
 // MARK: Name Field
+/**
+ * Creates a text field pre-configured for a person's full name.
+ *
+ * @param config - Optional overrides; defaults to key `'name'`, label `'Name'`
+ * @returns A {@link FormlyFieldConfig} for name input
+ *
+ * @example
+ * ```typescript
+ * const field = nameField({ required: true });
+ * ```
+ */
 function nameField(config = {}) {
     const { key = 'name', label = 'Name', placeholder = 'John Doe', required = false, minLength, maxLength, attributes } = config;
     return textField({
@@ -5924,6 +6987,17 @@ function nameField(config = {}) {
         attributes
     });
 }
+/**
+ * Creates a text field pre-configured for email address input with built-in email validation.
+ *
+ * @param config - Optional overrides; defaults to key `'email'`, label `'Email Address'`
+ * @returns A {@link FormlyFieldConfig} with email validation
+ *
+ * @example
+ * ```typescript
+ * const field = emailField({ required: true });
+ * ```
+ */
 function emailField(config = {}) {
     const { key = 'email', label = 'Email Address', placeholder = 'you@example.com' } = config;
     const emailFieldConfig = textField({
@@ -5941,6 +7015,17 @@ function emailField(config = {}) {
     };
     return emailFieldConfig;
 }
+/**
+ * Creates a text field pre-configured for city name input with autocomplete support.
+ *
+ * @param config - Optional overrides; defaults to key `'city'`, label `'City'`
+ * @returns A {@link FormlyFieldConfig} for city input
+ *
+ * @example
+ * ```typescript
+ * const field = cityField({ required: true });
+ * ```
+ */
 function cityField(config = {}) {
     const { key = 'city', placeholder = '', label = 'City', autocomplete = 'city', maxLength = ADDRESS_CITY_MAX_LENGTH, required = false } = config;
     return textField({
@@ -5953,6 +7038,19 @@ function cityField(config = {}) {
         maxLength
     });
 }
+/**
+ * Creates a text field pre-configured for US state input with optional state code validation.
+ *
+ * When `asCode` is true, enforces the 2-letter state code pattern and auto-uppercases input.
+ *
+ * @param config - Optional overrides; defaults to key `'state'`, label `'State'`
+ * @returns A {@link FormlyFieldConfig} for state input
+ *
+ * @example
+ * ```typescript
+ * const field = stateField({ asCode: true, required: true });
+ * ```
+ */
 function stateField(config = {}) {
     const { asCode = false, pattern = asCode ? US_STATE_CODE_STRING_REGEX : undefined, key = 'state', placeholder = '', label = 'State', autocomplete = 'state', maxLength = asCode ? ADDRESS_STATE_CODE_MAX_LENGTH : ADDRESS_STATE_MAX_LENGTH, transform, required = false } = config;
     return textField({
@@ -5970,6 +7068,17 @@ function stateField(config = {}) {
         }
     });
 }
+/**
+ * Creates a text field pre-configured for country name input with autocomplete support.
+ *
+ * @param config - Optional overrides; defaults to key `'country'`, label `'Country'`
+ * @returns A {@link FormlyFieldConfig} for country input
+ *
+ * @example
+ * ```typescript
+ * const field = countryField({ required: true });
+ * ```
+ */
 function countryField(config = {}) {
     const { key = 'country', placeholder = '', label = 'Country', autocomplete = 'country', maxLength = ADDRESS_COUNTRY_MAX_LENGTH, required = false } = config;
     return textField({
@@ -5982,6 +7091,17 @@ function countryField(config = {}) {
         maxLength
     });
 }
+/**
+ * Creates a text field pre-configured for US zip code input with pattern validation.
+ *
+ * @param config - Optional overrides; defaults to key `'zip'`, label `'Zip Code'`
+ * @returns A {@link FormlyFieldConfig} for zip code input
+ *
+ * @example
+ * ```typescript
+ * const field = zipCodeField({ required: true });
+ * ```
+ */
 function zipCodeField(config = {}) {
     const { key = 'zip', placeholder = '', label = 'Zip Code', autocomplete = 'postal-code', pattern = ZIP_CODE_STRING_REGEX, maxLength = ADDRESS_ZIP_MAX_LENGTH, required = false } = config;
     return textField({
@@ -5996,8 +7116,21 @@ function zipCodeField(config = {}) {
     });
 }
 // MARK: LatLng Text Field
+/** Default placeholder text for a latitude/longitude text field. */
 const DEFAULT_LAT_LNG_TEXT_FIELD_PLACEHOLDER = '12.345,-67.8910';
+/** Default validation error message for invalid coordinate input. */
 const DEFAULT_LAT_LNG_TEXT_FIELD_PATTERN_MESSAGE = `Invalid/unknown coordinates`;
+/**
+ * Creates a text field pre-configured for latitude/longitude coordinate input with pattern validation.
+ *
+ * @param config - Optional overrides; defaults to key `'latLng'`
+ * @returns A {@link FormlyFieldConfig} for coordinate input
+ *
+ * @example
+ * ```typescript
+ * const field = latLngTextField();
+ * ```
+ */
 function latLngTextField({ key = 'latLng' } = {}) {
     const field = {
         ...textField({
@@ -6016,6 +7149,18 @@ function latLngTextField({ key = 'latLng' } = {}) {
     return field;
 }
 
+/**
+ * Creates a text field for a single address line with autocomplete support.
+ *
+ * @param config - Optional overrides; line number determines key and label
+ * @returns A {@link FormlyFieldConfig} for address line input
+ *
+ * @example
+ * ```typescript
+ * const line1 = addressLineField({ line: 1, required: true });
+ * const line2 = addressLineField({ line: 2 });
+ * ```
+ */
 function addressLineField(config = {}) {
     const { line = 1 } = config;
     const lineCode = Math.max(1, line); // minimum of line 1
@@ -6030,6 +7175,18 @@ function addressLineField(config = {}) {
         maxLength
     });
 }
+/**
+ * Creates the full set of address form fields (lines, city, state, zip, and optionally country)
+ * arranged in a flex layout.
+ *
+ * @param config - Address fields configuration
+ * @returns Array of {@link FormlyFieldConfig} for a complete address form section
+ *
+ * @example
+ * ```typescript
+ * const fields = addressFormlyFields({ required: true, includeCountry: false });
+ * ```
+ */
 function addressFormlyFields(config = {}) {
     const { required = true, includeLine2 = true, includeCountry = true } = config;
     const singleLineFields = [
@@ -6057,6 +7214,17 @@ function addressFormlyFields(config = {}) {
     }
     return [...lines, flexLayoutWrapper(singleLineFields, { size: 1, relative: true })];
 }
+/**
+ * Creates a section-wrapped address field group containing all address sub-fields.
+ *
+ * @param config - Optional overrides; defaults to key `'address'`, header `'Address'`
+ * @returns A section-wrapped {@link FormlyFieldConfig} containing address fields
+ *
+ * @example
+ * ```typescript
+ * const field = addressField({ required: true, includeCountry: true });
+ * ```
+ */
 function addressField(config = {}) {
     const { key = 'address', header = 'Address', hint, required = false } = config;
     return sectionWrapper({
@@ -6070,6 +7238,17 @@ function addressField(config = {}) {
         hint
     });
 }
+/**
+ * Creates a repeat-array field that allows the user to add multiple addresses.
+ *
+ * @param config - Optional overrides; defaults to key `'addresses'`, max 6 entries
+ * @returns A {@link FormlyFieldConfig} with repeat-array type for multiple addresses
+ *
+ * @example
+ * ```typescript
+ * const field = addressListField({ maxAddresses: 3, required: true });
+ * ```
+ */
 function addressListField(config = {}) {
     const { key = 'addresses', required = false, maxAddresses = 6 } = config;
     return repeatArrayField({
@@ -6085,6 +7264,7 @@ function addressListField(config = {}) {
 }
 
 const importsAndExports$4 = [DbxFormFormlyArrayFieldModule, FormlyMaterialModule, FormlyMatInputModule, DbxFormFormlyWrapperModule];
+/** Aggregates Formly Material input, array field, and wrapper modules for text field support. */
 class DbxFormFormlyTextFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyTextFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyTextFieldModule, imports: [DbxFormFormlyArrayFieldModule, FormlyMaterialModule, FormlyMatInputModule, DbxFormFormlyWrapperModule], exports: [DbxFormFormlyArrayFieldModule, FormlyMaterialModule, FormlyMatInputModule, DbxFormFormlyWrapperModule] });
@@ -6098,6 +7278,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Creates a Formly field configuration for a hidden field with no visual representation.
+ *
+ * Useful for passing programmatic values through the form model without user interaction.
+ *
+ * @param config - Key and optional required flag
+ * @returns A validated {@link FormlyFieldConfig} with no visible type
+ *
+ * @example
+ * ```typescript
+ * const field = hiddenField({ key: 'userId', required: true });
+ * ```
+ */
 function hiddenField({ key, required = false }) {
     return formlyField({
         key,
@@ -6106,6 +7299,7 @@ function hiddenField({ key, required = false }) {
 }
 
 const importsAndExports$3 = [DbxFormFormlyChecklistItemFieldModule, DbxFormFormlyComponentFieldModule, DbxFormFormlyTextEditorFieldModule, DbxFormFormlyWrapperModule];
+/** Aggregates all custom Formly field type modules (checklist, component, texteditor) and wrappers. */
 class DbxFormFormlyFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormFormlyFieldModule, imports: [DbxFormFormlyChecklistItemFieldModule, DbxFormFormlyComponentFieldModule, DbxFormFormlyTextEditorFieldModule, DbxFormFormlyWrapperModule], exports: [DbxFormFormlyChecklistItemFieldModule, DbxFormFormlyComponentFieldModule, DbxFormFormlyTextEditorFieldModule, DbxFormFormlyWrapperModule] });
@@ -6259,6 +7453,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }], propDecorators: { search: [{ type: i0.Output, args: ["search"] }] } });
 
+/**
+ * Creates a text field with an async validator that checks whether the entered value is available.
+ *
+ * The field is wrapped in a working wrapper to display a loading indicator during the async check.
+ *
+ * @param config - Configuration for the text field and availability validation.
+ * @returns A Formly field configuration with async availability validation.
+ *
+ * @example
+ * ```ts
+ * const usernameField = textIsAvailableField({
+ *   key: 'username',
+ *   label: 'Username',
+ *   isAvailable: (value) => checkUsernameAvailable(value),
+ *   isNotAvailableErrorMessage: 'Username is already taken'
+ * });
+ * ```
+ */
 function textIsAvailableField(config) {
     const field = textField(config);
     field.asyncValidators = {
@@ -6275,6 +7487,11 @@ function textIsAvailableField(config) {
 }
 
 const importsAndExports$2 = [DbxFormFormlyTextFieldModule, DbxFormFormlyWrapperModule];
+/**
+ * Angular module that provides the dependencies needed for the text availability field template.
+ *
+ * Imports and re-exports the text field and wrapper modules required by {@link textIsAvailableField}.
+ */
 class DbxFormTextAvailableFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormTextAvailableFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormTextAvailableFieldModule, imports: [DbxFormFormlyTextFieldModule, DbxFormFormlyWrapperModule], exports: [DbxFormFormlyTextFieldModule, DbxFormFormlyWrapperModule] });
@@ -6289,10 +7506,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }] });
 
 /**
- * Configured simple text password field.
+ * Creates a simple text password field with the input type set to `'password'`.
  *
- * @param config
- * @returns
+ * Defaults to the key `'password'` and label `'Password'` unless overridden.
+ *
+ * @param config - Optional configuration for the password field.
+ * @returns A Formly field configuration for a password input.
  */
 function textPasswordField(config) {
     return textField({
@@ -6304,10 +7523,12 @@ function textPasswordField(config) {
     });
 }
 /**
- * Configured verify field for a password.
+ * Creates a verify/confirm password field, typically used alongside a primary password field.
  *
- * @param config
- * @returns
+ * Defaults to the key `'verifyPassword'` and label `'Verify Password'` unless overridden.
+ *
+ * @param config - Optional configuration for the verify password field.
+ * @returns A Formly field configuration for a verify password input.
  */
 function textVerifyPasswordField(config) {
     return textPasswordField({
@@ -6317,6 +7538,13 @@ function textVerifyPasswordField(config) {
         required: true
     });
 }
+/**
+ * Creates a Formly field group containing a password field and a verify password field
+ * with a cross-field validator that ensures both values match.
+ *
+ * @param config - Configuration for the password and verify password fields.
+ * @returns A Formly field group configuration with password matching validation.
+ */
 function textPasswordWithVerifyFieldGroup(config) {
     const passwordFieldConfig = textPasswordField(config.password);
     const verifyPasswordFieldKey = config.verifyPassword?.key ?? `verify${capitalizeFirstLetter(String(passwordFieldConfig.key))}`;
@@ -6351,6 +7579,13 @@ function usernamePasswordLoginFields({ username, password, verifyPassword }) {
     const passwordField = verifyPassword ? textPasswordWithVerifyFieldGroup({ password, verifyPassword: verifyPassword === true ? undefined : verifyPassword }) : textPasswordField(password);
     return [usernameField, passwordField];
 }
+/**
+ * Creates a single username field for a login form. Supports email or plain text input
+ * based on the provided configuration.
+ *
+ * @param username - Either `'email'`, `'username'`, or a full {@link UsernameLoginFieldUsernameConfig}.
+ * @returns A Formly field configuration for the username input.
+ */
 function usernameLoginField(username) {
     let usernameField;
     let usernameFieldConfig = username;
@@ -6377,6 +7612,11 @@ function usernameLoginField(username) {
 }
 
 const importsAndExports$1 = [DbxFormFormlyTextFieldModule];
+/**
+ * Angular module that provides the dependencies needed for login form field templates.
+ *
+ * Imports and re-exports the text field module required by the username/password login field functions.
+ */
 class DbxFormLoginFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormLoginFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormLoginFieldModule, imports: [DbxFormFormlyTextFieldModule], exports: [DbxFormFormlyTextFieldModule] });
@@ -6390,6 +7630,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
+/**
+ * Creates a search function for timezone strings that searches across all known timezone infos.
+ *
+ * When the search string is empty, the system timezone is returned first, followed by all timezones.
+ *
+ * @returns A {@link SearchableValueFieldStringSearchFn} for searching timezone values.
+ */
 function timezoneStringSearchFunction() {
     const timezoneInfos = allTimezoneInfos();
     return (search) => {
@@ -6403,6 +7650,12 @@ function timezoneStringSearchFunction() {
         return of(searchResults.map((meta) => ({ value: meta.timezone, meta })));
     };
 }
+/**
+ * Display function for timezone string values in a searchable field.
+ *
+ * Maps each timezone value to a display object with the timezone name as the label
+ * and its abbreviation as the sublabel.
+ */
 const DISPLAY_FOR_TIMEZONE_STRING_VALUE = (values) => {
     const timezoneInfos = allTimezoneInfos();
     const displayValues = values.map((x) => {
@@ -6413,10 +7666,13 @@ const DISPLAY_FOR_TIMEZONE_STRING_VALUE = (values) => {
     return obs;
 };
 /**
- * Template for a searchable text field for a timezone.
+ * Creates a searchable text field for selecting a timezone.
  *
- * @param param0
- * @returns
+ * Defaults to the key `'timezone'` and label `'Timezone'`. Searches all known timezones
+ * and displays the timezone name with its abbreviation.
+ *
+ * @param config - Optional configuration overrides for the timezone field.
+ * @returns A Formly field configuration for timezone selection.
  */
 function timezoneStringField(config = {}) {
     return searchableTextField({
@@ -6434,6 +7690,11 @@ function timezoneStringField(config = {}) {
 }
 
 const importsAndExports = [DbxFormFormlySearchableFieldModule];
+/**
+ * Angular module that provides the dependencies needed for the timezone string field template.
+ *
+ * Imports and re-exports the searchable field module required by {@link timezoneStringField}.
+ */
 class DbxFormTimezoneStringFieldModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormTimezoneStringFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxFormTimezoneStringFieldModule, imports: [DbxFormFormlySearchableFieldModule], exports: [DbxFormFormlySearchableFieldModule] });
@@ -6448,10 +7709,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }] });
 
 /**
- * Configured simple text password field.
+ * Creates a text field configured for website URL input with URL validation.
  *
- * @param config
- * @returns
+ * Defaults to the key `'website'` and label `'Website Url'` unless overridden in the config.
+ *
+ * @param config - Optional configuration for the website URL field.
+ * @returns A Formly field configuration with website URL validation.
  */
 function websiteUrlField(config) {
     const validators = [isWebsiteUrlValidator(config)];
@@ -6493,6 +7756,10 @@ function provideDbxFormFormlyFieldDeclarations() {
 
 /**
  * Provides vertical spacing after a form.
+ *
+ * Can be used as an element (`<dbx-form-spacer>`), attribute (`[dbxFormSpacer]`), or CSS class (`.dbx-form-spacer`).
+ *
+ * @selector `dbx-form-spacer,[dbxFormSpacer],.dbx-form-spacer`
  */
 class DbxFormSpacerDirective {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxFormSpacerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });