@atlaskit/modal-dialog 16.1.8 → 16.2.0

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 (16) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/dist/cjs/internal/components/modal-dialog.js +0 -12
  3. package/dist/cjs/internal/components/modal-wrapper.js +4 -3
  4. package/dist/cjs/internal/context.js +0 -7
  5. package/dist/es2019/internal/components/modal-dialog.js +1 -3
  6. package/dist/es2019/internal/components/modal-wrapper.js +5 -4
  7. package/dist/es2019/internal/context.js +1 -2
  8. package/dist/esm/internal/components/modal-dialog.js +1 -3
  9. package/dist/esm/internal/components/modal-wrapper.js +5 -4
  10. package/dist/esm/internal/context.js +1 -2
  11. package/dist/types/internal/components/dialog-height.d.ts +1 -1
  12. package/dist/types/internal/components/dialog-width.d.ts +1 -1
  13. package/dist/types/internal/components/modal-dialog.d.ts +0 -2
  14. package/dist/types/internal/context.d.ts +0 -1
  15. package/dist/types/modal-transition.d.ts +1 -1
  16. package/package.json +12 -12
package/CHANGELOG.md CHANGED
@@ -1,5 +1,16 @@
1
1
  # @atlaskit/modal-dialog
2
2
 
3
+ ## 16.2.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`3f6f3bd7da074`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3f6f3bd7da074) -
8
+ Updates usage of the Top Layer primitives to consume changes to animation API.
9
+
10
+ ### Patch Changes
11
+
12
+ - Updated dependencies
13
+
3
14
  ## 16.1.8
4
15
 
5
16
  ### Patch Changes
package/dist/cjs/internal/components/modal-dialog.js CHANGED
@@ -7,18 +7,6 @@ Object.defineProperty(exports, "__esModule", {
7
7
  value: true
8
8
  });
9
9
  exports.default = void 0;
10
- Object.defineProperty(exports, "dialogHeight", {
11
- enumerable: true,
12
- get: function get() {
13
- return _dialogHeight.dialogHeight;
14
- }
15
- });
16
- Object.defineProperty(exports, "dialogWidth", {
17
- enumerable: true,
18
- get: function get() {
19
- return _dialogWidth.dialogWidth;
20
- }
21
- });
22
10
  require("./modal-dialog.compiled.css");
23
11
  var _react = _interopRequireWildcard(require("react"));
24
12
  var React = _react;
