@atlaskit/avatar - npm Package Compare versions

Comparing version 21.0.3 to 21.1.0

CHANGELOG.md

 # @atlaskit/avatar
 
+## 21.1.0
+
+### Minor Changes
+
+- [`c1d012d6d20`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c1d012d6d20) - Updates `@emotion/core` to `@emotion/react`; v10 to v11. There is no expected behaviour change.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 21.0.3
@@ -4,0 +14,0 @@

dist/cjs/Avatar.js

@@ -18,3 +18,3 @@ "use strict";
 
-var _core = require("@emotion/core");
+var _react2 = require("@emotion/react");
 
@@ -42,3 +42,3 @@ var _analyticsNext = require("@atlaskit/analytics-next");
 var packageName = "@atlaskit/avatar";
-var packageVersion = "21.0.3";
+var packageVersion = "21.1.0";
 
@@ -159,3 +159,3 @@ var getStyles = function getStyles(css, _ref) {
 
-  return (0, _core.jsx)("div", {
+  return (0, _react2.jsx)("div", {
     "data-testid": testId,
@@ -168,3 +168,3 @@ style: {
     }
-  }, (0, _core.jsx)(_core.ClassNames, null, function (_ref3) {
+  }, (0, _react2.jsx)(_react2.ClassNames, null, function (_ref3) {
     var css = _ref3.css;
@@ -185,3 +185,3 @@
     }), {}, {
-      children: (0, _core.jsx)(_AvatarImage.default, {
+      children: (0, _react2.jsx)(_AvatarImage.default, {
         alt: name,
@@ -197,3 +197,3 @@ appearance: appearance,
     return children ? children(props) : /*#__PURE__*/(0, _react.createElement)((0, _utilities.getCustomElement)(isDisabled, href, onClick), props);
-  }), isValidIconSize && presence && !status && (0, _core.jsx)(_Presence.PresenceWrapper, {
+  }), isValidIconSize && presence && !status && (0, _react2.jsx)(_Presence.PresenceWrapper, {
     appearance: appearance,
@@ -203,3 +203,3 @@ size: size,
     testId: testId
-  }, customPresenceNode), isValidIconSize && status && (0, _core.jsx)(_Status.StatusWrapper, {
+  }, customPresenceNode), isValidIconSize && status && (0, _react2.jsx)(_Status.StatusWrapper, {
     appearance: appearance,
@@ -206,0 +206,0 @@ size: size,

dist/cjs/AvatarImage.js

@@ -14,3 +14,3 @@ "use strict";
 
-var _core = require("@emotion/core");
+var _react2 = require("@emotion/react");
 
@@ -31,3 +31,3 @@ var _person = _interopRequireDefault(require("@atlaskit/icon/glyph/person"));
 exports.ICON_COLOR = ICON_COLOR;
-var avatarDefaultIconStyles = (0, _core.css)({
+var avatarDefaultIconStyles = (0, _react2.css)({
   display: 'block',
@@ -38,3 +38,3 @@ width: '100%',
 });
-var avatarImageStyles = (0, _core.css)({
+var avatarImageStyles = (0, _react2.css)({
   display: 'flex',
@@ -71,3 +71,3 @@ width: '100%',
   if (!src || hasImageErrored) {
-    return (0, _core.jsx)("span", {
+    return (0, _react2.jsx)("span", {
       css: [avatarDefaultIconStyles, // TODO: These dynamic SVG styles can't be set in 'style'. On a refactor, use a css custom property to pass down the size
@@ -81,3 +81,3 @@ // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
       }]
-    }, appearance === 'circle' ? (0, _core.jsx)(_person.default, {
+    }, appearance === 'circle' ? (0, _react2.jsx)(_person.default, {
       label: alt,
@@ -87,3 +87,3 @@ primaryColor: ICON_BACKGROUND,
       testId: testId && "".concat(testId, "--person")
-    }) : (0, _core.jsx)(_ship.default, {
+    }) : (0, _react2.jsx)(_ship.default, {
       label: alt,
@@ -96,3 +96,3 @@ primaryColor: ICON_BACKGROUND,
 
-  return (0, _core.jsx)("img", {
+  return (0, _react2.jsx)("img", {
     src: src,
@@ -99,0 +99,0 @@ alt: alt,

dist/cjs/AvatarItem.js

@@ -16,3 +16,3 @@ "use strict";
 
-var _core = require("@emotion/core");
+var _react2 = require("@emotion/react");
 
@@ -35,3 +35,3 @@ var _colors = require("@atlaskit/theme/colors");
 
-var avatarItemStyles = (0, _core.css)({
+var avatarItemStyles = (0, _react2.css)({
   minWidth: 0,
@@ -98,3 +98,3 @@ maxWidth: '100%',
 
-  return (0, _core.jsx)(_core.ClassNames, null, function (_ref3) {
+  return (0, _react2.jsx)(_react2.ClassNames, null, function (_ref3) {
     var css = _ref3.css;
@@ -112,7 +112,7 @@
     }), {}, {
-      children: (0, _core.jsx)(_react.Fragment, null, avatar, (0, _core.jsx)("div", {
+      children: (0, _react2.jsx)(_react.Fragment, null, avatar, (0, _react2.jsx)("div", {
         css: avatarItemStyles
-      }, (0, _core.jsx)(_Text.default, {
+      }, (0, _react2.jsx)(_Text.default, {
         shouldTruncate: !isTruncationDisabled
-      }, primaryText), (0, _core.jsx)(_Text.default, {
+      }, primaryText), (0, _react2.jsx)(_Text.default, {
         isSecondary: true,
@@ -119,0 +119,0 @@ shouldTruncate: !isTruncationDisabled

dist/cjs/IconWrapper.js

@@ -8,3 +8,3 @@ "use strict";
 
-var _core = require("@emotion/core");
+var _react = require("@emotion/react");
 
@@ -17,3 +17,3 @@ var _colors = require("@atlaskit/theme/colors");
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-var iconWrapperStyles = (0, _core.css)({
+var iconWrapperStyles = (0, _react.css)({
   display: 'flex',
@@ -38,3 +38,3 @@ boxSizing: 'border-box',
       children = _ref.children;
-  return (0, _core.jsx)("span", {
+  return (0, _react.jsx)("span", {
     css: iconWrapperStyles,
@@ -41,0 +41,0 @@ style: {

dist/cjs/Skeleton.js

@@ -8,3 +8,3 @@ "use strict";
 
-var _core = require("@emotion/core");
+var _react = require("@emotion/react");
 
@@ -24,11 +24,11 @@ var _constants = require("./constants");
       weight = _ref$weight === void 0 ? 'normal' : _ref$weight;
-  return {
+  return (0, _react.css)({
+    display: 'inline-block',
     width: "".concat(_constants.AVATAR_SIZES[size], "px"),
     height: "".concat(_constants.AVATAR_SIZES[size], "px"),
-    display: 'inline-block',
-    borderRadius: "".concat(appearance === 'square' ? "".concat(_constants.AVATAR_RADIUS[size], "px") : '50%'),
     backgroundColor: color,
     border: "".concat(_constants.BORDER_WIDTH, "px solid transparent"),
+    borderRadius: "".concat(appearance === 'square' ? "".concat(_constants.AVATAR_RADIUS[size], "px") : '50%'),
     opacity: "".concat(weight === 'strong' ? 0.3 : 0.15)
-  };
+  });
 };
@@ -50,3 +50,3 @@ /**
       weight = _ref2.weight;
-  return (0, _core.jsx)("div", {
+  return (0, _react.jsx)("div", {
     // TODO: Refactor styles to follow css prop rules
@@ -53,0 +53,0 @@ // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage

dist/cjs/Text.js

@@ -12,3 +12,3 @@ "use strict";
 
-var _core = require("@emotion/core");
+var _react = require("@emotion/react");
 
@@ -22,3 +22,3 @@ var _colors = require("@atlaskit/theme/colors");
 var getStyles = function getStyles(isSecondary, shouldTruncate) {
-  return _objectSpread(_objectSpread({
+  return (0, _react.css)(_objectSpread(_objectSpread({
     display: 'block',
@@ -34,3 +34,3 @@ margin: 0,
     fontSize: '0.85em'
-  });
+  }));
 };
@@ -50,3 +50,3 @@ /**
     // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
-    (0, _core.jsx)("span", {
+    (0, _react.jsx)("span", {
       css: getStyles(isSecondary, shouldTruncate)
@@ -53,0 +53,0 @@ }, children)

dist/cjs/version.json

 {
 	"name": "@atlaskit/avatar",
-	"version": "21.0.3",
+	"version": "21.1.0",
 	"sideEffects": false
 }

dist/es2019/Avatar.js

 /** @jsx jsx */
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 import { createElement, forwardRef, useCallback, useEffect, useRef } from 'react';
-import { ClassNames, jsx } from '@emotion/core';
+import { ClassNames, jsx } from '@emotion/react';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
@@ -13,3 +13,3 @@ import { B300, N0, N70A } from '@atlaskit/theme/colors';
 const packageName = "@atlaskit/avatar";
-const packageVersion = "21.0.3";
+const packageVersion = "21.1.0";
 
@@ -16,0 +16,0 @@ const getStyles = (css, {

dist/es2019/AvatarImage.js

 /** @jsx jsx */
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 import { useEffect, useState } from 'react';
-import { css, jsx } from '@emotion/core';
+import { css, jsx } from '@emotion/react';
 import PersonIcon from '@atlaskit/icon/glyph/person';
@@ -6,0 +6,0 @@ import ShipIcon from '@atlaskit/icon/glyph/ship';

dist/es2019/AvatarItem.js

 /** @jsx jsx */
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 import { createElement, forwardRef, Fragment } from 'react';
-import { ClassNames, css, jsx } from '@emotion/core';
+import { ClassNames, css, jsx } from '@emotion/react';
 import { B200, backgroundActive, backgroundHover } from '@atlaskit/theme/colors';
@@ -6,0 +6,0 @@ import { borderRadius, gridSize } from '@atlaskit/theme/constants';

dist/es2019/IconWrapper.js

 /** @jsx jsx */
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-import { css, jsx } from '@emotion/core';
+import { css, jsx } from '@emotion/react';
 import { background } from '@atlaskit/theme/colors';
@@ -5,0 +5,0 @@ import { BORDER_WIDTH } from './constants';

dist/es2019/Skeleton.js

 /** @jsx jsx */
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-import { jsx } from '@emotion/core';
+import { css, jsx } from '@emotion/react';
 import { AVATAR_RADIUS, AVATAR_SIZES, BORDER_WIDTH } from './constants';
@@ -11,9 +11,9 @@
   weight = 'normal'
-}) => ({
+}) => css({
+  display: 'inline-block',
   width: `${AVATAR_SIZES[size]}px`,
   height: `${AVATAR_SIZES[size]}px`,
-  display: 'inline-block',
-  borderRadius: `${appearance === 'square' ? `${AVATAR_RADIUS[size]}px` : '50%'}`,
   backgroundColor: color,
   border: `${BORDER_WIDTH}px solid transparent`,
+  borderRadius: `${appearance === 'square' ? `${AVATAR_RADIUS[size]}px` : '50%'}`,
   opacity: `${weight === 'strong' ? 0.3 : 0.15}`
@@ -20,0 +20,0 @@ });

dist/es2019/Text.js

 /** @jsx jsx */
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-import { jsx } from '@emotion/core';
+import { css, jsx } from '@emotion/react';
 import { N200, N900 } from '@atlaskit/theme/colors';
 
-const getStyles = (isSecondary, shouldTruncate) => ({
+const getStyles = (isSecondary, shouldTruncate) => css({
   display: 'block',
@@ -8,0 +8,0 @@ margin: 0,

dist/es2019/version.json

 {
 	"name": "@atlaskit/avatar",
-	"version": "21.0.3",
+	"version": "21.1.0",
 	"sideEffects": false
 }

dist/esm/Avatar.js

@@ -14,3 +14,3 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { createElement, forwardRef, useCallback, useEffect, useRef } from 'react';
-import { ClassNames, jsx } from '@emotion/core';
+import { ClassNames, jsx } from '@emotion/react';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
@@ -24,3 +24,3 @@ import { B300, N0, N70A } from '@atlaskit/theme/colors';
 var packageName = "@atlaskit/avatar";
-var packageVersion = "21.0.3";
+var packageVersion = "21.1.0";
 
@@ -27,0 +27,0 @@ var getStyles = function getStyles(css, _ref) {

dist/esm/AvatarImage.js

@@ -6,3 +6,3 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import { useEffect, useState } from 'react';
-import { css, jsx } from '@emotion/core';
+import { css, jsx } from '@emotion/react';
 import PersonIcon from '@atlaskit/icon/glyph/person';
@@ -9,0 +9,0 @@ import ShipIcon from '@atlaskit/icon/glyph/ship';

dist/esm/AvatarItem.js

@@ -13,3 +13,3 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { createElement, forwardRef, Fragment } from 'react';
-import { ClassNames, css, jsx } from '@emotion/core';
+import { ClassNames, css, jsx } from '@emotion/react';
 import { B200, backgroundActive, backgroundHover } from '@atlaskit/theme/colors';
@@ -16,0 +16,0 @@ import { borderRadius, gridSize } from '@atlaskit/theme/constants';

dist/esm/IconWrapper.js

 /** @jsx jsx */
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-import { css, jsx } from '@emotion/core';
+import { css, jsx } from '@emotion/react';
 import { background } from '@atlaskit/theme/colors';
@@ -5,0 +5,0 @@ import { BORDER_WIDTH } from './constants';

dist/esm/Skeleton.js

 /** @jsx jsx */
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-import { jsx } from '@emotion/core';
+import { css, jsx } from '@emotion/react';
 import { AVATAR_RADIUS, AVATAR_SIZES, BORDER_WIDTH } from './constants';
@@ -15,11 +15,11 @@
       weight = _ref$weight === void 0 ? 'normal' : _ref$weight;
-  return {
+  return css({
+    display: 'inline-block',
     width: "".concat(AVATAR_SIZES[size], "px"),
     height: "".concat(AVATAR_SIZES[size], "px"),
-    display: 'inline-block',
-    borderRadius: "".concat(appearance === 'square' ? "".concat(AVATAR_RADIUS[size], "px") : '50%'),
     backgroundColor: color,
     border: "".concat(BORDER_WIDTH, "px solid transparent"),
+    borderRadius: "".concat(appearance === 'square' ? "".concat(AVATAR_RADIUS[size], "px") : '50%'),
     opacity: "".concat(weight === 'strong' ? 0.3 : 0.15)
-  };
+  });
 };
@@ -26,0 +26,0 @@ /**

dist/esm/Text.js

@@ -9,7 +9,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-import { jsx } from '@emotion/core';
+import { css, jsx } from '@emotion/react';
 import { N200, N900 } from '@atlaskit/theme/colors';
 
 var getStyles = function getStyles(isSecondary, shouldTruncate) {
-  return _objectSpread(_objectSpread({
+  return css(_objectSpread(_objectSpread({
     display: 'block',
@@ -25,3 +25,3 @@ margin: 0,
     fontSize: '0.85em'
-  });
+  }));
 };
@@ -28,0 +28,0 @@ /**

dist/esm/version.json

 {
 	"name": "@atlaskit/avatar",
-	"version": "21.0.3",
+	"version": "21.1.0",
 	"sideEffects": false
 }

package.json

 {
   "name": "@atlaskit/avatar",
-  "version": "21.0.3",
+  "version": "21.1.0",
   "description": "An avatar is a visual representation of a user or entity.",
@@ -43,7 +43,8 @@ "publishConfig": {
     "@atlaskit/analytics-next": "^8.0.0",
-    "@atlaskit/icon": "^21.10.0",
+    "@atlaskit/icon": "^21.11.0",
     "@atlaskit/theme": "^12.2.0",
     "@atlaskit/tokens": "^0.10.0",
     "@babel/runtime": "^7.0.0",
-    "@emotion/core": "^10.0.9"
+    "@emotion/react": "^11.7.1",
+    "@emotion/serialize": "^1.1.0"
   },
@@ -58,7 +59,7 @@ "peerDependencies": {
     "@atlaskit/field-base": "^15.0.0",
-    "@atlaskit/icon": "^21.10.0",
-    "@atlaskit/section-message": "^6.2.0",
+    "@atlaskit/icon": "^21.11.0",
+    "@atlaskit/section-message": "^6.3.0",
     "@atlaskit/ssr": "*",
     "@atlaskit/toggle": "^12.5.0",
-    "@atlaskit/tooltip": "^17.5.0",
+    "@atlaskit/tooltip": "^17.6.0",
     "@atlaskit/visual-regression": "*",
@@ -65,0 +66,0 @@ "@atlaskit/webdriver-runner": "*",

report.api.md

@@ -1,5 +0,7 @@
-## API Report File for "@atlaskit/avatar"
+## API Report File for "@atlaskit/avatar".
 
-> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
+> Do not edit this file. This report is auto-generated by [API Extractor](https://api-extractor.com/).
 
+[Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
+
 ```ts
@@ -6,0 +8,0 @@ /// <reference types="react" />

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

228739

increased by0.24%

Worsened metrics

Dependency count

8

increased by14.29%

Dependency changes

• + Added@emotion/react@^11.7.1

• + Added@emotion/serialize@^1.1.0

• - Removed@emotion/core@^10.0.9

• - Removed@emotion/cache@10.0.29(transitive)

• - Removed@emotion/core@10.3.1(transitive)

• - Removed@emotion/css@10.0.27(transitive)

• - Removed@emotion/hash@0.8.0(transitive)

• - Removed@emotion/memoize@0.7.4(transitive)

• - Removed@emotion/serialize@0.11.16(transitive)

• - Removed@emotion/sheet@0.9.4(transitive)

• - Removed@emotion/stylis@0.8.5(transitive)

• - Removed@emotion/unitless@0.7.5(transitive)

• - Removed@emotion/utils@0.11.3(transitive)

• - Removed@emotion/weak-memoize@0.2.5(transitive)

• - Removedbabel-plugin-emotion@10.2.2(transitive)

• - Removedbabel-plugin-macros@2.8.0(transitive)

• - Removedbabel-plugin-syntax-jsx@6.18.0(transitive)

• - Removedcosmiconfig@6.0.0(transitive)

• - Removedcsstype@2.6.21(transitive)

• Updated@atlaskit/icon@^21.11.0