@dereekb/dbx-web 1.2.0 → 3.0.0

package/lib/button/progress/button.progress.module.d.ts

@@ -0,0 +1,17 @@
+import { ModuleWithProviders } from '@angular/core';
+import { DbxProgressButtonGlobalConfig } from './button.progress.config';
+import * as i0 from "@angular/core";
+import * as i1 from "./spinner.button.component";
+import * as i2 from "./bar.button.component";
+import * as i3 from "@angular/common";
+import * as i4 from "@angular/material/button";
+import * as i5 from "@angular/material/progress-bar";
+import * as i6 from "@angular/material/progress-spinner";
+import * as i7 from "@angular/material/core";
+import * as i8 from "@angular/material/icon";
+export declare class DbxProgressButtonsModule {
+    static forRoot(config?: DbxProgressButtonGlobalConfig): ModuleWithProviders<DbxProgressButtonsModule>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DbxProgressButtonsModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxProgressButtonsModule, [typeof i1.DbxSpinnerButtonComponent, typeof i2.DbxBarButtonComponent], [typeof i3.CommonModule, typeof i4.MatButtonModule, typeof i5.MatProgressBarModule, typeof i6.MatProgressSpinnerModule, typeof i7.MatRippleModule, typeof i8.MatIconModule], [typeof i1.DbxSpinnerButtonComponent, typeof i2.DbxBarButtonComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<DbxProgressButtonsModule>;
+}

package/lib/button/progress/index.d.ts

@@ -0,0 +1,4 @@
+export * from './bar.button.component';
+export * from './spinner.button.component';
+export * from './button.progress.module';
+export * from './button.progress.config';

package/lib/button/progress/spinner.button.component.d.ts

@@ -0,0 +1,9 @@
+import { ElementRef } from '@angular/core';
+import { AbstractProgressButtonDirective } from './base.progress.button.directive';
+import * as i0 from "@angular/core";
+export declare class DbxSpinnerButtonComponent extends AbstractProgressButtonDirective {
+    readonly buttonRef: ElementRef<HTMLElement>;
+    calcSpinnerSize(): number;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DbxSpinnerButtonComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxSpinnerButtonComponent, "dbx-spinner-button", never, {}, {}, never, ["*"]>;
+}

package/lib/button/progress/spinner.button.component.scss

@@ -0,0 +1,44 @@
+:host {
+  button {
+    outline: none;
+    &.working {
+      cursor: not-allowed;
+    }
+    & ::ng-deep .mat-button-wrapper {
+      display:flex;
+      align-items: center;
+      justify-content: center;
+    }
+    &.fullWidth {
+      width: 100%;
+    }
+    .spinner {
+      position: absolute;
+      // top: 25%;
+      opacity:0;
+      transition: opacity .3s ease-in-out;
+      &.working {
+        opacity: 1;
+      }
+    }
+    .button-text {
+      opacity: 1;
+      transition: opacity .3s ease-in-out;
+      &.working {
+        opacity: 0;
+      }
+    }
+    mat-icon.mat-button-icon {
+      padding-right: 5px;
+      transition: opacity .3s ease-in-out;
+      &.is-mat-icon {
+        font-size: 18px;
+        position: relative;
+        top: 3px;
+      }
+      &.working {
+        opacity: 0;
+      }
+    }
+  }
+}

package/lib/dbx-web.module.d.ts

@@ -2,7 +2,6 @@ import * as i0 from "@angular/core";
 import * as i1 from "./button/button.module";
 import * as i2 from "./action/action.module";
 import * as i3 from "./loading/loading.module";
-import * as i4 from "mat-progress-buttons";
 export declare class DbxWebModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxWebModule, never>;
     static ɵmod: i0.ɵɵNgModuleDeclaration<DbxWebModule, never, never, [typeof i1.DbxButtonModule, typeof i2.DbxActionModule, typeof i3.DbxLoadingModule]>;
@@ -12,10 +11,9 @@ export declare class DbxWebModule {
  * Should only be imported once in the root app.
  *
  * Pre-configures the following modules:
- * - MatProgressButtonsModule
  */
 export declare class DbxWebRootModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxWebRootModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxWebRootModule, never, [typeof i4.MatProgressButtonsModule], never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxWebRootModule, never, never, never>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DbxWebRootModule>;
 }

package/lib/error/error.action.directive.d.ts

@@ -1,5 +1,5 @@
 import { OnInit } from '@angular/core';
-import { ActionContextStoreSourceInstance, AbstractSubscriptionDirective } from '@dereekb/dbx-core';
+import { DbxActionContextStoreSourceInstance, AbstractSubscriptionDirective } from '@dereekb/dbx-core';
 import { DbxReadableErrorComponent } from './error.component';
 import * as i0 from "@angular/core";
 /**
@@ -7,8 +7,8 @@ import * as i0 from "@angular/core";
  */
 export declare class DbxActionErrorDirective extends AbstractSubscriptionDirective implements OnInit {
     readonly error: DbxReadableErrorComponent;
-    readonly source: ActionContextStoreSourceInstance;
-    constructor(error: DbxReadableErrorComponent, source: ActionContextStoreSourceInstance);
+    readonly source: DbxActionContextStoreSourceInstance;
+    constructor(error: DbxReadableErrorComponent, source: DbxActionContextStoreSourceInstance);
     ngOnInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxActionErrorDirective, [{ host: true; }, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<DbxActionErrorDirective, "[dbxActionError]", never, {}, {}, never>;

package/lib/interaction/dialog/_dialog.scss

@@ -1,10 +1,26 @@
 @use '../../style/theming';
 
 // MARK: Variables
-
+$dialog-width: 400px;
+$max-dialog-width: 90vw;
 
 // MARK: Mixin
-@mixin core() {}
+@mixin core() {
+
+  .dbx-dialog-content {
+
+    &.normal-dialog-content {
+      width: $dialog-width;
+      min-width: $dialog-width;
+    }
+
+    &.wide-dialog-content {
+      width: $max-dialog-width;
+    }
+    
+  }
+
+}
 
 @mixin color($theme-config) {}
 

package/lib/interaction/dialog/abstract.dialog.directive.d.ts

@@ -8,8 +8,9 @@ import * as i0 from "@angular/core";
 export declare abstract class AbstractDialogDirective<R = any, D = any, T = any> extends AbstractTransitionWatcherDirective {
     readonly data: D;
     readonly dialogRef: MatDialogRef<T, R>;
-    constructor(data: D, dialogRef: MatDialogRef<T, R>, dbNgxRouterTransitionService: DbxRouterTransitionService, ngZone: NgZone);
+    constructor(data: D, dialogRef: MatDialogRef<T, R>, dbxRouterTransitionService: DbxRouterTransitionService, ngZone: NgZone);
     protected updateForSuccessfulTransition(): void;
+    returnValue(value?: R): void;
     close(value?: R): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AbstractDialogDirective<any, any, any>, [{ optional: true; }, null, null, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<AbstractDialogDirective<any, any, any>, never, never, {}, {}, never>;

package/lib/interaction/dialog/dialog.action.directive.d.ts

@@ -0,0 +1,21 @@
+import { Observable } from 'rxjs';
+import { OnInit, OnDestroy, ElementRef } from '@angular/core';
+import { DbxActionContextStoreSourceInstance, AbstractDbxActionValueOnTriggerDirective } from '@dereekb/dbx-core';
+import { IsModifiedFunction } from '@dereekb/rxjs';
+import { Maybe } from '@dereekb/util';
+import { MatDialogRef } from '@angular/material/dialog';
+import * as i0 from "@angular/core";
+export declare type DbxActionDialogFunction<T = any> = () => MatDialogRef<any, Maybe<T>>;
+/**
+ * Action directive that is used to trigger/display a dialog, then watches that dialog for a value.
+ */
+export declare class DbxActionDialogDirective<T = any> extends AbstractDbxActionValueOnTriggerDirective<T> implements OnInit, OnDestroy {
+    readonly elementRef: ElementRef;
+    fn?: DbxActionDialogFunction<T>;
+    set dbxActionDialogModified(isModifiedFunction: Maybe<IsModifiedFunction>);
+    constructor(elementRef: ElementRef, source: DbxActionContextStoreSourceInstance<T, any>);
+    protected _getDataFromDialog(): Observable<Maybe<T>>;
+    protected _makeDialogRef(): MatDialogRef<any, Maybe<T>>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DbxActionDialogDirective<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxActionDialogDirective<any>, "[dbxActionDialog]", ["dbxActionDialog"], { "fn": "dbxActionDialog"; "dbxActionDialogModified": "dbxActionDialogModified"; }, {}, never>;
+}

package/lib/interaction/dialog/dialog.module.d.ts

@@ -1,12 +1,13 @@
 import * as i0 from "@angular/core";
 import * as i1 from "./dialog.content.component";
-import * as i2 from "@angular/common";
-import * as i3 from "../../layout/style/style.layout.module";
+import * as i2 from "./dialog.action.directive";
+import * as i3 from "@angular/common";
+import * as i4 from "../../layout/style/style.layout.module";
 /**
  * Module for block components.
  */
 export declare class DbxDialogInteractionModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxDialogInteractionModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxDialogInteractionModule, [typeof i1.DbxDialogContentDirective], [typeof i2.CommonModule, typeof i3.DbxStyleLayoutModule], [typeof i1.DbxDialogContentDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxDialogInteractionModule, [typeof i1.DbxDialogContentDirective, typeof i2.DbxActionDialogDirective], [typeof i3.CommonModule, typeof i4.DbxStyleLayoutModule], [typeof i1.DbxDialogContentDirective, typeof i2.DbxActionDialogDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DbxDialogInteractionModule>;
 }

package/lib/interaction/dialog/index.d.ts

@@ -1,3 +1,4 @@
 export * from './abstract.dialog.directive';
 export * from './dialog.content.component';
+export * from './dialog.action.directive';
 export * from './dialog.module';

package/lib/interaction/filter/filter.module.d.ts

@@ -10,6 +10,6 @@ import * as i8 from "@angular/material/icon";
 import * as i9 from "@angular/material/button";
 export declare class DbxFilterInteractionModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxFilterInteractionModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxFilterInteractionModule, [typeof i1.DbxFilterPopoverComponent, typeof i2.DbxFilterPopoverButtonComponent, typeof i3.DbxFilterWrapperComponent], [typeof i4.CommonModule, typeof i5.DbxPopoverInteractionModule, typeof i6.DbxCoreFilterModule, typeof i6.DbxInjectedComponentModule, typeof i7.FlexLayoutModule, typeof i8.MatIconModule, typeof i9.MatButtonModule], [typeof i6.DbxCoreFilterModule, typeof i2.DbxFilterPopoverButtonComponent, typeof i3.DbxFilterWrapperComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxFilterInteractionModule, [typeof i1.DbxFilterPopoverComponent, typeof i2.DbxFilterPopoverButtonComponent, typeof i3.DbxFilterWrapperComponent], [typeof i4.CommonModule, typeof i5.DbxPopoverInteractionModule, typeof i6.DbxCoreFilterModule, typeof i6.DbxInjectionComponentModule, typeof i7.FlexLayoutModule, typeof i8.MatIconModule, typeof i9.MatButtonModule], [typeof i6.DbxCoreFilterModule, typeof i2.DbxFilterPopoverButtonComponent, typeof i3.DbxFilterWrapperComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DbxFilterInteractionModule>;
 }

package/lib/interaction/filter/filter.popover.component.d.ts

@@ -1,4 +1,4 @@
-import { DbxInjectedComponentConfig } from '@dereekb/dbx-core';
+import { DbxInjectionComponentConfig } from '@dereekb/dbx-core';
 import { ElementRef, Type, OnInit } from '@angular/core';
 import { NgPopoverRef } from 'ng-overlay-container';
 import { Observable } from 'rxjs';
@@ -40,7 +40,7 @@ export declare class DbxFilterPopoverComponent<F> extends AbstractPopoverDirecti
     readonly showSwitchButtons: boolean;
     private _showPreset;
     readonly showPreset$: Observable<boolean>;
-    readonly config$: Observable<DbxInjectedComponentConfig>;
+    readonly config$: Observable<DbxInjectionComponentConfig>;
     static openPopover<F>(popupService: DbxPopoverService, { origin, initialFilterObs: inputSource, connector, customFilterComponentClass, presetFilterComponentClass }: DbxFilterPopoverComponentParams<F>, popoverKey?: DbxPopoverKey): NgPopoverRef;
     constructor(popover: DbxPopoverComponent);
     get config(): DbxFilterComponentParams<F>;

package/lib/interaction/popover/index.d.ts

@@ -1,6 +1,5 @@
 export * from './abstract.popover.directive';
 export * from './abstract.popover.ref.directive';
-export * from './popover.action.button.directive';
 export * from './popover.action.directive';
 export * from './popover.component';
 export * from './popover.content.component';

package/lib/interaction/popover/popover.action.directive.d.ts

@@ -1,33 +1,24 @@
 import { Observable } from 'rxjs';
 import { OnInit, OnDestroy, ElementRef } from '@angular/core';
-import { NgPopoverCloseEvent, NgPopoverRef } from 'ng-overlay-container';
-import { AbstractPopoverRefWithEventsDirective } from './abstract.popover.ref.directive';
-import { ActionContextStoreSourceInstance } from '@dereekb/dbx-core';
+import { NgPopoverRef } from 'ng-overlay-container';
+import { DbxActionContextStoreSourceInstance, AbstractDbxActionValueOnTriggerDirective } from '@dereekb/dbx-core';
+import { IsModifiedFunction } from '@dereekb/rxjs';
+import { Maybe } from '@dereekb/util';
 import * as i0 from "@angular/core";
-export interface DbxPopoverActionFnParam {
+export interface DbxActionPopoverFunctionParams {
     origin: ElementRef;
 }
-export declare type DbxPopoverActionFn<T = object> = (params: DbxPopoverActionFnParam) => NgPopoverRef<any, T>;
-export declare type DbxPopoverActionModifiedFn<T = any> = (value: T) => Observable<boolean>;
+export declare type DbxActionPopoverFunction<T = any> = (params: DbxActionPopoverFunctionParams) => NgPopoverRef<any, Maybe<T>>;
 /**
- * Action directive that is used to trigger/display a popover,
- * then watches that popover for a value.
- *
- * The value is passed to the isModified function (ifProvided), and if that returns true it will
+ * Action directive that is used to trigger/display a popover, then watches that popover for a value.
  */
-export declare class DbxPopoverActionDirective<T = object> extends AbstractPopoverRefWithEventsDirective<any, T> implements OnInit, OnDestroy {
+export declare class DbxActionPopoverDirective<T = any> extends AbstractDbxActionValueOnTriggerDirective<T> implements OnInit, OnDestroy {
     readonly elementRef: ElementRef;
-    readonly source: ActionContextStoreSourceInstance<T, any>;
-    fn?: DbxPopoverActionFn<T>;
-    appPopoverActionModified?: DbxPopoverActionModifiedFn<T>;
-    private _popoverValue;
-    private _triggeredSub;
-    private _isModifiedSub;
-    constructor(elementRef: ElementRef, source: ActionContextStoreSourceInstance<T, any>);
-    ngOnInit(): void;
-    ngOnDestroy(): void;
-    protected _makePopoverRef(): NgPopoverRef<any, T>;
-    protected _afterClosed(event: NgPopoverCloseEvent<T>): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<DbxPopoverActionDirective<any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxPopoverActionDirective<any>, "[dbxPopoverAction]", ["popoverAction"], { "fn": "dbxPopoverAction"; "appPopoverActionModified": "appPopoverActionModified"; }, {}, never>;
+    fn?: DbxActionPopoverFunction<T>;
+    set dbxActionPopoverModified(isModifiedFunction: Maybe<IsModifiedFunction>);
+    constructor(elementRef: ElementRef, source: DbxActionContextStoreSourceInstance<T, any>);
+    protected _getDataFromPopover(): Observable<Maybe<T>>;
+    protected _makePopoverRef(): NgPopoverRef<any, Maybe<T>>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DbxActionPopoverDirective<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DbxActionPopoverDirective<any>, "[dbxActionPopover]", ["dbxActionPopover"], { "fn": "dbxActionPopover"; "dbxActionPopoverModified": "dbxActionPopoverModified"; }, {}, never>;
 }

package/lib/interaction/popover/popover.component.d.ts

@@ -1,6 +1,6 @@
 import { NgZone, Type, OnInit, OnDestroy, ElementRef } from '@angular/core';
 import { NgOverlayContainerConfiguration, NgPopoverRef } from 'ng-overlay-container';
-import { AbstractTransitionWatcherDirective, DbxRouterTransitionService, DbxInjectedComponentConfig } from '@dereekb/dbx-core';
+import { AbstractTransitionWatcherDirective, DbxRouterTransitionService, DbxInjectionComponentConfig } from '@dereekb/dbx-core';
 import { LockSet } from '@dereekb/rxjs';
 import { CompactContextStore } from '../../layout';
 import { Maybe } from '@dereekb/util';
@@ -50,14 +50,14 @@ export declare class DbxPopoverComponent<O = any, I = any, T = any> extends Abst
     private popoverRef;
     private compactContextState;
     readonly lockSet: LockSet;
-    readonly contentConfig: DbxInjectedComponentConfig;
+    readonly contentConfig: DbxInjectionComponentConfig;
     private _startedClosing;
     private readonly _closing;
     private _triggerCloseKeys;
     readonly isClosing$: import("rxjs").Observable<boolean>;
     readonly closing$: import("rxjs").Observable<boolean>;
     getClosingValueFn?: (value?: I) => Promise<O>;
-    constructor(popoverRef: NgPopoverRef<FullDbxPopoverComponentConfig<O, I, T>, O>, compactContextState: CompactContextStore, dbNgxRouterTransitionService: DbxRouterTransitionService, ngZone: NgZone);
+    constructor(popoverRef: NgPopoverRef<FullDbxPopoverComponentConfig<O, I, T>, O>, compactContextState: CompactContextStore, dbxRouterTransitionService: DbxRouterTransitionService, ngZone: NgZone);
     get config(): FullDbxPopoverComponentConfig<O, I, T>;
     get key(): DbxPopoverKey;
     get data(): Maybe<I>;

package/lib/interaction/popover/popover.coordinator.service.d.ts

@@ -1,11 +1,13 @@
 import { DbxPopoverKey, DbxPopoverController } from './popover';
+import { OnDestroy } from '@angular/core';
 import * as i0 from "@angular/core";
 /**
  * Used for coordinating popovers and closing/replacing existing ones when a new popover of the same name appears.
  */
-export declare class DbxPopoverCoordinatorService {
+export declare class DbxPopoverCoordinatorService implements OnDestroy {
     private _popovers;
     readonly popovers$: import("rxjs").Observable<Map<string, DbxPopoverController<any, any>>>;
+    ngOnDestroy(): void;
     get popovers(): Map<DbxPopoverKey, DbxPopoverController>;
     addPopover(popover: DbxPopoverController): void;
     removePopover(key: DbxPopoverKey, popover?: DbxPopoverController): void;

package/lib/interaction/popover/popover.module.d.ts

@@ -1,28 +1,25 @@
-import { ModuleWithProviders } from '@angular/core';
 import * as i0 from "@angular/core";
-import * as i1 from "./popover.action.button.directive";
-import * as i2 from "./popover.action.directive";
-import * as i3 from "./popover.component";
-import * as i4 from "./popover.coordinator.component";
-import * as i5 from "./popover.content.component";
-import * as i6 from "./popover.controls.directive";
-import * as i7 from "./popover.header.component";
-import * as i8 from "./popover.scroll.content.component";
-import * as i9 from "@angular/common";
-import * as i10 from "@angular/material/icon";
-import * as i11 from "@angular/material/button";
-import * as i12 from "@angular/material/divider";
-import * as i13 from "../../button/button.module";
-import * as i14 from "../../router/layout/anchor/anchor.module";
-import * as i15 from "../../action/action.module";
-import * as i16 from "../../keypress/keypress.module";
-import * as i17 from "../../layout/style/style.layout.module";
-import * as i18 from "@dereekb/dbx-core";
-import * as i19 from "ng-overlay-container";
-import * as i20 from "angular-resize-event";
+import * as i1 from "./popover.action.directive";
+import * as i2 from "./popover.component";
+import * as i3 from "./popover.coordinator.component";
+import * as i4 from "./popover.content.component";
+import * as i5 from "./popover.controls.directive";
+import * as i6 from "./popover.header.component";
+import * as i7 from "./popover.scroll.content.component";
+import * as i8 from "@angular/common";
+import * as i9 from "@angular/material/icon";
+import * as i10 from "@angular/material/button";
+import * as i11 from "@angular/material/divider";
+import * as i12 from "../../button/button.module";
+import * as i13 from "../../router/layout/anchor/anchor.module";
+import * as i14 from "../../action/action.module";
+import * as i15 from "../../keypress/keypress.module";
+import * as i16 from "../../layout/style/style.layout.module";
+import * as i17 from "@dereekb/dbx-core";
+import * as i18 from "ng-overlay-container";
+import * as i19 from "angular-resize-event";
 export declare class DbxPopoverInteractionModule {
-    static forRoot(): ModuleWithProviders<DbxPopoverInteractionModule>;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxPopoverInteractionModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxPopoverInteractionModule, [typeof i1.DbxPopoverActionButtonDirective, typeof i2.DbxPopoverActionDirective, typeof i3.DbxPopoverComponent, typeof i4.DbxPopoverCoordinatorComponent, typeof i5.DbxPopoverContentComponent, typeof i6.DbxPopoverControlsDirective, typeof i7.DbxPopoverHeaderComponent, typeof i8.DbxPopoverScrollContentComponent], [typeof i9.CommonModule, typeof i10.MatIconModule, typeof i11.MatButtonModule, typeof i12.MatDividerModule, typeof i13.DbxButtonModule, typeof i14.DbxAnchorModule, typeof i15.DbxActionModule, typeof i16.DbxKeypressModule, typeof i17.DbxStyleLayoutModule, typeof i18.DbxInjectedComponentModule, typeof i19.NgOverlayContainerModule, typeof i20.AngularResizeEventModule], [typeof i1.DbxPopoverActionButtonDirective, typeof i2.DbxPopoverActionDirective, typeof i5.DbxPopoverContentComponent, typeof i6.DbxPopoverControlsDirective, typeof i7.DbxPopoverHeaderComponent, typeof i8.DbxPopoverScrollContentComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxPopoverInteractionModule, [typeof i1.DbxActionPopoverDirective, typeof i2.DbxPopoverComponent, typeof i3.DbxPopoverCoordinatorComponent, typeof i4.DbxPopoverContentComponent, typeof i5.DbxPopoverControlsDirective, typeof i6.DbxPopoverHeaderComponent, typeof i7.DbxPopoverScrollContentComponent], [typeof i8.CommonModule, typeof i9.MatIconModule, typeof i10.MatButtonModule, typeof i11.MatDividerModule, typeof i12.DbxButtonModule, typeof i13.DbxRouterAnchorModule, typeof i14.DbxActionModule, typeof i15.DbxKeypressModule, typeof i16.DbxStyleLayoutModule, typeof i17.DbxInjectionComponentModule, typeof i18.NgOverlayContainerModule, typeof i19.AngularResizeEventModule], [typeof i1.DbxActionPopoverDirective, typeof i4.DbxPopoverContentComponent, typeof i5.DbxPopoverControlsDirective, typeof i6.DbxPopoverHeaderComponent, typeof i7.DbxPopoverScrollContentComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DbxPopoverInteractionModule>;
 }

package/lib/interaction/popup/popup.component.d.ts

@@ -3,7 +3,7 @@ import { NgPopoverRef } from 'ng-overlay-container';
 import { Maybe } from '@dereekb/util';
 import { CompactContextStore } from '../../layout';
 import { PopupPosition, PopupPositionOffset } from './popup.position.strategy';
-import { AbstractTransitionWatcherDirective, DbxInjectedComponentConfig, DbxRouterTransitionService } from '@dereekb/dbx-core';
+import { AbstractTransitionWatcherDirective, DbxInjectionComponentConfig, DbxRouterTransitionService } from '@dereekb/dbx-core';
 import { DbxPopupController, DbxPopupKey, DbxPopupWindowState } from './popup';
 import * as i0 from "@angular/core";
 export declare const APP_POPUP_NORMAL_WIDTH = "700px";
@@ -34,14 +34,14 @@ export declare class DbxPopupComponent<O = any, I = any, T = any> extends Abstra
     private popoverRef;
     private compactContextState;
     private _position;
-    readonly contentConfig: DbxInjectedComponentConfig;
+    readonly contentConfig: DbxInjectionComponentConfig;
     private readonly closing;
     readonly isClosing$: import("rxjs").Observable<boolean>;
     readonly closing$: import("rxjs").Observable<boolean>;
     private readonly _windowState;
     readonly windowState$: import("rxjs").Observable<DbxPopupWindowState>;
     getClosingValueFn?: (value?: I) => Promise<O>;
-    constructor(popoverRef: NgPopoverRef<DbxPopupComponentConfig<O, I, T>, O>, compactContextState: CompactContextStore, dbNgxRouterTransitionService: DbxRouterTransitionService, ngZone: NgZone);
+    constructor(popoverRef: NgPopoverRef<DbxPopupComponentConfig<O, I, T>, O>, compactContextState: CompactContextStore, dbxRouterTransitionService: DbxRouterTransitionService, ngZone: NgZone);
     get config(): DbxPopupComponentConfig<O, I, T>;
     get key(): DbxPopupKey;
     get data(): Maybe<I>;

package/lib/interaction/popup/popup.coordinator.service.d.ts

@@ -1,12 +1,14 @@
 import { DbxPopupKey, DbxPopupController } from './popup';
+import { OnDestroy } from '@angular/core';
 import * as i0 from "@angular/core";
 /**
  * Used for coordinating popups and closing/replacing existing ones when a new popup of the same name appears.
  */
-export declare class DbxPopupCoordinatorService {
+export declare class DbxPopupCoordinatorService implements OnDestroy {
     private _popups;
     readonly popups$: import("rxjs").Observable<Map<string, DbxPopupController<any, any>>>;
     constructor();
+    ngOnDestroy(): void;
     get popups(): Map<DbxPopupKey, DbxPopupController>;
     addPopup(popup: DbxPopupController): void;
     removePopup(key: DbxPopupKey, popup?: DbxPopupController): void;

package/lib/interaction/popup/popup.module.d.ts

@@ -1,4 +1,3 @@
-import { ModuleWithProviders } from '@angular/core';
 import * as i0 from "@angular/core";
 import * as i1 from "./popup.component";
 import * as i2 from "./popup.coordinator.component";
@@ -15,8 +14,7 @@ import * as i12 from "../../layout/style/style.layout.module";
 import * as i13 from "@dereekb/dbx-core";
 import * as i14 from "ng-overlay-container";
 export declare class DbxPopupInteractionModule {
-    static forRoot(): ModuleWithProviders<DbxPopupInteractionModule>;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxPopupInteractionModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxPopupInteractionModule, [typeof i1.DbxPopupComponent, typeof i2.DbxPopupCoordinatorComponent, typeof i3.DbxPopupContentComponent, typeof i4.DbxPopupControlsComponent, typeof i5.DbxPopupControlButtonsComponent], [typeof i6.CommonModule, typeof i7.MatIconModule, typeof i8.MatButtonModule, typeof i9.DbxButtonModule, typeof i10.DbxAnchorModule, typeof i11.DbxActionModule, typeof i12.DbxStyleLayoutModule, typeof i13.DbxInjectedComponentModule, typeof i14.NgOverlayContainerModule], [typeof i3.DbxPopupContentComponent, typeof i4.DbxPopupControlsComponent, typeof i5.DbxPopupControlButtonsComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxPopupInteractionModule, [typeof i1.DbxPopupComponent, typeof i2.DbxPopupCoordinatorComponent, typeof i3.DbxPopupContentComponent, typeof i4.DbxPopupControlsComponent, typeof i5.DbxPopupControlButtonsComponent], [typeof i6.CommonModule, typeof i7.MatIconModule, typeof i8.MatButtonModule, typeof i9.DbxButtonModule, typeof i10.DbxRouterAnchorModule, typeof i11.DbxActionModule, typeof i12.DbxStyleLayoutModule, typeof i13.DbxInjectionComponentModule, typeof i14.NgOverlayContainerModule], [typeof i3.DbxPopupContentComponent, typeof i4.DbxPopupControlsComponent, typeof i5.DbxPopupControlButtonsComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DbxPopupInteractionModule>;
 }

package/lib/interaction/prompt/prompt.confirm.dialog.component.d.ts

@@ -1,5 +1,5 @@
 import { MatDialog, MatDialogRef } from '@angular/material/dialog';
-import { DbxInjectedComponentConfig } from '@dereekb/dbx-core';
+import { DbxInjectionComponentConfig } from '@dereekb/dbx-core';
 import { OnInit } from '@angular/core';
 import { AbstractDialogDirective } from '../dialog/abstract.dialog.directive';
 import { DbxPromptConfirmConfig, DbxPromptConfirmTypes } from './prompt.confirm.component';
@@ -10,11 +10,11 @@ export declare const DEFAULT_DBX_PROMPT_CONFIRM_DIALOG_CONFIG: {
     type: DbxPromptConfirmTypes;
 };
 export interface DbxPromptConfirmDialogConfig extends DbxPromptConfirmConfig {
-    component?: DbxInjectedComponentConfig;
+    component?: DbxInjectionComponentConfig;
 }
 export declare class DbxPromptConfirmDialogComponent extends AbstractDialogDirective<boolean, DbxPromptConfirmDialogConfig> implements OnInit {
     get config(): DbxPromptConfirmDialogConfig;
-    get injectedConfig(): Maybe<DbxInjectedComponentConfig>;
+    get injectionConfig(): Maybe<DbxInjectionComponentConfig>;
     static openDialog(matDialog: MatDialog, config?: DbxPromptConfirmDialogConfig): MatDialogRef<DbxPromptConfirmDialogComponent, boolean>;
     confirm(): void;
     cancel(): void;

package/lib/interaction/prompt/prompt.module.d.ts

@@ -17,6 +17,6 @@ import * as i15 from "../../layout/section/section.layout.module";
 import * as i16 from "../../layout/content/content.layout.module";
 export declare class DbxPromptModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxPromptModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxPromptModule, [typeof i1.DbxPromptComponent, typeof i2.DbxPromptBoxComponent, typeof i3.DbxPromptPageComponent, typeof i4.DbxPromptConfirmComponent, typeof i5.DbxPromptConfirmButtonDirective, typeof i6.DbxPromptConfirmDialogComponent, typeof i7.DbxPromptConfirmDirective], [typeof i8.CommonModule, typeof i9.MatDialogModule, typeof i10.MatButtonModule, typeof i11.DbxTextModule, typeof i12.DbxButtonModule, typeof i13.DbxInjectedComponentModule, typeof i14.DbxDialogInteractionModule, typeof i15.DbxSectionLayoutModule, typeof i16.DbxContentLayoutModule], [typeof i1.DbxPromptComponent, typeof i2.DbxPromptBoxComponent, typeof i3.DbxPromptPageComponent, typeof i4.DbxPromptConfirmComponent, typeof i5.DbxPromptConfirmButtonDirective, typeof i7.DbxPromptConfirmDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxPromptModule, [typeof i1.DbxPromptComponent, typeof i2.DbxPromptBoxComponent, typeof i3.DbxPromptPageComponent, typeof i4.DbxPromptConfirmComponent, typeof i5.DbxPromptConfirmButtonDirective, typeof i6.DbxPromptConfirmDialogComponent, typeof i7.DbxPromptConfirmDirective], [typeof i8.CommonModule, typeof i9.MatDialogModule, typeof i10.MatButtonModule, typeof i11.DbxTextModule, typeof i12.DbxButtonModule, typeof i13.DbxInjectionComponentModule, typeof i14.DbxDialogInteractionModule, typeof i15.DbxSectionLayoutModule, typeof i16.DbxContentLayoutModule], [typeof i1.DbxPromptComponent, typeof i2.DbxPromptBoxComponent, typeof i3.DbxPromptPageComponent, typeof i4.DbxPromptConfirmComponent, typeof i5.DbxPromptConfirmButtonDirective, typeof i7.DbxPromptConfirmDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DbxPromptModule>;
 }

package/lib/layout/block/_block.scss

@@ -1,22 +1,25 @@
 @use '../../style/theming';
 
 // MARK: Variables
-
+$two-block-top-height-init-height: 50px;
+$two-block-top-height-var: --dbx-two-block-top-height;
 
 // MARK: Mixin
 @mixin core() {
 
-  // todo
+  .dbx-two-block.dbx-two-block-fixed-top {
+    height: 100%;
+  }
 
-  .two-blocks {
+  .dbx-two-block-content {
     height: 100%;
-    --two-blocks-top-height: 50;
-  
-    .bottom-block {
-      height: calc(100% - var(--two-blocks-top-height));
+    #{$two-block-top-height-var}: $two-block-top-height-init-height;
+
+    .dbx-two-block-bottom {
+      height: calc(100% - var($two-block-top-height-var));
     }
   }
-      
+
 }
 
 @mixin color($theme-config) {}

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

@@ -8,6 +8,6 @@ import * as i4 from "angular-resize-event";
  */
 export declare class DbxBlockLayoutModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxBlockLayoutModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxBlockLayoutModule, [typeof i1.DbxTwoBlocksComponent], [typeof i2.CommonModule, typeof i3.DbxAnchorModule, typeof i4.AngularResizeEventModule], [typeof i1.DbxTwoBlocksComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DbxBlockLayoutModule, [typeof i1.DbxTwoBlocksComponent], [typeof i2.CommonModule, typeof i3.DbxRouterAnchorModule, typeof i4.AngularResizeEventModule], [typeof i1.DbxTwoBlocksComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DbxBlockLayoutModule>;
 }

package/lib/layout/block/two.block.component.d.ts

@@ -9,8 +9,12 @@ import * as i0 from "@angular/core";
  * The height is calculated from 100%.
  */
 export declare class DbxTwoBlocksComponent {
+    /**
+     * Whether or not the top bar should be fixed in place instead of scrolling with the bottom when content is too tall.
+     */
+    fixedTop: boolean;
     twoElement: ElementRef;
     onResized(event: ResizedEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DbxTwoBlocksComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DbxTwoBlocksComponent, "dbx-two-block", never, {}, {}, never, ["[top]", "*"]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DbxTwoBlocksComponent, "dbx-two-block", never, { "fixedTop": "fixedTop"; }, {}, never, ["[top]", "*"]>;
 }