@atlaskit/popup 1.11.0 → 1.11.2

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/popup
 
+## 1.11.2
+
+### Patch Changes
+
+- [#41628](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/41628) [`b05664f7aba`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b05664f7aba) - Use feature flag to toggle if we enable UNSAFE_LAYERING
+
+## 1.11.1
+
+### Patch Changes
+
+- [#41322](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/41322) [`f54519b315c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f54519b315c) - This removes the error in console when passing `shouldRenderToParent` prop.
+
 ## 1.11.0
 
 ### Minor Changes

package/dist/cjs/popper-wrapper.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("react");
 var _react2 = require("@emotion/react");
@@ -17,6 +18,7 @@ var _tokens = require("@atlaskit/tokens");
 var _repositionOnUpdate = require("./reposition-on-update");
 var _useCloseManager = require("./use-close-manager");
 var _useFocusManager = require("./use-focus-manager");
+var _excluded = ["shouldRenderToParent", "children"];
 var _css;
 /** @jsx jsx */
 var popupStyles = (0, _react2.css)((_css = {
@@ -34,12 +36,14 @@ var popupOverflowStyles = (0, _react2.css)({
   overflow: 'auto'
 });
 var DefaultPopupComponent = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
-  var shouldRenderToParent = props.shouldRenderToParent;
+  var shouldRenderToParent = props.shouldRenderToParent,
+    children = props.children,
+    htmlAttributes = (0, _objectWithoutProperties2.default)(props, _excluded);
   return (0, _react2.jsx)("div", (0, _extends2.default)({
     css: [popupStyles, !shouldRenderToParent && popupOverflowStyles]
-  }, props, {
+  }, htmlAttributes, {
     ref: ref
-  }));
+  }), children);
 });
 function PopperWrapper(_ref) {
   var isOpen = _ref.isOpen,

package/dist/cjs/popup.js

@@ -9,6 +9,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _react = require("react");
 var _react2 = require("@emotion/react");
 var _layering = require("@atlaskit/layering");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _popper = require("@atlaskit/popper");
 var _portal = _interopRequireDefault(require("@atlaskit/portal"));
 var _constants = require("@atlaskit/theme/constants");
@@ -46,7 +47,9 @@ var Popup = exports.Popup = /*#__PURE__*/(0, _react.memo)(function (_ref) {
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     triggerRef = _useState2[0],
     setTriggerRef = _useState2[1];
-  var renderPopperWrapper = (0, _react2.jsx)(_layering.UNSAFE_LAYERING, null, (0, _react2.jsx)(_popperWrapper.default, {
+  var renderPopperWrapper = (0, _react2.jsx)(_layering.UNSAFE_LAYERING, {
+    isDisabled: (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.layering_popup_1cnzt') ? false : true
+  }, (0, _react2.jsx)(_popperWrapper.default, {
     content: content,
     isOpen: isOpen,
     placement: placement,

package/dist/es2019/popper-wrapper.js

@@ -27,13 +27,15 @@ const popupOverflowStyles = css({
 });
 const DefaultPopupComponent = /*#__PURE__*/forwardRef((props, ref) => {
   const {
-    shouldRenderToParent
+    shouldRenderToParent,
+    children,
+    ...htmlAttributes
   } = props;
   return jsx("div", _extends({
     css: [popupStyles, !shouldRenderToParent && popupOverflowStyles]
-  }, props, {
+  }, htmlAttributes, {
     ref: ref
-  }));
+  }), children);
 });
 function PopperWrapper({
   isOpen,

package/dist/es2019/popup.js

@@ -3,6 +3,7 @@
 import { memo, useState } from 'react';
 import { jsx } from '@emotion/react';
 import { UNSAFE_LAYERING } from '@atlaskit/layering';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { Manager, Reference } from '@atlaskit/popper';
 import Portal from '@atlaskit/portal';
 import { layers } from '@atlaskit/theme/constants';
@@ -28,7 +29,9 @@ export const Popup = /*#__PURE__*/memo(({
   shouldRenderToParent = false
 }) => {
   const [triggerRef, setTriggerRef] = useState(null);
-  const renderPopperWrapper = jsx(UNSAFE_LAYERING, null, jsx(PopperWrapper, {
+  const renderPopperWrapper = jsx(UNSAFE_LAYERING, {
+    isDisabled: getBooleanFF('platform.design-system-team.layering_popup_1cnzt') ? false : true
+  }, jsx(PopperWrapper, {
     content: content,
     isOpen: isOpen,
     placement: placement,

package/dist/esm/popper-wrapper.js

@@ -1,6 +1,8 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["shouldRenderToParent", "children"];
 var _css;
 /** @jsx jsx */
 import { forwardRef, useMemo, useState } from 'react';
@@ -27,12 +29,14 @@ var popupOverflowStyles = css({
   overflow: 'auto'
 });
 var DefaultPopupComponent = /*#__PURE__*/forwardRef(function (props, ref) {
-  var shouldRenderToParent = props.shouldRenderToParent;
+  var shouldRenderToParent = props.shouldRenderToParent,
+    children = props.children,
+    htmlAttributes = _objectWithoutProperties(props, _excluded);
   return jsx("div", _extends({
     css: [popupStyles, !shouldRenderToParent && popupOverflowStyles]
-  }, props, {
+  }, htmlAttributes, {
     ref: ref
-  }));
+  }), children);
 });
 function PopperWrapper(_ref) {
   var isOpen = _ref.isOpen,

package/dist/esm/popup.js

@@ -4,6 +4,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import { memo, useState } from 'react';
 import { jsx } from '@emotion/react';
 import { UNSAFE_LAYERING } from '@atlaskit/layering';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { Manager, Reference } from '@atlaskit/popper';
 import Portal from '@atlaskit/portal';
 import { layers } from '@atlaskit/theme/constants';
@@ -38,7 +39,9 @@ export var Popup = /*#__PURE__*/memo(function (_ref) {
     _useState2 = _slicedToArray(_useState, 2),
     triggerRef = _useState2[0],
     setTriggerRef = _useState2[1];
-  var renderPopperWrapper = jsx(UNSAFE_LAYERING, null, jsx(PopperWrapper, {
+  var renderPopperWrapper = jsx(UNSAFE_LAYERING, {
+    isDisabled: getBooleanFF('platform.design-system-team.layering_popup_1cnzt') ? false : true
+  }, jsx(PopperWrapper, {
     content: content,
     isOpen: isOpen,
     placement: placement,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/popup",
-  "version": "1.11.0",
+  "version": "1.11.2",
   "description": "A popup displays brief content in an overlay.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -37,11 +37,11 @@
   "dependencies": {
     "@atlaskit/ds-lib": "^2.2.0",
     "@atlaskit/layering": "^0.2.0",
-    "@atlaskit/platform-feature-flags": "*",
+    "@atlaskit/platform-feature-flags": "^0.2.0",
     "@atlaskit/popper": "^5.5.0",
     "@atlaskit/portal": "^4.3.0",
     "@atlaskit/theme": "^12.6.0",
-    "@atlaskit/tokens": "^1.26.0",
+    "@atlaskit/tokens": "^1.27.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
     "bind-event-listener": "^2.1.1",
@@ -59,6 +59,7 @@
     "@atlaskit/ssr": "*",
     "@atlaskit/visual-regression": "*",
     "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
+    "@atlassian/feature-flags-test-utils": "*",
     "@testing-library/dom": "^8.17.1",
     "@testing-library/react": "^12.1.5",
     "ast-types": "^0.13.3",
@@ -94,11 +95,14 @@
       ]
     }
   },
-  "homepage": "https://atlassian.design/components/popup/",
-  "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1",
   "platform-feature-flags": {
+    "platform.design-system-team.layering_popup_1cnzt": {
+      "type": "boolean"
+    },
     "platform.design-system-team.remove-focus-trap-from-popup_3q7sk": {
       "type": "boolean"
     }
-  }
+  },
+  "homepage": "https://atlassian.design/components/popup/",
+  "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1"
 }