@atlaskit/modal-dialog 15.2.7 → 15.3.0

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @atlaskit/modal-dialog
 
+## 15.3.0
+
+### Minor Changes
+
+- [`2fd74328732bf`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/2fd74328732bf) -
+  Updated to use new motion in top layer dialog
+
+### Patch Changes
+
+- Updated dependencies
+
+## 15.2.8
+
+### Patch Changes
+
+- [`6d0485dce81c4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6d0485dce81c4) -
+  Internal: updated to the new `@atlaskit/top-layer` `Popover`/`Dialog` behaviour where the host
+  element unmounts after the exit animation completes. No consumer action required.
+- Updated dependencies
+
 ## 15.2.7
 
 ### Patch Changes

package/dist/cjs/internal/components/modal-wrapper.js

@@ -42,7 +42,7 @@ var _dialogHeight = require("./dialog-height");
 var _dialogWidth = require("./dialog-width");
 var _modalDialog = _interopRequireDefault(require("./modal-dialog"));
 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" != _typeof3(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); }
-var modalAnimation = (0, _animations.dialogSlideUpAndFade)();
+var modalAnimation = (0, _animations.dialogMotion)();
 var fillScreenStyles = null;
 
 // Visual styles for modal content inside native <dialog>.
@@ -114,7 +114,7 @@ var InternalModalWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (props,
     action: 'closed',
     componentName: 'modalDialog',
     packageName: "@atlaskit/modal-dialog",
-    packageVersion: "15.2.6"
+    packageVersion: "15.2.8"
   });
   var onBlanketClicked = (0, _react.useCallback)(function (e) {
     if (shouldCloseOnOverlayClick) {
@@ -331,7 +331,9 @@ var InternalModalWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (props,
       // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
       ,
       style: dialogStyle
-    }), /*#__PURE__*/React.createElement(_dialogScrollLock.DialogScrollLock, null), dialogPositionStyles &&
+    }), /*#__PURE__*/React.createElement(_dialogScrollLock.DialogScrollLock, {
+      isOpen: true
+    }), dialogPositionStyles &&
     /*#__PURE__*/
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-global-styles
     React.createElement("style", null, dialogPositionStyles), /*#__PURE__*/React.createElement("div", {

package/dist/es2019/internal/components/modal-wrapper.js

@@ -20,7 +20,7 @@ import { fg } from '@atlaskit/platform-feature-flags';
 import Portal from '@atlaskit/portal';
 import { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';
 import { layers } from '@atlaskit/theme/constants';
-import { dialogSlideUpAndFade } from '@atlaskit/top-layer/animations';
+import { dialogMotion } from '@atlaskit/top-layer/animations';
 import { createCloseEvent, Dialog } from '@atlaskit/top-layer/dialog';
 import { DialogScrollLock } from '@atlaskit/top-layer/dialog-scroll-lock';
 import { ModalContext, ScrollContext } from '../context';
@@ -32,7 +32,7 @@ import { disableDraggingToCrossOriginIFramesForTextSelection } from '../pragmati
 import { dialogHeight } from './dialog-height';
 import { dialogWidth as getDialogWidth } from './dialog-width';
 import ModalDialog from './modal-dialog';
-const modalAnimation = dialogSlideUpAndFade();
+const modalAnimation = dialogMotion();
 const fillScreenStyles = null;
 
 // Visual styles for modal content inside native <dialog>.
@@ -100,7 +100,7 @@ const InternalModalWrapper = /*#__PURE__*/forwardRef((props, ref) => {
     action: 'closed',
     componentName: 'modalDialog',
     packageName: "@atlaskit/modal-dialog",
-    packageVersion: "15.2.6"
+    packageVersion: "15.2.8"
   });
   const onBlanketClicked = useCallback(e => {
     if (shouldCloseOnOverlayClick) {
@@ -316,7 +316,9 @@ const InternalModalWrapper = /*#__PURE__*/forwardRef((props, ref) => {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
       ,
       style: dialogStyle
-    }), /*#__PURE__*/React.createElement(DialogScrollLock, null), dialogPositionStyles &&
+    }), /*#__PURE__*/React.createElement(DialogScrollLock, {
+      isOpen: true
+    }), dialogPositionStyles &&
     /*#__PURE__*/
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-global-styles
     React.createElement("style", null, dialogPositionStyles), /*#__PURE__*/React.createElement("div", {

package/dist/esm/internal/components/modal-wrapper.js

@@ -21,7 +21,7 @@ import { fg } from '@atlaskit/platform-feature-flags';
 import Portal from '@atlaskit/portal';
 import { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';
 import { layers } from '@atlaskit/theme/constants';
-import { dialogSlideUpAndFade } from '@atlaskit/top-layer/animations';
+import { dialogMotion } from '@atlaskit/top-layer/animations';
 import { createCloseEvent, Dialog } from '@atlaskit/top-layer/dialog';
 import { DialogScrollLock } from '@atlaskit/top-layer/dialog-scroll-lock';
 import { ModalContext, ScrollContext } from '../context';
@@ -33,7 +33,7 @@ import { disableDraggingToCrossOriginIFramesForTextSelection } from '../pragmati
 import { dialogHeight } from './dialog-height';
 import { dialogWidth as getDialogWidth } from './dialog-width';
 import ModalDialog from './modal-dialog';
-var modalAnimation = dialogSlideUpAndFade();
+var modalAnimation = dialogMotion();
 var fillScreenStyles = null;
 
 // Visual styles for modal content inside native <dialog>.
@@ -105,7 +105,7 @@ var InternalModalWrapper = /*#__PURE__*/forwardRef(function (props, ref) {
     action: 'closed',
     componentName: 'modalDialog',
     packageName: "@atlaskit/modal-dialog",
-    packageVersion: "15.2.6"
+    packageVersion: "15.2.8"
   });
   var onBlanketClicked = useCallback(function (e) {
     if (shouldCloseOnOverlayClick) {
@@ -322,7 +322,9 @@ var InternalModalWrapper = /*#__PURE__*/forwardRef(function (props, ref) {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
       ,
       style: dialogStyle
-    }), /*#__PURE__*/React.createElement(DialogScrollLock, null), dialogPositionStyles &&
+    }), /*#__PURE__*/React.createElement(DialogScrollLock, {
+      isOpen: true
+    }), dialogPositionStyles &&
     /*#__PURE__*/
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-global-styles
     React.createElement("style", null, dialogPositionStyles), /*#__PURE__*/React.createElement("div", {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/modal-dialog",
-	"version": "15.2.7",
+	"version": "15.3.0",
 	"description": "A modal dialog displays content that requires user interaction, in a layer above the page.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -47,8 +47,8 @@
 		"@atlaskit/pragmatic-drag-and-drop": "^1.8.0",
 		"@atlaskit/primitives": "^19.0.0",
 		"@atlaskit/theme": "^25.0.0",
-		"@atlaskit/tokens": "^13.3.0",
-		"@atlaskit/top-layer": "^0.15.0",
+		"@atlaskit/tokens": "^13.4.0",
+		"@atlaskit/top-layer": "^0.17.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.20.0",
 		"bind-event-listener": "^3.0.0",
@@ -76,7 +76,7 @@
 		"@atlaskit/form": "^15.5.0",
 		"@atlaskit/heading": "^5.4.0",
 		"@atlaskit/link": "^3.4.0",
-		"@atlaskit/popup": "^4.23.0",
+		"@atlaskit/popup": "^4.25.0",
 		"@atlaskit/radio": "^8.6.0",
 		"@atlaskit/section-message": "^8.13.0",
 		"@atlaskit/select": "^21.12.0",