@genesislcap/foundation-layout 14.393.3-FUI-2471.2 → 14.393.3-FUI-2471.3

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 (13) hide show
  1. package/dist/custom-elements.json +171 -128
  2. package/dist/dts/main/layout-main.d.ts.map +1 -1
  3. package/dist/dts/main/layout-popout-controller.d.ts +14 -5
  4. package/dist/dts/main/layout-popout-controller.d.ts.map +1 -1
  5. package/dist/dts/utils/popout-events.d.ts +19 -13
  6. package/dist/dts/utils/popout-events.d.ts.map +1 -1
  7. package/dist/dts/utils/types.d.ts +19 -8
  8. package/dist/dts/utils/types.d.ts.map +1 -1
  9. package/dist/esm/main/layout-main.js +5 -2
  10. package/dist/esm/main/layout-popout-controller.js +74 -28
  11. package/dist/foundation-layout.d.ts +14 -4
  12. package/docs/api-report.md.api.md +1 -1
  13. package/package.json +15 -15
package/dist/custom-elements.json CHANGED
@@ -995,7 +995,7 @@
995
995
  {
996
996
  "kind": "variable",
997
997
  "name": "layoutTemplate",
998
- "default": "html<FoundationLayout>`\n <template>\n ${when(\n (x) => Boolean(x.popoutConfig),\n html<FoundationLayout>`\n <foundation-layout-popout-controller\n ${ref('popoutController')}\n channel-name=\"${(x) => x.popoutConfig?.channelName}\"\n ></foundation-layout-popout-controller>\n `,\n )}\n ${when((x) => !x.hasFirstLoaded && x.usingDeclerativeAPI, loadingTemplate)}\n <div class=\"layout-container\" ${ref('layoutElement')}></div>\n </template>\n`",
998
+ "default": "html<FoundationLayout>`\n <template>\n ${when(\n (x) => Boolean(x.popoutConfig),\n html<FoundationLayout>`\n <foundation-layout-popout-controller\n ${ref('popoutController')}\n :parentLayout=\"${(x) => x}\"\n channel-name=\"${(x) => x.popoutConfig?.channelName}\"\n ></foundation-layout-popout-controller>\n `,\n )}\n ${when((x) => !x.hasFirstLoaded && x.usingDeclerativeAPI, loadingTemplate)}\n <div class=\"layout-container\" ${ref('layoutElement')}></div>\n </template>\n`",
999
999
  "description": "`ViewTemplate` which defines the html for FoundationLayout.",
1000
1000
  "privacy": "public"
1001
1001
  }
@@ -1077,7 +1077,7 @@
1077
1077
  },
1078
1078
  {
1079
1079
  "kind": "field",
1080
- "name": "lastGeometry",
1080
+ "name": "lastUpdate",
1081
1081
  "type": {
1082
1082
  "text": "string"
1083
1083
  },
@@ -1087,7 +1087,7 @@
1087
1087
  "kind": "field",
1088
1088
  "name": "popoutRegistry",
1089
1089
  "type": {
1090
- "text": "Map<string, { geometry: PopoutState['geometry']; window?: Window }>"
1090
+ "text": "Map<\n string,\n { geometry: PopoutGeometry; state?: unknown; window?: Window }\n >"
1091
1091
  },
1092
1092
  "privacy": "private",
1093
1093
  "default": "new Map()"
@@ -1102,6 +1102,19 @@
1102
1102
  "name": "setupListener",
1103
1103
  "privacy": "private"
1104
1104
  },
1105
+ {
1106
+ "kind": "method",
1107
+ "name": "applyStateToParent",
1108
+ "privacy": "private",
1109
+ "parameters": [
1110
+ {
1111
+ "name": "state",
1112
+ "type": {
1113
+ "text": "unknown"
1114
+ }
1115
+ }
1116
+ ]
1117
+ },
1105
1118
  {
1106
1119
  "kind": "method",
1107
1120
  "name": "setupUnloadListener",
@@ -1130,17 +1143,39 @@
1130
1143
  {
1131
1144
  "kind": "method",
1132
1145
  "name": "getGeometry",
1133
- "privacy": "private"
1146
+ "privacy": "private",
1147
+ "return": {
1148
+ "type": {
1149
+ "text": "Promise<PopoutGeometry>"
1150
+ }
1151
+ }
1134
1152
  },
1135
1153
  {
1136
1154
  "kind": "method",
1137
- "name": "broadcastGeometry",
1155
+ "name": "getComponentState",
1156
+ "privacy": "private",
1157
+ "return": {
1158
+ "type": {
1159
+ "text": "unknown"
1160
+ }
1161
+ }
1162
+ },
1163
+ {
1164
+ "kind": "method",
1165
+ "name": "broadcastUpdate",
1138
1166
  "privacy": "private",
1139
1167
  "parameters": [
1140
1168
  {
1141
1169
  "name": "geometry",
1142
1170
  "type": {
1143
- "text": "Awaited<ReturnType<typeof this.getGeometry>>"
1171
+ "text": "PopoutGeometry"
1172
+ }
1173
+ },
1174
+ {
1175
+ "name": "state",
1176
+ "optional": true,
1177
+ "type": {
1178
+ "text": "unknown"
1144
1179
  }
1145
1180
  }
1146
1181
  ]
@@ -1158,12 +1193,12 @@
1158
1193
  "description": "The registration ID of the component to pop out."
1159
1194
  },
1160
1195
  {
1161
- "name": "geometry",
1196
+ "name": "popoutState",
1162
1197
  "optional": true,
1163
1198
  "type": {
1164
- "text": "any"
1199
+ "text": "PopoutState"
1165
1200
  },
1166
- "description": "Optional geometry to use for the new window."
1201
+ "description": "Optional state (geometry and component state) to use for the new window."
1167
1202
  },
1168
1203
  {
1169
1204
  "name": "uuid",
@@ -1429,125 +1464,6 @@
1429
1464
  }
1430
1465
  ]
1431
1466
  },
