@dereekb/dbx-web 11.1.7 → 12.0.0

package/lib/layout/list/list.view.value.selection.component.d.ts

@@ -1,4 +1,3 @@
-import { Observable } from 'rxjs';
 import { MatSelectionListChange } from '@angular/material/list';
 import { DbxListSelectionMode } from './list.view';
 import { DbxValueListItem, AbstractDbxValueListViewConfig } from './list.view.value';
@@ -9,23 +8,25 @@ import * as i0 from "@angular/core";
 export interface DbxSelectionValueListViewConfig<T, I extends DbxValueListItem<T> = DbxValueListItem<T>, V = unknown> extends AbstractDbxValueListViewConfig<T, I, V> {
     readonly multiple?: boolean;
 }
-/**
- * Renders a selection list view using input configuration. Requires a parent DbxListView.
- */
-export declare class DbxSelectionValueListViewComponent<T, I extends DbxValueListItem<T> = DbxValueListItem<T>, V = unknown> extends AbstractDbxValueListViewDirective<T, I, V, DbxSelectionValueListViewConfig<T, I, V>> {
-    readonly selectionMode$: Observable<DbxListSelectionMode>;
-    readonly multiple$: Observable<boolean>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<DbxSelectionValueListViewComponent<any, any, any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSelectionValueListViewComponent<any, any, any>, "dbx-selection-list-view", never, {}, {}, never, never, false, never>;
-}
 /**
  * Content view for a DbxSelectionValueListView. It can be used directly in cases where the items are already configured, or want to be configured in a non-standard fashion.
  */
 export declare class DbxSelectionValueListViewContentComponent<T, I extends DbxValueListItem<T> = DbxValueListItem<T>> extends DbxValueListViewContentComponent<T, I> {
-    multiple?: Maybe<boolean>;
-    selectionMode: Maybe<DbxListSelectionMode>;
+    readonly multiple: import("@angular/core").InputSignal<Maybe<boolean>>;
+    readonly selectionMode: import("@angular/core").InputSignal<Maybe<DbxListSelectionMode>>;
+    readonly trackByFunctionSignal: import("@angular/core").Signal<import("@angular/core").TrackByFunction<any> | ((index: number, item: import("./list.view.value").DbxValueListItemConfig<T, I>) => any)>;
     constructor();
     matSelectionChanged(selection: MatSelectionListChange): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxSelectionValueListViewContentComponent<any, any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSelectionValueListViewContentComponent<any, any>, "dbx-selection-list-view-content", never, { "multiple": { "alias": "multiple"; "required": false; }; "selectionMode": { "alias": "selectionMode"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSelectionValueListViewContentComponent<any, any>, "dbx-selection-list-view-content", never, { "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+/**
+ * Renders a selection list view using input configuration. Requires a parent DbxListView.
+ */
+export declare class DbxSelectionValueListViewComponent<T, I extends DbxValueListItem<T> = DbxValueListItem<T>, V = unknown> extends AbstractDbxValueListViewDirective<T, I, V, DbxSelectionValueListViewConfig<T, I, V>> {
+    readonly selectionMode$: import("rxjs").Observable<"select" | "view">;
+    readonly selectionModeSignal: import("@angular/core").Signal<DbxListSelectionMode>;
+    readonly multipleSignal: import("@angular/core").Signal<boolean>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DbxSelectionValueListViewComponent<any, any, any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSelectionValueListViewComponent<any, any, any>, "dbx-selection-list-view", never, {}, {}, never, never, true, never>;
 }

package/lib/layout/list/list.wrapper.d.ts

@@ -1,12 +1,21 @@
 import { Observable } from 'rxjs';
-import { ListLoadingState } from '@dereekb/rxjs';
-import { EventEmitter, Provider, Type } from '@angular/core';
+import { ListLoadingState, MaybeObservableOrValue } from '@dereekb/rxjs';
+import { OutputRef, Provider, Type } from '@angular/core';
 import { type Maybe } from '@dereekb/util';
+import { DbxListSelectionMode } from './list.view';
 /**
  * Common interface for views that may wrap a DbxListView, and pass values through to it.
  */
 export declare abstract class DbxListViewWrapper<T = unknown, S extends ListLoadingState<T> = ListLoadingState<T>> {
-    state$?: Maybe<Observable<S>>;
-    readonly loadMore?: EventEmitter<void>;
+    abstract readonly currentState$: Observable<Maybe<S>>;
+    abstract readonly loadMore?: OutputRef<void>;
+    /**
+     * Sets/overrides the state for this view.
+     */
+    abstract setState(state: MaybeObservableOrValue<S>): void;
+    /**
+     * Sets/overrides the selection mode for this view.
+     */
+    abstract setSelectionMode(selectionMode: MaybeObservableOrValue<DbxListSelectionMode>): void;
 }
 export declare function provideDbxListViewWrapper<V extends DbxListViewWrapper>(sourceType: Type<V>): Provider[];

package/lib/layout/list/meta/index.d.ts

@@ -0,0 +1 @@
+export * from './list.view.meta.icon.component';

package/lib/layout/list/{list.view.meta.icon.component.d.ts → meta/list.view.meta.icon.component.d.ts}

@@ -1,5 +1,5 @@
 import { InjectionToken } from '@angular/core';
-import { DbxValueListItem } from './list.view.value';
+import { DbxValueListItem } from '../list.view.value';
 import { type Maybe } from '@dereekb/util';
 import { DbxInjectionComponentConfig } from '@dereekb/dbx-core';
 import * as i0 from "@angular/core";
@@ -13,5 +13,5 @@ export declare class DbxListViewMetaIconComponent {
     readonly icon: Maybe<string>;
     static metaConfig(defaultIcon?: Maybe<string>): DbxInjectionComponentConfig<DbxListViewMetaIconConfig>;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxListViewMetaIconComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxListViewMetaIconComponent, "dbx-list-view-meta-icon", never, {}, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxListViewMetaIconComponent, "dbx-list-view-meta-icon", never, {}, {}, never, never, true, never>;
 }

package/lib/layout/list/modifier/index.d.ts

@@ -0,0 +1,4 @@
+export * from './list.modifier.module';
+export * from './list.view.value.modifier.directive';
+export * from './list.view.value.modifier.ripple.directive';
+export * from './list.view.value.modifier.selection.directive';

package/lib/layout/list/modifier/list.modifier.module.d.ts

@@ -0,0 +1,12 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./list.view.value.modifier.directive";
+import * as i2 from "./list.view.value.modifier.ripple.directive";
+import * as i3 from "./list.view.value.modifier.selection.directive";
+/**
+ * Exports all dbx-list modifier-related directives.
+ */
+export declare class DbxListModifierModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<DbxListModifierModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxListModifierModule, never, [typeof i1.DbxValueListItemModifierDirective, typeof i2.DbxListItemDisableRippleModifierDirective, typeof i3.DbxListItemIsSelectedModifierDirective], [typeof i1.DbxValueListItemModifierDirective, typeof i2.DbxListItemDisableRippleModifierDirective, typeof i3.DbxListItemIsSelectedModifierDirective]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<DbxListModifierModule>;
+}

package/lib/layout/list/{list.view.value.modifier.directive.d.ts → modifier/list.view.value.modifier.directive.d.ts}

@@ -1,33 +1,34 @@
 import { Observable } from 'rxjs';
-import { OnDestroy, OnInit } from '@angular/core';
-import { DbxValueListItem } from './list.view.value';
+import { OnDestroy } from '@angular/core';
+import { DbxValueListItem } from '../list.view.value';
 import { ArrayOrValue, Maybe, Modifier } from '@dereekb/util';
-import { DbxValueListItemModifier } from './list.view.value.modifier';
+import { MaybeObservableOrValue } from '@dereekb/rxjs';
+import { DbxValueListItemModifier } from '../list.view.value.modifier';
 import * as i0 from "@angular/core";
 /**
  * DbxValueListViewModifier implementation
  */
 export declare class DbxValueListItemModifierDirective<T, I extends DbxValueListItem<T> = DbxValueListItem<T>> implements DbxValueListItemModifier<T, I>, OnDestroy {
-    private _modifiers;
-    private _inputModifiers;
+    readonly inputModifiers: import("@angular/core").InputSignalWithTransform<Maybe<ArrayOrValue<Modifier<I>>>, Maybe<string | ArrayOrValue<Modifier<I>>>>;
+    private readonly _additionalModifiers;
     readonly modifiers$: Observable<Map<string, Modifier<I>>>;
     ngOnDestroy(): void;
     addModifiers(modifiers: ArrayOrValue<Modifier<I>>): void;
     removeModifiers(modifiers: ArrayOrValue<Modifier<I>>): void;
-    set inputModifiers(inputModifiers: Maybe<ArrayOrValue<Modifier<I>>>);
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxValueListItemModifierDirective<any, any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxValueListItemModifierDirective<any, any>, "[dbxListItemModifier]", never, { "inputModifiers": { "alias": "dbxListItemModifier"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxValueListItemModifierDirective<any, any>, "dbxListItemModifier,[dbxListItemModifier]", never, { "inputModifiers": { "alias": "dbxListItemModifier"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 /**
  * Abstract directive used for managing modifyers for a DbxValueListView.
  */
-export declare abstract class AbstractDbxValueListItemModifierDirective<T, I extends DbxValueListItem<T> = DbxValueListItem<T>> implements OnInit, OnDestroy {
+export declare abstract class AbstractDbxValueListItemModifierDirective<T, I extends DbxValueListItem<T> = DbxValueListItem<T>> implements OnDestroy {
     readonly dbxValueListItemModifier: DbxValueListItemModifier<T, I>;
-    abstract readonly modifiers$: Observable<Maybe<ArrayOrValue<Modifier<I>>>>;
-    private _linkedModifiers;
-    private _modifiersSub;
-    ngOnInit(): void;
+    private _currentLinkedModifiers;
+    private readonly _modifiers;
+    readonly modifiers$: Observable<Maybe<ArrayOrValue<Modifier<I>>>>;
+    private readonly _modifiersSub;
     ngOnDestroy(): void;
+    setModifiers(modifiers: MaybeObservableOrValue<ArrayOrValue<Modifier<I>>>): void;
     private _linkModifiers;
     private _unlinkModifiers;
     static ɵfac: i0.ɵɵFactoryDeclaration<AbstractDbxValueListItemModifierDirective<any, any>, never>;

package/lib/layout/list/{list.view.value.modifier.ripple.directive.d.ts → modifier/list.view.value.modifier.ripple.directive.d.ts}

@@ -1,16 +1,15 @@
 import { OnDestroy } from '@angular/core';
 import { Maybe, ArrayOrValue, Modifier } from '@dereekb/util';
 import { Observable } from 'rxjs';
-import { DbxValueListItem, DbxValueListItemDecisionFunction } from './list.view.value';
+import { DbxValueListItem, DbxValueListItemDecisionFunction } from '../list.view.value';
 import { AbstractDbxValueListItemModifierDirective } from './list.view.value.modifier.directive';
 import * as i0 from "@angular/core";
 export declare const DBX_LIST_ITEM_DISABLE_RIPPLE_LIST_ITEM_MODIFIER_KEY = "disable_ripple_anchor";
 export declare const DBX_LIST_ITEM_DEFAULT_DISABLE_FUNCTION: DbxValueListItemDecisionFunction<unknown>;
 export declare class DbxListItemDisableRippleModifierDirective<T> extends AbstractDbxValueListItemModifierDirective<T> implements OnDestroy {
-    private _disableRippleForItem;
-    readonly modifiers$: Observable<Maybe<ArrayOrValue<Modifier<DbxValueListItem<T>>>>>;
-    ngOnDestroy(): void;
-    set disableRippleForItem(disableRippleForItem: Maybe<DbxValueListItemDecisionFunction<T>>);
+    readonly disableRippleForItem: import("@angular/core").InputSignalWithTransform<Maybe<DbxValueListItemDecisionFunction<T>>, Maybe<string | DbxValueListItemDecisionFunction<T>>>;
+    readonly disableRippleForItemModifiers$: Observable<Maybe<ArrayOrValue<Modifier<DbxValueListItem<T>>>>>;
+    constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxListItemDisableRippleModifierDirective<any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxListItemDisableRippleModifierDirective<any>, "[dbxListItemDisableRippleModifier]", never, { "disableRippleForItem": { "alias": "dbxListItemDisableRippleModifier"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxListItemDisableRippleModifierDirective<any>, "dbxListItemDisableRippleModifier,[dbxListItemDisableRippleModifier]", never, { "disableRippleForItem": { "alias": "dbxListItemDisableRippleModifier"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }

package/lib/layout/list/{list.view.value.modifier.selection.directive.d.ts → modifier/list.view.value.modifier.selection.directive.d.ts}

@@ -1,16 +1,15 @@
 import { OnDestroy } from '@angular/core';
 import { Maybe, ArrayOrValue, Modifier } from '@dereekb/util';
 import { Observable } from 'rxjs';
-import { DbxValueListItem, DbxValueListItemDecisionFunction } from './list.view.value';
+import { DbxValueListItem, DbxValueListItemDecisionFunction } from '../list.view.value';
 import { AbstractDbxValueListItemModifierDirective } from './list.view.value.modifier.directive';
 import * as i0 from "@angular/core";
 export declare const DBX_LIST_ITEM_IS_SELECTED_ITEM_MODIFIER_KEY = "is_selected_item_modifier";
 export declare const DEFAULT_DBX_LIST_ITEM_IS_SELECTED_FUNCTION: DbxValueListItemDecisionFunction<unknown>;
 export declare class DbxListItemIsSelectedModifierDirective<T> extends AbstractDbxValueListItemModifierDirective<T> implements OnDestroy {
-    private _listItemIsSelected;
-    readonly modifiers$: Observable<Maybe<ArrayOrValue<Modifier<DbxValueListItem<T>>>>>;
-    ngOnDestroy(): void;
-    set listItemIsSelected(listItemIsSelected: Maybe<DbxValueListItemDecisionFunction<T>>);
+    readonly listItemIsSelected: import("@angular/core").InputSignalWithTransform<Maybe<DbxValueListItemDecisionFunction<T>>, Maybe<string | DbxValueListItemDecisionFunction<T>>>;
+    readonly listItemIsSelectedModifiers$: Observable<Maybe<ArrayOrValue<Modifier<DbxValueListItem<T>>>>>;
+    constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxListItemIsSelectedModifierDirective<any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxListItemIsSelectedModifierDirective<any>, "[dbxListItemIsSelectedModifier]", never, { "listItemIsSelected": { "alias": "dbxListItemIsSelectedModifier"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxListItemIsSelectedModifierDirective<any>, "dbxListItemIsSelectedModifier,[dbxListItemIsSelectedModifier]", never, { "listItemIsSelected": { "alias": "dbxListItemIsSelectedModifier"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }

package/lib/layout/section/_section.scss

@@ -229,9 +229,9 @@ $header-left-reserved-space-small-screen: 120px;
 
 @mixin theme($theme-config) {
   @include theming.private-check-duplicate-theme-styles($theme-config, 'dbx-layout-section') {
-    $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/layout/section/section.component.d.ts

@@ -4,7 +4,8 @@ import * as i0 from "@angular/core";
  * Component used to format content on a page within a section.
  */
 export declare class DbxSectionComponent extends DbxSectionHeaderComponent {
-    elevate: boolean;
+    readonly elevate: import("@angular/core").InputSignal<boolean>;
+    readonly classConfig: import("@angular/core").Signal<"" | "dbx-section-elevate dbx-content-elevate">;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxSectionComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSectionComponent, "dbx-section", never, { "elevate": { "alias": "elevate"; "required": false; }; }, {}, never, ["[sectionHeader]", "*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSectionComponent, "dbx-section", never, { "elevate": { "alias": "elevate"; "required": false; "isSignal": true; }; }, {}, never, ["[sectionHeader]", "*"], true, never>;
 }

package/lib/layout/section/section.d.ts

@@ -1,10 +1,32 @@
 import { type Maybe } from '@dereekb/util';
 export type DbxSectionHeaderHType = 1 | 2 | 3 | 4 | 5;
 export interface DbxSectionHeaderConfig {
-    h?: Maybe<DbxSectionHeaderHType>;
-    header?: Maybe<string>;
-    onlyHeader?: Maybe<boolean>;
-    icon?: Maybe<string>;
-    hint?: Maybe<string>;
-    hintInline?: Maybe<boolean>;
+    /**
+     * Header sizing
+     */
+    readonly h?: Maybe<DbxSectionHeaderHType>;
+    /**
+     * Whether or not to pad the header so it is inline with a dbx-content-container
+     */
+    readonly paddedHeader?: Maybe<boolean>;
+    /**
+     * The header text
+     */
+    readonly header?: Maybe<string>;
+    /**
+     * Whether or not the header should be the only content in the section.
+     */
+    readonly onlyHeader?: Maybe<boolean>;
+    /**
+     * The icon to show.
+     */
+    readonly icon?: Maybe<string>;
+    /**
+     * The hint text to show.
+     */
+    readonly hint?: Maybe<string>;
+    /**
+     * Whether or not the hint should be shown inline with the header.
+     */
+    readonly hintInline?: Maybe<boolean>;
 }

package/lib/layout/section/section.header.component.d.ts

@@ -5,16 +5,17 @@ import * as i0 from "@angular/core";
  * Component used to style a section's header.
  */
 export declare class DbxSectionHeaderComponent {
-    paddedHeader?: Maybe<boolean>;
-    h?: Maybe<DbxSectionHeaderHType>;
-    header?: Maybe<string>;
-    onlyHeader?: Maybe<boolean>;
-    icon?: Maybe<string>;
-    hint?: Maybe<string>;
-    hintInline?: Maybe<boolean>;
-    constructor();
-    set headerConfig(headerConfig: Maybe<DbxSectionHeaderConfig>);
-    get showTitle(): boolean;
+    readonly headerConfig: import("@angular/core").InputSignal<Maybe<DbxSectionHeaderConfig>>;
+    readonly h: import("@angular/core").InputSignal<Maybe<DbxSectionHeaderHType>>;
+    readonly paddedHeader: import("@angular/core").InputSignal<Maybe<boolean>>;
+    readonly header: import("@angular/core").InputSignal<Maybe<string>>;
+    readonly onlyHeader: import("@angular/core").InputSignal<Maybe<boolean>>;
+    readonly icon: import("@angular/core").InputSignal<Maybe<string>>;
+    readonly hint: import("@angular/core").InputSignal<Maybe<string>>;
+    readonly hintInline: import("@angular/core").InputSignal<Maybe<boolean>>;
+    readonly hintInlineDefault: import("@angular/core").WritableSignal<Maybe<boolean>>;
+    readonly headerConfigSignal: import("@angular/core").Signal<DbxSectionHeaderConfig>;
+    readonly showTitleSignal: import("@angular/core").Signal<boolean>;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxSectionHeaderComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSectionHeaderComponent, "dbx-section-header,.dbx-section-header", never, { "paddedHeader": { "alias": "paddedHeader"; "required": false; }; "h": { "alias": "h"; "required": false; }; "header": { "alias": "header"; "required": false; }; "onlyHeader": { "alias": "onlyHeader"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "hintInline": { "alias": "hintInline"; "required": false; }; "headerConfig": { "alias": "headerConfig"; "required": false; }; }, {}, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSectionHeaderComponent, "dbx-section-header,.dbx-section-header", never, { "headerConfig": { "alias": "headerConfig"; "required": false; "isSignal": true; }; "h": { "alias": "h"; "required": false; "isSignal": true; }; "paddedHeader": { "alias": "paddedHeader"; "required": false; "isSignal": true; }; "header": { "alias": "header"; "required": false; "isSignal": true; }; "onlyHeader": { "alias": "onlyHeader"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "hintInline": { "alias": "hintInline"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }

package/lib/layout/section/section.intro.component.d.ts

@@ -1,15 +1,14 @@
-import { OnDestroy, EventEmitter } from '@angular/core';
-import { DbxSectionComponent } from './section.component';
+import { Maybe } from '@dereekb/util';
 import * as i0 from "@angular/core";
 /**
  * Component used to format content that displays an intro until a button is pressed.
  */
-export declare class DbxIntroActionSectionComponent extends DbxSectionComponent implements OnDestroy {
-    readonly showAction: EventEmitter<void>;
-    showIntro?: boolean;
-    action?: string;
-    ngOnDestroy(): void;
+export declare class DbxIntroActionSectionComponent {
+    readonly hint: import("@angular/core").InputSignal<Maybe<string>>;
+    readonly showIntro: import("@angular/core").InputSignal<Maybe<boolean>>;
+    readonly action: import("@angular/core").InputSignal<Maybe<string>>;
+    readonly showAction: import("@angular/core").OutputEmitterRef<void>;
     actionClicked(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxIntroActionSectionComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxIntroActionSectionComponent, "dbx-intro-action-section", never, { "showIntro": { "alias": "showIntro"; "required": false; }; "action": { "alias": "action"; "required": false; }; }, { "showAction": "showAction"; }, never, ["[info]", "*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxIntroActionSectionComponent, "dbx-intro-action-section", never, { "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "showIntro": { "alias": "showIntro"; "required": false; "isSignal": true; }; "action": { "alias": "action"; "required": false; "isSignal": true; }; }, { "showAction": "showAction"; }, never, ["[info]", "*"], true, never>;
 }

package/lib/layout/section/section.layout.module.d.ts

@@ -4,16 +4,11 @@ import * as i2 from "./section.page.component";
 import * as i3 from "./section.component";
 import * as i4 from "./subsection.component";
 import * as i5 from "./section.intro.component";
-import * as i6 from "@angular/common";
-import * as i7 from "../../router/layout/anchor/anchor.module";
-import * as i8 from "@angular/material/button";
-import * as i9 from "@angular/material/core";
-import * as i10 from "@angular/material/icon";
 /**
- * Module for container-type components.
+ * Module for dbx-section components.
  */
 export declare class DbxSectionLayoutModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxSectionLayoutModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxSectionLayoutModule, [typeof i1.DbxSectionHeaderComponent, typeof i2.DbxSectionPageComponent, typeof i3.DbxSectionComponent, typeof i4.DbxSubSectionComponent, typeof i5.DbxIntroActionSectionComponent], [typeof i6.CommonModule, typeof i7.DbxRouterAnchorModule, typeof i8.MatButtonModule, typeof i9.MatRippleModule, typeof i10.MatIconModule], [typeof i1.DbxSectionHeaderComponent, typeof i2.DbxSectionPageComponent, typeof i3.DbxSectionComponent, typeof i4.DbxSubSectionComponent, typeof i5.DbxIntroActionSectionComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxSectionLayoutModule, never, [typeof i1.DbxSectionHeaderComponent, typeof i2.DbxSectionPageComponent, typeof i3.DbxSectionComponent, typeof i4.DbxSubSectionComponent, typeof i5.DbxIntroActionSectionComponent], [typeof i1.DbxSectionHeaderComponent, typeof i2.DbxSectionPageComponent, typeof i3.DbxSectionComponent, typeof i4.DbxSubSectionComponent, typeof i5.DbxIntroActionSectionComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DbxSectionLayoutModule>;
 }

package/lib/layout/section/section.page.component.d.ts

@@ -17,8 +17,9 @@ export type DbxSectionPageScrollLockedMode = 'all' | 'body' | 'locked';
  * Can be nested within eachother, retaining the proper fixed height.
  */
 export declare class DbxSectionPageComponent extends DbxSectionHeaderComponent {
-    scroll: DbxSectionPageScrollLockedMode;
-    hintInline: boolean;
+    readonly scroll: import("@angular/core").InputSignal<DbxSectionPageScrollLockedMode>;
+    readonly classConfig: import("@angular/core").Signal<string>;
+    constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxSectionPageComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSectionPageComponent, "dbx-section-page", never, { "scroll": { "alias": "scroll"; "required": false; }; "hintInline": { "alias": "hintInline"; "required": false; }; }, {}, never, ["[sectionHeader]", "*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSectionPageComponent, "dbx-section-page", never, { "scroll": { "alias": "scroll"; "required": false; "isSignal": true; }; }, {}, never, ["[sectionHeader]", "*"], true, never>;
 }

package/lib/layout/section/subsection.component.d.ts

@@ -5,5 +5,5 @@ import * as i0 from "@angular/core";
  */
 export declare class DbxSubSectionComponent extends DbxSectionComponent {
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxSubSectionComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSubSectionComponent, "dbx-subsection", never, {}, {}, never, ["[sectionHeader]", "*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSubSectionComponent, "dbx-subsection", never, {}, {}, never, ["[sectionHeader]", "*"], true, never>;
 }

package/lib/layout/step/_step.scss

@@ -14,9 +14,9 @@
 
 @mixin theme($theme-config) {
   @include theming.private-check-duplicate-theme-styles($theme-config, 'dbx-layout-step') {
-    $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/layout/step/step.component.d.ts

@@ -1,9 +1,10 @@
+import { Maybe } from '@dereekb/util';
 import * as i0 from "@angular/core";
 export declare class DbxStepComponent {
-    done?: boolean;
-    step?: number;
-    text?: string;
-    hint?: string;
+    readonly done: import("@angular/core").InputSignal<boolean | undefined>;
+    readonly step: import("@angular/core").InputSignal<number | undefined>;
+    readonly text: import("@angular/core").InputSignal<Maybe<string>>;
+    readonly hint: import("@angular/core").InputSignal<Maybe<string>>;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxStepComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxStepComponent, "dbx-step", never, { "done": { "alias": "done"; "required": false; }; "step": { "alias": "step"; "required": false; }; "text": { "alias": "text"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; }, {}, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxStepComponent, "dbx-step", never, { "done": { "alias": "done"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }

package/lib/layout/step/step.layout.module.d.ts

@@ -1,9 +1,10 @@
 import * as i0 from "@angular/core";
 import * as i1 from "./step.component";
-import * as i2 from "@angular/common";
-import * as i3 from "@angular/material/icon";
+/**
+ * @deprecated import DbxStepComponent directly instead.
+ */
 export declare class DbxStepLayoutModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxStepLayoutModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxStepLayoutModule, [typeof i1.DbxStepComponent], [typeof i2.CommonModule, typeof i3.MatIconModule], [typeof i1.DbxStepComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxStepLayoutModule, never, [typeof i1.DbxStepComponent], [typeof i1.DbxStepComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DbxStepLayoutModule>;
 }

package/lib/layout/style/_style.scss

@@ -95,80 +95,97 @@
 @mixin color($theme-config) {
   .dbx-primary {
     color: theming.$dbx-primary-color;
+    --mdc-text-button-label-text-color: theming.$dbx-primary-color;
   }
 
   .dbx-primary-bg {
     background: theming.$dbx-primary-color;
     color: theming.$dbx-primary-color-contrast;
+    --mdc-text-button-label-text-color: theming.$dbx-primary-color-contrast;
   }
 
   .dbx-accent {
     color: theming.$dbx-accent-color;
+    --mdc-text-button-label-text-color: theming.$dbx-accent-color;
   }
 
   .dbx-accent-bg {
     background: theming.$dbx-accent-color;
     color: theming.$dbx-accent-color-contrast;
+    --mdc-text-button-label-text-color: theming.$dbx-primary-color-contrast;
   }
 
   .dbx-warn {
     color: theming.$dbx-warn-color;
+    --mdc-text-button-label-text-color: theming.$dbx-warn-color;
   }
 
   .dbx-warn-bg {
     background: theming.$dbx-warn-color;
     color: theming.$dbx-warn-color-contrast;
+    --mdc-text-button-label-text-color: theming.$dbx-warn-color-contrast;
   }
 
   .dbx-notice {
     color: theming.$dbx-notice-color;
+    --mdc-text-button-label-text-color: theming.$dbx-notice-color;
   }
 
   .dbx-notice-bg {
     background: theming.$dbx-notice-color;
     color: theming.$dbx-notice-color-contrast;
+    --mdc-text-button-label-text-color: theming.$dbx-notice-color-contrast;
   }
 
   .dbx-success {
     color: theming.$dbx-success-color;
+    --mdc-text-button-label-text-color: theming.$dbx-success-color;
   }
 
   .dbx-success-bg {
     background: theming.$dbx-success-color;
     color: theming.$dbx-success-color-contrast;
+    --mdc-text-button-label-text-color: theming.$dbx-success-color-contrast;
   }
 
   .dbx-ok {
     color: theming.$dbx-ok-color;
+    --mdc-text-button-label-text-color: theming.$dbx-ok-color;
   }
 
   .dbx-ok-bg {
     background: theming.$dbx-ok-color;
     color: theming.$dbx-ok-color-contrast;
+    --mdc-text-button-label-text-color: theming.$dbx-ok-color-contrast;
   }
 
   .dbx-grey {
     color: theming.$dbx-grey-color;
+    --mdc-text-button-label-text-color: theming.$dbx-grey-color;
   }
 
   .dbx-grey-bg {
     background: theming.$dbx-grey-color-contrast; // intentionally use the contrast for the bg
     color: theming.$dbx-grey-color;
+    --mdc-text-button-label-text-color: theming.$dbx-grey-color;
   }
 
   .dbx-disabled {
     color: theming.$dbx-disabled-color;
+    --mdc-text-button-label-text-color: theming.$dbx-disabled-color;
   }
 
   .dbx-disabled-bg {
     background: theming.$dbx-disabled-color-contrast; // intentionally use the contrast for the bg
     color: theming.$dbx-disabled-color;
+    --mdc-text-button-label-text-color: theming.$dbx-disabled-color;
   }
 
   .dbx-background,  // COMPAT: Remove dbx-background later
   .dbx-bg {
     background: theming.$dbx-bg-color-contrast;
     color: theming.$dbx-bg-color;
+    --mdc-text-button-label-text-color: theming.$dbx-bg-color;
   }
 }
 
@@ -177,9 +194,9 @@
 
 @mixin theme($theme-config) {
   @include theming.private-check-duplicate-theme-styles($theme-config, 'dbx-layout-style') {
-    $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/layout/style/index.d.ts

@@ -3,6 +3,7 @@ export * from './style.layout.module';
 export * from './spacer.directive';
 export * from './style.directive';
 export * from './style.service';
+export * from './style.providers';
 export * from './style.set.directive';
 export * from './style.body.directive';
 export * from './style.color.directive';

package/lib/layout/style/spacer.directive.d.ts

@@ -1,5 +1,5 @@
 import * as i0 from "@angular/core";
 export declare class DbxSpacerDirective {
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxSpacerDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxSpacerDirective, "dbx-spacer, [dbxSpacer]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxSpacerDirective, "dbx-spacer, [dbxSpacer]", never, {}, {}, never, never, true, never>;
 }

package/lib/layout/style/style.body.directive.d.ts

@@ -1,16 +1,16 @@
-import { ChangeDetectorRef } from '@angular/core';
-import { DbxStyleService } from './style.service';
+import { OnInit } from '@angular/core';
 import { AbstractSubscriptionDirective } from '@dereekb/dbx-core';
+import { Maybe } from '@dereekb/util';
 import * as i0 from "@angular/core";
 /**
- * Used to style the body document using the style provided by DbxStyleService.
+ * Used to style the <body> element of the document document using the style provided by DbxStyleService.
  */
-export declare class DbxStyleBodyDirective extends AbstractSubscriptionDirective {
+export declare class DbxStyleBodyDirective extends AbstractSubscriptionDirective implements OnInit {
+    private readonly _styleService;
     private readonly _renderer;
-    readonly styleService: DbxStyleService;
-    readonly cdRef: ChangeDetectorRef;
-    private _currentStyle;
+    private readonly _styleClassNameSignal;
+    readonly styleClassNameSignal: import("@angular/core").Signal<Maybe<string>>;
     ngOnInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxStyleBodyDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxStyleBodyDirective, "[dbxStyleBody]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxStyleBodyDirective, "[dbxStyleBody]", never, {}, {}, never, never, true, never>;
 }

package/lib/layout/style/style.color.directive.d.ts

@@ -5,8 +5,8 @@ import * as i0 from "@angular/core";
  * Used to apply a background style using a color.
  */
 export declare class DbxColorDirective {
-    cssClass: string;
-    set dbxColor(dbxColor: Maybe<DbxThemeColor | ''>);
+    readonly dbxColor: import("@angular/core").InputSignal<Maybe<"" | DbxThemeColor>>;
+    readonly cssClassSignal: import("@angular/core").Signal<string>;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxColorDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxColorDirective, "[dbxColor]", never, { "dbxColor": { "alias": "dbxColor"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxColorDirective, "[dbxColor]", never, { "dbxColor": { "alias": "dbxColor"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }