@genesislcap/foundation-layout 14.231.1-alpha-b781bc2.0 → 14.231.1-alpha-9df9116.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/custom-elements.json +849 -881
  2. package/dist/dts/main/layout-main.d.ts +0 -2
  3. package/dist/dts/main/layout-main.d.ts.map +1 -1
  4. package/dist/esm/main/layout-main.js +0 -16
  5. package/dist/foundation-layout.api.json +0 -60
  6. package/dist/foundation-layout.d.ts +0 -2
  7. package/docs/api/foundation-layout.foundationlayout.md +0 -2
  8. package/docs/api-report.md +0 -4
  9. package/package.json +12 -12
  10. package/docs/api/foundation-layout.foundationlayout.showcloseicons.md +0 -11
  11. package/docs/api/foundation-layout.foundationlayout.showmaximiseicons.md +0 -11
package/dist/custom-elements.json CHANGED
@@ -139,47 +139,87 @@
139
139
  },
140
140
  {
141
141
  "kind": "javascript-module",
142
- "path": "src/main/index.ts",
143
- "declarations": [],
142
+ "path": "src/styles/constants.ts",
143
+ "declarations": [
144
+ {
145
+ "kind": "variable",
146
+ "name": "glVisualConfig",
147
+ "type": {
148
+ "text": "Omit<LayoutConfig, 'root'>"
149
+ },
150
+ "default": "{\n dimensions: {\n headerHeight: 38,\n borderWidth: 12,\n },\n header: {\n maximise: 'maximise',\n minimise: 'minimise',\n popout: false,\n },\n}"
151
+ },
152
+ {
153
+ "kind": "variable",
154
+ "name": "LAYOUT_ICONS",
155
+ "type": {
156
+ "text": "{\n renameSVG,\n maximiseSVG,\n minimiseSVG,\n closeSVG,\n tabDropdownSVG,\n popoutSVG,\n}"
157
+ },
158
+ "default": "{\n renameSVG,\n maximiseSVG,\n minimiseSVG,\n closeSVG,\n tabDropdownSVG,\n popoutSVG,\n}",
159
+ "description": "A collection of SVG icons in base64 format.",
160
+ "privacy": "public"
161
+ }
162
+ ],
144
163
  "exports": [
145
164
  {
146
165
  "kind": "js",
147
- "name": "FoundationLayoutItem",
166
+ "name": "glVisualConfig",
148
167
  "declaration": {
149
- "name": "FoundationLayoutItem",
150
- "module": "./layout-item"
168
+ "name": "glVisualConfig",
169
+ "module": "src/styles/constants.ts"
151
170
  }
152
171
  },
153
172
  {
154
173
  "kind": "js",
155
- "name": "FoundationLayoutRegion",
174
+ "name": "LAYOUT_ICONS",
156
175
  "declaration": {
157
- "name": "FoundationLayoutRegion",
158
- "module": "./layout-region"
176
+ "name": "LAYOUT_ICONS",
177
+ "module": "src/styles/constants.ts"
159
178
  }
160
- },
179
+ }
180
+ ]
181
+ },
182
+ {
183
+ "kind": "javascript-module",
184
+ "path": "src/styles/dragging.styles.ts",
185
+ "declarations": [
186
+ {
187
+ "kind": "variable",
188
+ "name": "globalDraggingStyles",
189
+ "default": "`\n .lm_dragProxy .lm_content {\n box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.9);\n }\n .lm_dropTargetIndicator {\n box-shadow: inset 0 0 30px #000000;\n outline: 1px dashed #cccccc;\n transition: all 200ms ease;\n }\n .lm_dropTargetIndicator .lm_inner {\n background: var(${neutralFillStealthRest.cssCustomProperty});\n opacity: 0.2;\n }\n .lm_dragProxy.lm_left .lm_header,\n .lm_dragProxy.lm_right .lm_header {\n width: 20px;\n float: left;\n vertical-align: top;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabs,\n .lm_dragProxy.lm_right .lm_header .lm_tabs {\n transform-origin: left top;\n top: 0;\n width: 1000px;\n }\n .lm_dragProxy.lm_left .lm_header .lm_controls,\n .lm_dragProxy.lm_right .lm_header .lm_controls {\n bottom: 0;\n }\n .lm_dragProxy.lm_left .lm_items,\n .lm_dragProxy.lm_right .lm_items {\n float: left;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabs {\n transform: rotate(-90deg) scaleX(-1);\n left: 0;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabs .lm_tab {\n transform: scaleX(-1);\n margin-top: 1px;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabdropdown_list {\n top: initial;\n right: initial;\n left: 20px;\n }\n .lm_dragProxy.lm_right .lm_content {\n float: left;\n }\n .lm_dragProxy.lm_right .lm_header .lm_tabs {\n transform: rotate(90deg) scaleX(1);\n left: 100%;\n margin-left: 0;\n }\n .lm_dragProxy.lm_right .lm_header .lm_controls {\n left: 3px;\n }\n .lm_dragProxy.lm_right .lm_header .lm_tabdropdown_list {\n top: initial;\n right: 20px;\n }\n .lm_dragProxy.lm_bottom .lm_header .lm_tab {\n margin-top: 0;\n border-top: none;\n }\n .lm_dragProxy.lm_bottom .lm_header .lm_controls,\n .lm_stack.lm_bottom .lm_header .lm_controls {\n top: 3px;\n }\n .lm_dragProxy.lm_bottom .lm_header .lm_tabdropdown_list,\n .lm_stack.lm_bottom .lm_header .lm_tabdropdown_list {\n top: initial;\n bottom: 20px;\n }\n .lm_dragProxy {\n cursor: move;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 30;\n }\n .lm_dragProxy .lm_header {\n background: transparent;\n }\n .lm_dragProxy .lm_title {\n color: white;\n padding-left: 10px;\n }\n .lm_dragProxy .lm_content {\n border-top: none;\n overflow: hidden;\n }\n .lm_dropTargetIndicator {\n display: none;\n position: absolute;\n z-index: 20;\n }\n .lm_dropTargetIndicator .lm_inner {\n width: 100%;\n height: 100%;\n position: relative;\n top: 0;\n left: 0;\n }\n .lm_transition_indicator {\n display: none;\n width: 20px;\n height: 20px;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 20;\n }\n`",
190
+ "description": "This is defined as a string rather than a css template\nbecause it is applied to a CSSStyleSheet object rather than\nused as a FAST template"
191
+ }
192
+ ],
193
+ "exports": [
161
194
  {
162
195
  "kind": "js",
163
- "name": "FoundationLayout",
196
+ "name": "globalDraggingStyles",
164
197
  "declaration": {
165
- "name": "FoundationLayout",
166
- "module": "./layout-main"
198
+ "name": "globalDraggingStyles",
199
+ "module": "src/styles/dragging.styles.ts"
167
200
  }
168
- },
201
+ }
202
+ ]
203
+ },
204
+ {
205
+ "kind": "javascript-module",
206
+ "path": "src/styles/index.ts",
207
+ "declarations": [],
208
+ "exports": [
169
209
  {
170
210
  "kind": "js",
171
- "name": "layoutStyles",
211
+ "name": "*",
172
212
  "declaration": {
173
- "name": "layoutStyles",
174
- "module": "./layout-main"
213
+ "name": "*",
214
+ "package": "./constants"
175
215
  }
176
216
  },
177
217
  {
178
218
  "kind": "js",
179
- "name": "layoutTemplate",
219
+ "name": "*",
180
220
  "declaration": {
181
- "name": "layoutTemplate",
182
- "module": "./layout-main"
221
+ "name": "*",
222
+ "package": "./dragging.styles"
183
223
  }
184
224
  },
185
225
  {
@@ -187,428 +227,720 @@
187
227
  "name": "*",
188
228
  "declaration": {
189
229
  "name": "*",
190
- "package": "./layout-components"
230
+ "package": "./layout.styles"
191
231
  }
192
232
  }
193
233
  ]
194
234
  },
195
235
  {
196
236
  "kind": "javascript-module",
197
- "path": "src/main/layout-components.ts",
237
+ "path": "src/styles/layout.styles.ts",
198
238
  "declarations": [
199
239
  {
200
240
  "kind": "variable",
201
- "name": "foundationLayoutComponents",
241
+ "name": "layoutStyles",
242
+ "default": "css`\n ${containerStyles}\n ${loadingSpinnerStyles}\n\n .lm_goldenlayout {\n padding: 1px;\n background: ${neutralLayer1};\n border-radius: calc(${controlCornerRadius} * 1.5px);\n }\n\n .lm_stack.lm_item {\n background-color: ${neutralLayer4};\n border-radius: calc(${controlCornerRadius} * 1.5px);\n }\n .lm_maximised .lm_header {\n background-color: ${neutralLayer4};\n border-radius: calc(${controlCornerRadius} * 1.5px);\n position: unset;\n }\n\n .lm_maximised .lm_header .lm_tabs {\n z-index: 3;\n }\n\n .lm_content {\n background-color: ${neutralLayer3};\n border-radius: calc(${controlCornerRadius} * 1.5px);\n border: 1px solid;\n border-color: #2e3339;\n box-sizing: border-box;\n }\n\n .lm-header {\n z-index: 1;\n }\n .lm_header .lm_tabs {\n padding: 0 16px;\n }\n\n .lm_stack > .lm_items {\n z-index: 2;\n box-shadow: 0px -1px 15px rgba(0, 0, 0, 0.35);\n }\n\n .lm_header .lm_tab.lm_active.lm_focused {\n background-color: ${neutralLayer3};\n }\n .lm_header .lm_tab.lm_active {\n background-color: ${neutralLayer3};\n border: 1px solid;\n border-color: #2e3339;\n border-bottom: 0;\n color: ${accentFillRest};\n }\n\n .lm_header .lm_tab {\n align-items: center;\n background-color: ${neutralLayer4};\n border: 1px solid;\n border-bottom-color: #2e3339;\n border-bottom: 0px solid;\n border-color: rgba(0, 0, 0, 0.35);\n border-radius: calc(${controlCornerRadius} * 1.5px) calc(${controlCornerRadius} * 1.5px) 0 0;\n box-shadow: 1px -1px 2px rgba(0, 0, 0, 0.35);\n color: rgba(255, 255, 255, 0.3);\n display: flex;\n font-family: inherit;\n font-size: 13px;\n font-weight: 700;\n height: 30px;\n margin-right: 2px;\n margin-top: 3px;\n padding: 2px 16px;\n }\n\n .lm_header .lm_tab:not(.lm_active):hover {\n background-color: rgba(255, 255, 255, 0.1);\n color: #f1f1f1;\n }\n\n .lm_header .lm_controls {\n top: 4px;\n display: flex;\n }\n .lm_header .lm_controls > * {\n width: 30px;\n height: 30px;\n background-repeat: no-repeat;\n background-position: center;\n background-size: 16px;\n background-color: rgba(255, 255, 255, 0.03);\n border-radius: calc(${controlCornerRadius} * 1.5px);\n margin-right: 4px;\n top: 3px;\n opacity: 1;\n }\n .lm_header .lm_controls > *:hover {\n background-color: rgba(255, 255, 255, 0.1);\n cursor: pointer;\n }\n\n .lm_controls .lm_maximise {\n background-image: url('${LAYOUT_ICONS.maximiseSVG}');\n }\n .lm_maximised .lm_controls .lm_maximise {\n background-image: url('${LAYOUT_ICONS.minimiseSVG}');\n }\n .lm_controls .lm_close {\n background-image: url('${LAYOUT_ICONS.closeSVG}');\n }\n .lm_header .lm_tab .lm_close_tab {\n background-image: url('${LAYOUT_ICONS.closeSVG}');\n background-size: 10px;\n background-repeat: no-repeat;\n margin-left: 12px;\n position: relative;\n top: 0;\n right: 0;\n }\n\n .lm_header .lm_tab.lm_active {\n padding: 4px 25px 3px 10px;\n }\n\n .lm_header .lm_tab:not(.lm_active) .lm_title {\n color: ${accentFillRest};\n opacity: 0.7;\n }\n\n .lm_header .lm_controls .lm_tabdropdown::before {\n content: none;\n }\n .lm_header .lm_controls .lm_tabdropdown {\n background-image: url('${LAYOUT_ICONS.tabDropdownSVG}');\n }\n .lm_header .lm_tabdropdown_list {\n top: 38px;\n right: 108px;\n background-color: ${neutralLayer3};\n border: 1px solid;\n border-color: #2e3339;\n border-radius: calc(${controlCornerRadius} * 1.5px);\n box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.35);\n }\n .lm_header .lm_tabdropdown_list > .lm_tab {\n box-shadow: none;\n padding: 0 16px;\n white-space: nowrap;\n background-color: transparent;\n color: #c9c9c9;\n height: 36px;\n border-radius: 0;\n overflow: visible;\n text-overflow: normal;\n }\n .lm_header .lm_tabdropdown_list > .lm_tab:last-child {\n border-bottom: 0;\n }\n\n /* gl base styles start */\n .lm_root {\n position: relative;\n }\n .lm_row > .lm_item {\n float: left;\n }\n .lm_content {\n overflow: hidden;\n position: relative;\n }\n .lm_dragging,\n .lm_dragging * {\n cursor: move !important;\n user-select: none;\n }\n .lm_maximised {\n left: 0;\n padding: 1px;\n position: absolute;\n top: 0;\n z-index: 40;\n }\n .lm_maximise_placeholder {\n display: none;\n }\n .lm_splitter {\n position: relative;\n z-index: 20;\n }\n .lm_splitter:hover,\n .lm_splitter.lm_dragging {\n background: ${accentFillRest};\n border-radius: calc(${controlCornerRadius} * 4px);\n }\n .lm_splitter.lm_vertical .lm_drag_handle {\n width: 100%;\n height: 15px;\n position: absolute;\n top: -5px;\n cursor: ns-resize !important;\n }\n .lm_splitter.lm_horizontal {\n float: left;\n height: 100%;\n }\n .lm_splitter.lm_horizontal .lm_drag_handle {\n width: 15px;\n height: 100%;\n position: absolute;\n left: -5px;\n cursor: ew-resize !important;\n }\n .lm_header {\n overflow: visible;\n position: relative;\n z-index: 1;\n }\n .lm_header [class^='lm_'] {\n box-sizing: content-box !important;\n }\n .lm_header .lm_controls {\n position: absolute;\n right: 3px;\n }\n .lm_header .lm_controls > li {\n cursor: pointer;\n float: left;\n width: 18px;\n height: 18px;\n text-align: center;\n }\n .lm_header ul {\n margin: 0;\n padding: 0;\n list-style-type: none;\n }\n .lm_header .lm_tabs {\n position: absolute;\n }\n .lm_header .lm_tab {\n cursor: pointer;\n float: left;\n margin-top: 1px;\n padding: 3px 25px 3px 10px;\n position: relative;\n }\n .lm_header .lm_tab i {\n width: 2px;\n height: 19px;\n position: absolute;\n }\n .lm_header .lm_tab i.lm_left {\n top: 0;\n left: -2px;\n }\n .lm_header .lm_tab i.lm_right {\n top: 0;\n right: -2px;\n }\n .lm_header .lm_tab .lm_title {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n user-select: none;\n }\n .lm_header .lm_tab .lm_title:only-child {\n padding-left: 10px;\n }\n .lm_header .lm_tab .lm_close_tab {\n width: 14px;\n height: 14px;\n position: absolute;\n top: 11px;\n right: 0;\n text-align: center;\n }\n .lm_stack.lm_left .lm_header,\n .lm_stack.lm_right .lm_header {\n height: 100%;\n }\n .lm_dragProxy.lm_left .lm_header,\n .lm_dragProxy.lm_right .lm_header,\n .lm_stack.lm_left .lm_header,\n .lm_stack.lm_right .lm_header {\n width: 20px;\n float: left;\n vertical-align: top;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabs,\n .lm_dragProxy.lm_right .lm_header .lm_tabs,\n .lm_stack.lm_left .lm_header .lm_tabs,\n .lm_stack.lm_right .lm_header .lm_tabs {\n transform-origin: left top;\n top: 0;\n width: 1000px;\n }\n .lm_dragProxy.lm_left .lm_header .lm_controls,\n .lm_dragProxy.lm_right .lm_header .lm_controls,\n .lm_stack.lm_left .lm_header .lm_controls,\n .lm_stack.lm_right .lm_header .lm_controls {\n bottom: 0;\n }\n .lm_dragProxy.lm_left .lm_items,\n .lm_dragProxy.lm_right .lm_items,\n .lm_stack.lm_left .lm_items,\n .lm_stack.lm_right .lm_items {\n float: left;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabs,\n .lm_stack.lm_left .lm_header .lm_tabs {\n transform: rotate(-90deg) scaleX(-1);\n left: 0;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabs .lm_tab,\n .lm_stack.lm_left .lm_header .lm_tabs .lm_tab {\n transform: scaleX(-1);\n margin-top: 1px;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabdropdown_list,\n .lm_stack.lm_left .lm_header .lm_tabdropdown_list {\n top: initial;\n right: initial;\n left: 20px;\n }\n .lm_dragProxy.lm_right .lm_content {\n float: left;\n }\n .lm_dragProxy.lm_right .lm_header .lm_tabs,\n .lm_stack.lm_right .lm_header .lm_tabs {\n transform: rotate(90deg) scaleX(1);\n left: 100%;\n margin-left: 0;\n }\n .lm_dragProxy.lm_right .lm_header .lm_controls,\n .lm_stack.lm_right .lm_header .lm_controls {\n left: 3px;\n }\n .lm_dragProxy.lm_right .lm_header .lm_tabdropdown_list,\n .lm_stack.lm_right .lm_header .lm_tabdropdown_list {\n top: initial;\n right: 20px;\n }\n .lm_dragProxy.lm_bottom .lm_header .lm_tab,\n .lm_stack.lm_bottom .lm_header .lm_tab {\n margin-top: 0;\n border-top: none;\n }\n .lm_dragProxy.lm_bottom .lm_header .lm_controls,\n .lm_stack.lm_bottom .lm_header .lm_controls {\n top: 3px;\n }\n .lm_dragProxy.lm_bottom .lm_header .lm_tabdropdown_list,\n .lm_stack.lm_bottom .lm_header .lm_tabdropdown_list {\n top: initial;\n bottom: 20px;\n }\n .lm_drop_tab_placeholder {\n float: left;\n width: 100px;\n height: 10px;\n visibility: hidden;\n }\n .lm_header .lm_tabdropdown_list {\n position: absolute;\n top: 20px;\n right: 0;\n z-index: 5;\n overflow: hidden;\n }\n .lm_header .lm_tabdropdown_list .lm_tab {\n clear: both;\n padding-right: 10px;\n margin: 0;\n }\n .lm_header .lm_tabdropdown_list .lm_tab .lm_title {\n width: 100px;\n }\n .lm_header .lm_tabdropdown_list .lm_close_tab {\n display: none !important;\n }\n .lm_dragProxy {\n position: absolute;\n top: 0;\n left: 0;\n z-index: 30;\n }\n .lm_dragProxy .lm_header {\n background: transparent;\n }\n .lm_dragProxy .lm_content {\n border-top: none;\n overflow: hidden;\n }\n .lm_dropTargetIndicator {\n display: none;\n position: absolute;\n z-index: 20;\n }\n .lm_dropTargetIndicator .lm_inner {\n width: 100%;\n height: 100%;\n position: relative;\n top: 0;\n left: 0;\n }\n .lm_transition_indicator {\n display: none;\n width: 20px;\n height: 20px;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 20;\n }\n .lm_popin {\n width: 20px;\n height: 20px;\n position: absolute;\n bottom: 0;\n right: 0;\n z-index: 9999;\n }\n .lm_popin > * {\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n }\n .lm_popin > .lm_bg {\n z-index: 10;\n }\n .lm_popin > .lm_icon {\n z-index: 20;\n } /*# sourceMappingURL=goldenlayout-base.css.map */\n`",
243
+ "description": "`ElementStyles` which defines the css for FoundationLayout.",
244
+ "privacy": "public"
245
+ }
246
+ ],
247
+ "exports": [
248
+ {
249
+ "kind": "js",
250
+ "name": "layoutStyles",
251
+ "declaration": {
252
+ "name": "layoutStyles",
253
+ "module": "src/styles/layout.styles.ts"
254
+ }
255
+ }
256
+ ]
257
+ },
258
+ {
259
+ "kind": "javascript-module",
260
+ "path": "src/utils/constants.ts",
261
+ "declarations": [
262
+ {
263
+ "kind": "variable",
264
+ "name": "DEFAULT_RELOAD_BUFFER",
202
265
  "type": {
203
- "text": "object"
266
+ "text": "number"
204
267
  },
205
- "default": "{\n foundationLayout,\n foundationLayoutRegion,\n foundationLayoutItem,\n register(container?: Container, ...rest: any[]) {\n if (!container) {\n // preserve backward compatibility with code that loops through\n // the values of this object and calls them as funcs with no args\n return;\n }\n for (const key in this) {\n if (key === 'register') {\n continue;\n }\n this[key]().register(container, ...rest);\n }\n },\n}",
206
- "description": "Registration object to register the layout with your design system.",
268
+ "default": "500",
269
+ "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.",
207
270
  "privacy": "public"
271
+ },
272
+ {
273
+ "kind": "variable",
274
+ "name": "LAYOUT_POPOUT_CONTAINER_CLASS",
275
+ "type": {
276
+ "text": "string"
277
+ },
278
+ "default": "'f-layout-popout'",
279
+ "description": "Put this classname on an element which is a DOM parent of the layout, and\nif the layout goes into popout mode then it will place itself as the only child\nfor the popout container you set."
208
280
  }
209
281
  ],
210
282
  "exports": [
211
283
  {
212
284
  "kind": "js",
213
- "name": "foundationLayoutComponents",
285
+ "name": "DEFAULT_RELOAD_BUFFER",
214
286
  "declaration": {
215
- "name": "foundationLayoutComponents",
216
- "module": "src/main/layout-components.ts"
287
+ "name": "DEFAULT_RELOAD_BUFFER",
288
+ "module": "src/utils/constants.ts"
289
+ }
290
+ },
291
+ {
292
+ "kind": "js",
293
+ "name": "LAYOUT_POPOUT_CONTAINER_CLASS",
294
+ "declaration": {
295
+ "name": "LAYOUT_POPOUT_CONTAINER_CLASS",
296
+ "module": "src/utils/constants.ts"
217
297
  }
218
298
  }
219
299
  ]
220
300
  },
221
301
  {
222
302
  "kind": "javascript-module",
223
- "path": "src/main/layout-item.ts",
303
+ "path": "src/utils/error.ts",
224
304
  "declarations": [
225
305
  {
226
306
  "kind": "class",
227
307
  "description": "",
228
- "name": "FoundationLayoutItem",
229
- "members": [
230
- {
231
- "kind": "field",
232
- "name": "title",
233
- "type": {
234
- "text": "string"
235
- },
236
- "description": "Sets the title of the item which is displayed on the tab.",
237
- "privacy": "public"
238
- },
239
- {
240
- "kind": "field",
241
- "name": "closable",
242
- "type": {
243
- "text": "boolean"
244
- },
245
- "default": "false",
246
- "description": "Boolean attribute controls whether the window can be closed in the GUI.\nDefaults to `false`.",
247
- "privacy": "public"
248
- },
249
- {
250
- "kind": "field",
251
- "name": "size",
252
- "type": {
253
- "text": "string"
254
- },
255
- "description": "optional string describing the size of the new item (see the written documentation for more info)",
256
- "privacy": "public"
257
- },
258
- {
259
- "kind": "field",
260
- "name": "registration",
261
- "type": {
262
- "text": "string"
263
- },
264
- "description": "Sets the registration name for the item, which can be used later to add the item via the JavaScript API using FoundationLayout.addItem.",
265
- "privacy": "public"
266
- },
267
- {
268
- "kind": "field",
269
- "name": "_presentation",
270
- "type": {
271
- "text": "ComponentPresentation | null | undefined"
272
- },
273
- "privacy": "private",
274
- "default": "void 0",
275
- "inheritedFrom": {
276
- "name": "FoundationElement",
277
- "module": "src/foundation-element/foundation-element.ts"
278
- }
279
- },
280
- {
281
- "kind": "field",
282
- "name": "$presentation",
283
- "type": {
284
- "text": "ComponentPresentation | null"
285
- },
286
- "privacy": "public",
287
- "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
288
- "inheritedFrom": {
289
- "name": "FoundationElement",
290
- "module": "src/foundation-element/foundation-element.ts"
291
- }
292
- },
293
- {
294
- "kind": "field",
295
- "name": "template",
296
- "type": {
297
- "text": "ElementViewTemplate | void | null"
298
- },
299
- "privacy": "public",
300
- "description": "Sets the template of the element instance. When undefined,\nthe element will attempt to resolve the template from\nthe associated presentation or custom element definition.",
301
- "inheritedFrom": {
302
- "name": "FoundationElement",
303
- "module": "src/foundation-element/foundation-element.ts"
304
- }
305
- },
306
- {
307
- "kind": "method",
308
- "name": "templateChanged",
309
- "privacy": "protected",
310
- "return": {
311
- "type": {
312
- "text": "void"
313
- }
314
- },
315
- "inheritedFrom": {
316
- "name": "FoundationElement",
317
- "module": "src/foundation-element/foundation-element.ts"
318
- }
319
- },
320
- {
321
- "kind": "field",
322
- "name": "styles",
323
- "type": {
324
- "text": "ElementStyles | void | null"
325
- },
326
- "privacy": "public",
327
- "description": "Sets the default styles for the element instance. When undefined,\nthe element will attempt to resolve default styles from\nthe associated presentation or custom element definition.",
328
- "inheritedFrom": {
329
- "name": "FoundationElement",
330
- "module": "src/foundation-element/foundation-element.ts"
331
- }
332
- },
333
- {
334
- "kind": "method",
335
- "name": "stylesChanged",
336
- "privacy": "protected",
337
- "return": {
338
- "type": {
339
- "text": "void"
340
- }
341
- },
342
- "inheritedFrom": {
343
- "name": "FoundationElement",
344
- "module": "src/foundation-element/foundation-element.ts"
345
- }
346
- },
347
- {
348
- "kind": "method",
349
- "name": "compose",
350
- "privacy": "public",
351
- "static": true,
352
- "return": {
353
- "type": {
354
- "text": "(\n overrideDefinition?: OverrideFoundationElementDefinition<T>\n ) => FoundationElementRegistry<T, K>"
355
- }
356
- },
357
- "parameters": [
358
- {
359
- "name": "this",
360
- "type": {
361
- "text": "K"
362
- }
363
- },
364
- {
365
- "name": "elementDefinition",
366
- "type": {
367
- "text": "T"
368
- },
369
- "description": "The definition of the element to create the registry\nfunction for."
370
- }
371
- ],
372
- "description": "Defines an element registry function with a set of element definition defaults.",
373
- "inheritedFrom": {
374
- "name": "FoundationElement",
375
- "module": "src/foundation-element/foundation-element.ts"
376
- }
377
- }
378
- ],
379
- "attributes": [
380
- {
381
- "name": "title",
382
- "type": {
383
- "text": "string"
384
- },
385
- "description": "Sets the title of the item which is displayed on the tab.",
386
- "fieldName": "title"
387
- },
388
- {
389
- "type": {
390
- "text": "boolean"
391
- },
392
- "default": "false",
393
- "description": "Boolean attribute controls whether the window can be closed in the GUI.\nDefaults to `false`.",
394
- "fieldName": "closable"
395
- },
396
- {
397
- "name": "size",
398
- "type": {
399
- "text": "string"
400
- },
401
- "description": "optional string describing the size of the new item (see the written documentation for more info)",
402
- "fieldName": "size"
403
- },
404
- {
405
- "name": "registration",
406
- "type": {
407
- "text": "string"
408
- },
409
- "description": "Sets the registration name for the item, which can be used later to add the item via the JavaScript API using FoundationLayout.addItem.",
410
- "fieldName": "registration"
411
- }
412
- ],
308
+ "name": "LayoutUsageError",
413
309
  "superclass": {
414
- "name": "FoundationElement",
415
- "package": "@microsoft/fast-foundation"
310
+ "name": "Error",
311
+ "module": "src/utils/error.ts"
312
+ }
313
+ },
314
+ {
315
+ "kind": "class",
316
+ "description": "",
317
+ "name": "LayoutRegistrationError",
318
+ "superclass": {
319
+ "name": "Error",
320
+ "module": "src/utils/error.ts"
321
+ }
322
+ }
323
+ ],
324
+ "exports": [
325
+ {
326
+ "kind": "js",
327
+ "name": "LayoutUsageError",
328
+ "declaration": {
329
+ "name": "LayoutUsageError",
330
+ "module": "src/utils/error.ts"
331
+ }
332
+ },
333
+ {
334
+ "kind": "js",
335
+ "name": "LayoutRegistrationError",
336
+ "declaration": {
337
+ "name": "LayoutRegistrationError",
338
+ "module": "src/utils/error.ts"
339
+ }
340
+ }
341
+ ]
342
+ },
343
+ {
344
+ "kind": "javascript-module",
345
+ "path": "src/utils/events.ts",
346
+ "declarations": [
347
+ {
348
+ "kind": "variable",
349
+ "name": "LayoutEmitEvents",
350
+ "type": {
351
+ "text": "{\n firstLoaded: 'first-loaded',\n itemAdded: 'item-added',\n itemRemoved: 'item-removed',\n itemResized: 'item-resized',\n}"
416
352
  },
417
- "tagName": "%%prefix%%-layout-item",
418
- "customElement": true
353
+ "default": "{\n firstLoaded: 'first-loaded',\n itemAdded: 'item-added',\n itemRemoved: 'item-removed',\n itemResized: 'item-resized',\n}",
354
+ "description": "Defines events that the layout system emits\n\n'firstLoaded' - emitted when the layout has finished loading the first time\nusing the declarative API after DEFAULT_RELOAD_BUFFER ms.\n<br/>\n'itemAdded' - emitted when an item is added to the layout'\n<br/>\n'itemRemoved' - emitted when an item is removed from the layout'\n<br/>\n'itemResized' - emitted when the user drags the divider to resize elements",
355
+ "privacy": "public"
356
+ },
357
+ {
358
+ "kind": "variable",
359
+ "name": "LayoutReceiveEvents",
360
+ "type": {
361
+ "text": "{\n changeTitle: 'change-title',\n autosave: 'autosave',\n}"
362
+ },
363
+ "default": "{\n changeTitle: 'change-title',\n autosave: 'autosave',\n}",
364
+ "description": "Defines events that the layout system listens for\n\n'changeTitle' - emit this from a contained item to update the title of the window that contains it.\n'autosave' - emit this from a contained item to hint to the layout system that it should autosave the layout. A contained item should do this if it has just changed some state it would like to persist. See LayoutComponentWithState.",
365
+ "privacy": "public"
419
366
  }
420
367
  ],
421
368
  "exports": [
422
369
  {
423
370
  "kind": "js",
424
- "name": "FoundationLayoutItem",
371
+ "name": "LayoutEmitEvents",
425
372
  "declaration": {
426
- "name": "FoundationLayoutItem",
427
- "module": "src/main/layout-item.ts"
373
+ "name": "LayoutEmitEvents",
374
+ "module": "src/utils/events.ts"
375
+ }
376
+ },
377
+ {
378
+ "kind": "js",
379
+ "name": "LayoutReceiveEvents",
380
+ "declaration": {
381
+ "name": "LayoutReceiveEvents",
382
+ "module": "src/utils/events.ts"
428
383
  }
429
384
  }
430
385
  ]
431
386
  },
