@genesislcap/foundation-layout 14.424.1-alpha-cfc2887.0 → 14.425.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/react.cjs +50 -12
- package/dist/react.mjs +50 -12
- package/package.json +15 -15
package/dist/react.cjs
CHANGED
|
@@ -5,29 +5,67 @@
|
|
|
5
5
|
|
|
6
6
|
'use strict';
|
|
7
7
|
|
|
8
|
-
const { provideReactWrapper } = require('@microsoft/fast-react-wrapper');
|
|
9
8
|
const React = require('react');
|
|
10
9
|
const { FoundationLayoutItem: FoundationLayoutItemWC } = require('./esm/main/layout-item.js');
|
|
11
10
|
const { FoundationLayout: FoundationLayoutWC } = require('./esm/main/layout-main.js');
|
|
12
11
|
const { FoundationLayoutPopoutController: FoundationLayoutPopoutControllerWC } = require('./esm/main/layout-popout-controller.js');
|
|
13
12
|
const { FoundationLayoutRegion: FoundationLayoutRegionWC } = require('./esm/main/layout-region.js');
|
|
14
13
|
|
|
15
|
-
|
|
14
|
+
function _mergeRefs(...refs) {
|
|
15
|
+
return (value) => {
|
|
16
|
+
for (const ref of refs) {
|
|
17
|
+
if (typeof ref === 'function') ref(value);
|
|
18
|
+
else if (ref != null) ref.current = value;
|
|
19
|
+
}
|
|
20
|
+
};
|
|
21
|
+
}
|
|
16
22
|
|
|
17
|
-
const FoundationLayoutItem =
|
|
23
|
+
const FoundationLayoutItem = React.forwardRef(function FoundationLayoutItem(props, ref) {
|
|
24
|
+
const { children, ...rest } = props;
|
|
25
|
+
return React.createElement(customElements.getName(FoundationLayoutItemWC) ?? '%%prefix%%-layout-item', { ...rest, ref }, children);
|
|
26
|
+
});
|
|
18
27
|
|
|
19
|
-
const FoundationLayout =
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
28
|
+
const FoundationLayout = React.forwardRef(function FoundationLayout(props, ref) {
|
|
29
|
+
const { onFirstLoaded, onItemAdded, onItemRemoved, onItemResized, children, ...rest } = props;
|
|
30
|
+
const _innerRef = React.useRef(null);
|
|
31
|
+
const _onFirstLoadedRef = React.useRef(onFirstLoaded);
|
|
32
|
+
_onFirstLoadedRef.current = onFirstLoaded;
|
|
33
|
+
const _onItemAddedRef = React.useRef(onItemAdded);
|
|
34
|
+
_onItemAddedRef.current = onItemAdded;
|
|
35
|
+
const _onItemRemovedRef = React.useRef(onItemRemoved);
|
|
36
|
+
_onItemRemovedRef.current = onItemRemoved;
|
|
37
|
+
const _onItemResizedRef = React.useRef(onItemResized);
|
|
38
|
+
_onItemResizedRef.current = onItemResized;
|
|
39
|
+
React.useLayoutEffect(() => {
|
|
40
|
+
const el = _innerRef.current;
|
|
41
|
+
if (!el) return;
|
|
42
|
+
const _onFirstLoadedFn = (e) => _onFirstLoadedRef.current?.(e);
|
|
43
|
+
el.addEventListener('first-loaded', _onFirstLoadedFn);
|
|
44
|
+
const _onItemAddedFn = (e) => _onItemAddedRef.current?.(e);
|
|
45
|
+
el.addEventListener('item-added', _onItemAddedFn);
|
|
46
|
+
const _onItemRemovedFn = (e) => _onItemRemovedRef.current?.(e);
|
|
47
|
+
el.addEventListener('item-removed', _onItemRemovedFn);
|
|
48
|
+
const _onItemResizedFn = (e) => _onItemResizedRef.current?.(e);
|
|
49
|
+
el.addEventListener('item-resized', _onItemResizedFn);
|
|
50
|
+
return () => {
|
|
51
|
+
el.removeEventListener('first-loaded', _onFirstLoadedFn);
|
|
52
|
+
el.removeEventListener('item-added', _onItemAddedFn);
|
|
53
|
+
el.removeEventListener('item-removed', _onItemRemovedFn);
|
|
54
|
+
el.removeEventListener('item-resized', _onItemResizedFn);
|
|
55
|
+
};
|
|
56
|
+
}, []);
|
|
57
|
+
return React.createElement(customElements.getName(FoundationLayoutWC) ?? '%%prefix%%-layout', { ...rest, ref: _mergeRefs(_innerRef, ref) }, children);
|
|
26
58
|
});
|
|
27
59
|
|
|
28
|
-
const FoundationLayoutPopoutController =
|
|
60
|
+
const FoundationLayoutPopoutController = React.forwardRef(function FoundationLayoutPopoutController(props, ref) {
|
|
61
|
+
const { children, ...rest } = props;
|
|
62
|
+
return React.createElement(customElements.getName(FoundationLayoutPopoutControllerWC) ?? 'foundation-layout-popout-controller', { ...rest, ref }, children);
|
|
63
|
+
});
|
|
29
64
|
|
|
30
|
-
const FoundationLayoutRegion =
|
|
65
|
+
const FoundationLayoutRegion = React.forwardRef(function FoundationLayoutRegion(props, ref) {
|
|
66
|
+
const { children, ...rest } = props;
|
|
67
|
+
return React.createElement(customElements.getName(FoundationLayoutRegionWC) ?? '%%prefix%%-layout-region', { ...rest, ref }, children);
|
|
68
|
+
});
|
|
31
69
|
|
|
32
70
|
module.exports = {
|
|
33
71
|
FoundationLayoutItem,
|
package/dist/react.mjs
CHANGED
|
@@ -3,26 +3,64 @@
|
|
|
3
3
|
* Generated from custom-elements manifest.
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
|
-
import { provideReactWrapper } from '@microsoft/fast-react-wrapper';
|
|
7
6
|
import React from 'react';
|
|
8
7
|
import { FoundationLayoutItem as FoundationLayoutItemWC } from './esm/main/layout-item.js';
|
|
9
8
|
import { FoundationLayout as FoundationLayoutWC } from './esm/main/layout-main.js';
|
|
10
9
|
import { FoundationLayoutPopoutController as FoundationLayoutPopoutControllerWC } from './esm/main/layout-popout-controller.js';
|
|
11
10
|
import { FoundationLayoutRegion as FoundationLayoutRegionWC } from './esm/main/layout-region.js';
|
|
12
11
|
|
|
13
|
-
|
|
12
|
+
function _mergeRefs(...refs) {
|
|
13
|
+
return (value) => {
|
|
14
|
+
for (const ref of refs) {
|
|
15
|
+
if (typeof ref === 'function') ref(value);
|
|
16
|
+
else if (ref != null) ref.current = value;
|
|
17
|
+
}
|
|
18
|
+
};
|
|
19
|
+
}
|
|
14
20
|
|
|
15
|
-
export const FoundationLayoutItem =
|
|
21
|
+
export const FoundationLayoutItem = React.forwardRef(function FoundationLayoutItem(props, ref) {
|
|
22
|
+
const { children, ...rest } = props;
|
|
23
|
+
return React.createElement(customElements.getName(FoundationLayoutItemWC) ?? '%%prefix%%-layout-item', { ...rest, ref }, children);
|
|
24
|
+
});
|
|
16
25
|
|
|
17
|
-
export const FoundationLayout =
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
26
|
+
export const FoundationLayout = React.forwardRef(function FoundationLayout(props, ref) {
|
|
27
|
+
const { onFirstLoaded, onItemAdded, onItemRemoved, onItemResized, children, ...rest } = props;
|
|
28
|
+
const _innerRef = React.useRef(null);
|
|
29
|
+
const _onFirstLoadedRef = React.useRef(onFirstLoaded);
|
|
30
|
+
_onFirstLoadedRef.current = onFirstLoaded;
|
|
31
|
+
const _onItemAddedRef = React.useRef(onItemAdded);
|
|
32
|
+
_onItemAddedRef.current = onItemAdded;
|
|
33
|
+
const _onItemRemovedRef = React.useRef(onItemRemoved);
|
|
34
|
+
_onItemRemovedRef.current = onItemRemoved;
|
|
35
|
+
const _onItemResizedRef = React.useRef(onItemResized);
|
|
36
|
+
_onItemResizedRef.current = onItemResized;
|
|
37
|
+
React.useLayoutEffect(() => {
|
|
38
|
+
const el = _innerRef.current;
|
|
39
|
+
if (!el) return;
|
|
40
|
+
const _onFirstLoadedFn = (e) => _onFirstLoadedRef.current?.(e);
|
|
41
|
+
el.addEventListener('first-loaded', _onFirstLoadedFn);
|
|
42
|
+
const _onItemAddedFn = (e) => _onItemAddedRef.current?.(e);
|
|
43
|
+
el.addEventListener('item-added', _onItemAddedFn);
|
|
44
|
+
const _onItemRemovedFn = (e) => _onItemRemovedRef.current?.(e);
|
|
45
|
+
el.addEventListener('item-removed', _onItemRemovedFn);
|
|
46
|
+
const _onItemResizedFn = (e) => _onItemResizedRef.current?.(e);
|
|
47
|
+
el.addEventListener('item-resized', _onItemResizedFn);
|
|
48
|
+
return () => {
|
|
49
|
+
el.removeEventListener('first-loaded', _onFirstLoadedFn);
|
|
50
|
+
el.removeEventListener('item-added', _onItemAddedFn);
|
|
51
|
+
el.removeEventListener('item-removed', _onItemRemovedFn);
|
|
52
|
+
el.removeEventListener('item-resized', _onItemResizedFn);
|
|
53
|
+
};
|
|
54
|
+
}, []);
|
|
55
|
+
return React.createElement(customElements.getName(FoundationLayoutWC) ?? '%%prefix%%-layout', { ...rest, ref: _mergeRefs(_innerRef, ref) }, children);
|
|
24
56
|
});
|
|
25
57
|
|
|
26
|
-
export const FoundationLayoutPopoutController =
|
|
58
|
+
export const FoundationLayoutPopoutController = React.forwardRef(function FoundationLayoutPopoutController(props, ref) {
|
|
59
|
+
const { children, ...rest } = props;
|
|
60
|
+
return React.createElement(customElements.getName(FoundationLayoutPopoutControllerWC) ?? 'foundation-layout-popout-controller', { ...rest, ref }, children);
|
|
61
|
+
});
|
|
27
62
|
|
|
28
|
-
export const FoundationLayoutRegion =
|
|
63
|
+
export const FoundationLayoutRegion = React.forwardRef(function FoundationLayoutRegion(props, ref) {
|
|
64
|
+
const { children, ...rest } = props;
|
|
65
|
+
return React.createElement(customElements.getName(FoundationLayoutRegionWC) ?? '%%prefix%%-layout-region', { ...rest, ref }, children);
|
|
66
|
+
});
|
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.
|
|
4
|
+
"version": "14.425.0",
|
|
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.
|
|
42
|
-
"@genesislcap/genx": "14.
|
|
43
|
-
"@genesislcap/rollup-builder": "14.
|
|
44
|
-
"@genesislcap/ts-builder": "14.
|
|
45
|
-
"@genesislcap/uvu-playwright-builder": "14.
|
|
46
|
-
"@genesislcap/vite-builder": "14.
|
|
47
|
-
"@genesislcap/webpack-builder": "14.
|
|
41
|
+
"@genesislcap/foundation-testing": "14.425.0",
|
|
42
|
+
"@genesislcap/genx": "14.425.0",
|
|
43
|
+
"@genesislcap/rollup-builder": "14.425.0",
|
|
44
|
+
"@genesislcap/ts-builder": "14.425.0",
|
|
45
|
+
"@genesislcap/uvu-playwright-builder": "14.425.0",
|
|
46
|
+
"@genesislcap/vite-builder": "14.425.0",
|
|
47
|
+
"@genesislcap/webpack-builder": "14.425.0"
|
|
48
48
|
},
|
|
49
49
|
"dependencies": {
|
|
50
50
|
"@genesis-community/golden-layout": "^2.11.0",
|
|
51
|
-
"@genesislcap/foundation-broadcast-channel": "14.
|
|
52
|
-
"@genesislcap/foundation-comms": "14.
|
|
53
|
-
"@genesislcap/foundation-events": "14.
|
|
54
|
-
"@genesislcap/foundation-logger": "14.
|
|
55
|
-
"@genesislcap/foundation-ui": "14.
|
|
56
|
-
"@genesislcap/foundation-utils": "14.
|
|
51
|
+
"@genesislcap/foundation-broadcast-channel": "14.425.0",
|
|
52
|
+
"@genesislcap/foundation-comms": "14.425.0",
|
|
53
|
+
"@genesislcap/foundation-events": "14.425.0",
|
|
54
|
+
"@genesislcap/foundation-logger": "14.425.0",
|
|
55
|
+
"@genesislcap/foundation-ui": "14.425.0",
|
|
56
|
+
"@genesislcap/foundation-utils": "14.425.0",
|
|
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": "
|
|
70
|
+
"gitHead": "c49bb94fbc3a74e84f18c7445398af116e1a58bb"
|
|
71
71
|
}
|