package/dist/cjs/internal/components/modal-wrapper.js CHANGED
@@ -37,6 +37,7 @@ var _usePreventProgrammaticScroll = _interopRequireDefault(require("../hooks/use
37
37
  var _element = require("../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/element");
38
38
  var _external = require("../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/external");
39
39
  var _textSelection = require("../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/text-selection");
40
+ var _scrollContext = require("../scroll-context");
40
41
  var _dialogHeight = require("./dialog-height");
41
42
  var _dialogWidth = require("./dialog-width");
42
43
  var _modalDialog = _interopRequireDefault(require("./modal-dialog"));
@@ -112,7 +113,7 @@ var InternalModalWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (props,
112
113
  action: 'closed',
113
114
  componentName: 'modalDialog',
114
115
  packageName: "@atlaskit/modal-dialog",
115
- packageVersion: "16.1.7"
116
+ packageVersion: "16.1.8"
116
117
  });
117
118
  var onBlanketClicked = (0, _react.useCallback)(function (e) {
118
119
  if (shouldCloseOnOverlayClick) {
@@ -315,7 +316,7 @@ var InternalModalWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (props,
315
316
  id: dialogId,
316
317
  onClose: onDialogClose,
317
318
  onExitFinish: handleDialogExitFinish,
318
- animate: !isFullScreen,
319
+ shouldAnimate: !isFullScreen,
319
320
  isOpen: !isExiting,
320
321
  shouldHideBackdrop: stackIndex > 0 || Boolean(isBlanketHidden)
321
322
  // Dialog requires at least one of `label` or `labelledBy` (string, not undefined).
@@ -339,7 +340,7 @@ var InternalModalWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (props,
339
340
  className: (0, _runtime.ax)([topLayerStyles.content, !isFullScreen && topLayerStyles.borderRadius, !isFullScreen && (0, _platformFeatureFlags.fg)('platform-dst-shape-theme-default') && topLayerStyles.borderRadiusT26, !isFullScreen && !shouldScrollInViewport && "_bolhzwhf", !isFullScreen && shouldScrollInViewport && "_1tke1kxc _c71lglyw"])
340
341
  }, /*#__PURE__*/React.createElement(_context.ModalContext.Provider, {
341
342
  value: modalDialogContext
342
- }, /*#__PURE__*/React.createElement(_context.ScrollContext.Provider, {
343
+ }, /*#__PURE__*/React.createElement(_scrollContext.ScrollContext.Provider, {
343
344
  value: shouldScrollInViewport
344
345
  }, children))));
345
346
  }
package/dist/cjs/internal/context.js CHANGED
@@ -4,13 +4,6 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.ModalContext = void 0;
7
- Object.defineProperty(exports, "ScrollContext", {
8
- enumerable: true,
9
- get: function get() {
10
- return _scrollContext.ScrollContext;
11
- }
12
- });
13
7
  var _react = require("react");
14
- var _scrollContext = require("./scroll-context");
15
8
  /* eslint-disable @repo/internal/react/require-jsdoc */
16
9
  var ModalContext = exports.ModalContext = /*#__PURE__*/(0, _react.createContext)(null);
package/dist/es2019/internal/components/modal-dialog.js CHANGED
@@ -152,6 +152,4 @@ const ModalDialog = /*#__PURE__*/forwardRef((props, ref) => {
152
152
  });
153
153
 
154
154
  // eslint-disable-next-line @repo/internal/react/require-jsdoc, @atlaskit/volt-strict-mode/no-multiple-exports
155
- export default ModalDialog;
156
- export { dialogWidth } from './dialog-width';
157
- export { dialogHeight } from './dialog-height';
155
+ export default ModalDialog;
package/dist/es2019/internal/components/modal-wrapper.js CHANGED
@@ -22,15 +22,16 @@ import { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';
22
22
  import { layers } from '@atlaskit/theme/constants';
23
23
  import { createCloseEvent, Dialog } from '@atlaskit/top-layer/dialog';
24
24
  import { DialogScrollLock } from '@atlaskit/top-layer/dialog-scroll-lock';
25
- import { ModalContext, ScrollContext } from '../context';
25
+ import { ModalContext } from '../context';
26
26
  import useModalStack from '../hooks/use-modal-stack';
27
27
  import usePreventProgrammaticScroll from '../hooks/use-prevent-programmatic-scroll';
28
28
  import { disableDraggingToCrossOriginIFramesForElement } from '../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/element';
29
29
  import { disableDraggingToCrossOriginIFramesForExternal } from '../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/external';
30
30
  import { disableDraggingToCrossOriginIFramesForTextSelection } from '../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/text-selection';
31
+ import { ScrollContext } from '../scroll-context';
31
32
  import { dialogHeight } from './dialog-height';
32
33
  import { dialogWidth as getDialogWidth } from './dialog-width';
33
- import ModalDialog from './modal-dialog';
34
+ import { default as ModalDialog } from './modal-dialog';
34
35
  const fillScreenStyles = null;
35
36
 
36
37
  // Visual styles for modal content inside native <dialog>.
@@ -98,7 +99,7 @@ const InternalModalWrapper = /*#__PURE__*/forwardRef((props, ref) => {
98
99
  action: 'closed',
99
100
  componentName: 'modalDialog',
100
101
  packageName: "@atlaskit/modal-dialog",
101
- packageVersion: "16.1.7"
102
+ packageVersion: "16.1.8"
102
103
  });
103
104
  const onBlanketClicked = useCallback(e => {
104
105
  if (shouldCloseOnOverlayClick) {
@@ -300,7 +301,7 @@ const InternalModalWrapper = /*#__PURE__*/forwardRef((props, ref) => {
300
301
  id: dialogId,
301
302
  onClose: onDialogClose,
302
303
  onExitFinish: handleDialogExitFinish,
303
- animate: !isFullScreen,
304
+ shouldAnimate: !isFullScreen,
304
305
  isOpen: !isExiting,
305
306
  shouldHideBackdrop: stackIndex > 0 || Boolean(isBlanketHidden)
306
307
  // Dialog requires at least one of `label` or `labelledBy` (string, not undefined).
package/dist/es2019/internal/context.js CHANGED
@@ -1,4 +1,3 @@
1
1
  import { createContext } from 'react';
2
2
  /* eslint-disable @repo/internal/react/require-jsdoc */
3
- export const ModalContext = /*#__PURE__*/createContext(null);
4
- export { ScrollContext } from './scroll-context';
3
+ export const ModalContext = /*#__PURE__*/createContext(null);
package/dist/esm/internal/components/modal-dialog.js CHANGED
@@ -162,6 +162,4 @@ var ModalDialog = /*#__PURE__*/forwardRef(function (props, ref) {
162
162
  });
163
163
 
164
164
  // eslint-disable-next-line @repo/internal/react/require-jsdoc, @atlaskit/volt-strict-mode/no-multiple-exports
165
- export default ModalDialog;
166
- export { dialogWidth } from './dialog-width';
167
- export { dialogHeight } from './dialog-height';
165
+ export default ModalDialog;
package/dist/esm/internal/components/modal-wrapper.js CHANGED
@@ -23,15 +23,16 @@ import { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';
23
23
  import { layers } from '@atlaskit/theme/constants';
24
24
  import { createCloseEvent, Dialog } from '@atlaskit/top-layer/dialog';
25
25
  import { DialogScrollLock } from '@atlaskit/top-layer/dialog-scroll-lock';
26
- import { ModalContext, ScrollContext } from '../context';
26
+ import { ModalContext } from '../context';
27
27
  import useModalStack from '../hooks/use-modal-stack';
28
28
  import usePreventProgrammaticScroll from '../hooks/use-prevent-programmatic-scroll';
29
29
  import { disableDraggingToCrossOriginIFramesForElement } from '../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/element';
30
30
  import { disableDraggingToCrossOriginIFramesForExternal } from '../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/external';
31
31
  import { disableDraggingToCrossOriginIFramesForTextSelection } from '../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/text-selection';
32
+ import { ScrollContext } from '../scroll-context';
32
33
  import { dialogHeight } from './dialog-height';
33
34
  import { dialogWidth as getDialogWidth } from './dialog-width';
34
- import ModalDialog from './modal-dialog';
35
+ import { default as ModalDialog } from './modal-dialog';
35
36
  var fillScreenStyles = null;
36
37
 
37
38
  // Visual styles for modal content inside native <dialog>.
@@ -103,7 +104,7 @@ var InternalModalWrapper = /*#__PURE__*/forwardRef(function (props, ref) {
103
104
  action: 'closed',
104
105
  componentName: 'modalDialog',
105
106
  packageName: "@atlaskit/modal-dialog",
106
- packageVersion: "16.1.7"
107
+ packageVersion: "16.1.8"
107
108
  });
108
109
  var onBlanketClicked = useCallback(function (e) {
109
110
  if (shouldCloseOnOverlayClick) {
@@ -306,7 +307,7 @@ var InternalModalWrapper = /*#__PURE__*/forwardRef(function (props, ref) {
306
307
  id: dialogId,
307
308
  onClose: onDialogClose,
308
309
  onExitFinish: handleDialogExitFinish,
309
- animate: !isFullScreen,
310
+ shouldAnimate: !isFullScreen,
310
311
  isOpen: !isExiting,
311
312
  shouldHideBackdrop: stackIndex > 0 || Boolean(isBlanketHidden)
312
313
  // Dialog requires at least one of `label` or `labelledBy` (string, not undefined).
package/dist/esm/internal/context.js CHANGED
@@ -1,4 +1,3 @@
1
1
  import { createContext } from 'react';
2
2
  /* eslint-disable @repo/internal/react/require-jsdoc */
3
- export var ModalContext = /*#__PURE__*/createContext(null);
4
- export { ScrollContext } from './scroll-context';
3
+ export var ModalContext = /*#__PURE__*/createContext(null);
package/dist/types/internal/components/dialog-height.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  import type { ModalDialogProps } from '../../types';
2
- export declare const dialogHeight: (input?: ModalDialogProps["height"]) => string;
2
+ export declare const dialogHeight: (input?: ModalDialogProps['height']) => string;
package/dist/types/internal/components/dialog-width.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  import type { ModalDialogProps } from '../../types';
2
- export declare const dialogWidth: (input?: ModalDialogProps["width"]) => string;
2
+ export declare const dialogWidth: (input?: ModalDialogProps['width']) => string;
package/dist/types/internal/components/modal-dialog.d.ts CHANGED
@@ -5,5 +5,3 @@
5
5
  import type { InternalModalDialogProps } from '../types';
6
6
  declare const ModalDialog: React.ForwardRefExoticComponent<React.PropsWithoutRef<InternalModalDialogProps> & React.RefAttributes<HTMLElement>>;
7
7
  export default ModalDialog;
8
- export { dialogWidth } from './dialog-width';
9
- export { dialogHeight } from './dialog-height';
package/dist/types/internal/context.d.ts CHANGED
@@ -27,4 +27,3 @@ export type ModalAttributes = {
27
27
  isFullScreen: boolean;
28
28
  };
29
29
  export declare const ModalContext: Context<ModalAttributes | null>;
30
- export { ScrollContext } from './scroll-context';
package/dist/types/modal-transition.d.ts CHANGED
@@ -9,5 +9,5 @@ import { type ExitingPersistenceProps } from '@atlaskit/motion/exiting-persisten
9
9
  * - [Code](https://atlassian.design/components/modal-dialog/code)
10
10
  * - [Usage](https://atlassian.design/components/modal-dialog/usage)
11
11
  */
12
- declare const ModalTransition: (props: Pick<ExitingPersistenceProps, "children">) => React.JSX.Element;
12
+ declare const ModalTransition: (props: Pick<ExitingPersistenceProps, 'children'>) => React.JSX.Element;
13
13
  export default ModalTransition;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/modal-dialog",
3
- "version": "16.1.8",
3
+ "version": "16.2.0",
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/"
@@ -39,17 +39,17 @@
39
39
  "@atlaskit/button": "^24.3.0",
40
40
  "@atlaskit/css": "^1.0.0",
41
41
  "@atlaskit/ds-lib": "^8.0.0",
42
- "@atlaskit/icon": "^37.1.0",
42
+ "@atlaskit/icon": "^37.2.0",
43
43
  "@atlaskit/layering": "^5.0.0",
44
44
  "@atlaskit/motion": "^7.5.0",
45
45
  "@atlaskit/platform-feature-flags": "^2.1.0",
46
46
  "@atlaskit/portal": "^6.1.0",
47
47
  "@atlaskit/pragmatic-drag-and-drop": "^2.0.0",
48
- "@atlaskit/primitives": "^22.1.0",
48
+ "@atlaskit/primitives": "^22.2.0",
49
49
  "@atlaskit/react-compiler-gating": "^0.2.0",
50
50
  "@atlaskit/theme": "^26.1.0",
51
- "@atlaskit/tokens": "^16.2.0",
52
- "@atlaskit/top-layer": "^1.10.0",
51
+ "@atlaskit/tokens": "^16.3.0",
52
+ "@atlaskit/top-layer": "^2.0.0",
53
53
  "@babel/runtime": "^7.0.0",
54
54
  "@compiled/react": "^1.0.0",
55
55
  "bind-event-listener": "^3.0.0",
@@ -64,26 +64,26 @@
64
64
  "@af/accessibility-testing": "workspace:^",
65
65
  "@af/integration-testing": "workspace:^",
66
66
  "@af/visual-regression": "workspace:^",
67
- "@atlaskit/avatar": "^26.2.0",
68
- "@atlaskit/avatar-group": "^13.1.0",
67
+ "@atlaskit/avatar": "^26.3.0",
68
+ "@atlaskit/avatar-group": "^13.2.0",
69
69
  "@atlaskit/banner": "^15.1.0",
70
70
  "@atlaskit/breadcrumbs": "^17.5.0",
71
71
  "@atlaskit/checkbox": "^18.2.0",
72
72
  "@atlaskit/code": "^18.2.0",
73
- "@atlaskit/datetime-picker": "^18.1.0",
73
+ "@atlaskit/datetime-picker": "^18.2.0",
74
74
  "@atlaskit/docs": "^12.1.0",
75
- "@atlaskit/dropdown-menu": "^17.1.0",
75
+ "@atlaskit/dropdown-menu": "^17.2.0",
76
76
  "@atlaskit/flag": "^18.2.0",
77
77
  "@atlaskit/form": "^16.1.0",
78
78
  "@atlaskit/heading": "^6.2.0",
79
79
  "@atlaskit/link": "^4.3.0",
80
- "@atlaskit/popup": "^5.1.0",
80
+ "@atlaskit/popup": "^5.2.0",
81
81
  "@atlaskit/radio": "^9.1.0",
82
82
  "@atlaskit/section-message": "^9.2.0",
83
- "@atlaskit/select": "^22.5.0",
83
+ "@atlaskit/select": "^22.6.0",
84
84
  "@atlaskit/spotlight": "^3.0.0",
85
85
  "@atlaskit/textfield": "^9.1.0",
86
- "@atlaskit/tooltip": "^23.1.0",
86
+ "@atlaskit/tooltip": "^23.2.0",
87
87
  "@atlassian/feature-flags-test-utils": "^1.2.0",
88
88
  "@atlassian/ssr-tests": "workspace:^",
89
89
  "@atlassian/structured-docs-types": "workspace:^",