@fluentui/react-portal 9.4.1 → 9.4.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.
- package/CHANGELOG.md +21 -2
- package/dist/index.d.ts +5 -0
- package/lib/components/Portal/usePortal.js +2 -17
- package/lib/components/Portal/usePortal.js.map +1 -1
- package/lib/index.js +2 -1
- package/lib/index.js.map +1 -1
- package/lib/utils/toMountNodeProps.js +21 -0
- package/lib/utils/toMountNodeProps.js.map +1 -0
- package/lib-commonjs/components/Portal/usePortal.js +5 -28
- package/lib-commonjs/components/Portal/usePortal.js.map +1 -1
- package/lib-commonjs/index.js +4 -3
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/utils/toMountNodeProps.js +27 -0
- package/lib-commonjs/utils/toMountNodeProps.js.map +1 -0
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
@@ -1,12 +1,31 @@
|
|
1
1
|
# Change Log - @fluentui/react-portal
|
2
2
|
|
3
|
-
This log was last generated on
|
3
|
+
This log was last generated on Thu, 30 Nov 2023 13:37:53 GMT and should not be manually modified.
|
4
4
|
|
5
5
|
<!-- Start content -->
|
6
6
|
|
7
|
+
## [9.4.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-portal_v9.4.3)
|
8
|
+
|
9
|
+
Thu, 30 Nov 2023 13:37:53 GMT
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-portal_v9.4.2..@fluentui/react-portal_v9.4.3)
|
11
|
+
|
12
|
+
### Patches
|
13
|
+
|
14
|
+
- Bump @fluentui/react-tabster to v9.15.0 ([PR #29957](https://github.com/microsoft/fluentui/pull/29957) by beachball)
|
15
|
+
|
16
|
+
## [9.4.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-portal_v9.4.2)
|
17
|
+
|
18
|
+
Mon, 20 Nov 2023 09:55:10 GMT
|
19
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-portal_v9.4.1..@fluentui/react-portal_v9.4.2)
|
20
|
+
|
21
|
+
### Patches
|
22
|
+
|
23
|
+
- Bump @fluentui/react-shared-contexts to v9.13.0 ([PR #29878](https://github.com/microsoft/fluentui/pull/29878) by beachball)
|
24
|
+
- Bump @fluentui/react-tabster to v9.14.6 ([PR #29878](https://github.com/microsoft/fluentui/pull/29878) by beachball)
|
25
|
+
|
7
26
|
## [9.4.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-portal_v9.4.1)
|
8
27
|
|
9
|
-
Tue, 14 Nov 2023 17:
|
28
|
+
Tue, 14 Nov 2023 17:51:27 GMT
|
10
29
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-portal_v9.4.0..@fluentui/react-portal_v9.4.1)
|
11
30
|
|
12
31
|
### Patches
|
package/dist/index.d.ts
CHANGED
@@ -41,6 +41,11 @@ export declare const renderPortal_unstable: (state: PortalState) => React_2.Reac
|
|
41
41
|
|
42
42
|
export { setVirtualParent }
|
43
43
|
|
44
|
+
/**
|
45
|
+
* The function that normalizes the `mountNode` prop into an object with element and className props.
|
46
|
+
*
|
47
|
+
* @param mountNode - an HTML element or an object with props
|
48
|
+
*/
|
44
49
|
export declare function toMountNodeProps(mountNode: PortalProps['mountNode']): {
|
45
50
|
element?: HTMLElement | null;
|
46
51
|
className?: string;
|
@@ -1,22 +1,7 @@
|
|
1
|
-
import {
|
1
|
+
import { setVirtualParent } from '@fluentui/react-utilities';
|
2
2
|
import * as React from 'react';
|
3
|
+
import { toMountNodeProps } from '../../utils/toMountNodeProps';
|
3
4
|
import { usePortalMountNode } from './usePortalMountNode';
|
4
|
-
export function toMountNodeProps(mountNode) {
|
5
|
-
if (isHTMLElement(mountNode)) {
|
6
|
-
return {
|
7
|
-
element: mountNode
|
8
|
-
};
|
9
|
-
}
|
10
|
-
if (typeof mountNode === 'object') {
|
11
|
-
if (mountNode === null) {
|
12
|
-
return {
|
13
|
-
element: null
|
14
|
-
};
|
15
|
-
}
|
16
|
-
return mountNode;
|
17
|
-
}
|
18
|
-
return {};
|
19
|
-
}
|
20
5
|
/**
|
21
6
|
* Create the state required to render Portal.
|
22
7
|
*
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["usePortal.ts"],"sourcesContent":["import {
|
1
|
+
{"version":3,"sources":["usePortal.ts"],"sourcesContent":["import { setVirtualParent } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { toMountNodeProps } from '../../utils/toMountNodeProps';\nimport { usePortalMountNode } from './usePortalMountNode';\nimport type { PortalProps, PortalState } from './Portal.types';\n\n/**\n * Create the state required to render Portal.\n *\n * The returned state can be modified with hooks such as usePortalStyles, before being passed to renderPortal_unstable.\n *\n * @param props - props from this instance of Portal\n */\nexport const usePortal_unstable = (props: PortalProps): PortalState => {\n const { element, className } = toMountNodeProps(props.mountNode);\n\n const virtualParentRootRef = React.useRef<HTMLSpanElement>(null);\n const fallbackElement = usePortalMountNode({ disabled: !!element, className });\n\n const state: PortalState = {\n children: props.children,\n mountNode: element ?? fallbackElement,\n virtualParentRootRef,\n };\n\n React.useEffect(() => {\n if (state.virtualParentRootRef.current && state.mountNode) {\n setVirtualParent(state.mountNode, state.virtualParentRootRef.current);\n }\n return () => {\n if (state.mountNode) {\n setVirtualParent(state.mountNode, undefined);\n }\n };\n }, [state.virtualParentRootRef, state.mountNode]);\n\n return state;\n};\n"],"names":["setVirtualParent","React","toMountNodeProps","usePortalMountNode","usePortal_unstable","props","element","className","mountNode","virtualParentRootRef","useRef","fallbackElement","disabled","state","children","useEffect","current","undefined"],"mappings":"AAAA,SAASA,gBAAgB,QAAQ,4BAA4B;AAC7D,YAAYC,WAAW,QAAQ;AAE/B,SAASC,gBAAgB,QAAQ,+BAA+B;AAChE,SAASC,kBAAkB,QAAQ,uBAAuB;AAG1D;;;;;;CAMC,GACD,OAAO,MAAMC,qBAAqB,CAACC;IACjC,MAAM,EAAEC,OAAO,EAAEC,SAAS,EAAE,GAAGL,iBAAiBG,MAAMG,SAAS;IAE/D,MAAMC,uBAAuBR,MAAMS,MAAM,CAAkB;IAC3D,MAAMC,kBAAkBR,mBAAmB;QAAES,UAAU,CAAC,CAACN;QAASC;IAAU;IAE5E,MAAMM,QAAqB;QACzBC,UAAUT,MAAMS,QAAQ;QACxBN,WAAWF,oBAAAA,qBAAAA,UAAWK;QACtBF;IACF;IAEAR,MAAMc,SAAS,CAAC;QACd,IAAIF,MAAMJ,oBAAoB,CAACO,OAAO,IAAIH,MAAML,SAAS,EAAE;YACzDR,iBAAiBa,MAAML,SAAS,EAAEK,MAAMJ,oBAAoB,CAACO,OAAO;QACtE;QACA,OAAO;YACL,IAAIH,MAAML,SAAS,EAAE;gBACnBR,iBAAiBa,MAAML,SAAS,EAAES;YACpC;QACF;IACF,GAAG;QAACJ,MAAMJ,oBAAoB;QAAEI,MAAML,SAAS;KAAC;IAEhD,OAAOK;AACT,EAAE"}
|
package/lib/index.js
CHANGED
@@ -1,2 +1,3 @@
|
|
1
1
|
export { elementContains, setVirtualParent } from '@fluentui/react-utilities';
|
2
|
-
export { Portal, renderPortal_unstable,
|
2
|
+
export { Portal, renderPortal_unstable, usePortal_unstable } from './components/Portal/index';
|
3
|
+
export { toMountNodeProps } from './utils/toMountNodeProps';
|
package/lib/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["index.ts"],"sourcesContent":["export { elementContains, setVirtualParent } from '@fluentui/react-utilities';\nexport { Portal, renderPortal_unstable,
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export { elementContains, setVirtualParent } from '@fluentui/react-utilities';\nexport { Portal, renderPortal_unstable, usePortal_unstable } from './components/Portal/index';\nexport type { PortalProps, PortalState } from './components/Portal/index';\n\nexport { toMountNodeProps } from './utils/toMountNodeProps';\n"],"names":["elementContains","setVirtualParent","Portal","renderPortal_unstable","usePortal_unstable","toMountNodeProps"],"mappings":"AAAA,SAASA,eAAe,EAAEC,gBAAgB,QAAQ,4BAA4B;AAC9E,SAASC,MAAM,EAAEC,qBAAqB,EAAEC,kBAAkB,QAAQ,4BAA4B;AAG9F,SAASC,gBAAgB,QAAQ,2BAA2B"}
|
@@ -0,0 +1,21 @@
|
|
1
|
+
import { isHTMLElement } from '@fluentui/react-utilities';
|
2
|
+
/**
|
3
|
+
* The function that normalizes the `mountNode` prop into an object with element and className props.
|
4
|
+
*
|
5
|
+
* @param mountNode - an HTML element or an object with props
|
6
|
+
*/ export function toMountNodeProps(mountNode) {
|
7
|
+
if (isHTMLElement(mountNode)) {
|
8
|
+
return {
|
9
|
+
element: mountNode
|
10
|
+
};
|
11
|
+
}
|
12
|
+
if (typeof mountNode === 'object') {
|
13
|
+
if (mountNode === null) {
|
14
|
+
return {
|
15
|
+
element: null
|
16
|
+
};
|
17
|
+
}
|
18
|
+
return mountNode;
|
19
|
+
}
|
20
|
+
return {};
|
21
|
+
}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["toMountNodeProps.ts"],"sourcesContent":["import { isHTMLElement } from '@fluentui/react-utilities';\nimport type { PortalProps } from '../Portal';\n\n/**\n * The function that normalizes the `mountNode` prop into an object with element and className props.\n *\n * @param mountNode - an HTML element or an object with props\n */\nexport function toMountNodeProps(mountNode: PortalProps['mountNode']): {\n element?: HTMLElement | null;\n className?: string;\n} {\n if (isHTMLElement(mountNode)) {\n return { element: mountNode };\n }\n\n if (typeof mountNode === 'object') {\n if (mountNode === null) {\n return { element: null };\n }\n\n return mountNode;\n }\n\n return {};\n}\n"],"names":["isHTMLElement","toMountNodeProps","mountNode","element"],"mappings":"AAAA,SAASA,aAAa,QAAQ,4BAA4B;AAG1D;;;;CAIC,GACD,OAAO,SAASC,iBAAiBC,SAAmC;IAIlE,IAAIF,cAAcE,YAAY;QAC5B,OAAO;YAAEC,SAASD;QAAU;IAC9B;IAEA,IAAI,OAAOA,cAAc,UAAU;QACjC,IAAIA,cAAc,MAAM;YACtB,OAAO;gBAAEC,SAAS;YAAK;QACzB;QAEA,OAAOD;IACT;IAEA,OAAO,CAAC;AACV"}
|
@@ -2,42 +2,19 @@
|
|
2
2
|
Object.defineProperty(exports, "__esModule", {
|
3
3
|
value: true
|
4
4
|
});
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
get: all[name]
|
9
|
-
});
|
10
|
-
}
|
11
|
-
_export(exports, {
|
12
|
-
toMountNodeProps: function() {
|
13
|
-
return toMountNodeProps;
|
14
|
-
},
|
15
|
-
usePortal_unstable: function() {
|
5
|
+
Object.defineProperty(exports, "usePortal_unstable", {
|
6
|
+
enumerable: true,
|
7
|
+
get: function() {
|
16
8
|
return usePortal_unstable;
|
17
9
|
}
|
18
10
|
});
|
19
11
|
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
20
12
|
const _reactutilities = require("@fluentui/react-utilities");
|
21
13
|
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
14
|
+
const _toMountNodeProps = require("../../utils/toMountNodeProps");
|
22
15
|
const _usePortalMountNode = require("./usePortalMountNode");
|
23
|
-
function toMountNodeProps(mountNode) {
|
24
|
-
if ((0, _reactutilities.isHTMLElement)(mountNode)) {
|
25
|
-
return {
|
26
|
-
element: mountNode
|
27
|
-
};
|
28
|
-
}
|
29
|
-
if (typeof mountNode === 'object') {
|
30
|
-
if (mountNode === null) {
|
31
|
-
return {
|
32
|
-
element: null
|
33
|
-
};
|
34
|
-
}
|
35
|
-
return mountNode;
|
36
|
-
}
|
37
|
-
return {};
|
38
|
-
}
|
39
16
|
const usePortal_unstable = (props)=>{
|
40
|
-
const { element, className } = toMountNodeProps(props.mountNode);
|
17
|
+
const { element, className } = (0, _toMountNodeProps.toMountNodeProps)(props.mountNode);
|
41
18
|
const virtualParentRootRef = _react.useRef(null);
|
42
19
|
const fallbackElement = (0, _usePortalMountNode.usePortalMountNode)({
|
43
20
|
disabled: !!element,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["usePortal.js"],"sourcesContent":["import {
|
1
|
+
{"version":3,"sources":["usePortal.js"],"sourcesContent":["import { setVirtualParent } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { toMountNodeProps } from '../../utils/toMountNodeProps';\nimport { usePortalMountNode } from './usePortalMountNode';\n/**\n * Create the state required to render Portal.\n *\n * The returned state can be modified with hooks such as usePortalStyles, before being passed to renderPortal_unstable.\n *\n * @param props - props from this instance of Portal\n */ export const usePortal_unstable = (props)=>{\n const { element, className } = toMountNodeProps(props.mountNode);\n const virtualParentRootRef = React.useRef(null);\n const fallbackElement = usePortalMountNode({\n disabled: !!element,\n className\n });\n const state = {\n children: props.children,\n mountNode: element !== null && element !== void 0 ? element : fallbackElement,\n virtualParentRootRef\n };\n React.useEffect(()=>{\n if (state.virtualParentRootRef.current && state.mountNode) {\n setVirtualParent(state.mountNode, state.virtualParentRootRef.current);\n }\n return ()=>{\n if (state.mountNode) {\n setVirtualParent(state.mountNode, undefined);\n }\n };\n }, [\n state.virtualParentRootRef,\n state.mountNode\n ]);\n return state;\n};\n"],"names":["usePortal_unstable","props","element","className","toMountNodeProps","mountNode","virtualParentRootRef","React","useRef","fallbackElement","usePortalMountNode","disabled","state","children","useEffect","current","setVirtualParent","undefined"],"mappings":";;;;+BAUiBA;;;eAAAA;;;;gCAVgB;iEACV;kCACU;oCACE;AAOxB,MAAMA,qBAAqB,CAACC;IACnC,MAAM,EAAEC,OAAO,EAAEC,SAAS,EAAE,GAAGC,IAAAA,kCAAgB,EAACH,MAAMI,SAAS;IAC/D,MAAMC,uBAAuBC,OAAMC,MAAM,CAAC;IAC1C,MAAMC,kBAAkBC,IAAAA,sCAAkB,EAAC;QACvCC,UAAU,CAAC,CAACT;QACZC;IACJ;IACA,MAAMS,QAAQ;QACVC,UAAUZ,MAAMY,QAAQ;QACxBR,WAAWH,YAAY,QAAQA,YAAY,KAAK,IAAIA,UAAUO;QAC9DH;IACJ;IACAC,OAAMO,SAAS,CAAC;QACZ,IAAIF,MAAMN,oBAAoB,CAACS,OAAO,IAAIH,MAAMP,SAAS,EAAE;YACvDW,IAAAA,gCAAgB,EAACJ,MAAMP,SAAS,EAAEO,MAAMN,oBAAoB,CAACS,OAAO;QACxE;QACA,OAAO;YACH,IAAIH,MAAMP,SAAS,EAAE;gBACjBW,IAAAA,gCAAgB,EAACJ,MAAMP,SAAS,EAAEY;YACtC;QACJ;IACJ,GAAG;QACCL,MAAMN,oBAAoB;QAC1BM,MAAMP,SAAS;KAClB;IACD,OAAOO;AACX"}
|
package/lib-commonjs/index.js
CHANGED
@@ -21,12 +21,13 @@ _export(exports, {
|
|
21
21
|
renderPortal_unstable: function() {
|
22
22
|
return _index.renderPortal_unstable;
|
23
23
|
},
|
24
|
-
toMountNodeProps: function() {
|
25
|
-
return _index.toMountNodeProps;
|
26
|
-
},
|
27
24
|
usePortal_unstable: function() {
|
28
25
|
return _index.usePortal_unstable;
|
26
|
+
},
|
27
|
+
toMountNodeProps: function() {
|
28
|
+
return _toMountNodeProps.toMountNodeProps;
|
29
29
|
}
|
30
30
|
});
|
31
31
|
const _reactutilities = require("@fluentui/react-utilities");
|
32
32
|
const _index = require("./components/Portal/index");
|
33
|
+
const _toMountNodeProps = require("./utils/toMountNodeProps");
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["index.js"],"sourcesContent":["export { elementContains, setVirtualParent } from '@fluentui/react-utilities';\nexport { Portal, renderPortal_unstable,
|
1
|
+
{"version":3,"sources":["index.js"],"sourcesContent":["export { elementContains, setVirtualParent } from '@fluentui/react-utilities';\nexport { Portal, renderPortal_unstable, usePortal_unstable } from './components/Portal/index';\nexport { toMountNodeProps } from './utils/toMountNodeProps';\n"],"names":["elementContains","setVirtualParent","Portal","renderPortal_unstable","usePortal_unstable","toMountNodeProps"],"mappings":";;;;;;;;;;;IAASA,eAAe;eAAfA,+BAAe;;IAAEC,gBAAgB;eAAhBA,gCAAgB;;IACjCC,MAAM;eAANA,aAAM;;IAAEC,qBAAqB;eAArBA,4BAAqB;;IAAEC,kBAAkB;eAAlBA,yBAAkB;;IACjDC,gBAAgB;eAAhBA,kCAAgB;;;gCAFyB;uBACgB;kCACjC"}
|
@@ -0,0 +1,27 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
3
|
+
value: true
|
4
|
+
});
|
5
|
+
Object.defineProperty(exports, "toMountNodeProps", {
|
6
|
+
enumerable: true,
|
7
|
+
get: function() {
|
8
|
+
return toMountNodeProps;
|
9
|
+
}
|
10
|
+
});
|
11
|
+
const _reactutilities = require("@fluentui/react-utilities");
|
12
|
+
function toMountNodeProps(mountNode) {
|
13
|
+
if ((0, _reactutilities.isHTMLElement)(mountNode)) {
|
14
|
+
return {
|
15
|
+
element: mountNode
|
16
|
+
};
|
17
|
+
}
|
18
|
+
if (typeof mountNode === 'object') {
|
19
|
+
if (mountNode === null) {
|
20
|
+
return {
|
21
|
+
element: null
|
22
|
+
};
|
23
|
+
}
|
24
|
+
return mountNode;
|
25
|
+
}
|
26
|
+
return {};
|
27
|
+
}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["toMountNodeProps.js"],"sourcesContent":["import { isHTMLElement } from '@fluentui/react-utilities';\n/**\n * The function that normalizes the `mountNode` prop into an object with element and className props.\n *\n * @param mountNode - an HTML element or an object with props\n */ export function toMountNodeProps(mountNode) {\n if (isHTMLElement(mountNode)) {\n return {\n element: mountNode\n };\n }\n if (typeof mountNode === 'object') {\n if (mountNode === null) {\n return {\n element: null\n };\n }\n return mountNode;\n }\n return {};\n}\n"],"names":["toMountNodeProps","mountNode","isHTMLElement","element"],"mappings":";;;;+BAKoBA;;;eAAAA;;;gCALU;AAKnB,SAASA,iBAAiBC,SAAS;IAC1C,IAAIC,IAAAA,6BAAa,EAACD,YAAY;QAC1B,OAAO;YACHE,SAASF;QACb;IACJ;IACA,IAAI,OAAOA,cAAc,UAAU;QAC/B,IAAIA,cAAc,MAAM;YACpB,OAAO;gBACHE,SAAS;YACb;QACJ;QACA,OAAOF;IACX;IACA,OAAO,CAAC;AACZ"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@fluentui/react-portal",
|
3
|
-
"version": "9.4.
|
3
|
+
"version": "9.4.3",
|
4
4
|
"description": "A utility component that creates portals compatible with Fluent UI",
|
5
5
|
"main": "lib-commonjs/index.js",
|
6
6
|
"module": "lib/index.js",
|
@@ -32,8 +32,8 @@
|
|
32
32
|
"@fluentui/scripts-tasks": "*"
|
33
33
|
},
|
34
34
|
"dependencies": {
|
35
|
-
"@fluentui/react-shared-contexts": "^9.
|
36
|
-
"@fluentui/react-tabster": "^9.
|
35
|
+
"@fluentui/react-shared-contexts": "^9.13.0",
|
36
|
+
"@fluentui/react-tabster": "^9.15.0",
|
37
37
|
"@fluentui/react-utilities": "^9.15.2",
|
38
38
|
"@griffel/react": "^1.5.14",
|
39
39
|
"@swc/helpers": "^0.5.1",
|