@atlaskit/modal-dialog 12.14.5 → 12.14.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (43) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/cjs/internal/components/modal-dialog.js +1 -1
  3. package/dist/cjs/internal/components/positioner.js +1 -1
  4. package/dist/cjs/internal/components/scroll-container.js +1 -1
  5. package/dist/cjs/modal-body.js +1 -1
  6. package/dist/cjs/modal-footer.js +1 -1
  7. package/dist/cjs/modal-header.js +1 -1
  8. package/dist/cjs/modal-title.js +1 -1
  9. package/dist/cjs/modal-wrapper.js +3 -5
  10. package/dist/es2019/internal/components/modal-dialog.js +1 -1
  11. package/dist/es2019/internal/components/positioner.js +1 -1
  12. package/dist/es2019/internal/components/scroll-container.js +1 -1
  13. package/dist/es2019/modal-body.js +1 -1
  14. package/dist/es2019/modal-footer.js +1 -1
  15. package/dist/es2019/modal-header.js +1 -1
  16. package/dist/es2019/modal-title.js +1 -1
  17. package/dist/es2019/modal-wrapper.js +3 -5
  18. package/dist/esm/internal/components/modal-dialog.js +1 -1
  19. package/dist/esm/internal/components/positioner.js +1 -1
  20. package/dist/esm/internal/components/scroll-container.js +1 -1
  21. package/dist/esm/modal-body.js +1 -1
  22. package/dist/esm/modal-footer.js +1 -1
  23. package/dist/esm/modal-header.js +1 -1
  24. package/dist/esm/modal-title.js +1 -1
  25. package/dist/esm/modal-wrapper.js +3 -5
  26. package/dist/types/internal/components/positioner.d.ts +1 -1
  27. package/dist/types/internal/components/scroll-container.d.ts +1 -1
  28. package/dist/types/modal-body.d.ts +1 -1
  29. package/dist/types/modal-footer.d.ts +1 -1
  30. package/dist/types/modal-header.d.ts +1 -1
  31. package/dist/types/modal-title.d.ts +1 -1
  32. package/dist/types/modal-wrapper.d.ts +1 -1
  33. package/dist/types/types.d.ts +4 -3
  34. package/dist/types-ts4.5/internal/components/positioner.d.ts +1 -1
  35. package/dist/types-ts4.5/internal/components/scroll-container.d.ts +1 -1
  36. package/dist/types-ts4.5/modal-body.d.ts +1 -1
  37. package/dist/types-ts4.5/modal-footer.d.ts +1 -1
  38. package/dist/types-ts4.5/modal-header.d.ts +1 -1
  39. package/dist/types-ts4.5/modal-title.d.ts +1 -1
  40. package/dist/types-ts4.5/modal-wrapper.d.ts +1 -1
  41. package/dist/types-ts4.5/types.d.ts +4 -3
  42. package/package.json +3 -14
  43. package/extract-react-types/modal-attributes.tsx +0 -5
package/CHANGELOG.md CHANGED
@@ -1,5 +1,22 @@
1
1
  # @atlaskit/modal-dialog
2
2
 
