@atlaskit/media-avatar-picker 28.1.10 → 28.3.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 (67) hide show
  1. package/CHANGELOG.md +31 -0
  2. package/dist/cjs/avatar-list/index.js +4 -4
  3. package/dist/cjs/avatar-picker-dialog/SRLiveTitle.js +2 -2
  4. package/dist/cjs/avatar-picker-dialog/SubmitErrorDialog.js +3 -3
  5. package/dist/cjs/avatar-picker-dialog/custom-spinner.js +2 -2
  6. package/dist/cjs/avatar-picker-dialog/index.js +27 -20
  7. package/dist/cjs/avatar-picker-dialog/layout-const.js +2 -2
  8. package/dist/cjs/image-cropper/crop-to-data-uri.js +2 -2
  9. package/dist/cjs/image-cropper/index.js +12 -11
  10. package/dist/cjs/image-navigator/index.js +20 -14
  11. package/dist/cjs/image-navigator/slider.js +5 -5
  12. package/dist/cjs/image-placer/constraints.js +6 -5
  13. package/dist/cjs/image-placer/container.js +5 -5
  14. package/dist/cjs/image-placer/imageProcessor.js +6 -4
  15. package/dist/cjs/image-placer/imageWrapper.js +2 -2
  16. package/dist/cjs/image-placer/index.js +19 -14
  17. package/dist/cjs/predefined-avatar-list/index.js +2 -2
  18. package/dist/cjs/predefined-avatar-view/index.js +4 -4
  19. package/dist/cjs/viewport/viewport.js +20 -18
  20. package/dist/es2019/avatar-list/index.js +2 -2
  21. package/dist/es2019/avatar-picker-dialog/SRLiveTitle.js +1 -1
  22. package/dist/es2019/avatar-picker-dialog/SubmitErrorDialog.js +2 -2
  23. package/dist/es2019/avatar-picker-dialog/custom-spinner.js +1 -1
  24. package/dist/es2019/avatar-picker-dialog/index.js +11 -4
  25. package/dist/es2019/avatar-picker-dialog/layout-const.js +1 -1
  26. package/dist/es2019/image-cropper/crop-to-data-uri.js +1 -1
  27. package/dist/es2019/image-cropper/index.js +3 -2
  28. package/dist/es2019/image-navigator/index.js +8 -2
  29. package/dist/es2019/image-navigator/slider.js +2 -2
  30. package/dist/es2019/image-placer/constraints.js +2 -1
  31. package/dist/es2019/image-placer/container.js +1 -1
  32. package/dist/es2019/image-placer/imageProcessor.js +3 -1
  33. package/dist/es2019/image-placer/imageWrapper.js +1 -1
  34. package/dist/es2019/image-placer/index.js +6 -1
  35. package/dist/es2019/predefined-avatar-list/index.js +1 -1
  36. package/dist/es2019/predefined-avatar-view/index.js +1 -1
  37. package/dist/es2019/viewport/viewport.js +3 -1
  38. package/dist/esm/avatar-list/index.js +2 -2
  39. package/dist/esm/avatar-picker-dialog/SRLiveTitle.js +1 -1
  40. package/dist/esm/avatar-picker-dialog/SubmitErrorDialog.js +2 -2
  41. package/dist/esm/avatar-picker-dialog/custom-spinner.js +1 -1
  42. package/dist/esm/avatar-picker-dialog/index.js +11 -4
  43. package/dist/esm/avatar-picker-dialog/layout-const.js +1 -1
  44. package/dist/esm/image-cropper/crop-to-data-uri.js +1 -1
  45. package/dist/esm/image-cropper/index.js +3 -2
  46. package/dist/esm/image-navigator/index.js +8 -2
  47. package/dist/esm/image-navigator/slider.js +2 -2
  48. package/dist/esm/image-placer/constraints.js +2 -1
  49. package/dist/esm/image-placer/container.js +1 -1
  50. package/dist/esm/image-placer/imageProcessor.js +3 -1
  51. package/dist/esm/image-placer/imageWrapper.js +1 -1
  52. package/dist/esm/image-placer/index.js +6 -1
  53. package/dist/esm/predefined-avatar-list/index.js +1 -1
  54. package/dist/esm/predefined-avatar-view/index.js +1 -1
  55. package/dist/esm/viewport/viewport.js +3 -1
  56. package/dist/types/avatar-picker-dialog/layout-const.d.ts +1 -1
  57. package/dist/types/image-navigator/index.d.ts +1 -1
  58. package/dist/types/image-placer/constraints.d.ts +3 -1
  59. package/dist/types/image-placer/container.d.ts +1 -1
  60. package/dist/types/image-placer/imageProcessor.d.ts +3 -1
  61. package/dist/types/image-placer/index.d.ts +4 -1
  62. package/dist/types/viewport/viewport.d.ts +3 -1
  63. package/example-helpers/StatefulAvatarPickerDialog.tsx +1 -1
  64. package/example-helpers/viewport-debug.ts +1 -1
  65. package/package.json +21 -20
  66. package/media-avatar-picker.docs.tsx +0 -71
  67. package/report.api.md +0 -144
@@ -13,7 +13,7 @@ var _runtime = require("@compiled/react/runtime");
13
13
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
14
14
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
15
15
  var _reactIntl = require("react-intl");
16
- var _mediaUi = require("@atlaskit/media-ui");
16
+ var _messages = require("@atlaskit/media-ui/messages");
17
17
  var _excluded = ["x", "y", "width", "height", "transform"];
18
18
  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" != _typeof(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); }
19
19
  var imageWrapperStyles = null;
