@atlaskit/modal-dialog 14.18.1 → 14.18.3

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @atlaskit/modal-dialog
 
+## 14.18.3
+
+### Patch Changes
+
+- [`5a711f8d38b68`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5a711f8d38b68) -
+  Changed the motion uplift feature gate from `platform-dst-motion-uplift` to
+  `platform-dst-motion-uplift-modal`
+- Updated dependencies
+
+## 14.18.2
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 14.18.1
 
 ### Patch Changes

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

@@ -28,6 +28,7 @@ var _useOnMotionFinish3 = _interopRequireDefault(require("../hooks/use-on-motion
 var _element = require("../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/element");
 var _external = require("../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/external");
 var _textSelection = require("../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/text-selection");
+var _scrollContext = require("../scroll-context");
 var _width = require("../width");
 var _positioner = _interopRequireDefault(require("./positioner"));
 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); }
@@ -128,9 +129,9 @@ var ModalDialog = function ModalDialog(props) {
     isFullScreen: isFullScreen
   }, /*#__PURE__*/React.createElement(_context.ModalContext.Provider, {
     value: modalDialogContext
-  }, /*#__PURE__*/React.createElement(_context.ScrollContext.Provider, {
+  }, /*#__PURE__*/React.createElement(_scrollContext.ScrollContext.Provider, {
     value: shouldScrollInViewport
-  }, !UNSAFE_shouldDisableMotionUplift && (0, _platformFeatureFlags.fg)('platform-dst-motion-uplift') ? /*#__PURE__*/React.createElement(_motion.Motion, {
+  }, !UNSAFE_shouldDisableMotionUplift && (0, _platformFeatureFlags.fg)('platform-dst-motion-uplift-modal') ? /*#__PURE__*/React.createElement(_motion.Motion, {
     enteringAnimation: "var(--ds-modal-enter, 250ms cubic-bezier(0.4, 0, 0, 1) ScaleIn95to100)",
     exitingAnimation: "var(--ds-modal-exit, 200ms cubic-bezier(0.6, 0, 0.8, 0.6) ScaleOut100to95)",
     onFinish: onMotionFinish,

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

@@ -152,7 +152,7 @@ var InternalModalWrapper = function InternalModalWrapper(props) {
     isDisabled: false
   }, /*#__PURE__*/React.createElement(_portal.default, {
     zIndex: _constants.layers.modal()
-  }, !UNSAFE_shouldDisableMotionUplift && (0, _platformFeatureFlags.fg)('platform-dst-motion-uplift') ? /*#__PURE__*/React.createElement(_motion.Motion, {
+  }, !UNSAFE_shouldDisableMotionUplift && (0, _platformFeatureFlags.fg)('platform-dst-motion-uplift-modal') ? /*#__PURE__*/React.createElement(_motion.Motion, {
     enteringAnimation: "var(--ds-blanket-enter, 250ms cubic-bezier(0.4, 0, 0, 1) FadeIn0to100)",
     exitingAnimation: "var(--ds-blanket-exit, 200ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0)"
   }, /*#__PURE__*/React.createElement("div", {

package/dist/cjs/internal/context.js

@@ -3,8 +3,14 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ScrollContext = exports.ModalContext = void 0;
+exports.ModalContext = void 0;
+Object.defineProperty(exports, "ScrollContext", {
+  enumerable: true,
+  get: function get() {
+    return _scrollContext.ScrollContext;
+  }
+});
 var _react = require("react");
+var _scrollContext = require("./scroll-context");
 /* eslint-disable @repo/internal/react/require-jsdoc */
-var ModalContext = exports.ModalContext = /*#__PURE__*/(0, _react.createContext)(null);
-var ScrollContext = exports.ScrollContext = /*#__PURE__*/(0, _react.createContext)(null);
+var ModalContext = exports.ModalContext = /*#__PURE__*/(0, _react.createContext)(null);

package/dist/cjs/internal/hooks/use-scroll.js

@@ -5,13 +5,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = useScroll;
 var _react = require("react");
-var _context = require("../context");
+var _scrollContext = require("../scroll-context");
 /**
  * This returns whether or not scrolling is allowed based on the existing
  * scrolling context.
  */
 function useScroll() {
-  var shouldScrollInViewport = (0, _react.useContext)(_context.ScrollContext);
+  var shouldScrollInViewport = (0, _react.useContext)(_scrollContext.ScrollContext);
   if (shouldScrollInViewport == null) {
     throw Error('@atlaskit/modal-dialog: Scroll context unavailable – this component needs to be a child of ModalDialog.');
   }

package/dist/cjs/internal/scroll-context.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ScrollContext = void 0;
+var _react = require("react");
+// TODO: Fill in the component {description} and ensure links point to the correct {packageName} location.
+// Remove links that the component does not have (such as usage). If there are no links remove them all.
+/**
+ * __Scroll context__
+ *
+ * A scroll context {description}.
+ *
+ * - [Examples](https://atlassian.design/components/{packageName}/examples)
+ * - [Code](https://atlassian.design/components/{packageName}/code)
+ * - [Usage](https://atlassian.design/components/{packageName}/usage)
+ */
+var ScrollContext = exports.ScrollContext = /*#__PURE__*/(0, _react.createContext)(null);

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

@@ -13,11 +13,12 @@ import { Motion } from '@atlaskit/motion';
 import FadeIn from '@atlaskit/motion/fade-in';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';
-import { ModalContext, ScrollContext } from '../context';
+import { ModalContext } from '../context';
 import useOnMotionFinish from '../hooks/use-on-motion-finish';
 import { disableDraggingToCrossOriginIFramesForElement } from '../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/element';
 import { disableDraggingToCrossOriginIFramesForExternal } from '../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/external';
 import { disableDraggingToCrossOriginIFramesForTextSelection } from '../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/text-selection';
+import { ScrollContext } from '../scroll-context';
 import { width } from '../width';
 import Positioner from './positioner';
 const dialogWidth = input => {
@@ -113,7 +114,7 @@ const ModalDialog = props => {
     value: modalDialogContext
   }, /*#__PURE__*/React.createElement(ScrollContext.Provider, {
     value: shouldScrollInViewport
-  }, !UNSAFE_shouldDisableMotionUplift && fg('platform-dst-motion-uplift') ? /*#__PURE__*/React.createElement(Motion, {
+  }, !UNSAFE_shouldDisableMotionUplift && fg('platform-dst-motion-uplift-modal') ? /*#__PURE__*/React.createElement(Motion, {
     enteringAnimation: "var(--ds-modal-enter, 250ms cubic-bezier(0.4, 0, 0, 1) ScaleIn95to100)",
     exitingAnimation: "var(--ds-modal-exit, 200ms cubic-bezier(0.6, 0, 0.8, 0.6) ScaleOut100to95)",
     onFinish: onMotionFinish,

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

@@ -136,7 +136,7 @@ const InternalModalWrapper = props => {
     isDisabled: false
   }, /*#__PURE__*/React.createElement(Portal, {
     zIndex: layers.modal()
-  }, !UNSAFE_shouldDisableMotionUplift && fg('platform-dst-motion-uplift') ? /*#__PURE__*/React.createElement(Motion, {
+  }, !UNSAFE_shouldDisableMotionUplift && fg('platform-dst-motion-uplift-modal') ? /*#__PURE__*/React.createElement(Motion, {
     enteringAnimation: "var(--ds-blanket-enter, 250ms cubic-bezier(0.4, 0, 0, 1) FadeIn0to100)",
     exitingAnimation: "var(--ds-blanket-exit, 200ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0)"
   }, /*#__PURE__*/React.createElement("div", {

package/dist/es2019/internal/context.js

@@ -1,4 +1,4 @@
 import { createContext } from 'react';
 /* eslint-disable @repo/internal/react/require-jsdoc */
 export const ModalContext = /*#__PURE__*/createContext(null);
-export const ScrollContext = /*#__PURE__*/createContext(null);
+export { ScrollContext } from './scroll-context';

package/dist/es2019/internal/hooks/use-scroll.js

@@ -1,5 +1,5 @@
 import { useContext } from 'react';
-import { ScrollContext } from '../context';
+import { ScrollContext } from '../scroll-context';
 
 /**
  * This returns whether or not scrolling is allowed based on the existing

package/dist/es2019/internal/scroll-context.js

@@ -0,0 +1,14 @@
+import { createContext } from 'react';
+
+// TODO: Fill in the component {description} and ensure links point to the correct {packageName} location.
+// Remove links that the component does not have (such as usage). If there are no links remove them all.
+/**
+ * __Scroll context__
+ *
+ * A scroll context {description}.
+ *
+ * - [Examples](https://atlassian.design/components/{packageName}/examples)
+ * - [Code](https://atlassian.design/components/{packageName}/code)
+ * - [Usage](https://atlassian.design/components/{packageName}/usage)
+ */
+export const ScrollContext = /*#__PURE__*/createContext(null);

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

@@ -15,11 +15,12 @@ import { Motion } from '@atlaskit/motion';
 import FadeIn from '@atlaskit/motion/fade-in';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';
-import { ModalContext, ScrollContext } from '../context';
+import { ModalContext } from '../context';
 import useOnMotionFinish from '../hooks/use-on-motion-finish';
 import { disableDraggingToCrossOriginIFramesForElement } from '../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/element';
 import { disableDraggingToCrossOriginIFramesForExternal } from '../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/external';
 import { disableDraggingToCrossOriginIFramesForTextSelection } from '../pragmatic-drag-and-drop/disable-dragging-to-cross-origin-iframes/text-selection';
+import { ScrollContext } from '../scroll-context';
 import { width } from '../width';
 import Positioner from './positioner';
 var dialogWidth = function dialogWidth(input) {
@@ -121,7 +122,7 @@ var ModalDialog = function ModalDialog(props) {
     value: modalDialogContext
   }, /*#__PURE__*/React.createElement(ScrollContext.Provider, {
     value: shouldScrollInViewport
-  }, !UNSAFE_shouldDisableMotionUplift && fg('platform-dst-motion-uplift') ? /*#__PURE__*/React.createElement(Motion, {
+  }, !UNSAFE_shouldDisableMotionUplift && fg('platform-dst-motion-uplift-modal') ? /*#__PURE__*/React.createElement(Motion, {
     enteringAnimation: "var(--ds-modal-enter, 250ms cubic-bezier(0.4, 0, 0, 1) ScaleIn95to100)",
     exitingAnimation: "var(--ds-modal-exit, 200ms cubic-bezier(0.6, 0, 0.8, 0.6) ScaleOut100to95)",
     onFinish: onMotionFinish,

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

@@ -143,7 +143,7 @@ var InternalModalWrapper = function InternalModalWrapper(props) {
     isDisabled: false
   }, /*#__PURE__*/React.createElement(Portal, {
     zIndex: layers.modal()
-  }, !UNSAFE_shouldDisableMotionUplift && fg('platform-dst-motion-uplift') ? /*#__PURE__*/React.createElement(Motion, {
+  }, !UNSAFE_shouldDisableMotionUplift && fg('platform-dst-motion-uplift-modal') ? /*#__PURE__*/React.createElement(Motion, {
     enteringAnimation: "var(--ds-blanket-enter, 250ms cubic-bezier(0.4, 0, 0, 1) FadeIn0to100)",
     exitingAnimation: "var(--ds-blanket-exit, 200ms cubic-bezier(0.6, 0, 0.8, 0.6) FadeOut100to0)"
   }, /*#__PURE__*/React.createElement("div", {

package/dist/esm/internal/context.js

@@ -1,4 +1,4 @@
 import { createContext } from 'react';
 /* eslint-disable @repo/internal/react/require-jsdoc */
 export var ModalContext = /*#__PURE__*/createContext(null);
-export var ScrollContext = /*#__PURE__*/createContext(null);
+export { ScrollContext } from './scroll-context';

package/dist/esm/internal/hooks/use-scroll.js

@@ -1,5 +1,5 @@
 import { useContext } from 'react';
-import { ScrollContext } from '../context';
+import { ScrollContext } from '../scroll-context';
 
 /**
  * This returns whether or not scrolling is allowed based on the existing

package/dist/esm/internal/scroll-context.js

@@ -0,0 +1,14 @@
+import { createContext } from 'react';
+
+// TODO: Fill in the component {description} and ensure links point to the correct {packageName} location.
+// Remove links that the component does not have (such as usage). If there are no links remove them all.
+/**
+ * __Scroll context__
+ *
+ * A scroll context {description}.
+ *
+ * - [Examples](https://atlassian.design/components/{packageName}/examples)
+ * - [Code](https://atlassian.design/components/{packageName}/code)
+ * - [Usage](https://atlassian.design/components/{packageName}/usage)
+ */
+export var ScrollContext = /*#__PURE__*/createContext(null);

package/dist/types/internal/context.d.ts

@@ -27,4 +27,4 @@ export type ModalAttributes = {
     isFullScreen: boolean;
 };
 export declare const ModalContext: Context<ModalAttributes | null>;
-export declare const ScrollContext: Context<boolean | null>;
+export { ScrollContext } from './scroll-context';

package/dist/types/internal/scroll-context.d.ts

@@ -0,0 +1,11 @@
+import { type Context } from 'react';
+/**
+ * __Scroll context__
+ *
+ * A scroll context {description}.
+ *
+ * - [Examples](https://atlassian.design/components/{packageName}/examples)
+ * - [Code](https://atlassian.design/components/{packageName}/code)
+ * - [Usage](https://atlassian.design/components/{packageName}/usage)
+ */
+export declare const ScrollContext: Context<boolean | null>;

package/dist/types-ts4.5/internal/context.d.ts

@@ -27,4 +27,4 @@ export type ModalAttributes = {
     isFullScreen: boolean;
 };
 export declare const ModalContext: Context<ModalAttributes | null>;
-export declare const ScrollContext: Context<boolean | null>;
+export { ScrollContext } from './scroll-context';

package/dist/types-ts4.5/internal/scroll-context.d.ts

@@ -0,0 +1,11 @@
+import { type Context } from 'react';
+/**
+ * __Scroll context__
+ *
+ * A scroll context {description}.
+ *
+ * - [Examples](https://atlassian.design/components/{packageName}/examples)
+ * - [Code](https://atlassian.design/components/{packageName}/code)
+ * - [Usage](https://atlassian.design/components/{packageName}/usage)
+ */
+export declare const ScrollContext: Context<boolean | null>;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/modal-dialog",
-	"version": "14.18.1",
+	"version": "14.18.3",
 	"description": "A modal dialog displays content that requires user interaction, in a layer above the page.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -41,12 +41,12 @@
 		"@atlaskit/ds-lib": "^7.0.0",
 		"@atlaskit/icon": "^34.3.0",
 		"@atlaskit/layering": "^3.7.0",
-		"@atlaskit/motion": "^5.7.0",
+		"@atlaskit/motion": "^6.2.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
-		"@atlaskit/portal": "^5.4.0",
+		"@atlaskit/portal": "^5.5.0",
 		"@atlaskit/pragmatic-drag-and-drop": "^1.8.0",
 		"@atlaskit/primitives": "^19.0.0",
-		"@atlaskit/theme": "^23.1.0",
+		"@atlaskit/theme": "^23.2.0",
 		"@atlaskit/tokens": "^13.0.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.20.0",
@@ -62,26 +62,26 @@
 		"@af/accessibility-testing": "workspace:^",
 		"@af/integration-testing": "workspace:^",
 		"@af/visual-regression": "workspace:^",
-		"@atlaskit/avatar": "^25.13.0",
+		"@atlaskit/avatar": "^25.14.0",
 		"@atlaskit/avatar-group": "^12.7.0",
-		"@atlaskit/banner": "^14.0.0",
+		"@atlaskit/banner": "^14.1.0",
 		"@atlaskit/breadcrumbs": "^16.1.0",
 		"@atlaskit/checkbox": "^17.3.0",
-		"@atlaskit/code": "^17.4.0",
-		"@atlaskit/datetime-picker": "^17.7.0",
+		"@atlaskit/code": "^17.5.0",
+		"@atlaskit/datetime-picker": "^17.8.0",
 		"@atlaskit/docs": "^11.8.0",
 		"@atlaskit/dropdown-menu": "^16.8.0",
-		"@atlaskit/flag": "^17.9.0",
+		"@atlaskit/flag": "^17.11.0",
 		"@atlaskit/form": "^15.5.0",
 		"@atlaskit/heading": "^5.4.0",
 		"@atlaskit/link": "^3.4.0",
-		"@atlaskit/popup": "^4.16.0",
-		"@atlaskit/radio": "^8.5.0",
+		"@atlaskit/popup": "^4.17.0",
+		"@atlaskit/radio": "^8.6.0",
 		"@atlaskit/section-message": "^8.12.0",
 		"@atlaskit/select": "^21.10.0",
-		"@atlaskit/spotlight": "^0.12.0",
+		"@atlaskit/spotlight": "^0.13.0",
 		"@atlaskit/textfield": "^8.3.0",
-		"@atlaskit/tooltip": "^21.2.0",
+		"@atlaskit/tooltip": "^22.0.0",
 		"@atlassian/feature-flags-test-utils": "^1.0.0",
 		"@atlassian/react-compiler-gating": "workspace:^",
 		"@atlassian/ssr-tests": "workspace:^",
@@ -138,7 +138,7 @@
 		"platform-dst-shape-theme-default": {
 			"type": "boolean"
 		},
-		"platform-dst-motion-uplift": {
+		"platform-dst-motion-uplift-modal": {
 			"type": "boolean"
 		}
 	},

package/offerings.json

@@ -1,37 +0,0 @@
-[
-	{
-		"name": "Modal",
-		"package": "@atlaskit/modal-dialog",
-		"import": {
-			"name": "Modal",
-			"package": "@atlaskit/modal-dialog",
-			"type": "default"
-		},
-		"keywords": ["modal", "dialog", "popup", "overlay", "focused", "interaction", "layer"],
-		"categories": ["overlay"],
-		"shortDescription": "A modal dialog component for important content.",
-		"status": "general-availability",
-		"accessibilityGuidelines": [
-			"Ensure modal content is announced by screen readers",
-			"Provide appropriate focus management",
-			"Use clear, descriptive modal titles",
-			"Ensure keyboard navigation and escape key support",
-			"Maintain focus within modal when open"
-		],
-		"usageGuidelines": [
-			"Use for important content that requires user attention",
-			"Keep modal content focused on a single task",
-			"Provide clear action buttons",
-			"Use appropriate modal sizes for content",
-			"Consider mobile responsiveness"
-		],
-		"contentGuidelines": [
-			"Use clear, descriptive titles",
-			"Keep content focused on a single task or message",
-			"Include clear action buttons",
-			"Use sentence case for all text",
-			"Provide clear next steps"
-		],
-		"examples": ["./examples/constellation/modal-default.tsx"]
-	}
-]