@dereekb/dbx-form 11.1.8 → 12.0.0

package/lib/formly/field/selection/list/list.field.module.d.ts

@@ -1,18 +1,8 @@
 import * as i0 from "@angular/core";
 import * as i1 from "./list.field.component";
-import * as i2 from "@angular/common";
-import * as i3 from "@dereekb/dbx-web";
-import * as i4 from "@angular/forms";
-import * as i5 from "@angular/material/divider";
-import * as i6 from "@angular/material/button";
-import * as i7 from "@angular/material/input";
-import * as i8 from "@angular/material/form-field";
-import * as i9 from "@angular/material/autocomplete";
-import * as i10 from "@angular/material/icon";
-import * as i11 from "@dereekb/dbx-core";
-import * as i12 from "@ngx-formly/core";
+import * as i2 from "@ngx-formly/core";
 export declare class DbxFormFormlyDbxListFieldModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxFormFormlyDbxListFieldModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxFormFormlyDbxListFieldModule, [typeof i1.DbxItemListFieldComponent], [typeof i2.CommonModule, typeof i3.DbxTextModule, typeof i3.DbxLoadingModule, typeof i3.DbxButtonModule, typeof i4.FormsModule, typeof i5.MatDividerModule, typeof i6.MatButtonModule, typeof i7.MatInputModule, typeof i8.MatFormFieldModule, typeof i4.ReactiveFormsModule, typeof i9.MatAutocompleteModule, typeof i10.MatIconModule, typeof i11.DbxInjectionComponentModule, typeof i3.DbxListLayoutModule, typeof i12.FormlyModule], [typeof i1.DbxItemListFieldComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxFormFormlyDbxListFieldModule, never, [typeof i1.DbxItemListFieldComponent, typeof i2.FormlyModule], [typeof i1.DbxItemListFieldComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DbxFormFormlyDbxListFieldModule>;
 }

package/lib/formly/field/selection/pickable/_pickable.scss

@@ -22,9 +22,9 @@
 
 @mixin theme($theme-config) {
   @include theming.private-check-duplicate-theme-styles($theme-config, 'dbx-form-field-selection-pickable') {
-    $color: theming.get-color-config($theme-config);
-    $density: theming.get-density-config($theme-config);
-    $typography: theming.get-typography-config($theme-config);
+    $color: theming.m2-get-color-config($theme-config);
+    $density: theming.m2-get-density-config($theme-config);
+    $typography: theming.m2-get-typography-config($theme-config);
 
     @if $color !=null {
       @include color($theme-config);

package/lib/formly/field/selection/pickable/pickable.chip.field.component.d.ts

@@ -6,5 +6,5 @@ import * as i0 from "@angular/core";
 export declare class DbxPickableChipListFieldComponent<T> extends AbstractDbxPickableItemFieldDirective<T> {
     itemClicked(item: PickableItemFieldItem<T>): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxPickableChipListFieldComponent<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxPickableChipListFieldComponent<any>, "ng-component", never, {}, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxPickableChipListFieldComponent<any>, "ng-component", never, {}, {}, never, never, true, never>;
 }

package/lib/formly/field/selection/pickable/pickable.field.directive.d.ts

@@ -1,5 +1,5 @@
 import { DbxInjectionComponentConfig } from '@dereekb/dbx-core';
-import { LoadingState, ListLoadingStateContextInstance } from '@dereekb/rxjs';
+import { LoadingState } from '@dereekb/rxjs';
 import { PrimativeKey, Maybe, ArrayOrValue } from '@dereekb/util';
 import { OnDestroy, OnInit } from '@angular/core';
 import { FormControl, AbstractControl } from '@angular/forms';
@@ -19,69 +19,69 @@ export interface PickableValueFieldsFieldProps<T, M = unknown, H extends Primati
     /**
      * Loads all pickable values.
      */
-    loadValues: PickableValueFieldLoadValuesFunction<T, M>;
+    readonly loadValues: PickableValueFieldLoadValuesFunction<T, M>;
     /**
      * Used for building a display value given the input.
      */
-    displayForValue: PickableValueFieldDisplayFunction<T, M>;
+    readonly displayForValue: PickableValueFieldDisplayFunction<T, M>;
     /**
      * Used for hashing display values and omitting repeat values.
      *
      * If hashForValue is not provided, the value's value will be used as is.
      */
-    hashForValue?: PickableValueFieldHashFunction<T, H>;
+    readonly hashForValue?: PickableValueFieldHashFunction<T, H>;
     /**
      * Used for filtering values via the search text.
      */
-    filterValues?: PickableValueFieldFilterFunction<T, M>;
+    readonly filterValues?: PickableValueFieldFilterFunction<T, M>;
     /**
      * Used for sorting the items before they are displayed.
      *
      * Should only be used to sort values.
      */
-    sortItems?: PickableItemFieldItemSortFn<T, M>;
+    readonly sortItems?: PickableItemFieldItemSortFn<T, M>;
     /**
      * Whether or not to allow multiple items to be selected.
      */
-    multiSelect?: boolean;
+    readonly multiSelect?: boolean;
     /**
      * Whether or not to set/get values as an array or a single value. If set false, multiSelect is ignored.
      */
-    asArrayValue?: boolean;
+    readonly asArrayValue?: boolean;
     /**
      * Whether or not to show the text filter. True by default if filterValues is provided.
      */
-    showTextFilter?: boolean;
+    readonly showTextFilter?: boolean;
     /**
      * Whether or not to skip the filter function when the input is empty.
      *
      * True by default.
      */
-    skipFilterFnOnEmpty?: boolean;
+    readonly skipFilterFnOnEmpty?: boolean;
     /**
      * Filter Label
      */
-    filterLabel?: string;
+    readonly filterLabel?: string;
     /**
      * The maximum number of values that can be picked
      */
-    maxPicks?: number;
+    readonly maxPicks?: number;
     /**
      * Optional description/hint to display.
      */
-    description?: string;
+    readonly description?: string;
     /**
      * Footer Display
      */
-    footerConfig?: DbxInjectionComponentConfig;
+    readonly footerConfig?: DbxInjectionComponentConfig;
     /**
      * Changes the selection mode of the list to "view" mode on disabled, hiding the selection boxes.
      */
-    changeSelectionModeToViewOnDisabled?: boolean;
+    readonly changeSelectionModeToViewOnDisabled?: boolean;
     /**
      * (Optional) observable that will trigger the clearing of all cached display values.
      */
-    refreshDisplayValues$?: Observable<unknown>;
+    readonly refreshDisplayValues$?: Observable<unknown>;
 }
 /**
  * Displayed value with the computed hash.
@@ -93,12 +93,12 @@ export interface PickableValueFieldDisplayValueWithHash<T, M = unknown, H extend
  * Used for picking pre-set values using items as the presentation.
  */
 export declare class AbstractDbxPickableItemFieldDirective<T, M = unknown, H extends PrimativeKey = PrimativeKey> extends FieldType<FieldTypeConfig<PickableValueFieldsFieldProps<T, M, H>>> implements OnInit, OnDestroy {
-    filterMatInput: MatInput;
+    readonly filterMatInput: import("@angular/core").Signal<MatInput | undefined>;
     readonly inputCtrl: FormControl<string | null>;
-    private _formControlObs;
+    private readonly _formControlObs;
     readonly formControl$: Observable<AbstractControl<any, any>>;
-    private _clearDisplayHashMapSub;
-    private _displayHashMap;
+    private readonly _clearDisplayHashMapSub;
+    private readonly _displayHashMap;
     readonly filterInputValue$: Observable<Maybe<string>>;
     readonly filterInputValueString$: Observable<Maybe<string>>;
     readonly loadResultsDisplayValuesState$: Observable<LoadingState<PickableValueFieldDisplayValueWithHash<T, M, H>[]>>;
@@ -122,13 +122,15 @@ export declare class AbstractDbxPickableItemFieldDirective<T, M = unknown, H ext
     /**
      * Context used for managing the loading of items, or when the current results change.
      */
-    readonly context: ListLoadingStateContextInstance<unknown, LoadingState<PickableItemFieldItem<T, unknown>[]>>;
+    readonly context: import("@dereekb/rxjs").MutableListLoadingStateContext<unknown, LoadingState<PickableItemFieldItem<T, unknown>[]>>;
     readonly filterItemsLoadingState$: Observable<LoadingState<PickableItemFieldItem<T>[]>>;
+    readonly noItemsAvailable$: Observable<boolean>;
     /**
      * Context used for searching/filtering.
      */
-    readonly filterResultsContext: ListLoadingStateContextInstance<unknown, LoadingState<PickableValueFieldDisplayValueWithHash<T, M, H>[]>>;
-    readonly noItemsAvailable$: Observable<boolean>;
+    readonly filterResultsContext: import("@dereekb/rxjs").MutableListLoadingStateContext<unknown, LoadingState<PickableValueFieldDisplayValueWithHash<T, M, H>[]>>;
+    readonly itemsSignal: import("@angular/core").Signal<PickableItemFieldItem<T, M>[] | undefined>;
+    readonly noItemsAvailableSignal: import("@angular/core").Signal<boolean | undefined>;
     get readonly(): Maybe<boolean>;
     get isReadonlyOrDisabled(): boolean;
     get pickableField(): PickableValueFieldsFieldProps<T, M, H>;

package/lib/formly/field/selection/pickable/pickable.field.module.d.ts

@@ -1,20 +1,9 @@
 import * as i0 from "@angular/core";
 import * as i1 from "./pickable.chip.field.component";
 import * as i2 from "./pickable.list.field.component";
-import * as i3 from "@angular/common";
-import * as i4 from "@dereekb/dbx-web";
-import * as i5 from "@angular/forms";
-import * as i6 from "@angular/material/button";
-import * as i7 from "@angular/material/input";
-import * as i8 from "@angular/material/form-field";
-import * as i9 from "@angular/material/autocomplete";
-import * as i10 from "@angular/material/list";
-import * as i11 from "@dereekb/dbx-core";
-import * as i12 from "@angular/material/chips";
-import * as i13 from "@angular/material/icon";
-import * as i14 from "@ngx-formly/core";
+import * as i3 from "@ngx-formly/core";
 export declare class DbxFormFormlyPickableFieldModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxFormFormlyPickableFieldModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxFormFormlyPickableFieldModule, [typeof i1.DbxPickableChipListFieldComponent, typeof i2.DbxPickableListFieldComponent, typeof i2.DbxPickableListFieldItemListComponent, typeof i2.DbxPickableListFieldItemListViewComponent, typeof i2.DbxPickableListFieldItemListViewItemComponent], [typeof i3.CommonModule, typeof i4.DbxTextModule, typeof i4.DbxLoadingModule, typeof i4.DbxButtonModule, typeof i5.FormsModule, typeof i6.MatButtonModule, typeof i7.MatInputModule, typeof i8.MatFormFieldModule, typeof i5.ReactiveFormsModule, typeof i9.MatAutocompleteModule, typeof i10.MatListModule, typeof i11.DbxDatePipeModule, typeof i4.DbxRouterAnchorModule, typeof i12.MatChipsModule, typeof i13.MatIconModule, typeof i11.DbxInjectionComponentModule, typeof i4.DbxListLayoutModule, typeof i14.FormlyModule], never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxFormFormlyPickableFieldModule, never, [typeof i1.DbxPickableChipListFieldComponent, typeof i2.DbxPickableListFieldComponent, typeof i2.DbxPickableListFieldItemListComponent, typeof i2.DbxPickableListFieldItemListViewComponent, typeof i2.DbxPickableListFieldItemListViewItemComponent, typeof i3.FormlyModule], [typeof i1.DbxPickableChipListFieldComponent, typeof i2.DbxPickableListFieldComponent, typeof i2.DbxPickableListFieldItemListComponent, typeof i2.DbxPickableListFieldItemListViewComponent, typeof i2.DbxPickableListFieldItemListViewItemComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DbxFormFormlyPickableFieldModule>;
 }

package/lib/formly/field/selection/pickable/pickable.list.field.component.d.ts

@@ -4,18 +4,10 @@ import { type Maybe } from '@dereekb/util';
 import { PickableValueFieldDisplayValue } from './pickable';
 import { AbstractDbxPickableItemFieldDirective, PickableItemFieldItem } from './pickable.field.directive';
 import * as i0 from "@angular/core";
-/**
- * Used for picking pre-set values using a selection list as the presentation.
- */
-export declare class DbxPickableListFieldComponent<T> extends AbstractDbxPickableItemFieldDirective<T> {
-    onSelectionChange(event: unknown): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<DbxPickableListFieldComponent<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxPickableListFieldComponent<any>, "ng-component", never, {}, {}, never, never, false, never>;
-}
 export declare class DbxPickableListFieldItemListComponent<T> extends AbstractDbxSelectionListWrapperDirective<PickableItemFieldItem<T>> {
     constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxPickableListFieldItemListComponent<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxPickableListFieldItemListComponent<any>, "dbx-form-pickable-item-field-item-list", never, {}, {}, never, ["[top]", "[bottom]", "[empty]", "[emptyLoading]"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxPickableListFieldItemListComponent<any>, "dbx-form-pickable-item-field-item-list", never, {}, {}, never, ["[top]", "[bottom]", "[empty]", "[emptyLoading]"], true, never>;
 }
 /**
  * NOTE: Values input are PickableItemFieldItem<T>, but output values are PickableValueFieldDisplayValue<T>.
@@ -26,13 +18,22 @@ export declare class DbxPickableListFieldItemListViewComponent<T> extends Abstra
     get multiple(): boolean;
     get selectionMode(): Maybe<DbxListSelectionMode>;
     readonly items$: import("rxjs").Observable<any[]>;
+    readonly itemsSignal: import("@angular/core").Signal<any[] | undefined>;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxPickableListFieldItemListViewComponent<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxPickableListFieldItemListViewComponent<any>, "ng-component", never, {}, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxPickableListFieldItemListViewComponent<any>, "ng-component", never, {}, {}, never, never, true, never>;
 }
 export declare class DbxPickableListFieldItemListViewItemComponent<T> extends AbstractDbxValueListViewItemComponent<PickableValueFieldDisplayValue<T>> {
-    get label(): string;
-    get sublabel(): string | undefined;
-    get icon(): string | undefined;
+    readonly label: string;
+    readonly sublabel: string | undefined;
+    readonly icon: string | undefined;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxPickableListFieldItemListViewItemComponent<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxPickableListFieldItemListViewItemComponent<any>, "ng-component", never, {}, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxPickableListFieldItemListViewItemComponent<any>, "ng-component", never, {}, {}, never, never, true, never>;
+}
+/**
+ * Used for picking pre-set values using a selection list as the presentation.
+ */
+export declare class DbxPickableListFieldComponent<T> extends AbstractDbxPickableItemFieldDirective<T> {
+    onSelectionChange(event: unknown): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DbxPickableListFieldComponent<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxPickableListFieldComponent<any>, "ng-component", never, {}, {}, never, never, true, never>;
 }

package/lib/formly/field/selection/searchable/_searchable.scss

@@ -44,9 +44,9 @@
 
 @mixin theme($theme-config) {
   @include theming.private-check-duplicate-theme-styles($theme-config, 'dbx-form-field-selection-searchable') {
-    $color: theming.get-color-config($theme-config);
-    $density: theming.get-density-config($theme-config);
-    $typography: theming.get-typography-config($theme-config);
+    $color: theming.m2-get-color-config($theme-config);
+    $density: theming.m2-get-density-config($theme-config);
+    $typography: theming.m2-get-typography-config($theme-config);
 
     @if $color !=null {
       @include color($theme-config);

package/lib/formly/field/selection/searchable/searchable.chip.field.component.d.ts

@@ -12,17 +12,17 @@ export interface SearchableChipValueFieldsFieldProps<T, M = unknown, H extends P
     readonly multiSelect?: boolean;
 }
 export declare class DbxSearchableChipFieldComponent<T, M = unknown, H extends PrimativeKey = PrimativeKey> extends AbstractDbxSearchableValueFieldDirective<T, M, H, SearchableChipValueFieldsFieldProps<T, M, H>> implements OnInit, OnDestroy {
-    private _blur;
-    private _blurSub;
+    get multiSelect(): boolean;
+    private readonly _blur;
+    private readonly _blurSub;
     readonly separatorKeysCodes: number[];
     selected(event: MatAutocompleteSelectedEvent): void;
     tabPressedOnInput(event: KeyboardEvent): boolean;
     addChip(event: MatChipInputEvent): void;
-    get multiSelect(): boolean;
     protected _syncSingleValue(value: SearchableValueFieldDisplayValue<T>): void;
     ngOnInit(): void;
     ngOnDestroy(): void;
     onBlur(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxSearchableChipFieldComponent<any, any, any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSearchableChipFieldComponent<any, any, any>, "ng-component", never, {}, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSearchableChipFieldComponent<any, any, any>, "ng-component", never, {}, {}, never, never, true, never>;
 }

package/lib/formly/field/selection/searchable/searchable.d.ts

@@ -6,7 +6,7 @@ export interface SearchableValueFieldValue<T, M = unknown> extends SelectionValu
     /**
      * Optional anchor metadata on the field.
      */
-    anchor?: ClickableAnchor;
+    readonly anchor?: ClickableAnchor;
 }
 /**
  * Displayed value.
@@ -15,10 +15,10 @@ export interface SearchableValueFieldDisplayValue<T, M = unknown> extends Select
     /**
      * Display override configuration
      */
-    display?: Partial<DbxInjectionComponentConfig>;
+    readonly display?: Partial<DbxInjectionComponentConfig>;
 }
 export interface ConfiguredSearchableValueFieldDisplayValue<T, M = unknown> extends Omit<SearchableValueFieldDisplayValue<T, M>, 'display'> {
-    display: DbxInjectionComponentConfig;
+    readonly display: DbxInjectionComponentConfig;
 }
 /**
  * SearchableValueField function for searching values.

package/lib/formly/field/selection/searchable/searchable.field.autocomplete.item.component.d.ts

@@ -1,18 +1,14 @@
-import { Observable } from 'rxjs';
-import { InjectionToken, OnDestroy } from '@angular/core';
+import { InjectionToken } from '@angular/core';
 import { ConfiguredSearchableValueFieldDisplayValue } from './searchable';
 import { DbxInjectionComponentConfig } from '@dereekb/dbx-core';
 import * as i0 from "@angular/core";
 export declare const DBX_SEARCHABLE_FIELD_COMPONENT_DATA_TOKEN: InjectionToken<unknown>;
-export declare class DbxSearchableFieldAutocompleteItemComponent<T> implements OnDestroy {
-    private _displayValue;
-    readonly displayValue$: Observable<ConfiguredSearchableValueFieldDisplayValue<T, unknown>>;
-    readonly config$: Observable<DbxInjectionComponentConfig>;
-    readonly anchor$: Observable<import("@dereekb/dbx-core").ClickableAnchor | undefined>;
-    set displayValue(displayValue: ConfiguredSearchableValueFieldDisplayValue<T>);
-    ngOnDestroy(): void;
+export declare class DbxSearchableFieldAutocompleteItemComponent<T> {
+    readonly displayValue: import("@angular/core").InputSignal<ConfiguredSearchableValueFieldDisplayValue<T, unknown>>;
+    readonly configSignal: import("@angular/core").Signal<DbxInjectionComponentConfig<unknown>>;
+    readonly anchorSignal: import("@angular/core").Signal<import("@dereekb/dbx-core").ClickableAnchor | undefined>;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxSearchableFieldAutocompleteItemComponent<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSearchableFieldAutocompleteItemComponent<any>, "dbx-searchable-field-autocomplete-item", never, { "displayValue": { "alias": "displayValue"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSearchableFieldAutocompleteItemComponent<any>, "dbx-searchable-field-autocomplete-item", never, { "displayValue": { "alias": "displayValue"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 export declare abstract class AbstractDbxSearchableFieldDisplayDirective<T> {
     readonly displayValue: ConfiguredSearchableValueFieldDisplayValue<T, unknown>;
@@ -20,7 +16,7 @@ export declare abstract class AbstractDbxSearchableFieldDisplayDirective<T> {
     static ɵdir: i0.ɵɵDirectiveDeclaration<AbstractDbxSearchableFieldDisplayDirective<any>, never, never, {}, {}, never, never, false, never>;
 }
 export declare class DbxDefaultSearchableFieldDisplayComponent<T> extends AbstractDbxSearchableFieldDisplayDirective<T> {
-    get icon(): string | undefined;
+    readonly icon: string | undefined;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxDefaultSearchableFieldDisplayComponent<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxDefaultSearchableFieldDisplayComponent<any>, "dbx-default-searchable-field-display", never, {}, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxDefaultSearchableFieldDisplayComponent<any>, "dbx-default-searchable-field-display", never, {}, {}, never, never, true, never>;
 }

package/lib/formly/field/selection/searchable/searchable.field.directive.d.ts

@@ -1,7 +1,7 @@
 import { ArrayOrValue, Maybe, PrimativeKey } from '@dereekb/util';
 import { DbxInjectionComponentConfig } from '@dereekb/dbx-core';
-import { LoadingState, LoadingStateContextInstance } from '@dereekb/rxjs';
-import { ChangeDetectorRef, ElementRef, OnDestroy, OnInit } from '@angular/core';
+import { LoadingState } from '@dereekb/rxjs';
+import { ElementRef, OnDestroy, OnInit } from '@angular/core';
 import { AbstractControl, FormControl, ValidatorFn } from '@angular/forms';
 import { FieldTypeConfig, FormlyFieldProps } from '@ngx-formly/core';
 import { FieldType } from '@ngx-formly/material';
@@ -12,69 +12,69 @@ export interface StringValueFieldsFieldProps extends FormlyFieldProps {
     /**
      * Custom input validators.
      */
-    textInputValidator?: ValidatorFn | ValidatorFn[];
+    readonly textInputValidator?: ValidatorFn | ValidatorFn[];
 }
 export interface SearchableValueFieldsFieldProps<T, M = unknown, H extends PrimativeKey = PrimativeKey> extends FormlyFieldProps, StringValueFieldsFieldProps {
     /**
      * Whether or not to allow string values to be used directly, or if values can only be chosen from searching.
      */
-    allowStringValues?: boolean;
+    readonly allowStringValues?: boolean;
     /**
      * Whether or not to set/get values as an array or a single value. If set false, multiSelect is ignored.
      */
-    asArrayValue?: boolean;
+    readonly asArrayValue?: boolean;
     /**
      * Optional conversion function. If provided, allowStringValues is considered true.
      */
-    convertStringValue?: (text: string) => T;
+    readonly convertStringValue?: (text: string) => T;
     /**
      * Used for hashing display values and omitting repeat values.
      *
      * If hashForValue is not provided, the value's value will be used as is.
      */
-    hashForValue?: SearchableValueFieldHashFn<T, H>;
+    readonly hashForValue?: SearchableValueFieldHashFn<T, H>;
     /**
      * Performs a search.
      */
-    search: SearchableValueFieldStringSearchFn<T, M>;
+    readonly search: SearchableValueFieldStringSearchFn<T, M>;
     /**
      * Whether or not to allow searches on empty text. Is false by default.
      */
-    searchOnEmptyText?: boolean;
+    readonly searchOnEmptyText?: boolean;
     /**
      * Default injected config to use for display values.
      */
-    display?: Partial<DbxInjectionComponentConfig>;
+    readonly display?: Partial<DbxInjectionComponentConfig>;
     /**
      * Used for building a display value given the input.
      */
-    displayForValue: SearchableValueFieldDisplayFn<T, M>;
+    readonly displayForValue: SearchableValueFieldDisplayFn<T, M>;
     /**
      * Whether or not to use the anchor field on value elements.
      *
      * This has no default effect if a component class is provided.
      */
-    useAnchor?: boolean;
+    readonly useAnchor?: boolean;
     /**
      * Used for retrieving an anchor value for values that have no anchor value set.
      *
      * Only used when useAnchor is true.
      */
-    anchorForValue?: SearchableValueFieldAnchorFn<T, M>;
+    readonly anchorForValue?: SearchableValueFieldAnchorFn<T, M>;
     /**
      * Whether or not to show "Clear" in the autcomplete list.
      */
-    showClearValue?: boolean;
+    readonly showClearValue?: boolean;
     /**
      * Label for the search input.
      *
      * Defaults to "Search"
      */
-    searchLabel?: string;
+    readonly searchLabel?: string;
     /**
      * (Optional) observable that will trigger the clearing of all cached display values.
      */
-    refreshDisplayValues$?: Observable<unknown>;
+    readonly refreshDisplayValues$?: Observable<unknown>;
 }
 /**
  * Abstract searchable field that provides a feature for searching for values, and for displaying values using Observables.
@@ -82,20 +82,19 @@ export interface SearchableValueFieldsFieldProps<T, M = unknown, H extends Prima
  * Display values are cached for performance.
  */
 export declare abstract class AbstractDbxSearchableValueFieldDirective<T, M = unknown, H extends PrimativeKey = PrimativeKey, C extends SearchableValueFieldsFieldProps<T, M, H> = SearchableValueFieldsFieldProps<T, M, H>> extends FieldType<FieldTypeConfig<C>> implements OnInit, OnDestroy {
-    readonly cdRef: ChangeDetectorRef;
-    /**
-     * Whether or not to allow syncing to
-     */
-    allowSyncValueToInput: boolean;
     /**
      * Whether or not to set/get values as an array.
      */
     abstract get multiSelect(): boolean;
     /**
-     * Optional override set by the parent class for picking a default display for this directive.
+     * Optional override set by the parent class for whether or not to allow the current value to sync to the input.
+     */
+    allowSyncValueToInput: boolean;
+    /**
+     * Default placeholder text to use when searchOnEmptyText is false.
      */
-    defaultDisplay?: DbxInjectionComponentConfig;
-    textInput: ElementRef<HTMLInputElement>;
+    defaultSearchInputPlaceholder?: Maybe<string>;
+    readonly textInput: import("@angular/core").Signal<ElementRef<HTMLInputElement> | undefined>;
     readonly inputCtrl: FormControl<string | null>;
     private readonly _formControlObs;
     readonly formControl$: Observable<AbstractControl<any, any>>;
@@ -105,12 +104,17 @@ export declare abstract class AbstractDbxSearchableValueFieldDirective<T, M = un
     readonly inputValueString$: Observable<string>;
     readonly searchResultsState$: Observable<LoadingState<ConfiguredSearchableValueFieldDisplayValue<T, M>[]>>;
     private readonly _singleValueSyncSubscription;
-    readonly searchContext: LoadingStateContextInstance<unknown, LoadingState<ConfiguredSearchableValueFieldDisplayValue<T, M>[]>>;
+    readonly searchContext: import("@dereekb/rxjs").MutableLoadingStateContext<unknown, LoadingState<ConfiguredSearchableValueFieldDisplayValue<T, M>[]>, import("@dereekb/rxjs").LoadingContextEvent & LoadingState<ConfiguredSearchableValueFieldDisplayValue<T, M>[]>>;
     readonly searchResults$: Observable<ConfiguredSearchableValueFieldDisplayValue<T, M>[]>;
+    readonly isLoadingSearchResults$: Observable<boolean>;
     readonly _formControlValue$: Observable<T | T[]>;
     readonly values$: Observable<T[]>;
     readonly displayValuesState$: Observable<LoadingState<ConfiguredSearchableValueFieldDisplayValue<T, M>[]>>;
     readonly displayValues$: Observable<ConfiguredSearchableValueFieldDisplayValue<T, M>[]>;
+    readonly inputValueSignal: import("@angular/core").Signal<string | undefined>;
+    readonly searchResultsSignal: import("@angular/core").Signal<ConfiguredSearchableValueFieldDisplayValue<T, M>[] | undefined>;
+    readonly displayValuesSignal: import("@angular/core").Signal<ConfiguredSearchableValueFieldDisplayValue<T, M>[] | undefined>;
+    readonly isLoadingSearchResultsSignal: import("@angular/core").Signal<boolean | undefined>;
     get name(): string;
     get label(): Maybe<string>;
     get readonly(): Maybe<boolean>;
@@ -119,6 +123,7 @@ export declare abstract class AbstractDbxSearchableValueFieldDirective<T, M = un
     get asArrayValue(): boolean;
     get pickOnlyOne(): boolean;
     get searchOnEmptyText(): boolean;
+    get searchInputPlaceholder(): string | '';
     get autocomplete(): string;
     get hashForValue(): SearchableValueFieldHashFn<T, H>;
     get displayForValue(): SearchableValueFieldDisplayFn<T, M>;

package/lib/formly/field/selection/searchable/searchable.field.module.d.ts

@@ -2,20 +2,9 @@ import * as i0 from "@angular/core";
 import * as i1 from "./searchable.chip.field.component";
 import * as i2 from "./searchable.text.field.component";
 import * as i3 from "./searchable.field.autocomplete.item.component";
-import * as i4 from "@angular/common";
-import * as i5 from "@dereekb/dbx-web";
-import * as i6 from "@angular/forms";
-import * as i7 from "@angular/material/button";
-import * as i8 from "@angular/material/input";
-import * as i9 from "@angular/material/form-field";
-import * as i10 from "@angular/material/autocomplete";
-import * as i11 from "@angular/material/list";
-import * as i12 from "@dereekb/dbx-core";
-import * as i13 from "@angular/material/chips";
-import * as i14 from "@angular/material/icon";
-import * as i15 from "@ngx-formly/core";
+import * as i4 from "@ngx-formly/core";
 export declare class DbxFormFormlySearchableFieldModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxFormFormlySearchableFieldModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxFormFormlySearchableFieldModule, [typeof i1.DbxSearchableChipFieldComponent, typeof i2.DbxSearchableTextFieldComponent, typeof i3.DbxSearchableFieldAutocompleteItemComponent, typeof i3.DbxDefaultSearchableFieldDisplayComponent], [typeof i4.CommonModule, typeof i5.DbxTextModule, typeof i5.DbxLoadingModule, typeof i5.DbxButtonModule, typeof i6.FormsModule, typeof i7.MatButtonModule, typeof i8.MatInputModule, typeof i9.MatFormFieldModule, typeof i6.ReactiveFormsModule, typeof i10.MatAutocompleteModule, typeof i11.MatListModule, typeof i12.DbxDatePipeModule, typeof i5.DbxRouterAnchorModule, typeof i13.MatChipsModule, typeof i14.MatIconModule, typeof i12.DbxInjectionComponentModule, typeof i15.FormlyModule], [typeof i1.DbxSearchableChipFieldComponent, typeof i2.DbxSearchableTextFieldComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxFormFormlySearchableFieldModule, never, [typeof i1.DbxSearchableChipFieldComponent, typeof i2.DbxSearchableTextFieldComponent, typeof i3.DbxSearchableFieldAutocompleteItemComponent, typeof i3.DbxDefaultSearchableFieldDisplayComponent, typeof i4.FormlyModule], [typeof i1.DbxSearchableChipFieldComponent, typeof i2.DbxSearchableTextFieldComponent, typeof i3.DbxSearchableFieldAutocompleteItemComponent, typeof i3.DbxDefaultSearchableFieldDisplayComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DbxFormFormlySearchableFieldModule>;
 }

package/lib/formly/field/selection/searchable/searchable.text.field.component.d.ts

@@ -4,23 +4,21 @@ import { AbstractDbxSearchableValueFieldDirective, SearchableValueFieldsFieldPro
 import { PrimativeKey } from '@dereekb/util';
 import * as i0 from "@angular/core";
 export interface SearchableTextValueFieldsFieldProps<T, M = unknown, H extends PrimativeKey = PrimativeKey> extends SearchableValueFieldsFieldProps<T, M, H> {
-    showSelectedValue?: boolean;
+    readonly showSelectedValue?: boolean;
 }
 /**
  * Display component for selecting a single item/value.
  */
 export declare class DbxSearchableTextFieldComponent<T, M = unknown, H extends PrimativeKey = PrimativeKey> extends AbstractDbxSearchableValueFieldDirective<T, M, H, SearchableTextValueFieldsFieldProps<T, M, H>> implements OnInit, OnDestroy {
     allowSyncValueToInput: boolean;
-    readonly selectedDisplayValue$: import("rxjs").Observable<import("@dereekb/dbx-form").ConfiguredSearchableValueFieldDisplayValue<T, M>>;
-    readonly hasValue$: import("rxjs").Observable<boolean>;
-    readonly showSelectedDisplayValue$: import("rxjs").Observable<boolean>;
+    readonly selectedDisplayValue$: import("rxjs").Observable<import("./searchable").ConfiguredSearchableValueFieldDisplayValue<T, M>>;
+    readonly selectedDisplayValueSignal: import("@angular/core").Signal<import("./searchable").ConfiguredSearchableValueFieldDisplayValue<T, M> | undefined>;
+    readonly hasValueSignal: import("@angular/core").Signal<boolean>;
+    readonly showSelectedDisplayValueSignal: import("@angular/core").Signal<boolean>;
     get searchableField(): SearchableTextValueFieldsFieldProps<T, M, H>;
     get showSelectedValue(): boolean;
     get multiSelect(): boolean;
-    private _clearInputSub;
-    ngOnInit(): void;
-    ngOnDestroy(): void;
     selected(event: MatAutocompleteSelectedEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxSearchableTextFieldComponent<any, any, any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSearchableTextFieldComponent<any, any, any>, "ng-component", never, {}, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSearchableTextFieldComponent<any, any, any>, "ng-component", never, {}, {}, never, never, true, never>;
 }

package/lib/formly/field/selection/selection.d.ts

@@ -3,22 +3,22 @@ export interface SelectionValue<T, M = unknown> {
     /**
      * Value associated with this field.
      */
-    value: T;
+    readonly value: T;
     /**
      * Optional metadata on the field.
      */
-    meta?: Maybe<M>;
+    readonly meta?: Maybe<M>;
 }
 /**
  * Displayed value.
  */
 export interface SelectionDisplayValue<T, M = unknown> extends SelectionValue<T, M>, LabelRef {
-    sublabel?: string;
-    icon?: string;
+    readonly sublabel?: string;
+    readonly icon?: string;
     /**
      * Whether or not the value is known.
      */
-    isUnknown?: Maybe<boolean>;
+    readonly isUnknown?: Maybe<boolean>;
 }
 /**
  * Used to hash the value from the input pickable value.

package/lib/formly/field/selection/sourceselect/_sourceselect.scss

@@ -30,9 +30,9 @@
 
 @mixin theme($theme-config) {
   @include theming.private-check-duplicate-theme-styles($theme-config, 'dbx-form-field-source-select') {
-    $color: theming.get-color-config($theme-config);
-    $density: theming.get-density-config($theme-config);
-    $typography: theming.get-typography-config($theme-config);
+    $color: theming.m2-get-color-config($theme-config);
+    $density: theming.m2-get-density-config($theme-config);
+    $typography: theming.m2-get-typography-config($theme-config);
 
     @if $color !=null {
       @include color($theme-config);

package/lib/formly/field/selection/sourceselect/sourceselect.d.ts

@@ -60,7 +60,7 @@ export interface SourceSelectOpenFunctionParams {
     /**
      * Origin of the button for the SourceSelect
      */
-    origin: ElementRef;
+    readonly origin: ElementRef;
 }
 /**
  * Returns an observable that returns an array of meta values to be added to the selection.