@@ -33,7 +33,7 @@ var ImageWrapper = exports.ImageWrapper = function ImageWrapper(_ref) {
33
33
  height: "".concat(height, "px"),
34
34
  transform: transform
35
35
  },
36
- alt: intl.formatMessage(_mediaUi.messages.image_placer_img_alt)
36
+ alt: intl.formatMessage(_messages.messages.image_placer_img_alt)
37
37
  }, props, {
38
38
  className: (0, _runtime.ax)(["_v56416z2 _kqswstnw _uiztglyw _lcxvglyw"])
39
39
  }));
@@ -17,7 +17,12 @@ var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/ge
17
17
  var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
18
18
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
19
19
  var _react = _interopRequireDefault(require("react"));
20
- var _mediaUi = require("@atlaskit/media-ui");
20
+ var _rectangle = require("@atlaskit/media-ui/rectangle");
21
+ var _vector = require("@atlaskit/media-ui/vector2");
22
+ var _bounds = require("@atlaskit/media-ui/bounds");
23
+ var _dataURItoFile = require("@atlaskit/media-ui/dataURItoFile");
24
+ var _getFileInfo = require("@atlaskit/media-ui/getFileInfo");
25
+ var _getFileInfoFromSrc = require("@atlaskit/media-ui/getFileInfoFromSrc");
21
26
  var _container = require("./container");
22
27
  var _image = require("./image");
23
28
  var _margin = require("./margin");
@@ -77,7 +82,7 @@ var ImagePlacer = exports.ImagePlacer = /*#__PURE__*/function (_React$Component)
77
82
  var _this;
78
83
  (0, _classCallCheck2.default)(this, ImagePlacer);
79
84
  _this = _callSuper(this, ImagePlacer, [_props]);
80
- (0, _defineProperty2.default)(_this, "imageSourceRect", new _mediaUi.Rectangle(0, 0));
85
+ (0, _defineProperty2.default)(_this, "imageSourceRect", new _rectangle.Rectangle(0, 0));
81
86
  (0, _defineProperty2.default)(_this, "state", {
82
87
  imageWidth: 0,
83
88
  imageHeight: 0,
@@ -112,12 +117,12 @@ var ImagePlacer = exports.ImagePlacer = /*#__PURE__*/function (_React$Component)
112
117
  });
113
118
  /* convert current visible view to File */
114
119
  (0, _defineProperty2.default)(_this, "toFile", function () {
115
- return (0, _mediaUi.dataURItoFile)(_this.toDataURL());
120
+ return (0, _dataURItoFile.dataURItoFile)(_this.toDataURL());
116
121
  });
117
122
  /* image has loaded */
118
123
  (0, _defineProperty2.default)(_this, "onImageLoad", function (imageElement, width, height) {
119
124
  var onImageChange = _this.props.onImageChange;
120
- _this.imageSourceRect = new _mediaUi.Rectangle(width, height);
125
+ _this.imageSourceRect = new _rectangle.Rectangle(width, height);
121
126
  _this.imageElement = imageElement;
122
127
  _this.setState({
123
128
  imageWidth: width,
@@ -139,7 +144,7 @@ var ImagePlacer = exports.ImagePlacer = /*#__PURE__*/function (_React$Component)
139
144
  originX = _this$state.originX,
140
145
  originY = _this$state.originY;
141
146
  _this.setState({
142
- dragOrigin: new _mediaUi.Vector2(originX, originY)
147
+ dragOrigin: new _vector.Vector2(originX, originY)
143
148
  });
144
149
  });
145
150
  /* drag within container has started */
@@ -176,7 +181,7 @@ var ImagePlacer = exports.ImagePlacer = /*#__PURE__*/function (_React$Component)
176
181
  containerWidth = _this$props.containerWidth,
177
182
  containerHeight = _this$props.containerHeight,
178
183
  margin = _this$props.margin;
179
- return new _mediaUi.Rectangle(containerWidth + margin * 2, containerHeight + margin * 2);
184
+ return new _rectangle.Rectangle(containerWidth + margin * 2, containerHeight + margin * 2);
180
185
  }
181
186
 
182
187
  /* the local rect of the container without margins */
@@ -186,7 +191,7 @@ var ImagePlacer = exports.ImagePlacer = /*#__PURE__*/function (_React$Component)
186
191
  var _this$props2 = this.props,
187
192
  containerWidth = _this$props2.containerWidth,
188
193
  containerHeight = _this$props2.containerHeight;
189
- return new _mediaUi.Rectangle(containerWidth, containerHeight);
194
+ return new _rectangle.Rectangle(containerWidth, containerHeight);
190
195
  }
191
196
 
192
197
  /* the bounds of the scaled/panned image, relative to container */
@@ -213,7 +218,7 @@ var ImagePlacer = exports.ImagePlacer = /*#__PURE__*/function (_React$Component)
213
218
  var maxHeightDiff = imageHeight * maxZoom - imageHeight;
214
219
  var width = imageWidth + maxWidthDiff * zoom;
215
220
  var height = imageHeight + maxHeightDiff * zoom;
216
- return new _mediaUi.Bounds(x, y, width, height);
221
+ return new _bounds.Bounds(x, y, width, height);
217
222
  }
218
223
 
219
224
  /* the bounds of the visible area (container - margins), relative to container */
@@ -224,7 +229,7 @@ var ImagePlacer = exports.ImagePlacer = /*#__PURE__*/function (_React$Component)
224
229
  containerWidth = _this$props4.containerWidth,
225
230
  containerHeight = _this$props4.containerHeight,
226
231
  margin = _this$props4.margin;