3
+ ## 12.14.7
4
+
5
+ ### Patch Changes
6
+
7
+ - [#122722](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/122722)
8
+ [`512798d699bd1`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/512798d699bd1) -
9
+ GA layering in modal-dialog to support multiple layers
10
+
11
+ ## 12.14.6
12
+
13
+ ### Patch Changes
14
+
15
+ - [#122769](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/122769)
16
+ [`e5aebb55bcafc`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/e5aebb55bcafc) -
17
+ [ux] This version removes `platform.design-system-team.multiple-modal-inappropriate-focus_z5u4j`
18
+ feature flag. Now focus returns back to trigger elements upon closing nested modals.
19
+
3
20
  ## 12.14.5
4
21
 
5
22
  ### Patch Changes
@@ -29,8 +29,8 @@ var _positioner = _interopRequireDefault(require("./positioner"));
29
29
  var _css;
30
30
  /**
31
31
  * @jsxRuntime classic
32
+ * @jsx jsx
32
33
  */
33
- /** @jsx jsx */
34
34
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-global-styles, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
35
35
  // reset pointer-events on iframe inside modal
36
36
  var resetPointerEventsOnIframeStyles = (0, _react2.css)({
@@ -15,8 +15,8 @@ var _constants2 = require("../constants");
15
15
  /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
16
16
  /**
17
17
  * @jsxRuntime classic
18
+ * @jsx jsx
18
19
  */
19
- /** @jsx jsx */
20
20
 
21
21
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
22
22
 
@@ -23,8 +23,8 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
23
23
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
24
24
  /**
25
25
  * @jsxRuntime classic
26
+ * @jsx jsx
26
27
  */
27
- /** @jsx jsx */
28
28
 
29
29
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
30
30
 
@@ -14,8 +14,8 @@ var _constants = require("./internal/constants");
14
14
  var _useScroll = _interopRequireDefault(require("./internal/hooks/use-scroll"));
15
15
  /**
16
16
  * @jsxRuntime classic
17
+ * @jsx jsx
17
18
  */
18
- /** @jsx jsx */
19
19
 
20
20
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
21
21
 
@@ -9,8 +9,8 @@ var _hooks = require("./hooks");
9
9
  var _constants = require("./internal/constants");
10
10
  /**
11
11
  * @jsxRuntime classic
12
+ * @jsx jsx
12
13
  */
13
- /** @jsx jsx */
14
14
 
15
15
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
16
16
 
@@ -11,8 +11,8 @@ var _hooks = require("./hooks");
11
11
  var _constants = require("./internal/constants");
12
12
  /**
13
13
  * @jsxRuntime classic
14
+ * @jsx jsx
14
15
  */
15
- /** @jsx jsx */
16
16
 
17
17
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
18
18
 
@@ -12,8 +12,8 @@ var _hooks = require("./hooks");
12
12
  var _constants = require("./internal/constants");
13
13
  /**
14
14
  * @jsxRuntime classic
15
+ * @jsx jsx
15
16
  */
16
- /** @jsx jsx */
17
17
 
18
18
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
19
19
 
@@ -16,7 +16,6 @@ var _blanket = _interopRequireDefault(require("@atlaskit/blanket"));
16
16
  var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
17
17
  var _layering = require("@atlaskit/layering");
18
18
  var _fadeIn = _interopRequireDefault(require("@atlaskit/motion/fade-in"));
19
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
20
19
  var _portal = _interopRequireDefault(require("@atlaskit/portal"));
21
20
  var _constants = require("@atlaskit/theme/constants");
22
21
  var _modalDialog = _interopRequireDefault(require("./internal/components/modal-dialog"));
@@ -26,8 +25,8 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
26
25
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
27
26
  /**
28
27
  * @jsxRuntime classic
28
+ * @jsx jsx
29
29
  */
30
- /** @jsx jsx */
31
30
 
32
31
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
33
32
 
@@ -100,7 +99,7 @@ var ModalWrapper = function ModalWrapper(props) {
100
99
  action: 'closed',
101
100
  componentName: 'modalDialog',
102
101
  packageName: "@atlaskit/modal-dialog",
103
- packageVersion: "12.14.5"
102
+ packageVersion: "12.14.7"
104
103
  });
105
104
  var onBlanketClicked = (0, _react.useCallback)(function (e) {
106
105
  if (shouldCloseOnOverlayClick) {
@@ -138,7 +137,7 @@ var ModalWrapper = function ModalWrapper(props) {
138
137
  };
139
138
  }
140
139
  return (0, _react2.jsx)(_layering.UNSAFE_LAYERING, {
141
- isDisabled: (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.layering_qmiw3') ? false : true
140
+ isDisabled: false
142
141
  }, (0, _react2.jsx)(_portal.default, {
143
142
  zIndex: _constants.layers.modal()
144
143
  }, (0, _react2.jsx)(_fadeIn.default, null, function (fadeInProps) {
@@ -147,7 +146,6 @@ var ModalWrapper = function ModalWrapper(props) {
147
146
  "aria-hidden": !isForeground
148
147
  }), (0, _react2.jsx)(_reactFocusLock.default, {
149
148
  autoFocus: autoFocusLock,
150
- disabled: (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.multiple-modal-inappropriate-focus_z5u4j') ? undefined : !isForeground,
151
149
  returnFocus: returnFocus,
152
150
  onDeactivation: onDeactivation,
153
151
  whiteList: function whiteList(element) {
@@ -1,8 +1,8 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  /**
3
3
  * @jsxRuntime classic
4
+ * @jsx jsx
4
5
  */
5
- /** @jsx jsx */
6
6
  import { useMemo } from 'react';
7
7
 
8
8
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-global-styles, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
@@ -1,8 +1,8 @@
1
1
  /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
2
2
  /**
3
3
  * @jsxRuntime classic
4
+ * @jsx jsx
4
5
  */
5
- /** @jsx jsx */
6
6
 
7
7
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
8
8
  import { css, jsx } from '@emotion/react';
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
 
6
6
  import React, { forwardRef, useEffect, useRef, useState } from 'react';
7
7
 
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
 
6
6
  import React from 'react';
7
7
 
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
 
6
6
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
7
7
  import { css, jsx } from '@emotion/react';
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import React from 'react';
6
6
 
7
7
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
 
6
6
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
7
7
  import { css, jsx } from '@emotion/react';
@@ -1,8 +1,8 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  /**
3
3
  * @jsxRuntime classic
4
+ * @jsx jsx
4
5
  */
5
- /** @jsx jsx */
6
6
 
7
7
  import { useCallback } from 'react';
8
8
 
@@ -15,7 +15,6 @@ import Blanket from '@atlaskit/blanket';
15
15
  import noop from '@atlaskit/ds-lib/noop';
16
16
  import { UNSAFE_LAYERING } from '@atlaskit/layering';
17
17
  import FadeIn from '@atlaskit/motion/fade-in';
18
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
19
18
  import Portal from '@atlaskit/portal';
20
19
  import { layers } from '@atlaskit/theme/constants';
21
20
  import ModalDialog from './internal/components/modal-dialog';
@@ -85,7 +84,7 @@ const ModalWrapper = props => {
85
84
  action: 'closed',
86
85
  componentName: 'modalDialog',
87
86
  packageName: "@atlaskit/modal-dialog",
88
- packageVersion: "12.14.5"
87
+ packageVersion: "12.14.7"
89
88
  });
90
89
  const onBlanketClicked = useCallback(e => {
91
90
  if (shouldCloseOnOverlayClick) {
@@ -123,7 +122,7 @@ const ModalWrapper = props => {
123
122
  };
124
123
  }
125
124
  return jsx(UNSAFE_LAYERING, {
126
- isDisabled: getBooleanFF('platform.design-system-team.layering_qmiw3') ? false : true
125
+ isDisabled: false
127
126
  }, jsx(Portal, {
128
127
  zIndex: layers.modal()
129
128
  }, jsx(FadeIn, null, fadeInProps => jsx("div", _extends({}, fadeInProps, {
@@ -131,7 +130,6 @@ const ModalWrapper = props => {
131
130
  "aria-hidden": !isForeground
132
131
  }), jsx(FocusLock, {
133
132
  autoFocus: autoFocusLock,
134
- disabled: getBooleanFF('platform.design-system-team.multiple-modal-inappropriate-focus_z5u4j') ? undefined : !isForeground,
135
133
  returnFocus: returnFocus,
136
134
  onDeactivation: onDeactivation,
137
135
  whiteList: element => allowlistElements(element, focusLockAllowlist)
@@ -5,8 +5,8 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
5
5
  var _css;
6
6
  /**
7
7
  * @jsxRuntime classic
8
+ * @jsx jsx
8
9
  */
9
- /** @jsx jsx */
10
10
  import { useMemo } from 'react';
11
11
 
12
12
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-global-styles, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
@@ -2,8 +2,8 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
  /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
3
3
  /**
4
4
  * @jsxRuntime classic
5
+ * @jsx jsx
5
6
  */
6
- /** @jsx jsx */
7
7
 
8
8
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
9
9
  import { css, jsx } from '@emotion/react';
@@ -2,8 +2,8 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
2
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
3
  /**
4
4
  * @jsxRuntime classic
5
+ * @jsx jsx
5
6
  */
6
- /** @jsx jsx */
7
7
 
8
8
  import React, { forwardRef, useEffect, useRef, useState } from 'react';
9
9
 
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
 
6
6
  import React from 'react';
7
7
 
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
 
6
6
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
7
7
  import { css, jsx } from '@emotion/react';
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import React from 'react';
6
6
 
7
7
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
 
6
6
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
7
7
  import { css, jsx } from '@emotion/react';
@@ -1,8 +1,8 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  /**
3
3
  * @jsxRuntime classic
4
+ * @jsx jsx
4
5
  */
5
- /** @jsx jsx */
6
6
 
7
7
  import { useCallback } from 'react';
8
8
 
@@ -15,7 +15,6 @@ import Blanket from '@atlaskit/blanket';
15
15
  import noop from '@atlaskit/ds-lib/noop';
16
16
  import { UNSAFE_LAYERING } from '@atlaskit/layering';
17
17
  import FadeIn from '@atlaskit/motion/fade-in';
18
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
19
18
  import Portal from '@atlaskit/portal';
20
19
  import { layers } from '@atlaskit/theme/constants';
21
20
  import ModalDialog from './internal/components/modal-dialog';
@@ -90,7 +89,7 @@ var ModalWrapper = function ModalWrapper(props) {
90
89
  action: 'closed',
91
90
  componentName: 'modalDialog',
92
91
  packageName: "@atlaskit/modal-dialog",
93
- packageVersion: "12.14.5"
92
+ packageVersion: "12.14.7"
94
93
  });
95
94
  var onBlanketClicked = useCallback(function (e) {
96
95
  if (shouldCloseOnOverlayClick) {
@@ -128,7 +127,7 @@ var ModalWrapper = function ModalWrapper(props) {
128
127
  };
129
128
  }
130
129
  return jsx(UNSAFE_LAYERING, {
131
- isDisabled: getBooleanFF('platform.design-system-team.layering_qmiw3') ? false : true
130
+ isDisabled: false
132
131
  }, jsx(Portal, {
133
132
  zIndex: layers.modal()
134
133
  }, jsx(FadeIn, null, function (fadeInProps) {
@@ -137,7 +136,6 @@ var ModalWrapper = function ModalWrapper(props) {
137
136
  "aria-hidden": !isForeground
138
137
  }), jsx(FocusLock, {
139
138
  autoFocus: autoFocusLock,
140
- disabled: getBooleanFF('platform.design-system-team.multiple-modal-inappropriate-focus_z5u4j') ? undefined : !isForeground,
141
139
  returnFocus: returnFocus,
142
140
  onDeactivation: onDeactivation,
143
141
  whiteList: function whiteList(element) {
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import { type ReactNode } from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  interface PositionerProps {
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import React from 'react';
6
6
  interface ScrollContainerProps {
7
7
  /**
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import React from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  export interface ModalBodyProps {
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import { type ReactNode } from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  export interface ModalFooterProps {
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import React from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  export interface ModalHeaderProps {
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import { type ReactNode } from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  import { type Appearance } from './types';
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import { jsx } from '@emotion/react';
6
6
  import type { ModalDialogProps } from './types';
7
7
  export type { ModalDialogProps };
@@ -25,7 +25,6 @@ export interface ModalDialogProps {
25
25
  /**
26
26
  * Callback function which lets you allowlist nodes so they can be interacted with outside of the focus lock.
27
27
  * Return `true` if focus lock should handle element, `false` if not.
28
- * Works when `platform.design-system-team.multiple-modal-inappropriate-focus_z5u4j` feature flag is enabled.
29
28
  */
30
29
  focusLockAllowlist?: (element: HTMLElement) => boolean;
31
30
  /**
@@ -79,8 +78,10 @@ export interface ModalDialogProps {
79
78
  */
80
79
  isBlanketHidden?: boolean;
81
80
  /**
82
- * Number representing where in the stack of modals this modal sits.
83
- * This offsets the modal dialogs vertical position.
81
+ * The stackIndex is a reference to the position (index) of the calling dialog in a modal dialog stack.
82
+ * New modals added to the stack receive the highest stack index of 0. As more modals are added to the stack, their index is dynamically increased according to their new position.
83
+ * Don't alter the modal stack position using `stackIndex` in implementations of third-party libraries (e.g. AUI modal), it may lead to unpredictable bugs, especially if the third party library has its own focus lock.
84
+ * Additionally, each modal in the stack gets a vertical offset based on `stackIndex` value.
84
85
  */
85
86
  stackIndex?: number;
86
87
  /**
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import { type ReactNode } from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  interface PositionerProps {
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import React from 'react';
6
6
  interface ScrollContainerProps {
7
7
  /**
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import React from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  export interface ModalBodyProps {
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import { type ReactNode } from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  export interface ModalFooterProps {
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import React from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  export interface ModalHeaderProps {
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import { type ReactNode } from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  import { type Appearance } from './types';
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @jsxRuntime classic
3
+ * @jsx jsx
3
4
  */
4
- /** @jsx jsx */
5
5
  import { jsx } from '@emotion/react';
6
6
  import type { ModalDialogProps } from './types';
7
7
  export type { ModalDialogProps };
@@ -25,7 +25,6 @@ export interface ModalDialogProps {
25
25
  /**
26
26
  * Callback function which lets you allowlist nodes so they can be interacted with outside of the focus lock.
27
27
  * Return `true` if focus lock should handle element, `false` if not.
28
- * Works when `platform.design-system-team.multiple-modal-inappropriate-focus_z5u4j` feature flag is enabled.
29
28
  */
30
29
  focusLockAllowlist?: (element: HTMLElement) => boolean;
31
30
  /**
@@ -79,8 +78,10 @@ export interface ModalDialogProps {
79
78
  */
80
79
  isBlanketHidden?: boolean;
81
80
  /**
82
- * Number representing where in the stack of modals this modal sits.
83
- * This offsets the modal dialogs vertical position.
81
+ * The stackIndex is a reference to the position (index) of the calling dialog in a modal dialog stack.
82
+ * New modals added to the stack receive the highest stack index of 0. As more modals are added to the stack, their index is dynamically increased according to their new position.
83
+ * Don't alter the modal stack position using `stackIndex` in implementations of third-party libraries (e.g. AUI modal), it may lead to unpredictable bugs, especially if the third party library has its own focus lock.
84
+ * Additionally, each modal in the stack gets a vertical offset based on `stackIndex` value.
84
85
  */
85
86
  stackIndex?: number;
86
87
  /**
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/modal-dialog",
3
- "version": "12.14.5",
3
+ "version": "12.14.7",
4
4
  "description": "A modal dialog displays content that requires user interaction, in a layer above the page.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -35,14 +35,14 @@
35
35
  "@atlaskit/codemod-utils": "^4.2.0",
36
36
  "@atlaskit/ds-lib": "^2.3.0",
37
37
  "@atlaskit/focus-ring": "^1.5.0",
38
- "@atlaskit/icon": "^22.6.0",
38
+ "@atlaskit/icon": "^22.7.0",
39
39
  "@atlaskit/layering": "^0.3.0",
40
40
  "@atlaskit/motion": "^1.7.0",
41
41
  "@atlaskit/platform-feature-flags": "^0.3.0",
42
42
  "@atlaskit/portal": "^4.6.0",
43
43
  "@atlaskit/primitives": "^11.0.0",
44
44
  "@atlaskit/theme": "^12.11.0",
45
- "@atlaskit/tokens": "^1.53.0",
45
+ "@atlaskit/tokens": "^1.56.0",
46
46
  "@babel/runtime": "^7.0.0",
47
47
  "@emotion/react": "^11.7.1",
48
48
  "bind-event-listener": "^3.0.0",
@@ -68,7 +68,6 @@
68
68
  "@atlaskit/textfield": "^6.4.0",
69
69
  "@atlaskit/tooltip": "^18.5.0",
70
70
  "@atlaskit/visual-regression": "*",
71
- "@atlassian/feature-flags-test-utils": "*",
72
71
  "@testing-library/dom": "^10.1.0",
73
72
  "@testing-library/react": "^12.1.5",
74
73
  "@testing-library/react-hooks": "^8.0.1",
@@ -128,22 +127,12 @@
128
127
  "./modal-transition": "./src/modal-transition.tsx"
129
128
  },
130
129
  "platform-feature-flags": {
131
- "platform.design-system-team.layering_qmiw3": {
132
- "type": "boolean"
133
- },
134
130
  "platform.design-system-team.popup-select-close_8h15h": {
135
131
  "type": "boolean",
136
132
  "referenceOnly": "true"
137
133
  },
138
- "platform.design-system-team.multiple-modal-inappropriate-focus_z5u4j": {
139
- "type": "boolean"
140
- },
141
134
  "platform.design-system-team.iframe_gojiv": {
142
135
  "type": "boolean"
143
- },
144
- "platform.design-system-team.iframe-layering_p3eb8": {
145
- "type": "boolean",
146
- "referenceOnly": "true"
147
136
  }
148
137
  },
149
138
  "homepage": "https://atlassian.design/components/modal-dialog/"
@@ -1,5 +0,0 @@
1
- import { type ModalAttributes } from '../src/internal/context';
2
-
3
- export default function ModalAttributesFunction(props: ModalAttributes) {
4
- return null;
5
- }