@atlaskit/portal 5.3.2 → 5.4.1

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/portal
 
+## 5.4.1
+
+### Patch Changes
+
+- [`02483200273ec`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/02483200273ec) -
+  Enrol all Design System UI packages into the React Compiler with platform gating via
+  isReactCompilerActivePlatform.
+- Updated dependencies
+
+## 5.4.0
+
+### Minor Changes
+
+- [`399dfa9f10273`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/399dfa9f10273) -
+  [ux] Added an `isClosed` property that closes the portal cleanly and unmounts it
+
 ## 5.3.2
 
 ### Patch Changes

package/dist/cjs/internal/components/internal-portal-new.js

@@ -10,32 +10,53 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _react = _interopRequireWildcard(require("react"));
 var _reactDom = require("react-dom");
 var _appProvider = require("@atlaskit/app-provider");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _useIsomorphicLayoutEffect = require("../hooks/use-isomorphic-layout-effect");
 var _portalDomUtils = require("../utils/portal-dom-utils");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function InternalPortalNew(props) {
   var zIndex = props.zIndex,
-    children = props.children;
+    children = props.children,
+    isClosed = props.isClosed;
   var _useState = (0, _react.useState)(null),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     atlaskitPortal = _useState2[0],
     setAtlaskitPortal = _useState2[1];
   var colorMode = (0, _appProvider.useColorMode)();
   (0, _useIsomorphicLayoutEffect.useIsomorphicLayoutEffect)(function () {
-    var tempPortalContainer = (0, _portalDomUtils.createAtlaskitPortal)(zIndex);
-    setAtlaskitPortal(tempPortalContainer);
-    var portalParent = (0, _portalDomUtils.createPortalParent)();
-    if (!tempPortalContainer || !portalParent) {
-      return;
-    }
-    portalParent.appendChild(tempPortalContainer);
-    return function () {
-      if (tempPortalContainer) {
-        portalParent.removeChild(tempPortalContainer);
+    if ((0, _platformFeatureFlags.fg)('import_into_jsm_in_template_gallery_killswitch')) {
+      if (!isClosed) {
+        var tempPortalContainer = (0, _portalDomUtils.createAtlaskitPortal)(zIndex);
+        setAtlaskitPortal(tempPortalContainer);
+        var portalParent = (0, _portalDomUtils.createPortalParent)();
+        if (!tempPortalContainer || !portalParent) {
+          return;
+        }
+        portalParent.appendChild(tempPortalContainer);
+        return function () {
+          if (portalParent) {
+            portalParent.removeChild(tempPortalContainer);
+            !portalParent.hasChildNodes() && (0, _portalDomUtils.removePortalParent)(portalParent);
+          }
+          setAtlaskitPortal(null);
+        };
+      }
+    } else {
+      var _tempPortalContainer = (0, _portalDomUtils.createAtlaskitPortal)(zIndex);
+      setAtlaskitPortal(_tempPortalContainer);
+      var _portalParent = (0, _portalDomUtils.createPortalParent)();
+      if (!_tempPortalContainer || !_portalParent) {
+        return;
       }
-      setAtlaskitPortal(null);
-    };
-  }, [zIndex]);
+      _portalParent.appendChild(_tempPortalContainer);
+      return function () {
+        if (_tempPortalContainer) {
+          _portalParent.removeChild(_tempPortalContainer);
+        }
+        setAtlaskitPortal(null);
+      };
+    }
+  }, [zIndex, isClosed, _platformFeatureFlags.fg]);
 
   /**
    * We wrap portal children with a Suspense boundary because in React 18 concurrent,

package/dist/cjs/internal/components/internal-portal.js

@@ -8,11 +8,14 @@ exports.default = InternalPortal;
 var _react = _interopRequireWildcard(require("react"));
 var _reactDom = require("react-dom");
 var _appProvider = require("@atlaskit/app-provider");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _portalDomUtils = require("../utils/portal-dom-utils");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function InternalPortal(props) {
   var zIndex = props.zIndex,
-    children = props.children;
+    children = props.children,
+    _props$isClosed = props.isClosed,
+    isClosed = _props$isClosed === void 0 ? false : _props$isClosed;
   var container = (0, _react.useMemo)(function () {
     return (0, _portalDomUtils.createContainer)(zIndex);
   }, [zIndex]);
@@ -23,6 +26,13 @@ function InternalPortal(props) {
   // For any further changes, ensure that the container does not have a
   // parent besides the portal parent.
   (0, _portalDomUtils.appendPortalContainerIfNotAppended)(container);
+  (0, _react.useEffect)(function () {
+    if ((0, _platformFeatureFlags.fg)('import_into_jsm_in_template_gallery_killswitch')) {
+      if (isClosed) {
+        (0, _portalDomUtils.removePortalContainer)(container);
+      }
+    }
+  }, [isClosed, container]);
   (0, _react.useEffect)(function () {
     return function () {
       (0, _portalDomUtils.removePortalContainer)(container);

package/dist/cjs/internal/utils/portal-dom-utils.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.removePortalContainer = exports.createPortalParent = exports.createContainer = exports.createAtlaskitPortal = exports.appendPortalContainerIfNotAppended = void 0;
+exports.removePortalParent = exports.removePortalContainer = exports.createPortalParent = exports.createContainer = exports.createAtlaskitPortal = exports.appendPortalContainerIfNotAppended = void 0;
 var _constants = require("../constants");
 /**
  * Creates a new portal container element with provided z-index and class name 'atlaskit-portal',
@@ -50,7 +50,10 @@ var getPortalParent = function getPortalParent() {
  *  @param {HTMLDivElement | undefined} container - portal container to be removed from portal parent container
  */
 var removePortalContainer = exports.removePortalContainer = function removePortalContainer(container) {
-  getPortalParent().removeChild(container);
+  var parent = getPortalParent();
+  if (parent.contains(container)) {
+    parent.removeChild(container);
+  }
 };
 
 /**
@@ -90,4 +93,12 @@ var createPortalParent = exports.createPortalParent = function createPortalParen
     return parentElement;
   }
   return;
+};
+var removePortalParent = exports.removePortalParent = function removePortalParent(parentElement) {
+  if (isDocumentDefined()) {
+    if (parentElement) {
+      var _getBody3;
+      (_getBody3 = getBody()) === null || _getBody3 === void 0 || _getBody3.removeChild(parentElement);
+    }
+  }
 };

package/dist/cjs/portal.js

@@ -16,12 +16,16 @@ function Portal(_ref) {
     zIndex = _ref$zIndex === void 0 ? 0 : _ref$zIndex,
     children = _ref.children,
     _ref$mountStrategy = _ref.mountStrategy,
-    mountStrategy = _ref$mountStrategy === void 0 ? 'effect' : _ref$mountStrategy;
+    mountStrategy = _ref$mountStrategy === void 0 ? 'effect' : _ref$mountStrategy,
+    _ref$isClosed = _ref.isClosed,
+    isClosed = _ref$isClosed === void 0 ? false : _ref$isClosed;
   var isSubsequentRender = (0, _useIsSubsequentRender.default)(mountStrategy);
   (0, _usePortalEvent.default)(zIndex);
   return !(0, _platformFeatureFlags.fg)('platform_design_system_team_portal_logic_r18_fix') ? isSubsequentRender ? /*#__PURE__*/_react.default.createElement(_internalPortal.default, {
-    zIndex: zIndex
+    zIndex: zIndex,
+    isClosed: isClosed
   }, children) : null : /*#__PURE__*/_react.default.createElement(_internalPortalNew.default, {
-    zIndex: zIndex
+    zIndex: zIndex,
+    isClosed: isClosed
   }, children);
 }