227
- return new _mediaUi.Bounds(margin, margin, containerWidth, containerHeight);
232
+ return new _bounds.Bounds(margin, margin, containerWidth, containerHeight);
228
233
  }
229
234
 
230
235
  /* a coordinate mapping from visibleBounds to local rect of image */
@@ -240,7 +245,7 @@ var ImagePlacer = exports.ImagePlacer = /*#__PURE__*/function (_React$Component)
240
245
  var _this$transformVisibl2 = this.transformVisibleBoundsToImageCoords(containerWidth, containerHeight),
241
246
  cornerX = _this$transformVisibl2.x,
242
247
  cornerY = _this$transformVisibl2.y;
243
- return new _mediaUi.Bounds(originX, originY, cornerX - originX, cornerY - originY);
248
+ return new _bounds.Bounds(originX, originY, cornerX - originX, cornerY - originY);
244
249
  }
245
250
  }, {
246
251
  key: "provideImageActions",
@@ -298,7 +303,7 @@ var ImagePlacer = exports.ImagePlacer = /*#__PURE__*/function (_React$Component)
298
303
  break;
299
304
  }
300
305
  _context.next = 1;
301
- return (0, _mediaUi.getFileInfo)(nextSrc);
306
+ return (0, _getFileInfo.getFileInfo)(nextSrc);
302
307
  case 1:
303
308
  fileInfo = _context.sent;
304
309
  case 2:
@@ -307,7 +312,7 @@ var ImagePlacer = exports.ImagePlacer = /*#__PURE__*/function (_React$Component)
307
312
  break;
308
313
  }
309
314
  _context.next = 3;
310
- return (0, _mediaUi.getFileInfoFromSrc)(nextSrc);
315
+ return (0, _getFileInfoFromSrc.getFileInfoFromSrc)(nextSrc);
311
316
  case 3:
312
317
  fileInfo = _context.sent;
313
318
  case 4:
@@ -347,7 +352,7 @@ var ImagePlacer = exports.ImagePlacer = /*#__PURE__*/function (_React$Component)
347
352
  previewInfo = _context2.sent;
