@fluentui/react-portal 9.4.2 → 9.4.3
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.md +11 -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 +2 -2
package/CHANGELOG.md
CHANGED
@@ -1,12 +1,21 @@
|
|
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
|
+
|
7
16
|
## [9.4.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-portal_v9.4.2)
|
8
17
|
|
9
|
-
Mon, 20 Nov 2023 09:
|
18
|
+
Mon, 20 Nov 2023 09:55:10 GMT
|
10
19
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-portal_v9.4.1..@fluentui/react-portal_v9.4.2)
|
11
20
|
|
12
21
|
### 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",
|
@@ -33,7 +33,7 @@
|
|
33
33
|
},
|
34
34
|
"dependencies": {
|
35
35
|
"@fluentui/react-shared-contexts": "^9.13.0",
|
36
|
-
"@fluentui/react-tabster": "^9.
|
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",
|