1432
- {
1433
- "kind": "javascript-module",
1434
- "path": "src/styles/constants.ts",
1435
- "declarations": [
1436
- {
1437
- "kind": "function",
1438
- "name": "glVisualConfig",
1439
- "return": {
1440
- "type": {
1441
- "text": "Omit<LayoutConfig, 'root'>"
1442
- }
1443
- }
1444
- },
1445
- {
1446
- "kind": "variable",
1447
- "name": "LAYOUT_ICONS",
1448
- "type": {
1449
- "text": "{\n renameSVG,\n maximiseSVG,\n minimiseSVG,\n closeSVG,\n tabDropdownSVG,\n popoutSVG,\n}"
1450
- },
1451
- "default": "{\n renameSVG,\n maximiseSVG,\n minimiseSVG,\n closeSVG,\n tabDropdownSVG,\n popoutSVG,\n}",
1452
- "description": "A collection of SVG icons in base64 format.",
1453
- "privacy": "public"
1454
- }
1455
- ],
1456
- "exports": [
1457
- {
1458
- "kind": "js",
1459
- "name": "glVisualConfig",
1460
- "declaration": {
1461
- "name": "glVisualConfig",
1462
- "module": "src/styles/constants.ts"
1463
- }
1464
- },
1465
- {
1466
- "kind": "js",
1467
- "name": "LAYOUT_ICONS",
1468
- "declaration": {
1469
- "name": "LAYOUT_ICONS",
1470
- "module": "src/styles/constants.ts"
1471
- }
1472
- }
1473
- ]
1474
- },
1475
- {
1476
- "kind": "javascript-module",
1477
- "path": "src/styles/dragging.styles.ts",
1478
- "declarations": [
1479
- {
1480
- "kind": "variable",
1481
- "name": "globalDraggingStyles",
1482
- "default": "`\n .lm_dragProxy .lm_content {\n box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.9);\n }\n .lm_dropTargetIndicator {\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`",
1483
- "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"
1484
- }
1485
- ],
1486
- "exports": [
1487
- {
1488
- "kind": "js",
1489
- "name": "globalDraggingStyles",
1490
- "declaration": {
1491
- "name": "globalDraggingStyles",
1492
- "module": "src/styles/dragging.styles.ts"
1493
- }
1494
- }
1495
- ]
1496
- },
1497
- {
1498
- "kind": "javascript-module",
1499
- "path": "src/styles/index.ts",
1500
- "declarations": [],
1501
- "exports": [
1502
- {
1503
- "kind": "js",
1504
- "name": "*",
1505
- "declaration": {
1506
- "name": "*",
1507
- "package": "./constants"
1508
- }
1509
- },
1510
- {
1511
- "kind": "js",
1512
- "name": "*",
1513
- "declaration": {
1514
- "name": "*",
1515
- "package": "./dragging.styles"
1516
- }
1517
- },
1518
- {
1519
- "kind": "js",
1520
- "name": "*",
1521
- "declaration": {
1522
- "name": "*",
1523
- "package": "./layout.styles"
1524
- }
1525
- }
1526
- ]
1527
- },
1528
- {
1529
- "kind": "javascript-module",
1530
- "path": "src/styles/layout.styles.ts",
1531
- "declarations": [
1532
- {
1533
- "kind": "variable",
1534
- "name": "layoutStyles",
1535
- "default": "css`\n ${containerStyles}\n ${loadingSpinnerStyles}\n\n :host {\n --foundation-tab-height: calc(\n (((var(--base-height-multiplier) + var(--density)) * var(--design-unit)) - 4) * 1px\n );\n }\n\n .lm_goldenlayout {\n border-radius: calc(var(--control-corner-radius) * 1.5px);\n }\n\n .lm_stack.lm_item {\n background-color: var(--neutral-layer-3);\n border-radius: calc(var(--control-corner-radius) * 1.5px);\n }\n\n .lm_maximised .lm_header {\n background-color: var(--neutral-layer-3);\n border-radius: calc(var(--control-corner-radius) * 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: var(--neutral-layer-card-container);\n border-radius: calc(var(--control-corner-radius) * 1.5px);\n border: 1px solid;\n border-color: var(--neutral-stroke-rest);\n box-sizing: border-box;\n color: var(--neutral-foreground-rest);\n }\n\n .lm_header .lm_tabs {\n padding: 0 16px;\n }\n\n .lm_stack > .lm_items {\n box-shadow: 0 -1px 15px rgb(0 0 0 / 15%);\n }\n\n .lm_header .lm_tab.lm_active.lm_focused {\n background-color: var(--neutral-layer-card-container);\n }\n\n .lm_header .lm_tab.lm_active {\n background-color: var(--neutral-layer-card-container);\n border: 1px solid;\n border-color: var(--neutral-stroke-rest);\n border-bottom: 0;\n color: var(--accent-foreground-rest);\n }\n\n .lm_header .lm_tab {\n align-items: center;\n background-color: var(--neutral-layer-4);\n border: 0;\n border-bottom-color: transparent;\n border-bottom: 0 solid;\n border-color: var(--neutral-stroke-rest);\n border-radius: calc(var(--control-corner-radius) * 1.5px)\n calc(var(--control-corner-radius) * 1.5px) 0 0;\n color: var(--accent-foreground-rest);\n display: flex;\n font-family: inherit;\n font-size: 13px;\n font-weight: 400;\n height: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) - 8px);\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: var(--neutral-layer-card-container);\n color: var(--accent-foreground-rest);\n }\n\n .lm_header .lm_controls {\n top: 4px;\n display: flex;\n }\n\n .lm_header .lm_controls > * {\n width: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) - 6px);\n height: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) - 6px);\n background-repeat: no-repeat;\n background-position: center;\n background-size: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) * 0.533333);\n background-color: color-mix(in srgb, var(--neutral-fill-strong-rest), transparent 90%);\n border-radius: calc(var(--control-corner-radius) * 1.5px);\n margin-right: 4px;\n top: 3px;\n opacity: 100%;\n }\n\n .lm_header .lm_controls > *:hover {\n background-color: color-mix(in srgb, var(--neutral-fill-strong-hover), transparent 75%);\n cursor: pointer;\n }\n\n .lm_controls .lm_maximise {\n background-image: url('${LAYOUT_ICONS.maximiseSVG}');\n }\n\n .lm_maximised .lm_controls .lm_maximise {\n background-image: url('${LAYOUT_ICONS.minimiseSVG}');\n }\n\n .lm_controls .lm_close {\n background-image: url('${LAYOUT_ICONS.closeSVG}');\n }\n\n .lm_header .lm_tab .lm_close_tab {\n background-image: url('${LAYOUT_ICONS.closeSVG}');\n background-size: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) * 0.2777);\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: var(--neutral-foreground-hint);\n }\n\n .lm_header .lm_controls .lm_tabdropdown::before {\n content: none;\n }\n\n .lm_header .lm_controls .lm_tabdropdown {\n background-image: url('${LAYOUT_ICONS.tabDropdownSVG}');\n }\n\n .lm_header .lm_tabdropdown_list {\n top: var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT});\n right: 108px;\n background-color: var(--neutral-layer-3);\n border: 1px solid;\n border-color: var(--neutral-stroke-rest);\n border-radius: calc(var(--control-corner-radius) * 1.5px);\n box-shadow: 0 5px 15px rgb(0 0 0 / 35%);\n }\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: var(--neutral-foreground-rest);\n height: var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT});\n border-radius: 0;\n overflow: visible;\n text-overflow: normal;\n }\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\n .lm_row > .lm_item {\n float: left;\n }\n\n .lm_content {\n overflow: hidden;\n position: relative;\n }\n\n .lm_dragging,\n .lm_dragging * {\n cursor: move !important;\n user-select: none;\n }\n\n .lm_maximised {\n left: 0;\n padding: 1px;\n position: absolute;\n top: 0;\n z-index: 40;\n }\n\n .lm_maximise_placeholder {\n display: none;\n }\n\n .lm_splitter {\n position: relative;\n z-index: 20;\n }\n\n .lm_splitter:hover,\n .lm_splitter.lm_dragging {\n background: var(--accent-fill-rest);\n border-radius: calc(var(--control-corner-radius) * 4px);\n }\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\n .lm_splitter.lm_horizontal {\n float: left;\n height: 100%;\n }\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\n .lm_header {\n overflow: visible;\n position: relative;\n }\n\n .lm_header [class^='lm_'] {\n box-sizing: content-box !important;\n }\n\n .lm_header .lm_controls {\n position: absolute;\n right: 3px;\n }\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\n .lm_header ul {\n margin: 0;\n padding: 0;\n list-style-type: none;\n }\n\n .lm_header .lm_tabs {\n position: absolute;\n }\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\n .lm_header .lm_tab i {\n width: 2px;\n height: 19px;\n position: absolute;\n }\n\n .lm_header .lm_tab i.lm_left {\n top: 0;\n left: -2px;\n }\n\n .lm_header .lm_tab i.lm_right {\n top: 0;\n right: -2px;\n }\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\n .lm_header .lm_tab .lm_title:only-child {\n padding-left: 10px;\n }\n\n .lm_header .lm_tab .lm_close_tab {\n width: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) * 0.3888);\n height: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) * 0.3888);\n top: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) * 0.3055);\n position: absolute;\n right: 0;\n text-align: center;\n }\n\n .lm_stack.lm_left .lm_header,\n .lm_stack.lm_right .lm_header {\n height: 100%;\n }\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\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\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\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\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\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\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\n .lm_dragProxy.lm_right .lm_content {\n float: left;\n }\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\n .lm_dragProxy.lm_right .lm_header .lm_controls,\n .lm_stack.lm_right .lm_header .lm_controls {\n left: 3px;\n }\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\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\n .lm_dragProxy.lm_bottom .lm_header .lm_controls,\n .lm_stack.lm_bottom .lm_header .lm_controls {\n top: 3px;\n }\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\n .lm_drop_tab_placeholder {\n float: left;\n width: 100px;\n height: 10px;\n visibility: hidden;\n }\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\n .lm_header .lm_tabdropdown_list .lm_tab {\n clear: both;\n padding-right: 10px;\n margin: 0;\n }\n\n .lm_header .lm_tabdropdown_list .lm_tab .lm_title {\n width: 100px;\n }\n\n .lm_header .lm_tabdropdown_list .lm_close_tab {\n display: none !important;\n }\n\n .lm_dragProxy {\n position: absolute;\n top: 0;\n left: 0;\n z-index: 30;\n }\n\n .lm_dragProxy .lm_header {\n background: transparent;\n }\n\n .lm_dragProxy .lm_content {\n border-top: none;\n overflow: hidden;\n }\n\n .lm_dropTargetIndicator {\n display: none;\n position: absolute;\n z-index: 20;\n box-shadow: none;\n }\n\n .lm_dropTargetIndicator .lm_inner {\n width: 100%;\n height: 100%;\n position: relative;\n top: 0;\n left: 0;\n }\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\n .lm_popin {\n width: 20px;\n height: 20px;\n position: absolute;\n bottom: 0;\n right: 0;\n z-index: 9999;\n }\n\n .lm_popin > * {\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n }\n\n .lm_popin > .lm_bg {\n z-index: 10;\n }\n\n .lm_popin > .lm_icon {\n z-index: 20;\n } /*# sourceMappingURL=goldenlayout-base.css.map */\n`",
1536
- "description": "`ElementStyles` which defines the css for FoundationLayout.",
1537
- "privacy": "public"
1538
- }
1539
- ],
1540
- "exports": [
1541
- {
1542
- "kind": "js",
1543
- "name": "layoutStyles",
1544
- "declaration": {
1545
- "name": "layoutStyles",
1546
- "module": "src/styles/layout.styles.ts"
1547
- }
1548
- }
1549
- ]
1550
- },
1551
1467
  {
1552
1468
  "kind": "javascript-module",
1553
1469
  "path": "src/utils/constants.ts",
@@ -1966,6 +1882,14 @@
1966
1882
  "name": "LAYOUT_POPOUT_CHANNEL_NAME",
1967
1883
  "module": "src/utils/popout-events.ts"
1968
1884
  }
