@almoamendev/ngx-md3 0.2.1 → 0.2.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@almoamendev/ngx-md3",
-  "version": "0.2.1",
+  "version": "0.2.2",
   "description": "MD3-style Angular components & style library",
   "author": "Murtadha (Hussain) Almoamen",
   "license": "MIT",

package/types/almoamendev-ngx-md3.d.ts

@@ -998,6 +998,7 @@ declare class DialogRef<T = unknown, R = unknown> {
     readonly isFullScreen: boolean;
     private readonly closed;
     private readonly closing;
+    private readonly hiddenChanges;
     private closePromise;
     private closeStarted;
     private closeSettled;
@@ -1013,7 +1014,7 @@ declare class DialogRef<T = unknown, R = unknown> {
     get overlayRef(): OverlayRef;
     /** Whether the dialog started closing. Such a dialog cannot be hidden or shown anymore. */
     get isClosing(): boolean;
-    /** Whether the dialog is currently hidden behind another dialog. */
+    /** Whether the dialog is currently hidden, on request or behind another dialog. */
     get isHidden(): boolean;
     constructor(cdkRef: DialogRef$1<R, T>, disableCloseEvents: boolean, 
     /** Whether this reference belongs to a full screen dialog. */
@@ -1023,6 +1024,7 @@ declare class DialogRef<T = unknown, R = unknown> {
     /**
      * Hides the dialog with the closing animation while keeping it alive, so
      * its content, form state and subscriptions survive until show() is called.
+     * The page underneath becomes usable again while the dialog waits behind it.
      * The promise resolves once the dialog is out of sight.
      */
     hide(): Promise<void>;
@@ -1034,6 +1036,8 @@ declare class DialogRef<T = unknown, R = unknown> {
     show(): void;
     /** Emits when the dialog starts closing, before the exit animation runs. */
     beforeClosed(): Observable<void>;
+    /** Emits the new value of `isHidden` every time the dialog is hidden or shown. */
+    hiddenChanged(): Observable<boolean>;
     afterClosed(): Observable<R | undefined>;
     private connectCloseEvents;
     private toggleHiddenState;
@@ -1048,10 +1052,16 @@ declare class DialogRef<T = unknown, R = unknown> {
 declare class DialogService {
     private readonly cdkDialog;
     private readonly overlay;
+    private readonly overlayContainer;
     private readonly injector;
     private readonly document;
     /** Open dialogs, from the first one opened to the one currently on top. */
     private readonly refs;
+    /**
+     * Elements the page was made of that the CDK hid from assistive technology,
+     * kept here while the dialogs are hidden and the page is given back.
+     */
+    private readonly pageAriaHidden;
     /**
      * Page scrolling is blocked here instead of per overlay, so stacked dialogs
      * cannot unblock the page while another dialog is still open.
@@ -1059,7 +1069,10 @@ declare class DialogService {
     private readonly scrollBlock;
     /** Element that was focused before the first dialog of the stack opened. */
     private rootTrigger;
+    private pageStateQueued;
     get openDialogs(): readonly DialogRef<any, any>[];
+    /** Open dialogs that are currently on screen, from the bottom one up. */
+    get visibleDialogs(): readonly DialogRef<any, any>[];
     /** The full screen dialog that is open, if there is one. */
     get fullScreenDialog(): DialogRef<any, any> | undefined;
     open<T, D = unknown, R = unknown>(component: Type<T>, config?: DialogConfig<D>): DialogRef<T, R>;
@@ -1071,6 +1084,20 @@ declare class DialogService {
     openFullScreen<T, D = unknown, R = unknown>(component: Type<T>, config?: FullScreenDialogConfig<D>): DialogRef<T, R>;
     /** Wires a freshly created dialog into the stack and starts its animation. */
     private registerDialog;
+    /**
+     * Hides every dialog that is on screen, the full screen one included, with
+     * the closing animation. They stay alive with their content and state, the
+     * page underneath becomes usable, and showAll() puts them back. The promise
+     * resolves once they are all out of sight.
+     */
+    hideAll(): Promise<void>;
+    /**
+     * Brings the dialogs back on screen, whether they were hidden one by one or
+     * all at once: the dialog that was on top returns, along with the full
+     * screen dialog it sits in. Dialogs hidden behind another dialog stay
+     * hidden, since that is where they belong once the stack is back.
+     */
+    showAll(): void;
     /** Closes every open dialog, including the hidden and the full screen ones. */
     closeAll(): Promise<void>;
     /** Closes the regular dialogs and leaves a full screen dialog alone. */
@@ -1105,7 +1132,29 @@ declare class DialogService {
     private topRegularRef;
     private restorePreviousDialog;
     private removeRef;
-    private updateScrollBlock;
+    /**
+     * State that belongs to the dialogs as a whole rather than to one of them:
+     * page scrolling, the page being hidden from assistive technology, and
+     * where focus sits. Applied in a task of its own, so a dialog handing the
+     * screen over to another one does not give the page back and take it again
+     * within the same frame.
+     */
+    private syncPageState;
+    private applyPageState;
+    /**
+     * Gives the page back to assistive technology while every dialog is hidden.
+     * The CDK hides it for as long as a dialog is open, which would otherwise
+     * leave nothing to read at all once the dialogs are out of sight.
+     */
+    private exposePageToAssistiveTechnology;
+    /** Hides the page again as soon as a dialog is back on screen. */
+    private hidePageFromAssistiveTechnology;
+    /**
+     * Focus follows the dialogs off the screen: it goes back to whatever opened
+     * the stack, so the page stays usable with the keyboard while the dialogs
+     * wait behind it. Focus that already moved somewhere else is left alone.
+     */
+    private releaseFocus;
     private getFocusedElement;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<DialogService, never>;
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<DialogService>;