@genesislcap/foundation-layout 14.393.2 → 14.393.3-FUI-2471.1

package/dist/custom-elements.json

@@ -143,6 +143,22 @@
             "module": "./utils"
           }
         },
+        {
+          "kind": "js",
+          "name": "LAYOUT_POPOUT_CONTROL_KEY",
+          "declaration": {
+            "name": "LAYOUT_POPOUT_CONTROL_KEY",
+            "module": "./utils"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "LayoutPopoutConfig",
+          "declaration": {
+            "name": "LayoutPopoutConfig",
+            "module": "./utils"
+          }
+        },
         {
           "kind": "js",
           "name": "registerFactory",
@@ -600,10 +616,10 @@
               "kind": "field",
               "name": "popoutConfig",
               "type": {
-                "text": "string | undefined"
+                "text": "LayoutPopoutConfig | undefined"
               },
               "default": "undefined",
-              "description": "Controls whether popout functionality is enabled on the layout. Defaults to disabled.\nSet this attribute to any string to enable popout functionality. If this string is of format `number;number` then this will be interpreted as the width and height of the popout window."
+              "description": "Controls whether popout functionality is enabled on the layout. Defaults to disabled.\nPass an empty object `{}` to use default configurations, or a LayoutPopoutConfig object to further customise."
             },
             {
               "kind": "field",
@@ -663,6 +679,16 @@
                   "text": "boolean"
                 }
               },
+              "parameters": [
+                {
+                  "name": "autoloading",
+                  "default": "false",
+                  "type": {
+                    "text": "boolean"
+                  },
+                  "description": "If true, this respects the {@link LayoutPopoutConfig.loadAutomatically}property.\n   * You might want to set this to false and call it manually if you're manually registering components to the layout in order to avoid race conditions.\n   * "
+                }
+              ],
               "description": "If in a popout window from the dynamic layout, this function will run the flow to put the component in popout mode.\nThis function is automatically called if using the declarative HTML API, but if only using the JavaScript API then you will need to call this function manually."
             },
             {
@@ -966,18 +992,6 @@
               },
               "description": "Attribute which if set will auto save and load the layout as the user changes it.\nOmit this attribute to disable this feature.\nSet attribute using `auto-save-key`.",
               "fieldName": "autoSaveKey"
-            },
-            {
-              "name": "popout-config",
-              "type": {
-                "text": "string | undefined"
-              },
-              "default": "undefined",
-              "description": "Controls whether popout functionality is enabled on the layout. Defaults to disabled.\nSet this attribute to any string to enable popout functionality. If this string is of format `number;number` then this will be interpreted as the width and height of the popout window.",
-              "resolveInitializer": {
-                "module": "src/main/layout-main.ts"
-              },
-              "fieldName": "popoutConfig"
             }
           ],
           "superclass": {
@@ -1336,6 +1350,15 @@
           "description": "Default time in milliseconds for the layout to buffer calls to reloading\nthe layout while the declarative API is loading.\n\nDuring the first load of the layout, a loading spinner will be shown.",
           "privacy": "public"
         },
+        {
+          "kind": "variable",
+          "name": "LAYOUT_POPOUT_CONTROL_KEY",
+          "type": {
+            "text": "string"
+          },
+          "default": "'f-layout-key'",
+          "description": "Key to be used for controlling popout behaviour"
+        },
         {
           "kind": "variable",
           "name": "LAYOUT_POPOUT_CONTAINER_CLASS",
@@ -1367,6 +1390,14 @@
             "module": "src/utils/constants.ts"
           }
         },
