@atlaskit/media-picker 59.0.3 → 60.0.0

package/CHANGELOG.md

@@ -1,5 +1,112 @@
 # @atlaskit/media-picker
 
+## 60.0.0
+
+### Minor Changes
+
+- [`acb60e0107d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/acb60e0107d) - Replicate Media Picker Reliability Events using UFO client library
+- [`fdc41ee7a0b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/fdc41ee7a0b) - Stop exposing observableToPromise from media client API.
+  mediaSubscribableToPromise is used internally.
+- [`f862d5ae7aa`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f862d5ae7aa) - remove RxJs peer dependency
+- [`118f3af101f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/118f3af101f) - Media Client APIs has been updated to use MediaSubscribable which provides subscription functionality (similar to RxJs observables).
+  It exposes subscribe method that is called with MediaObserver as an argument and returns MediaSubscription.
+  MediaSubscription exposes unsubscribe method.
+
+  getFileState:
+  The returned type of this function has changed from RxJs ReplaySubject to MediaSubscribable.
+
+  ```
+  import { MediaClient, MediaObserver, MediaSubscribable, MediaSubscription } from '@atlaskit/media-client';
+
+  const mediaClient = new MediaClient({ authProvider });
+
+  const fileStateSubscribable: MediaSubscribable<FileState> = mediaClient.file.getFileState(id);
+
+  const mediaObserver: MediaObserver<FileState> = {
+    next: (fileState) => {
+      nextCallback(fileState)
+    },
+    error: (error) => {
+      errorCallback(error)
+    },
+  };
+
+  const subscription: MediaSubscription = fileStateSubscribable.subscribe(mediaObserver);
+
+  subscription.unsubscribe();
+  ```
+
+  upload:
+  The returned type of this function has changed from RxJs ReplaySubject to MediaSubscribable.
+
+  ```
+  import { MediaClient, MediaObserver, MediaSubscribable, MediaSubscription } from '@atlaskit/media-client';
+
+  const mediaClient = new MediaClient({ authProvider });
+
+  const uploadFileSubscribable: MediaSubscribable<FileState> = mediaClient.file.upload(uploadableFile);
+
+  const mediaObserver: MediaObserver<FileState> = {
+    next: (fileState) => {
+      nextCallback(fileState)
+    },
+    error: (error) => {
+      errorCallback(error)
+    },
+  };
+
+  const subscription: MediaSubscription = uploadFileSubscribable.subscribe(mediaObserver);
+
+  subscription.unsubscribe();
+  ```
+
+  getItems:
+  The returned type of this function has changed from RxJs ReplaySubject to MediaSubscribable.
+
+  ```
+  import { MediaClient, MediaObserver, MediaSubscribable, MediaSubscription } from '@atlaskit/media-client';
+
+  const mediaClient = new MediaClient({ authProvider });
+
+  const collectionItemsSubscribable: MediaSubscribable<MediaCollectionItem[]> = mediaClient.collection.getItems(collectionName);
+
+  const mediaObserver: MediaObserver<MediaCollectionItem[]> = {
+    next: (items) => {
+      nextCallback(items)
+    },
+    error: (error) => {
+      errorCallback(error)
+    },
+  };
+
+  const subscription: MediaSubscription = collectionItemsSubscribable.subscribe(mediaObserver);
+
+  subscription.unsubscribe();
+  ```
+
+- [`0573f4c51b9`](https://bitbucket.org/atlassian/atlassian-frontend/commits/0573f4c51b9) - [MEX-1388] Remove MediaPicker PopUp code from bundle
+
+### Patch Changes
+
+- Updated dependencies
+
+## 59.1.0
+
+### Minor Changes
+
+- [`8742dbe70bd`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8742dbe70bd) - MEX-1102 Removed lodash dependencies from media component and converted all to local functions (lightweight helpers)
+
+### Patch Changes
+
+- [`b0e810b8a41`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b0e810b8a41) - Disable clipboard paste event handler for input element.
+- Updated dependencies
+
+## 59.0.4
+
+### Patch Changes
+
+- [`6a5dc78b511`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6a5dc78b511) - Remove dateformat from media packages
+
 ## 59.0.3
 
 ### Patch Changes

package/dist/cjs/components/clipboard/clipboard.js

@@ -130,7 +130,12 @@ var ClipboardImpl = /*#__PURE__*/function () {
 
 (0, _defineProperty2.default)(ClipboardImpl, "instances", []);
 (0, _defineProperty2.default)(ClipboardImpl, "handleEvent", function (event) {
-  // last in, first served to support multiple instances listening at once
+  // From https://product-fabric.atlassian.net/browse/MEX-1281 ,disable the handler if event target is input
+  if (event.target instanceof HTMLInputElement) {
+    return;
+  } // last in, first served to support multiple instances listening at once
+
+
   var instance = ClipboardImpl.latestInstance;
 
   if (instance) {

package/dist/cjs/components/localUploadReact.js

@@ -39,6 +39,8 @@ var _uploadServiceImpl = require("../service/uploadServiceImpl");
 
 var _analytics = require("../util/analytics");
 
+var _ufoExperiences = require("../util/ufoExperiences");
+
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
@@ -76,6 +78,8 @@ var LocalUploadComponentReact = /*#__PURE__*/function (_Component) {
             }
           }
         });
+
+        (0, _ufoExperiences.startMediaUploadUfoExperience)(fileId, _this.componentName);
       });
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "fireUploadSucceeded", function (payload) {
@@ -105,6 +109,12 @@ var LocalUploadComponentReact = /*#__PURE__*/function (_Component) {
           uploadDurationMsec: uploadDurationMsec
         }
       });
+
+      (0, _ufoExperiences.succeedMediaUploadUfoExperience)(fileId, {
+        fileId: fileId,
+        fileSize: fileSize,
+        fileMimetype: fileMimetype
+      });
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "fireUploadFailed", /*#__PURE__*/function () {
       var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(payload) {
@@ -136,7 +146,17 @@ var LocalUploadComponentReact = /*#__PURE__*/function (_Component) {
                   }
                 });
 
-              case 3:
+                (0, _ufoExperiences.failMediaUploadUfoExperience)(fileId, {
+                  failReason: errorName,
+                  error: !!rawError ? (0, _mediaClient.getMediaClientErrorReason)(rawError) : 'unknown',
+                  request: !!rawError ? (0, _analytics.getRequestMetadata)(rawError) : undefined,
+                  fileAttributes: {
+                    fileId: fileId
+                  },
+                  uploadDurationMsec: uploadDurationMsec
+                });
+
+              case 4:
               case "end":
                 return _context.stop();
             }

package/dist/cjs/components/popup.js

@@ -13,58 +13,24 @@ var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"))
 
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 
-var _mediaClient = require("@atlaskit/media-client");
-
-var _react = _interopRequireDefault(require("react"));
-
-var _reactDom = require("react-dom");
-
 var exenv = _interopRequireWildcard(require("exenv"));
 
-var _app = _interopRequireDefault(require("../popup/components/app"));
-
-var _showPopup = require("../popup/actions/showPopup");
-
-var _getFilesInRecents = require("../popup/actions/getFilesInRecents");
-
-var _actions = require("../popup/actions");
-
-var _hidePopup = require("../popup/actions/hidePopup");
-
-var _cancelUpload = require("../popup/actions/cancelUpload");
-
-var _failureErrorLogger = require("../popup/actions/failureErrorLogger");
-
-var _store = require("../store");
-
 var _component = require("./component");
 
-var _uploadParams = require("../domain/uploadParams");
-
-var _popupAuth = require("./popup-auth");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
@@ -89,37 +55,6 @@ var PopupImpl = /*#__PURE__*/function (_UploadComponent) {
     (0, _classCallCheck2.default)(this, PopupImpl);
     _this = _super.call(this);
     _this.tenantMediaClient = tenantMediaClient;
-    _this.proxyReactContext = proxyReactContext;
-    _this.useForgePlugins = useForgePlugins;
-    _this.featureFlags = featureFlags;
-    var userAuthProvider = (0, _popupAuth.createPopupUserAuthProvider)(tenantMediaClient.stargate, tenantMediaClient.config);
-    var userMediaClient = new _mediaClient.MediaClient({
-      authProvider: userAuthProvider
-    });
-
-    var tenantUploadParams = _objectSpread(_objectSpread({}, _uploadParams.defaultUploadParams), uploadParams);
-
-    _this.store = (0, _store.createStore)((0, _assertThisInitialized2.default)(_this), tenantMediaClient, userMediaClient, {
-      proxyReactContext: proxyReactContext,
-      singleSelect: singleSelect,
-      uploadParams: tenantUploadParams,
-      plugins: plugins,
-      featureFlags: featureFlags
-    });
-    _this.tenantUploadParams = tenantUploadParams;
-
-    var popup = _this.renderPopup();
-
-    if (!popup) {
-      return (0, _possibleConstructorReturn2.default)(_this);
-    }
-
-    _this.container = popup;
-
-    if (container) {
-      container.appendChild(popup);
-    }
-
     return _this;
   }
 
@@ -127,26 +62,15 @@ var PopupImpl = /*#__PURE__*/function (_UploadComponent) {
     key: "show",
     value: function () {
       var _show = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
-        var dispatch;
         return _regenerator.default.wrap(function _callee$(_context) {
           while (1) {
             switch (_context.prev = _context.next) {
               case 0:
-                dispatch = this.store.dispatch;
-                dispatch((0, _getFilesInRecents.getFilesInRecents)());
-
-                if (this.useForgePlugins) {
-                  dispatch((0, _actions.getForgePlugins)());
-                }
-
-                dispatch((0, _showPopup.showPopup)());
-
-              case 4:
               case "end":
                 return _context.stop();
             }
           }
-        }, _callee, this);
+        }, _callee);
       }));
 
       function show() {
@@ -163,34 +87,11 @@ var PopupImpl = /*#__PURE__*/function (_UploadComponent) {
           while (1) {
             switch (_context2.prev = _context2.next) {
               case 0:
-                if (uniqueIdentifier) {
-                  _context2.next = 2;
-                  break;
-                }
-
-                return _context2.abrupt("return");
-
-              case 2:
-                _context2.t0 = this.store;
-                _context2.t1 = _cancelUpload.cancelUpload;
-                _context2.next = 6;
-                return uniqueIdentifier;
-
-              case 6:
-                _context2.t2 = _context2.sent;
-                _context2.t3 = {
-                  tenantFileId: _context2.t2
-                };
-                _context2.t4 = (0, _context2.t1)(_context2.t3);
-
-                _context2.t0.dispatch.call(_context2.t0, _context2.t4);
-
-              case 10:
               case "end":
                 return _context2.stop();
             }
           }
-        }, _callee2, this);
+        }, _callee2);
       }));
 
       function cancel(_x) {
@@ -201,54 +102,16 @@ var PopupImpl = /*#__PURE__*/function (_UploadComponent) {
     }()
   }, {
     key: "teardown",
-    value: function teardown() {
-      if (!this.container) {
-        return;
-      }
-
-      try {
-        (0, _reactDom.unmountComponentAtNode)(this.container);
-        this.container.remove();
-      } catch (error) {
-        var dispatch = this.store.dispatch;
-        dispatch((0, _failureErrorLogger.failureErrorLogger)({
-          error: error,
-          info: '`ChildNode#remove()` polyfill is not available in client'
-        }));
-      }
-    }
+    value: function teardown() {}
   }, {
     key: "hide",
-    value: function hide() {
-      this.store.dispatch((0, _hidePopup.hidePopup)());
-    }
+    value: function hide() {}
   }, {
     key: "setUploadParams",
-    value: function setUploadParams(uploadParams) {
-      this.tenantUploadParams = _objectSpread(_objectSpread({}, _uploadParams.defaultUploadParams), uploadParams);
-    }
+    value: function setUploadParams(uploadParams) {}
   }, {
     key: "emitClosed",
-    value: function emitClosed() {
-      this.emit('closed', undefined);
-    }
-  }, {
-    key: "renderPopup",
-    value: function renderPopup() {
-      if (!exenv.canUseDOM) {
-        return;
-      }
-
-      var container = document.createElement('div');
-      (0, _reactDom.render)( /*#__PURE__*/_react.default.createElement(_app.default, {
-        store: this.store,
-        proxyReactContext: this.proxyReactContext,
-        tenantUploadParams: this.tenantUploadParams,
-        useForgePlugins: this.useForgePlugins,
-        featureFlags: this.featureFlags
-      }), container);
-      return container;
-    }
+    value: function emitClosed() {}
   }]);
   return PopupImpl;
 }(_component.UploadComponent);

