@atlaskit/modal-dialog 12.15.5 → 12.15.6

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/modal-dialog
 
+## 12.15.6
+
+### Patch Changes
+
+- [#138585](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/138585)
+  [`b72c2c7f9a2fd`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/b72c2c7f9a2fd) -
+  Support to close all layers when clicking outside under feature flag
+
 ## 12.15.5
 
 ### Patch Changes

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

@@ -109,6 +109,8 @@ var ModalDialog = function ModalDialog(props) {
     onClose: onClose,
     isDisabled: !shouldCloseOnEscapePress
   });
+  var _UNSAFE_useLayering = (0, _layering.UNSAFE_useLayering)(),
+    currentLevel = _UNSAFE_useLayering.currentLevel;
   return (0, _react2.jsx)(_positioner.default, {
     stackIndex: stackIndex,
     shouldScrollInViewport: shouldScrollInViewport,
@@ -139,7 +141,8 @@ var ModalDialog = function ModalDialog(props) {
       "data-testid": testId,
       "data-modal-stack": stackIndex,
       tabIndex: -1,
-      "aria-modal": true
+      "aria-modal": true,
+      "data-ds--level": currentLevel
     }), children));
   }))));
 };

package/dist/cjs/modal-wrapper.js

@@ -102,7 +102,7 @@ var ModalWrapper = function ModalWrapper(props) {
     action: 'closed',
     componentName: 'modalDialog',
     packageName: "@atlaskit/modal-dialog",
-    packageVersion: "12.15.5"
+    packageVersion: "12.15.6"
   });
   var onBlanketClicked = (0, _react.useCallback)(function (e) {
     if (shouldCloseOnOverlayClick) {

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

@@ -9,7 +9,7 @@ import mergeRefs from '@atlaskit/ds-lib/merge-refs';
 import { useId } from '@atlaskit/ds-lib/react-uid';
 import useAutoFocus from '@atlaskit/ds-lib/use-auto-focus';
 import FocusRing from '@atlaskit/focus-ring';
-import { useCloseOnEscapePress } from '@atlaskit/layering';
+import { UNSAFE_useLayering, useCloseOnEscapePress } from '@atlaskit/layering';
 import FadeIn from '@atlaskit/motion/fade-in';
 import { media } from '@atlaskit/primitives';
 import { N0, N30A, N60A } from '@atlaskit/theme/colors';
@@ -105,6 +105,9 @@ const ModalDialog = props => {
     onClose,
     isDisabled: !shouldCloseOnEscapePress
   });
+  const {
+    currentLevel
+  } = UNSAFE_useLayering();
   return jsx(Positioner, {
     stackIndex: stackIndex,
     shouldScrollInViewport: shouldScrollInViewport,
@@ -134,7 +137,8 @@ const ModalDialog = props => {
     "data-testid": testId,
     "data-modal-stack": stackIndex,
     tabIndex: -1,
-    "aria-modal": true
+    "aria-modal": true,
+    "data-ds--level": currentLevel
   }), children))))));
 };
 

package/dist/es2019/modal-wrapper.js

@@ -87,7 +87,7 @@ const ModalWrapper = props => {
     action: 'closed',
     componentName: 'modalDialog',
     packageName: "@atlaskit/modal-dialog",
-    packageVersion: "12.15.5"
+    packageVersion: "12.15.6"
   });
   const onBlanketClicked = useCallback(e => {
     if (shouldCloseOnOverlayClick) {

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

@@ -13,7 +13,7 @@ import mergeRefs from '@atlaskit/ds-lib/merge-refs';
 import { useId } from '@atlaskit/ds-lib/react-uid';
 import useAutoFocus from '@atlaskit/ds-lib/use-auto-focus';
 import FocusRing from '@atlaskit/focus-ring';
-import { useCloseOnEscapePress } from '@atlaskit/layering';
+import { UNSAFE_useLayering, useCloseOnEscapePress } from '@atlaskit/layering';
 import FadeIn from '@atlaskit/motion/fade-in';
 import { media } from '@atlaskit/primitives';
 import { N0, N30A, N60A } from '@atlaskit/theme/colors';
@@ -102,6 +102,8 @@ var ModalDialog = function ModalDialog(props) {
     onClose: onClose,
     isDisabled: !shouldCloseOnEscapePress
   });
+  var _UNSAFE_useLayering = UNSAFE_useLayering(),
+    currentLevel = _UNSAFE_useLayering.currentLevel;
   return jsx(Positioner, {
     stackIndex: stackIndex,
     shouldScrollInViewport: shouldScrollInViewport,
@@ -132,7 +134,8 @@ var ModalDialog = function ModalDialog(props) {
       "data-testid": testId,
       "data-modal-stack": stackIndex,
       tabIndex: -1,
-      "aria-modal": true
+      "aria-modal": true,
+      "data-ds--level": currentLevel
     }), children));
   }))));
 };

package/dist/esm/modal-wrapper.js

@@ -92,7 +92,7 @@ var ModalWrapper = function ModalWrapper(props) {
     action: 'closed',
     componentName: 'modalDialog',
     packageName: "@atlaskit/modal-dialog",
-    packageVersion: "12.15.5"
+    packageVersion: "12.15.6"
   });
   var onBlanketClicked = useCallback(function (e) {
     if (shouldCloseOnOverlayClick) {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/modal-dialog",
-	"version": "12.15.5",
+	"version": "12.15.6",
 	"description": "A modal dialog displays content that requires user interaction, in a layer above the page.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -31,7 +31,7 @@
 		"@atlaskit/codemod-utils": "^4.2.0",
 		"@atlaskit/ds-lib": "^2.5.0",
 		"@atlaskit/focus-ring": "^1.6.0",
-		"@atlaskit/icon": "^22.15.0",
+		"@atlaskit/icon": "^22.16.0",
 		"@atlaskit/layering": "^0.4.0",
 		"@atlaskit/motion": "^1.9.0",
 		"@atlaskit/platform-feature-flags": "^0.3.0",
@@ -55,9 +55,9 @@
 		"@af/integration-testing": "*",
 		"@af/visual-regression": "*",
 		"@atlaskit/button": "*",
-		"@atlaskit/checkbox": "^13.7.0",
+		"@atlaskit/checkbox": "^14.0.0",
 		"@atlaskit/dropdown-menu": "^12.18.0",
-		"@atlaskit/popup": "^1.24.0",
+		"@atlaskit/popup": "^1.25.0",
 		"@atlaskit/radio": "^6.5.0",
 		"@atlaskit/select": "^17.15.0",
 		"@atlaskit/ssr": "*",
@@ -126,6 +126,10 @@
 	"platform-feature-flags": {
 		"platform_dst_modal-dialog-bump-focus-lock": {
 			"type": "boolean"
+		},
+		"design-system-closed-all-when-click-outside": {
+			"type": "boolean",
+			"referenceOnly": true
 		}
 	},
 	"homepage": "https://atlassian.design/components/modal-dialog/"