@workday/canvas-kit-popup-stack 6.1.2 → 6.2.0

package/README.md

@@ -198,6 +198,47 @@ considered to be "contained" by an element under the following conditions:
 PopupStack.contains(element: HTMLElement, eventTarget: HTMLElement): boolean
 ```
 
+### pushStackContext
+
+```tsx
+PopupStack.pushStackContext(element: HTMLElement): void
+```
+
+Add a new stack context for popups. This method could be called with the same element multiple
+times, but should only push a new stack context once. The most common use-case for calling
+`pushStackContext` is when entering fullscreen, but multiple fullscreen listeners could be pushing
+the same element which is very difficult to ensure only one stack is used. To mitigate, this method
+filters out multiple calls to push the same element as a new stack context.
+
+### popStackContext
+
+```tsx
+PopupStack.popStackContext(element: HTMLElement): void
+```
+
+Remove the topmost stack context. The stack context will only be removed if the top stack
+context container element matches to guard against accidental remove of other stack contexts you
+don't own.
+
+### transferToCurrentContext
+
+```tsx
+PopupStack.transferToCurrentContext(item: PopupStackItem): void
+```
+
+Transfer the popup stack item into the current popup stack context.
+
+An example might be a popup that is opened and an element goes into fullscreen. The default popup
+stack context is `document.body`, but the
+[Fullscreen API](https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API) will only render
+elements that are children of the fullscreen element. If the popup isn't transferred to the current
+popup stack context, the popup will remain open, but will no longer be rendered. This method will
+transfer that popup to the fullscreen element so that it will render. Popups created while in a
+fullscreen context that need to be transferred back when fullscreen is exited should also call this
+method. While popups may still render when fullscreen is exited, popups will be members of different
+popup stack contexts which will cause unspecified results (like the escape key will choose the wrong
+popup as the "topmost").
+
 ### createAdapter
 
 Create an adapter for the PopupStack. Any method provided will override the default method of

package/dist/commonjs/lib/PopupStack.d.ts

@@ -32,6 +32,16 @@ export interface PopupStackItem {
  * popups.
  */
 export declare function getValue(index: number, length: number): number;
+interface Stack {
+    items: PopupStackItem[];
+    container?: () => HTMLElement;
+    zIndex: {
+        min: number;
+        max: number;
+        getValue: typeof getValue;
+    };
+    _adapter: Partial<typeof PopupStack>;
+}
 export declare const PopupStack: {
     /**
      * Create a HTMLElement as the container for the popup stack item. The returned element reference
@@ -48,10 +58,11 @@ export declare const PopupStack: {
      */
     add(item: PopupStackItem): void;
     /**
-     * Removes an item from the stack by its `HTMLElement` reference. This should be called when a
-     * popup is "closed" or when the element is removed from the page entirely to ensure proper memory
-     * cleanup. This will not automatically be called when the element is removed from the DOM. Will
-     * reset z-index values of the stack
+     * Removes an item from a stack by its `HTMLElement` reference. This should be called when a popup
+     * is "closed" or when the element is removed from the page entirely to ensure proper memory
+     * cleanup. A popup will be removed from the stack it is a part of. This will not automatically be
+     * called when the element is removed from the DOM. This method will reset z-index values of the
+     * stack.
      */
     remove(element: HTMLElement): void;
     /**
@@ -65,7 +76,7 @@ export declare const PopupStack: {
      * elements in the order of lowest z-index to highest z-index. Some popup behaviors will need to
      * make decisions based on z-index order.
      */
-    getElements(): HTMLElement[];
+    getElements(stackOverride?: Stack | undefined): HTMLElement[];
     /**
      * Bring the element to the top of the stack. This is useful for persistent popups to place them
      * on top of the stack when clicked. If an `owner` was provided to an item when it was added and
@@ -91,6 +102,36 @@ export declare const PopupStack: {
      * is not inside `element`).
      */
     contains(element: HTMLElement, eventTarget: HTMLElement): boolean;
+    /**
+     * Add a new stack context for popups. This method could be called with the same element multiple
+     * times, but should only push a new stack context once. The most common use-case for calling
+     * `pushStackContext` is when entering fullscreen, but multiple fullscreen listeners could be
+     * pushing the same element which is very difficult to ensure only one stack is used. To mitigate,
+     * this method filters out multiple calls to push the same element as a new stack context.
+     */
+    pushStackContext(container: HTMLElement): void;
+    /**
+     * Remove the topmost stack context. The stack context will only be removed if the top stack
+     * context container element matches to guard against accidental remove of other stack contexts
+     * you don't own.
+     */
+    popStackContext(container: HTMLElement): void;
+    /**
+     * Transfer the popup stack item into the current popup stack context.
+     *
+     * An example might be a popup
+     * that is opened and an element goes into fullscreen. The default popup stack context is
+     * `document.body`, but the [Fullscreen
+     * API](https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API) will only render elements
+     * that are children of the fullscreen element. If the popup isn't transferred to the current
+     * popup stack context, the popup will remain open, but will no longer be rendered. This method
+     * will transfer that popup to the fullscreen element so that it will render. Popups created while
+     * in a fullscreen context that need to be transferred back when fullscreen is exited should also
+     * call this method. While popups may still render when fullscreen is exited, popups will be
+     * members of different popup stack contexts which will cause unspecified results (like the escape
+     * key will choose the wrong popup as the "topmost").
+     */
+    transferToCurrentContext(item: PopupStackItem): void;
 };
 /**
  * Reset all the items in the stack. This should only be used for testing or if the page doesn't
@@ -117,10 +158,11 @@ export declare const createAdapter: (adapter: Partial<{
      */
     add(item: PopupStackItem): void;
     /**
-     * Removes an item from the stack by its `HTMLElement` reference. This should be called when a
-     * popup is "closed" or when the element is removed from the page entirely to ensure proper memory
-     * cleanup. This will not automatically be called when the element is removed from the DOM. Will
-     * reset z-index values of the stack
+     * Removes an item from a stack by its `HTMLElement` reference. This should be called when a popup
+     * is "closed" or when the element is removed from the page entirely to ensure proper memory
+     * cleanup. A popup will be removed from the stack it is a part of. This will not automatically be
+     * called when the element is removed from the DOM. This method will reset z-index values of the
+     * stack.
      */
     remove(element: HTMLElement): void;
     /**
@@ -134,7 +176,7 @@ export declare const createAdapter: (adapter: Partial<{
      * elements in the order of lowest z-index to highest z-index. Some popup behaviors will need to
      * make decisions based on z-index order.
      */
-    getElements(): HTMLElement[];
+    getElements(stackOverride?: Stack | undefined): HTMLElement[];
     /**
      * Bring the element to the top of the stack. This is useful for persistent popups to place them
      * on top of the stack when clicked. If an `owner` was provided to an item when it was added and
@@ -160,5 +202,36 @@ export declare const createAdapter: (adapter: Partial<{
      * is not inside `element`).
      */
     contains(element: HTMLElement, eventTarget: HTMLElement): boolean;
+    /**
+     * Add a new stack context for popups. This method could be called with the same element multiple
+     * times, but should only push a new stack context once. The most common use-case for calling
+     * `pushStackContext` is when entering fullscreen, but multiple fullscreen listeners could be
+     * pushing the same element which is very difficult to ensure only one stack is used. To mitigate,
+     * this method filters out multiple calls to push the same element as a new stack context.
+     */
+    pushStackContext(container: HTMLElement): void;
+    /**
+     * Remove the topmost stack context. The stack context will only be removed if the top stack
+     * context container element matches to guard against accidental remove of other stack contexts
+     * you don't own.
+     */
+    popStackContext(container: HTMLElement): void;
+    /**
+     * Transfer the popup stack item into the current popup stack context.
+     *
+     * An example might be a popup
+     * that is opened and an element goes into fullscreen. The default popup stack context is
+     * `document.body`, but the [Fullscreen
+     * API](https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API) will only render elements
+     * that are children of the fullscreen element. If the popup isn't transferred to the current
+     * popup stack context, the popup will remain open, but will no longer be rendered. This method
+     * will transfer that popup to the fullscreen element so that it will render. Popups created while
+     * in a fullscreen context that need to be transferred back when fullscreen is exited should also
+     * call this method. While popups may still render when fullscreen is exited, popups will be
+     * members of different popup stack contexts which will cause unspecified results (like the escape
+     * key will choose the wrong popup as the "topmost").
+     */
+    transferToCurrentContext(item: PopupStackItem): void;
 }>) => void;
+export {};
 //# sourceMappingURL=PopupStack.d.ts.map

package/dist/commonjs/lib/PopupStack.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PopupStack.d.ts","sourceRoot":"","sources":["../../../lib/PopupStack.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B;;;OAGG;IACH,OAAO,EAAE,WAAW,CAAC;IACrB;;;;;;;;;;;;;;;OAeG;IACH,KAAK,CAAC,EAAE,WAAW,CAAC;CACrB;AASD;;;;;GAKG;AACH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,CAO9D;AAgJD,eAAO,MAAM,UAAU;IACrB;;;;;OAKG;;IASH;;;;;OAKG;;IAYH;;;;;OAKG;;IAYH;;;;OAIG;;IAaH;;;;OAIG;;IAQH;;;;;;;;;;;OAWG;;IA6BH;;;;;;;;;;OAUG;;CA0BJ,CAAC;AAEF;;;GAGG;AACH,wBAAgB,UAAU,SAEzB;AAED;;;GAGG;AACH,eAAO,MAAM,aAAa;IAvKxB;;;;;OAKG;;IASH;;;;;OAKG;;IAYH;;;;;OAKG;;IAYH;;;;OAIG;;IAaH;;;;OAIG;;IAQH;;;;;;;;;;;OAWG;;IA6BH;;;;;;;;;;OAUG;;WA0CJ,CAAC"}
+{"version":3,"file":"PopupStack.d.ts","sourceRoot":"","sources":["../../../lib/PopupStack.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B;;;OAGG;IACH,OAAO,EAAE,WAAW,CAAC;IACrB;;;;;;;;;;;;;;;OAeG;IACH,KAAK,CAAC,EAAE,WAAW,CAAC;CACrB;AASD;;;;;GAKG;AACH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,CAO9D;AA0DD,UAAU,KAAK;IACb,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,WAAW,CAAC;IAC9B,MAAM,EAAE;QACN,GAAG,EAAE,MAAM,CAAC;QACZ,GAAG,EAAE,MAAM,CAAC;QACZ,QAAQ,EAAE,OAAO,QAAQ,CAAC;KAC3B,CAAC;IACF,QAAQ,EAAE,OAAO,CAAC,OAAO,UAAU,CAAC,CAAC;CACtC;AAwFD,eAAO,MAAM,UAAU;IACrB;;;;;OAKG;;IAUH;;;;;OAKG;;IAaH;;;;;;OAMG;;IAgBH;;;;OAIG;;IAcH;;;;OAIG;;IASH;;;;;;;;;;;OAWG;;IA8BH;;;;;;;;;;OAUG;;IA4BH;;;;;;OAMG;;IAqBH;;;;OAIG;;IAaH;;;;;;;;;;;;;;OAcG;;CAsBJ,CAAC;AAEF;;;GAGG;AACH,wBAAgB,UAAU,SAEzB;AAED;;;GAGG;AACH,eAAO,MAAM,aAAa;IAnQxB;;;;;OAKG;;IAUH;;;;;OAKG;;IAaH;;;;;;OAMG;;IAgBH;;;;OAIG;;IAcH;;;;OAIG;;IASH;;;;;;;;;;;OAWG;;IA8BH;;;;;;;;;;OAUG;;IA4BH;;;;;;OAMG;;IAqBH;;;;OAIG;;IAaH;;;;;;;;;;;;;;OAcG;;WAsCJ,CAAC"}

package/dist/commonjs/lib/PopupStack.js

@@ -6,7 +6,11 @@ var __spreadArrays = (this && this.__spreadArrays) || function () {
             r[k] = a[j];
     return r;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
+var screenfull_1 = __importDefault(require("screenfull"));
 function getLast(items) {
     if (items.length) {
         return items[items.length - 1];
@@ -139,12 +143,19 @@ var setToWindow = function (path, value) {
 // defined on the page, we need to use that one. Never, ever, ever change this variable name on
 // window
 var stack = getFromWindow('workday.__popupStack') || {
-    description: 'Global popup stack from @workday/canvas-kit-popup-stack',
+    description: 'Global popup stack from @workday/canvas-kit/popup-stack',
+    container: function () { return document.body; },
     items: [],
     zIndex: { min: 30, max: 50, getValue: getValue },
     _adapter: {},
 };
 setToWindow('workday.__popupStack', stack);
+var stacks = getFromWindow('workday.__popupStackOfStacks') || [stack];
+stacks.description = 'Global stack of popup stacks from @workday/canvas-kit/popup-stack';
+setToWindow('workday.__popupStackOfStacks', stacks);
+function getTopStack() {
+    return stacks[stacks.length - 1];
+}
 exports.PopupStack = {
     /**
      * Create a HTMLElement as the container for the popup stack item. The returned element reference
@@ -154,6 +165,7 @@ exports.PopupStack = {
      */
     createContainer: function () {
         var _a;
+        var stack = getTopStack();
         if ((_a = stack._adapter) === null || _a === void 0 ? void 0 : _a.createContainer) {
             return stack._adapter.createContainer();
         }
@@ -168,30 +180,36 @@ exports.PopupStack = {
      * method when the event triggers.
      */
     add: function (item) {
-        var _a;
+        var _a, _b;
+        var stack = getTopStack();
         if ((_a = stack._adapter) === null || _a === void 0 ? void 0 : _a.add) {
             stack._adapter.add(item);
             return;
         }
         stack.items.push(item);
-        document.body.appendChild(item.element);
+        (((_b = stack.container) === null || _b === void 0 ? void 0 : _b.call(stack)) || document.body).appendChild(item.element);
         setZIndexOfElements(exports.PopupStack.getElements());
     },
     /**
-     * Removes an item from the stack by its `HTMLElement` reference. This should be called when a
-     * popup is "closed" or when the element is removed from the page entirely to ensure proper memory
-     * cleanup. This will not automatically be called when the element is removed from the DOM. Will
-     * reset z-index values of the stack
+     * Removes an item from a stack by its `HTMLElement` reference. This should be called when a popup
+     * is "closed" or when the element is removed from the page entirely to ensure proper memory
+     * cleanup. A popup will be removed from the stack it is a part of. This will not automatically be
+     * called when the element is removed from the DOM. This method will reset z-index values of the
+     * stack.
      */
     remove: function (element) {
-        var _a;
-        if ((_a = stack._adapter) === null || _a === void 0 ? void 0 : _a.remove) {
-            stack._adapter.remove(element);
-            return;
+        var _a, _b;
+        // Find the stack the popup belongs to.
+        var stack = find(stacks, function (stack) { return !!find(stack.items, function (item) { return item.element === element; }); });
+        if (stack) {
+            if ((_a = stack._adapter) === null || _a === void 0 ? void 0 : _a.remove) {
+                stack._adapter.remove(element);
+                return;
+            }
+            stack.items = stack.items.filter(function (item) { return item.element !== element; });
+            (((_b = stack.container) === null || _b === void 0 ? void 0 : _b.call(stack)) || document.body).removeChild(element);
+            setZIndexOfElements(exports.PopupStack.getElements(stack));
         }
-        stack.items = stack.items.filter(function (item) { return item.element !== element; });
-        document.body.removeChild(element);
-        setZIndexOfElements(exports.PopupStack.getElements());
     },
     /**
      * Returns true when the provided `element` is at the top of the stack. It will return false if it
@@ -200,6 +218,7 @@ exports.PopupStack = {
      */
     isTopmost: function (element) {
         var _a;
+        var stack = getTopStack();
         if ((_a = stack._adapter) === null || _a === void 0 ? void 0 : _a.isTopmost) {
             return stack._adapter.isTopmost(element);
         }
@@ -214,8 +233,9 @@ exports.PopupStack = {
      * elements in the order of lowest z-index to highest z-index. Some popup behaviors will need to
      * make decisions based on z-index order.
      */
-    getElements: function () {
+    getElements: function (stackOverride) {
         var _a;
+        var stack = stackOverride || getTopStack();
         if ((_a = stack._adapter) === null || _a === void 0 ? void 0 : _a.getElements) {
             return stack._adapter.getElements();
         }
@@ -235,6 +255,7 @@ exports.PopupStack = {
      */
     bringToTop: function (element) {
         var _a;
+        var stack = getTopStack();
         if ((_a = stack._adapter) === null || _a === void 0 ? void 0 : _a.bringToTop) {
             stack._adapter.bringToTop(element);
             return;
@@ -272,6 +293,7 @@ exports.PopupStack = {
      */
     contains: function (element, eventTarget) {
         var _a, _b;
+        var stack = getTopStack();
         if ((_a = stack._adapter) === null || _a === void 0 ? void 0 : _a.contains) {
             return stack._adapter.contains(element, eventTarget);
         }
@@ -289,6 +311,79 @@ exports.PopupStack = {
         }
         return false;
     },
+    /**
+     * Add a new stack context for popups. This method could be called with the same element multiple
+     * times, but should only push a new stack context once. The most common use-case for calling
+     * `pushStackContext` is when entering fullscreen, but multiple fullscreen listeners could be
+     * pushing the same element which is very difficult to ensure only one stack is used. To mitigate,
+     * this method filters out multiple calls to push the same element as a new stack context.
+     */
+    pushStackContext: function (container) {
+        var _a, _b;
+        var stack = getTopStack();
+        if ((_a = stack._adapter) === null || _a === void 0 ? void 0 : _a.pushStackContext) {
+            return stack._adapter.pushStackContext(container);
+        }
+        // Don't push if the container already exists. This removes duplicates
+        if (((_b = stack.container) === null || _b === void 0 ? void 0 : _b.call(stack)) === container) {
+            return;
+        }
+        var newStack = {
+            items: [],
+            zIndex: stack.zIndex,
+            container: function () { return container; },
+            _adapter: {},
+        };
+        stacks.push(newStack);
+    },
+    /**
+     * Remove the topmost stack context. The stack context will only be removed if the top stack
+     * context container element matches to guard against accidental remove of other stack contexts
+     * you don't own.
+     */
+    popStackContext: function (container) {
+        var _a, _b;
+        var stack = getTopStack();
+        if ((_a = stack._adapter) === null || _a === void 0 ? void 0 : _a.popStackContext) {
+            return stack._adapter.popStackContext(container);
+        }
+        if (((_b = stack.container) === null || _b === void 0 ? void 0 : _b.call(stack)) === container && stacks.length > 1) {
+            stacks.pop();
+        }
+    },
+    /**
+     * Transfer the popup stack item into the current popup stack context.
+     *
+     * An example might be a popup
+     * that is opened and an element goes into fullscreen. The default popup stack context is
+     * `document.body`, but the [Fullscreen
+     * API](https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API) will only render elements
+     * that are children of the fullscreen element. If the popup isn't transferred to the current
+     * popup stack context, the popup will remain open, but will no longer be rendered. This method
+     * will transfer that popup to the fullscreen element so that it will render. Popups created while
+     * in a fullscreen context that need to be transferred back when fullscreen is exited should also
+     * call this method. While popups may still render when fullscreen is exited, popups will be
+     * members of different popup stack contexts which will cause unspecified results (like the escape
+     * key will choose the wrong popup as the "topmost").
+     */
+    transferToCurrentContext: function (item) {
+        var _a;
+        var stack = getTopStack();
+        if ((_a = stack._adapter) === null || _a === void 0 ? void 0 : _a.transferToCurrentContext) {
+            return stack._adapter.transferToCurrentContext(item);
+        }
+        if (find(stack.items, function (i) { return i.element === item.element; })) {
+            // The element is already in the stack, don't do anything
+            return;
+        }
+        // Try to find the element in existing stacks. If it exists, we need to first remove from that
+        // stack context
+        var oldStack = find(stacks, function (stack) { return !!find(stack.items, function (i) { return i.element === item.element; }); });
+        if (oldStack) {
+            exports.PopupStack.remove(item.element);
+        }
+        exports.PopupStack.add(item);
+    },
 };
 /**
  * Reset all the items in the stack. This should only be used for testing or if the page doesn't
@@ -305,3 +400,22 @@ exports.resetStack = resetStack;
 exports.createAdapter = function (adapter) {
     stack._adapter = adapter;
 };
+// keep track of the element ourselves to avoid accidentally popping off someone else's stack
+// context
+var element = null;
+// Where should this go? Each version of `PopupStack` on a page will add a listener. The
+// `PopupStack` should guard against multiple handlers like this simultaneously and there is no
+// lifecycle here.
+if (screenfull_1.default.isEnabled) {
+    screenfull_1.default.on('change', function () {
+        if (screenfull_1.default.isFullscreen) {
+            if (screenfull_1.default.element) {
+                element = screenfull_1.default.element;
+                exports.PopupStack.pushStackContext(element);
+            }
+        }
+        else if (element) {
+            exports.PopupStack.popStackContext(element);
+        }
+    });
+}

package/dist/es6/lib/PopupStack.d.ts

@@ -32,6 +32,16 @@ export interface PopupStackItem {
  * popups.
  */
 export declare function getValue(index: number, length: number): number;
+interface Stack {
+    items: PopupStackItem[];
+    container?: () => HTMLElement;
+    zIndex: {
+        min: number;
+        max: number;
+        getValue: typeof getValue;
+    };
+    _adapter: Partial<typeof PopupStack>;
+}
 export declare const PopupStack: {
     /**
      * Create a HTMLElement as the container for the popup stack item. The returned element reference
@@ -48,10 +58,11 @@ export declare const PopupStack: {
      */
     add(item: PopupStackItem): void;
     /**
-     * Removes an item from the stack by its `HTMLElement` reference. This should be called when a
-     * popup is "closed" or when the element is removed from the page entirely to ensure proper memory
-     * cleanup. This will not automatically be called when the element is removed from the DOM. Will
-     * reset z-index values of the stack
+     * Removes an item from a stack by its `HTMLElement` reference. This should be called when a popup
+     * is "closed" or when the element is removed from the page entirely to ensure proper memory
+     * cleanup. A popup will be removed from the stack it is a part of. This will not automatically be
+     * called when the element is removed from the DOM. This method will reset z-index values of the
+     * stack.
      */
     remove(element: HTMLElement): void;
     /**
@@ -65,7 +76,7 @@ export declare const PopupStack: {
      * elements in the order of lowest z-index to highest z-index. Some popup behaviors will need to
      * make decisions based on z-index order.
      */
-    getElements(): HTMLElement[];
+    getElements(stackOverride?: Stack | undefined): HTMLElement[];
     /**
      * Bring the element to the top of the stack. This is useful for persistent popups to place them
      * on top of the stack when clicked. If an `owner` was provided to an item when it was added and
@@ -91,6 +102,36 @@ export declare const PopupStack: {
      * is not inside `element`).
      */
     contains(element: HTMLElement, eventTarget: HTMLElement): boolean;
+    /**
+     * Add a new stack context for popups. This method could be called with the same element multiple
+     * times, but should only push a new stack context once. The most common use-case for calling
+     * `pushStackContext` is when entering fullscreen, but multiple fullscreen listeners could be
+     * pushing the same element which is very difficult to ensure only one stack is used. To mitigate,
+     * this method filters out multiple calls to push the same element as a new stack context.
+     */
+    pushStackContext(container: HTMLElement): void;
+    /**
+     * Remove the topmost stack context. The stack context will only be removed if the top stack
+     * context container element matches to guard against accidental remove of other stack contexts
+     * you don't own.
+     */
+    popStackContext(container: HTMLElement): void;
+    /**
+     * Transfer the popup stack item into the current popup stack context.
+     *
+     * An example might be a popup
+     * that is opened and an element goes into fullscreen. The default popup stack context is
+     * `document.body`, but the [Fullscreen
+     * API](https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API) will only render elements
+     * that are children of the fullscreen element. If the popup isn't transferred to the current
+     * popup stack context, the popup will remain open, but will no longer be rendered. This method
+     * will transfer that popup to the fullscreen element so that it will render. Popups created while
+     * in a fullscreen context that need to be transferred back when fullscreen is exited should also
+     * call this method. While popups may still render when fullscreen is exited, popups will be
+     * members of different popup stack contexts which will cause unspecified results (like the escape
+     * key will choose the wrong popup as the "topmost").
+     */
+    transferToCurrentContext(item: PopupStackItem): void;
 };
 /**
  * Reset all the items in the stack. This should only be used for testing or if the page doesn't
@@ -117,10 +158,11 @@ export declare const createAdapter: (adapter: Partial<{
      */
     add(item: PopupStackItem): void;
     /**
-     * Removes an item from the stack by its `HTMLElement` reference. This should be called when a
-     * popup is "closed" or when the element is removed from the page entirely to ensure proper memory
-     * cleanup. This will not automatically be called when the element is removed from the DOM. Will
-     * reset z-index values of the stack
+     * Removes an item from a stack by its `HTMLElement` reference. This should be called when a popup
+     * is "closed" or when the element is removed from the page entirely to ensure proper memory
+     * cleanup. A popup will be removed from the stack it is a part of. This will not automatically be
+     * called when the element is removed from the DOM. This method will reset z-index values of the
+     * stack.
      */
     remove(element: HTMLElement): void;
     /**
@@ -134,7 +176,7 @@ export declare const createAdapter: (adapter: Partial<{
      * elements in the order of lowest z-index to highest z-index. Some popup behaviors will need to
      * make decisions based on z-index order.
      */
-    getElements(): HTMLElement[];
+    getElements(stackOverride?: Stack | undefined): HTMLElement[];
     /**
      * Bring the element to the top of the stack. This is useful for persistent popups to place them
      * on top of the stack when clicked. If an `owner` was provided to an item when it was added and
@@ -160,5 +202,36 @@ export declare const createAdapter: (adapter: Partial<{
      * is not inside `element`).
      */
     contains(element: HTMLElement, eventTarget: HTMLElement): boolean;
+    /**
+     * Add a new stack context for popups. This method could be called with the same element multiple
+     * times, but should only push a new stack context once. The most common use-case for calling
+     * `pushStackContext` is when entering fullscreen, but multiple fullscreen listeners could be
+     * pushing the same element which is very difficult to ensure only one stack is used. To mitigate,
+     * this method filters out multiple calls to push the same element as a new stack context.
+     */
+    pushStackContext(container: HTMLElement): void;
+    /**
+     * Remove the topmost stack context. The stack context will only be removed if the top stack
+     * context container element matches to guard against accidental remove of other stack contexts
+     * you don't own.
+     */
+    popStackContext(container: HTMLElement): void;
+    /**
+     * Transfer the popup stack item into the current popup stack context.
+     *
+     * An example might be a popup
+     * that is opened and an element goes into fullscreen. The default popup stack context is
+     * `document.body`, but the [Fullscreen
+     * API](https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API) will only render elements
+     * that are children of the fullscreen element. If the popup isn't transferred to the current
+     * popup stack context, the popup will remain open, but will no longer be rendered. This method
+     * will transfer that popup to the fullscreen element so that it will render. Popups created while
+     * in a fullscreen context that need to be transferred back when fullscreen is exited should also
+     * call this method. While popups may still render when fullscreen is exited, popups will be
+     * members of different popup stack contexts which will cause unspecified results (like the escape
+     * key will choose the wrong popup as the "topmost").
+     */
+    transferToCurrentContext(item: PopupStackItem): void;
 }>) => void;
+export {};
 //# sourceMappingURL=PopupStack.d.ts.map

package/dist/es6/lib/PopupStack.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PopupStack.d.ts","sourceRoot":"","sources":["../../../lib/PopupStack.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B;;;OAGG;IACH,OAAO,EAAE,WAAW,CAAC;IACrB;;;;;;;;;;;;;;;OAeG;IACH,KAAK,CAAC,EAAE,WAAW,CAAC;CACrB;AASD;;;;;GAKG;AACH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,CAO9D;AAgJD,eAAO,MAAM,UAAU;IACrB;;;;;OAKG;;IASH;;;;;OAKG;;IAYH;;;;;OAKG;;IAYH;;;;OAIG;;IAaH;;;;OAIG;;IAQH;;;;;;;;;;;OAWG;;IA6BH;;;;;;;;;;OAUG;;CA0BJ,CAAC;AAEF;;;GAGG;AACH,wBAAgB,UAAU,SAEzB;AAED;;;GAGG;AACH,eAAO,MAAM,aAAa;IAvKxB;;;;;OAKG;;IASH;;;;;OAKG;;IAYH;;;;;OAKG;;IAYH;;;;OAIG;;IAaH;;;;OAIG;;IAQH;;;;;;;;;;;OAWG;;IA6BH;;;;;;;;;;OAUG;;WA0CJ,CAAC"}
+{"version":3,"file":"PopupStack.d.ts","sourceRoot":"","sources":["../../../lib/PopupStack.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B;;;OAGG;IACH,OAAO,EAAE,WAAW,CAAC;IACrB;;;;;;;;;;;;;;;OAeG;IACH,KAAK,CAAC,EAAE,WAAW,CAAC;CACrB;AASD;;;;;GAKG;AACH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,CAO9D;AA0DD,UAAU,KAAK;IACb,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,WAAW,CAAC;IAC9B,MAAM,EAAE;QACN,GAAG,EAAE,MAAM,CAAC;QACZ,GAAG,EAAE,MAAM,CAAC;QACZ,QAAQ,EAAE,OAAO,QAAQ,CAAC;KAC3B,CAAC;IACF,QAAQ,EAAE,OAAO,CAAC,OAAO,UAAU,CAAC,CAAC;CACtC;AAwFD,eAAO,MAAM,UAAU;IACrB;;;;;OAKG;;IAUH;;;;;OAKG;;IAaH;;;;;;OAMG;;IAgBH;;;;OAIG;;IAcH;;;;OAIG;;IASH;;;;;;;;;;;OAWG;;IA8BH;;;;;;;;;;OAUG;;IA4BH;;;;;;OAMG;;IAqBH;;;;OAIG;;IAaH;;;;;;;;;;;;;;OAcG;;CAsBJ,CAAC;AAEF;;;GAGG;AACH,wBAAgB,UAAU,SAEzB;AAED;;;GAGG;AACH,eAAO,MAAM,aAAa;IAnQxB;;;;;OAKG;;IAUH;;;;;OAKG;;IAaH;;;;;;OAMG;;IAgBH;;;;OAIG;;IAcH;;;;OAIG;;IASH;;;;;;;;;;;OAWG;;IA8BH;;;;;;;;;;OAUG;;IA4BH;;;;;;OAMG;;IAqBH;;;;OAIG;;IAaH;;;;;;;;;;;;;;OAcG;;WAsCJ,CAAC"}