@atlaskit/editor-extension-dropbox 0.2.19 → 0.2.23

package/CHANGELOG.md

@@ -1,5 +1,30 @@
 # @atlaskit/editor-extension-dropbox
 
+## 0.2.23
+
+### Patch Changes
+
+- Updated dependencies
+
+## 0.2.22
+
+### Patch Changes
+
+- Updated dependencies
+
+## 0.2.21
+
+### Patch Changes
+
+- Updated dependencies
+
+## 0.2.20
+
+### Patch Changes
+
+- [`56129bdfc79`](https://bitbucket.org/atlassian/atlassian-frontend/commits/56129bdfc79) - Upgrade to the latest version of @atlaskit/modal-dialog.
+- Updated dependencies
+
 ## 0.2.19
 
 ### Patch Changes

package/dist/cjs/constants.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.DROPBOX_IFRAME_NAME = exports.POPUP_MOUNTPOINT = void 0;
+exports.POPUP_MOUNTPOINT = exports.DROPBOX_IFRAME_NAME = void 0;
 var POPUP_MOUNTPOINT = 'twp-dropbox-popup-mount-point';
 exports.POPUP_MOUNTPOINT = POPUP_MOUNTPOINT;
 var DROPBOX_IFRAME_NAME = 'twp-dropboxjs-iframe';

package/dist/cjs/modal.js

@@ -92,13 +92,17 @@ var headingStyle = {
   marginTop: '8px'
 };
 
-var Header = function Header(_ref) {
-  var onClose = _ref.onClose;
+var Header = function Header() {
+  var _useModal = (0, _modalDialog.useModal)(),
+      onClose = _useModal.onClose,
+      titleId = _useModal.titleId;
+
   return (0, _core.jsx)("div", {
     css: bottomShadow
   }, (0, _core.jsx)("div", {
     css: spacingDivStyle
   }), (0, _core.jsx)("h5", {
+    id: titleId,
     css: headingStyle
   }, "Dropbox"), (0, _core.jsx)("div", null, (0, _core.jsx)(_customThemeButton.default, {
     appearance: "subtle",
@@ -109,15 +113,10 @@ var Header = function Header(_ref) {
   })));
 };
 
-var components = {
-  Body: ModalBody,
-  Header: Header
-};
-
-var Modal = function Modal(_ref2) {
-  var _onClose = _ref2.onClose,
-      TEST_ONLY_src = _ref2.TEST_ONLY_src,
-      showModal = _ref2.showModal;
+var Modal = function Modal(_ref) {
+  var _onClose = _ref.onClose,
+      TEST_ONLY_src = _ref.TEST_ONLY_src,
+      showModal = _ref.showModal;
 
   var _useState = (0, _react.useState)(true),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -131,13 +130,12 @@ var Modal = function Modal(_ref2) {
   return (0, _core.jsx)(_modalDialog.ModalTransition, null, isOpen && (0, _core.jsx)(_modalDialog.default, {
     height: "100%",
     width: "large",
-    components: components,
     onClose: function onClose() {
       setIsOpen(false);
 
       _onClose();
     }
-  }, TEST_ONLY_src ? (0, _core.jsx)("iframe", {
+  }, (0, _core.jsx)(Header, null), (0, _core.jsx)(_modalDialog.ModalBody, null, (0, _core.jsx)(ModalBody, null, TEST_ONLY_src ? (0, _core.jsx)("iframe", {
     css: iframeStyle,
     name: _constants2.DROPBOX_IFRAME_NAME,
     frameBorder: 0,
@@ -146,7 +144,7 @@ var Modal = function Modal(_ref2) {
     css: iframeStyle,
     name: _constants2.DROPBOX_IFRAME_NAME,
     frameBorder: 0
-  })));
+  })))));
 };
 
 var _default = Modal;

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-extension-dropbox",
-	"version": "0.2.19",
+	"version": "0.2.23",
 	"sideEffects": false
 }

package/dist/es2019/modal.js

@@ -2,7 +2,7 @@
 import React, { useState } from 'react';
 import chromatism from 'chromatism';
 import { jsx } from '@emotion/core';
-import ModalDialog, { ModalTransition } from '@atlaskit/modal-dialog';
+import ModalDialog, { ModalTransition, useModal, ModalBody as AKModalBody } from '@atlaskit/modal-dialog';
 import EditorCloseIcon from '@atlaskit/icon/glyph/editor/close';
 import Button from '@atlaskit/button/custom-theme-button';
 import { gridSize as gridSizeFn } from '@atlaskit/theme/constants';
@@ -58,25 +58,25 @@ const headingStyle = {
   marginTop: '8px'
 };
 
-const Header = ({
-  onClose
-}) => jsx("div", {
-  css: bottomShadow
-}, jsx("div", {
-  css: spacingDivStyle
-}), jsx("h5", {
-  css: headingStyle
-}, "Dropbox"), jsx("div", null, jsx(Button, {
-  appearance: "subtle",
-  iconBefore: jsx(EditorCloseIcon, {
-    label: "close dropbox modal"
-  }),
-  onClick: onClose
-})));
-
-const components = {
-  Body: ModalBody,
-  Header
+const Header = () => {
+  const {
+    onClose,
+    titleId
+  } = useModal();
+  return jsx("div", {
+    css: bottomShadow
+  }, jsx("div", {
+    css: spacingDivStyle
+  }), jsx("h5", {
+    id: titleId,
+    css: headingStyle
+  }, "Dropbox"), jsx("div", null, jsx(Button, {
+    appearance: "subtle",
+    iconBefore: jsx(EditorCloseIcon, {
+      label: "close dropbox modal"
+    }),
+    onClick: onClose
+  })));
 };
 
 const Modal = ({
@@ -93,12 +93,11 @@ const Modal = ({
   return jsx(ModalTransition, null, isOpen && jsx(ModalDialog, {
     height: "100%",
     width: "large",
-    components: components,
     onClose: () => {
       setIsOpen(false);
       onClose();
     }
-  }, TEST_ONLY_src ? jsx("iframe", {
+  }, jsx(Header, null), jsx(AKModalBody, null, jsx(ModalBody, null, TEST_ONLY_src ? jsx("iframe", {
     css: iframeStyle,
     name: DROPBOX_IFRAME_NAME,
     frameBorder: 0,
@@ -107,7 +106,7 @@ const Modal = ({
     css: iframeStyle,
     name: DROPBOX_IFRAME_NAME,
     frameBorder: 0
-  })));
+  })))));
 };
 
 export default Modal;

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-extension-dropbox",
-	"version": "0.2.19",
+	"version": "0.2.23",
 	"sideEffects": false
 }

package/dist/esm/modal.js

@@ -9,7 +9,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import React, { useState } from 'react';
 import chromatism from 'chromatism';
 import { jsx } from '@emotion/core';
-import ModalDialog, { ModalTransition } from '@atlaskit/modal-dialog';
+import ModalDialog, { ModalTransition, useModal, ModalBody as AKModalBody } from '@atlaskit/modal-dialog';
 import EditorCloseIcon from '@atlaskit/icon/glyph/editor/close';
 import Button from '@atlaskit/button/custom-theme-button';
 import { gridSize as gridSizeFn } from '@atlaskit/theme/constants';
@@ -66,13 +66,17 @@ var headingStyle = {
   marginTop: '8px'
 };
 
-var Header = function Header(_ref) {
-  var onClose = _ref.onClose;
+var Header = function Header() {
+  var _useModal = useModal(),
+      onClose = _useModal.onClose,
+      titleId = _useModal.titleId;
+
   return jsx("div", {
     css: bottomShadow
   }, jsx("div", {
     css: spacingDivStyle
   }), jsx("h5", {
+    id: titleId,
     css: headingStyle
   }, "Dropbox"), jsx("div", null, jsx(Button, {
     appearance: "subtle",
@@ -83,15 +87,10 @@ var Header = function Header(_ref) {
   })));
 };
 
-var components = {
-  Body: ModalBody,
-  Header: Header
-};
-
-var Modal = function Modal(_ref2) {
-  var _onClose = _ref2.onClose,
-      TEST_ONLY_src = _ref2.TEST_ONLY_src,
-      showModal = _ref2.showModal;
+var Modal = function Modal(_ref) {
+  var _onClose = _ref.onClose,
+      TEST_ONLY_src = _ref.TEST_ONLY_src,
+      showModal = _ref.showModal;
 
   var _useState = useState(true),
       _useState2 = _slicedToArray(_useState, 2),
@@ -105,13 +104,12 @@ var Modal = function Modal(_ref2) {
   return jsx(ModalTransition, null, isOpen && jsx(ModalDialog, {
     height: "100%",
     width: "large",
-    components: components,
     onClose: function onClose() {
       setIsOpen(false);
 
       _onClose();
     }
-  }, TEST_ONLY_src ? jsx("iframe", {
+  }, jsx(Header, null), jsx(AKModalBody, null, jsx(ModalBody, null, TEST_ONLY_src ? jsx("iframe", {
     css: iframeStyle,
     name: DROPBOX_IFRAME_NAME,
     frameBorder: 0,
@@ -120,7 +118,7 @@ var Modal = function Modal(_ref2) {
     css: iframeStyle,
     name: DROPBOX_IFRAME_NAME,
     frameBorder: 0
-  })));
+  })))));
 };
 
 export default Modal;

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-extension-dropbox",
-	"version": "0.2.19",
+	"version": "0.2.23",
 	"sideEffects": false
 }

package/dist/types/icons/DropboxIcon.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 declare const _default: () => JSX.Element;
 export default _default;

package/dist/types/modal.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 declare const Modal: ({ onClose, TEST_ONLY_src, showModal, }: {
     onClose: () => any;
     TEST_ONLY_src?: string | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-extension-dropbox",
-  "version": "0.2.19",
+  "version": "0.2.23",
   "description": "A an atlassian editor extension to add a native dropbox picker",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -24,12 +24,12 @@
     }
   },
   "dependencies": {
-    "@atlaskit/adf-utils": "^14.1.0",
+    "@atlaskit/adf-utils": "^14.4.0",
     "@atlaskit/button": "^16.0.0",
-    "@atlaskit/editor-common": "^59.0.0",
-    "@atlaskit/icon": "^21.6.0",
-    "@atlaskit/modal-dialog": "^11.7.0",
-    "@atlaskit/theme": "^11.4.0",
+    "@atlaskit/editor-common": "^62.0.0",
+    "@atlaskit/icon": "^21.9.0",
+    "@atlaskit/modal-dialog": "^12.2.0",
+    "@atlaskit/theme": "^12.0.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/core": "^10.0.9",
     "chromatism": "^2.6.0"