348
353
  if (previewInfo) {
349
354
  width = previewInfo.width, height = previewInfo.height;
350
- this.imageSourceRect = new _mediaUi.Rectangle(width, height);
355
+ this.imageSourceRect = new _rectangle.Rectangle(width, height);
351
356
  this.setSrc(previewInfo.fileInfo);
352
357
  } else {
353
358
  /* TODO: i18n https://product-fabric.atlassian.net/browse/MS-1261 */
@@ -472,7 +477,7 @@ var ImagePlacer = exports.ImagePlacer = /*#__PURE__*/function (_React$Component)
472
477
  var _lastItemBounds$cente = lastItemBounds.center.sub(imageBounds.center),
473
478
  deltaX = _lastItemBounds$cente.x,
474
479
  deltaY = _lastItemBounds$cente.y;
475
- var origin = new _mediaUi.Vector2(originX + deltaX, originY + deltaY);
480
+ var origin = new _vector.Vector2(originX + deltaX, originY + deltaY);
476
481
  this.setState({
477
482
  zoom: newZoom,
478
483
  originX: origin.x,
@@ -15,7 +15,7 @@ var _avatarList = require("../avatar-list");
15
15
  var _showMoreHorizontal = _interopRequireDefault(require("@atlaskit/icon/core/show-more-horizontal"));
16
16
  var _standardButton = _interopRequireDefault(require("@atlaskit/button/standard-button"));
17
17
  var _reactIntl = require("react-intl");
18
- var _mediaUi = require("@atlaskit/media-ui");
18
+ var _messages = require("@atlaskit/media-ui/messages");
19
19
  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" != _typeof(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); }
20
20
  var predefinedAvatarsWrapperStyles = null;
21
21
  var showMoreButtonStyles = null;
@@ -37,7 +37,7 @@ var PredefinedAvatarList = exports.PredefinedAvatarList = /*#__PURE__*/(0, _reac
37
37
  onItemClick: onAvatarSelected,
38
38
  selectAvatarLabel: selectAvatarLabel
39
39
  }), /*#__PURE__*/React.createElement(_standardButton.default, {
40
- "aria-label": showMoreAvatarsButtonLabel || intl.formatMessage(_mediaUi.messages.show_more_avatars_btn_label),
40
+ "aria-label": showMoreAvatarsButtonLabel || intl.formatMessage(_messages.messages.show_more_avatars_btn_label),
41
41
  appearance: "subtle",
42
42
  iconAfter: /*#__PURE__*/React.createElement(_showMoreHorizontal.default, {
43
43
  label: "",
@@ -14,7 +14,7 @@ var _runtime = require("@compiled/react/runtime");
14
14
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
15
15
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
16
16
  var _reactIntl = require("react-intl");
17
- var _mediaUi = require("@atlaskit/media-ui");
17
+ var _messages = require("@atlaskit/media-ui/messages");
18
18
  var _arrowLeft = _interopRequireDefault(require("@atlaskit/icon/core/arrow-left"));
19
19
  var _standardButton = _interopRequireDefault(require("@atlaskit/button/standard-button"));
20
20
  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" != _typeof(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); }
@@ -81,7 +81,7 @@ var PredefinedAvatarView = exports.PredefinedAvatarView = /*#__PURE__*/(0, _reac
81
81
  }, /*#__PURE__*/React.createElement("div", {
82
82
  className: (0, _runtime.ax)(["_1e0c1txw _4cvr1h6o _ca0q1b66 _n3tdu2gc"])
83
83
  }, /*#__PURE__*/React.createElement(_standardButton.default, {
84
- "aria-label": intl.formatMessage(_mediaUi.messages.avatar_picker_back_btn_label),
84
+ "aria-label": intl.formatMessage(_messages.messages.avatar_picker_back_btn_label),
85
85
  iconAfter: /*#__PURE__*/React.createElement(_arrowLeft.default, {
86
86
  color: "currentColor",
87
87
  label: ""
@@ -91,9 +91,9 @@ var PredefinedAvatarView = exports.PredefinedAvatarView = /*#__PURE__*/(0, _reac
91
91
  className: (0, _runtime.ax)(["_2rko1i7s _19pkidpf _2hwxidpf _otyridpf _18u0idpf _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _1bsbzwfg _4t3izwfg _4cvr1h6o _1bah1h6o"])
92
92
  }), /*#__PURE__*/React.createElement("h2", {
93
93
  className: (0, _runtime.ax)(["_19pkidpf _2hwxidpf _otyridpf _18u0idpf _11c8fhey _19bvu2gc"])
94
- }, predefinedAvatarsText || /*#__PURE__*/React.createElement(_reactIntl.FormattedMessage, _mediaUi.messages.default_avatars))), /*#__PURE__*/React.createElement("div", {
94
+ }, predefinedAvatarsText || /*#__PURE__*/React.createElement(_reactIntl.FormattedMessage, _messages.messages.default_avatars))), /*#__PURE__*/React.createElement("div", {
95
95
  role: "radiogroup",
96
- "aria-label": selectAvatarLabel || intl.formatMessage(_mediaUi.messages.select_an_avatar),
96
+ "aria-label": selectAvatarLabel || intl.formatMessage(_messages.messages.select_an_avatar),
97
97
  className: (0, _runtime.ax)(["_2lx2vrvc _1n261g80 _19pkidpf _2hwxidpf _otyridpf _18u0idpf _1e0c1txw _1bsb1665 _c71lgrxc _18m91wug _ca0qu2gc _u5f3idpf _n3tdidpf _19bvidpf"])
98
98
  }, cards));
99
99
  });
@@ -8,7 +8,9 @@ exports.Viewport = exports.MAX_SCALE = exports.DEFAULT_WIDTH = exports.DEFAULT_M
8
8
  var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
9
9
  var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
10
10
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
11
- var _mediaUi = require("@atlaskit/media-ui");
11
+ var _rectangle = require("@atlaskit/media-ui/rectangle");
12
+ var _bounds = require("@atlaskit/media-ui/bounds");
13
+ var _vector = require("@atlaskit/media-ui/vector2");
12
14
  /**
13
15
  * maximum amount to allow scaling up from "100%"
14
16
  * - when the image is smaller than the view size, "100%" is the view size
@@ -43,9 +45,9 @@ var Viewport = exports.Viewport = /*#__PURE__*/function () {
43
45
  var height = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : DEFAULT_HEIGHT;
44
46
  var margin = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : DEFAULT_MARGIN;
45
47
  (0, _classCallCheck2.default)(this, Viewport);
46
- (0, _defineProperty2.default)(this, "itemSourceRect", new _mediaUi.Rectangle(0, 0));
47
- (0, _defineProperty2.default)(this, "dragStartPos", new _mediaUi.Vector2(0, 0));
48
- (0, _defineProperty2.default)(this, "itemBounds", new _mediaUi.Bounds(0, 0, 0, 0));
48
+ (0, _defineProperty2.default)(this, "itemSourceRect", new _rectangle.Rectangle(0, 0));
49
+ (0, _defineProperty2.default)(this, "dragStartPos", new _vector.Vector2(0, 0));
50
+ (0, _defineProperty2.default)(this, "itemBounds", new _bounds.Bounds(0, 0, 0, 0));
49
51
  (0, _defineProperty2.default)(this, "orientation", 1);
50
52
  this.width = width;
51
53
  this.height = height;
@@ -81,7 +83,7 @@ var Viewport = exports.Viewport = /*#__PURE__*/function () {
81
83
  if (itemBounds.left < innerBounds.left && itemBounds.right < innerBounds.right) {
82
84
  x += deltaRight;
83
85
  }
84
- this.itemBounds = new _mediaUi.Bounds(x, y, itemBounds.width, itemBounds.height);
86
+ this.itemBounds = new _bounds.Bounds(x, y, itemBounds.width, itemBounds.height);
85
87
  }
86
88
  }, {
87
89
  key: "innerBounds",
@@ -89,12 +91,12 @@ var Viewport = exports.Viewport = /*#__PURE__*/function () {
89
91
  var margin = this.margin,
90
92
  width = this.width,
91
93
  height = this.height;
92
- return new _mediaUi.Bounds(margin, margin, width - margin * 2, height - margin * 2);
94
+ return new _bounds.Bounds(margin, margin, width - margin * 2, height - margin * 2);
93
95
  }
94
96
  }, {
95
97
  key: "outerBounds",
96
98
  get: function get() {
97
- return new _mediaUi.Bounds(0, 0, this.width, this.height);
99
+ return new _bounds.Bounds(0, 0, this.width, this.height);
98
100
  }
99
101
  }, {
100
102
  key: "visibleSourceBounds",
@@ -102,13 +104,13 @@ var Viewport = exports.Viewport = /*#__PURE__*/function () {
102
104
  var innerBounds = this.innerBounds;
103
105
  var origin = this.viewToLocalPoint(0, 0);
104
106
  var corner = this.viewToLocalPoint(innerBounds.width, innerBounds.height);
105
- return new _mediaUi.Bounds(origin.x, origin.y, corner.x - origin.x, corner.y - origin.y);
107
+ return new _bounds.Bounds(origin.x, origin.y, corner.x - origin.x, corner.y - origin.y);
106
108
  }
107
109
  }, {
108
110
  key: "itemSourceBounds",
109
111
  get: function get() {
110
112
  var itemSourceRect = this.itemSourceRect;
111
- return new _mediaUi.Bounds(0, 0, itemSourceRect.width, itemSourceRect.height);
113
+ return new _bounds.Bounds(0, 0, itemSourceRect.width, itemSourceRect.height);
112
114
  }
113
115
  }, {
114
116
  key: "fittedItemBounds",
@@ -121,7 +123,7 @@ var Viewport = exports.Viewport = /*#__PURE__*/function () {
121
123
  var height = itemSourceRect.height * ratio;
122
124
  var x = margin + (innerBounds.width - width) * 0.5;
123
125
  var y = margin + (innerBounds.height - height) * 0.5;
124
- return new _mediaUi.Bounds(x, y, width, height);
126
+ return new _bounds.Bounds(x, y, width, height);
125
127
  }
126
128
  }, {
127
129
  key: "isEmpty",
@@ -147,19 +149,19 @@ var Viewport = exports.Viewport = /*#__PURE__*/function () {
147
149
  maxScale = this.maxScale;
148
150
  var maxWidth = fittedItemBounds.width * maxScale;
149
151
  var maxHeight = fittedItemBounds.height * maxScale;
150
- return new _mediaUi.Rectangle(maxWidth, maxHeight);
152
+ return new _rectangle.Rectangle(maxWidth, maxHeight);
151
153
  }
152
154
  }, {
153
155
  key: "clear",
154
156
  value: function clear() {
155
- this.itemBounds = new _mediaUi.Bounds(0, 0, 0, 0);
156
- this.itemSourceRect = new _mediaUi.Rectangle(0, 0);
157
+ this.itemBounds = new _bounds.Bounds(0, 0, 0, 0);
158
+ this.itemSourceRect = new _rectangle.Rectangle(0, 0);
157
159
  delete this.item;
158
160
  }
159
161
  }, {
160
162
  key: "setItemSize",
161
163
  value: function setItemSize(width, height) {
162
- this.itemSourceRect = new _mediaUi.Rectangle(width, height);
164
+ this.itemSourceRect = new _rectangle.Rectangle(width, height);
163
165
  this.zoomToFit();
164
166
  return this;
165
167
  }
@@ -184,12 +186,12 @@ var Viewport = exports.Viewport = /*#__PURE__*/function () {
184
186
  var floatingScale = clampedScale / 100;
185
187
  var width = fittedItemBounds.width + (maxItemViewRect.width - fittedItemBounds.width) * floatingScale;
186
188
  var height = fittedItemBounds.height + (maxItemViewRect.height - fittedItemBounds.height) * floatingScale;
187
- var scaledBounds = new _mediaUi.Bounds(itemBounds.x, itemBounds.y, width, height);
189
+ var scaledBounds = new _bounds.Bounds(itemBounds.x, itemBounds.y, width, height);
188
190
  var localCenterBefore = this.viewToLocalPoint(innerBounds.width * 0.5, innerBounds.height * 0.5);
189
191
  var center = itemBounds.center;
190
192
  var left = center.x - scaledBounds.width * 0.5;
191
193
  var top = center.y - scaledBounds.height * 0.5;
192
- this.itemBounds = new _mediaUi.Bounds(left, top, scaledBounds.width, scaledBounds.height);
194
+ this.itemBounds = new _bounds.Bounds(left, top, scaledBounds.width, scaledBounds.height);
193
195
  var localCenterAfter = this.viewToLocalPoint(innerBounds.width * 0.5, innerBounds.height * 0.5);
194
196
  this.itemBounds = this.itemBounds.translated(localCenterAfter.x - localCenterBefore.x, localCenterAfter.y - localCenterBefore.y);
195
197
  this.applyConstraints();
@@ -214,7 +216,7 @@ var Viewport = exports.Viewport = /*#__PURE__*/function () {
214
216
  itemBounds = this.itemBounds;
215
217
  var x = dragStartPos.x + xDelta;
216
218
  var y = dragStartPos.y + yDelta;
217
- this.itemBounds = new _mediaUi.Bounds(x, y, itemBounds.width, itemBounds.height);
219
+ this.itemBounds = new _bounds.Bounds(x, y, itemBounds.width, itemBounds.height);
218
220
  this.applyConstraints();
219
221
  return this;
220
222
  }
@@ -228,7 +230,7 @@ var Viewport = exports.Viewport = /*#__PURE__*/function () {
228
230
  var rect = itemBounds.rect;
229
231
  var localX = (offset.x + viewX) / rect.width;
230
232
  var localY = (offset.y + viewY) / rect.height;
231
- return new _mediaUi.Vector2(itemSourceRect.width * localX, itemSourceRect.height * localY);
233
+ return new _vector.Vector2(itemSourceRect.width * localX, itemSourceRect.height * localY);
232
234
  }
233
235
  }]);
234
236
  }();
@@ -3,9 +3,9 @@ import "./index.compiled.css";
3
3
  import * as React from 'react';
4
4
  import { ax, ix } from "@compiled/react/runtime";
5
5
  import { useIntl } from 'react-intl';
6
- import { messages } from '@atlaskit/media-ui';
6
+ import { messages } from '@atlaskit/media-ui/messages';
7
7
  import { useState } from 'react';
8
- import { fg } from '@atlaskit/platform-feature-flags';
8
+ import { fg } from '@atlaskit/platform-feature-flags/fg';
9
9
  const smallAvatarImageStyles = null;
10
10
  const avatarListWrapperStyles = null;
11
11
  const labelStyles = null;
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { useIntl } from 'react-intl';
3
3
  import VisuallyHidden from '@atlaskit/visually-hidden/visually-hidden';
4
4
  import { Mode } from './types';
5
- import { messages } from '@atlaskit/media-ui';
5
+ import { messages } from '@atlaskit/media-ui/messages';
6
6
  export const SRLiveTitle = ({
7
7
  mode
8
8
  }) => {
@@ -4,8 +4,8 @@ import * as React from 'react';
4
4
  import { ax, ix } from "@compiled/react/runtime";
5
5
  import { useRef, useEffect } from 'react';
6
6
  import ErrorIcon from '@atlaskit/icon/core/status-error';
7
- import Flag from '@atlaskit/flag';
8
- import { messages } from '@atlaskit/media-ui';
7
+ import Flag from '@atlaskit/flag/flag';
8
+ import { messages } from '@atlaskit/media-ui/messages';
9
9
  import { useIntl } from 'react-intl';
10
10
  const avatarPickerErrorStyles = null;
11
11
  export const SubmitErrorDialog = () => {
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { ModalSpinner } from '@atlaskit/media-ui';
2
+ import ModalSpinner from '@atlaskit/media-ui/modalSpinner';
3
3
  export const CustomSpinner = () => {
4
4
  return /*#__PURE__*/React.createElement(ModalSpinner, {
5
5
  blankedColor: `${"var(--ds-blanket, #050C1F75)"}`,
@@ -5,13 +5,20 @@ import "./index.compiled.css";
5
5
  import { ax, ix } from "@compiled/react/runtime";
6
6
  import React, { Fragment, createRef } from 'react';
7
7
  import { PureComponent } from 'react';
8
- import ModalDialog, { ModalBody, ModalFooter, ModalHeader, ModalTitle } from '@atlaskit/modal-dialog';
8
+ import ModalDialog from '@atlaskit/modal-dialog/modal-dialog';
9
+ import ModalBody from '@atlaskit/modal-dialog/modal-body';
10
+ import ModalFooter from '@atlaskit/modal-dialog/modal-footer';
11
+ import ModalHeader from '@atlaskit/modal-dialog/modal-header';
12
+ import ModalTitle from '@atlaskit/modal-dialog/modal-title';
9
13
  import Button from '@atlaskit/button/standard-button';
10
14
  import { FormattedMessage, IntlProvider, injectIntl } from 'react-intl';
11
- import { Field, HelperMessage } from '@atlaskit/form';
12
- import { fileToDataURI, dataURItoFile, messages } from '@atlaskit/media-ui';
15
+ import Field from '@atlaskit/form/field';
16
+ import { HelperMessage } from '@atlaskit/form/helper-message';
17
+ import { fileToDataURI } from '@atlaskit/media-ui/fileToDataURI';
18
+ import { dataURItoFile } from '@atlaskit/media-ui/dataURItoFile';
19
+ import { messages } from '@atlaskit/media-ui/messages';
13
20
  import { Box } from '@atlaskit/primitives/compiled';
14
- import Textfield from '@atlaskit/textfield';
21
+ import Textfield from '@atlaskit/textfield/text-field';
15
22
  import ImageNavigator from '../image-navigator';
16
23
  import { PredefinedAvatarList } from '../predefined-avatar-list';
17
24
  import { PredefinedAvatarView } from '../predefined-avatar-view';
@@ -1,4 +1,4 @@
1
- import { Rectangle } from '@atlaskit/media-ui';
1
+ import { Rectangle } from '@atlaskit/media-ui/rectangle';
2
2
  export const DEFAULT_VISIBLE_PREDEFINED_AVATARS = 5;
3
3
  export const AVATAR_DIALOG_WIDTH = 375;
4
4
  export const AVATAR_DIALOG_HEIGHT = 470;
@@ -1,4 +1,4 @@
1
- import { isRotated } from '@atlaskit/media-ui';
1
+ import { isRotated } from '@atlaskit/media-ui/imageMetaData/isRotated';
2
2
  import { getCanvas } from '../util';
3
3
  const CONTAINER_PADDING = 28;
4
4
  export const cropToDataURI = (imageElement, imageRect, cropRect, scale, imageOrientation) => {
@@ -7,9 +7,10 @@ import React from 'react';
7
7
  import { Component } from 'react';
8
8
  import CrossIcon from '@atlaskit/icon/core/cross';
9
9
  import { injectIntl } from 'react-intl';
10
- import { messages, MediaImage } from '@atlaskit/media-ui';
10
+ import { messages } from '@atlaskit/media-ui/messages';
11
+ import { MediaImage } from '@atlaskit/media-ui/mediaImage';
11
12
  import { isImageRemote } from './isImageRemote';
12
- import { IconButton } from '@atlaskit/button/new';
13
+ import IconButton from '@atlaskit/button/icon/button';
13
14
  import { Box } from '@atlaskit/primitives/compiled';
14
15
  import { cx } from '@atlaskit/css';
15
16
  import { ERROR } from '../avatar-picker-dialog';
@@ -7,8 +7,14 @@ import { Component } from 'react';
7
7
  import { FormattedMessage, injectIntl } from 'react-intl';
8
8
  import Button from '@atlaskit/button/standard-button';
9
9
  import ImageCropper from '../image-cropper';
10
- import Spinner from '@atlaskit/spinner';
11
- import { fileToDataURI, dataURItoFile, getOrientation, isRotated, Ellipsify, Vector2, messages } from '@atlaskit/media-ui';
10
+ import Spinner from '@atlaskit/spinner/spinner';
11
+ import { fileToDataURI } from '@atlaskit/media-ui/fileToDataURI';
12
+ import { dataURItoFile } from '@atlaskit/media-ui/dataURItoFile';
13
+ import { getOrientation } from '@atlaskit/media-ui/imageMetaData/getOrientation';
14
+ import { isRotated } from '@atlaskit/media-ui/imageMetaData/isRotated';
15
+ import { Ellipsify } from '@atlaskit/media-ui/ellipsify/ellipsify';
16
+ import { Vector2 } from '@atlaskit/media-ui/vector2';
17
+ import { messages } from '@atlaskit/media-ui/messages';
12
18
  import * as exenv from 'exenv';
13
19
  import { uploadPlaceholder, errorIcon } from './images';
14
20
  import { fileSizeMb } from '../util';
@@ -4,8 +4,8 @@ import "./slider.compiled.css";
4
4
  import * as React from 'react';
5
5
  import { ax, ix } from "@compiled/react/runtime";
6
6
  import { Component } from 'react';
7
- import FieldRange from '@atlaskit/range';
8
- import { messages } from '@atlaskit/media-ui';
7
+ import FieldRange from '@atlaskit/range/range';
8
+ import { messages } from '@atlaskit/media-ui/messages';
9
9
  import ScaleLargeIcon from '@atlaskit/icon/core/image';
10
10
  import ScaleSmallIcon from '@atlaskit/icon/core/image';
11
11
  import Button from '@atlaskit/button/standard-button';
@@ -1,4 +1,5 @@
1
- import { Rectangle, Vector2 } from '@atlaskit/media-ui';
1
+ import { Rectangle } from '@atlaskit/media-ui/rectangle';
2
+ import { Vector2 } from '@atlaskit/media-ui/vector2';
2
3
  export function zoomToFit(imageWidth, imageHeight, visibleBounds) {
3
4
  const itemRect = new Rectangle(imageWidth, imageHeight);
4
5
  const scaleFactor = itemRect.scaleToFitSmallestSide(visibleBounds);
@@ -4,7 +4,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
4
4
  * This way, you can still move the image without clicking directly on it.
5
5
  */
6
6
  import React from 'react';
7
- import { Vector2 } from '@atlaskit/media-ui';
7
+ import { Vector2 } from '@atlaskit/media-ui/vector2';
8
8
  import { ContainerWrapper } from './containerWrapper';
9
9
  export class ImagePlacerContainer extends React.Component {
10
10
  constructor(...args) {
@@ -1,4 +1,6 @@
1
- import { Rectangle, loadImage, getOrientation } from '@atlaskit/media-ui';
1
+ import { Rectangle } from '@atlaskit/media-ui/rectangle';
2
+ import { loadImage } from '@atlaskit/media-ui/loadImage';
3
+ import { getOrientation } from '@atlaskit/media-ui/imageMetaData/getOrientation';
2
4
  import { getCanvas } from '../util';
3
5
  export function radians(deg) {
4
6
  return deg * (Math.PI / 180);
@@ -4,7 +4,7 @@ import "./imageWrapper.compiled.css";
4
4
  import * as React from 'react';
5
5
  import { ax, ix } from "@compiled/react/runtime";
6
6
  import { useIntl } from 'react-intl';
7
- import { messages } from '@atlaskit/media-ui';
7
+ import { messages } from '@atlaskit/media-ui/messages';
8
8
  const imageWrapperStyles = null;
9
9
  export const ImageWrapper = ({
10
10
  x,
@@ -3,7 +3,12 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
3
  import "./index.compiled.css";
4
4
  import { ax, ix } from "@compiled/react/runtime";
5
5
  import React from 'react';
6
- import { Rectangle, Vector2, Bounds, dataURItoFile, getFileInfo, getFileInfoFromSrc } from '@atlaskit/media-ui';
6
+ import { Rectangle } from '@atlaskit/media-ui/rectangle';
7
+ import { Vector2 } from '@atlaskit/media-ui/vector2';
8
+ import { Bounds } from '@atlaskit/media-ui/bounds';
9
+ import { dataURItoFile } from '@atlaskit/media-ui/dataURItoFile';
10
+ import { getFileInfo } from '@atlaskit/media-ui/getFileInfo';
11
+ import { getFileInfoFromSrc } from '@atlaskit/media-ui/getFileInfoFromSrc';
7
12
  import { ImagePlacerContainer } from './container';
8
13
  import { ImagePlacerImage } from './image';
9
14
  import { Margin } from './margin';
@@ -6,7 +6,7 @@ import { AvatarList } from '../avatar-list';
6
6
  import EditorMoreIcon from '@atlaskit/icon/core/show-more-horizontal';
7
7
  import Button from '@atlaskit/button/standard-button';
8
8
  import { useIntl } from 'react-intl';
9
- import { messages } from '@atlaskit/media-ui';
9
+ import { messages } from '@atlaskit/media-ui/messages';
10
10
  import { forwardRef } from 'react';
11
11
  const predefinedAvatarsWrapperStyles = null;
12
12
  const showMoreButtonStyles = null;
@@ -3,7 +3,7 @@ import "./index.compiled.css";
3
3
  import * as React from 'react';
4
4
  import { ax, ix } from "@compiled/react/runtime";
5
5
  import { FormattedMessage, useIntl } from 'react-intl';
6
- import { messages } from '@atlaskit/media-ui';
6
+ import { messages } from '@atlaskit/media-ui/messages';
7
7
  import ArrowLeftIcon from '@atlaskit/icon/core/arrow-left';
8
8
  import Button from '@atlaskit/button/standard-button';
9
9
  import { forwardRef, useState } from 'react';
@@ -1,5 +1,7 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
- import { Rectangle, Bounds, Vector2 } from '@atlaskit/media-ui';
2
+ import { Rectangle } from '@atlaskit/media-ui/rectangle';
3
+ import { Bounds } from '@atlaskit/media-ui/bounds';
4
+ import { Vector2 } from '@atlaskit/media-ui/vector2';
3
5
 
4
6
  /**
5
7
  * maximum amount to allow scaling up from "100%"
@@ -7,9 +7,9 @@ import { ax, ix } from "@compiled/react/runtime";
7
7
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
8
8
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
9
9
  import { useIntl } from 'react-intl';
10
- import { messages } from '@atlaskit/media-ui';
10
+ import { messages } from '@atlaskit/media-ui/messages';
11
11
  import { useState } from 'react';
12
- import { fg } from '@atlaskit/platform-feature-flags';
12
+ import { fg } from '@atlaskit/platform-feature-flags/fg';
13
13
  var smallAvatarImageStyles = null;
14
14
  var avatarListWrapperStyles = null;
15
15
  var labelStyles = null;
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { useIntl } from 'react-intl';
3
3
  import VisuallyHidden from '@atlaskit/visually-hidden/visually-hidden';
4
4
  import { Mode } from './types';
5
- import { messages } from '@atlaskit/media-ui';
5
+ import { messages } from '@atlaskit/media-ui/messages';
6
6
  export var SRLiveTitle = function SRLiveTitle(_ref) {
7
7
  var mode = _ref.mode;
8
8
  var intl = useIntl();
@@ -4,8 +4,8 @@ import * as React from 'react';
4
4
  import { ax, ix } from "@compiled/react/runtime";
5
5
  import { useRef, useEffect } from 'react';
6
6
  import ErrorIcon from '@atlaskit/icon/core/status-error';
7
- import Flag from '@atlaskit/flag';
8
- import { messages } from '@atlaskit/media-ui';
7
+ import Flag from '@atlaskit/flag/flag';
8
+ import { messages } from '@atlaskit/media-ui/messages';
9
9
  import { useIntl } from 'react-intl';
10
10
  var avatarPickerErrorStyles = null;
11
11
  export var SubmitErrorDialog = function SubmitErrorDialog() {
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { ModalSpinner } from '@atlaskit/media-ui';
2
+ import ModalSpinner from '@atlaskit/media-ui/modalSpinner';
3
3
  export var CustomSpinner = function CustomSpinner() {
4
4
  return /*#__PURE__*/React.createElement(ModalSpinner, {
5
5
  blankedColor: "var(--ds-blanket, #050C1F75)",
@@ -14,13 +14,20 @@ function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstruct
14
14
  function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
15
15
  import React, { Fragment, createRef } from 'react';
16
16
  import { PureComponent } from 'react';
17
- import ModalDialog, { ModalBody, ModalFooter, ModalHeader, ModalTitle } from '@atlaskit/modal-dialog';
17
+ import ModalDialog from '@atlaskit/modal-dialog/modal-dialog';
18
+ import ModalBody from '@atlaskit/modal-dialog/modal-body';
19
+ import ModalFooter from '@atlaskit/modal-dialog/modal-footer';
20
+ import ModalHeader from '@atlaskit/modal-dialog/modal-header';
21
+ import ModalTitle from '@atlaskit/modal-dialog/modal-title';
18
22
  import Button from '@atlaskit/button/standard-button';
19
23
  import { FormattedMessage, IntlProvider, injectIntl } from 'react-intl';
20
- import { Field, HelperMessage } from '@atlaskit/form';
21
- import { fileToDataURI, dataURItoFile, messages } from '@atlaskit/media-ui';
24
+ import Field from '@atlaskit/form/field';
25
+ import { HelperMessage } from '@atlaskit/form/helper-message';
26
+ import { fileToDataURI } from '@atlaskit/media-ui/fileToDataURI';
27
+ import { dataURItoFile } from '@atlaskit/media-ui/dataURItoFile';
28
+ import { messages } from '@atlaskit/media-ui/messages';
22
29
  import { Box } from '@atlaskit/primitives/compiled';
23
- import Textfield from '@atlaskit/textfield';
30
+ import Textfield from '@atlaskit/textfield/text-field';
24
31
  import ImageNavigator from '../image-navigator';
25
32
  import { PredefinedAvatarList } from '../predefined-avatar-list';
26
33
  import { PredefinedAvatarView } from '../predefined-avatar-view';
@@ -1,4 +1,4 @@
1
- import { Rectangle } from '@atlaskit/media-ui';
1
+ import { Rectangle } from '@atlaskit/media-ui/rectangle';
2
2
  export var DEFAULT_VISIBLE_PREDEFINED_AVATARS = 5;
3
3
  export var AVATAR_DIALOG_WIDTH = 375;
4
4
  export var AVATAR_DIALOG_HEIGHT = 470;
@@ -1,4 +1,4 @@
1
- import { isRotated } from '@atlaskit/media-ui';
1
+ import { isRotated } from '@atlaskit/media-ui/imageMetaData/isRotated';
2
2
  import { getCanvas } from '../util';
3
3
  var CONTAINER_PADDING = 28;
4
4
  export var cropToDataURI = function cropToDataURI(imageElement, imageRect, cropRect, scale, imageOrientation) {