@genesislcap/foundation-layout 14.231.1-alpha-c5608c9.0 → 14.231.1-alpha-e92fa0b.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (4) hide show
  1. package/dist/custom-elements.json +863 -863
  2. package/dist/dts/main/layout-main.d.ts.map +1 -1
  3. package/dist/esm/main/layout-main.js +2 -0
  4. package/package.json +12 -12
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,424 +227,732 @@
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."
718
+ }
719
+ ],
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": "field",
926
+ "name": "showCloseIcons",
927
+ "type": {
928
+ "text": "boolean"
929
+ },
930
+ "default": "false"
931
+ },
932
+ {
933
+ "kind": "field",
934
+ "name": "showMaximiseIcons",
935
+ "type": {
936
+ "text": "boolean"
937
+ },
938
+ "default": "false"
939
+ },
940
+ {
941
+ "kind": "method",
942
+ "name": "layoutRequiredRegistrations",
943
+ "static": true,
944
+ "return": {
945
+ "type": {
946
+ "text": ""
947
+ }
948
+ },
949
+ "parameters": [
950
+ {
951
+ "name": "layout",
952
+ "type": {
953
+ "text": "SerialisedLayout"
954
+ },
955
+ "description": "any version of {@link SerialisedLayout}object describing the layout\n * "
608
956
  }
609
957
  ],
610
958
  "description": "JS API, public",
@@ -945,575 +1293,227 @@
945
1293
  },
946
1294
  "default": "false",
947
1295
  "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'>"
1296
+ }
1297
+ ],
1298
+ "superclass": {
1299
+ "name": "FoundationElement",
1300
+ "package": "@microsoft/fast-foundation"
1412
1301
  },
1413
- "default": "{\n dimensions: {\n headerHeight: 38,\n borderWidth: 12,\n },\n header: {\n maximise: 'maximise',\n minimise: 'minimise',\n popout: false,\n },\n}"
1302
+ "tagName": "%%prefix%%-layout",
1303
+ "customElement": true
1414
1304
  },
1415
1305
  {
1416
1306
  "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.",
1307
+ "name": "layoutTemplate",
1308
+ "default": "html<FoundationLayout>`\n <template>\n ${when((x) => !x.hasFirstLoaded && x.usingDeclerativeAPI, loadingTemplate)}\n <div class=\"layout-container\" ${ref('layoutElement')}></div>\n </template>\n`",
1309
+ "description": "`ViewTemplate` which defines the html for FoundationLayout.",
1423
1310
  "privacy": "public"
1424
1311
  }
1425
1312
  ],
1426
1313
  "exports": [
1427
1314
  {
1428
1315
  "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": "*",
1316
+ "name": "layoutStyles",
1475
1317
  "declaration": {
1476
- "name": "*",
1477
- "package": "./constants"
1318
+ "name": "layoutStyles",
1319
+ "module": "../styles"
1478
1320
  }
1479
1321
  },
1480
1322
  {
1481
1323
  "kind": "js",
1482
- "name": "*",
1324
+ "name": "FoundationLayout",
1483
1325
  "declaration": {
1484
- "name": "*",
1485
- "package": "./dragging.styles"
1326
+ "name": "FoundationLayout",
1327
+ "module": "src/main/layout-main.ts"
1486
1328
  }
1487
1329
  },
1488
1330
  {
1489
1331
  "kind": "js",
1490
- "name": "*",
1332
+ "name": "layoutTemplate",
1491
1333
  "declaration": {
1492
- "name": "*",
1493
- "package": "./layout.styles"
1334
+ "name": "layoutTemplate",
1335
+ "module": "src/main/layout-main.ts"
1494
1336
  }
1495
1337
  }
1496
1338
  ]
1497
1339
  },
