@genesislcap/foundation-layout 14.408.0 → 14.409.0-FUI-2495.2

package/README.md

@@ -1,145 +1,22 @@
-# Genesis Foundation UI App Layout
+# @genesislcap/foundation-layout
 
-[![lerna](https://img.shields.io/badge/maintained%20with-lerna-cc00ff.svg)](https://lerna.js.org/)
-[![TypeScript](https://img.shields.io/badge/%3C%2F%3E-TypeScript-%230074c1.svg)](https://www.typescriptlang.org/)
+Documentation for this package is published on the Genesis docs site:
 
-## Declarative HTML API
+**Docs: [Layout management](https://docs.genesis.global/docs/develop/client-capabilities/layout-management/)**
 
-The following example shows the usage of the declarative API with `zero-charts` and the output that it produces.
-```html
-<foundation-layout ${ref('analyticsLayout')}>
-  <foundation-layout-region type="horizontal">
-    <foundation-layout-item title="Static Data Bar" registration="bar" closable>
-      <foundation-g2plot-chart
-        type="bar"
-        :config=${(x) => x.barConfig}
-        :data=${(x) => x.barData}
-      ></foundation-g2plot-chart>
-    </foundation-layout-item>
-    <foundation-layout-region type="vertical">
-      <foundation-layout-item title="Static Data Stock" registration="stock" closable>
-        <foundation-g2plot-chart
-          type="stock"
-          :config=${(x) => x.stockConfiguration}
-          :data=${(x) => x.stockData}
-        ></foundation-g2plot-chart>
-      </foundation-layout-item>
-      <foundation-layout-item title="Static Data Rose" registration="rose" closable>
-        <foundation-g2plot-chart
-          type="rose"
-          :config=${(x) => x.roseConfig}
-          :data=${(x) => x.roseData}
-          :legendParser=${(x) => x.roseLegendParser()}
-        ></foundation-g2plot-chart>
-      </foundation-layout-item>
-    </foundation-layout-region>
-  </foundation-layout-region>
-</foundation-layout>
-```
-
-![Example output of the declarative API with the zero charts](./docs/img/foundation-layout-example.png)
+## Installation
 
-1. Register the layout with the design system. This is probably in a file called **components.ts**, located where you call `.register()` on the design system.
+Add the package to your `package.json` dependencies. After changing dependencies, run `npm run bootstrap` (or your project's equivalent). See [package.json basics](https://learn.genesis.global/secure/web/basics/package-json-basics/) for more information.
 
-```javascript
-FoundationDesignSystem: registerFoundationDesignSystem().register(
-	// ...Other registrations
-	// add foundationLayoutComponents here
-	foundationLayoutComponents,
-)
+```json
+{
+  "dependencies": {
+    "@genesislcap/foundation-layout": "latest"
+  }
+}
 ```
 
-- This registers the three custom elements for use in your application. The components will use the prefix of the design system as their prefix. For example, the root component will be `<foundation-layout>` in the `Foundation` design system, and `<zero-layout>` in the `Zero (alpha)` design system.
-
-:::info
-For the rest of this document, the components will be referred to with the `foundation-` prefix.
-:::
-
-### Custom styling
-
-The required class, template, and base styles are exported as part of the package, allowing a client to customise the styling of the layout system via design system extensions.
-
-:::tip
-All the customisable styles of the layout system are contained within the styles for [`<foundation-layout>`](./docs/api/foundation-layout.foundationlayout.md). So if you want to customise the styles in addition to setting the css variables, you only need to set the styles here.
-:::
-
-### [Top Level Component `<foundation-layout>`](./docs/api/foundation-layout.foundationlayout.md)
-
-Top level web component, which is used to initialise a custom layout
-
-- **reload-buffer** : numerical attribute that controls the buffer between how long the layout is reloaded. The default
-is 500ms. In this case, the layout is only reloaded if the child elements of the layout region are manipulated
-once every 500ms. This is to stop the layout being reloaded over and over for every single item during initialisation.
-The higher the value is, the more performant the component is - but the first load will appear to take longer.
-- **auto-save-key** : optional string which if set, will enable autosaving the layout under this key in local
-storage. See [here](#autosaving-layout) for more.
-
-:::tip
-This only applies for usage with the declarative HTML API. When the layout first loads after this amount of time,
-it emits an [event](#events).
-:::
-
-### [Layout Regions](./docs/api/foundation-layout.foundationlayoutregion.md)
-
-If you don't specify the `type` of the layout region, it defaults to `type="horizontal"`;
-
-- **type**: `vertical`, `horizontal`, `tabs` (default `horizontal`).
-- **size**: optional string parameter defining size, [see here](#sizing).
-
-#### `<foundation-layout-region type="vertical">`
-
-Indicates to the layout system that all immediate children are (by default) to be split equally within the available space of this
-component using n-1 column split(s). Can be nested within other horizontal and vertical regions.
-
-#### `<foundation-layout-region type="horizontal">`
-
-Indicates to the layout system that all immediate children are (by default) to be split equally among the available space of this
-component using n-1 row split(s). Can be nested within other horizontal and vertical regions.
-
-#### `<foundation-layout-region type="tabs">`
-
-Indicates to the layout system that all immediate children are to be added as tabs in the available space of this component,
-with a tab for each child. The tabs are ordered according to which child the layout item is (e.g. the second `<foundation-layout-item>`
- of the tab split is the second tab). The first child will be the one that is open by default. Can be nested within horizontal
- and vertical regions, but cannot have more layout sections inside it.
-
-### [Layout Item `<foundation-layout-item>`](./docs/api/foundation-layout.foundationlayoutitem.md)
-
-Wrapper component that lives inside a layout section and wraps the client content. All content must be inside a layout item;
-otherwise, a runtime error will be thrown when the layout attempts to render itself on screen.
-
-- **title**: string defining the title of the pane that contains the content. Defaults to `Item x`, where `x` is the pane number.
-- **closable**: boolean defining whether this element is closable - Default false.
-- **size**: optional string parameter defining size, [see here](#sizing).
-- **registration**: optional string, which manually sets the registered name for the pane - [see here](#dynamic-registration-and-adding-items). By default, each item that doesn't have the `registration` attribute set will be a string registered sequentially starting at `"1"`.
-
-### Sizing
-
-The layout sections and layout item all have an _optional_ attribute:
-
-- **size**: string defining the size. For rows, it specifies height. For columns, it specifies width. Has format `<number><size-unit>`.
-	Currently only supports units `fr` and `%`. Space is first proportionally allocated to items with sizeUnit `%`. If there is any space
-	left over (less than 100% allocated), then the remainder is allocated to the items with unit `fr` according to the fractional size.
-	If more than 100% is allocated, then an extra 50% is allocated to items with unit `fr` and is allocated to each item according to its
-	fractional size. All item sizes are then adjusted to bring the total back to 100%.
-
-:::info
-The size defines the size of the component _compared_ to the siblings _within_ the context of the component's parent.
-:::
-
-## JavaScript API
-
-The JavaScript API is [accessed through the methods on the root layout object](./docs/api/foundation-layout.foundationlayout.md) and allows for saving/loading the layout state, and dynamically adding items to the layout at runtime.
-
-### Dynamic registration and adding items
-
-To have a pane displayed on the layout system, it must be *registered* with the layout system. When using the [declarative API](#declarative-html-api), the layout system takes care of this for you, but as you start to add items dynamically and then serialise the layout, you need to consider which panes are registered. See [this contained example](#contained-example), which allows the user to add pre-determined items to the layout dynamically.
-
-:::tip
-If you are only using the declarative API, and not using any dynamic integrations with JavaScript, then you shouldn't need to set the registration names of any items, as all the same items will be registered when you load a previously saved layout. If you are dynamically adding items as well, it is highly recommended to set the registration names of items manually. This makes it easier to figure out what is and is not registered.
-* When using the declarative API, use the `registration` attribute on the `<foundation-layout-item>` component.
-* When using the JavaScript API, set the `registration` optional parameter on the [registered element config](./docs/api/foundation-layout.registeredelementconfig.md).
-:::
+## [API Docs](./docs/api/index.md)
 
 #### [Register Item](./docs/api/foundation-layout.foundationlayout.registeritem.md)
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genesislcap/foundation-layout",
   "description": "Genesis Foundation UI App Layout",
-  "version": "14.408.0",
+  "version": "14.409.0-FUI-2495.2",
   "license": "SEE LICENSE IN license.txt",
   "main": "dist/esm/index.js",
   "types": "dist/foundation-layout.d.ts",
@@ -38,22 +38,22 @@
     }
   },
   "devDependencies": {
-    "@genesislcap/foundation-testing": "14.408.0",
-    "@genesislcap/genx": "14.408.0",
-    "@genesislcap/rollup-builder": "14.408.0",
-    "@genesislcap/ts-builder": "14.408.0",
-    "@genesislcap/uvu-playwright-builder": "14.408.0",
-    "@genesislcap/vite-builder": "14.408.0",
-    "@genesislcap/webpack-builder": "14.408.0"
+    "@genesislcap/foundation-testing": "14.409.0-FUI-2495.2",
+    "@genesislcap/genx": "14.409.0-FUI-2495.2",
+    "@genesislcap/rollup-builder": "14.409.0-FUI-2495.2",
+    "@genesislcap/ts-builder": "14.409.0-FUI-2495.2",
+    "@genesislcap/uvu-playwright-builder": "14.409.0-FUI-2495.2",
+    "@genesislcap/vite-builder": "14.409.0-FUI-2495.2",
+    "@genesislcap/webpack-builder": "14.409.0-FUI-2495.2"
   },
   "dependencies": {
     "@genesis-community/golden-layout": "^2.11.0",
-    "@genesislcap/foundation-broadcast-channel": "14.408.0",
-    "@genesislcap/foundation-comms": "14.408.0",
-    "@genesislcap/foundation-events": "14.408.0",
-    "@genesislcap/foundation-logger": "14.408.0",
-    "@genesislcap/foundation-ui": "14.408.0",
-    "@genesislcap/foundation-utils": "14.408.0",
+    "@genesislcap/foundation-broadcast-channel": "14.409.0-FUI-2495.2",
+    "@genesislcap/foundation-comms": "14.409.0-FUI-2495.2",
+    "@genesislcap/foundation-events": "14.409.0-FUI-2495.2",
+    "@genesislcap/foundation-logger": "14.409.0-FUI-2495.2",
+    "@genesislcap/foundation-ui": "14.409.0-FUI-2495.2",
+    "@genesislcap/foundation-utils": "14.409.0-FUI-2495.2",
     "@microsoft/fast-components": "2.30.6",
     "@microsoft/fast-element": "1.14.0",
     "@microsoft/fast-foundation": "2.50.0"
@@ -67,5 +67,5 @@
     "access": "public"
   },
   "customElements": "dist/custom-elements.json",
-  "gitHead": "26b08831fd001b4ee95c8a0d3364a18c0ec4005b"
+  "gitHead": "1fcaf08e9b7559024b25dc6ccc27e3bc62f1512b"
 }

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

@@ -1,46 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [ComponentFactory](./foundation-layout.componentfactory.md)
-
-## ComponentFactory type
-
-Factory function for creating component instances in the layout.
-
-**Signature:**
-
-```typescript
-export type ComponentFactory = (container: HTMLElement) => void | (() => void);
-```
-
-## Remarks
-
-This is the recommended approach for framework-rendered components (React, Angular, Vue, etc.) because it allows each layout instance to create a fresh component rather than cloning existing DOM elements (which loses event listeners and framework bindings).
-
-The factory function receives a container element and should render the component into it. Optionally, it can return a cleanup function that will be called when the component is removed from the layout.
-
-## Example 1
-
-React example:
-
-```typescript
-layout.registerItem('my-component', (container) => {
-  const root = createRoot(container);
-  root.render(<MyComponent />);
-  return () => root.unmount();
-});
-```
-
-## Example 2
-
-Angular example:
-
-```typescript
-layout.registerItem('my-component', (container) => {
-  const componentRef = createComponent(MyComponent, {
-    environmentInjector: this.injector,
-    hostElement: container
-  });
-  return () => componentRef.destroy();
-});
-```
-

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

@@ -1,21 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [CustomButton](./foundation-layout.custombutton.md)
-
-## CustomButton type
-
-Definition of a custom button which will be added to all layout items.
-
-**Signature:**
-
-```typescript
-export type CustomButton = {
-    svg: string;
-    onClick: (button: HTMLElement, element: HTMLElement) => void;
-};
-```
-
-## Remarks
-
-`svg` - string of the SVG to use for the button. Needs to be in the format `data:image/svg+xml;base64,<<base64 encoded definition>>`<!-- -->. `onClick` - function which will be called when the button is clicked. The clicked button and the contained element associated with the clicked button will be passed to the function.
-

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

@@ -1,15 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [DEFAULT\_RELOAD\_BUFFER](./foundation-layout.default_reload_buffer.md)
-
-## DEFAULT\_RELOAD\_BUFFER variable
-
-Default time in milliseconds for the layout to buffer calls to reloading the layout while the declarative API is loading.
-
-During the first load of the layout, a loading spinner will be shown.
-
-**Signature:**
-
-```typescript
-DEFAULT_RELOAD_BUFFER = 500
-```

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

@@ -1,80 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [FoundationLayout](./foundation-layout.foundationlayout.md) &gt; [addItem](./foundation-layout.foundationlayout.additem.md)
-
-## FoundationLayout.addItem() method
-
-Dynamically add a new item to the layout. The user can move the new plane to whenever they want once it has been added.
-
-**Signature:**
-
-```typescript
-addItem(config: RegisteredElementConfig | RegisteredElementConfig[], placement?: Placement): void;
-```
-
-## Parameters
-
-<table><thead><tr><th>
-
-Parameter
-
-
-</th><th>
-
-Type
-
-
-</th><th>
-
-Description
-
-
-</th></tr></thead>
-<tbody><tr><td>
-
-config
-
-
-</td><td>
-
-[RegisteredElementConfig](./foundation-layout.registeredelementconfig.md) \| [RegisteredElementConfig](./foundation-layout.registeredelementconfig.md)<!-- -->\[\]
-
-
-</td><td>
-
-[RegisteredElementConfig](./foundation-layout.registeredelementconfig.md) configuration items for the new items(s). Pass an array of [RegisteredElementConfig](./foundation-layout.registeredelementconfig.md) to add multiple items at once.
-
-
-</td></tr>
-<tr><td>
-
-placement
-
-
-</td><td>
-
-[Placement](./foundation-layout.placement.md)
-
-
-</td><td>
-
-_(Optional)_ where and how to add the new items to the layout. For more info and defaults see [Placement](./foundation-layout.placement.md)<!-- -->.
-
-
-</td></tr>
-</tbody></table>
-
-**Returns:**
-
-void
-
-## Exceptions
-
-[LayoutRegistrationError](./foundation-layout.layoutregistrationerror.md) if you attempt to add an item before it has been registered
-
-## Remarks
-
-Adding new items invokes the registration previously made explicitly via [registerItem()](./foundation-layout.foundationlayout.registeritem.md) or implicitly via the html declarative API.
-
-The elements added onto the new pane are copies using `element.cloneNode()` of the original element references used during registration.
-

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

@@ -1,13 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [FoundationLayout](./foundation-layout.foundationlayout.md) &gt; [autoSaveKey](./foundation-layout.foundationlayout.autosavekey.md)
-
-## FoundationLayout.autoSaveKey property
-
-Attribute which if set will auto save and load the layout as the user changes it. Omit this attribute to disable this feature. Set attribute using `auto-save-key`<!-- -->.
-
-**Signature:**
-
-```typescript
-autoSaveKey?: string;
-```

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

@@ -1,18 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [FoundationLayout](./foundation-layout.foundationlayout.md) &gt; [class](./foundation-layout.foundationlayout.class.md)
-
-## FoundationLayout.class property
-
-Identifier constant token.
-
-**Signature:**
-
-```typescript
-class: "FoundationLayoutMain";
-```
-
-## Remarks
-
-Used for the `LifecycleMixin` to identify it is part of the layout system.
-

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

@@ -1,25 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [FoundationLayout](./foundation-layout.foundationlayout.md) &gt; [clearAutosaveAndRevertToDefault](./foundation-layout.foundationlayout.clearautosaveandreverttodefault.md)
-
-## FoundationLayout.clearAutosaveAndRevertToDefault() method
-
-Clears the autosaved layout from local storage and reverts to the default layout
-
-**Signature:**
-
-```typescript
-clearAutosaveAndRevertToDefault(): boolean;
-```
-**Returns:**
-
-boolean
-
-boolean - true if the autosave was cleared and layout reverted, false if no action was taken
-
-## Remarks
-
-This method will remove the autosaved layout associated with the current `auto-save-key` from local storage and reload the layout using the original configuration that was defined declaratively or set initially. The layout will be reloaded with fresh instances (cache disabled).
-
-If no `auto-save-key` is set or if the layout is in popup mode, this method returns false without doing anything.
-

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

@@ -1,18 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [FoundationLayout](./foundation-layout.foundationlayout.md) &gt; [customButtons](./foundation-layout.foundationlayout.custombuttons.md)
-
-## FoundationLayout.customButtons property
-
-Set custom button definition on this property to add them to the layout header controls
-
-**Signature:**
-
-```typescript
-customButtons: CustomButton[];
-```
-
-## Remarks
-
-To see more information see [CustomButton](./foundation-layout.custombutton.md)<!-- -->.
-

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

@@ -1,13 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [FoundationLayout](./foundation-layout.foundationlayout.md) &gt; [dimensionsConfig](./foundation-layout.foundationlayout.dimensionsconfig.md)
-
-## FoundationLayout.dimensionsConfig property
-
-Apply dimensions config to the layout, such as setting the size of the drag handles.
-
-**Signature:**
-
-```typescript
-dimensionsConfig?: LayoutConfig.Dimensions;
-```

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

@@ -1,13 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [FoundationLayout](./foundation-layout.foundationlayout.md) &gt; [dragging](./foundation-layout.foundationlayout.dragging.md)
-
-## FoundationLayout.dragging property
-
-Set to true when the user is currently dragging the panes inside of the layout
-
-**Signature:**
-
-```typescript
-dragging: boolean;
-```

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

@@ -1,23 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [FoundationLayout](./foundation-layout.foundationlayout.md) &gt; [getLayout](./foundation-layout.foundationlayout.getlayout.md)
-
-## FoundationLayout.getLayout() method
-
-Gets a minified string containing the config describing the current layout of the layout object to later restore in [function](./foundation-layout.foundationlayout.loadlayout.md)
-
-**Signature:**
-
-```typescript
-getLayout(): SerialisedLayout;
-```
-**Returns:**
-
-[SerialisedLayout](./foundation-layout.serialisedlayout.md)
-
-- latest version of [SerialisedLayout](./foundation-layout.serialisedlayout.md) describing the layout
-
-## Remarks
-
-Includes any state for a contained component exposed by the [LayoutComponentWithState](./foundation-layout.layoutcomponentwithstate.md) interface.
-

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

@@ -1,20 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [FoundationLayout](./foundation-layout.foundationlayout.md) &gt; [hasFirstLoaded](./foundation-layout.foundationlayout.hasfirstloaded.md)
-
-## FoundationLayout.hasFirstLoaded property
-
-Boolean signifies whether the layout has loaded for the first time or not.
-
-**Signature:**
-
-```typescript
-hasFirstLoaded: boolean;
-```
-
-## Remarks
-
-When using the declarative API this is set to true when the layout loads after the first timeout of `reload-buffer`<!-- -->. If using the JavaScript API this occurs after the first call to [addItem()](./foundation-layout.foundationlayout.additem.md)<!-- -->.
-
-When using the `LifecycleMixin`<!-- -->, the mixin can be used to gate lifecycle methods from running before the items are inside of the layout.
-

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

@@ -1,64 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [FoundationLayout](./foundation-layout.foundationlayout.md) &gt; [layoutRequiredRegistrations](./foundation-layout.foundationlayout.layoutrequiredregistrations.md)
-
-## FoundationLayout.layoutRequiredRegistrations() method
-
-Gets all of the required element registry function names for a set of config
-
-**Signature:**
-
-```typescript
-static layoutRequiredRegistrations(layout: SerialisedLayout): string[];
-```
-
-## Parameters
-
-<table><thead><tr><th>
-
-Parameter
-
-
-</th><th>
-
-Type
-
-
-</th><th>
-
-Description
-
-
-</th></tr></thead>
-<tbody><tr><td>
-
-layout
-
-
-</td><td>
-
-[SerialisedLayout](./foundation-layout.serialisedlayout.md)
-
-
-</td><td>
-
-any version of [SerialisedLayout](./foundation-layout.serialisedlayout.md) object describing the layout
-
-
-</td></tr>
-</tbody></table>
-
-**Returns:**
-
-string\[\]
-
-string\[\] - an item for each registered element in the config. These must all be added before [function](./foundation-layout.foundationlayout.loadlayout.md)
-
-## Exceptions
-
-- various errors if the layout parameter cannot be parsed
-
-## Remarks
-
-You can use this with [registeredItems](./foundation-layout.foundationlayout.registereditems.md) to work out what items you need to register with [registerItem()](./foundation-layout.foundationlayout.registeritem.md) before loading the layout with [loadLayout()](./foundation-layout.foundationlayout.loadlayout.md)
-

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

@@ -1,18 +0,0 @@
-<!-- Do not edit this file. It is automatically generated by API Documenter. -->
-
-[Home](./index.md) &gt; [@genesislcap/foundation-layout](./foundation-layout.md) &gt; [FoundationLayout](./foundation-layout.foundationlayout.md) &gt; [lifecycleUpdateToken](./foundation-layout.foundationlayout.lifecycleupdatetoken.md)
-
-## FoundationLayout.lifecycleUpdateToken property
-
-Used to calculate whether a layout item should run its lifecycle methods or not
-
-**Signature:**
-
-```typescript
-lifecycleUpdateToken: string | undefined;
-```
-
-## Remarks
-
-When using the `LifecycleMixin`<!-- -->, the mixin can be used to gate lifecycle methods from running when other items have been added or deleted. This key is updated every time one of these actions are performed, so you can check if the key has changed and know you potentially need to gate some of your lifecycle functionality.
-