432
387
  {
433
388
  "kind": "javascript-module",
434
- "path": "src/main/layout-main.ts",
389
+ "path": "src/utils/index.ts",
390
+ "declarations": [],
391
+ "exports": [
392
+ {
393
+ "kind": "js",
394
+ "name": "*",
395
+ "declaration": {
396
+ "name": "*",
397
+ "package": "./constants"
398
+ }
399
+ },
400
+ {
401
+ "kind": "js",
402
+ "name": "*",
403
+ "declaration": {
404
+ "name": "*",
405
+ "package": "./error"
406
+ }
407
+ },
408
+ {
409
+ "kind": "js",
410
+ "name": "*",
411
+ "declaration": {
412
+ "name": "*",
413
+ "package": "./events"
414
+ }
415
+ },
416
+ {
417
+ "kind": "js",
418
+ "name": "*",
419
+ "declaration": {
420
+ "name": "*",
421
+ "package": "./misc"
422
+ }
423
+ },
424
+ {
425
+ "kind": "js",
426
+ "name": "*",
427
+ "declaration": {
428
+ "name": "*",
429
+ "package": "./templates"
430
+ }
431
+ },
432
+ {
433
+ "kind": "js",
434
+ "name": "*",
435
+ "declaration": {
436
+ "name": "*",
437
+ "package": "./types"
438
+ }
439
+ },
440
+ {
441
+ "kind": "js",
442
+ "name": "*",
443
+ "declaration": {
444
+ "name": "*",
445
+ "package": "./error"
446
+ }
447
+ }
448
+ ]
449
+ },
450
+ {
451
+ "kind": "javascript-module",
452
+ "path": "src/utils/logger.ts",
435
453
  "declarations": [
436
454
  {
437
- "kind": "class",
438
- "description": "",
439
- "name": "FoundationLayout",
440
- "members": [
441
- {
442
- "kind": "field",
443
- "name": "layout",
444
- "type": {
445
- "text": "GoldenLayout"
446
- },
447
- "privacy": "private"
448
- },
449
- {
450
- "kind": "field",
451
- "name": "layoutConfig",
452
- "type": {
453
- "text": "LayoutConfig"
454
- },
455
- "privacy": "private",
456
- "default": "{ root: undefined }"
457
- },
458
- {
459
- "kind": "field",
460
- "name": "reloadBuffer",
461
- "type": {
462
- "text": "number"
463
- },
464
- "default": "DEFAULT_RELOAD_BUFFER",
465
- "description": "Number describing how long to wait in ms before reloading the config when adding items\ndeclaratively by the html API. Default 500 (ms).",
466
- "privacy": "public"
467
- },
468
- {
469
- "kind": "field",
470
- "name": "reloadPending",
471
- "type": {
472
- "text": "boolean"
473
- },
474
- "privacy": "private",
475
- "default": "false"
476
- },
477
- {
478
- "kind": "field",
479
- "name": "registeredComponents",
480
- "type": {
481
- "text": "number"
482
- },
483
- "privacy": "private",
484
- "default": "0"
485
- },
486
- {
487
- "kind": "field",
488
- "name": "autoSaveKey",
489
- "type": {
490
- "text": "string | undefined"
491
- },
492
- "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`.",
493
- "privacy": "public"
494
- },
495
- {
496
- "kind": "field",
497
- "name": "missingItemPlaceholder",
498
- "description": "Function which is used to generate the placeholder text when a layout is loaded\nwith a missing item.",
499
- "privacy": "public"
500
- },
455
+ "kind": "variable",
456
+ "name": "logger"
457
+ }
458
+ ],
459
+ "exports": [
460
+ {
461
+ "kind": "js",
462
+ "name": "logger",
463
+ "declaration": {
464
+ "name": "logger",
465
+ "module": "src/utils/logger.ts"
466
+ }
467
+ }
468
+ ]
469
+ },
470
+ {
471
+ "kind": "javascript-module",
472
+ "path": "src/utils/misc.ts",
473
+ "declarations": [],
474
+ "exports": []
475
+ },
476
+ {
477
+ "kind": "javascript-module",
478
+ "path": "src/utils/templates.ts",
479
+ "declarations": [],
480
+ "exports": []
481
+ },
482
+ {
483
+ "kind": "javascript-module",
484
+ "path": "src/utils/types.ts",
485
+ "declarations": [],
486
+ "exports": []
487
+ },
488
+ {
489
+ "kind": "javascript-module",
490
+ "path": "src/main/index.ts",
491
+ "declarations": [],
492
+ "exports": [
493
+ {
494
+ "kind": "js",
495
+ "name": "FoundationLayoutItem",
496
+ "declaration": {
497
+ "name": "FoundationLayoutItem",
498
+ "module": "./layout-item"
499
+ }
500
+ },
501
+ {
502
+ "kind": "js",
503
+ "name": "FoundationLayoutRegion",
504
+ "declaration": {
505
+ "name": "FoundationLayoutRegion",
506
+ "module": "./layout-region"
507
+ }
508
+ },
509
+ {
510
+ "kind": "js",
511
+ "name": "FoundationLayout",
512
+ "declaration": {
513
+ "name": "FoundationLayout",
514
+ "module": "./layout-main"
515
+ }
516
+ },
517
+ {
518
+ "kind": "js",
519
+ "name": "layoutStyles",
520
+ "declaration": {
521
+ "name": "layoutStyles",
522
+ "module": "./layout-main"
523
+ }
524
+ },
525
+ {
526
+ "kind": "js",
527
+ "name": "layoutTemplate",
528
+ "declaration": {
529
+ "name": "layoutTemplate",
530
+ "module": "./layout-main"
531
+ }
532
+ },
533
+ {
534
+ "kind": "js",
535
+ "name": "*",
536
+ "declaration": {
537
+ "name": "*",
538
+ "package": "./layout-components"
539
+ }
540
+ }
541
+ ]
542
+ },
543
+ {
544
+ "kind": "javascript-module",
545
+ "path": "src/main/layout-components.ts",
546
+ "declarations": [
547
+ {
548
+ "kind": "variable",
549
+ "name": "foundationLayoutComponents",
550
+ "type": {
551
+ "text": "object"
552
+ },
553
+ "default": "{\n foundationLayout,\n foundationLayoutRegion,\n foundationLayoutItem,\n register(container?: Container, ...rest: any[]) {\n if (!container) {\n // preserve backward compatibility with code that loops through\n // the values of this object and calls them as funcs with no args\n return;\n }\n for (const key in this) {\n if (key === 'register') {\n continue;\n }\n this[key]().register(container, ...rest);\n }\n },\n}",
554
+ "description": "Registration object to register the layout with your design system.",
555
+ "privacy": "public"
556
+ }
557
+ ],
558
+ "exports": [
559
+ {
560
+ "kind": "js",
561
+ "name": "foundationLayoutComponents",
562
+ "declaration": {
563
+ "name": "foundationLayoutComponents",
564
+ "module": "src/main/layout-components.ts"
565
+ }
566
+ }
567
+ ]
568
+ },
569
+ {
570
+ "kind": "javascript-module",
571
+ "path": "src/main/layout-item.ts",
572
+ "declarations": [
573
+ {
574
+ "kind": "class",
575
+ "description": "",
576
+ "name": "FoundationLayoutItem",
577
+ "members": [
501
578
  {
502
579
  "kind": "field",
503
- "name": "dimensionsConfig",
580
+ "name": "title",
504
581
  "type": {
505
- "text": "LayoutConfig.Dimensions | undefined"
582
+ "text": "string"
506
583
  },
507
- "description": "Apply dimensions config to the layout, such as setting the size of the drag handles.",
584
+ "description": "Sets the title of the item which is displayed on the tab.",
508
585
  "privacy": "public"
509
586
  },
510
587
  {
511
588
  "kind": "field",
512
- "name": "hasFirstLoaded",
589
+ "name": "closable",
513
590
  "type": {
514
591
  "text": "boolean"
515
592
  },
516
593
  "default": "false",
517
- "description": "Boolean signifies whether the layout has loaded for the first time or not.",
594
+ "description": "Boolean attribute controls whether the window can be closed in the GUI.\nDefaults to `false`.",
518
595
  "privacy": "public"
519
596
  },
520
597
  {
521
598
  "kind": "field",
522
- "name": "customButtons",
599
+ "name": "size",
523
600
  "type": {
524
- "text": "CustomButton[]"
601
+ "text": "string"
525
602
  },
526
- "default": "[]",
527
- "description": "Set custom button definition on this property to add them to the layout header controls",
603
+ "description": "optional string describing the size of the new item (see the written documentation for more info)",
528
604
  "privacy": "public"
529
605
  },
530
606
  {
531
607
  "kind": "field",
532
- "name": "dragging",
608
+ "name": "registration",
533
609
  "type": {
534
- "text": "boolean"
610
+ "text": "string"
535
611
  },
536
- "default": "false",
612
+ "description": "Sets the registration name for the item, which can be used later to add the item via the JavaScript API using FoundationLayout.addItem.",
537
613
  "privacy": "public"
538
614
  },
539
615
  {
540
616
  "kind": "field",
541
- "name": "class",
542
- "privacy": "public",
543
- "default": "'FoundationLayoutMain'",
617
+ "name": "_presentation",
544
618
  "type": {
545
- "text": "'FoundationLayoutMain'"
619
+ "text": "ComponentPresentation | null | undefined"
620
+ },
621
+ "privacy": "private",
622
+ "default": "void 0",
623
+ "inheritedFrom": {
624
+ "name": "FoundationElement",
625
+ "module": "src/foundation-element/foundation-element.ts"
546
626
  }
547
627
  },
548
628
  {
549
629
  "kind": "field",
550
- "name": "lifecycleUpdateToken",
630
+ "name": "$presentation",
551
631
  "type": {
552
- "text": "string | undefined"
632
+ "text": "ComponentPresentation | null"
553
633
  },
554
634
  "privacy": "public",
555
- "default": "undefined",
556
- "description": "Used to calculate whether a layout item should run its lifecycle methods or not"
635
+ "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
636
+ "inheritedFrom": {
637
+ "name": "FoundationElement",
638
+ "module": "src/foundation-element/foundation-element.ts"
639
+ }
557
640
  },
558
641
  {
559
642
  "kind": "field",
560
- "name": "popoutConfig",
643
+ "name": "template",
561
644
  "type": {
562
- "text": "string | undefined"
645
+ "text": "ElementViewTemplate | void | null"
563
646
  },
564
- "default": "undefined",
565
- "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."
647
+ "privacy": "public",
648
+ "description": "Sets the template of the element instance. When undefined,\nthe element will attempt to resolve the template from\nthe associated presentation or custom element definition.",
649
+ "inheritedFrom": {
650
+ "name": "FoundationElement",
651
+ "module": "src/foundation-element/foundation-element.ts"
652
+ }
566
653
  },
567
654
  {
568
- "kind": "field",
569
- "name": "popupMode",
570
- "type": {
571
- "text": "boolean"
655
+ "kind": "method",
656
+ "name": "templateChanged",
657
+ "privacy": "protected",
658
+ "return": {
659
+ "type": {
660
+ "text": "void"
661
+ }
572
662
  },
573
- "privacy": "private",
574
- "default": "false"
663
+ "inheritedFrom": {
664
+ "name": "FoundationElement",
665
+ "module": "src/foundation-element/foundation-element.ts"
666
+ }
575
667
  },
576
668
  {
577
669
  "kind": "field",
578
- "name": "showCloseIcons",
670
+ "name": "styles",
579
671
  "type": {
580
- "text": "boolean"
672
+ "text": "ElementStyles | void | null"
581
673
  },
582
- "default": "false"
674
+ "privacy": "public",
675
+ "description": "Sets the default styles for the element instance. When undefined,\nthe element will attempt to resolve default styles from\nthe associated presentation or custom element definition.",
676
+ "inheritedFrom": {
677
+ "name": "FoundationElement",
678
+ "module": "src/foundation-element/foundation-element.ts"
679
+ }
583
680
  },
584
681
  {
585
- "kind": "field",
586
- "name": "showMaximiseIcons",
587
- "type": {
588
- "text": "boolean"
682
+ "kind": "method",
683
+ "name": "stylesChanged",
684
+ "privacy": "protected",
685
+ "return": {
686
+ "type": {
687
+ "text": "void"
688
+ }
589
689
  },
590
- "default": "false"
690
+ "inheritedFrom": {
691
+ "name": "FoundationElement",
692
+ "module": "src/foundation-element/foundation-element.ts"
693
+ }
591
694
  },
592
695
  {
593
696
  "kind": "method",
594
- "name": "layoutRequiredRegistrations",
697
+ "name": "compose",
698
+ "privacy": "public",
595
699
  "static": true,
596
700
  "return": {
597
701
  "type": {
598
- "text": ""
702
+ "text": "(\n overrideDefinition?: OverrideFoundationElementDefinition<T>\n ) => FoundationElementRegistry<T, K>"
599
703
  }
600
704
  },
601
705
  "parameters": [
602
706
  {
603
- "name": "layout",
707
+ "name": "this",
604
708
  "type": {
605
- "text": "SerialisedLayout"
709
+ "text": "K"
710
+ }
711
+ },
712
+ {
713
+ "name": "elementDefinition",
714
+ "type": {
715
+ "text": "T"
606
716
  },
607
- "description": "any version of {@link SerialisedLayout}object describing the layout\n * "
717
+ "description": "The definition of the element to create the registry\nfunction for."
608
718
  }
609
719
  ],
610
- "description": "JS API, public",
611
- "privacy": "public"
720
+ "description": "Defines an element registry function with a set of element definition defaults.",
721
+ "inheritedFrom": {
722
+ "name": "FoundationElement",
723
+ "module": "src/foundation-element/foundation-element.ts"
724
+ }
725
+ }
726
+ ],
727
+ "attributes": [
728
+ {
729
+ "name": "title",
730
+ "type": {
731
+ "text": "string"
732
+ },
733
+ "description": "Sets the title of the item which is displayed on the tab.",
734
+ "fieldName": "title"
735
+ },
736
+ {
737
+ "type": {
738
+ "text": "boolean"
739
+ },
740
+ "default": "false",
741
+ "description": "Boolean attribute controls whether the window can be closed in the GUI.\nDefaults to `false`.",
742
+ "fieldName": "closable"
743
+ },
744
+ {
745
+ "name": "size",
746
+ "type": {
747
+ "text": "string"
748
+ },
749
+ "description": "optional string describing the size of the new item (see the written documentation for more info)",
750
+ "fieldName": "size"
751
+ },
752
+ {
753
+ "name": "registration",
754
+ "type": {
755
+ "text": "string"
756
+ },
757
+ "description": "Sets the registration name for the item, which can be used later to add the item via the JavaScript API using FoundationLayout.addItem.",
758
+ "fieldName": "registration"
759
+ }
760
+ ],
761
+ "superclass": {
762
+ "name": "FoundationElement",
763
+ "package": "@microsoft/fast-foundation"
764
+ },
765
+ "tagName": "%%prefix%%-layout-item",
766
+ "customElement": true
767
+ }
768
+ ],
769
+ "exports": [
770
+ {
771
+ "kind": "js",
772
+ "name": "FoundationLayoutItem",
773
+ "declaration": {
774
+ "name": "FoundationLayoutItem",
775
+ "module": "src/main/layout-item.ts"
776
+ }
777
+ }
778
+ ]
779
+ },
780
+ {
781
+ "kind": "javascript-module",
782
+ "path": "src/main/layout-main.ts",
783
+ "declarations": [
784
+ {
785
+ "kind": "class",
786
+ "description": "",
787
+ "name": "FoundationLayout",
788
+ "members": [
789
+ {
790
+ "kind": "field",
791
+ "name": "layout",
792
+ "type": {
793
+ "text": "GoldenLayout"
794
+ },
795
+ "privacy": "private"
796
+ },
797
+ {
798
+ "kind": "field",
799
+ "name": "layoutConfig",
800
+ "type": {
801
+ "text": "LayoutConfig"
802
+ },
803
+ "privacy": "private",
804
+ "default": "{ root: undefined }"
805
+ },
806
+ {
807
+ "kind": "field",
808
+ "name": "reloadBuffer",
809
+ "type": {
810
+ "text": "number"
811
+ },
812
+ "default": "DEFAULT_RELOAD_BUFFER",
813
+ "description": "Number describing how long to wait in ms before reloading the config when adding items\ndeclaratively by the html API. Default 500 (ms).",
814
+ "privacy": "public"
815
+ },
816
+ {
817
+ "kind": "field",
818
+ "name": "reloadPending",
819
+ "type": {
820
+ "text": "boolean"
821
+ },
822
+ "privacy": "private",
823
+ "default": "false"
824
+ },
825
+ {
826
+ "kind": "field",
827
+ "name": "registeredComponents",
828
+ "type": {
829
+ "text": "number"
830
+ },
831
+ "privacy": "private",
832
+ "default": "0"
833
+ },
834
+ {
835
+ "kind": "field",
836
+ "name": "autoSaveKey",
837
+ "type": {
838
+ "text": "string | undefined"
839
+ },
840
+ "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`.",
841
+ "privacy": "public"
842
+ },
843
+ {
844
+ "kind": "field",
845
+ "name": "missingItemPlaceholder",
846
+ "description": "Function which is used to generate the placeholder text when a layout is loaded\nwith a missing item.",
847
+ "privacy": "public"
848
+ },
849
+ {
850
+ "kind": "field",
851
+ "name": "dimensionsConfig",
852
+ "type": {
853
+ "text": "LayoutConfig.Dimensions | undefined"
854
+ },
855
+ "description": "Apply dimensions config to the layout, such as setting the size of the drag handles.",
856
+ "privacy": "public"
857
+ },
858
+ {
859
+ "kind": "field",
860
+ "name": "hasFirstLoaded",
861
+ "type": {
862
+ "text": "boolean"
863
+ },
864
+ "default": "false",
865
+ "description": "Boolean signifies whether the layout has loaded for the first time or not.",
866
+ "privacy": "public"
867
+ },
868
+ {
869
+ "kind": "field",
870
+ "name": "customButtons",
871
+ "type": {
872
+ "text": "CustomButton[]"
873
+ },
874
+ "default": "[]",
875
+ "description": "Set custom button definition on this property to add them to the layout header controls",
876
+ "privacy": "public"
877
+ },
878
+ {
879
+ "kind": "field",
880
+ "name": "dragging",
881
+ "type": {
882
+ "text": "boolean"
883
+ },
884
+ "default": "false",
885
+ "privacy": "public"
886
+ },
887
+ {
888
+ "kind": "field",
889
+ "name": "class",
890
+ "privacy": "public",
891
+ "default": "'FoundationLayoutMain'",
892
+ "type": {
893
+ "text": "'FoundationLayoutMain'"
894
+ }
895
+ },
896
+ {
897
+ "kind": "field",
898
+ "name": "lifecycleUpdateToken",
899
+ "type": {
900
+ "text": "string | undefined"
901
+ },
902
+ "privacy": "public",
903
+ "default": "undefined",
904
+ "description": "Used to calculate whether a layout item should run its lifecycle methods or not"
905
+ },
906
+ {
907
+ "kind": "field",
908
+ "name": "popoutConfig",
909
+ "type": {
910
+ "text": "string | undefined"
911
+ },
912
+ "default": "undefined",
913
+ "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."
914
+ },
915
+ {
916
+ "kind": "field",
917
+ "name": "popupMode",
918
+ "type": {
919
+ "text": "boolean"
920
+ },
921
+ "privacy": "private",
922
+ "default": "false"
923
+ },
924
+ {
925
+ "kind": "method",
926
+ "name": "layoutRequiredRegistrations",
927
+ "static": true,
928
+ "return": {
929
+ "type": {
930
+ "text": ""
931
+ }
932
+ },
933
+ "parameters": [
934
+ {
935
+ "name": "layout",
936
+ "type": {
937
+ "text": "SerialisedLayout"
938
+ },
939
+ "description": "any version of {@link SerialisedLayout}object describing the layout\n * "
940
+ }
941
+ ],
942
+ "description": "JS API, public",
943
+ "privacy": "public"
612
944
  },
613
945
  {
614
946
  "kind": "method",
@@ -929,591 +1261,227 @@
929
1261
  "module": "src/main/layout-main.ts"
930
1262
  },
931
1263
  "fieldName": "popoutConfig"
932
- },
933
- {
934
- "name": "hideCloseIcons",
935
- "type": {
936
- "text": "boolean"
937
- },
938
- "default": "false",
939
- "fieldName": "showCloseIcons"
940
- },
941
- {
942
- "name": "showMaximiseIcons",
943
- "type": {
944
- "text": "boolean"
945
- },
946
- "default": "false",
947
- "fieldName": "showMaximiseIcons"
948
- }
949
- ],
950
- "superclass": {
951
- "name": "FoundationElement",
952
- "package": "@microsoft/fast-foundation"
953
- },
954
- "tagName": "%%prefix%%-layout",
955
- "customElement": true
956
- },
957
- {
958
- "kind": "variable",
959
- "name": "layoutTemplate",
960
- "default": "html<FoundationLayout>`\n <template>\n ${when((x) => !x.hasFirstLoaded && x.usingDeclerativeAPI, loadingTemplate)}\n <div class=\"layout-container\" ${ref('layoutElement')}></div>\n </template>\n`",
961
- "description": "`ViewTemplate` which defines the html for FoundationLayout.",
962
- "privacy": "public"
963
- }
964
- ],
965
- "exports": [
966
- {
967
- "kind": "js",
968
- "name": "layoutStyles",
969
- "declaration": {
970
- "name": "layoutStyles",
971
- "module": "../styles"
972
- }
973
- },
974
- {
975
- "kind": "js",
976
- "name": "FoundationLayout",
977
- "declaration": {
978
- "name": "FoundationLayout",
979
- "module": "src/main/layout-main.ts"
980
- }
981
- },
982
- {
983
- "kind": "js",
984
- "name": "layoutTemplate",
985
- "declaration": {
986
- "name": "layoutTemplate",
987
- "module": "src/main/layout-main.ts"
988
- }
989
- }
990
- ]
991
- },
992
- {
993
- "kind": "javascript-module",
994
- "path": "src/main/layout-region.ts",
995
- "declarations": [
996
- {
997
- "kind": "class",
998
- "description": "",
999
- "name": "FoundationLayoutRegion",
1000
- "members": [
1001
- {
1002
- "kind": "field",
1003
- "name": "size",
1004
- "type": {
1005
- "text": "string"
1006
- },
1007
- "description": "optional string describing the size of the new item (see the written documentation for more info)",
1008
- "privacy": "public"
1009
- },
1010
- {
1011
- "kind": "field",
1012
- "name": "type",
1013
- "type": {
1014
- "text": "LayoutRegionType"
1015
- },
1016
- "default": "layoutRegionValue[0]",
1017
- "description": "Defines the LayoutRegionType| type of the region.\nDefaults to `horizontal`.",
1018
- "privacy": "public"
1019
- },
1020
- {
1021
- "kind": "field",
1022
- "name": "_presentation",
1023
- "type": {
1024
- "text": "ComponentPresentation | null | undefined"
1025
- },
1026
- "privacy": "private",
1027
- "default": "void 0",
1028
- "inheritedFrom": {
1029
- "name": "FoundationElement",
1030
- "module": "src/foundation-element/foundation-element.ts"
1031
- }
1032
- },
1033
- {
1034
- "kind": "field",
1035
- "name": "$presentation",
1036
- "type": {
1037
- "text": "ComponentPresentation | null"
1038
- },
1039
- "privacy": "public",
1040
- "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
1041
- "inheritedFrom": {
1042
- "name": "FoundationElement",
1043
- "module": "src/foundation-element/foundation-element.ts"
1044
- }
1045
- },
1046
- {
1047
- "kind": "field",
1048
- "name": "template",
1049
- "type": {
1050
- "text": "ElementViewTemplate | void | null"
1051
- },
1052
- "privacy": "public",
1053
- "description": "Sets the template of the element instance. When undefined,\nthe element will attempt to resolve the template from\nthe associated presentation or custom element definition.",
1054
- "inheritedFrom": {
1055
- "name": "FoundationElement",
1056
- "module": "src/foundation-element/foundation-element.ts"
1057
- }
1058
- },
1059
- {
1060
- "kind": "method",
1061
- "name": "templateChanged",
1062
- "privacy": "protected",
1063
- "return": {
1064
- "type": {
1065
- "text": "void"
1066
- }
1067
- },
1068
- "inheritedFrom": {
1069
- "name": "FoundationElement",
1070
- "module": "src/foundation-element/foundation-element.ts"
1071
- }
1072
- },
1073
- {
1074
- "kind": "field",
1075
- "name": "styles",
1076
- "type": {
1077
- "text": "ElementStyles | void | null"
1078
- },
1079
- "privacy": "public",
1080
- "description": "Sets the default styles for the element instance. When undefined,\nthe element will attempt to resolve default styles from\nthe associated presentation or custom element definition.",
1081
- "inheritedFrom": {
1082
- "name": "FoundationElement",
1083
- "module": "src/foundation-element/foundation-element.ts"
1084
- }
1085
- },
1086
- {
1087
- "kind": "method",
1088
- "name": "stylesChanged",
1089
- "privacy": "protected",
1090
- "return": {
1091
- "type": {
1092
- "text": "void"
1093
- }
1094
- },
1095
- "inheritedFrom": {
1096
- "name": "FoundationElement",
1097
- "module": "src/foundation-element/foundation-element.ts"
1098
- }
1099
- },
1100
- {
1101
- "kind": "method",
1102
- "name": "compose",
1103
- "privacy": "public",
1104
- "static": true,
1105
- "return": {
1106
- "type": {
1107
- "text": "(\n overrideDefinition?: OverrideFoundationElementDefinition<T>\n ) => FoundationElementRegistry<T, K>"
1108
- }
1109
- },
1110
- "parameters": [
1111
- {
1112
- "name": "this",
1113
- "type": {
1114
- "text": "K"
1115
- }
1116
- },
1117
- {
1118
- "name": "elementDefinition",
1119
- "type": {
1120
- "text": "T"
1121
- },
1122
- "description": "The definition of the element to create the registry\nfunction for."
1123
- }
1124
- ],
1125
- "description": "Defines an element registry function with a set of element definition defaults.",
1126
- "inheritedFrom": {
1127
- "name": "FoundationElement",
1128
- "module": "src/foundation-element/foundation-element.ts"
1129
- }
1130
- }
1131
- ],
1132
- "attributes": [
1133
- {
1134
- "name": "size",
1135
- "type": {
1136
- "text": "string"
1137
- },
1138
- "description": "optional string describing the size of the new item (see the written documentation for more info)",
1139
- "fieldName": "size"
1140
- },
1141
- {
1142
- "name": "type",
1143
- "type": {
1144
- "text": "LayoutRegionType"
1145
- },
1146
- "default": "defaultLayoutType",
1147
- "description": "Defines the LayoutRegionType| type of the region.\nDefaults to `horizontal`.",
1148
- "resolveInitializer": {
1149
- "module": "src/main/layout-region.ts"
1150
- },
1151
- "fieldName": "type"
1152
- }
1153
- ],
1154
- "superclass": {
1155
- "name": "FoundationElement",
1156
- "package": "@microsoft/fast-foundation"
1157
- },
1158
- "tagName": "%%prefix%%-layout-region",
1159
- "customElement": true
1160
- }
1161
- ],
1162
- "exports": [
1163
- {
1164
- "kind": "js",
1165
- "name": "FoundationLayoutRegion",
1166
- "declaration": {
1167
- "name": "FoundationLayoutRegion",
1168
- "module": "src/main/layout-region.ts"
1169
- }
1170
- }
1171
- ]
1172
- },
1173
- {
1174
- "kind": "javascript-module",
1175
- "path": "src/utils/constants.ts",
1176
- "declarations": [
1177
- {
1178
- "kind": "variable",
1179
- "name": "DEFAULT_RELOAD_BUFFER",
1180
- "type": {
1181
- "text": "number"
1182
- },
1183
- "default": "500",
1184
- "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.",
1185
- "privacy": "public"
1186
- },
1187
- {
1188
- "kind": "variable",
1189
- "name": "LAYOUT_POPOUT_CONTAINER_CLASS",
1190
- "type": {
1191
- "text": "string"
1192
- },
1193
- "default": "'f-layout-popout'",
1194
- "description": "Put this classname on an element which is a DOM parent of the layout, and\nif the layout goes into popout mode then it will place itself as the only child\nfor the popout container you set."
1195
- }
1196
- ],
1197
- "exports": [
1198
- {
1199
- "kind": "js",
1200
- "name": "DEFAULT_RELOAD_BUFFER",
1201
- "declaration": {
1202
- "name": "DEFAULT_RELOAD_BUFFER",
1203
- "module": "src/utils/constants.ts"
1204
- }
1205
- },
1206
- {
1207
- "kind": "js",
1208
- "name": "LAYOUT_POPOUT_CONTAINER_CLASS",
1209
- "declaration": {
1210
- "name": "LAYOUT_POPOUT_CONTAINER_CLASS",
1211
- "module": "src/utils/constants.ts"
1212
- }
1213
- }
1214
- ]
1215
- },
1216
- {
1217
- "kind": "javascript-module",
1218
- "path": "src/utils/error.ts",
1219
- "declarations": [
1220
- {
1221
- "kind": "class",
1222
- "description": "",
1223
- "name": "LayoutUsageError",
1224
- "superclass": {
1225
- "name": "Error",
1226
- "module": "src/utils/error.ts"
1227
- }
1228
- },
1229
- {
1230
- "kind": "class",
1231
- "description": "",
1232
- "name": "LayoutRegistrationError",
1233
- "superclass": {
1234
- "name": "Error",
1235
- "module": "src/utils/error.ts"
1236
- }
1237
- }
1238
- ],
1239
- "exports": [
1240
- {
1241
- "kind": "js",
1242
- "name": "LayoutUsageError",
1243
- "declaration": {
1244
- "name": "LayoutUsageError",
1245
- "module": "src/utils/error.ts"
1246
- }
1247
- },
1248
- {
1249
- "kind": "js",
1250
- "name": "LayoutRegistrationError",
1251
- "declaration": {
1252
- "name": "LayoutRegistrationError",
1253
- "module": "src/utils/error.ts"
1254
- }
1255
- }
1256
- ]
1257
- },
1258
- {
1259
- "kind": "javascript-module",
1260
- "path": "src/utils/events.ts",
1261
- "declarations": [
1262
- {
1263
- "kind": "variable",
1264
- "name": "LayoutEmitEvents",
1265
- "type": {
1266
- "text": "{\n firstLoaded: 'first-loaded',\n itemAdded: 'item-added',\n itemRemoved: 'item-removed',\n itemResized: 'item-resized',\n}"
1267
- },
1268
- "default": "{\n firstLoaded: 'first-loaded',\n itemAdded: 'item-added',\n itemRemoved: 'item-removed',\n itemResized: 'item-resized',\n}",
1269
- "description": "Defines events that the layout system emits\n\n'firstLoaded' - emitted when the layout has finished loading the first time\nusing the declarative API after DEFAULT_RELOAD_BUFFER ms.\n<br/>\n'itemAdded' - emitted when an item is added to the layout'\n<br/>\n'itemRemoved' - emitted when an item is removed from the layout'\n<br/>\n'itemResized' - emitted when the user drags the divider to resize elements",
1270
- "privacy": "public"
1271
- },
1272
- {
1273
- "kind": "variable",
1274
- "name": "LayoutReceiveEvents",
1275
- "type": {
1276
- "text": "{\n changeTitle: 'change-title',\n autosave: 'autosave',\n}"
1277
- },
1278
- "default": "{\n changeTitle: 'change-title',\n autosave: 'autosave',\n}",
1279
- "description": "Defines events that the layout system listens for\n\n'changeTitle' - emit this from a contained item to update the title of the window that contains it.\n'autosave' - emit this from a contained item to hint to the layout system that it should autosave the layout. A contained item should do this if it has just changed some state it would like to persist. See LayoutComponentWithState.",
1280
- "privacy": "public"
1281
- }
1282
- ],
1283
- "exports": [
1284
- {
1285
- "kind": "js",
1286
- "name": "LayoutEmitEvents",
1287
- "declaration": {
1288
- "name": "LayoutEmitEvents",
1289
- "module": "src/utils/events.ts"
1290
- }
1291
- },
1292
- {
1293
- "kind": "js",
1294
- "name": "LayoutReceiveEvents",
1295
- "declaration": {
1296
- "name": "LayoutReceiveEvents",
1297
- "module": "src/utils/events.ts"
1298
- }
1299
- }
1300
- ]
1301
- },
1302
- {
1303
- "kind": "javascript-module",
1304
- "path": "src/utils/index.ts",
1305
- "declarations": [],
1306
- "exports": [
1307
- {
1308
- "kind": "js",
1309
- "name": "*",
1310
- "declaration": {
1311
- "name": "*",
1312
- "package": "./constants"
1313
- }
1314
- },
1315
- {
1316
- "kind": "js",
1317
- "name": "*",
1318
- "declaration": {
1319
- "name": "*",
1320
- "package": "./error"
1321
- }
1322
- },
1323
- {
1324
- "kind": "js",
1325
- "name": "*",
1326
- "declaration": {
1327
- "name": "*",
1328
- "package": "./events"
1329
- }
1330
- },
1331
- {
1332
- "kind": "js",
1333
- "name": "*",
1334
- "declaration": {
1335
- "name": "*",
1336
- "package": "./misc"
1337
- }
1338
- },
1339
- {
1340
- "kind": "js",
1341
- "name": "*",
1342
- "declaration": {
1343
- "name": "*",
1344
- "package": "./templates"
1345
- }
1346
- },
1347
- {
1348
- "kind": "js",
1349
- "name": "*",
1350
- "declaration": {
1351
- "name": "*",
1352
- "package": "./types"
1353
- }
1354
- },
1355
- {
1356
- "kind": "js",
1357
- "name": "*",
1358
- "declaration": {
1359
- "name": "*",
1360
- "package": "./error"
1361
- }
1362
- }
1363
- ]
1364
- },
1365
- {
1366
- "kind": "javascript-module",
1367
- "path": "src/utils/logger.ts",
1368
- "declarations": [
1369
- {
1370
- "kind": "variable",
1371
- "name": "logger"
1372
- }
1373
- ],
1374
- "exports": [
1375
- {
1376
- "kind": "js",
1377
- "name": "logger",
1378
- "declaration": {
1379
- "name": "logger",
1380
- "module": "src/utils/logger.ts"
1381
- }
1382
- }
1383
- ]
1384
- },
1385
- {
1386
- "kind": "javascript-module",
1387
- "path": "src/utils/misc.ts",
1388
- "declarations": [],
1389
- "exports": []
1390
- },
1391
- {
1392
- "kind": "javascript-module",
1393
- "path": "src/utils/templates.ts",
1394
- "declarations": [],
1395
- "exports": []
1396
- },
1397
- {
1398
- "kind": "javascript-module",
1399
- "path": "src/utils/types.ts",
1400
- "declarations": [],
1401
- "exports": []
1402
- },
1403
- {
1404
- "kind": "javascript-module",
1405
- "path": "src/styles/constants.ts",
1406
- "declarations": [
1407
- {
1408
- "kind": "variable",
1409
- "name": "glVisualConfig",
1410
- "type": {
1411
- "text": "Omit<LayoutConfig, 'root'>"
1264
+ }
1265
+ ],
1266
+ "superclass": {
1267
+ "name": "FoundationElement",
1268
+ "package": "@microsoft/fast-foundation"
1412
1269
  },
1413
- "default": "{\n dimensions: {\n headerHeight: 38,\n borderWidth: 12,\n },\n header: {\n maximise: 'maximise',\n minimise: 'minimise',\n popout: false,\n },\n}"
1270
+ "tagName": "%%prefix%%-layout",
1271
+ "customElement": true
1414
1272
  },
1415
1273
  {
1416
1274
  "kind": "variable",
1417
- "name": "LAYOUT_ICONS",
1418
- "type": {
1419
- "text": "{\n renameSVG,\n maximiseSVG,\n minimiseSVG,\n closeSVG,\n tabDropdownSVG,\n popoutSVG,\n}"
1420
- },
1421
- "default": "{\n renameSVG,\n maximiseSVG,\n minimiseSVG,\n closeSVG,\n tabDropdownSVG,\n popoutSVG,\n}",
1422
- "description": "A collection of SVG icons in base64 format.",
1275
+ "name": "layoutTemplate",
1276
+ "default": "html<FoundationLayout>`\n <template>\n ${when((x) => !x.hasFirstLoaded && x.usingDeclerativeAPI, loadingTemplate)}\n <div class=\"layout-container\" ${ref('layoutElement')}></div>\n </template>\n`",
1277
+ "description": "`ViewTemplate` which defines the html for FoundationLayout.",
1423
1278
  "privacy": "public"
1424
1279
  }
1425
1280
  ],
1426
1281
  "exports": [
1427
1282
  {
1428
1283
  "kind": "js",
1429
- "name": "glVisualConfig",
1430
- "declaration": {
1431
- "name": "glVisualConfig",
1432
- "module": "src/styles/constants.ts"
1433
- }
1434
- },
1435
- {
1436
- "kind": "js",
1437
- "name": "LAYOUT_ICONS",
1438
- "declaration": {
1439
- "name": "LAYOUT_ICONS",
1440
- "module": "src/styles/constants.ts"
1441
- }
1442
- }
1443
- ]
1444
- },
1445
- {
1446
- "kind": "javascript-module",
1447
- "path": "src/styles/dragging.styles.ts",
1448
- "declarations": [
1449
- {
1450
- "kind": "variable",
1451
- "name": "globalDraggingStyles",
1452
- "default": "`\n .lm_dragProxy .lm_content {\n box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.9);\n }\n .lm_dropTargetIndicator {\n box-shadow: inset 0 0 30px #000000;\n outline: 1px dashed #cccccc;\n transition: all 200ms ease;\n }\n .lm_dropTargetIndicator .lm_inner {\n background: var(${neutralFillStealthRest.cssCustomProperty});\n opacity: 0.2;\n }\n .lm_dragProxy.lm_left .lm_header,\n .lm_dragProxy.lm_right .lm_header {\n width: 20px;\n float: left;\n vertical-align: top;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabs,\n .lm_dragProxy.lm_right .lm_header .lm_tabs {\n transform-origin: left top;\n top: 0;\n width: 1000px;\n }\n .lm_dragProxy.lm_left .lm_header .lm_controls,\n .lm_dragProxy.lm_right .lm_header .lm_controls {\n bottom: 0;\n }\n .lm_dragProxy.lm_left .lm_items,\n .lm_dragProxy.lm_right .lm_items {\n float: left;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabs {\n transform: rotate(-90deg) scaleX(-1);\n left: 0;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabs .lm_tab {\n transform: scaleX(-1);\n margin-top: 1px;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabdropdown_list {\n top: initial;\n right: initial;\n left: 20px;\n }\n .lm_dragProxy.lm_right .lm_content {\n float: left;\n }\n .lm_dragProxy.lm_right .lm_header .lm_tabs {\n transform: rotate(90deg) scaleX(1);\n left: 100%;\n margin-left: 0;\n }\n .lm_dragProxy.lm_right .lm_header .lm_controls {\n left: 3px;\n }\n .lm_dragProxy.lm_right .lm_header .lm_tabdropdown_list {\n top: initial;\n right: 20px;\n }\n .lm_dragProxy.lm_bottom .lm_header .lm_tab {\n margin-top: 0;\n border-top: none;\n }\n .lm_dragProxy.lm_bottom .lm_header .lm_controls,\n .lm_stack.lm_bottom .lm_header .lm_controls {\n top: 3px;\n }\n .lm_dragProxy.lm_bottom .lm_header .lm_tabdropdown_list,\n .lm_stack.lm_bottom .lm_header .lm_tabdropdown_list {\n top: initial;\n bottom: 20px;\n }\n .lm_dragProxy {\n cursor: move;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 30;\n }\n .lm_dragProxy .lm_header {\n background: transparent;\n }\n .lm_dragProxy .lm_title {\n color: white;\n padding-left: 10px;\n }\n .lm_dragProxy .lm_content {\n border-top: none;\n overflow: hidden;\n }\n .lm_dropTargetIndicator {\n display: none;\n position: absolute;\n z-index: 20;\n }\n .lm_dropTargetIndicator .lm_inner {\n width: 100%;\n height: 100%;\n position: relative;\n top: 0;\n left: 0;\n }\n .lm_transition_indicator {\n display: none;\n width: 20px;\n height: 20px;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 20;\n }\n`",
1453
- "description": "This is defined as a string rather than a css template\nbecause it is applied to a CSSStyleSheet object rather than\nused as a FAST template"
1454
- }
1455
- ],
1456
- "exports": [
1457
- {
1458
- "kind": "js",
1459
- "name": "globalDraggingStyles",
1460
- "declaration": {
1461
- "name": "globalDraggingStyles",
1462
- "module": "src/styles/dragging.styles.ts"
1463
- }
1464
- }
1465
- ]
1466
- },
1467
- {
1468
- "kind": "javascript-module",
1469
- "path": "src/styles/index.ts",
1470
- "declarations": [],
1471
- "exports": [
1472
- {
1473
- "kind": "js",
1474
- "name": "*",
1284
+ "name": "layoutStyles",
1475
1285
  "declaration": {
1476
- "name": "*",
1477
- "package": "./constants"
1286
+ "name": "layoutStyles",
1287
+ "module": "../styles"
1478
1288
  }
1479
1289
  },
1480
1290
  {
1481
1291
  "kind": "js",
1482
- "name": "*",
1292
+ "name": "FoundationLayout",
1483
1293
  "declaration": {
1484
- "name": "*",
1485
- "package": "./dragging.styles"
1294
+ "name": "FoundationLayout",
1295
+ "module": "src/main/layout-main.ts"
1486
1296
  }
1487
1297
  },
1488
1298
  {
1489
1299
  "kind": "js",
1490
- "name": "*",
1300
+ "name": "layoutTemplate",
1491
1301
  "declaration": {
1492
- "name": "*",
1493
- "package": "./layout.styles"
1302
+ "name": "layoutTemplate",
1303
+ "module": "src/main/layout-main.ts"
1494
1304
  }
1495
1305
  }
1496
1306
  ]
1497
1307
  },
1498
1308
  {
1499
1309
  "kind": "javascript-module",
1500
- "path": "src/styles/layout.styles.ts",
1310
+ "path": "src/main/layout-region.ts",
1501
1311
  "declarations": [
1502
1312
  {
1503
- "kind": "variable",
1504
- "name": "layoutStyles",
1505
- "default": "css`\n ${containerStyles}\n ${loadingSpinnerStyles}\n\n .lm_goldenlayout {\n padding: 1px;\n background: ${neutralLayer1};\n border-radius: calc(${controlCornerRadius} * 1.5px);\n }\n\n .lm_stack.lm_item {\n background-color: ${neutralLayer4};\n border-radius: calc(${controlCornerRadius} * 1.5px);\n }\n .lm_maximised .lm_header {\n background-color: ${neutralLayer4};\n border-radius: calc(${controlCornerRadius} * 1.5px);\n position: unset;\n }\n\n .lm_maximised .lm_header .lm_tabs {\n z-index: 3;\n }\n\n .lm_content {\n background-color: ${neutralLayer3};\n border-radius: calc(${controlCornerRadius} * 1.5px);\n border: 1px solid;\n border-color: #2e3339;\n box-sizing: border-box;\n }\n\n .lm-header {\n z-index: 1;\n }\n .lm_header .lm_tabs {\n padding: 0 16px;\n }\n\n .lm_stack > .lm_items {\n z-index: 2;\n box-shadow: 0px -1px 15px rgba(0, 0, 0, 0.35);\n }\n\n .lm_header .lm_tab.lm_active.lm_focused {\n background-color: ${neutralLayer3};\n }\n .lm_header .lm_tab.lm_active {\n background-color: ${neutralLayer3};\n border: 1px solid;\n border-color: #2e3339;\n border-bottom: 0;\n color: ${accentFillRest};\n }\n\n .lm_header .lm_tab {\n align-items: center;\n background-color: ${neutralLayer4};\n border: 1px solid;\n border-bottom-color: #2e3339;\n border-bottom: 0px solid;\n border-color: rgba(0, 0, 0, 0.35);\n border-radius: calc(${controlCornerRadius} * 1.5px) calc(${controlCornerRadius} * 1.5px) 0 0;\n box-shadow: 1px -1px 2px rgba(0, 0, 0, 0.35);\n color: rgba(255, 255, 255, 0.3);\n display: flex;\n font-family: inherit;\n font-size: 13px;\n font-weight: 700;\n height: 30px;\n margin-right: 2px;\n margin-top: 3px;\n padding: 2px 16px;\n }\n\n .lm_header .lm_tab:not(.lm_active):hover {\n background-color: rgba(255, 255, 255, 0.1);\n color: #f1f1f1;\n }\n\n .lm_header .lm_controls {\n top: 4px;\n display: flex;\n }\n .lm_header .lm_controls > * {\n width: 30px;\n height: 30px;\n background-repeat: no-repeat;\n background-position: center;\n background-size: 16px;\n background-color: rgba(255, 255, 255, 0.03);\n border-radius: calc(${controlCornerRadius} * 1.5px);\n margin-right: 4px;\n top: 3px;\n opacity: 1;\n }\n .lm_header .lm_controls > *:hover {\n background-color: rgba(255, 255, 255, 0.1);\n cursor: pointer;\n }\n\n .lm_controls .lm_maximise {\n background-image: url('${LAYOUT_ICONS.maximiseSVG}');\n }\n .lm_maximised .lm_controls .lm_maximise {\n background-image: url('${LAYOUT_ICONS.minimiseSVG}');\n }\n .lm_controls .lm_close {\n background-image: url('${LAYOUT_ICONS.closeSVG}');\n }\n .lm_header .lm_tab .lm_close_tab {\n background-image: url('${LAYOUT_ICONS.closeSVG}');\n background-size: 10px;\n background-repeat: no-repeat;\n margin-left: 12px;\n position: relative;\n top: 0;\n right: 0;\n }\n\n .lm_header .lm_tab.lm_active {\n padding: 4px 25px 3px 10px;\n }\n\n .lm_header .lm_tab:not(.lm_active) .lm_title {\n color: ${accentFillRest};\n opacity: 0.7;\n }\n\n .lm_header .lm_controls .lm_tabdropdown::before {\n content: none;\n }\n .lm_header .lm_controls .lm_tabdropdown {\n background-image: url('${LAYOUT_ICONS.tabDropdownSVG}');\n }\n .lm_header .lm_tabdropdown_list {\n top: 38px;\n right: 108px;\n background-color: ${neutralLayer3};\n border: 1px solid;\n border-color: #2e3339;\n border-radius: calc(${controlCornerRadius} * 1.5px);\n box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.35);\n }\n .lm_header .lm_tabdropdown_list > .lm_tab {\n box-shadow: none;\n padding: 0 16px;\n white-space: nowrap;\n background-color: transparent;\n color: #c9c9c9;\n height: 36px;\n border-radius: 0;\n overflow: visible;\n text-overflow: normal;\n }\n .lm_header .lm_tabdropdown_list > .lm_tab:last-child {\n border-bottom: 0;\n }\n\n /* gl base styles start */\n .lm_root {\n position: relative;\n }\n .lm_row > .lm_item {\n float: left;\n }\n .lm_content {\n overflow: hidden;\n position: relative;\n }\n .lm_dragging,\n .lm_dragging * {\n cursor: move !important;\n user-select: none;\n }\n .lm_maximised {\n left: 0;\n padding: 1px;\n position: absolute;\n top: 0;\n z-index: 40;\n }\n .lm_maximise_placeholder {\n display: none;\n }\n .lm_splitter {\n position: relative;\n z-index: 20;\n }\n .lm_splitter:hover,\n .lm_splitter.lm_dragging {\n background: ${accentFillRest};\n border-radius: calc(${controlCornerRadius} * 4px);\n }\n .lm_splitter.lm_vertical .lm_drag_handle {\n width: 100%;\n height: 15px;\n position: absolute;\n top: -5px;\n cursor: ns-resize !important;\n }\n .lm_splitter.lm_horizontal {\n float: left;\n height: 100%;\n }\n .lm_splitter.lm_horizontal .lm_drag_handle {\n width: 15px;\n height: 100%;\n position: absolute;\n left: -5px;\n cursor: ew-resize !important;\n }\n .lm_header {\n overflow: visible;\n position: relative;\n z-index: 1;\n }\n .lm_header [class^='lm_'] {\n box-sizing: content-box !important;\n }\n .lm_header .lm_controls {\n position: absolute;\n right: 3px;\n }\n .lm_header .lm_controls > li {\n cursor: pointer;\n float: left;\n width: 18px;\n height: 18px;\n text-align: center;\n }\n .lm_header ul {\n margin: 0;\n padding: 0;\n list-style-type: none;\n }\n .lm_header .lm_tabs {\n position: absolute;\n }\n .lm_header .lm_tab {\n cursor: pointer;\n float: left;\n margin-top: 1px;\n padding: 3px 25px 3px 10px;\n position: relative;\n }\n .lm_header .lm_tab i {\n width: 2px;\n height: 19px;\n position: absolute;\n }\n .lm_header .lm_tab i.lm_left {\n top: 0;\n left: -2px;\n }\n .lm_header .lm_tab i.lm_right {\n top: 0;\n right: -2px;\n }\n .lm_header .lm_tab .lm_title {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n user-select: none;\n }\n .lm_header .lm_tab .lm_title:only-child {\n padding-left: 10px;\n }\n .lm_header .lm_tab .lm_close_tab {\n width: 14px;\n height: 14px;\n position: absolute;\n top: 11px;\n right: 0;\n text-align: center;\n }\n .lm_stack.lm_left .lm_header,\n .lm_stack.lm_right .lm_header {\n height: 100%;\n }\n .lm_dragProxy.lm_left .lm_header,\n .lm_dragProxy.lm_right .lm_header,\n .lm_stack.lm_left .lm_header,\n .lm_stack.lm_right .lm_header {\n width: 20px;\n float: left;\n vertical-align: top;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabs,\n .lm_dragProxy.lm_right .lm_header .lm_tabs,\n .lm_stack.lm_left .lm_header .lm_tabs,\n .lm_stack.lm_right .lm_header .lm_tabs {\n transform-origin: left top;\n top: 0;\n width: 1000px;\n }\n .lm_dragProxy.lm_left .lm_header .lm_controls,\n .lm_dragProxy.lm_right .lm_header .lm_controls,\n .lm_stack.lm_left .lm_header .lm_controls,\n .lm_stack.lm_right .lm_header .lm_controls {\n bottom: 0;\n }\n .lm_dragProxy.lm_left .lm_items,\n .lm_dragProxy.lm_right .lm_items,\n .lm_stack.lm_left .lm_items,\n .lm_stack.lm_right .lm_items {\n float: left;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabs,\n .lm_stack.lm_left .lm_header .lm_tabs {\n transform: rotate(-90deg) scaleX(-1);\n left: 0;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabs .lm_tab,\n .lm_stack.lm_left .lm_header .lm_tabs .lm_tab {\n transform: scaleX(-1);\n margin-top: 1px;\n }\n .lm_dragProxy.lm_left .lm_header .lm_tabdropdown_list,\n .lm_stack.lm_left .lm_header .lm_tabdropdown_list {\n top: initial;\n right: initial;\n left: 20px;\n }\n .lm_dragProxy.lm_right .lm_content {\n float: left;\n }\n .lm_dragProxy.lm_right .lm_header .lm_tabs,\n .lm_stack.lm_right .lm_header .lm_tabs {\n transform: rotate(90deg) scaleX(1);\n left: 100%;\n margin-left: 0;\n }\n .lm_dragProxy.lm_right .lm_header .lm_controls,\n .lm_stack.lm_right .lm_header .lm_controls {\n left: 3px;\n }\n .lm_dragProxy.lm_right .lm_header .lm_tabdropdown_list,\n .lm_stack.lm_right .lm_header .lm_tabdropdown_list {\n top: initial;\n right: 20px;\n }\n .lm_dragProxy.lm_bottom .lm_header .lm_tab,\n .lm_stack.lm_bottom .lm_header .lm_tab {\n margin-top: 0;\n border-top: none;\n }\n .lm_dragProxy.lm_bottom .lm_header .lm_controls,\n .lm_stack.lm_bottom .lm_header .lm_controls {\n top: 3px;\n }\n .lm_dragProxy.lm_bottom .lm_header .lm_tabdropdown_list,\n .lm_stack.lm_bottom .lm_header .lm_tabdropdown_list {\n top: initial;\n bottom: 20px;\n }\n .lm_drop_tab_placeholder {\n float: left;\n width: 100px;\n height: 10px;\n visibility: hidden;\n }\n .lm_header .lm_tabdropdown_list {\n position: absolute;\n top: 20px;\n right: 0;\n z-index: 5;\n overflow: hidden;\n }\n .lm_header .lm_tabdropdown_list .lm_tab {\n clear: both;\n padding-right: 10px;\n margin: 0;\n }\n .lm_header .lm_tabdropdown_list .lm_tab .lm_title {\n width: 100px;\n }\n .lm_header .lm_tabdropdown_list .lm_close_tab {\n display: none !important;\n }\n .lm_dragProxy {\n position: absolute;\n top: 0;\n left: 0;\n z-index: 30;\n }\n .lm_dragProxy .lm_header {\n background: transparent;\n }\n .lm_dragProxy .lm_content {\n border-top: none;\n overflow: hidden;\n }\n .lm_dropTargetIndicator {\n display: none;\n position: absolute;\n z-index: 20;\n }\n .lm_dropTargetIndicator .lm_inner {\n width: 100%;\n height: 100%;\n position: relative;\n top: 0;\n left: 0;\n }\n .lm_transition_indicator {\n display: none;\n width: 20px;\n height: 20px;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 20;\n }\n .lm_popin {\n width: 20px;\n height: 20px;\n position: absolute;\n bottom: 0;\n right: 0;\n z-index: 9999;\n }\n .lm_popin > * {\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n }\n .lm_popin > .lm_bg {\n z-index: 10;\n }\n .lm_popin > .lm_icon {\n z-index: 20;\n } /*# sourceMappingURL=goldenlayout-base.css.map */\n`",
1506
- "description": "`ElementStyles` which defines the css for FoundationLayout.",
1507
- "privacy": "public"
1313
+ "kind": "class",
1314
+ "description": "",
1315
+ "name": "FoundationLayoutRegion",
1316
+ "members": [
1317
+ {
1318
+ "kind": "field",
1319
+ "name": "size",
1320
+ "type": {
1321
+ "text": "string"
1322
+ },
1323
+ "description": "optional string describing the size of the new item (see the written documentation for more info)",
1324
+ "privacy": "public"
1325
+ },
1326
+ {
1327
+ "kind": "field",
1328
+ "name": "type",
1329
+ "type": {
1330
+ "text": "LayoutRegionType"
1331
+ },
1332
+ "default": "layoutRegionValue[0]",
1333
+ "description": "Defines the LayoutRegionType| type of the region.\nDefaults to `horizontal`.",
1334
+ "privacy": "public"
1335
+ },
1336
+ {
1337
+ "kind": "field",
1338
+ "name": "_presentation",
1339
+ "type": {
1340
+ "text": "ComponentPresentation | null | undefined"
1341
+ },
1342
+ "privacy": "private",
1343
+ "default": "void 0",
1344
+ "inheritedFrom": {
1345
+ "name": "FoundationElement",
1346
+ "module": "src/foundation-element/foundation-element.ts"
1347
+ }
1348
+ },
1349
+ {
1350
+ "kind": "field",
1351
+ "name": "$presentation",
1352
+ "type": {
1353
+ "text": "ComponentPresentation | null"
1354
+ },
1355
+ "privacy": "public",
1356
+ "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
1357
+ "inheritedFrom": {
1358
+ "name": "FoundationElement",
1359
+ "module": "src/foundation-element/foundation-element.ts"
1360
+ }
1361
+ },
1362
+ {
1363
+ "kind": "field",
1364
+ "name": "template",
1365
+ "type": {
1366
+ "text": "ElementViewTemplate | void | null"
1367
+ },
1368
+ "privacy": "public",
1369
+ "description": "Sets the template of the element instance. When undefined,\nthe element will attempt to resolve the template from\nthe associated presentation or custom element definition.",
1370
+ "inheritedFrom": {
1371
+ "name": "FoundationElement",
1372
+ "module": "src/foundation-element/foundation-element.ts"
1373
+ }
1374
+ },
1375
+ {
1376
+ "kind": "method",
1377
+ "name": "templateChanged",
1378
+ "privacy": "protected",
1379
+ "return": {
1380
+ "type": {
1381
+ "text": "void"
1382
+ }
1383
+ },
1384
+ "inheritedFrom": {
1385
+ "name": "FoundationElement",
1386
+ "module": "src/foundation-element/foundation-element.ts"
1387
+ }
1388
+ },
1389
+ {
1390
+ "kind": "field",
1391
+ "name": "styles",
1392
+ "type": {
1393
+ "text": "ElementStyles | void | null"
1394
+ },
1395
+ "privacy": "public",
1396
+ "description": "Sets the default styles for the element instance. When undefined,\nthe element will attempt to resolve default styles from\nthe associated presentation or custom element definition.",
1397
+ "inheritedFrom": {
1398
+ "name": "FoundationElement",
1399
+ "module": "src/foundation-element/foundation-element.ts"
1400
+ }
1401
+ },
1402
+ {
1403
+ "kind": "method",
1404
+ "name": "stylesChanged",
1405
+ "privacy": "protected",
1406
+ "return": {
1407
+ "type": {
1408
+ "text": "void"
1409
+ }
1410
+ },
1411
+ "inheritedFrom": {
1412
+ "name": "FoundationElement",
1413
+ "module": "src/foundation-element/foundation-element.ts"
1414
+ }
1415
+ },
1416
+ {
1417
+ "kind": "method",
1418
+ "name": "compose",
1419
+ "privacy": "public",
1420
+ "static": true,
1421
+ "return": {
1422
+ "type": {
1423
+ "text": "(\n overrideDefinition?: OverrideFoundationElementDefinition<T>\n ) => FoundationElementRegistry<T, K>"
1424
+ }
1425
+ },
1426
+ "parameters": [
1427
+ {
1428
+ "name": "this",
1429
+ "type": {
1430
+ "text": "K"
1431
+ }
1432
+ },
1433
+ {
1434
+ "name": "elementDefinition",
1435
+ "type": {
1436
+ "text": "T"
1437
+ },
1438
+ "description": "The definition of the element to create the registry\nfunction for."
1439
+ }
1440
+ ],
1441
+ "description": "Defines an element registry function with a set of element definition defaults.",
1442
+ "inheritedFrom": {
1443
+ "name": "FoundationElement",
1444
+ "module": "src/foundation-element/foundation-element.ts"
1445
+ }
1446
+ }
1447
+ ],
1448
+ "attributes": [
1449
+ {
1450
+ "name": "size",
1451
+ "type": {
1452
+ "text": "string"
1453
+ },
1454
+ "description": "optional string describing the size of the new item (see the written documentation for more info)",
1455
+ "fieldName": "size"
1456
+ },
1457
+ {
1458
+ "name": "type",
1459
+ "type": {
1460
+ "text": "LayoutRegionType"
1461
+ },
1462
+ "default": "defaultLayoutType",
1463
+ "description": "Defines the LayoutRegionType| type of the region.\nDefaults to `horizontal`.",
1464
+ "resolveInitializer": {
1465
+ "module": "src/main/layout-region.ts"
1466
+ },
1467
+ "fieldName": "type"
1468
+ }
1469
+ ],
1470
+ "superclass": {
1471
+ "name": "FoundationElement",
1472
+ "package": "@microsoft/fast-foundation"
1473
+ },
1474
+ "tagName": "%%prefix%%-layout-region",
1475
+ "customElement": true
1508
1476
  }
1509
1477
  ],
1510
1478
  "exports": [
1511
1479
  {
1512
1480
  "kind": "js",
1513
- "name": "layoutStyles",
1481
+ "name": "FoundationLayoutRegion",
1514
1482
  "declaration": {
1515
- "name": "layoutStyles",
1516
- "module": "src/styles/layout.styles.ts"
1483
+ "name": "FoundationLayoutRegion",
1484
+ "module": "src/main/layout-region.ts"
1517
1485
  }
1518
1486
  }
1519
1487
  ]