package/dist/es2019/internal/components/internal-portal-new.js

@@ -1,30 +1,51 @@
 import React, { Suspense, useState } from 'react';
 import { createPortal } from 'react-dom';
 import { ThemeProvider, useColorMode } from '@atlaskit/app-provider';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { useIsomorphicLayoutEffect } from '../hooks/use-isomorphic-layout-effect';
-import { createAtlaskitPortal, createPortalParent } from '../utils/portal-dom-utils';
+import { createAtlaskitPortal, createPortalParent, removePortalParent } from '../utils/portal-dom-utils';
 export default function InternalPortalNew(props) {
   const {
     zIndex,
-    children
+    children,
+    isClosed
   } = props;
   const [atlaskitPortal, setAtlaskitPortal] = useState(null);
   const colorMode = useColorMode();
   useIsomorphicLayoutEffect(() => {
-    const tempPortalContainer = createAtlaskitPortal(zIndex);
-    setAtlaskitPortal(tempPortalContainer);
-    const portalParent = createPortalParent();
-    if (!tempPortalContainer || !portalParent) {
-      return;
-    }
-    portalParent.appendChild(tempPortalContainer);
-    return () => {
-      if (tempPortalContainer) {
-        portalParent.removeChild(tempPortalContainer);
+    if (fg('import_into_jsm_in_template_gallery_killswitch')) {
+      if (!isClosed) {
+        let tempPortalContainer = createAtlaskitPortal(zIndex);
+        setAtlaskitPortal(tempPortalContainer);
+        const portalParent = createPortalParent();
+        if (!tempPortalContainer || !portalParent) {
+          return;
+        }
+        portalParent.appendChild(tempPortalContainer);
+        return () => {
+          if (portalParent) {
+            portalParent.removeChild(tempPortalContainer);
+            !portalParent.hasChildNodes() && removePortalParent(portalParent);
+          }
+          setAtlaskitPortal(null);
+        };
+      }
+    } else {
+      const tempPortalContainer = createAtlaskitPortal(zIndex);
+      setAtlaskitPortal(tempPortalContainer);
+      const portalParent = createPortalParent();
+      if (!tempPortalContainer || !portalParent) {
+        return;
       }
-      setAtlaskitPortal(null);
-    };
-  }, [zIndex]);
+      portalParent.appendChild(tempPortalContainer);
+      return () => {
+        if (tempPortalContainer) {
+          portalParent.removeChild(tempPortalContainer);
+        }
+        setAtlaskitPortal(null);
+      };
+    }
+  }, [zIndex, isClosed, fg]);
 
   /**
    * We wrap portal children with a Suspense boundary because in React 18 concurrent,

package/dist/es2019/internal/components/internal-portal.js

@@ -1,11 +1,13 @@
 import React, { useEffect, useMemo } from 'react';
 import { createPortal } from 'react-dom';
 import { ThemeProvider, useColorMode } from '@atlaskit/app-provider';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { appendPortalContainerIfNotAppended, createContainer, removePortalContainer } from '../utils/portal-dom-utils';
 export default function InternalPortal(props) {
   const {
     zIndex,
-    children
+    children,
+    isClosed = false
   } = props;
   const container = useMemo(() => createContainer(zIndex), [zIndex]);
   const colorMode = useColorMode();
@@ -15,6 +17,13 @@ export default function InternalPortal(props) {
   // For any further changes, ensure that the container does not have a
   // parent besides the portal parent.
   appendPortalContainerIfNotAppended(container);
+  useEffect(() => {
+    if (fg('import_into_jsm_in_template_gallery_killswitch')) {
+      if (isClosed) {
+        removePortalContainer(container);
+      }
+    }
+  }, [isClosed, container]);
   useEffect(() => {
     return () => {
       removePortalContainer(container);

package/dist/es2019/internal/utils/portal-dom-utils.js

@@ -45,7 +45,10 @@ const getPortalParent = () => {
  *  @param {HTMLDivElement | undefined} container - portal container to be removed from portal parent container
  */
 export const removePortalContainer = container => {
-  getPortalParent().removeChild(container);
+  const parent = getPortalParent();
+  if (parent.contains(container)) {
+    parent.removeChild(container);
+  }
 };
 
 /**
@@ -85,4 +88,12 @@ export const createPortalParent = () => {
     return parentElement;
   }
   return;
+};
+export const removePortalParent = parentElement => {
+  if (isDocumentDefined()) {
+    if (parentElement) {
+      var _getBody3;
+      (_getBody3 = getBody()) === null || _getBody3 === void 0 ? void 0 : _getBody3.removeChild(parentElement);
+    }
+  }
 };

package/dist/es2019/portal.js

@@ -7,13 +7,16 @@ import useFirePortalEvent from './internal/hooks/use-portal-event';
 export default function Portal({
   zIndex = 0,
   children,
-  mountStrategy = 'effect'
+  mountStrategy = 'effect',
+  isClosed = false
 }) {
   const isSubsequentRender = useIsSubsequentRender(mountStrategy);
   useFirePortalEvent(zIndex);
   return !fg('platform_design_system_team_portal_logic_r18_fix') ? isSubsequentRender ? /*#__PURE__*/React.createElement(InternalPortal, {
-    zIndex: zIndex
+    zIndex: zIndex,
+    isClosed: isClosed
   }, children) : null : /*#__PURE__*/React.createElement(InternalPortalNew, {
-    zIndex: zIndex
+    zIndex: zIndex,
+    isClosed: isClosed
   }, children);
 }