+        {
+          "kind": "js",
+          "name": "LAYOUT_POPOUT_CONTROL_KEY",
+          "declaration": {
+            "name": "LAYOUT_POPOUT_CONTROL_KEY",
+            "module": "src/utils/constants.ts"
+          }
+        },
         {
           "kind": "js",
           "name": "LAYOUT_POPOUT_CONTAINER_CLASS",

package/dist/dts/index.d.ts

@@ -1,5 +1,5 @@
 export * from './main';
 export { LAYOUT_ICONS } from './styles';
-export { ComponentFactory, CustomButton, DEFAULT_RELOAD_BUFFER, LayoutComponentWithState, LayoutEmitEvents, LayoutReceiveEvents, LayoutReceiveEventsDetail, LayoutRegionType, LayoutRegistrationError, LayoutUsageError, Placement, RegisteredElementConfig, RegistrationConfig, SerialisedLayout, LAYOUT_POPOUT_CONTAINER_CLASS, } from './utils';
+export { ComponentFactory, CustomButton, DEFAULT_RELOAD_BUFFER, LayoutComponentWithState, LayoutEmitEvents, LayoutReceiveEvents, LayoutReceiveEventsDetail, LayoutRegionType, LayoutRegistrationError, LayoutUsageError, Placement, RegisteredElementConfig, RegistrationConfig, SerialisedLayout, LAYOUT_POPOUT_CONTAINER_CLASS, LAYOUT_POPOUT_CONTROL_KEY, LayoutPopoutConfig, } from './utils';
 export { registerFactory, getFactory, unregisterFactory } from './utils/factory-registry';
 //# sourceMappingURL=index.d.ts.map

package/dist/dts/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACxC,OAAO,EACL,gBAAgB,EAChB,YAAY,EACZ,qBAAqB,EACrB,wBAAwB,EACxB,gBAAgB,EAChB,mBAAmB,EACnB,yBAAyB,EACzB,gBAAgB,EAChB,uBAAuB,EACvB,gBAAgB,EAChB,SAAS,EACT,uBAAuB,EACvB,kBAAkB,EAClB,gBAAgB,EAChB,6BAA6B,GAC9B,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACxC,OAAO,EACL,gBAAgB,EAChB,YAAY,EACZ,qBAAqB,EACrB,wBAAwB,EACxB,gBAAgB,EAChB,mBAAmB,EACnB,yBAAyB,EACzB,gBAAgB,EAChB,uBAAuB,EACvB,gBAAgB,EAChB,SAAS,EACT,uBAAuB,EACvB,kBAAkB,EAClB,gBAAgB,EAChB,6BAA6B,EAC7B,yBAAyB,EACzB,kBAAkB,GACnB,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC"}

package/dist/dts/main/layout-main.d.ts

@@ -1,6 +1,6 @@
 import { LayoutConfig, RootItemConfig } from '@genesis-community/golden-layout';
 import { FoundationElement } from '@microsoft/fast-foundation';
-import { ComponentFactory, componentType, CustomButton, LayoutComponent, Placement, RegisteredElementConfig, RegistrationConfig, SerialisedLayout } from '../utils/';
+import { ComponentFactory, componentType, CustomButton, LayoutComponent, LayoutPopoutConfig, Placement, RegisteredElementConfig, RegistrationConfig, SerialisedLayout } from '../utils/';
 export { layoutStyles } from '../styles';
 /**
  * @public
@@ -97,10 +97,10 @@ export declare class FoundationLayout extends FoundationElement implements Layou
     lifecycleUpdateToken: string | undefined;
     /**
      * Controls whether popout functionality is enabled on the layout. Defaults to disabled.
-     * Set this attribute to any string to enable popout functionality. If this string is of format `number;number` then this will be interpreted as the width and height of the popout window.
+     * Pass an empty object `{}` to use default configurations, or a {@link LayoutPopoutConfig} object to further customise.
      * @beta
      */
-    popoutConfig: string | undefined;
+    popoutConfig: LayoutPopoutConfig | undefined;
     private popupMode;
     /** @internal */
     constructor();
@@ -172,9 +172,12 @@ export declare class FoundationLayout extends FoundationElement implements Layou
      * If you set the `LAYOUT_POPOUT_CONTAINER_CLASS` on an element which is a DOM parent of the layout,
      * then if the layout goes into popout mode then it will place itself as the only child for the popout container you set.
      * It is likely you'll want to attach this class to your design system provider.
+     *
+     * @param autoloading - If true, this respects the {@link LayoutPopoutConfig.loadAutomatically} property.
+     * You might want to set this to false and call it manually if you're manually registering components to the layout in order to avoid race conditions.
      * @beta
      */
-    tryActivatePopoutMode(): boolean;
+    tryActivatePopoutMode(autoloading?: boolean): boolean;
     /**
      * Try to load a layout from local storage, or return false. Only required if manually calling {@link FoundationLayout.registerItem}
      * @remarks

package/dist/dts/main/layout-main.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"layout-main.d.ts","sourceRoot":"","sources":["../../../src/main/layout-main.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"layout-main.d.ts","sourceRoot":"","sources":["../../../src/main/layout-main.ts"],"names":[],"mappings":"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"}

package/dist/dts/utils/constants.d.ts

@@ -23,7 +23,7 @@ export declare const DEFAULT_RELOAD_BUFFER = 500;
 export declare const AUTOSAVE_KEY = "foundation-layout-autosave";
 /**
  * Key to be used for controlling popout behaviour
- * @internal
+ * @beta
  */
 export declare const LAYOUT_POPOUT_CONTROL_KEY = "f-layout-key";
 /**

package/dist/dts/utils/types.d.ts

@@ -200,4 +200,12 @@ export interface LayoutComponent {
 export type AutosavedLayouts = {
     [x: string]: string;
 };
+/** @beta */
+export type LayoutPopoutConfig = {
+    loadAutomatically?: boolean;
+    popoutDimension?: {
+        width: number;
+        height: number;
+    };
+};
 //# sourceMappingURL=types.d.ts.map

package/dist/dts/utils/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/utils/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/utils/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,MAAM,kCAAkC,CAAC;AAC5F,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAE/D;;;;;;GAMG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,EAAE,CAAC,MAAM,EAAE,WAAW,EAAE,OAAO,EAAE,WAAW,KAAK,IAAI,CAAC;CAC9D,CAAC;AAEF;;;;;;;;;;GAUG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B,CAAC,EAAE,GAAG,CAAC;IACP,CAAC,EAAE,oBAAoB,CAAC;CACzB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAoDK;AACL,MAAM,WAAW,wBAAwB,CAAC,CAAC;IACzC;;OAEG;IACH,eAAe,IAAI,CAAC,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,KAAK,EAAE,CAAC,GAAG,IAAI,GAAG,IAAI,CAAC;CACnC;AAED;;;;;;;;;;GAUG;AACH,MAAM,WAAW,uBAAuB;IACtC,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED;;;;;;;;;GASG;AACH,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,EAAE,KAAK,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC1C,QAAQ,CAAC,EAAE;QACT,IAAI,EAAE,gBAAgB,CAAC;QACvB,IAAI,CAAC,EAAE,MAAM,CAAC;KACf,CAAC;CACH,CAAC;AAEF,gBAAgB;AAChB,MAAM,MAAM,iBAAiB,GAAG;IAC9B,SAAS,EAAE,kBAAkB,CAAC;IAC9B,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,gBAAgB;AAChB,MAAM,MAAM,mBAAmB,CAAC,CAAC,IAAI,OAAO,GAC1C,OAAO,CAAC,wBAAwB,CAAC,CAAC,CAAC,CAAC,GAAG;IACrC,CAAC,iBAAiB,CAAC,CAAC,EAAE,iBAAiB,CAAC;CACzC,CAAC;AAEJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,MAAM,MAAM,gBAAgB,GAAG,CAAC,SAAS,EAAE,WAAW,KAAK,IAAI,GAAG,CAAC,MAAM,IAAI,CAAC,CAAC;AAE/E,gBAAgB;AAChB,MAAM,MAAM,kBAAkB,GAAG;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAC;CACb,GAAG,CACA;IACE,QAAQ,EAAE,OAAO,EAAE,CAAC;CACrB,GACD;IACE,OAAO,EAAE,gBAAgB,CAAC;CAC3B,CACJ,CAAC;AAEF,gBAAgB;AAChB,eAAO,MAAM,iBAAiB,6CAA8C,CAAC;AAC7E;;;;GAIG;AACH,MAAM,MAAM,gBAAgB,GAAG,CAAC,OAAO,iBAAiB,CAAC,CAAC,MAAM,CAAC,CAAC;AAClE,gBAAgB;AAChB,MAAM,MAAM,cAAc,GAAG,gBAAgB,GAAG,MAAM,GAAG,MAAM,CAAC;AAEhE,gBAAgB;AAChB,MAAM,WAAW,eAAe;IAC9B,CAAC,aAAa,CAAC,EAAE,cAAc,CAAC;IAChC,wBAAwB,CAAC,MAAM,EAAE,kBAAkB,GAAG,MAAM,CAAC;IAC7D,mBAAmB,IAAI,IAAI,CAAC;CAC7B;AAED,gBAAgB;AAChB,MAAM,MAAM,gBAAgB,GAAG;IAC7B,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACrB,CAAC;AAEF,YAAY;AACZ,MAAM,MAAM,kBAAkB,GAAG;IAC/B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE;QAChB,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;CACH,CAAC"}

package/dist/esm/index.js

@@ -1,4 +1,4 @@
 export * from './main';
 export { LAYOUT_ICONS } from './styles';
-export { DEFAULT_RELOAD_BUFFER, LayoutEmitEvents, LayoutReceiveEvents, LayoutRegistrationError, LayoutUsageError, LAYOUT_POPOUT_CONTAINER_CLASS, } from './utils';
+export { DEFAULT_RELOAD_BUFFER, LayoutEmitEvents, LayoutReceiveEvents, LayoutRegistrationError, LayoutUsageError, LAYOUT_POPOUT_CONTAINER_CLASS, LAYOUT_POPOUT_CONTROL_KEY, } from './utils';
 export { registerFactory, getFactory, unregisterFactory } from './utils/factory-registry';

package/dist/esm/main/layout-main.js

@@ -103,7 +103,7 @@ export class FoundationLayout extends FoundationElement {
         this.lifecycleUpdateToken = undefined;
         /**
          * Controls whether popout functionality is enabled on the layout. Defaults to disabled.
-         * Set this attribute to any string to enable popout functionality. If this string is of format `number;number` then this will be interpreted as the width and height of the popout window.
+         * Pass an empty object `{}` to use default configurations, or a {@link LayoutPopoutConfig} object to further customise.
          * @beta
          */
         this.popoutConfig = undefined;
@@ -287,13 +287,19 @@ export class FoundationLayout extends FoundationElement {
      * If you set the `LAYOUT_POPOUT_CONTAINER_CLASS` on an element which is a DOM parent of the layout,
      * then if the layout goes into popout mode then it will place itself as the only child for the popout container you set.
      * It is likely you'll want to attach this class to your design system provider.
+     *
+     * @param autoloading - If true, this respects the {@link LayoutPopoutConfig.loadAutomatically} property.
+     * You might want to set this to false and call it manually if you're manually registering components to the layout in order to avoid race conditions.
      * @beta
      */
-    tryActivatePopoutMode() {
+    tryActivatePopoutMode(autoloading = false) {
+        var _b;
         if (!this.popupMode)
             return false;
+        if (autoloading && ((_b = this.popoutConfig) === null || _b === void 0 ? void 0 : _b.loadAutomatically) === false)
+            return;
         const popoutComponentRegistration = new URLSearchParams(window.location.search).get(LAYOUT_POPOUT_CONTROL_KEY);
-        const popoutConfig = {
+        const glPopoutConfig = {
             root: {
                 type: 'component',
                 componentType: popoutComponentRegistration,
@@ -303,7 +309,7 @@ export class FoundationLayout extends FoundationElement {
                 hasHeaders: false,
             },
         };
-        this.loadGLConfigAndSetup(popoutConfig);
+        this.loadGLConfigAndSetup(glPopoutConfig);
         const tryFindNewLayoutDOMLocation = (e) => {
             if (e.classList.contains(LAYOUT_POPOUT_CONTAINER_CLASS))
                 return e;
@@ -644,7 +650,7 @@ export class FoundationLayout extends FoundationElement {
                 this.hasFirstLoaded = true;
                 // Store the default layout config before attempting to load from storage
                 this.defaultLayoutConfig = JSON.parse(JSON.stringify(this.layoutConfig));
-                const res = this.tryLoadLayoutFromLocalStorage() || this.tryActivatePopoutMode();
+                const res = this.tryLoadLayoutFromLocalStorage() || this.tryActivatePopoutMode(true);
                 if (!res) {
                     this.loadGLConfigAndSetup(this.layoutConfig);
                 }
@@ -973,14 +979,7 @@ export class FoundationLayout extends FoundationElement {
         if (!this.popoutConfig)
             return;
         logger.warn('Layout pop-out mode is enabled, this is an experimental feature and may change in future versions');
-        const popoutWindowPixelConfig = (popoutConfig) => {
-            const matcher = /(\d+);(\d+)/;
-            const mMatches = popoutConfig.match(matcher);
-            if (!mMatches)
-                return '';
-            const [, width, height] = mMatches;
-            return `,width=${width},height=${height}`;
-        };
+        const configWithDefaults = Object.assign(Object.assign({}, this.popoutConfig), { loadAutomatically: true, popoutDimension: Object.assign(Object.assign({}, this.popoutConfig.popoutDimension), { width: 960, height: 720 }) });
         this.customButtons.push({
             svg: LAYOUT_ICONS.popoutSVG,
             onClick: (_, elem) => {
@@ -989,7 +988,7 @@ export class FoundationLayout extends FoundationElement {
                 const itemParams = new URLSearchParams();
                 itemParams.append(LAYOUT_POPOUT_CONTROL_KEY, registration);
                 url.search = itemParams.toString();
-                window.open(url, undefined, 'popup' + popoutWindowPixelConfig(this.popoutConfig));
+                window.open(url, undefined, `popup,width=${configWithDefaults.popoutDimension.width},height=${configWithDefaults.popoutDimension.height}`);
             },
         });
         this.popupMode = window.location.search.includes(LAYOUT_POPOUT_CONTROL_KEY);
@@ -1021,7 +1020,7 @@ __decorate([
     observable
 ], FoundationLayout.prototype, "dragging", void 0);
 __decorate([
-    attr({ attribute: 'popout-config' })
+    observable
 ], FoundationLayout.prototype, "popoutConfig", void 0);
 __decorate([
     observable

package/dist/esm/utils/constants.js

@@ -25,7 +25,7 @@ export const DEFAULT_RELOAD_BUFFER = 500;
 export const AUTOSAVE_KEY = 'foundation-layout-autosave';
 /**
  * Key to be used for controlling popout behaviour
- * @internal
+ * @beta
  */
 export const LAYOUT_POPOUT_CONTROL_KEY = 'f-layout-key';
 /**

package/dist/foundation-layout.api.json

@@ -845,15 +845,20 @@
             {
               "kind": "Property",
               "canonicalReference": "@genesislcap/foundation-layout!FoundationLayout#popoutConfig:member",
-              "docComment": "/**\n * Controls whether popout functionality is enabled on the layout. Defaults to disabled. Set this attribute to any string to enable popout functionality. If this string is of format `number;number` then this will be interpreted as the width and height of the popout window.\n *\n * @beta\n */\n",
+              "docComment": "/**\n * Controls whether popout functionality is enabled on the layout. Defaults to disabled. Pass an empty object `{}` to use default configurations, or a {@link LayoutPopoutConfig} object to further customise.\n *\n * @beta\n */\n",
               "excerptTokens": [
                 {
                   "kind": "Content",
                   "text": "popoutConfig: "
                 },
+                {
+                  "kind": "Reference",
+                  "text": "LayoutPopoutConfig",
+                  "canonicalReference": "@genesislcap/foundation-layout!LayoutPopoutConfig:type"
+                },
                 {
                   "kind": "Content",
-                  "text": "string | undefined"
+                  "text": " | undefined"
                 },
                 {
                   "kind": "Content",
@@ -866,7 +871,7 @@
               "name": "popoutConfig",
               "propertyTypeTokenRange": {
                 "startIndex": 1,
-                "endIndex": 2
+                "endIndex": 3
               },
               "isStatic": false,
               "isProtected": false,
@@ -1074,11 +1079,19 @@
             {
               "kind": "Method",
               "canonicalReference": "@genesislcap/foundation-layout!FoundationLayout#tryActivatePopoutMode:member(1)",
-              "docComment": "/**\n * If in a popout window from the dynamic layout, this function will run the flow to put the component in popout mode. This function is automatically called if using the declarative HTML API, but if only using the JavaScript API then you will need to call this function manually.\n *\n * @remarks\n *\n * If you need to call this manually then you should do it as soon as you register all of the required components with {@link FoundationLayout.registerItem}.\n *\n * If you set the `LAYOUT_POPOUT_CONTAINER_CLASS` on an element which is a DOM parent of the layout, then if the layout goes into popout mode then it will place itself as the only child for the popout container you set. It is likely you'll want to attach this class to your design system provider.\n *\n * @beta\n */\n",
+              "docComment": "/**\n * If in a popout window from the dynamic layout, this function will run the flow to put the component in popout mode. This function is automatically called if using the declarative HTML API, but if only using the JavaScript API then you will need to call this function manually.\n *\n * @remarks\n *\n * If you need to call this manually then you should do it as soon as you register all of the required components with {@link FoundationLayout.registerItem}.\n *\n * If you set the `LAYOUT_POPOUT_CONTAINER_CLASS` on an element which is a DOM parent of the layout, then if the layout goes into popout mode then it will place itself as the only child for the popout container you set. It is likely you'll want to attach this class to your design system provider.\n *\n * @param autoloading - If true, this respects the {@link LayoutPopoutConfig.loadAutomatically} property. You might want to set this to false and call it manually if you're manually registering components to the layout in order to avoid race conditions.\n *\n * @beta\n */\n",
               "excerptTokens": [
                 {
                   "kind": "Content",
-                  "text": "tryActivatePopoutMode(): "
+                  "text": "tryActivatePopoutMode(autoloading?: "
+                },
+                {
+                  "kind": "Content",
+                  "text": "boolean"
+                },
+                {
+                  "kind": "Content",
+                  "text": "): "
                 },
                 {
                   "kind": "Content",
@@ -1091,13 +1104,22 @@
               ],
               "isStatic": false,
               "returnTypeTokenRange": {
-                "startIndex": 1,
-                "endIndex": 2
+                "startIndex": 3,
+                "endIndex": 4
               },
               "releaseTag": "Beta",
               "isProtected": false,
               "overloadIndex": 1,
-              "parameters": [],
+              "parameters": [
+                {
+                  "parameterName": "autoloading",
+                  "parameterTypeTokenRange": {
+                    "startIndex": 1,
+                    "endIndex": 2
+                  },
+                  "isOptional": true
+                }
+              ],
               "isOptional": false,
               "isAbstract": false,
               "name": "tryActivatePopoutMode"
@@ -1721,6 +1743,33 @@
             "endIndex": 0
           }
         },
+        {
+          "kind": "Variable",
+          "canonicalReference": "@genesislcap/foundation-layout!LAYOUT_POPOUT_CONTROL_KEY:var",
+          "docComment": "/**\n * Key to be used for controlling popout behaviour\n *\n * @beta\n */\n",
+          "excerptTokens": [
+            {
+              "kind": "Content",
+              "text": "LAYOUT_POPOUT_CONTROL_KEY = "
+            },
+            {
+              "kind": "Content",
+              "text": "\"f-layout-key\""
+            }
+          ],
+          "fileUrlPath": "src/utils/constants.ts",
+          "initializerTokenRange": {
+            "startIndex": 1,
+            "endIndex": 2
+          },
+          "isReadonly": true,
+          "releaseTag": "Beta",
+          "name": "LAYOUT_POPOUT_CONTROL_KEY",
+          "variableTypeTokenRange": {
+            "startIndex": 0,
+            "endIndex": 0
+          }
+        },
         {
           "kind": "Interface",
           "canonicalReference": "@genesislcap/foundation-layout!LayoutComponentWithState:interface",
@@ -1848,6 +1897,32 @@
             "endIndex": 2
           }
         },
+        {
+          "kind": "TypeAlias",
+          "canonicalReference": "@genesislcap/foundation-layout!LayoutPopoutConfig:type",
+          "docComment": "/**\n * @beta\n */\n",
+          "excerptTokens": [
+            {
+              "kind": "Content",
+              "text": "export type LayoutPopoutConfig = "
+            },
+            {
+              "kind": "Content",
+              "text": "{\n    loadAutomatically?: boolean;\n    popoutDimension?: {\n        width: number;\n        height: number;\n    };\n}"
+            },
+            {
+              "kind": "Content",
+              "text": ";"
+            }
+          ],
+          "fileUrlPath": "src/utils/types.ts",
+          "releaseTag": "Beta",
+          "name": "LayoutPopoutConfig",
+          "typeTokenRange": {
+            "startIndex": 1,
+            "endIndex": 2
+          }
+        },
         {
           "kind": "Variable",
           "canonicalReference": "@genesislcap/foundation-layout!LayoutReceiveEvents:var",

package/dist/foundation-layout.d.ts

@@ -172,10 +172,10 @@ export declare class FoundationLayout extends FoundationElement implements Layou
     lifecycleUpdateToken: string | undefined;
     /**
      * Controls whether popout functionality is enabled on the layout. Defaults to disabled.
-     * Set this attribute to any string to enable popout functionality. If this string is of format `number;number` then this will be interpreted as the width and height of the popout window.
+     * Pass an empty object `{}` to use default configurations, or a {@link LayoutPopoutConfig} object to further customise.
      * @beta
      */
-    popoutConfig: string | undefined;
+    popoutConfig: LayoutPopoutConfig | undefined;
     private popupMode;
     /** @internal */
     constructor();
@@ -247,9 +247,12 @@ export declare class FoundationLayout extends FoundationElement implements Layou
      * If you set the `LAYOUT_POPOUT_CONTAINER_CLASS` on an element which is a DOM parent of the layout,
      * then if the layout goes into popout mode then it will place itself as the only child for the popout container you set.
      * It is likely you'll want to attach this class to your design system provider.
+     *
+     * @param autoloading - If true, this respects the {@link LayoutPopoutConfig.loadAutomatically} property.
+     * You might want to set this to false and call it manually if you're manually registering components to the layout in order to avoid race conditions.
      * @beta
      */
-    tryActivatePopoutMode(): boolean;
+    tryActivatePopoutMode(autoloading?: boolean): boolean;
     /**
      * Try to load a layout from local storage, or return false. Only required if manually calling {@link FoundationLayout.registerItem}
      * @remarks
@@ -674,6 +677,12 @@ export declare class FoundationLayout extends FoundationElement implements Layou
             */
            export declare const LAYOUT_POPOUT_CONTAINER_CLASS = "f-layout-popout";
 
+           /**
+            * Key to be used for controlling popout behaviour
+            * @beta
+            */
+           export declare const LAYOUT_POPOUT_CONTROL_KEY = "f-layout-key";
+
            /** @internal */
            declare interface LayoutComponent {
                [componentType]: ComponentTypes;
@@ -765,6 +774,15 @@ export declare class FoundationLayout extends FoundationElement implements Layou
                readonly itemResized: "item-resized";
            };
 
+           /** @beta */
+           export declare type LayoutPopoutConfig = {
+               loadAutomatically?: boolean;
+               popoutDimension?: {
+                   width: number;
+                   height: number;
+               };
+           };
+
            /**
             * Defines events that the layout system listens for
             *

package/docs/api/foundation-layout.foundationlayout.md

@@ -206,12 +206,12 @@ Function which is used to generate the placeholder text when a layout is loaded
 
 </td><td>
 
-string \| undefined
+[LayoutPopoutConfig](./foundation-layout.layoutpopoutconfig.md) \| undefined
 
 
 </td><td>
 
-**_(BETA)_** Controls whether popout functionality is enabled on the layout. Defaults to disabled. Set this attribute to any string to enable popout functionality. If this string is of format `number;number` then this will be interpreted as the width and height of the popout window.
+**_(BETA)_** Controls whether popout functionality is enabled on the layout. Defaults to disabled. Pass an empty object `{}` to use default configurations, or a [LayoutPopoutConfig](./foundation-layout.layoutpopoutconfig.md) object to further customise.
 
 
 </td></tr>
@@ -370,7 +370,7 @@ Removes all instances of a specified registered item from the layout.
 </td></tr>
 <tr><td>
 
-[tryActivatePopoutMode()](./foundation-layout.foundationlayout.tryactivatepopoutmode.md)
+[tryActivatePopoutMode(autoloading)](./foundation-layout.foundationlayout.tryactivatepopoutmode.md)
 
 
 </td><td>

package/docs/api/foundation-layout.foundationlayout.popoutconfig.md

@@ -7,10 +7,10 @@
 > This API is provided as a beta preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
 > 
 
-Controls whether popout functionality is enabled on the layout. Defaults to disabled. Set this attribute to any string to enable popout functionality. If this string is of format `number;number` then this will be interpreted as the width and height of the popout window.
+Controls whether popout functionality is enabled on the layout. Defaults to disabled. Pass an empty object `{}` to use default configurations, or a [LayoutPopoutConfig](./foundation-layout.layoutpopoutconfig.md) object to further customise.
 
 **Signature:**
 
 ```typescript
-popoutConfig: string | undefined;
+popoutConfig: LayoutPopoutConfig | undefined;
 ```

package/docs/api/foundation-layout.foundationlayout.tryactivatepopoutmode.md

@@ -12,8 +12,45 @@ If in a popout window from the dynamic layout, this function will run the flow t
 **Signature:**
 
 ```typescript
-tryActivatePopoutMode(): boolean;
+tryActivatePopoutMode(autoloading?: boolean): boolean;
 ```
+
+## Parameters
+
+<table><thead><tr><th>
+
+Parameter
+
+
+</th><th>
+
+Type
+
+
+</th><th>
+
+Description
+
+
+</th></tr></thead>
+<tbody><tr><td>
+
+autoloading
+
+
+</td><td>
+
+boolean
+
+
+</td><td>
+
+_(Optional)_ If true, this respects the  property. You might want to set this to false and call it manually if you're manually registering components to the layout in order to avoid race conditions.
+
+
+</td></tr>
+</tbody></table>
+
 **Returns:**
 
 boolean

package/docs/api/foundation-layout.layout_popout_control_key.md

@@ -0,0 +1,16 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [LAYOUT\_POPOUT\_CONTROL\_KEY](./foundation-layout.layout_popout_control_key.md)
+
+## LAYOUT\_POPOUT\_CONTROL\_KEY variable
+
+> This API is provided as a beta preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
+> 
+
+Key to be used for controlling popout behaviour
+
+**Signature:**
+
+```typescript
+LAYOUT_POPOUT_CONTROL_KEY = "f-layout-key"
+```

package/docs/api/foundation-layout.layoutpopoutconfig.md

@@ -0,0 +1,21 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [LayoutPopoutConfig](./foundation-layout.layoutpopoutconfig.md)
+
+## LayoutPopoutConfig type
+
+> This API is provided as a beta preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
+> 
+
+
+**Signature:**
+
+```typescript
+export type LayoutPopoutConfig = {
+    loadAutomatically?: boolean;
+    popoutDimension?: {
+        width: number;
+        height: number;
+    };
+};
+```

package/docs/api/foundation-layout.md

@@ -215,6 +215,17 @@ A collection of SVG icons in base64 format.
 **_(BETA)_** Put this classname on an element which is a DOM parent of the layout, and if the layout goes into popout mode then it will place itself as the only child for the popout container you set.
 
 
+</td></tr>
+<tr><td>
+
+[LAYOUT\_POPOUT\_CONTROL\_KEY](./foundation-layout.layout_popout_control_key.md)
+
+
+</td><td>
+
+**_(BETA)_** Key to be used for controlling popout behaviour
+
+
 </td></tr>
 <tr><td>
 
@@ -300,6 +311,17 @@ Factory function for creating component instances in the layout.
 Definition of a custom button which will be added to all layout items.
 
 
+</td></tr>
+<tr><td>
+
+[LayoutPopoutConfig](./foundation-layout.layoutpopoutconfig.md)
+
+
+</td><td>
+
+**_(BETA)_**
+
+
 </td></tr>
 <tr><td>
 

package/docs/api-report.md.api.md

@@ -60,7 +60,7 @@ export class FoundationLayout extends FoundationElement implements LayoutCompone
     loadLayout(layout: SerialisedLayout, handleMissingItem?: 'placeholder' | 'error', disableCache?: boolean): void;
     missingItemPlaceholder: (missingItem: string) => string;
     // @beta
-    popoutConfig: string | undefined;
+    popoutConfig: LayoutPopoutConfig | undefined;
     registeredItems(): string[];
     registerItem(registration: string, elementsOrFactory: Element[] | ComponentFactory): string;
     reloadBuffer: number;
@@ -68,7 +68,7 @@ export class FoundationLayout extends FoundationElement implements LayoutCompone
     // @internal
     requestLayoutReload(): void;
     // @beta
-    tryActivatePopoutMode(): boolean;
+    tryActivatePopoutMode(autoloading?: boolean): boolean;
     tryLoadLayoutFromLocalStorage(): boolean;
     // @internal (undocumented)
     usingDeclerativeAPI: boolean;
@@ -150,6 +150,9 @@ export const LAYOUT_ICONS: {
 // @beta
 export const LAYOUT_POPOUT_CONTAINER_CLASS = "f-layout-popout";
 
+// @beta
+export const LAYOUT_POPOUT_CONTROL_KEY = "f-layout-key";
+
 // @public
 export interface LayoutComponentWithState<T> {
     applyState(state: T | null): void;
@@ -164,6 +167,15 @@ export const LayoutEmitEvents: {
     readonly itemResized: "item-resized";
 };
 
+// @beta (undocumented)
+export type LayoutPopoutConfig = {
+    loadAutomatically?: boolean;
+    popoutDimension?: {
+        width: number;
+        height: number;
+    };
+};
+
 // @public
 export const LayoutReceiveEvents: {
     readonly changeTitle: "change-title";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genesislcap/foundation-layout",
   "description": "Genesis Foundation UI App Layout",
-  "version": "14.393.2",
+  "version": "14.393.3-FUI-2471.1",
   "license": "SEE LICENSE IN license.txt",
   "main": "dist/esm/index.js",
   "types": "dist/foundation-layout.d.ts",
@@ -38,20 +38,20 @@
     }
   },
   "devDependencies": {
-    "@genesislcap/foundation-testing": "14.393.2",
-    "@genesislcap/genx": "14.393.2",
-    "@genesislcap/rollup-builder": "14.393.2",
-    "@genesislcap/ts-builder": "14.393.2",
-    "@genesislcap/uvu-playwright-builder": "14.393.2",
-    "@genesislcap/vite-builder": "14.393.2",
-    "@genesislcap/webpack-builder": "14.393.2"
+    "@genesislcap/foundation-testing": "14.393.3-FUI-2471.1",
+    "@genesislcap/genx": "14.393.3-FUI-2471.1",
+    "@genesislcap/rollup-builder": "14.393.3-FUI-2471.1",
+    "@genesislcap/ts-builder": "14.393.3-FUI-2471.1",
+    "@genesislcap/uvu-playwright-builder": "14.393.3-FUI-2471.1",
+    "@genesislcap/vite-builder": "14.393.3-FUI-2471.1",
+    "@genesislcap/webpack-builder": "14.393.3-FUI-2471.1"
   },
   "dependencies": {
     "@genesis-community/golden-layout": "^2.11.0",
-    "@genesislcap/foundation-comms": "14.393.2",
-    "@genesislcap/foundation-logger": "14.393.2",
-    "@genesislcap/foundation-ui": "14.393.2",
-    "@genesislcap/foundation-utils": "14.393.2",
+    "@genesislcap/foundation-comms": "14.393.3-FUI-2471.1",
+    "@genesislcap/foundation-logger": "14.393.3-FUI-2471.1",
+    "@genesislcap/foundation-ui": "14.393.3-FUI-2471.1",
+    "@genesislcap/foundation-utils": "14.393.3-FUI-2471.1",
     "@microsoft/fast-components": "2.30.6",
     "@microsoft/fast-element": "1.14.0",
     "@microsoft/fast-foundation": "2.50.0"
@@ -65,5 +65,5 @@
     "access": "public"
   },
   "customElements": "dist/custom-elements.json",
-  "gitHead": "2448f444f9684f2fd2209843677ccaa342af1234"
+  "gitHead": "1234c6eb62ef380e2552f20adf320494eae1c996"
 }