@atlaskit/media-avatar-picker 24.6.5 → 24.6.7

package/dist/esm/image-navigator/styles.js

@@ -1,38 +1,52 @@
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, keyframes } from '@emotion/react';
 import { N200 } from '@atlaskit/theme/colors';
 import { checkeredBg } from './images';
 import { AVATAR_DIALOG_WIDTH } from '../avatar-picker-dialog/layout-const';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var imageBgStyles = css({
   position: 'absolute',
   top: 0,
   left: 0,
   width: '256px',
   height: '256px',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   background: "url('".concat(checkeredBg, "')"),
   borderRadius: "var(--ds-border-radius, 3px)"
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var containerStyles = css({
   boxSizing: 'border-box',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '*, *::before, *::after': {
     boxSizing: 'border-box'
   },
   position: 'relative'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var sliderContainerStyles = css({
   alignItems: 'center',
   justifyContent: 'center',
   display: 'flex',
   flexDirection: 'row',
   marginTop: "var(--ds-space-100, 8px)",
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   input: {
     boxSizing: 'content-box',
     padding: 0
   },
   backgroundColor: "var(--ds-surface-overlay, #fff)"
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var fileInputStyles = css({
   display: 'none'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var imageUploaderStyles = css({
   display: 'flex',
   flexDirection: 'column',
@@ -58,6 +72,7 @@ var getBorder = function getBorder(showBorder) {
 var getDroppingAnimation = function getDroppingAnimation(isDroppingFile) {
   return isDroppingFile ? css({
     backgroundColor: "var(--ds-background-information-hovered, #ddecfe)",
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     '&:after': droppingAnimation
   }) : '';
 };
@@ -75,6 +90,7 @@ export var dragZoneStyles = function dragZoneStyles(props) {
     transition: 'background-color 0.3s cubic-bezier(0.215, 0.61, 0.355, 1)',
     '&::after': {
       content: "''",
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
       border: getBorder(props.showBorder),
       borderRadius: '100%',
       position: 'absolute',
@@ -84,9 +100,13 @@ export var dragZoneStyles = function dragZoneStyles(props) {
       height: '100%',
       transition: 'border-color 0.3s cubic-bezier(0.19, 1, 0.22, 1)'
     }
-  }, getDroppingAnimation(props.isDroppingFile));
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  getDroppingAnimation(props.isDroppingFile));
 };
 dragZoneStyles.displayName = 'DragZone';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var dragZoneImageStyles = css({
   width: '100px'
 });
@@ -97,8 +117,12 @@ export var dragZoneTextStyles = function dragZoneTextStyles(props) {
   return css({
     textAlign: 'center',
     color: "var(--ds-text-subtlest, ".concat(N200, ")")
-  }, getWidth(props.isFullSize));
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  getWidth(props.isFullSize));
 };
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var selectionBlockerStyles = css({
   position: 'fixed',
   left: 0,
@@ -108,15 +132,21 @@ export var selectionBlockerStyles = css({
   backgroundColor: 'transparent',
   userSelect: 'none'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var paddedBreakStyles = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles -- Ignored via go/DSP-18766
   marginTop: "var(--ds-space-100, 10px)".concat(" !important"),
   marginBottom: "var(--ds-space-100, 10px)",
   textAlign: 'center'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var sliderWrapperStyles = css({
   display: 'flex',
   alignItems: 'center',
   width: '100%',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '.zoom_button svg': {
     position: 'relative',
     left: "var(--ds-space-negative-025, -2px)"

package/dist/esm/image-placer/containerWrapper.js

@@ -2,10 +2,12 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["width", "height", "margin", "children"];
 /**@jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { Box, xcss } from '@atlaskit/primitives';
 import { checkeredBg } from './styles';
 var containerWrapperStyles = xcss({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   background: "url('".concat(checkeredBg, "')"),
   position: "relative",
   cursor: "move",
@@ -19,7 +21,9 @@ export var ContainerWrapper = function ContainerWrapper(_ref) {
     children = _ref.children,
     props = _objectWithoutProperties(_ref, _excluded);
   var containerWrapperDimensions = xcss({
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     width: "".concat(width !== undefined ? width + margin * 2 : 0, "px"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     height: "".concat(height !== undefined ? height + margin * 2 : 0, "px")
   });
   return jsx(Box, _extends({

package/dist/esm/image-placer/imagePlacerErrorWrapper.js

@@ -1,9 +1,13 @@
 /**@jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { imagePlacerErrorWrapperStyles } from './styles';
 export var ImagePlacerErrorWrapper = function ImagePlacerErrorWrapper(_ref) {
   var children = _ref.children;
-  return jsx("div", {
-    css: imagePlacerErrorWrapperStyles
-  }, children);
+  return (
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    jsx("div", {
+      css: imagePlacerErrorWrapperStyles
+    }, children)
+  );
 };

package/dist/esm/image-placer/imageWrapper.js

@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["x", "y", "width", "height"];
 /**@jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { imageWrapperStyles } from './styles';
 export var ImageWrapper = function ImageWrapper(_ref) {
@@ -10,12 +11,15 @@ export var ImageWrapper = function ImageWrapper(_ref) {
     width = _ref.width,
     height = _ref.height,
     props = _objectWithoutProperties(_ref, _excluded);
-  return jsx("img", _extends({
-    css: imageWrapperStyles({
-      x: x,
-      y: y,
-      width: width,
-      height: height
-    })
-  }, props));
+  return (
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    jsx("img", _extends({
+      css: imageWrapperStyles({
+        x: x,
+        y: y,
+        width: width,
+        height: height
+      })
+    }, props))
+  );
 };

package/dist/esm/image-placer/index.js

@@ -11,6 +11,7 @@ import _regeneratorRuntime from "@babel/runtime/regenerator";
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /**@jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import React from 'react';
 import { Rectangle, Vector2, Bounds, dataURItoFile, getFileInfo, getFileInfoFromSrc } from '@atlaskit/media-ui';
@@ -503,31 +504,34 @@ export var ImagePlacer = /*#__PURE__*/function (_React$Component) {
         src = _this$state6.src;
       var imageBounds = this.imageBounds;
       var imgSrc = typeof src === 'string' ? src : undefined;
-      return jsx("div", {
-        css: imagePlacerWrapperStyles({
-          backgroundColor: backgroundColor
-        })
-      }, jsx(ImagePlacerContainer, {
-        width: containerWidth,
-        height: containerHeight,
-        margin: margin,
-        onDragStart: this.onDragStart,
-        onDragMove: this.onDragMove,
-        onWheel: this.onWheel
-      }, errorMessage ? jsx(ImagePlacerErrorWrapper, null, onRenderError ? onRenderError(errorMessage) : errorMessage) : jsx("div", null, jsx(ImagePlacerImage, {
-        src: imgSrc,
-        x: imageBounds.x,
-        y: imageBounds.y,
-        width: imageBounds.width,
-        height: imageBounds.height,
-        onLoad: this.onImageLoad,
-        onError: this.onImageError
-      }), jsx(Margin, {
-        width: containerWidth,
-        height: containerHeight,
-        circular: isCircular,
-        size: margin
-      }))));
+      return (
+        // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+        jsx("div", {
+          css: imagePlacerWrapperStyles({
+            backgroundColor: backgroundColor
+          })
+        }, jsx(ImagePlacerContainer, {
+          width: containerWidth,
+          height: containerHeight,
+          margin: margin,
+          onDragStart: this.onDragStart,
+          onDragMove: this.onDragMove,
+          onWheel: this.onWheel
+        }, errorMessage ? jsx(ImagePlacerErrorWrapper, null, onRenderError ? onRenderError(errorMessage) : errorMessage) : jsx("div", null, jsx(ImagePlacerImage, {
+          src: imgSrc,
+          x: imageBounds.x,
+          y: imageBounds.y,
+          width: imageBounds.width,
+          height: imageBounds.height,
+          onLoad: this.onImageLoad,
+          onError: this.onImageError
+        }), jsx(Margin, {
+          width: containerWidth,
+          height: containerHeight,
+          circular: isCircular,
+          size: margin
+        }))))
+      );
     }
   }]);
   return ImagePlacer;

package/dist/esm/image-placer/margin.js

@@ -7,6 +7,7 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /**@jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import React from 'react';
 import { marginWrapperSquareStyles, marginWrapperCircleStyles } from './styles';
@@ -29,6 +30,8 @@ export var Margin = /*#__PURE__*/function (_React$Component) {
         _ref2 = _slicedToArray(_ref, 2),
         id = _ref2[0],
         styles = _ref2[1];
+
+      // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
       return jsx("div", {
         css: styles({
           width: width,

package/dist/esm/image-placer/styles.js

@@ -1,12 +1,16 @@
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
 import { R500 } from '@atlaskit/theme/colors';
 export var checkeredBg = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAAXNSR0IArs4c6QAAAAlwSFlzAAALEwAACxMBAJqcGAAAA6hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IlhNUCBDb3JlIDUuNC4wIj4KICAgPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4KICAgICAgPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIKICAgICAgICAgICAgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIgogICAgICAgICAgICB4bWxuczp0aWZmPSJodHRwOi8vbnMuYWRvYmUuY29tL3RpZmYvMS4wLyIKICAgICAgICAgICAgeG1sbnM6ZXhpZj0iaHR0cDovL25zLmFkb2JlLmNvbS9leGlmLzEuMC8iPgogICAgICAgICA8eG1wOk1vZGlmeURhdGU+MjAxOC0xMC0zMFQxMjoxMDo5MjwveG1wOk1vZGlmeURhdGU+CiAgICAgICAgIDx4bXA6Q3JlYXRvclRvb2w+UGl4ZWxtYXRvciAzLjcuNTwveG1wOkNyZWF0b3JUb29sPgogICAgICAgICA8dGlmZjpPcmllbnRhdGlvbj4xPC90aWZmOk9yaWVudGF0aW9uPgogICAgICAgICA8dGlmZjpDb21wcmVzc2lvbj4wPC90aWZmOkNvbXByZXNzaW9uPgogICAgICAgICA8dGlmZjpSZXNvbHV0aW9uVW5pdD4yPC90aWZmOlJlc29sdXRpb25Vbml0PgogICAgICAgICA8dGlmZjpZUmVzb2x1dGlvbj43MjwvdGlmZjpZUmVzb2x1dGlvbj4KICAgICAgICAgPHRpZmY6WFJlc29sdXRpb24+NzI8L3RpZmY6WFJlc29sdXRpb24+CiAgICAgICAgIDxleGlmOlBpeGVsWERpbWVuc2lvbj4xMDwvZXhpZjpQaXhlbFhEaW1lbnNpb24+CiAgICAgICAgIDxleGlmOkNvbG9yU3BhY2U+MTwvZXhpZjpDb2xvclNwYWNlPgogICAgICAgICA8ZXhpZjpQaXhlbFlEaW1lbnNpb24+MTA8L2V4aWY6UGl4ZWxZRGltZW5zaW9uPgogICAgICA8L3JkZjpEZXNjcmlwdGlvbj4KICAgPC9yZGY6UkRGPgo8L3g6eG1wbWV0YT4KX+XPjwAAACtJREFUGBljPHv27H8GNGBsbMyIJsTAhC6Aiz+ACjEcDXIjNg8OoBuJthoAzy0HeT3Qcc0AAAAASUVORK5CYII=';
 export var imagePlacerWrapperStyles = function imagePlacerWrapperStyles(props) {
   return css({
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     backgroundColor: props.backgroundColor,
     display: 'inline-block'
   });
 };
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var imagePlacerErrorWrapperStyles = css({
   backgroundColor: "var(--ds-background-danger-bold, ".concat(R500, ")"),
   color: "var(--ds-text-inverse, white)",
@@ -24,10 +28,15 @@ export var imageWrapperStyles = function imageWrapperStyles(_ref) {
     height = _ref.height,
     transform = _ref.transform;
   return css({
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     left: "".concat(x, "px"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     top: "".concat(y, "px"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     width: "".concat(width, "px"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     height: "".concat(height, "px"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     transform: transform,
     position: 'absolute',
     transition: "margin-left ".concat(EASING, "s ease-out, margin-top ").concat(EASING, "s ease-out, left ").concat(EASING, "s ease-out, top ").concat(EASING, "s ease-out, width ").concat(EASING, "s ease-out, height ").concat(EASING, "s ease-out"),
@@ -45,8 +54,11 @@ export var marginWrapperSquareStyles = function marginWrapperSquareStyles(_ref2)
     top: 0,
     borderStyle: 'solid',
     borderColor: "var(--ds-surface-overlay, rgba(255, 255, 255))",
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     borderWidth: "".concat(size, "px"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     width: "".concat(width, "px"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     height: "".concat(height, "px"),
     opacity: "var(--ds-opacity-disabled, 0.3)"
   });
@@ -60,15 +72,22 @@ export var marginWrapperCircleStyles = function marginWrapperCircleStyles(_ref3)
     overflow: 'hidden',
     left: '0px',
     top: '0px',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     width: "".concat(width + size * 2, "px"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     height: "".concat(height + size * 2, "px"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
     '&:after': {
       content: "''",
       position: 'absolute',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
       left: "".concat(size, "px"),
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
       top: "".concat(size, "px"),
       borderRadius: '100%',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
       width: "".concat(width, "px"),
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
       height: "".concat(height, "px"),
       boxShadow: "0px 0px 0px ".concat(Math.max(width, height), "px ", "var(--ds-surface-overlay, rgba(255, 255, 255))"),
       opacity: "var(--ds-opacity-disabled, 0.3)"

package/dist/esm/predefined-avatar-list/index.js

@@ -1,4 +1,5 @@
 /**@jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { AvatarList } from '../avatar-list';
 import EditorMoreIcon from '@atlaskit/icon/glyph/editor/more';
@@ -15,24 +16,27 @@ export var PredefinedAvatarList = function PredefinedAvatarList(_ref) {
     selectAvatarLabel = _ref.selectAvatarLabel,
     showMoreAvatarsButtonLabel = _ref.showMoreAvatarsButtonLabel;
   var intl = useIntl();
-  return jsx("div", {
-    css: predefinedAvatarsWrapperStyles,
-    id: "predefined-avatar-wrapper"
-  }, jsx(AvatarList, {
-    avatars: avatars,
-    selectedAvatar: selectedAvatar,
-    onItemClick: onAvatarSelected,
-    selectAvatarLabel: selectAvatarLabel
-  }), jsx(Button, {
-    "aria-label": showMoreAvatarsButtonLabel || intl.formatMessage(messages.show_more_avatars_btn_label)
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    ,
-    className: "show-more-button",
-    appearance: "subtle",
-    iconAfter: jsx(EditorMoreIcon, {
-      label: "",
-      size: "large"
-    }),
-    onClick: onShowMore
-  }));
+  return (
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    jsx("div", {
+      css: predefinedAvatarsWrapperStyles,
+      id: "predefined-avatar-wrapper"
+    }, jsx(AvatarList, {
+      avatars: avatars,
+      selectedAvatar: selectedAvatar,
+      onItemClick: onAvatarSelected,
+      selectAvatarLabel: selectAvatarLabel
+    }), jsx(Button, {
+      "aria-label": showMoreAvatarsButtonLabel || intl.formatMessage(messages.show_more_avatars_btn_label)
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      ,
+      className: "show-more-button",
+      appearance: "subtle",
+      iconAfter: jsx(EditorMoreIcon, {
+        label: "",
+        size: "large"
+      }),
+      onClick: onShowMore
+    }))
+  );
 };

package/dist/esm/predefined-avatar-list/styles.js

@@ -1,7 +1,8 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject;
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
 import { visuallyHiddenRadioStyles, selectedShadow, focusedShadow } from '../styles';
 
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var predefinedAvatarsWrapperStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\tdisplay: flex;\n\n\tinput {\n\t\t", "\n\t}\n\n\tinput:checked + img {\n\t\t", "\n\t}\n\n\tinput:focus + img {\n\t\t", "\n\t}\n\n\t.show-more-button {\n\t\twidth: 40px;\n\t\theight: 40px;\n\t\tborder-radius: ", ";\n\n\t\talign-items: center;\n\t\tjustify-content: center;\n\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t}\n"])), visuallyHiddenRadioStyles, selectedShadow, focusedShadow, "var(--ds-border-radius-circle, 50%)");

package/dist/esm/predefined-avatar-view/index.js

@@ -1,4 +1,5 @@
 /**@jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { FormattedMessage, useIntl } from 'react-intl-next';
 import { messages } from '@atlaskit/media-ui';
@@ -38,27 +39,30 @@ export var PredefinedAvatarView = function PredefinedAvatarView(_ref) {
       alt: ""
     }));
   });
-  return jsx("div", {
-    css: predefinedAvatarViewWrapperStyles,
-    id: "predefined-avatar-view-wrapper"
-  }, jsx("div", {
-    className: "header"
-  }, jsx(Button, {
-    "aria-label": intl.formatMessage(messages.avatar_picker_back_btn_label)
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    ,
-    className: "back-button",
-    iconAfter: jsx(ArrowLeftIcon, {
-      label: ""
-    }),
-    onClick: onGoBack
-  }), jsx("h2", {
-    className: "description"
-  }, predefinedAvatarsText || jsx(FormattedMessage, messages.default_avatars))), jsx("div", {
-    role: "radiogroup",
-    "aria-label": selectAvatarLabel || intl.formatMessage(messages.select_an_avatar)
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    ,
-    className: "body"
-  }, cards));
+  return (
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    jsx("div", {
+      css: predefinedAvatarViewWrapperStyles,
+      id: "predefined-avatar-view-wrapper"
+    }, jsx("div", {
+      className: "header"
+    }, jsx(Button, {
+      "aria-label": intl.formatMessage(messages.avatar_picker_back_btn_label)
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      ,
+      className: "back-button",
+      iconAfter: jsx(ArrowLeftIcon, {
+        label: ""
+      }),
+      onClick: onGoBack
+    }), jsx("h2", {
+      className: "description"
+    }, predefinedAvatarsText || jsx(FormattedMessage, messages.default_avatars))), jsx("div", {
+      role: "radiogroup",
+      "aria-label": selectAvatarLabel || intl.formatMessage(messages.select_an_avatar)
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      ,
+      className: "body"
+    }, cards))
+  );
 };

package/dist/esm/predefined-avatar-view/styles.js

@@ -1,10 +1,16 @@
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
 import { visuallyHiddenRadioStyles, selectedShadow, focusedShadow, avatarImageStyles } from '../styles';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
 export var largeAvatarImageStyles = css(avatarImageStyles, {
   width: '72px',
   height: '72px'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var predefinedAvatarViewWrapperStyles = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '.body': {
     display: 'flex',
     flexFlow: 'row wrap',
@@ -14,26 +20,33 @@ export var predefinedAvatarViewWrapperStyles = css({
     padding: "var(--ds-space-100, 8px)".concat(" 0 0"),
     margin: 0
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   input: visuallyHiddenRadioStyles,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   'input:checked + img': selectedShadow,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   'input:focus + img': focusedShadow,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   label: {
     paddingRight: "var(--ds-space-050, 4px)",
     paddingLeft: "var(--ds-space-050, 4px)",
     paddingBottom: "var(--ds-space-100, 8px)",
     display: 'inline-flex'
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '.header': {
     display: 'flex',
     alignItems: 'center',
     paddingTop: "var(--ds-space-050, 4px)",
     paddingBottom: "var(--ds-space-100, 8px)",
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '.description': {
       paddingLeft: "var(--ds-space-100, 8px)",
       margin: 0,
       fontSize: '14px',
       fontWeight: 400
     },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '.back-button': {
       width: '32px',
       height: '32px',

package/dist/esm/styles.js

@@ -1,9 +1,14 @@
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
 import { B200, B100 } from '@atlaskit/theme/colors';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var avatarImageStyles = css({
   borderRadius: "var(--ds-border-radius-100, 3px)",
   cursor: 'pointer'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var visuallyHiddenRadioStyles = css({
   width: '1px',
   height: '1px',
@@ -14,9 +19,13 @@ export var visuallyHiddenRadioStyles = css({
   overflow: 'hidden',
   whiteSpace: 'nowrap'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var selectedShadow = css({
   boxShadow: "0px 0px 0px 1px ".concat("var(--ds-border-inverse, white)", ", 0px 0px 0px 3px ", "var(--ds-border-selected, ".concat(B200, ")"))
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var focusedShadow = css({
   boxShadow: "0px 0px 0px 1px ".concat("var(--ds-border-inverse, white)", ", 0px 0px 0px 3px ", "var(--ds-border-focused, ".concat(B100, ")"))
 });

package/dist/types/image-cropper/index.d.ts

@@ -1,5 +1,3 @@
-/** @jsx jsx */
-import { jsx } from '@emotion/react';
 import React from 'react';
 import { Component } from 'react';
 import { type WrappedComponentProps } from 'react-intl-next';
@@ -27,7 +25,7 @@ export declare class ImageCropper extends Component<ImageCropperProp & WrappedCo
     componentDidMount(): void;
     onDragStarted: (e: React.MouseEvent<{}>) => void;
     onImageError: () => void;
-    render(): jsx.JSX.Element | null;
+    render(): JSX.Element | null;
 }
 declare const _default: React.FC<ImageCropperProp>;
 export default _default;

package/dist/types-ts4.5/image-cropper/index.d.ts

@@ -1,5 +1,3 @@
-/** @jsx jsx */
-import { jsx } from '@emotion/react';
 import React from 'react';
 import { Component } from 'react';
 import { type WrappedComponentProps } from 'react-intl-next';
@@ -27,7 +25,7 @@ export declare class ImageCropper extends Component<ImageCropperProp & WrappedCo
     componentDidMount(): void;
     onDragStarted: (e: React.MouseEvent<{}>) => void;
     onImageError: () => void;
-    render(): jsx.JSX.Element | null;
+    render(): JSX.Element | null;
 }
 declare const _default: React.FC<ImageCropperProp>;
 export default _default;

package/example-helpers/StatefulAvatarPickerDialog.tsx

@@ -1,6 +1,7 @@
 /**@jsx jsx */
 /* eslint-disable no-console */
 import React, { type ReactNode } from 'react';
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import Button from '@atlaskit/button/standard-button';
 import { ModalTransition } from '@atlaskit/modal-dialog';
@@ -162,6 +163,7 @@ export default class StatefulAvatarPickerDialog extends React.Component<
 		const { requireAltText } = this.props;
 
 		return (
+			// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
 			<div css={layoutStyles}>
 				<Button appearance="primary" onClick={this.openPicker}>
 					Open sesame!