package/dist/esm/internal/components/internal-portal-new.js

@@ -2,31 +2,52 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { Suspense, useState } from 'react';
 import { createPortal } from 'react-dom';
 import { ThemeProvider, useColorMode } from '@atlaskit/app-provider';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { useIsomorphicLayoutEffect } from '../hooks/use-isomorphic-layout-effect';
-import { createAtlaskitPortal, createPortalParent } from '../utils/portal-dom-utils';
+import { createAtlaskitPortal, createPortalParent, removePortalParent } from '../utils/portal-dom-utils';
 export default function InternalPortalNew(props) {
   var zIndex = props.zIndex,
-    children = props.children;
+    children = props.children,
+    isClosed = props.isClosed;
   var _useState = useState(null),
     _useState2 = _slicedToArray(_useState, 2),
     atlaskitPortal = _useState2[0],
     setAtlaskitPortal = _useState2[1];
   var colorMode = useColorMode();
   useIsomorphicLayoutEffect(function () {
-    var tempPortalContainer = createAtlaskitPortal(zIndex);
-    setAtlaskitPortal(tempPortalContainer);
-    var portalParent = createPortalParent();
-    if (!tempPortalContainer || !portalParent) {
-      return;
-    }
-    portalParent.appendChild(tempPortalContainer);
-    return function () {
-      if (tempPortalContainer) {
-        portalParent.removeChild(tempPortalContainer);
+    if (fg('import_into_jsm_in_template_gallery_killswitch')) {
+      if (!isClosed) {
+        var tempPortalContainer = createAtlaskitPortal(zIndex);
+        setAtlaskitPortal(tempPortalContainer);
+        var portalParent = createPortalParent();
+        if (!tempPortalContainer || !portalParent) {
+          return;
+        }
+        portalParent.appendChild(tempPortalContainer);
+        return function () {
+          if (portalParent) {
+            portalParent.removeChild(tempPortalContainer);
+            !portalParent.hasChildNodes() && removePortalParent(portalParent);
+          }
+          setAtlaskitPortal(null);
+        };
+      }
+    } else {
+      var _tempPortalContainer = createAtlaskitPortal(zIndex);
+      setAtlaskitPortal(_tempPortalContainer);
+      var _portalParent = createPortalParent();
+      if (!_tempPortalContainer || !_portalParent) {
+        return;
       }
-      setAtlaskitPortal(null);
-    };
-  }, [zIndex]);
+      _portalParent.appendChild(_tempPortalContainer);
+      return function () {
+        if (_tempPortalContainer) {
+          _portalParent.removeChild(_tempPortalContainer);
+        }
+        setAtlaskitPortal(null);
+      };
+    }
+  }, [zIndex, isClosed, fg]);
 
   /**
    * We wrap portal children with a Suspense boundary because in React 18 concurrent,

package/dist/esm/internal/components/internal-portal.js

@@ -1,10 +1,13 @@
 import React, { useEffect, useMemo } from 'react';
 import { createPortal } from 'react-dom';
 import { ThemeProvider, useColorMode } from '@atlaskit/app-provider';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { appendPortalContainerIfNotAppended, createContainer, removePortalContainer } from '../utils/portal-dom-utils';
 export default function InternalPortal(props) {
   var zIndex = props.zIndex,
-    children = props.children;
+    children = props.children,
+    _props$isClosed = props.isClosed,
+    isClosed = _props$isClosed === void 0 ? false : _props$isClosed;
   var container = useMemo(function () {
     return createContainer(zIndex);
   }, [zIndex]);
@@ -15,6 +18,13 @@ export default function InternalPortal(props) {
   // For any further changes, ensure that the container does not have a
   // parent besides the portal parent.
   appendPortalContainerIfNotAppended(container);
+  useEffect(function () {
+    if (fg('import_into_jsm_in_template_gallery_killswitch')) {
+      if (isClosed) {
+        removePortalContainer(container);
+      }
+    }
+  }, [isClosed, container]);
   useEffect(function () {
     return function () {
       removePortalContainer(container);

package/dist/esm/internal/utils/portal-dom-utils.js

@@ -45,7 +45,10 @@ var getPortalParent = function getPortalParent() {
  *  @param {HTMLDivElement | undefined} container - portal container to be removed from portal parent container
  */
 export var removePortalContainer = function removePortalContainer(container) {
-  getPortalParent().removeChild(container);
+  var parent = getPortalParent();
+  if (parent.contains(container)) {
+    parent.removeChild(container);
+  }
 };
 
 /**
@@ -85,4 +88,12 @@ export var createPortalParent = function createPortalParent() {
     return parentElement;
   }
   return;
+};
+export var removePortalParent = function removePortalParent(parentElement) {
+  if (isDocumentDefined()) {
+    if (parentElement) {
+      var _getBody3;
+      (_getBody3 = getBody()) === null || _getBody3 === void 0 || _getBody3.removeChild(parentElement);
+    }
+  }
 };

package/dist/esm/portal.js

@@ -9,12 +9,16 @@ export default function Portal(_ref) {
     zIndex = _ref$zIndex === void 0 ? 0 : _ref$zIndex,
     children = _ref.children,
     _ref$mountStrategy = _ref.mountStrategy,
-    mountStrategy = _ref$mountStrategy === void 0 ? 'effect' : _ref$mountStrategy;
+    mountStrategy = _ref$mountStrategy === void 0 ? 'effect' : _ref$mountStrategy,
+    _ref$isClosed = _ref.isClosed,
+    isClosed = _ref$isClosed === void 0 ? false : _ref$isClosed;
   var isSubsequentRender = useIsSubsequentRender(mountStrategy);
   useFirePortalEvent(zIndex);
   return !fg('platform_design_system_team_portal_logic_r18_fix') ? isSubsequentRender ? /*#__PURE__*/React.createElement(InternalPortal, {
-    zIndex: zIndex
+    zIndex: zIndex,
+    isClosed: isClosed
   }, children) : null : /*#__PURE__*/React.createElement(InternalPortalNew, {
-    zIndex: zIndex
+    zIndex: zIndex,
+    isClosed: isClosed
   }, children);
 }