package/dist/cjs/plugins/extractors/index.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getResourceUrl = exports.getImageUrl = exports.getDateString = void 0;
 
-var _dateformat = _interopRequireDefault(require("dateformat"));
+var _format = _interopRequireDefault(require("date-fns/format"));
 
 var getImageUrl = function getImageUrl(data) {
   var image = data.image;
@@ -49,7 +49,7 @@ var getDateString = function getDateString(timestamp) {
   var todayString = new Date().toDateString();
   var itemDate = new Date(timestamp);
   var itemDateString = itemDate.toDateString();
-  return (0, _dateformat.default)(itemDate, todayString === itemDateString ? 'H:MM TT' : 'd mmm yyyy');
+  return (0, _format.default)(itemDate, todayString === itemDateString ? 'H:MM TT' : 'd mmm yyyy');
 };
 
 exports.getDateString = getDateString;

package/dist/cjs/plugins/forge/components/index.js

@@ -25,8 +25,6 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _debounce = _interopRequireDefault(require("lodash/debounce"));
-
 var _types = require("../types");
 
 var _client = require("../client");
@@ -43,6 +41,8 @@ var _error = require("./error");
 
 var _utils = require("../utils");
 
+var _mediaCommon = require("@atlaskit/media-common");
+
 var _icon = require("./icon");
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -88,7 +88,7 @@ var ForgeView = function ForgeView(_ref) {
   // eslint-disable-next-line react-hooks/exhaustive-deps
 
 
-  var onUpdateItems = (0, _react.useCallback)((0, _debounce.default)( /*#__PURE__*/function () {
+  var onUpdateItems = (0, _react.useCallback)((0, _mediaCommon.debounce)( /*#__PURE__*/function () {
     var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(query, folderId) {
       var newItems;
       return _regenerator.default.wrap(function _callee$(_context) {

package/dist/cjs/popup/components/views/browser/folderView/folderView.js

@@ -27,7 +27,7 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _reactRedux = require("react-redux");
 
-var _dateformat = _interopRequireDefault(require("dateformat"));
+var _format = _interopRequireDefault(require("date-fns/format"));
 
 var _filesize = _interopRequireDefault(require("filesize"));
 
@@ -71,7 +71,7 @@ var getDateString = function getDateString(timestamp) {
   var todayString = new Date().toDateString();
   var itemDate = new Date(timestamp);
   var itemDateString = itemDate.toDateString();
-  return (0, _dateformat.default)(itemDate, todayString === itemDateString ? 'H:MM TT' : 'd mmm yyyy');
+  return (0, _format.default)(itemDate, todayString === itemDateString ? 'h:mm a' : 'd MMM yyyy');
 };
 
 var selectedTick = /*#__PURE__*/_react.default.createElement(_styled.SelectedFileIconWrapper, null, /*#__PURE__*/_react.default.createElement(_checkCircle.default, {

package/dist/cjs/popup/middleware/analyticsProcessing.js

@@ -7,8 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _pick = _interopRequireDefault(require("lodash/pick"));
-
 var _analyticsNext = require("@atlaskit/analytics-next");
 
 var _mediaCommon = require("@atlaskit/media-common");
@@ -39,7 +37,7 @@ var createAndFireAnalyticsEvent = function createAndFireAnalyticsEvent(handlers,
       componentName: componentName,
       component: component,
       attributes: {
-        featureFlags: (0, _pick.default)(featureFlags, ['newCardExperience', 'folderUploads'])
+        featureFlags: (0, _mediaCommon.pick)(featureFlags, ['newCardExperience', 'folderUploads'])
       }
     }],
     handlers: handlers,

package/dist/cjs/popup/middleware/handleCloudFetchingEvent.js

@@ -23,6 +23,8 @@ var _handleCloudFetchingEvent = require("../actions/handleCloudFetchingEvent");
 
 var _sendUploadEvent = require("../actions/sendUploadEvent");
 
+var _observableToPromise = require("../tools/observableToPromise");
+
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -74,7 +76,7 @@ var handleCloudFetchingEvent = function handleCloudFetchingEvent(store) {
                   }
 
                   _context.next = 7;
-                  return (0, _mediaClient.observableToPromise)(tenantFileObservable);
+                  return (0, _observableToPromise.observableToPromise)(tenantFileObservable);
 
                 case 7:
                   _context.t0 = _context.sent;

package/dist/cjs/popup/middleware/importFiles.js

@@ -46,6 +46,8 @@ var _preview2 = require("../../domain/preview");
 
 var _getPreviewFromBlob = require("../../util/getPreviewFromBlob");
 
+var _observableToPromise = require("../tools/observableToPromise");
+
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -200,7 +202,7 @@ var getTenantFileState = /*#__PURE__*/function () {
             }
 
             _context2.next = 8;
-            return (0, _mediaClient.observableToPromise)(userFileObservable);
+            return (0, _observableToPromise.observableToPromise)(userFileObservable);
 
           case 8:
             userFileState = _context2.sent;
@@ -259,7 +261,7 @@ var getTenantFileState = /*#__PURE__*/function () {
 exports.getTenantFileState = getTenantFileState;
 
 var distributeTenantFileState = function distributeTenantFileState(eventEmitter, tenantFileState, userSelectedFileId) {
-  var tenantFileSubject = (0, _mediaClient.createFileStateSubject)();
+  var tenantFileSubject = (0, _mediaClient.createMediaSubject)();
   var userFileObservable = (0, _mediaClient.getFileStreamsCache)().get(userSelectedFileId);
   (0, _mediaClient.getFileStreamsCache)().set(tenantFileState.id, tenantFileSubject);
   tenantFileSubject.next(tenantFileState);

package/dist/cjs/popup/tools/observableToPromise.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.observableToPromise = void 0;
+
+var _Subscription = require("rxjs/Subscription");
+
+/**
+ * We're using this custom helper in place of ".toPromise()" to transform the first value emitted by an Observable or Subject into a Promise.
+ * Note that in RxJS 7 ".toPromise()" is deprecated and replaced by "firstValueFrom()/.lastValueFrom()"
+ *
+ * @param observable a given Observable<MediaSubscribableItem> or Subject<MediaSubscribableItem>
+ * @param subscription a default Subscription (this parameter exists for testing purpose)
+ */
+var observableToPromise = function observableToPromise(observable) {
+  var subscription = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : new _Subscription.Subscription();
+  return new Promise(function (resolve, reject) {
+    return subscription.add(observable.subscribe({
+      //@ts-ignore
+      next: function next(state) {
+        resolve(state);
+        subscription.unsubscribe();
+      },
+      error: function error(_error) {
+        reject(_error);
+        subscription.unsubscribe();
+      }
+    }));
+  });
+};
+
+exports.observableToPromise = observableToPromise;

package/dist/cjs/util/ufoExperiences.js

@@ -0,0 +1,76 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.succeedMediaUploadUfoExperience = exports.startMediaUploadUfoExperience = exports.failMediaUploadUfoExperience = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _ufo = require("@atlaskit/ufo");
+
+var _version = require("../version.json");
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var ufoExperience;
+
+var initExperience = function initExperience(id, componentName) {
+  if (!ufoExperience) {
+    var inlineExperience = {
+      platform: {
+        component: componentName
+      },
+      type: _ufo.ExperienceTypes.Experience,
+      performanceType: _ufo.ExperiencePerformanceTypes.InlineResult
+    };
+    ufoExperience = new _ufo.ConcurrentExperience('media-upload', inlineExperience);
+  }
+
+  return ufoExperience.getInstance(id);
+};
+
+var getExperience = function getExperience(id) {
+  if (ufoExperience) {
+    return ufoExperience.getInstance(id);
+  }
+};
+
+var startMediaUploadUfoExperience = function startMediaUploadUfoExperience(id, properties) {
+  initExperience(id, properties).start();
+};
+
+exports.startMediaUploadUfoExperience = startMediaUploadUfoExperience;
+
+var succeedMediaUploadUfoExperience = function succeedMediaUploadUfoExperience(id, properties) {
+  var _getExperience;
+
+  (_getExperience = getExperience(id)) === null || _getExperience === void 0 ? void 0 : _getExperience.success({
+    metadata: {
+      fileAttributes: properties,
+      packageName: _version.name,
+      packageVersion: _version.version
+    }
+  });
+};
+
+exports.succeedMediaUploadUfoExperience = succeedMediaUploadUfoExperience;
+
+var failMediaUploadUfoExperience = function failMediaUploadUfoExperience(id, properties) {
+  var _getExperience2;
+
+  var refinedMetadata = _objectSpread(_objectSpread({}, properties), {}, {
+    packageName: _version.name,
+    packageVersion: _version.version
+  });
+
+  (_getExperience2 = getExperience(id)) === null || _getExperience2 === void 0 ? void 0 : _getExperience2.failure({
+    metadata: refinedMetadata
+  });
+};
+
+exports.failMediaUploadUfoExperience = failMediaUploadUfoExperience;

package/dist/cjs/version.json

@@ -1,4 +1,4 @@
 {
 	"name": "@atlaskit/media-picker",
-	"version": "59.0.3"
+	"version": "60.0.0"
 }

package/dist/es2019/components/clipboard/clipboard.js

@@ -89,7 +89,12 @@ class ClipboardImpl {
 _defineProperty(ClipboardImpl, "instances", []);
 
 _defineProperty(ClipboardImpl, "handleEvent", event => {
-  // last in, first served to support multiple instances listening at once
+  // From https://product-fabric.atlassian.net/browse/MEX-1281 ,disable the handler if event target is input
+  if (event.target instanceof HTMLInputElement) {
+    return;
+  } // last in, first served to support multiple instances listening at once
+
+
   const instance = ClipboardImpl.latestInstance;
 
   if (instance) {