1885
+ },
1886
+ {
1887
+ "kind": "js",
1888
+ "name": "PopoutGeometry",
1889
+ "declaration": {
1890
+ "name": "PopoutGeometry",
1891
+ "module": "src/utils/popout-events.ts"
1892
+ }
1969
1893
  }
1970
1894
  ]
1971
1895
  },
@@ -1980,6 +1904,125 @@
1980
1904
  "path": "src/utils/types.ts",
1981
1905
  "declarations": [],
1982
1906
  "exports": []
1907
+ },
1908
+ {
1909
+ "kind": "javascript-module",
1910
+ "path": "src/styles/constants.ts",
1911
+ "declarations": [
1912
+ {
1913
+ "kind": "function",
1914
+ "name": "glVisualConfig",
1915
+ "return": {
1916
+ "type": {
1917
+ "text": "Omit<LayoutConfig, 'root'>"
1918
+ }
1919
+ }
1920
+ },
1921
+ {
1922
+ "kind": "variable",
1923
+ "name": "LAYOUT_ICONS",
1924
+ "type": {
1925
+ "text": "{\n renameSVG,\n maximiseSVG,\n minimiseSVG,\n closeSVG,\n tabDropdownSVG,\n popoutSVG,\n}"
1926
+ },
1927
+ "default": "{\n renameSVG,\n maximiseSVG,\n minimiseSVG,\n closeSVG,\n tabDropdownSVG,\n popoutSVG,\n}",
1928
+ "description": "A collection of SVG icons in base64 format.",
1929
+ "privacy": "public"
1930
+ }
1931
+ ],
1932
+ "exports": [
1933
+ {
1934
+ "kind": "js",
1935
+ "name": "glVisualConfig",
1936
+ "declaration": {
1937
+ "name": "glVisualConfig",
1938
+ "module": "src/styles/constants.ts"
1939
+ }
1940
+ },
1941
+ {
1942
+ "kind": "js",
1943
+ "name": "LAYOUT_ICONS",
1944
+ "declaration": {
1945
+ "name": "LAYOUT_ICONS",
1946
+ "module": "src/styles/constants.ts"
1947
+ }
1948
+ }
1949
+ ]
1950
+ },
1951
+ {
1952
+ "kind": "javascript-module",
1953
+ "path": "src/styles/dragging.styles.ts",
1954
+ "declarations": [
1955
+ {
1956
+ "kind": "variable",
1957
+ "name": "globalDraggingStyles",
1958
+ "default": "`\n .lm_dragProxy .lm_content {\n box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.9);\n }\n .lm_dropTargetIndicator {\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`",
1959
+ "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"
1960
+ }
1961
+ ],
1962
+ "exports": [
1963
+ {
1964
+ "kind": "js",
1965
+ "name": "globalDraggingStyles",
1966
+ "declaration": {
1967
+ "name": "globalDraggingStyles",
1968
+ "module": "src/styles/dragging.styles.ts"
1969
+ }
1970
+ }
1971
+ ]
1972
+ },
1973
+ {
1974
+ "kind": "javascript-module",
1975
+ "path": "src/styles/index.ts",
1976
+ "declarations": [],
1977
+ "exports": [
1978
+ {
1979
+ "kind": "js",
1980
+ "name": "*",
1981
+ "declaration": {
1982
+ "name": "*",
1983
+ "package": "./constants"
1984
+ }
1985
+ },
1986
+ {
1987
+ "kind": "js",
1988
+ "name": "*",
1989
+ "declaration": {
1990
+ "name": "*",
1991
+ "package": "./dragging.styles"
1992
+ }
1993
+ },
1994
+ {
1995
+ "kind": "js",
1996
+ "name": "*",
1997
+ "declaration": {
1998
+ "name": "*",
1999
+ "package": "./layout.styles"
2000
+ }
2001
+ }
2002
+ ]
2003
+ },
2004
+ {
2005
+ "kind": "javascript-module",
2006
+ "path": "src/styles/layout.styles.ts",
2007
+ "declarations": [
2008
+ {
2009
+ "kind": "variable",
2010
+ "name": "layoutStyles",
2011
+ "default": "css`\n ${containerStyles}\n ${loadingSpinnerStyles}\n\n :host {\n --foundation-tab-height: calc(\n (((var(--base-height-multiplier) + var(--density)) * var(--design-unit)) - 4) * 1px\n );\n }\n\n .lm_goldenlayout {\n border-radius: calc(var(--control-corner-radius) * 1.5px);\n }\n\n .lm_stack.lm_item {\n background-color: var(--neutral-layer-3);\n border-radius: calc(var(--control-corner-radius) * 1.5px);\n }\n\n .lm_maximised .lm_header {\n background-color: var(--neutral-layer-3);\n border-radius: calc(var(--control-corner-radius) * 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: var(--neutral-layer-card-container);\n border-radius: calc(var(--control-corner-radius) * 1.5px);\n border: 1px solid;\n border-color: var(--neutral-stroke-rest);\n box-sizing: border-box;\n color: var(--neutral-foreground-rest);\n }\n\n .lm_header .lm_tabs {\n padding: 0 16px;\n }\n\n .lm_stack > .lm_items {\n box-shadow: 0 -1px 15px rgb(0 0 0 / 15%);\n }\n\n .lm_header .lm_tab.lm_active.lm_focused {\n background-color: var(--neutral-layer-card-container);\n }\n\n .lm_header .lm_tab.lm_active {\n background-color: var(--neutral-layer-card-container);\n border: 1px solid;\n border-color: var(--neutral-stroke-rest);\n border-bottom: 0;\n color: var(--accent-foreground-rest);\n }\n\n .lm_header .lm_tab {\n align-items: center;\n background-color: var(--neutral-layer-4);\n border: 0;\n border-bottom-color: transparent;\n border-bottom: 0 solid;\n border-color: var(--neutral-stroke-rest);\n border-radius: calc(var(--control-corner-radius) * 1.5px)\n calc(var(--control-corner-radius) * 1.5px) 0 0;\n color: var(--accent-foreground-rest);\n display: flex;\n font-family: inherit;\n font-size: 13px;\n font-weight: 400;\n height: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) - 8px);\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: var(--neutral-layer-card-container);\n color: var(--accent-foreground-rest);\n }\n\n .lm_header .lm_controls {\n top: 4px;\n display: flex;\n }\n\n .lm_header .lm_controls > * {\n width: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) - 6px);\n height: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) - 6px);\n background-repeat: no-repeat;\n background-position: center;\n background-size: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) * 0.533333);\n background-color: color-mix(in srgb, var(--neutral-fill-strong-rest), transparent 90%);\n border-radius: calc(var(--control-corner-radius) * 1.5px);\n margin-right: 4px;\n top: 3px;\n opacity: 100%;\n }\n\n .lm_header .lm_controls > *:hover {\n background-color: color-mix(in srgb, var(--neutral-fill-strong-hover), transparent 75%);\n cursor: pointer;\n }\n\n .lm_controls .lm_maximise {\n background-image: url('${LAYOUT_ICONS.maximiseSVG}');\n }\n\n .lm_maximised .lm_controls .lm_maximise {\n background-image: url('${LAYOUT_ICONS.minimiseSVG}');\n }\n\n .lm_controls .lm_close {\n background-image: url('${LAYOUT_ICONS.closeSVG}');\n }\n\n .lm_header .lm_tab .lm_close_tab {\n background-image: url('${LAYOUT_ICONS.closeSVG}');\n background-size: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) * 0.2777);\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: var(--neutral-foreground-hint);\n }\n\n .lm_header .lm_controls .lm_tabdropdown::before {\n content: none;\n }\n\n .lm_header .lm_controls .lm_tabdropdown {\n background-image: url('${LAYOUT_ICONS.tabDropdownSVG}');\n }\n\n .lm_header .lm_tabdropdown_list {\n top: var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT});\n right: 108px;\n background-color: var(--neutral-layer-3);\n border: 1px solid;\n border-color: var(--neutral-stroke-rest);\n border-radius: calc(var(--control-corner-radius) * 1.5px);\n box-shadow: 0 5px 15px rgb(0 0 0 / 35%);\n }\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: var(--neutral-foreground-rest);\n height: var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT});\n border-radius: 0;\n overflow: visible;\n text-overflow: normal;\n }\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\n .lm_row > .lm_item {\n float: left;\n }\n\n .lm_content {\n overflow: hidden;\n position: relative;\n }\n\n .lm_dragging,\n .lm_dragging * {\n cursor: move !important;\n user-select: none;\n }\n\n .lm_maximised {\n left: 0;\n padding: 1px;\n position: absolute;\n top: 0;\n z-index: 40;\n }\n\n .lm_maximise_placeholder {\n display: none;\n }\n\n .lm_splitter {\n position: relative;\n z-index: 20;\n }\n\n .lm_splitter:hover,\n .lm_splitter.lm_dragging {\n background: var(--accent-fill-rest);\n border-radius: calc(var(--control-corner-radius) * 4px);\n }\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\n .lm_splitter.lm_horizontal {\n float: left;\n height: 100%;\n }\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\n .lm_header {\n overflow: visible;\n position: relative;\n }\n\n .lm_header [class^='lm_'] {\n box-sizing: content-box !important;\n }\n\n .lm_header .lm_controls {\n position: absolute;\n right: 3px;\n }\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\n .lm_header ul {\n margin: 0;\n padding: 0;\n list-style-type: none;\n }\n\n .lm_header .lm_tabs {\n position: absolute;\n }\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\n .lm_header .lm_tab i {\n width: 2px;\n height: 19px;\n position: absolute;\n }\n\n .lm_header .lm_tab i.lm_left {\n top: 0;\n left: -2px;\n }\n\n .lm_header .lm_tab i.lm_right {\n top: 0;\n right: -2px;\n }\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\n .lm_header .lm_tab .lm_title:only-child {\n padding-left: 10px;\n }\n\n .lm_header .lm_tab .lm_close_tab {\n width: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) * 0.3888);\n height: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) * 0.3888);\n top: calc(var(--foundation-tab-height, ${DEFAULT_TAB_HEIGHT}) * 0.3055);\n position: absolute;\n right: 0;\n text-align: center;\n }\n\n .lm_stack.lm_left .lm_header,\n .lm_stack.lm_right .lm_header {\n height: 100%;\n }\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\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\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\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\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\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\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\n .lm_dragProxy.lm_right .lm_content {\n float: left;\n }\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\n .lm_dragProxy.lm_right .lm_header .lm_controls,\n .lm_stack.lm_right .lm_header .lm_controls {\n left: 3px;\n }\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\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\n .lm_dragProxy.lm_bottom .lm_header .lm_controls,\n .lm_stack.lm_bottom .lm_header .lm_controls {\n top: 3px;\n }\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\n .lm_drop_tab_placeholder {\n float: left;\n width: 100px;\n height: 10px;\n visibility: hidden;\n }\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\n .lm_header .lm_tabdropdown_list .lm_tab {\n clear: both;\n padding-right: 10px;\n margin: 0;\n }\n\n .lm_header .lm_tabdropdown_list .lm_tab .lm_title {\n width: 100px;\n }\n\n .lm_header .lm_tabdropdown_list .lm_close_tab {\n display: none !important;\n }\n\n .lm_dragProxy {\n position: absolute;\n top: 0;\n left: 0;\n z-index: 30;\n }\n\n .lm_dragProxy .lm_header {\n background: transparent;\n }\n\n .lm_dragProxy .lm_content {\n border-top: none;\n overflow: hidden;\n }\n\n .lm_dropTargetIndicator {\n display: none;\n position: absolute;\n z-index: 20;\n box-shadow: none;\n }\n\n .lm_dropTargetIndicator .lm_inner {\n width: 100%;\n height: 100%;\n position: relative;\n top: 0;\n left: 0;\n }\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\n .lm_popin {\n width: 20px;\n height: 20px;\n position: absolute;\n bottom: 0;\n right: 0;\n z-index: 9999;\n }\n\n .lm_popin > * {\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n }\n\n .lm_popin > .lm_bg {\n z-index: 10;\n }\n\n .lm_popin > .lm_icon {\n z-index: 20;\n } /*# sourceMappingURL=goldenlayout-base.css.map */\n`",
2012
+ "description": "`ElementStyles` which defines the css for FoundationLayout.",
2013
+ "privacy": "public"
2014
+ }
2015
+ ],
2016
+ "exports": [
2017
+ {
2018
+ "kind": "js",
2019
+ "name": "layoutStyles",
2020
+ "declaration": {
2021
+ "name": "layoutStyles",
2022
+ "module": "src/styles/layout.styles.ts"
2023
+ }
2024
+ }
2025
+ ]
1983
2026
  }