package/dist/types/internal/components/internal-portal-new.d.ts

@@ -2,6 +2,7 @@ import React from 'react';
 interface InternalPortalProps {
     children: React.ReactNode;
     zIndex: number | string;
+    isClosed?: boolean;
 }
 export default function InternalPortalNew(props: InternalPortalProps): React.ReactPortal | null;
 export {};

package/dist/types/internal/components/internal-portal.d.ts

@@ -2,6 +2,7 @@ import React, { type ReactPortal } from 'react';
 interface InternalPortalProps {
     children: React.ReactNode;
     zIndex: number | string;
+    isClosed?: boolean;
 }
 export default function InternalPortal(props: InternalPortalProps): ReactPortal;
 export {};

package/dist/types/internal/utils/portal-dom-utils.d.ts

@@ -17,3 +17,4 @@ export declare const removePortalContainer: (container: HTMLDivElement) => void;
 export declare const appendPortalContainerIfNotAppended: (container: HTMLDivElement) => void;
 export declare const createAtlaskitPortal: (zIndex: number | string) => HTMLDivElement | undefined;
 export declare const createPortalParent: () => Element | undefined;
+export declare const removePortalParent: (parentElement: Element) => void;

package/dist/types/portal.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { PortalProps } from './types';
-export default function Portal({ zIndex, children, mountStrategy, }: PortalProps): React.JSX.Element | null;
+export default function Portal({ zIndex, children, mountStrategy, isClosed, }: PortalProps): React.JSX.Element | null;