1498
1340
  {
1499
1341
  "kind": "javascript-module",
1500
- "path": "src/styles/layout.styles.ts",
1342
+ "path": "src/main/layout-region.ts",
1501
1343
  "declarations": [
1502
1344
  {
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"
1345
+ "kind": "class",
1346
+ "description": "",
1347
+ "name": "FoundationLayoutRegion",
1348
+ "members": [
1349
+ {
1350
+ "kind": "field",
1351
+ "name": "size",
1352
+ "type": {
1353
+ "text": "string"
1354
+ },
1355
+ "description": "optional string describing the size of the new item (see the written documentation for more info)",
1356
+ "privacy": "public"
1357
+ },
1358
+ {
1359
+ "kind": "field",
1360
+ "name": "type",
1361
+ "type": {
1362
+ "text": "LayoutRegionType"
1363
+ },
1364
+ "default": "layoutRegionValue[0]",
1365
+ "description": "Defines the LayoutRegionType| type of the region.\nDefaults to `horizontal`.",
1366
+ "privacy": "public"
1367
+ },
1368
+ {
1369
+ "kind": "field",
1370
+ "name": "_presentation",
1371
+ "type": {
1372
+ "text": "ComponentPresentation | null | undefined"
1373
+ },
1374
+ "privacy": "private",
1375
+ "default": "void 0",
1376
+ "inheritedFrom": {
1377
+ "name": "FoundationElement",
1378
+ "module": "src/foundation-element/foundation-element.ts"
1379
+ }
1380
+ },
1381
+ {
1382
+ "kind": "field",
1383
+ "name": "$presentation",
1384
+ "type": {
1385
+ "text": "ComponentPresentation | null"
1386
+ },
1387
+ "privacy": "public",
1388
+ "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
1389
+ "inheritedFrom": {
1390
+ "name": "FoundationElement",
1391
+ "module": "src/foundation-element/foundation-element.ts"
1392
+ }
1393
+ },
1394
+ {
1395
+ "kind": "field",
1396
+ "name": "template",
1397
+ "type": {
1398
+ "text": "ElementViewTemplate | void | null"
1399
+ },
1400
+ "privacy": "public",
1401
+ "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.",
1402
+ "inheritedFrom": {
1403
+ "name": "FoundationElement",
1404
+ "module": "src/foundation-element/foundation-element.ts"
1405
+ }
1406
+ },
1407
+ {
1408
+ "kind": "method",
1409
+ "name": "templateChanged",
1410
+ "privacy": "protected",
1411
+ "return": {
1412
+ "type": {
1413
+ "text": "void"
1414
+ }
1415
+ },
1416
+ "inheritedFrom": {
1417
+ "name": "FoundationElement",
1418
+ "module": "src/foundation-element/foundation-element.ts"
1419
+ }
1420
+ },
1421
+ {
1422
+ "kind": "field",
1423
+ "name": "styles",
1424
+ "type": {
1425
+ "text": "ElementStyles | void | null"
1426
+ },
1427
+ "privacy": "public",
1428
+ "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.",
1429
+ "inheritedFrom": {
1430
+ "name": "FoundationElement",
1431
+ "module": "src/foundation-element/foundation-element.ts"
1432
+ }
1433
+ },
1434
+ {
1435
+ "kind": "method",
1436
+ "name": "stylesChanged",
1437
+ "privacy": "protected",
1438
+ "return": {
1439
+ "type": {
1440
+ "text": "void"
1441
+ }
1442
+ },
1443
+ "inheritedFrom": {
1444
+ "name": "FoundationElement",
1445
+ "module": "src/foundation-element/foundation-element.ts"
1446
+ }
1447
+ },
1448
+ {
1449
+ "kind": "method",
1450
+ "name": "compose",
1451
+ "privacy": "public",
1452
+ "static": true,
1453
+ "return": {
1454
+ "type": {
1455
+ "text": "(\n overrideDefinition?: OverrideFoundationElementDefinition<T>\n ) => FoundationElementRegistry<T, K>"
1456
+ }
1457
+ },
1458
+ "parameters": [
1459
+ {
1460
+ "name": "this",
1461
+ "type": {
1462
+ "text": "K"
1463
+ }
1464
+ },
1465
+ {
1466
+ "name": "elementDefinition",
1467
+ "type": {
1468
+ "text": "T"
1469
+ },
1470
+ "description": "The definition of the element to create the registry\nfunction for."
1471
+ }
1472
+ ],
1473
+ "description": "Defines an element registry function with a set of element definition defaults.",
1474
+ "inheritedFrom": {
1475
+ "name": "FoundationElement",
1476
+ "module": "src/foundation-element/foundation-element.ts"
1477
+ }
1478
+ }
1479
+ ],
1480
+ "attributes": [
1481
+ {
1482
+ "name": "size",
1483
+ "type": {
1484
+ "text": "string"
1485
+ },
1486
+ "description": "optional string describing the size of the new item (see the written documentation for more info)",
1487
+ "fieldName": "size"
1488
+ },
1489
+ {
1490
+ "name": "type",
1491
+ "type": {
1492
+ "text": "LayoutRegionType"
1493
+ },
1494
+ "default": "defaultLayoutType",
1495
+ "description": "Defines the LayoutRegionType| type of the region.\nDefaults to `horizontal`.",
1496
+ "resolveInitializer": {
1497
+ "module": "src/main/layout-region.ts"
1498
+ },
1499
+ "fieldName": "type"
1500
+ }
1501
+ ],
1502
+ "superclass": {
1503
+ "name": "FoundationElement",
1504
+ "package": "@microsoft/fast-foundation"
1505
+ },
1506
+ "tagName": "%%prefix%%-layout-region",
1507
+ "customElement": true
1508
1508
  }
1509
1509
  ],
1510
1510
  "exports": [
1511
1511
  {
1512
1512
  "kind": "js",
1513
- "name": "layoutStyles",
1513
+ "name": "FoundationLayoutRegion",
1514
1514
  "declaration": {
1515
- "name": "layoutStyles",
1516
- "module": "src/styles/layout.styles.ts"
1515
+ "name": "FoundationLayoutRegion",
1516
+ "module": "src/main/layout-region.ts"
1517
1517
  }
1518
1518
  }
1519
1519
  ]