1984
2027
  ]
1985
2028
  }
package/dist/dts/main/layout-main.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"layout-main.d.ts","sourceRoot":"","sources":["../../../src/main/layout-main.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"layout-main.d.ts","sourceRoot":"","sources":["../../../src/main/layout-main.ts"],"names":[],"mappings":"AAAA,OAAO,EAKL,YAAY,EAEZ,cAAc,EAGf,MAAM,kCAAkC,CAAC;AAK1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAE/D,OAAO,EAGL,gBAAgB,EAChB,aAAa,EACb,YAAY,EAOZ,eAAe,EAGf,kBAAkB,EAGlB,SAAS,EAET,uBAAuB,EACvB,kBAAkB,EAClB,gBAAgB,EACjB,MAAM,WAAW,CAAC;AAInB,OAAO,EAAE,gCAAgC,EAAE,MAAM,4BAA4B,CAAC;AAE9E,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAmBzC;;;;;;;;;;;GAWG;AACH,qBAAa,gBAAiB,SAAQ,iBAAkB,YAAW,eAAe;;IAChF,OAAO,CAAC,MAAM,CAAe;IAC7B,gBAAgB;IAChB,aAAa,EAAE,WAAW,CAAC;IAC3B,OAAO,CAAC,YAAY,CAAqC;IACzD,OAAO,CAAC,mBAAmB,CAAqC;IAEhE,gBAAgB;IAChB,CAAC,aAAa,CAAC,EAAG,MAAM,CAAU;IAElC;;;;OAIG;IACmC,YAAY,EAAE,MAAM,CAAyB;IACnF,OAAO,CAAC,aAAa,CAAS;IAC9B,OAAO,CAAC,oBAAoB,CAAK;IAEjC,gBAAgB;IACV,OAAO,CAAC,IAAI,CAAO;IAEzB,gBAAgB;IACP,OAAO,CAAC,OAAO,CAAU;IAClC;;;;;OAKG;IACmC,WAAW,CAAC,EAAE,MAAM,CAAC;IAC3D;;;;OAIG;IACS,sBAAsB,GAAI,aAAa,MAAM,YAC2B;IAEpF;;;OAGG;IACH,gBAAgB,CAAC,EAAE,YAAY,CAAC,UAAU,CAAC;IAE3C;;;;;;;;;;OAUG;IACS,cAAc,UAAS;IACnC,gBAAgB;IACJ,mBAAmB,UAAS;IAExC;;;;;OAKG;IACH,aAAa,EAAE,YAAY,EAAE,CAAM;IAEnC;;;OAGG;IACS,QAAQ,EAAE,OAAO,CAAS;IAEtC;;;;;OAKG;IACI,KAAK,EAAG,sBAAsB,CAAU;IAE/C;;;;;;;OAOG;IACI,oBAAoB,EAAE,MAAM,GAAG,SAAS,CAAa;IAE5D,gBAAgB;IACJ,SAAS,UAAS;IAE9B,gBAAgB;IAChB,gBAAgB,EAAE,gCAAgC,CAAC;IACnD;;;;OAIG;IACS,YAAY,EAAE,kBAAkB,GAAG,SAAS,CAAa;IAErE,gBAAgB;;IAahB,gBAAgB;IAChB,iBAAiB,IAAI,IAAI;IA+BzB,gBAAgB;IAChB,oBAAoB,IAAI,IAAI;IAY5B,gBAAgB;IAChB,OAAO,CAAC,WAAW;IAInB,gBAAgB;IAChB,OAAO,CAAC,UAAU;IAMlB,gBAAgB;IAChB,OAAO,CAAC,eAAe;IAKvB,gBAAgB;IAChB,OAAO,CAAC,gBAAgB;IAIxB,gBAAgB;IAChB,OAAO,CAAC,iBAAiB;IAOzB,gBAAgB;IAChB,OAAO,CAAC,iBAAiB;IAKzB,gBAAgB;IAChB,OAAO,CAAC,iBAAiB;IAIzB,gBAAgB;IAChB,OAAO,CAAC,kBAAkB;IAI1B,gBAAgB;IAChB,OAAO,CAAC,kBAAkB;IAI1B,gBAAgB;IACJ,OAAO,CAAC,eAAe,CAAqB;IACxD,gBAAgB;IAChB,sBAAsB;IAQtB;;OAEG;IAEH;;;;;;;;;;OAUG;IACH,MAAM,CAAC,2BAA2B,CAAC,MAAM,EAAE,gBAAgB,GAAG,MAAM,EAAE;IActE;;;;;;;;OAQG;IACH,eAAe,IAAI,MAAM,EAAE;IAI3B;;;;;;OAMG;IACH,SAAS,IAAI,gBAAgB;IA8B7B;;;;;;;;;;;;;OAaG;IACH,qBAAqB,CAAC,WAAW,GAAE,OAAe,GAAG,OAAO;IAyC5D;;;;;;;;;;;;;OAaG;IACH,6BAA6B,IAAI,OAAO;IAcxC;;;;;;;;;;;;OAYG;IACH,+BAA+B,IAAI,OAAO;IAyB1C;;;;;;;;;;;;OAYG;IACH,UAAU,CACR,MAAM,EAAE,gBAAgB,EACxB,iBAAiB,GAAE,aAAa,GAAG,OAAiB,EACpD,YAAY,GAAE,OAAe;IAwC/B;;;;;;;;;;;OAWG;IACH,OAAO,CACL,MAAM,EAAE,uBAAuB,GAAG,uBAAuB,EAAE,EAC3D,SAAS,GAAE,SAAmC;IAsEhD;;;;;;;;;OASG;IACH,WAAW,CAAC,YAAY,EAAE,MAAM,EAAE,KAAK,GAAE,OAAe,GAAG,MAAM;IAgDjE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA0CG;IACH,YAAY,CAAC,YAAY,EAAE,MAAM,EAAE,iBAAiB,EAAE,OAAO,EAAE,GAAG,gBAAgB,GAAG,MAAM;IA4B3F;;OAEG;IAEH;;;;;OAKG;IACH,OAAO,CAAC,oBAAoB;IAI5B;;;;OAIG;IACH,mBAAmB,IAAI,IAAI;IAqB3B;;;;;;;OAOG;IACH,gBAAgB,CAAC,CAAC,SAAS,cAAc,EAAE,IAAI,EAAE,CAAC,GAAG,CAAC;IAetD;;;;;;;;OAQG;IACH,wBAAwB,CAAC,MAAM,EAAE,kBAAkB,GAAG,MAAM;IA4J5D;;;OAGG;IACH,OAAO,CAAC,wBAAwB;IAehC;;;;;;;;SAQK;IACL,OAAO,CAAC,kBAAkB;IAY1B;;;;;;;;OAQG;IACH,OAAO,CAAC,kCAAkC;IA4B1C;;;;;;;;;;;OAWG;IACH,OAAO,CAAC,oBAAoB;IAe5B;;OAEG;IACH,OAAO,CAAC,iBAAiB;IASzB;;;;;;;;OAQG;IACH,OAAO,CAAC,mBAAmB;IAU3B;;;OAGG;IACH,OAAO,CAAC,kBAAkB;IAc1B;;;OAGG;IACH,OAAO,CAAC,mBAAmB;IAM3B;;;OAGG;IACH,OAAO,CAAC,4BAA4B;IAWpC;;;OAGG;IACH,OAAO,CAAC,uBAAuB;CAwChC;AAKD;;;;;GAKG;AACH,eAAO,MAAM,cAAc,uEAe1B,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;2BAI3B,CAAC"}
package/dist/dts/main/layout-popout-controller.d.ts CHANGED
@@ -1,31 +1,40 @@
1
1
  import { FASTElement } from '@microsoft/fast-element';
2
- import { PopoutState } from '../utils';
2
+ import { LayoutComponent, PopoutState } from '../utils';
3
3
  export declare class FoundationLayoutPopoutController extends FASTElement {
4
4
  channelName: string;
5
+ /**
6
+ * Reference to the parent layout to retrieve component state
7
+ * @internal
8
+ */
9
+ parentLayout: LayoutComponent & {
10
+ getLayoutComponents(): any[][];
11
+ };
5
12
  private layoutKey;
6
13
  private channel;
7
14
  private pollInterval;
8
15
  private unloadHandler;
9
- private lastGeometry;
16
+ private lastUpdate;
10
17
  private popoutRegistry;
11
18
  connectedCallback(): void;
12
19
  disconnectedCallback(): void;
13
20
  private setupChannel;
14
21
  private setupListener;
22
+ private applyStateToParent;
15
23
  private setupUnloadListener;
16
24
  private teardownUnloadListener;
17
25
  private emitAutosave;
18
26
  private startPolling;
19
27
  private stopPolling;
20
28
  private getGeometry;
21
- private broadcastGeometry;
29
+ private getComponentState;
30
+ private broadcastUpdate;
22
31
  /**
23
32
  * Opens a component in a popout window.
24
33
  * @param registration - The registration ID of the component to pop out.
25
- * @param geometry - Optional geometry to use for the new window.
34
+ * @param popoutState - Optional state (geometry and component state) to use for the new window.
26
35
  * @param uuid - UUID generator from parent layout
27
36
  */
28
- openPopout(registration: string, geometry?: any, uuid?: any): Promise<Window>;
37
+ openPopout(registration: string, popoutState?: PopoutState, uuid?: any): Promise<Window>;
29
38
  getRegistry(): {
30
39
  [layoutKey: string]: PopoutState;
31
40
  };
package/dist/dts/main/layout-popout-controller.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"layout-popout-controller.d.ts","sourceRoot":"","sources":["../../../src/main/layout-popout-controller.ts"],"names":[],"mappings":"AAIA,OAAO,EAAuB,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAIL,WAAW,EACZ,MAAM,UAAU,CAAC;AAGlB,qBAKa,gCAAiC,SAAQ,WAAW;IAC1B,WAAW,EAAE,MAAM,CAAC;IAEzD,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,OAAO,CAA4C;IAC3D,OAAO,CAAC,YAAY,CAAM;IAC1B,OAAO,CAAC,aAAa,CAAa;IAClC,OAAO,CAAC,YAAY,CAAS;IAE7B,OAAO,CAAC,cAAc,CACV;IAEZ,iBAAiB;IAYjB,oBAAoB;IAapB,OAAO,CAAC,YAAY;IAKpB,OAAO,CAAC,aAAa;IAkBrB,OAAO,CAAC,mBAAmB;IAa3B,OAAO,CAAC,sBAAsB;IAO9B,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,YAAY;IAWpB,OAAO,CAAC,WAAW;YAML,WAAW;IAwBzB,OAAO,CAAC,iBAAiB;IAWzB;;;;;OAKG;IACU,UAAU,CAAC,YAAY,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,GAAG,EAAE,IAAI,CAAC,EAAE,GAAG;IA+DjE,WAAW,IAAI;QAAE,CAAC,SAAS,EAAE,MAAM,GAAG,WAAW,CAAA;KAAE;IAU1D;;OAEG;IACU,cAAc,CAAC,QAAQ,EAAE;QAAE,CAAC,SAAS,EAAE,MAAM,GAAG,WAAW,CAAA;KAAE,EAAE,IAAI,EAAE,GAAG;IAqB9E,eAAe;CAQvB"}
1
+ {"version":3,"file":"layout-popout-controller.d.ts","sourceRoot":"","sources":["../../../src/main/layout-popout-controller.ts"],"names":[],"mappings":"AAIA,OAAO,EAAuB,WAAW,EAAc,MAAM,yBAAyB,CAAC;AACvF,OAAO,EAEL,eAAe,EAIf,WAAW,EACZ,MAAM,UAAU,CAAC;AAGlB,qBAKa,gCAAiC,SAAQ,WAAW;IAC1B,WAAW,EAAE,MAAM,CAAC;IAEzD;;;OAGG;IACS,YAAY,EAAE,eAAe,GAAG;QAAE,mBAAmB,IAAI,GAAG,EAAE,EAAE,CAAA;KAAE,CAAC;IAE/E,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,OAAO,CAA4C;IAC3D,OAAO,CAAC,YAAY,CAAM;IAC1B,OAAO,CAAC,aAAa,CAAa;IAClC,OAAO,CAAC,UAAU,CAAS;IAE3B,OAAO,CAAC,cAAc,CAGR;IAEd,iBAAiB;IAajB,oBAAoB;IAapB,OAAO,CAAC,YAAY;IAgBpB,OAAO,CAAC,aAAa;IA4BrB,OAAO,CAAC,kBAAkB;IAY1B,OAAO,CAAC,mBAAmB;IAa3B,OAAO,CAAC,sBAAsB;IAO9B,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,YAAY;IAapB,OAAO,CAAC,WAAW;YAML,WAAW;IAsBzB,OAAO,CAAC,iBAAiB;IAczB,OAAO,CAAC,eAAe;IAUvB;;;;;OAKG;IACU,UAAU,CAAC,YAAY,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,WAAW,EAAE,IAAI,CAAC,EAAE,GAAG;IA8D5E,WAAW,IAAI;QAAE,CAAC,SAAS,EAAE,MAAM,GAAG,WAAW,CAAA;KAAE;IAQ1D;;OAEG;IACU,cAAc,CAAC,QAAQ,EAAE;QAAE,CAAC,SAAS,EAAE,MAAM,GAAG,WAAW,CAAA;KAAE,EAAE,IAAI,EAAE,GAAG;IAkB9E,eAAe;CAQvB"}
package/dist/dts/utils/popout-events.d.ts CHANGED
@@ -1,26 +1,17 @@
1
1
  import { EventDetailMap } from '@genesislcap/foundation-events';
2
- /**
3
- * Geometry details for a popout window
4
- * @public
5
- */
6
- export type PopoutGeometry = {
7
- screenX: number;
8
- screenY: number;
9
- outerWidth: number;
10
- outerHeight: number;
11
- screenId?: string;
12
- };
2
+ import { PopoutGeometry } from './types';
13
3
  /**
14
4
  * Events for layout popout communication
15
5
  * @public
16
6
  */
17
7
  export interface LayoutPopoutEvents extends EventDetailMap {
18
8
  /**
19
- * Emitted by a popout window when its geometry changes
9
+ * Emitted by a popout window when its geometry or component state changes
20
10
  */
21
- 'popout-geometry-change': {
11
+ 'popout-update': {
22
12
  layoutKey: string;
23
13
  geometry: PopoutGeometry;
14
+ state?: unknown;
24
15
  };
25
16
  /**
26
17
  * Emitted by a popout window when it is closed
@@ -28,10 +19,25 @@ export interface LayoutPopoutEvents extends EventDetailMap {
28
19
  'popout-closed': {
29
20
  layoutKey: string;
30
21
  };
22
+ /**
23
+ * Emitted by a popout window when it opens to request state
24
+ */
25
+ 'popout-handshake': {
26
+ layoutKey: string;
27
+ };
28
+ /**
29
+ * Emitted by the host to sync state to a popout window
30
+ */
31
+ 'popout-sync': {
32
+ layoutKey: string;
33
+ geometry?: PopoutGeometry;
34
+ state?: unknown;
35
+ };
31
36
  }
32
37
  /**
33
38
  * Name of the default broadcast channel used for layout popouts
34
39
  * @public
35
40
  */
36
41
  export declare const LAYOUT_POPOUT_CHANNEL_NAME = "f-layout-popout-channel";
42
+ export { PopoutGeometry };
37
43
  //# sourceMappingURL=popout-events.d.ts.map
package/dist/dts/utils/popout-events.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"popout-events.d.ts","sourceRoot":"","sources":["../../../src/utils/popout-events.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAEhE;;;GAGG;AACH,MAAM,MAAM,cAAc,GAAG;IAC3B,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF;;;GAGG;AACH,MAAM,WAAW,kBAAmB,SAAQ,cAAc;IACxD;;OAEG;IACH,wBAAwB,EAAE;QACxB,SAAS,EAAE,MAAM,CAAC;QAClB,QAAQ,EAAE,cAAc,CAAC;KAC1B,CAAC;IACF;;OAEG;IACH,eAAe,EAAE;QACf,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;CACH;AAED;;;GAGG;AACH,eAAO,MAAM,0BAA0B,4BAA4B,CAAC"}
1
+ {"version":3,"file":"popout-events.d.ts","sourceRoot":"","sources":["../../../src/utils/popout-events.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC;;;GAGG;AACH,MAAM,WAAW,kBAAmB,SAAQ,cAAc;IACxD;;OAEG;IACH,eAAe,EAAE;QACf,SAAS,EAAE,MAAM,CAAC;QAClB,QAAQ,EAAE,cAAc,CAAC;QACzB,KAAK,CAAC,EAAE,OAAO,CAAC;KACjB,CAAC;IACF;;OAEG;IACH,eAAe,EAAE;QACf,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;IACF;;OAEG;IACH,kBAAkB,EAAE;QAClB,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;IACF;;OAEG;IACH,aAAa,EAAE;QACb,SAAS,EAAE,MAAM,CAAC;QAClB,QAAQ,CAAC,EAAE,cAAc,CAAC;QAC1B,KAAK,CAAC,EAAE,OAAO,CAAC;KACjB,CAAC;CACH;AAED;;;GAGG;AACH,eAAO,MAAM,0BAA0B,4BAA4B,CAAC;AAEpE,OAAO,EAAE,cAAc,EAAE,CAAC"}
package/dist/dts/utils/types.d.ts CHANGED
@@ -1,6 +1,24 @@
1
1
  import { ComponentContainer, ResolvedLayoutConfig } from '@genesis-community/golden-layout';
2
2
  import { componentType, instanceContainer } from './constants';
3
- import { PopoutGeometry } from './popout-events';
3
+ /**
4
+ * Geometry details for a popout window
5
+ * @public
6
+ */
7
+ export type PopoutGeometry = {
8
+ screenX: number;
9
+ screenY: number;
10
+ outerWidth: number;
11
+ outerHeight: number;
12
+ screenId?: string;
13
+ };
14
+ /**
15
+ * @beta
16
+ * State of a popped out window
17
+ */
18
+ export type PopoutState = {
19
+ geometry: PopoutGeometry;
20
+ state?: unknown;
21
+ };
4
22
  /**
5
23
  * Definition of a custom button which will be added to all layout items.
6
24
  * @remarks
@@ -34,13 +52,6 @@ export type SerialisedLayout = {
34
52
  [layoutKey: string]: PopoutState;
35
53
  };
36
54
  };
37
- /**
38
- * @beta
39
- * State of a popped out window
40
- */
41
- export type PopoutState = {
42
- geometry: PopoutGeometry;
43
- };
44
55
  /**
45
56
  * Interface to implement on an item which is a component of the layout and you wish to serialise state with. This is saved separately for each instance of the component, which allows you to restore multiple instances of the same component with different state.
46
57
  * @typeParam T - the type of the state object you wish to serialise with the component.
package/dist/dts/utils/types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/utils/types.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/utils/types.ts"],"names":[],"mappings":"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"}
package/dist/esm/main/layout-main.js CHANGED
@@ -995,8 +995,10 @@ export class FoundationLayout extends FoundationElement {
995
995
  this.customButtons.push({
996
996
  svg: LAYOUT_ICONS.popoutSVG,
997
997
  onClick: (_, elem) => {
998
- var _b;
998
+ var _b, _c;
999
999
  const registration = elem.firstChild[instanceContainer].registration;
1000
+ const component = elem.firstChild;
1001
+ const state = (_b = component === null || component === void 0 ? void 0 : component.getCurrentState) === null || _b === void 0 ? void 0 : _b.call(component);
1000
1002
  // Use default dimensions from config
1001
1003
  const defaultGeometry = {
1002
1004
  screenX: undefined,
@@ -1005,7 +1007,7 @@ export class FoundationLayout extends FoundationElement {
1005
1007
  outerHeight: configWithDefaults.popoutDimension.height,
1006
1008
  };
1007
1009
  // Add to controller registry immediately so it tracks it
1008
- (_b = this.popoutController) === null || _b === void 0 ? void 0 : _b.openPopout(registration, defaultGeometry, this.uuid);
1010
+ (_c = this.popoutController) === null || _c === void 0 ? void 0 : _c.openPopout(registration, { geometry: defaultGeometry, state }, this.uuid);
1009
1011
  this.cacheAndSaveLayout();
1010
1012
  },
1011
1013
  });
@@ -1060,6 +1062,7 @@ export const layoutTemplate = html `
1060
1062
  ${when((x) => Boolean(x.popoutConfig), html `
1061
1063
  <foundation-layout-popout-controller
1062
1064
  ${ref('popoutController')}
1065
+ :parentLayout="${(x) => x}"
1063
1066
  channel-name="${(x) => { var _b; return (_b = x.popoutConfig) === null || _b === void 0 ? void 0 : _b.channelName; }}"
1064
1067
  ></foundation-layout-popout-controller>
1065
1068
  `)}
package/dist/esm/main/layout-popout-controller.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { __awaiter, __decorate } from "tslib";
2
2
  import { createTypedBroadcastChannel, } from '@genesislcap/foundation-broadcast-channel';
3
- import { attr, customElement, FASTElement } from '@microsoft/fast-element';
3
+ import { attr, customElement, FASTElement, observable } from '@microsoft/fast-element';
4
4
  import { LAYOUT_POPOUT_CONTROL_KEY, LayoutReceiveEvents, POPOUT_GEOMETRY_BROADCAST_INTERVAL, } from '../utils';
5
5
  import { LAYOUT_POPOUT_CHANNEL_NAME } from '../utils/popout-events';
6
6
  let FoundationLayoutPopoutController = class FoundationLayoutPopoutController extends FASTElement {
@@ -16,6 +16,7 @@ let FoundationLayoutPopoutController = class FoundationLayoutPopoutController ex
16
16
  this.setupUnloadListener();
17
17
  if (this.layoutKey) {
18
18
  this.startPolling();
19
+ this.channel.postMessage('popout-handshake', { layoutKey: this.layoutKey });
19
20
  }
20
21
  else {
21
22
  this.setupListener();
@@ -35,16 +36,26 @@ let FoundationLayoutPopoutController = class FoundationLayoutPopoutController ex
35
36
  setupChannel() {
36
37
  const name = this.channelName || LAYOUT_POPOUT_CHANNEL_NAME;
37
38
  this.channel = createTypedBroadcastChannel(name);
39
+ if (this.layoutKey) {
40
+ this.channel.onmessage = (ev) => {
41
+ if (this.channel.isMessageType('popout-sync', ev)) {
42
+ const { layoutKey, state } = ev.data.detail;
43
+ if (layoutKey === this.layoutKey && state !== undefined) {
44
+ this.applyStateToParent(state);
45
+ }
46
+ }
47
+ };
48
+ }
38
49
  }
39
50
  setupListener() {
40
51
  if (!this.channel)
41
52
  return;
42
53
  this.channel.onmessage = (ev) => {
43
- if (this.channel.isMessageType('popout-geometry-change', ev)) {
44
- const { layoutKey, geometry } = ev.data
54
+ if (this.channel.isMessageType('popout-update', ev)) {
55
+ const { layoutKey, geometry, state } = ev.data
45
56
  .detail;
46
57
  const current = this.popoutRegistry.get(layoutKey);
47
- this.popoutRegistry.set(layoutKey, Object.assign(Object.assign({}, current), { geometry }));
58
+ this.popoutRegistry.set(layoutKey, Object.assign(Object.assign({}, current), { geometry, state }));
48
59
  this.emitAutosave();
49
60
  }
50
61
  else if (this.channel.isMessageType('popout-closed', ev)) {
@@ -52,8 +63,31 @@ let FoundationLayoutPopoutController = class FoundationLayoutPopoutController ex
52
63
  this.popoutRegistry.delete(layoutKey);
53
64
  this.emitAutosave();
54
65
  }
66
+ else if (this.channel.isMessageType('popout-handshake', ev)) {
67
+ const { layoutKey } = ev.data.detail;
68
+ const current = this.popoutRegistry.get(layoutKey);
69
+ if (current) {
70
+ this.channel.postMessage('popout-sync', {
71
+ layoutKey,
72
+ geometry: current.geometry,
73
+ state: current.state,
74
+ });
75
+ }
76
+ }
55
77
  };
56
78
  }
79
+ applyStateToParent(state) {
80
+ if (!this.parentLayout)
81
+ return;
82
+ const components = this.parentLayout.getLayoutComponents();
83
+ for (const group of components) {
84
+ for (const item of group) {
85
+ if (item && typeof item.applyState === 'function') {
86
+ item.applyState(state);
87
+ }
88
+ }
89
+ }
90
+ }
57
91
  setupUnloadListener() {
58
92
  this.unloadHandler = () => {
59
93
  if (this.layoutKey) {
@@ -81,11 +115,13 @@ let FoundationLayoutPopoutController = class FoundationLayoutPopoutController ex
81
115
  }
82
116
  startPolling() {
83
117
  this.pollInterval = setInterval(() => __awaiter(this, void 0, void 0, function* () {
84
- const currentGeo = yield this.getGeometry();
85
- const geoString = JSON.stringify(currentGeo);
86
- if (geoString !== this.lastGeometry) {
87
- this.broadcastGeometry(currentGeo);
88
- this.lastGeometry = geoString;
118
+ const geometry = yield this.getGeometry();
119
+ const state = this.getComponentState();
120
+ const update = { geometry, state };
121
+ const updateString = JSON.stringify(update);
122
+ if (updateString !== this.lastUpdate) {
123
+ this.broadcastUpdate(geometry, state);
124
+ this.lastUpdate = updateString;
89
125
  }
90
126
  }), POPOUT_GEOMETRY_BROADCAST_INTERVAL);
91
127
  }
@@ -100,12 +136,10 @@ let FoundationLayoutPopoutController = class FoundationLayoutPopoutController ex
100
136
  var _a;
101
137
  if ('getScreenDetails' in window) {
102
138
  try {
103
- // This may prompt the user for permission if not already granted
104
139
  const details = yield window.getScreenDetails();
105
140
  return (_a = details.currentScreen) === null || _a === void 0 ? void 0 : _a.label;
106
141
  }
107
142
  catch (e) {
108
- // Silent fail - permission denied or API error
109
143
  return undefined;
110
144
  }
111
145
  }
@@ -120,31 +154,45 @@ let FoundationLayoutPopoutController = class FoundationLayoutPopoutController ex
120
154
  };
121
155
  });
122
156
  }
123
- broadcastGeometry(geometry) {
157
+ getComponentState() {
158
+ if (!this.parentLayout)
159
+ return undefined;
160
+ const components = this.parentLayout.getLayoutComponents();
161
+ // In a popout window, we expect exactly one component
162
+ for (const group of components) {
163
+ for (const item of group) {
164
+ if (item && typeof item.getCurrentState === 'function') {
165
+ return item.getCurrentState();
166
+ }
167
+ }
168
+ }
169
+ return undefined;
170
+ }
171
+ broadcastUpdate(geometry, state) {
124
172
  if (!this.channel || !this.layoutKey)
125
173
  return;
126
- this.channel.postMessage('popout-geometry-change', {
174
+ this.channel.postMessage('popout-update', {
127
175
  layoutKey: this.layoutKey,
128
176
  geometry,
177
+ state,
129
178
  });
130
- console.log('[PopoutController] Broadcasting geometry:', geometry);
131
179
  }
132
180
  /**
133
181
  * Opens a component in a popout window.
134
182
  * @param registration - The registration ID of the component to pop out.
135
- * @param geometry - Optional geometry to use for the new window.
183
+ * @param popoutState - Optional state (geometry and component state) to use for the new window.
136
184
  * @param uuid - UUID generator from parent layout
137
185
  */
138
- openPopout(registration, geometry, uuid) {
186
+ openPopout(registration, popoutState, uuid) {
139
187
  return __awaiter(this, void 0, void 0, function* () {
140
188
  const url = new URL(window.location.toString());
141
189
  const itemParams = new URLSearchParams();
142
190
  itemParams.append(LAYOUT_POPOUT_CONTROL_KEY, registration);
143
191
  url.search = itemParams.toString();
144
192
  let features = 'popup';
193
+ const geometry = popoutState === null || popoutState === void 0 ? void 0 : popoutState.geometry;
145
194
  let targetLeft = geometry === null || geometry === void 0 ? void 0 : geometry.screenX;
146
195
  let targetTop = geometry === null || geometry === void 0 ? void 0 : geometry.screenY;
147
- // If we have a screenId, try to find the screen and ensure coordinates are valid
148
196
  if ((geometry === null || geometry === void 0 ? void 0 : geometry.screenId) && 'getScreenDetails' in window) {
149
197
  try {
150
198
  const details = yield window.getScreenDetails();
@@ -176,17 +224,16 @@ let FoundationLayoutPopoutController = class FoundationLayoutPopoutController ex
176
224
  features += `,top=${targetTop}`;
177
225
  }
178
226
  else {
179
- features += ',width=800,height=600'; // Default fallback
227
+ features += ',width=800,height=600';
180
228
  }
181
229
  const win = window.open(url, `popout-${registration}-${(uuid === null || uuid === void 0 ? void 0 : uuid.createId()) || Date.now()}`, features);
182
230
  if (!win) {
183
231
  console.warn(`Popout window for ${registration} was blocked.`);
184
232
  return null;
185
233
  }
186
- // Update registry with the window reference and geometry (if provided)
187
- const current = this.popoutRegistry.get(registration);
188
234
  this.popoutRegistry.set(registration, {
189
- geometry: geometry || (current === null || current === void 0 ? void 0 : current.geometry),
235
+ geometry: geometry || {},
236
+ state: popoutState === null || popoutState === void 0 ? void 0 : popoutState.state,
190
237
  window: win,
191
238
  });
192
239
  return win;
@@ -195,9 +242,7 @@ let FoundationLayoutPopoutController = class FoundationLayoutPopoutController ex
195
242
  getRegistry() {
196
243
  const output = {};
197
244
  for (const [key, val] of this.popoutRegistry.entries()) {
198
- if (val.geometry) {
199
- output[key] = { geometry: val.geometry };
200
- }
245
+ output[key] = { geometry: val.geometry, state: val.state };
201
246
  }
202
247
  return output;
203
248
  }
@@ -207,17 +252,15 @@ let FoundationLayoutPopoutController = class FoundationLayoutPopoutController ex
207
252
  restorePopouts(registry, uuid) {
208
253
  return __awaiter(this, void 0, void 0, function* () {
209
254
  this.closeAllPopouts();
210
- // Populate the registry with serialized data
211
255
  for (const [key, val] of Object.entries(registry)) {
212
- this.popoutRegistry.set(key, { geometry: val.geometry });
256
+ this.popoutRegistry.set(key, { geometry: val.geometry, state: val.state });
213
257
  }
214
258
  const keys = Array.from(this.popoutRegistry.keys());
215
259
  if (keys.length === 0)
216
260
  return;
217
- console.debug(`Restoring ${keys.length} popout windows`);
218
261
  yield Promise.all(keys.map((key) => {
219
262
  const state = this.popoutRegistry.get(key);
220
- return this.openPopout(key, state.geometry, uuid);
263
+ return this.openPopout(key, state, uuid);
221
264
  }));
222
265
  });
223
266
  }
@@ -233,6 +276,9 @@ let FoundationLayoutPopoutController = class FoundationLayoutPopoutController ex
233
276
  __decorate([
234
277
  attr({ attribute: 'channel-name' })
235
278
  ], FoundationLayoutPopoutController.prototype, "channelName", void 0);
279
+ __decorate([
280
+ observable
281
+ ], FoundationLayoutPopoutController.prototype, "parentLayout", void 0);
236
282
  FoundationLayoutPopoutController = __decorate([
237
283
  customElement({
238
284
  name: 'foundation-layout-popout-controller',
package/dist/foundation-layout.d.ts CHANGED
@@ -592,30 +592,39 @@ export declare class FoundationLayout extends FoundationElement implements Layou
592
592
 
593
593
  declare class FoundationLayoutPopoutController extends FASTElement {
594
594
  channelName: string;
595
+ /**
596
+ * Reference to the parent layout to retrieve component state
597
+ * @internal
598
+ */
599
+ parentLayout: LayoutComponent & {
600
+ getLayoutComponents(): any[][];
601
+ };
595
602
  private layoutKey;
596
603
  private channel;
597
604
  private pollInterval;
598
605
  private unloadHandler;
599
- private lastGeometry;
606
+ private lastUpdate;
600
607
  private popoutRegistry;
601
608
  connectedCallback(): void;
602
609
  disconnectedCallback(): void;
603
610
  private setupChannel;
604
611
  private setupListener;
612
+ private applyStateToParent;
605
613
  private setupUnloadListener;
606
614
  private teardownUnloadListener;
607
615
  private emitAutosave;
608
616
  private startPolling;
609
617
  private stopPolling;
610
618
  private getGeometry;
611
- private broadcastGeometry;
619
+ private getComponentState;
620
+ private broadcastUpdate;
612
621
  /**
613
622
  * Opens a component in a popout window.
614
623
  * @param registration - The registration ID of the component to pop out.
615
- * @param geometry - Optional geometry to use for the new window.
624
+ * @param popoutState - Optional state (geometry and component state) to use for the new window.
616
625
  * @param uuid - UUID generator from parent layout
617
626
  */
618
- openPopout(registration: string, geometry?: any, uuid?: any): Promise<Window>;
627
+ openPopout(registration: string, popoutState?: PopoutState, uuid?: any): Promise<Window>;
619
628
  getRegistry(): {
620
629
  [layoutKey: string]: PopoutState;
621
630
  };
@@ -933,6 +942,7 @@ export declare class FoundationLayout extends FoundationElement implements Layou
933
942
  */
934
943
  declare type PopoutState = {
935
944
  geometry: PopoutGeometry;
945
+ state?: unknown;
936
946
  };
937
947
 
938
948
  /**
package/docs/api-report.md.api.md CHANGED
@@ -271,7 +271,7 @@ export function unregisterFactory(key: string): boolean;
271
271
 
272
272
  // Warnings were encountered during analysis:
273
273
  //
274
- // src/utils/types.ts:36:5 - (ae-forgotten-export) The symbol "PopoutState" needs to be exported by the entry point index.d.ts
274
+ // src/utils/types.ts:56:5 - (ae-forgotten-export) The symbol "PopoutState" needs to be exported by the entry point index.d.ts
275
275
 
276
276
  // (No @packageDocumentation comment for this package)
277
277
 
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@genesislcap/foundation-layout",
3
3
  "description": "Genesis Foundation UI App Layout",
4
- "version": "14.393.3-FUI-2471.2",
4
+ "version": "14.393.3-FUI-2471.3",
5
5
  "license": "SEE LICENSE IN license.txt",
6
6
  "main": "dist/esm/index.js",
7
7
  "types": "dist/foundation-layout.d.ts",
@@ -38,22 +38,22 @@
38
38
  }
39
39
  },
40
40
  "devDependencies": {
41
- "@genesislcap/foundation-testing": "14.393.3-FUI-2471.2",
42
- "@genesislcap/genx": "14.393.3-FUI-2471.2",
43
- "@genesislcap/rollup-builder": "14.393.3-FUI-2471.2",
44
- "@genesislcap/ts-builder": "14.393.3-FUI-2471.2",
45
- "@genesislcap/uvu-playwright-builder": "14.393.3-FUI-2471.2",
46
- "@genesislcap/vite-builder": "14.393.3-FUI-2471.2",
47
- "@genesislcap/webpack-builder": "14.393.3-FUI-2471.2"
41
+ "@genesislcap/foundation-testing": "14.393.3-FUI-2471.3",
42
+ "@genesislcap/genx": "14.393.3-FUI-2471.3",
43
+ "@genesislcap/rollup-builder": "14.393.3-FUI-2471.3",
44
+ "@genesislcap/ts-builder": "14.393.3-FUI-2471.3",
45
+ "@genesislcap/uvu-playwright-builder": "14.393.3-FUI-2471.3",
46
+ "@genesislcap/vite-builder": "14.393.3-FUI-2471.3",
47
+ "@genesislcap/webpack-builder": "14.393.3-FUI-2471.3"
48
48
  },
49
49
  "dependencies": {
50
50
  "@genesis-community/golden-layout": "^2.11.0",
51
- "@genesislcap/foundation-broadcast-channel": "14.393.3-FUI-2471.2",
52
- "@genesislcap/foundation-comms": "14.393.3-FUI-2471.2",
53
- "@genesislcap/foundation-events": "14.393.3-FUI-2471.2",
54
- "@genesislcap/foundation-logger": "14.393.3-FUI-2471.2",
55
- "@genesislcap/foundation-ui": "14.393.3-FUI-2471.2",
56
- "@genesislcap/foundation-utils": "14.393.3-FUI-2471.2",
51
+ "@genesislcap/foundation-broadcast-channel": "14.393.3-FUI-2471.3",
52
+ "@genesislcap/foundation-comms": "14.393.3-FUI-2471.3",
53
+ "@genesislcap/foundation-events": "14.393.3-FUI-2471.3",
54
+ "@genesislcap/foundation-logger": "14.393.3-FUI-2471.3",
55
+ "@genesislcap/foundation-ui": "14.393.3-FUI-2471.3",
56
+ "@genesislcap/foundation-utils": "14.393.3-FUI-2471.3",
57
57
  "@microsoft/fast-components": "2.30.6",
58
58
  "@microsoft/fast-element": "1.14.0",
59
59
  "@microsoft/fast-foundation": "2.50.0"
@@ -67,5 +67,5 @@
67
67
  "access": "public"
68
68
  },
69
69
  "customElements": "dist/custom-elements.json",
70
- "gitHead": "8d5276ff6ff9d909b67f0095a7cc2df458d1e8eb"
70
+ "gitHead": "90b4a4f5027128943c15715c8534788134dafe62"
71
71
  }