package/dist/types/types.d.ts

@@ -11,6 +11,10 @@ export interface PortalProps {
      * Note: UseLayoutEffect can lead to performance issues and is discouraged.
      */
     mountStrategy?: MountStrategy;
+    /**
+     * Whether the portal is closed.
+     */
+    isClosed?: boolean;
 }
 /**
  * Custom event object that will be fired when Atlassian Portal component is mounted and unmounted

package/dist/types-ts4.5/internal/components/internal-portal-new.d.ts

@@ -2,6 +2,7 @@ import React from 'react';
 interface InternalPortalProps {
     children: React.ReactNode;
     zIndex: number | string;
+    isClosed?: boolean;
 }
 export default function InternalPortalNew(props: InternalPortalProps): React.ReactPortal | null;
 export {};

package/dist/types-ts4.5/internal/components/internal-portal.d.ts

@@ -2,6 +2,7 @@ import React, { type ReactPortal } from 'react';
 interface InternalPortalProps {
     children: React.ReactNode;
     zIndex: number | string;
+    isClosed?: boolean;
 }
 export default function InternalPortal(props: InternalPortalProps): ReactPortal;
 export {};

package/dist/types-ts4.5/internal/utils/portal-dom-utils.d.ts

@@ -17,3 +17,4 @@ export declare const removePortalContainer: (container: HTMLDivElement) => void;
 export declare const appendPortalContainerIfNotAppended: (container: HTMLDivElement) => void;
 export declare const createAtlaskitPortal: (zIndex: number | string) => HTMLDivElement | undefined;
 export declare const createPortalParent: () => Element | undefined;
+export declare const removePortalParent: (parentElement: Element) => void;

package/dist/types-ts4.5/portal.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { PortalProps } from './types';
-export default function Portal({ zIndex, children, mountStrategy, }: PortalProps): React.JSX.Element | null;
+export default function Portal({ zIndex, children, mountStrategy, isClosed, }: PortalProps): React.JSX.Element | null;

package/dist/types-ts4.5/types.d.ts

@@ -11,6 +11,10 @@ export interface PortalProps {
      * Note: UseLayoutEffect can lead to performance issues and is discouraged.
      */
     mountStrategy?: MountStrategy;
+    /**
+     * Whether the portal is closed.
+     */
+    isClosed?: boolean;
 }
 /**
  * Custom event object that will be fired when Atlassian Portal component is mounted and unmounted

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/portal",
-	"version": "5.3.2",
+	"version": "5.4.1",
 	"description": "A wrapper for rendering components in React portals.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -25,6 +25,13 @@
 	],
 	"atlaskit:src": "src/index.tsx",
 	"atlassian": {
+		"react-compiler": {
+			"enabled": true,
+			"gating": {
+				"source": "@atlassian/react-compiler-gating",
+				"importSpecifierName": "isReactCompilerActivePlatform"
+			}
+		},
 		"team": "Design System Team",
 		"website": {
 			"name": "Portal",
@@ -60,6 +67,7 @@
 		"@atlaskit/tokens": "^11.4.0",
 		"@atlaskit/tooltip": "^21.1.0",
 		"@atlassian/feature-flags-test-utils": "^1.0.0",
+		"@atlassian/react-compiler-gating": "workspace:^",
 		"@atlassian/ssr-tests": "workspace:^",
 		"@atlassian/structured-docs-types": "workspace:^",
 		"@compiled/react": "^0.20.0",
@@ -96,6 +104,9 @@
 	"platform-feature-flags": {
 		"platform_design_system_team_portal_logic_r18_fix": {
 			"type": "boolean"
+		},
+		"import_into_jsm_in_template_gallery_killswitch": {
+			"type": "boolean"
 		}
 	}
 }